/* TeachBD Platform — front-end & admin shared styles */
@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,400;600&family=Space+Mono:wght@400;700&family=Work+Sans:wght@400;500;600;700&display=swap');

.teachbd-form-wrap, .teachbd-dashboard, .teachbd-browse {
	max-width: 880px;
	margin: 0 auto;
	font-family: 'Work Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
	color: #100e29;
}

.teachbd-form-wrap {
	background: #fff;
	border-radius: 20px;
	padding: clamp(24px, 4vw, 44px);
	box-shadow: 0 4px 24px -8px rgba(58,45,151,0.1);
	border: 1px solid #ece8fb;
}
.teachbd-form-wrap > h2 {
	font-family: 'Fraunces', serif; font-weight: 600; font-size: 26px; color: #100e29; margin: 0 0 22px;
}
/* v-new — "in the tutor/guardian registration side there is not back
   to home button or to previous page." Sits above everything else in
   the card, including the language toggle, so it's the first thing
   visible regardless of scroll position on a long form. */
.teachbd-frm-back-home {
	display: inline-flex; align-items: center; gap: 6px;
	font-size: 13px; font-weight: 600; color: #6f6e85; text-decoration: none;
	margin-bottom: 14px;
}
.teachbd-frm-back-home:hover { color: #3a2d97; }
.teachbd-form-intro {
	background: #faf9ff; border: 1px solid #ece8fb; border-radius: 12px; padding: 14px 18px;
	font-size: 13px; color: #6f6e85; line-height: 1.6; margin: -8px 0 26px;
}
.teachbd-form h3 {
	font-family: 'Fraunces', serif; font-weight: 600; font-size: 17px; color: #3a2d97;
	margin: 30px 0 14px; padding-top: 22px; border-top: 1px solid #ece8fb;
}
.teachbd-form h3:first-of-type { padding-top: 0; border-top: none; margin-top: 0; }

.teachbd-form label {
	display: block;
	margin-bottom: 14px;
	font-weight: 600;
	font-size: 13.5px;
	color: #46455c;
}

.teachbd-form input[type=text],
.teachbd-form input[type=email],
.teachbd-form input[type=password],
.teachbd-form input[type=date],
.teachbd-form input[type=number],
.teachbd-form input[type=file],
.teachbd-form input[type=tel],
.teachbd-form select,
.teachbd-form textarea {
	display: block;
	width: 100%;
	margin-top: 7px;
	padding: 11px 14px;
	border: 1.5px solid #e3def7;
	border-radius: 10px;
	font-size: 14px;
	font-weight: 400;
	font-family: inherit;
	color: #100e29;
	background: #faf9ff;
	box-sizing: border-box;
	transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}
.teachbd-form input:focus,
.teachbd-form select:focus,
.teachbd-form textarea:focus {
	outline: none; border-color: #5b46d6; background: #fff;
	box-shadow: 0 0 0 3px rgba(91,70,214,0.12);
}
.teachbd-form input:disabled { background: #f0f0f2; color: #8a8a99; }

.teachbd-help {
	display: block; font-size: 11.5px; color: #8a7fb0; margin-top: 5px; font-weight: 400;
}

/* v-new — file-upload advisory + oversized-file warning (see teachbd.js). */
.teachbd-upload-hint {
	display: block; font-size: 11.5px; color: #8a7fb0; margin-top: 4px; font-weight: 400;
}
.teachbd-upload-warn {
	display: block; font-size: 12px; color: #b32d2e; margin-top: 5px; font-weight: 600;
}
.teachbd-upload-banner {
	position: fixed; top: 0; left: 0; right: 0; z-index: 99999;
	display: flex; align-items: center; gap: 10px;
	background: #100e29; color: #fff; padding: 12px 18px;
	font-size: 13px; line-height: 1.5; box-shadow: 0 2px 10px rgba(0,0,0,.2);
}
.teachbd-upload-banner strong { color: #ffd166; }
.teachbd-upload-banner-spinner {
	flex: 0 0 auto; width: 16px; height: 16px; border-radius: 50%;
	border: 2px solid rgba(255,255,255,.3); border-top-color: #fff;
	animation: teachbd-spin 0.8s linear infinite;
}
@keyframes teachbd-spin { to { transform: rotate(360deg); } }
@media (max-width: 560px) { .teachbd-upload-banner { font-size: 12px; padding: 10px 14px; } }

.teachbd-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
@media (max-width: 560px) { .teachbd-form-row { grid-template-columns: 1fr; } }

.teachbd-phone-field { display: flex; gap: 8px; margin-top: 7px; }
.teachbd-phone-prefix {
	flex-shrink: 0; display: flex; align-items: center; padding: 0 12px;
	background: #ece8fb; border: 1.5px solid #e3def7; border-radius: 10px;
	font-size: 13.5px; font-weight: 700; color: #3a2d97;
}
.teachbd-phone-field input { margin-top: 0; }

.teachbd-checkgroup {
	border: 1.5px solid #ece8fb; border-radius: 12px; padding: 14px 16px 8px; margin-bottom: 16px;
	display: flex; flex-wrap: wrap; gap: 6px 16px; background: #faf9ff;
}
.teachbd-checkgroup legend { font-weight: 700; font-size: 12.5px; padding: 0 6px; color: #3a2d97; text-transform: uppercase; letter-spacing: 0.3px; }
.teachbd-checkgroup label {
	display: inline-flex; align-items: center; gap: 6px; font-weight: 400; font-size: 13px;
	margin-bottom: 8px; width: auto; padding: 4px 10px 4px 4px; border-radius: 8px; transition: background 0.15s ease;
}
.teachbd-checkgroup label:hover { background: #ece8fb; }
.teachbd-checkgroup input[type=checkbox] { width: auto; margin: 0; accent-color: #5b46d6; }
.teachbd-checkbox-inline { display: flex; align-items: center; gap: 8px; font-weight: 400; }
.teachbd-checkbox-inline input { width: auto; margin: 0; }

.teachbd-edu-row {
	display: grid;
	grid-template-columns: 2fr 2fr 1fr;
	gap: 8px;
	margin-bottom: 8px;
}
.teachbd-edu-row input { margin-top: 0; }

/* v4.2 — salary breakdown: flat fee vs. price per subject */
.teachbd-radiogroup {
	border: 1.5px solid #ece8fb; border-radius: 12px; padding: 14px 16px; margin-bottom: 12px;
	display: flex; flex-wrap: wrap; gap: 6px 20px; background: #faf9ff;
}
.teachbd-radiogroup legend { font-weight: 700; font-size: 12.5px; padding: 0 6px; color: #3a2d97; text-transform: uppercase; letter-spacing: 0.3px; }
.teachbd-radiogroup label { display: inline-flex; align-items: center; gap: 6px; font-weight: 400; font-size: 13.5px; width: auto; }
.teachbd-radiogroup input[type=radio] { width: auto; margin: 0; accent-color: #5b46d6; }
.teachbd-pricing-field { margin-bottom: 16px; }
.teachbd-subject-price-rows { display: flex; flex-direction: column; gap: 8px; }
.teachbd-subject-price-row {
	display: flex; align-items: center; justify-content: space-between; gap: 12px;
	background: #faf9ff; border: 1.5px solid #ece8fb; border-radius: 10px; padding: 8px 12px;
}
.teachbd-subject-price-label { font-size: 13.5px; font-weight: 600; color: #3a2d97; }
.teachbd-subject-price-row input { margin-top: 0; max-width: 140px; }
.teachbd-subject-price-empty { margin: 6px 0 0; }

.teachbd-help { font-size: 13px; color: #666; margin-top: -6px; margin-bottom: 12px; }

.teachbd-btn {
	background: #3a2d97;
	color: #fff;
	border: none;
	padding: 11px 22px;
	border-radius: 999px;
	cursor: pointer;
	font-weight: 700;
	font-size: 14px;
	transition: background 0.15s ease, transform 0.1s ease;
}
.teachbd-btn:hover { background: #5b46d6; transform: translateY(-1px); }
.teachbd-btn-muted { background: #8a8a99; }
.teachbd-btn-muted:hover { background: #6f6e85; transform: none; }
.teachbd-btn-small { padding: 7px 16px; font-size: 12.5px; }

.teachbd-notice {
	padding: 12px 16px;
	border-radius: 6px;
	margin-bottom: 16px;
	font-size: 14px;
}
.teachbd-notice-success, .teachbd-notice-teacher_success, .teachbd-notice-guardian_success {
	background: #e4f6ec; color: #146c43; border: 1px solid #b9e8cf;
}
.teachbd-notice-error { background: #fde7e9; color: #9b1c24; border: 1px solid #f6c0c5; }
.teachbd-notice-neutral { background: #fff8ec; color: #7a5b13; border: 1px solid #f0d68a; line-height: 1.55; }

.teachbd-filter-bar { display: flex; gap: 10px; margin-bottom: 20px; flex-wrap: wrap; }
.teachbd-filter-bar input, .teachbd-filter-bar select {
	padding: 9px 12px; border: 1px solid #d3d8de; border-radius: 6px;
}

.teachbd-teacher-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
	gap: 18px;
}
.teachbd-teacher-card {
	border: 1px solid #e2e6ea;
	border-radius: 10px;
	padding: 16px;
	position: relative;
	background: #fff;
}
.teachbd-teacher-card.is-featured { border-color: #e0b341; box-shadow: 0 0 0 2px #fbeec3 inset; }
.teachbd-avatar { width: 64px; height: 64px; border-radius: 50%; object-fit: cover; margin-bottom: 8px; }
.teachbd-match-score { font-weight: 700; color: #1d6f5e; }
.teachbd-bio { font-size: 13px; color: #555; }

.teachbd-badge {
	display: inline-block;
	font-size: 11px;
	font-weight: 700;
	padding: 3px 8px;
	border-radius: 4px;
	margin-bottom: 6px;
	margin-right: 4px;
}
.teachbd-badge-featured { background: #fbeec3; color: #8a6500; }
.teachbd-badge-hired { background: #dbeafe; color: #1d4ed8; }

/* v-new -- admin Matchings page toolbar + bulk-action controls */
.teachbd-match-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; background: #fff; border: 1px solid #ccd0d4; border-radius: 8px; padding: 12px 16px; margin-bottom: 14px; }
.teachbd-match-search { min-width: 240px; }
.teachbd-match-toggle-label { display: flex; align-items: center; gap: 6px; font-weight: 600; }
.teachbd-match-stats { margin-left: auto; color: #6f6e85; font-size: 13px; }
.teachbd-match-guardian-prefs { font-weight: 400; color: #6f6e85; font-size: 13px; margin-left: 8px; }
.teachbd-match-guardian.teachbd-match-hidden-by-filter { display: none; }
.teachbd-match-actions-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin: 4px 0 12px; }
.teachbd-match-select-all { font-weight: 600; }
.teachbd-match-compare-panel { background: #f8f7fc; border: 1px solid #ddd8f3; border-radius: 6px; padding: 12px 16px; margin-bottom: 14px; }
.teachbd-match-compare-panel table { width: 100%; border-collapse: collapse; }
.teachbd-match-compare-panel th, .teachbd-match-compare-panel td { text-align: left; padding: 6px 10px; border-bottom: 1px solid #e5e1f7; font-size: 13px; }
.teachbd-match-compare-panel th:first-child, .teachbd-match-compare-panel td:first-child { color: #6f6e85; font-weight: 600; white-space: nowrap; }

.teachbd-panel {
	border: 1px solid #ece9f7;
	border-radius: 14px;
	padding: 22px 24px;
	margin-bottom: 22px;
	background: #ffffff;
	box-shadow: 0 4px 18px -6px rgba(58,45,151,0.08);
}
.teachbd-panel h3 { font-family: 'Fraunces', serif; font-weight: 600; color: #100e29; margin: 0 0 14px; line-height: 1.35; }

.teachbd-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.teachbd-table th, .teachbd-table td { padding: 11px 12px; border-bottom: 1px solid #e8eaed; text-align: left; line-height: 1.5; }

/* v-fix — receipt "View / Print" link previously used a generic
   ".button" class this plugin never styles, so it fell through to
   whatever the active theme's own global button style happened to be
   (often oversized, mismatched color, icon/text overlapping). Scoped,
   compact styling that matches the rest of the portal instead. */
.teachbd-receipt-btn {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	white-space: nowrap;
	background: #f4f2fc;
	color: #3a2d97;
	border: 1px solid #ded9f7;
	border-radius: 7px;
	padding: 5px 11px;
	font-size: 12px;
	font-weight: 600;
	text-decoration: none;
	line-height: 1.4;
}
.teachbd-receipt-btn:hover { background: #ded9f7; color: #201a5c; }
/* v-fix — the receipt toggle is a <button> (the print link stays an
   <a>), and buttons are exactly what the theme's global reset broke on
   the notification bell above — same defensive hardening here so this
   one doesn't silently regress the same way. */
button.teachbd-receipt-btn {
	all: unset !important;
	box-sizing: border-box !important;
	display: inline-flex !important; align-items: center !important; gap: 5px !important;
	white-space: nowrap !important; background: #f4f2fc !important; color: #3a2d97 !important;
	border: 1px solid #ded9f7 !important; border-radius: 7px !important; padding: 5px 11px !important;
	font-size: 12px !important; font-weight: 600 !important; cursor: pointer !important;
	font-family: inherit !important; line-height: 1.4 !important;
}
button.teachbd-receipt-btn:hover { background: #ded9f7 !important; color: #201a5c !important; }

/* v-fix — inline receipt accordion ("make the receipt into a tab, upon
   pressing it expands with all details"). Row is rendered server-side
   right after its booking row, hidden by default; JS just toggles it. */
.teachbd-receipt-detail td { padding: 0 !important; border-bottom: 1px solid #e8eaed; }
.teachbd-receipt-detail-inner {
	background: #faf9ff; border-radius: 10px; margin: 8px; padding: 16px 20px;
	border: 1px solid #e3def7;
}
/* v4.9.35 — clean white capture area for the PNG download button */
.teachbd-receipt-capture { background: #fff; border-radius: 8px; padding: 14px 16px; }
.teachbd-receipt-detail-head {
	display: flex; align-items: center; justify-content: space-between;
	margin-bottom: 12px; font-size: 14px; color: #100e29;
}
.teachbd-receipt-detail-grid {
	display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
	gap: 10px 24px; margin-bottom: 14px;
}
.teachbd-receipt-detail-grid > div { display: flex; flex-direction: column; gap: 2px; }
.teachbd-receipt-detail-grid span { font-size: 11.5px; color: #6f6e85; }
.teachbd-receipt-detail-grid strong { font-size: 13.5px; color: #100e29; }

.teachbd-status-pill {
	display: inline-block;
	padding: 2px 9px;
	border-radius: 12px;
	font-size: 11px;
	font-weight: 700;
	background: #eee;
	color: #444;
	text-transform: capitalize;
}
.teachbd-status-active, .teachbd-status-fee_verified, .teachbd-status-confirmed, .teachbd-status-verified, .teachbd-status-approved, .teachbd-status-fulfilled, .teachbd-status-open, .teachbd-status-converted { background: #e4f6ec; color: #146c43; }
.teachbd-status-new, .teachbd-status-requested, .teachbd-status-matched { background: #dbeafe; color: #1d4ed8; }
.teachbd-status-fee_pending, .teachbd-status-fee_submitted, .teachbd-status-pending, .teachbd-status-partially_confirmed, .teachbd-status-pending_fee { background: #fff4d6; color: #946200; }
.teachbd-status-missed, .teachbd-status-rejected, .teachbd-status-cancelled, .teachbd-status-declined { background: #fde7e9; color: #9b1c24; }
.teachbd-status-contacted, .teachbd-status-admin_invited, .teachbd-status-teacher_accepted { background: #ece8fb; color: #3a2d97; }

.teachbd-invite-card, .teachbd-fee-card, .teachbd-active-card {
	border: 1px solid #e2e6ea;
	border-radius: 8px;
	padding: 16px;
	margin-bottom: 14px;
	background: #fff;
}
/* v-new — "the writings inside the plugin is too close to one another."
   These cards had no line-height or spacing rules of their own, so
   text fell back to browser defaults, which read as cramped once a
   card had several stacked lines (contact details, schedule, status).
   Purely additive spacing — no layout structure changes. */
.teachbd-invite-card p, .teachbd-fee-card p, .teachbd-active-card p {
	line-height: 1.65; margin: 0 0 10px;
}
.teachbd-invite-card h4, .teachbd-fee-card h4, .teachbd-active-card h4 {
	margin: 0 0 12px;
}
.teachbd-invite-card h5, .teachbd-fee-card h5, .teachbd-active-card h5 {
	margin: 18px 0 10px;
}
.teachbd-schedule-list {
	display: flex; flex-direction: column; gap: 8px; margin: 0 0 14px;
}
.teachbd-schedule-slot {
	display: flex; align-items: center; gap: 10px;
	padding: 8px 12px; background: #f7f7fb; border-radius: 8px; font-size: 13px;
}
.teachbd-schedule-day { font-weight: 600; color: #100e29; min-width: 90px; }
.teachbd-schedule-time { color: #6f6e85; }

/* v4.0 — guardian "rate this teacher" box inside an active booking card */
.teachbd-rate-teacher-box {
	margin-top: 14px;
	padding: 12px 14px;
	background: #fffbeb;
	border: 1px solid #fde68a;
	border-radius: 8px;
}
.teachbd-rate-teacher-box h5 { margin: 0 0 4px; }
.teachbd-rate-teacher-note { margin: 0 0 8px; font-size: 12px; color: #92400e; }
.teachbd-rate-teacher-box select,
.teachbd-rate-teacher-box textarea {
	display: block;
	width: 100%;
	margin-bottom: 8px;
	padding: 6px 8px;
	border: 1px solid #e2e6ea;
	border-radius: 6px;
	font-size: 13px;
}

.teachbd-admin-stats { display: flex; gap: 16px; margin: 16px 0 24px; }
.teachbd-stat-box {
	background: #fff;
	border: 1px solid #e2e6ea;
	border-radius: 8px;
	padding: 16px 22px;
	text-align: center;
}
.teachbd-stat-box strong { display: block; font-size: 26px; color: #1d6f5e; }
.teachbd-stat-box span { font-size: 12px; color: #666; }

/* =====================================================================
   PUBLIC DISCOVERY — featured carousel + teacher profile page
   Scoped under .teachbd-discovery / .teachbd-profile-page so none of
   this touches the plainer logged-in dashboard styles above.
===================================================================== */
.teachbd-discovery, .teachbd-profile-page {
	font-family: 'Work Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
	color: #100e29;
	max-width: 1160px;
	margin: 0 auto;
}
.teachbd-empty { color: #6f6e85; font-size: 14px; padding: 30px 0; text-align: center; }

/* ── Subject filter rail ─────────────────────────────────────────── */
.teachbd-subject-rail {
	position: relative;
	display: flex;
	gap: 8px;
	overflow-x: auto;
	padding-bottom: 16px;
	margin-bottom: 32px;
	border-bottom: 1.5px solid #e8e4f5;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none;
}
.teachbd-subject-rail::-webkit-scrollbar { display: none; }
.teachbd-subject-pill {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	gap: 7px;
	background: #fff;
	color: #4b3eaa;
	border: 1.5px solid #d5cff5;
	font-size: 13px;
	font-weight: 600;
	padding: 8px 16px;
	border-radius: 999px;
	cursor: pointer;
	white-space: nowrap;
	transition: background .18s, color .18s, border-color .18s, box-shadow .18s, transform .15s;
}
.teachbd-subject-pill:hover {
	background: #f0eeff;
	border-color: #a99de8;
	transform: translateY(-1px);
}
.teachbd-subject-pill.is-active {
	background: #3a2d97;
	color: #fff;
	border-color: #3a2d97;
	box-shadow: 0 4px 14px -4px rgba(58,45,151,.45);
}
.teachbd-subject-count {
	background: rgba(255,255,255,.22);
	border-radius: 999px;
	font-size: 10.5px;
	padding: 1px 7px;
	font-weight: 700;
}
.teachbd-subject-pill:not(.is-active) .teachbd-subject-count {
	background: #ede9fb;
	color: #3a2d97;
}

.teachbd-subject-panel { display: none; }
.teachbd-subject-panel.is-active { display: block; animation: tbd-fade-in .22s ease; }
@keyframes tbd-fade-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } }

/* ── Tutor card grid ─────────────────────────────────────────────── */
.ee-tutor-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 22px;
	width: 100%;
	box-sizing: border-box;
	align-items: start;
}
@media (max-width: 960px) { .ee-tutor-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 580px)  { .ee-tutor-grid { grid-template-columns: 1fr; gap: 16px; } }

/* ── Individual tutor card ───────────────────────────────────────── */
.ee-tutor-card {
	position: relative;
	background: #fff;
	border: 1.5px solid #e8e4f5;
	border-radius: 20px;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	box-shadow: 0 2px 12px -4px rgba(16,14,41,.10), 0 1px 3px rgba(0,0,0,.04);
	transition: transform .22s cubic-bezier(.34,1.3,.64,1), box-shadow .22s ease, border-color .2s;
	box-sizing: border-box;
	min-width: 0;
}
.ee-tutor-card:hover {
	transform: translateY(-5px);
	box-shadow: 0 16px 40px -10px rgba(58,45,151,.22), 0 2px 8px rgba(0,0,0,.05);
	border-color: #c4bbee;
}
.ee-tutor-card.is-premium {
	border-color: #9b82f3;
	background: linear-gradient(175deg, #faf8ff 0%, #fff 60%);
}
.ee-tutor-card.is-featured {
	border-color: #2bab97;
}
.ee-tutor-card.is-hired {
	border-color: #f0c93a;
}

/* Top accent bar */
.ee-tc-accent {
	height: 4px;
	background: linear-gradient(90deg, #5b46d6, #9b82f3);
	flex-shrink: 0;
}
.ee-tutor-card.is-featured .ee-tc-accent {
	background: linear-gradient(90deg, #1f9c8c, #2bca7d);
}
.ee-tutor-card.is-hired .ee-tc-accent {
	background: linear-gradient(90deg, #f0a030, #f0c93a);
}

/* ── Modal-trigger body button ───────────────────────────────────── */
.ee-tc-body {
	display: flex;
	flex-direction: column;
	text-align: left;
	padding: 20px 20px 16px;
	flex: 1;
	cursor: pointer;
	background: transparent;
	border: none;
	font-family: inherit;
	width: 100%;
	color: inherit;
	gap: 0;
}

/* ── Header: avatar + identity ───────────────────────────────────── */
.ee-tc-header {
	display: flex;
	gap: 14px;
	align-items: flex-start;
	margin-bottom: 16px;
}
.ee-tc-avatar-wrap {
	position: relative;
	flex-shrink: 0;
}
.ee-tc-avatar {
	width: 72px;
	height: 72px;
	border-radius: 16px;
	object-fit: cover;
	border: 2px solid #ece8fb;
	display: block;
}
.ee-tutor-card.is-premium .ee-tc-avatar  { border-color: #c4b5fd; }
.ee-tutor-card.is-featured .ee-tc-avatar { border-color: #a7f3d0; }

/* Verified tick badge overlaid on avatar */
.ee-tc-verified-tick {
	position: absolute;
	bottom: -4px;
	right: -4px;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background: #1f9c8c;
	color: #fff;
	font-size: 11px;
	font-weight: 700;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 2px solid #fff;
	line-height: 1;
}

/* Identity: name, tagline, edu */
.ee-tc-identity {
	min-width: 0;
	flex: 1;
}
.ee-tc-badges {
	display: flex;
	gap: 5px;
	flex-wrap: wrap;
	margin-bottom: 6px;
}
.ee-tc-badge {
	display: inline-block;
	font-size: 10px;
	font-weight: 800;
	letter-spacing: .04em;
	text-transform: uppercase;
	padding: 2px 8px;
	border-radius: 999px;
}
.ee-tc-badge-premium {
	background: linear-gradient(90deg, #ede8ff, #e0d9ff);
	color: #4b3eaa;
}
.ee-tc-badge-hired {
	background: #fff8e0;
	color: #92550a;
}
.ee-tc-name {
	font-family: 'Fraunces', serif;
	font-size: 17px;
	font-weight: 700;
	color: #100e29;
	margin: 0 0 3px;
	line-height: 1.25;
	overflow-wrap: break-word;
}
.ee-tc-tagline {
	font-size: 11.5px;
	font-weight: 600;
	color: #5b46d6;
	margin: 0 0 5px;
	line-height: 1.3;
	overflow-wrap: break-word;
}
.ee-tc-edu {
	font-size: 11.5px;
	color: #6f6e85;
	margin: 0;
	display: flex;
	gap: 4px;
	align-items: baseline;
	line-height: 1.45;
	overflow-wrap: break-word;
}
.ee-tc-edu-icon { flex-shrink: 0; }

/* ── Subject chips ───────────────────────────────────────────────── */
.ee-tc-subjects {
	display: flex;
	flex-wrap: wrap;
	gap: 5px;
	margin-bottom: 14px;
}
.ee-tc-subj {
	display: inline-block;
	font-size: 11px;
	font-weight: 700;
	color: #3a2d97;
	background: #edeafc;
	border: 1px solid #d5cff5;
	border-radius: 6px;
	padding: 3px 9px;
	letter-spacing: .01em;
	white-space: nowrap;
}
.ee-tc-subj-more {
	background: #f5f5f8;
	color: #8a84a8;
	border-color: #e2e2e9;
}

/* ── Fact items row ──────────────────────────────────────────────── */
.ee-tc-facts {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 14px;
	margin-bottom: 16px;
}
.ee-tc-fact {
	display: flex;
	align-items: center;
	gap: 4px;
	font-size: 12px;
	color: #6f6e85;
}
.ee-tc-fact-icon { font-size: 13px; line-height: 1; }
.ee-tc-fact-text { font-weight: 500; }

/* ── Price + CTA bottom strip ────────────────────────────────────── */
.ee-tc-bottom {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-top: auto;
	padding-top: 14px;
	border-top: 1px solid #f0eeff;
	width: 100%;
	gap: 8px;
}
.ee-tc-price {
	display: flex;
	align-items: baseline;
	gap: 2px;
}
.ee-tc-price-amount {
	font-size: 18px;
	font-weight: 800;
	color: #3a2d97;
	font-variant-numeric: tabular-nums;
}
.ee-tc-price-suffix {
	font-size: 12px;
	font-weight: 600;
	color: #9b8fd4;
}
.ee-tc-price-negotiable .ee-tc-price-amount {
	font-size: 13px;
	color: #9ca3af;
	font-weight: 600;
}
.ee-tc-view-link {
	font-size: 12px;
	font-weight: 700;
	color: #5b46d6;
	white-space: nowrap;
	opacity: .8;
	transition: opacity .15s;
}
.ee-tc-body:hover .ee-tc-view-link { opacity: 1; }

/* ── Demo CTA button (guardians) ─────────────────────────────────── */
.ee-tc-cta-wrap {
	padding: 0 16px 16px;
}
.ee-tc-demo-btn {
	width: 100%;
	padding: 10px 0;
	background: linear-gradient(135deg, #3a2d97, #5b46d6);
	color: #fff;
	font-size: 13px;
	font-weight: 700;
	border: none;
	border-radius: 10px;
	cursor: pointer;
	font-family: inherit;
	letter-spacing: .02em;
	transition: opacity .18s, transform .15s;
}
.ee-tc-demo-btn:hover {
	opacity: .92;
	transform: translateY(-1px);
}
.ee-tc-demo-btn:active { transform: translateY(0); }

/* ── Ghost / placeholder card ────────────────────────────────────── */
.ee-tc-ghost {
	border: 2px dashed #ddd8f5 !important;
	background: transparent !important;
	box-shadow: none !important;
	min-height: 240px;
	display: flex !important;
	align-items: center;
	justify-content: center;
}
.ee-tc-ghost-inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	padding: 32px 24px;
	color: #b4b0d0;
}
.ee-tc-ghost-icon { font-size: 34px; margin-bottom: 12px; opacity: .45; }
.ee-tc-ghost-title { font-weight: 700; font-size: 14px; margin: 0 0 5px; color: #9690be; }
.ee-tc-ghost-sub { font-size: 12px; margin: 0; color: #b4b0d0; line-height: 1.5; }

/* ── Scroll-reveal animation ─────────────────────────────────────── */
.ee-reveal { opacity: 0; transform: translateY(18px); transition: opacity .45s ease, transform .45s ease; }
.ee-reveal.is-visible { opacity: 1; transform: translateY(0); }

/* ── Shared profile modal section styles ─────────────────────────── */
.teachbd-pf-section { margin-bottom: 14px; min-width: 0; }
.teachbd-pf-section-title {
	font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .4px;
	margin: 0 0 6px; overflow-wrap: anywhere;
}
.teachbd-pf-line { margin: 0 0 3px; font-size: 12.5px; color: #46455c; line-height: 1.5; overflow-wrap: anywhere; word-break: break-word; }
.teachbd-pf-pills { display: flex; flex-wrap: wrap; gap: 5px; }
.teachbd-pf-pills span {
	background: #f5f5f6; border: 1px solid #ece8fb; border-radius: 999px; padding: 3px 10px;
	font-size: 11px; font-weight: 600; color: #46455c; white-space: nowrap;
}

/* ── Legacy aliases kept for backward compat ─────────────────────── */
.teachbd-card-head { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; min-width: 0; }
.teachbd-card-head > div { min-width: 0; overflow: hidden; }
.teachbd-card-subjects { font-size: 12.5px; color: #5b46d6; font-weight: 600; margin: 0 0 4px; }
.teachbd-card-location { font-size: 12px; color: #6f6e85; margin: 0; }
.teachbd-card-keyfacts { display: flex; flex-wrap: wrap; gap: 4px 14px; margin: 0 0 12px; font-size: 12.5px; font-weight: 600; color: #3a2d97; }
.teachbd-card-keyfacts span { overflow-wrap: anywhere; }
.teachbd-card-request-form { margin-top: 0; }
.teachbd-card-request-btn { width: 100%; }
.teachbd-card-badges { display: flex; gap: 4px; flex-wrap: wrap; margin-bottom: 8px; }
.teachbd-card-travel { font-size: 11px; color: #8a7fb0; margin: 0 0 10px; }
.teachbd-card-bio { font-size: 13px; color: #4b4d46; line-height: 1.55; margin: 0 0 14px; }
.teachbd-card-link { font-size: 12.5px; font-weight: 700; color: #3a2d97; }
.teachbd-discovery .teachbd-badge-featured { background: #ece8fb; color: #3a2d97; }
.teachbd-discovery .teachbd-badge-verified { background: #e9f7f2; color: #1f9c8c; }
.teachbd-discovery .teachbd-badge-hired { background: #fff4d6; color: #946200; }
.ee-card-badges { display: flex; gap: 4px; flex-wrap: wrap; justify-content: center; margin-bottom: 10px; }
.ee-card-name { font-family: 'Fraunces', serif !important; font-size: 18px !important; font-weight: 700 !important; color: #100e29 !important; margin: 0 0 4px !important; }
.ee-card-tagline { font-size: 11px; font-weight: 700; color: #3a2d97; text-transform: uppercase; letter-spacing: .4px; margin: 0 0 10px; }
.ee-card-edu { font-size: 12px; color: #6f6e85; margin: 0 0 12px; }
.ee-card-info-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 5px 12px; margin-bottom: 14px; }
.ee-card-info-item { display: flex; align-items: center; gap: 4px; font-size: 12px; color: #6f6e85; }
.ee-info-icon { font-size: 13px; }
.ee-card-fee { color: #3a2d97 !important; font-weight: 700; }
.ee-card-footer { border-top: 1px solid #ece8fb; padding-top: 12px; margin-top: 14px; width: 100%; }
.ee-card-link { font-size: 12px !important; font-weight: 700 !important; color: #5b46d6 !important; }

/* ---------- Subscription / Premium panel ---------- */
.teachbd-sub-panel { max-width: 760px; margin: 0 auto; font-family: 'Work Sans', sans-serif; }
.teachbd-sub-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
@media (max-width: 640px) { .teachbd-sub-grid { grid-template-columns: 1fr; } }
.teachbd-sub-card { background: #fff; border: 1.5px solid #e3def7; border-radius: 18px; padding: 28px 24px; position: relative; }
.teachbd-sub-card.is-current { border-color: #1f9c8c; box-shadow: 0 0 0 2px #e9f7f2 inset; }
.teachbd-sub-card h3 { font-family: 'Fraunces', serif; font-size: 20px; font-weight: 600; margin: 0 0 4px; color: #100e29; display: flex; align-items: center; gap: 8px; }
.teachbd-sub-price { font-size: 26px; font-weight: 700; color: #3a2d97; margin: 0 0 18px; }
.teachbd-sub-price span { font-size: 12px; font-weight: 500; color: #6f6e85; }
.teachbd-sub-benefits { list-style: none; margin: 0 0 16px; padding: 0; font-size: 13.5px; }
.teachbd-sub-benefits li { padding: 6px 0 6px 26px; position: relative; color: #4b4d46; }
.teachbd-sub-benefits li.yes::before { content: "✅"; position: absolute; left: 0; }
.teachbd-sub-benefits li.no::before { content: "❌"; position: absolute; left: 0; }
.teachbd-sub-premium { background: linear-gradient(160deg, #faf9ff, #fff); border-color: #8b6fe8; }
.teachbd-sub-status { font-size: 13px; font-weight: 600; padding: 10px 14px; border-radius: 10px; margin: 0; }
.teachbd-sub-active { background: #e9f7f2; color: #1f9c8c; }
.teachbd-sub-waiting { background: #fff4d6; color: #946200; }
.teachbd-sub-upgrade summary { list-style: none; cursor: pointer; }
.teachbd-sub-upgrade summary::-webkit-details-marker { display: none; }
.teachbd-sub-instructions { margin-top: 16px; padding-top: 16px; border-top: 1px solid #e3def7; }
.teachbd-sub-instructions p { font-size: 13.5px; color: #4b4d46; margin: 0 0 14px; }

/* =====================================================================
   TUTOR PORTAL — tabbed dashboard
===================================================================== */
.teachbd-portal {
	font-family: 'Work Sans', sans-serif; max-width: 980px; margin: 0 auto;
	background: linear-gradient(180deg, #faf9ff 0%, #f7f7fb 100%);
	border-radius: 24px; padding: 28px clamp(16px, 4vw, 32px);
}
.teachbd-portal-topbar {
	display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 10px;
	margin-bottom: 20px; padding-bottom: 18px; border-bottom: 1px solid #e3def7;
}
.teachbd-portal-topbar h2 { font-family: 'Fraunces', serif; font-size: 24px; font-weight: 600; margin: 0; color: #100e29; }
.teachbd-portal-topbar-right { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.teachbd-portal-who { font-size: 13px; color: #6f6e85; }
.teachbd-portal-who small { font-family: monospace; }
/* v-new — "the log out buttons should be red with white texts." Was
   riding on .teachbd-btn-muted (grey) same as any other secondary
   action -- logging out is a distinct, deliberate action worth its
   own unmistakable color so it's never confused with a neutral
   button. Comes after .teachbd-btn-muted in the stylesheet so it wins
   on equal specificity without needing !important. */
.teachbd-logout-link {
	text-decoration: none; white-space: nowrap;
	background: #d92d20 !important; color: #fff !important;
}
.teachbd-logout-link:hover { background: #b3261e !important; color: #fff !important; }

/* ── Notification bell (teacher + guardian portal topbar) ── */
.teachbd-notif-bell-wrap { position: relative !important; display: inline-block !important; }
/* v-fix — the bell was rendering as a blank grey pill instead of a
   circular button with the 🔔 glyph: the active theme's own global
   `button { ... }` reset (appearance, border-radius, min-width,
   line-height, font-family) was overriding this rule. Hardened with
   !important + "all: unset" as a base reset so the theme's button
   styles can no longer bleed through — same fix already applied to
   .teachbd-receipt-btn for the same class of problem. */
.teachbd-notif-bell {
	all: unset !important;
	box-sizing: border-box !important;
	position: relative !important;
	background: #f4f2fc !important;
	border: 1px solid #e3def7 !important;
	border-radius: 999px !important;
	width: 36px !important;
	height: 36px !important;
	min-width: 36px !important;
	font-size: 16px !important;
	line-height: 1 !important;
	cursor: pointer !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	font-family: -apple-system, "Segoe UI Emoji", "Noto Color Emoji", "Apple Color Emoji", sans-serif !important;
}
.teachbd-notif-bell-count {
	all: unset !important;
	position: absolute !important; top: -4px !important; right: -4px !important;
	display: inline-block !important; box-sizing: border-box !important;
}
.teachbd-notif-bell-panel {
	margin: 0 !important; padding: 0 !important; list-style: none !important;
	position: absolute !important; top: 44px !important; right: 0 !important;
	width: 320px !important; max-height: 380px !important; overflow-y: auto !important;
	background: #fff !important; border: 1px solid #e3def7 !important; border-radius: 10px !important;
	box-shadow: 0 12px 32px rgba(16,14,41,.16) !important; z-index: 500 !important;
	box-sizing: border-box !important; font-size: 13px !important; color: #100e29 !important;
}
/* v-fix -- "the notification tray is out of margin and half off screen
   on most devices": the panel was position:absolute + right:0 relative
   to the bell's own wrapper, which puts its RIGHT edge flush with the
   bell -- fine on desktop where the bell sits at the far right of a wide
   header, but on a phone the bell often sits mid-header (guardian name
   and Log out button both to its right, per the reported screenshot), so
   the fixed 320px-wide panel extended left straight off the viewport.
   Below 640px this switches to a viewport-anchored fixed sheet (small
   equal margins from both screen edges) instead of being anchored to the
   bell at all, so it can never overflow regardless of where the bell
   itself sits in the header. */
@media (max-width: 640px) {
	.teachbd-notif-bell-panel {
		position: fixed !important;
		top: 64px !important;
		left: 10px !important;
		right: 10px !important;
		width: auto !important;
		max-width: none !important;
		max-height: 70vh !important;
	}
}

.teachbd-notif-bell-head {
	display: flex; align-items: center; justify-content: space-between;
	padding: 10px 14px; border-bottom: 1px solid #efedf9; font-size: 13px;
}
.teachbd-notif-bell-head button {
	background: none; border: none; color: #3a2d97; font-size: 11.5px; cursor: pointer; text-decoration: underline;
}
.teachbd-notif-bell-item {
	padding: 10px 14px; border-bottom: 1px solid #f4f2fc; font-size: 12.5px;
	display: block; text-decoration: none; color: inherit;
}
/* v-fix — items with a stored link now render as <a>, not <div>; reset
   link defaults so a clickable notification looks identical to a plain
   one instead of turning blue/underlined. */
a.teachbd-notif-bell-item { cursor: pointer; }
a.teachbd-notif-bell-item:hover { background: #f4f2fc; }
.teachbd-notif-bell-item:last-child { border-bottom: none; }
.teachbd-notif-bell-item.is-unread { background: #f8f6ff; }
.teachbd-notif-bell-item strong { display: block; font-size: 13px; color: #100e29; }
.teachbd-notif-bell-item p { margin: 3px 0; color: #56526e; }
.teachbd-notif-bell-time { color: #9490ac; font-size: 11px; }

.teachbd-doc-banner {
	background: #fff8ec; border: 1.5px solid #f0c674; border-radius: 14px; padding: 18px 20px; margin-bottom: 18px;
}
.teachbd-doc-banner strong { color: #946200; font-size: 15px; }
.teachbd-doc-banner p { font-size: 13.5px; color: #7a5a12; margin: 6px 0 0; }

.teachbd-quote-card {
	background: linear-gradient(120deg, #3a2d97, #8b6fe8); color: #fff; border-radius: 16px;
	padding: 20px 24px; margin-top: 16px;
}
.teachbd-quote-label { font-size: 11px; letter-spacing: 1px; opacity: 0.75; margin: 0 0 8px; text-transform: uppercase; }
.teachbd-quote-text { font-family: 'Fraunces', serif; font-size: 17px; font-style: italic; margin: 0; }

.teachbd-portal-stats { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; margin-bottom: 22px; }
@media (max-width: 700px) { .teachbd-portal-stats { grid-template-columns: repeat(2, 1fr); } }
/* v3.7 — stat boxes are now real <button> elements so they're clickable/focusable; reset native button chrome so they keep looking like the original boxes. */
.teachbd-portal-stats .teachbd-stat-clickable {
	font: inherit;
	color: inherit;
	width: 100%;
	cursor: pointer;
}
.teachbd-portal-stats .teachbd-stat-clickable:focus-visible {
	outline: 2px solid #5b46d6;
	outline-offset: 2px;
}
.teachbd-portal-stats .teachbd-stat-box {
	background: #fff; border: 1px solid #e3def7; border-radius: 14px; padding: 16px 10px; text-align: center;
	box-shadow: 0 4px 14px -6px rgba(58,45,151,0.1); transition: transform 0.15s ease;
}
.teachbd-portal-stats .teachbd-stat-box:hover { transform: translateY(-2px); }
.teachbd-portal-stats .teachbd-stat-box strong { display: block; font-size: 22px; color: #3a2d97; }
.teachbd-portal-stats .teachbd-stat-box span { font-size: 11px; color: #6f6e85; }

/* v-fix -- "Dashboard, Browse Jobs... still not hugely noticeable" --
   the tab bar read as plain text with a thin underline, easy to miss
   entirely at a glance (especially in a narrow view, per the reported
   screenshot). Pure visual upgrade only -- same markup, same JS, same
   tabs/badges/scroll behavior -- just switched from "underline on a
   washed-out grey label" to a proper pill/segmented-control look: a
   soft container behind the whole bar, bold dark-on-light inactive
   tabs, and a solid filled brand-purple pill for whichever tab is
   active, so "you are here" is obvious without reading the text. */
.teachbd-portal-tabs {
	display: flex; flex-wrap: wrap; gap: 6px;
	background: #f0eefc; border: 1px solid #e3def7; border-radius: 14px;
	padding: 6px; margin-bottom: 22px;
}
.teachbd-tab {
	background: transparent; border: none; border-radius: 9px; cursor: pointer;
	font-size: 13.5px; font-weight: 700; color: #3d3b52; padding: 10px 16px;
	transition: color 0.15s ease, background-color 0.15s ease, box-shadow 0.15s ease;
}
.teachbd-tab:hover { color: #3a2d97; background: rgba(58,45,151,0.08); }
.teachbd-tab.is-active {
	color: #ffffff; background: #3a2d97;
	box-shadow: 0 3px 10px -3px rgba(58,45,151,0.55);
}
.teachbd-tab.is-active:hover { color: #ffffff; background: #3a2d97; }
.teachbd-tabpanel { display: none; }
.teachbd-tabpanel.is-active { display: block; animation: teachbd-fade-in 0.25s ease; }

/* v-new -- "guardians/teachers scroll past the tabs and don't realize
   there's more" -- the strip already scrolled horizontally on narrow
   screens, but its scrollbar is deliberately hidden for a clean look, so
   there was no cue at all that anything was off-screen. This wraps the
   existing .teachbd-portal-tabs (unchanged) in a positioning container
   and adds a small fading chevron hint on the right edge -- visible only
   below 640px (see media query below), and hidden once teachbd.js
   detects the strip has been scrolled to its end. Desktop is untouched:
   flex-wrap already lets every tab show at once there. */
.teachbd-tabs-scroller { position: relative; }
.teachbd-tabs-scroll-hint { display: none; }

/* ── Attention cue for a just-registered guardian: pulses the
   "Post a Job" dashboard tab a few times so it's obvious where to go next.
   Runs a finite number of cycles only — never an endless distraction. */
/* v-fix — this used to animate background-color between two light
   purple tints, which looked right against the OLD transparent-bg tab
   but now fights the new solid-filled .is-active pill (would flash a
   washed-out tint over the white active-tab text mid-pulse). Switched
   to a box-shadow-only halo ring so it layers cleanly on top of
   whatever the tab's own background already is — solid-active or
   still-transparent if the click somehow didn't register. */
@keyframes teachbd-pulse-glow {
	0%, 100% { box-shadow: 0 0 0 0 rgba(58,45,151,.45); }
	50%      { box-shadow: 0 0 0 10px rgba(58,45,151,0); }
}
.teachbd-pulse-highlight {
	animation: teachbd-pulse-glow 1.3s ease-in-out 4;
}
@media (prefers-reduced-motion: reduce) {
	.teachbd-pulse-highlight { animation: none; box-shadow: 0 0 0 4px rgba(58,45,151,.25); }
}

.teachbd-browse-jobs-rule { font-size: 13px; color: #6f6e85; background: #ece8fb; padding: 12px 16px; border-radius: 10px; margin-bottom: 16px; }
.teachbd-job-card { background: #fff; border: 1px solid #e3def7; border-radius: 14px; padding: 18px 20px; margin-bottom: 12px; }
.teachbd-job-card.is-ineligible { background: #fafafa; opacity: 0.7; }
.teachbd-job-card h4 { font-family: 'Fraunces', serif; font-size: 16px; font-weight: 600; margin: 0 0 6px; color: #100e29; }
.teachbd-job-meta { font-size: 12.5px; color: #6f6e85; margin: 0 0 8px; }

/* =====================================================================
   CALENDAR
===================================================================== */
/* v-new — "the calendar is a mess." Redesigned for a calmer, more
   legible grid: cells get a fixed, consistent height (was min-height
   only, so rows with more events grew taller than their neighbors and
   the whole grid looked ragged); the day number becomes a small badge
   instead of plain text so it doesn't visually collide with event
   pills stacked right underneath it; today gets a filled badge instead
   of a thin inset outline that was easy to miss; event pills are
   capped at 2 per cell with a "+N more" overflow chip (see
   TeachBD_Calendar::render()) so no cell balloons past its row. */
.teachbd-calendar { font-family: 'Work Sans', sans-serif; }
.teachbd-cal-head { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 10px; margin-bottom: 14px; }
.teachbd-cal-nav { display: flex; align-items: center; gap: 14px; }
.teachbd-cal-nav-btn {
	width: 32px; height: 32px; border-radius: 50%; background: #ece8fb; color: #3a2d97;
	display: flex; align-items: center; justify-content: center; font-size: 18px; text-decoration: none;
	flex-shrink: 0;
}
.teachbd-cal-nav-btn:hover { background: #3a2d97; color: #fff; }
.teachbd-cal-head h4 { font-family: 'Fraunces', serif; font-size: 18px; font-weight: 600; margin: 0; color: #100e29; min-width: 140px; text-align: center; }
.teachbd-cal-legend { display: flex; gap: 14px; font-size: 11.5px; color: #6f6e85; flex-wrap: wrap; }
.teachbd-dot { display: inline-block; width: 9px; height: 9px; border-radius: 50%; margin-right: 4px; flex-shrink: 0; }
.teachbd-dot-blue { background: #1d4ed8; }
.teachbd-dot-green { background: #1f9c8c; }
.teachbd-dot-amber { background: #946200; }
.teachbd-dot-red { background: #b3261e; }
.teachbd-cal-grid {
	display: grid; grid-template-columns: repeat(7, 1fr);
	grid-auto-rows: 1fr; gap: 6px;
}
.teachbd-cal-dow { font-size: 11px; font-weight: 700; color: #6f6e85; text-align: center; padding: 4px 0 8px; }
.teachbd-cal-cell {
	background: #fff; border: 1px solid #e3def7; border-radius: 10px;
	height: 88px; padding: 6px; font-size: 11px; overflow: hidden;
	display: flex; flex-direction: column; gap: 2px;
}
.teachbd-cal-cell.is-empty { background: transparent; border: none; }
.teachbd-cal-cell.has-events { border-color: #d5cff5; }
.teachbd-cal-cell.is-today { background: #f7f5fe; border-color: #3a2d97; box-shadow: 0 0 0 1px #3a2d97 inset; }
.teachbd-cal-daynum {
	font-weight: 700; color: #100e29; font-size: 11.5px;
	width: 20px; height: 20px; border-radius: 50%;
	display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.teachbd-cal-cell.is-today .teachbd-cal-daynum { background: #3a2d97; color: #fff; }
.teachbd-cal-event {
	padding: 2px 5px; border-radius: 4px; color: #fff; font-size: 9.5px; font-weight: 600;
	white-space: nowrap; overflow: hidden; text-overflow: ellipsis; flex-shrink: 0;
}
.teachbd-cal-event.teachbd-dot-blue { background: #1d4ed8; }
.teachbd-cal-event.teachbd-dot-green { background: #1f9c8c; }
.teachbd-cal-event.teachbd-dot-amber { background: #946200; }
.teachbd-cal-event.teachbd-dot-red { background: #b3261e; }
.teachbd-cal-event-more {
	background: #f5f5f8; color: #6f6e85; border: 1px dashed #d5cff5; cursor: default;
}
@media (max-width: 640px) {
	.teachbd-cal-grid { gap: 3px; }
	.teachbd-cal-cell { height: 60px; padding: 3px 4px; font-size: 9px; border-radius: 8px; }
	.teachbd-cal-daynum { width: 16px; height: 16px; font-size: 9.5px; }
	.teachbd-cal-event { font-size: 7.5px; padding: 1px 3px; }
	.teachbd-cal-head h4 { font-size: 15px; min-width: 0; }
	.teachbd-cal-legend { font-size: 10px; gap: 8px 10px; justify-content: center; }
}
@media (max-width: 400px) {
	.teachbd-cal-cell { height: 50px; }
	.teachbd-cal-event:nth-child(3) { display: none; }
}

/* =====================================================================
   MESSAGING
===================================================================== */
.teachbd-msg-thread { font-family: 'Work Sans', sans-serif; }
.teachbd-msg-thread h4 { font-family: 'Fraunces', serif; font-size: 16px; font-weight: 600; margin: 0 0 12px; color: #100e29; }
.teachbd-msg-log { max-height: 320px; overflow-y: auto; display: flex; flex-direction: column; gap: 8px; margin-bottom: 14px; padding-right: 4px; }
.teachbd-msg-bubble { background: #f5f5f6; border-radius: 12px; padding: 8px 12px; max-width: 80%; align-self: flex-start; }
.teachbd-msg-bubble.is-mine { background: #ece8fb; align-self: flex-end; }
.teachbd-msg-from { font-size: 11px; font-weight: 700; color: #3a2d97; }
.teachbd-msg-bubble p { font-size: 13.5px; margin: 3px 0; color: #100e29; }
.teachbd-msg-time { font-size: 10px; color: #6f6e85; display: inline-flex; align-items: center; gap: 6px; }
.teachbd-msg-delete-form { display: inline; }
.teachbd-msg-delete-btn {
	background: none; border: none; padding: 0; cursor: pointer; font-size: 11px; opacity: 0.45;
	transition: opacity 0.15s ease;
}
.teachbd-msg-delete-btn:hover { opacity: 1; }
.teachbd-msg-form { display: flex; gap: 8px; }
.teachbd-msg-form textarea { flex: 1; padding: 10px 12px; border: 1.5px solid #d3d7dd; border-radius: 10px; font-family: inherit; font-size: 13.5px; resize: vertical; }
.teachbd-msg-form textarea:focus { outline: none; border-color: #5b46d6; }

/* =====================================================================
   RECOMMENDATIONS
===================================================================== */
.teachbd-rec-card { background: #faf9ff; border: 1.5px solid #8b6fe8; border-radius: 16px; padding: 22px; margin-bottom: 18px; }
.teachbd-rec-header { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 8px; margin-bottom: 10px; }
.teachbd-rec-header h4 { font-family: 'Fraunces', serif; font-size: 16px; font-weight: 600; margin: 0; color: #100e29; }
.teachbd-rec-timer { font-family: monospace; font-size: 14px; font-weight: 700; color: #3a2d97; background: #ece8fb; padding: 4px 12px; border-radius: 999px; }
.teachbd-rec-warning { font-size: 13px; font-weight: 600; color: #946200; background: #fff4d6; padding: 10px 14px; border-radius: 10px; margin: 0 0 16px; }
/* v-new — widened to fit the full .tbc-card (education/fee/location/About)
   now rendered here instead of the old bare name+bio card; matches the
   same 3-column rhythm as .ee-tutor-grid (Browse Tutors) for consistency. */
.teachbd-rec-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; align-items: start; }
@media (max-width: 960px) { .teachbd-rec-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 580px)  { .teachbd-rec-grid { grid-template-columns: 1fr; gap: 16px; } }
.teachbd-rec-teacher-card { background: #fff; border: 1px solid #e3def7; border-radius: 12px; padding: 0; text-align: left; overflow: hidden; }
.teachbd-rec-select-wrap { padding: 14px 18px 18px; border-top: 1px solid #efeaf9; }

/* v-new — "accept posted price / propose a new one" radio field. */
.teachbd-price-choice { margin: 8px 0; font-size: 12.5px; }
.teachbd-price-choice-option { display: flex; gap: 6px; align-items: flex-start; margin: 0 0 6px; cursor: pointer; }
.teachbd-price-choice-option input { margin-top: 2px; }
.teachbd-price-counter-field { margin: 6px 0 4px 22px; }
.teachbd-price-counter-field input[type="number"] { width: 140px; padding: 6px 8px; border: 1px solid #d8d2ef; border-radius: 6px; font-size: 13px; }
.teachbd-revise-price-card .teachbd-price-choice { background: #fff; border-radius: 8px; padding: 10px 12px; border: 1px solid #f0e3c4; }
.teachbd-rec-fee-box { background: #fff8ec; border: 1.5px solid #f0c674; border-radius: 14px; padding: 20px; margin-bottom: 18px; }
.teachbd-rec-fee-box h4 { font-family: 'Fraunces', serif; font-size: 15px; font-weight: 600; margin: 0 0 10px; color: #946200; }
.teachbd-rec-fee-box p { font-size: 13.5px; color: #7a5a12; margin: 0 0 14px; }

/* =====================================================================
   PROFILE MODAL — replaces the old separate-page profile link
===================================================================== */
/* =====================================================================
   PROFILE MODAL OVERLAY + BOUNCE OPEN ANIMATION
===================================================================== */
@keyframes teachbd-modal-bounce {
	0%   { opacity: 0; transform: scale(.88) translateY(28px); }
	60%  { opacity: 1; transform: scale(1.025) translateY(-6px); }
	80%  { transform: scale(.985) translateY(2px); }
	100% { opacity: 1; transform: scale(1) translateY(0); }
}
.teachbd-profile-modal-overlay {
	display: none; position: fixed; inset: 0; background: rgba(16,14,41,0.72);
	z-index: 99998; align-items: center; justify-content: center; padding: 20px;
	/* v4.9.41 — backdrop-filter removed: it was implicated in the earlier
	   "screen freezes" reports (some Chromium-based browsers, notably
	   Brave with certain extensions, didn't repaint it reliably on
	   display:none -> flex). A slightly darker flat overlay reads just as
	   clearly without that repaint risk. */
	overflow-y: auto; /* v4.5 — lets a modal taller than the viewport still be reached/dismissed even if internal scroll is constrained */
}
.teachbd-profile-modal-overlay.is-open { display: flex; }
.teachbd-profile-modal {
	background: #fff; border-radius: 20px; max-width: 680px; width: 100%;
	max-height: 90vh; overflow-y: auto; position: relative;
	box-shadow: 0 32px 80px -20px rgba(16,14,41,0.55);
	animation: teachbd-modal-bounce .42s cubic-bezier(.22,.68,0,1.2) both;
	-webkit-overflow-scrolling: touch; /* v4.5 — momentum scrolling on iOS; without this, touch-scrolling the modal body can feel unresponsive/stuck */
	overscroll-behavior: contain; /* v4.5 — stop scroll from chaining into the page behind once you hit the top/bottom of the modal */
}
.teachbd-profile-modal-wide { max-width: 900px; }
/* v4.9.41 — "View CV" popup: same modal shell, a little breathing room
   added for the resume-style content (see .teachbd-cv-modal below). */
.teachbd-profile-modal--cv { max-width: 760px; }
.teachbd-profile-modal--cv .teachbd-cv-body { padding: 24px 32px 28px; }
@media (min-width: 700px) {
	.teachbd-profile-modal--cv .teachbd-cv-meta-row { gap: 10px; }
	.teachbd-profile-modal--cv .teachbd-cv-section { padding: 14px 0; }
}
.teachbd-profile-modal-close {
	position: absolute; top: 14px; right: 14px; background: rgba(255,255,255,.85); border: none;
	width: 34px; height: 34px; border-radius: 50%; font-size: 19px; color: #6f6e85; cursor: pointer;
	line-height: 1; z-index: 2; backdrop-filter: blur(4px);
	transition: background .15s, color .15s;
}
.teachbd-profile-modal-close:hover { background: #ece8fb; color: #3a2d97; }
.teachbd-open-profile-modal { cursor: pointer; text-align: left; background: transparent; border: none; padding: 0; font-family: inherit; display: block; width: 100%; }

/* =====================================================================
   CV MODAL CONTENT (.teachbd-cv-modal)
===================================================================== */
.teachbd-cv-modal {
	font-family: 'Work Sans', sans-serif;
	color: #100e29;
}

/* — Header — */
.teachbd-cv-header {
	background: linear-gradient(135deg, #1a1440 0%, #3a2d97 60%, #5b46d6 100%);
	padding: 32px 28px 24px;
	display: flex;
	align-items: flex-start;
	gap: 20px;
	position: relative;
	border-radius: 20px 20px 0 0;
}
.teachbd-cv-avatar-wrap {
	position: relative;
	flex-shrink: 0;
}
.teachbd-cv-avatar {
	width: 88px; height: 88px; border-radius: 50%;
	border: 3px solid rgba(255,255,255,.35);
	object-fit: cover;
	display: block;
}
.teachbd-cv-verified-ring {
	position: absolute; bottom: 0; right: 0;
	background: #1f8a7a; color: #fff;
	width: 22px; height: 22px; border-radius: 50%;
	display: flex; align-items: center; justify-content: center;
	font-size: 11px; font-weight: 700;
	border: 2px solid #fff;
}
.teachbd-cv-identity {
	flex: 1;
	min-width: 0;
}
.teachbd-cv-badges {
	display: flex; gap: 6px; margin-bottom: 8px; flex-wrap: wrap;
}
.teachbd-cv-name {
	font-family: 'Fraunces', serif;
	font-size: 22px; font-weight: 700;
	color: #fff; margin: 0 0 4px;
	line-height: 1.2;
}
.teachbd-cv-title {
	font-size: 13px; color: rgba(255,255,255,.75);
	margin: 0 0 10px; font-weight: 500;
}
/* v4.0 */
.teachbd-cv-fully-booked-banner {
	background: #7f1d1d;
	color: #fff;
	text-align: center;
	font-size: 12.5px;
	font-weight: 800;
	letter-spacing: .03em;
	padding: 10px;
	margin: -1px -1px 0 -1px;
}
.teachbd-cv-rating-row {
	font-size: 12.5px;
	color: rgba(255,255,255,.85);
	margin: 0 0 8px;
}
.teachbd-cv-rating-row .teachbd-rating-num,
.teachbd-cv-rating-row .teachbd-rating-count { color: rgba(255,255,255,.85); }
.teachbd-cv-meta-row {
	display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 10px;
}
.teachbd-cv-meta-chip {
	background: rgba(255,255,255,.15);
	color: rgba(255,255,255,.9);
	border-radius: 20px;
	padding: 3px 10px;
	font-size: 12px;
	backdrop-filter: blur(4px);
}
.teachbd-cv-price {
	display: inline-flex; align-items: baseline; gap: 3px;
}
.teachbd-cv-price-amount {
	font-family: 'Fraunces', serif;
	font-size: 24px; font-weight: 700; color: #fff;
}
.teachbd-cv-price-per {
	font-size: 12px; color: rgba(255,255,255,.65);
}

/* Bookmark button (on header) */
.teachbd-cv-bookmark {
	position: absolute; top: 16px; right: 52px;
	background: rgba(255,255,255,.15);
	border: 1.5px solid rgba(255,255,255,.3);
	border-radius: 20px;
	padding: 6px 14px;
	color: #fff;
	font-size: 13px; font-weight: 600;
	cursor: pointer;
	display: flex; align-items: center; gap: 5px;
	transition: background .18s, border-color .18s;
	font-family: 'Work Sans', sans-serif;
	backdrop-filter: blur(4px);
}
.teachbd-cv-bookmark:hover { background: rgba(255,255,255,.25); border-color: rgba(255,255,255,.6); }
.teachbd-cv-bookmark:focus-visible { outline: 2px solid rgba(255,255,255,.7); outline-offset: 2px; }
.teachbd-cv-bookmark:active { background: rgba(255,255,255,.3); }
.teachbd-cv-bookmark.is-bookmarked { background: rgba(255,210,60,.25); border-color: rgba(255,210,60,.7); color: #fff; }
.teachbd-cv-bookmark.is-bookmarked:hover { background: rgba(255,210,60,.4); }

/* ── Guest save prompt — centred overlay modal ── */
.teachbd-bm-guest-overlay {
	position: fixed;
	inset: 0;
	z-index: 99999;
	background: rgba(16,14,41,.55);
	backdrop-filter: blur(3px);
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 20px;
	opacity: 0;
	transition: opacity .22s ease;
	pointer-events: none;
}
.teachbd-bm-guest-overlay.is-visible {
	opacity: 1;
	pointer-events: auto;
}
.teachbd-bm-guest-card {
	background: #fff;
	border-radius: 22px;
	padding: 36px 32px 32px;
	max-width: 420px;
	width: 100%;
	text-align: center;
	position: relative;
	box-shadow: 0 32px 80px -20px rgba(16,14,41,.4);
	transform: translateY(14px) scale(.97);
	transition: transform .25s cubic-bezier(.34,1.3,.64,1);
}
.teachbd-bm-guest-overlay.is-visible .teachbd-bm-guest-card {
	transform: translateY(0) scale(1);
}
.teachbd-bm-guest-close {
	position: absolute;
	top: 14px;
	right: 16px;
	background: #f5f3ff;
	border: none;
	border-radius: 50%;
	width: 30px;
	height: 30px;
	font-size: 18px;
	line-height: 1;
	color: #6f6e85;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background .15s;
}
.teachbd-bm-guest-close:hover { background: #ece8fb; color: #3a2d97; }
.teachbd-bm-guest-icon {
	font-size: 44px;
	margin-bottom: 14px;
	display: block;
}
.teachbd-bm-guest-title {
	font-family: 'Fraunces', serif;
	font-size: 22px;
	font-weight: 700;
	color: #100e29;
	margin: 0 0 10px;
	line-height: 1.2;
}
.teachbd-bm-guest-sub {
	font-size: 14px;
	color: #6f6e85;
	margin: 0 0 24px;
	line-height: 1.6;
}
.teachbd-bm-guest-actions {
	display: flex;
	flex-direction: column;
	gap: 10px;
}
.teachbd-bm-guest-btn-primary {
	display: block;
	padding: 13px 0;
	background: linear-gradient(135deg, #3a2d97, #5b46d6);
	color: #fff;
	font-size: 15px;
	font-weight: 700;
	border-radius: 12px;
	text-decoration: none;
	transition: opacity .18s, transform .15s;
	letter-spacing: .01em;
}
.teachbd-bm-guest-btn-primary:hover { opacity: .92; transform: translateY(-1px); color: #fff; }
.teachbd-bm-guest-btn-secondary {
	display: block;
	font-size: 13px;
	font-weight: 600;
	color: #5b46d6;
	text-decoration: none;
	padding: 4px 0;
	transition: color .15s;
}
.teachbd-bm-guest-btn-secondary:hover { color: #3a2d97; }

/* — Body — */
.teachbd-cv-body {
	padding: 0 28px 28px;
}
.teachbd-cv-section {
	border-top: 1px solid #f0edf9;
	padding: 18px 0 2px;
}
.teachbd-cv-section:first-child { border-top: none; padding-top: 24px; }
.teachbd-cv-section-label {
	display: flex; align-items: center; gap: 8px;
	font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .5px;
	color: #3a2d97; margin: 0 0 10px;
}
.teachbd-cv-section-icon { font-size: 14px; }
.teachbd-cv-pills {
	display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 8px;
}
.teachbd-cv-pills span {
	background: #ece8fb; color: #3a2d97;
	border-radius: 20px; padding: 4px 12px; font-size: 12.5px; font-weight: 600;
}
.teachbd-cv-pills-travel span {
	background: #fff3e0; color: #b0651f;
}
.teachbd-cv-line {
	font-size: 13.5px; color: #2d2c44; line-height: 1.65; margin: 0 0 6px;
}
.teachbd-cv-line-strong { font-weight: 700; color: #100e29; }
.teachbd-cv-bio { color: #6f6e85; font-style: italic; }

/* — Footer / CTA — */
.teachbd-cv-footer {
	border-top: 1px solid #f0edf9;
	padding-top: 20px;
	margin-top: 8px;
}
.teachbd-cv-privacy {
	font-size: 12px; color: #adadc2; margin: 0 0 14px; line-height: 1.5;
}
.teachbd-cv-request-btn {
	background: linear-gradient(135deg, #1f8a7a 0%, #2bab97 100%) !important;
	border-radius: 10px !important;
	font-size: 14px !important;
	padding: 12px 24px !important;
	box-shadow: 0 8px 24px -8px rgba(31,138,122,.45) !important;
}
.teachbd-cv-cta { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }

/* ee-card-* compat aliases are now in the Discovery section above */

/* =====================================================================
   DASHBOARD SUMMARY -- date/weather widget + payment/upcoming/admin cards
   shown at the top of both portals' Overview tab
===================================================================== */
.teachbd-dash-summary { margin-bottom: 22px; }
.teachbd-datewx-widget {
	position: relative; overflow: hidden;
	display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px;
	background: linear-gradient(135deg, #3a2d97 0%, #5b46d6 100%);
	color: #fff; border-radius: 14px; padding: 16px 20px; margin-bottom: 14px;
}
/* v-new — "there is no animation going on for the day to night time
   change." The purple gradient above is the "daytime" look and stays
   the base background; a separate dark "night" gradient sits on a
   pseudo-element layered on top with opacity:0, so flipping the
   .is-nighttime class (done server-side on render, and live by
   teachbd.js as real time crosses sunset/sunrise while the page stays
   open) fades one into the other instead of an abrupt swap. Actual
   widget content is lifted onto its own stacking layer (z-index:1) so
   it always sits above both background layers. */
.teachbd-datewx-widget::after {
	content: ""; position: absolute; inset: 0; z-index: 0;
	background: linear-gradient(135deg, #161233 0%, #2a1f5c 100%);
	opacity: 0; transition: opacity 2.5s ease;
	pointer-events: none;
}
.teachbd-datewx-widget.is-nighttime::after { opacity: 1; }
.teachbd-datewx-widget > * { position: relative; z-index: 1; }
.teachbd-datewx-date { display: flex; flex-direction: column; }
.teachbd-datewx-day { font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: .5px; opacity: .85; }
.teachbd-datewx-full { font-family: 'Fraunces', serif; font-size: 19px; font-weight: 600; }
.teachbd-datewx-weather { display: flex; align-items: center; gap: 8px; }
.teachbd-datewx-icon { font-size: 26px; line-height: 1; }
.teachbd-datewx-temp { font-size: 20px; font-weight: 700; }
.teachbd-datewx-label { font-size: 12.5px; opacity: .85; }
/* v-new — "Add salat times and waqth inside plugins." Sits as a third
   row inside the same date/weather banner (flex-basis:100% forces it
   onto its own line below the date+weather row, since the parent is
   already flex-wrap:wrap — no markup restructuring needed). */
.teachbd-datewx-salat {
	flex-basis: 100%; border-top: 1px solid rgba(255,255,255,.22);
	padding-top: 12px; margin-top: 2px;
}
.teachbd-datewx-salat-title { font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .5px; opacity: .85; display: block; margin-bottom: 8px; }
.teachbd-datewx-salat-grid { display: flex; flex-wrap: wrap; gap: 10px 18px; }
.teachbd-datewx-salat-item { display: flex; flex-direction: column; gap: 2px; min-width: 56px; }
.teachbd-datewx-salat-name { font-size: 11px; opacity: .8; }
.teachbd-datewx-salat-time { font-size: 15px; font-weight: 700; }
/* v-new — "there should be animation of sun rise and sunset .. during
   the noon the sun should be at the top of the curve." Same
   flex-basis:100% own-row pattern as .teachbd-datewx-salat above. A
   dashed SVG arc is the backdrop; the marker itself is positioned by
   inline left/top percentages computed server-side in
   TeachBD_Shortcodes::get_sun_arc_position() from today's real
   sunrise/sunset — noon sits at the arc's peak, sunrise/sunset sit on
   the horizon. The pulsing glow behind the sun/moon icon is the
   "animation"; position updates on each page load/refresh rather than
   ticking live client-side, matching how the rest of the widget
   (date, weather, salat) already only refreshes on load. */
.teachbd-sunarc {
	flex-basis: 100%; border-top: 1px solid rgba(255,255,255,.22);
	padding-top: 12px; margin-top: 2px;
}
.teachbd-sunarc-title { font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .5px; opacity: .85; display: block; margin-bottom: 8px; }
.teachbd-sunarc-track { position: relative; height: 58px; }
.teachbd-sunarc-curve { position: absolute; inset: 0; width: 100%; height: 100%; }
.teachbd-sunarc-curve path { fill: none; stroke: rgba(255,255,255,.35); stroke-width: 1.5; stroke-dasharray: 3 4; }
.teachbd-sunarc-marker {
	position: absolute; transform: translate(-50%, -50%);
	transition: left 1s ease, top 1s ease;
	display: flex; align-items: center; justify-content: center;
	width: 26px; height: 26px;
}
.teachbd-sunarc-glow {
	position: absolute; width: 26px; height: 26px; border-radius: 50%;
	background: radial-gradient(circle, rgba(255,214,90,.55) 0%, rgba(255,214,90,0) 70%);
	animation: teachbd-sunarc-pulse 2.2s ease-in-out infinite;
}
.teachbd-sunarc.is-night .teachbd-sunarc-glow {
	background: radial-gradient(circle, rgba(180,190,255,.45) 0%, rgba(180,190,255,0) 70%);
}
.teachbd-sunarc-icon { position: relative; font-size: 18px; line-height: 1; }
.teachbd-sunarc-time {
	position: absolute; bottom: 0; font-size: 10.5px; opacity: .8; font-weight: 600; white-space: nowrap;
}
.teachbd-sunarc-rise { left: 0; }
.teachbd-sunarc-set { right: 0; }
@keyframes teachbd-sunarc-pulse {
	0%, 100% { transform: scale(1); opacity: .9; }
	50%      { transform: scale(1.3); opacity: .5; }
}
@media (prefers-reduced-motion: reduce) {
	.teachbd-sunarc-glow { animation: none; }
	.teachbd-sunarc-marker { transition: none; }
}
.teachbd-dash-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px; }
.teachbd-dash-card {
	display: flex; align-items: flex-start; gap: 12px;
	background: #fff; border: 1px solid #e3def7; border-radius: 12px; padding: 14px 16px;
}
.teachbd-dash-card-icon { font-size: 22px; line-height: 1; flex-shrink: 0; }
.teachbd-dash-card-body { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.teachbd-dash-card-label { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .4px; color: #9c99b8; }
.teachbd-dash-card-value { font-size: 14px; font-weight: 600; color: #100e29; }
.teachbd-dash-card-value.teachbd-dash-card-muted { color: #9c99b8; font-weight: 500; }
.teachbd-dash-card-value.teachbd-dash-card-alert { color: #b45309; }
.teachbd-dash-card-link { font-size: 12.5px; font-weight: 600; color: #3a2d97; text-decoration: none; }
.teachbd-dash-card-link:hover { text-decoration: underline; }
@media (max-width: 640px) {
	.teachbd-datewx-widget { flex-direction: column; align-items: flex-start; }
}

/* =====================================================================
   TAB BADGE (count chip on Saved Teachers tab)
===================================================================== */
.teachbd-tab-badge {
	display: inline-flex; align-items: center; justify-content: center;
	background: #3a2d97; color: #fff;
	font-size: 10px; font-weight: 700;
	min-width: 17px; height: 17px;
	border-radius: 20px; padding: 0 4px;
	margin-left: 4px; vertical-align: middle;
	line-height: 1;
}

@media (max-width: 540px) {
	.teachbd-cv-header { flex-direction: column; align-items: center; text-align: center; }
	.teachbd-cv-meta-row { justify-content: center; }
	.teachbd-cv-price { justify-content: center; }
	.teachbd-cv-bookmark { position: static; margin-top: 12px; align-self: center; }
	.teachbd-cv-body { padding: 0 16px 20px; }
	.ee-card-info-grid { grid-template-columns: 1fr; }
}

/* =====================================================================
   BOOKINGS KANBAN BOARD
===================================================================== */
.teachbd-kanban {
	display: flex; gap: 14px; overflow-x: auto; padding-bottom: 12px;
	font-family: 'Work Sans', sans-serif;
}
.teachbd-kanban-col { flex: 0 0 250px; background: #f5f5f6; border-radius: 14px; padding: 10px; }
.teachbd-kanban-col-head {
	display: flex; justify-content: space-between; align-items: center; padding: 8px 10px 10px;
	font-weight: 700; font-size: 13px; color: #100e29; border-bottom: 2px solid #e3def7; margin-bottom: 8px;
}
.teachbd-kanban-count { background: #fff; border-radius: 999px; padding: 1px 8px; font-size: 11px; color: #6f6e85; }
.teachbd-kanban-col-body { display: flex; flex-direction: column; gap: 8px; min-height: 60px; max-height: 70vh; overflow-y: auto; }
.teachbd-kanban-empty { text-align: center; font-size: 11.5px; color: #adadc2; padding: 16px 0; margin: 0; }
.teachbd-kanban-card {
	background: #fff; border: 1px solid #e3def7; border-radius: 10px; padding: 12px;
	box-shadow: 0 2px 6px rgba(16,14,41,0.05);
}
.teachbd-kanban-card-people { display: flex; align-items: center; gap: 4px; flex-wrap: wrap; margin-bottom: 6px; }
.teachbd-kanban-card-people button {
	background: none; border: none; padding: 0; color: #3a2d97; font-weight: 600; font-size: 12px;
	cursor: pointer; text-decoration: underline;
}
.teachbd-kanban-x { font-size: 11px; color: #adadc2; }
/* v-fix -- explicit Teacher/Guardian role tags next to bare names, so a card
   never shows two names with no indication which one is which. */
.teachbd-kanban-card-role { display: flex; align-items: center; gap: 4px; }
.teachbd-kanban-role-tag { font-size: 10px; color: #6f6e85; font-weight: 500; }
.teachbd-role-tag { font-size: 11px; color: #6f6e85; font-weight: 500; }
.teachbd-kanban-card-subject { font-size: 12px; color: #46455c; margin-bottom: 4px; display: flex; align-items: center; gap: 5px; flex-wrap: wrap; }
/* v3.3 — Booking ID badge so two cards with the same names/subject are always distinguishable */
.teachbd-kanban-card-id { font-size: 10px; color: #9ca3af; background: #f3f4f6; border-radius: 4px; padding: 1px 5px; font-family: monospace; flex-shrink: 0; }
.teachbd-kanban-card-date { font-size: 11px; color: #6f6e85; margin-bottom: 2px; }
.teachbd-kanban-card-actions { margin-top: 8px; display: flex; flex-direction: column; gap: 6px; }
.teachbd-kanban-card-actions form { display: flex; flex-wrap: wrap; gap: 4px; }
.teachbd-kanban-card-actions input, .teachbd-kanban-card-actions select {
	font-size: 11px; padding: 4px 6px; border: 1px solid #e3def7; border-radius: 6px; flex: 1; min-width: 60px;
}
.teachbd-kanban-cancel { background: none; border: none; color: #b32d2e; font-size: 11px; text-decoration: underline; cursor: pointer; padding: 2px 0; }
.teachbd-kanban-col-requested, .teachbd-kanban-col-admin_invited { border-bottom-color: #5b8def; }
.teachbd-kanban-col-teacher_accepted { border-bottom-color: #8b6fe8; }
.teachbd-kanban-col-fee_pending, .teachbd-kanban-col-fee_submitted { border-bottom-color: #e0a93b; }
.teachbd-kanban-col-live { border-bottom-color: #2e9e6c; }
.teachbd-kanban-col-closed { border-bottom-color: #b32d2e; }

/* =====================================================================
   JOB POSTS — responsive card grid
===================================================================== */
.teachbd-jobpost-grid {
	display: grid; grid-template-columns: repeat(auto-fit, minmax(420px, 1fr)); gap: 18px;
	font-family: 'Work Sans', sans-serif;
}
.teachbd-jobpost-card {
	background: #fff; border: 1px solid #e3def7; border-left: 4px solid #5b8def; border-radius: 14px;
	padding: 18px 20px; box-shadow: 0 2px 10px rgba(16,14,41,0.04);
}
.teachbd-jobpost-status-fulfilled { border-left-color: #2e9e6c; }
.teachbd-jobpost-status-closed { border-left-color: #b32d2e; }
.teachbd-jobpost-card-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; margin-bottom: 8px; }
.teachbd-jobpost-card-head h3 { font-family: 'Fraunces', serif; font-size: 16px; margin: 0 0 4px; color: #100e29; }
.teachbd-jobpost-meta { font-size: 12px; color: #6f6e85; margin: 0; }
.teachbd-jobpost-meta button { background: none; border: none; padding: 0; color: #3a2d97; font-weight: 600; cursor: pointer; text-decoration: underline; font-size: inherit; }
.teachbd-jobpost-desc { font-size: 13px; color: #46455c; margin: 0 0 6px; }
.teachbd-jobpost-posted { font-size: 11px; color: #adadc2; margin: 0 0 10px; }
.teachbd-jobpost-applicants { font-size: 12px; margin: 0 0 10px; }
.teachbd-jobpost-candidates { border-top: 1px solid #ece8fb; padding-top: 10px; display: flex; flex-direction: column; gap: 8px; }
.teachbd-jobpost-candidate { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 6px 8px; border-radius: 8px; transition: background 0.15s; }
.teachbd-jobpost-candidate:hover { background: #faf9ff; }
.teachbd-jobpost-candidate-check { margin: 0; }
.teachbd-jobpost-candidate-name { background: none; border: none; padding: 0; color: #100e29; font-weight: 600; font-size: 13px; cursor: pointer; text-decoration: underline; }
.teachbd-jobpost-candidate-bar { flex: 1; min-width: 50px; height: 6px; background: #ece8fb; border-radius: 999px; overflow: hidden; }
.teachbd-jobpost-candidate-bar span { display: block; height: 100%; background: linear-gradient(90deg, #5b46d6, #8b6fe8); }
.teachbd-jobpost-candidate-pct { font-size: 11px; font-weight: 700; color: #3a2d97; width: 34px; text-align: right; }
@media (max-width: 500px) { .teachbd-jobpost-grid { grid-template-columns: 1fr; } }

/* =====================================================================
   ADMIN DETAIL MODAL — click a teacher/guardian name anywhere in admin
===================================================================== */
.teachbd-admin-modal-header { display: flex; gap: 16px; align-items: center; margin-bottom: 16px; }
.teachbd-admin-modal-photo { width: 64px; height: 64px; border-radius: 50%; object-fit: cover; flex-shrink: 0; }
.teachbd-admin-modal-initial {
	display: flex; align-items: center; justify-content: center; background: #ece8fb; color: #3a2d97;
	font-family: 'Fraunces', serif; font-weight: 600; font-size: 26px;
}
.teachbd-admin-modal-header h2 { margin: 0 0 4px; font-size: 20px; }
.teachbd-admin-modal-header h2 small { color: #6f6e85; font-size: 13px; font-weight: 400; }
.teachbd-admin-modal-header p { margin: 0; font-size: 13px; }
.teachbd-admin-modal-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 20px; padding-bottom: 16px; border-bottom: 1px solid #e3def7; }
.teachbd-admin-modal-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
@media (max-width: 700px) { .teachbd-admin-modal-grid { grid-template-columns: 1fr; } }
.teachbd-admin-modal-grid h4 { font-family: 'Fraunces', serif; font-size: 14px; font-weight: 600; color: #3a2d97; margin: 16px 0 6px; }
.teachbd-admin-modal-grid h4:first-child { margin-top: 0; }
.teachbd-admin-modal-grid p { font-size: 13px; margin: 0 0 8px; color: #46455c; }
.teachbd-admin-modal-grid table { font-size: 12px; margin-bottom: 14px; }

/* =====================================================================
   AUTH GATE — replaces the old bare "please log in" dead end
===================================================================== */
.teachbd-auth-gate { max-width: 480px; margin: 30px auto; font-family: 'Work Sans', sans-serif; }
.teachbd-auth-gate-tabs { display: flex; gap: 10px; border-bottom: none; margin-bottom: 22px; flex-wrap: wrap; }

/* ── Redesigned Login / Register buttons (Tutor + Guardian portals) ──
   Scoped strictly to the auth-gate tabs so no other .teachbd-tab usage
   (dashboard tabs, Explore filters, etc.) is affected. */
.teachbd-auth-gate-tabs .teachbd-tab {
	flex: 1 1 auto;
	min-width: 150px;
	text-align: center;
	background: #f4f2fc;
	color: #3a2d97;
	border: 1.5px solid #e3def7 !important;
	border-radius: 999px;
	padding: 13px 22px;
	font-size: 14px;
	font-weight: 700;
	letter-spacing: .15px;
	box-shadow: 0 3px 12px -5px rgba(58,45,151,.20);
	transition: transform .2s ease, box-shadow .2s ease, background .2s ease, color .2s ease, border-color .2s ease;
}
.teachbd-auth-gate-tabs .teachbd-tab:hover {
	background: #ece8fb;
	color: #3a2d97;
	border-color: #c9bdf2 !important;
	transform: translateY(-2px) scale(1.02);
	box-shadow: 0 8px 20px -6px rgba(58,45,151,.30);
}
.teachbd-auth-gate-tabs .teachbd-tab.is-active {
	background: linear-gradient(135deg, #3a2d97 0%, #5b46d6 100%);
	color: #fff;
	border-color: transparent !important;
	box-shadow: 0 10px 24px -6px rgba(58,45,151,.48);
}
.teachbd-auth-gate-tabs .teachbd-tab.is-active:hover {
	transform: translateY(-2px) scale(1.03);
	box-shadow: 0 12px 28px -6px rgba(58,45,151,.55);
}
.teachbd-auth-gate-tabs .teachbd-tab:active { transform: translateY(0) scale(.99); }
.teachbd-auth-gate-tabs .teachbd-tab:focus-visible {
	outline: 2.5px solid #5b46d6;
	outline-offset: 2px;
}

/* ── "Post a Job" callout inside the Guardian auth gate ──
   Helps guardians realise registering is the first step to posting a job. */
.teachbd-auth-gate-postjob-cta {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	flex-wrap: wrap;
	background: linear-gradient(120deg, #78350f 0%, #b45309 55%, #d97706 100%);
	border-radius: 16px;
	padding: 16px 20px;
	margin-bottom: 22px;
	box-shadow: 0 8px 22px -8px rgba(180,83,9,.35);
}
.teachbd-auth-gate-postjob-text {
	color: #fff;
	font-size: 13.5px;
	line-height: 1.4;
	max-width: 320px;
}
.teachbd-auth-gate-postjob-text strong {
	display: block;
	font-family: 'Fraunces', serif;
	font-size: 16px;
	margin-bottom: 2px;
}
.teachbd-auth-gate-postjob-btn {
	background: #fff;
	color: #92400e;
	border: none;
	border-radius: 999px;
	padding: 12px 22px;
	font-weight: 700;
	font-size: 13.5px;
	cursor: pointer;
	white-space: nowrap;
	box-shadow: 0 4px 14px -4px rgba(0,0,0,.25);
	transition: transform .2s ease, box-shadow .2s ease;
}
.teachbd-auth-gate-postjob-btn:hover {
	transform: translateY(-2px) scale(1.03);
	box-shadow: 0 8px 20px -4px rgba(0,0,0,.3);
}

@media (max-width: 520px) {
	.teachbd-auth-gate-tabs { flex-direction: column; }
	.teachbd-auth-gate-tabs .teachbd-tab { width: 100%; min-width: 0; }
	.teachbd-auth-gate-postjob-cta { flex-direction: column; align-items: stretch; text-align: center; }
	.teachbd-auth-gate-postjob-text { max-width: none; }
	.teachbd-auth-gate-postjob-btn { width: 100%; }
}

.teachbd-auth-gate form p { margin-bottom: 14px; }
.teachbd-auth-gate input[type=text], .teachbd-auth-gate input[type=password] {
	width: 100%; padding: 10px 12px; border: 1.5px solid #d3d8de; border-radius: 8px; font-size: 14px;
}
.teachbd-auth-gate label { font-weight: 600; font-size: 13px; display: block; margin-bottom: 5px; }
.teachbd-auth-gate input[type=submit] {
	background: #3a2d97; color: #fff; border: none; padding: 11px 22px; border-radius: 999px;
	font-weight: 700; cursor: pointer; font-size: 14px;
}
.teachbd-auth-gate input[type=submit]:hover { background: #5b46d6; }

/* ---------- Individual profile page ---------- */
.teachbd-profile-header { display: flex; gap: 22px; align-items: center; margin-bottom: 28px; flex-wrap: wrap; }
.teachbd-profile-avatar { width: 96px; height: 96px; border-radius: 50%; object-fit: cover; border: 3px solid #ece8fb; }
.teachbd-profile-header h2 { font-family: 'Fraunces', serif; font-size: 28px; font-weight: 600; margin: 0 0 8px; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.teachbd-profile-meta { color: #6f6e85; font-size: 14.5px; margin: 0; }
.teachbd-profile-title { font-size: 13.5px; color: #5b46d6; font-weight: 600; margin: 2px 0 6px; }
.teachbd-pill-row { display: flex; flex-wrap: wrap; gap: 6px; margin: 6px 0 10px !important; }
.teachbd-pill {
	display: inline-flex; align-items: center; font-family: 'Work Sans', sans-serif;
	font-size: 11.5px; font-weight: 600; padding: 4px 11px; border-radius: 999px;
}
.teachbd-privacy-note {
	background: #ece8fb; color: #3a2d97; border-radius: 12px; padding: 14px 18px;
	font-size: 13.5px; font-weight: 600; margin-bottom: 26px;
}

.teachbd-inquiry-box { background: #faf9ff; border: 1px solid #e3def7; border-radius: 16px; padding: 26px; }
.teachbd-inquiry-box h4 { font-family: 'Fraunces', serif; font-size: 17px; font-weight: 600; margin: 0 0 16px; color: #100e29; }
.teachbd-inquiry-box form { display: flex; flex-direction: column; gap: 12px; }
.teachbd-inquiry-box input, .teachbd-inquiry-box textarea {
	padding: 11px 14px; border: 1.5px solid #d3d7dd; border-radius: 10px; font-size: 14px;
	font-family: inherit; background: #fff;
}
.teachbd-inquiry-box input:focus, .teachbd-inquiry-box textarea:focus {
	outline: none; border-color: #5b46d6; box-shadow: 0 0 0 3px rgba(91,70,214,.15);
}
.teachbd-inquiry-box .teachbd-btn { background: #3a2d97; border-radius: 999px; padding: 13px 24px; align-self: flex-start; }
.teachbd-inquiry-box .teachbd-btn:hover { background: #5b46d6; }
.teachbd-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; }
.teachbd-inquiry-error { color: #b3261e; font-size: 13px; margin-bottom: 10px; min-height: 1em; }
.teachbd-inquiry-success { background: #e9f7f2; color: #1f9c8c; padding: 12px 16px; border-radius: 10px; font-size: 14px; margin-bottom: 10px; }

@media (max-width: 640px) {
	.teachbd-profile-header { flex-direction: column; align-items: flex-start; }
}

/* ==========================================================================
   Login Form Specific Styles
   ========================================================================== */
.teachbd-login-wrap { max-width: 480px; }
.teachbd-login-register-prompt {
	max-width: 480px; margin: 18px auto 0; padding-top: 18px; border-top: 1px solid #e3def7;
	text-align: center;
}
.teachbd-login-register-prompt p { margin: 0 0 10px; font-size: 13.5px; color: #6f6e85; }
.teachbd-login-register-prompt .teachbd-btn { text-decoration: none; display: inline-block; margin: 0 4px; }
@media (max-width: 480px) {
	.teachbd-login-register-prompt .teachbd-btn { display: block; margin: 6px 0; }
}
.teachbd-login-forgot-link {
	font-size: 12.5px; color: #3a2d97; text-decoration: none; font-weight: 500;
}
.teachbd-login-forgot-link:hover { text-decoration: underline; }
.teachbd-login-error {
	background: #fef2f2; border: 1px solid #fca5a5; color: #b91c1c;
	border-radius: 10px; padding: 11px 16px; font-size: 13px;
	margin-bottom: 16px; line-height: 1.5; display: none;
}

/* ==========================================================================
   Modern Form Design System  (.teachbd-frm-*)
   Used by: Guardian Registration, Job Post Form
   ========================================================================== */

/* Outer wrapper */
.teachbd-form-modern {
	font-family: 'Work Sans', sans-serif;
	max-width: 620px;
	margin: 0 auto;
	padding: 0 16px 48px;
	color: #100e29;
}

/* Hero block */
.teachbd-frm-hero {
	text-align: center;
	padding: 40px 24px 32px;
}
.teachbd-frm-hero-icon {
	font-size: 48px;
	line-height: 1;
	display: block;
	margin-bottom: 14px;
}
.teachbd-frm-hero-title {
	font-family: 'Fraunces', serif;
	font-size: 28px;
	font-weight: 700;
	color: #100e29;
	margin: 0 0 8px;
	line-height: 1.2;
}
.teachbd-frm-hero-sub {
	font-size: 15px;
	color: #6f6e85;
	margin: 0;
	line-height: 1.6;
}

/* Section group */
.teachbd-frm-section {
	background: #fff;
	border: 1px solid #e3def7;
	border-radius: 16px;
	padding: 24px 28px 20px;
	margin-bottom: 20px;
	box-shadow: 0 4px 16px -8px rgba(16,14,41,.10);
}
.teachbd-frm-section-label {
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .6px;
	color: #3a2d97;
	margin: 0 0 18px;
	display: flex;
	align-items: center;
	gap: 8px;
}
.teachbd-frm-step {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	background: #3a2d97;
	color: #fff;
	font-size: 11px;
	font-weight: 700;
	flex-shrink: 0;
}
.teachbd-frm-section-note {
	font-size: 12px;
	color: #6f6e85;
	margin-top: 10px;
	font-style: italic;
}

/* Field */
.teachbd-frm-field {
	margin-bottom: 18px;
}
.teachbd-frm-field:last-child {
	margin-bottom: 0;
}
.teachbd-frm-label {
	display: block;
	font-size: 13px;
	font-weight: 600;
	color: #100e29;
	margin-bottom: 7px;
}
.teachbd-frm-req {
	color: #e05240;
	margin-left: 2px;
}
.teachbd-frm-optional {
	font-weight: 400;
	color: #adadc2;
	font-size: 11px;
	margin-left: 4px;
	font-style: italic;
}

/* Inputs & selects */
.teachbd-frm-input {
	width: 100%;
	box-sizing: border-box;
	padding: 11px 16px;
	border: 1.5px solid #d3cdf0;
	border-radius: 10px;
	font-size: 14px;
	font-family: 'Work Sans', sans-serif;
	color: #100e29;
	background: #faf9ff;
	transition: border-color .18s ease, box-shadow .18s ease;
	-webkit-appearance: none;
	appearance: none;
}
.teachbd-frm-input:focus {
	outline: none;
	border-color: #5b46d6;
	box-shadow: 0 0 0 3px rgba(91,70,214,.14);
	background: #fff;
}
.teachbd-frm-input::placeholder {
	color: #c0bdd8;
}
select.teachbd-frm-input {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236f6e85' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 12px center;
	padding-right: 40px;
	cursor: pointer;
}

/* Two-column row */
.teachbd-frm-row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 16px;
}
@media (max-width: 500px) {
	.teachbd-frm-row { grid-template-columns: 1fr; gap: 0; }
}

/* Phone prefix wrapper */
.teachbd-frm-phone-wrap {
	display: flex;
	align-items: stretch;
	border: 1.5px solid #d3cdf0;
	border-radius: 10px;
	overflow: hidden;
	background: #faf9ff;
	transition: border-color .18s ease, box-shadow .18s ease;
}
.teachbd-frm-phone-wrap:focus-within {
	border-color: #5b46d6;
	box-shadow: 0 0 0 3px rgba(91,70,214,.14);
	background: #fff;
}
.teachbd-frm-phone-prefix {
	padding: 11px 14px;
	background: #ece8fb;
	color: #3a2d97;
	font-size: 13px;
	font-weight: 700;
	border-right: 1.5px solid #d3cdf0;
	white-space: nowrap;
	flex-shrink: 0;
}
.teachbd-frm-phone-wrap .teachbd-frm-input {
	border: none;
	border-radius: 0;
	box-shadow: none;
	background: transparent;
	flex: 1;
}
.teachbd-frm-phone-wrap .teachbd-frm-input:focus {
	box-shadow: none;
	border: none;
}

/* Password tip box */
.teachbd-frm-password-tip {
	background: #fff8e1;
	border: 1px solid #ffe082;
	border-radius: 10px;
	padding: 12px 16px;
	font-size: 12.5px;
	color: #7a5800;
	line-height: 1.6;
	margin-bottom: 14px;
}
.teachbd-frm-password-tip strong {
	color: #5a3e00;
}

/* Password show/hide wrapper */
.teachbd-frm-password-wrap {
	position: relative;
}
.teachbd-frm-password-wrap .teachbd-frm-input {
	padding-right: 48px;
}
.teachbd-frm-eye {
	position: absolute;
	right: 12px;
	top: 50%;
	transform: translateY(-50%);
	background: none;
	border: none;
	cursor: pointer;
	font-size: 17px;
	color: #6f6e85;
	padding: 4px;
	line-height: 1;
}
.teachbd-frm-eye:hover { color: #3a2d97; }

/* Password strength meter */
.teachbd-frm-strength {
	margin-top: 8px;
	height: 4px;
	border-radius: 4px;
	background: #e3def7;
	overflow: hidden;
	transition: all .3s ease;
}
.teachbd-frm-strength-bar {
	height: 100%;
	border-radius: 4px;
	width: 0%;
	transition: width .3s ease, background .3s ease;
}
.teachbd-frm-strength-label {
	font-size: 11px;
	color: #6f6e85;
	margin-top: 5px;
	min-height: 1em;
}

/* For-whom radio cards */
.teachbd-for-whom-row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 12px;
	margin-bottom: 4px;
}
@media (max-width: 480px) {
	.teachbd-for-whom-row { grid-template-columns: 1fr; }
}
.teachbd-for-whom-option {
	display: block;
	cursor: pointer;
}
.teachbd-for-whom-option input[type="radio"] {
	position: absolute;
	opacity: 0;
	width: 0;
	height: 0;
}
.teachbd-for-whom-card {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	gap: 6px;
	border: 2px solid #d3cdf0;
	border-radius: 12px;
	padding: 18px 12px;
	background: #faf9ff;
	transition: border-color .18s ease, background .18s ease, box-shadow .18s ease;
}
.teachbd-for-whom-card:hover {
	border-color: #8b6fe8;
	background: #f3f0fd;
}
.teachbd-for-whom-option input[type="radio"]:checked + .teachbd-for-whom-card {
	border-color: #3a2d97;
	background: #ece8fb;
	box-shadow: 0 0 0 3px rgba(58,45,151,.12);
}
.teachbd-for-whom-icon {
	font-size: 28px;
	line-height: 1;
}
.teachbd-for-whom-title {
	font-size: 14px;
	font-weight: 700;
	color: #100e29;
}
.teachbd-for-whom-desc {
	font-size: 11px;
	color: #6f6e85;
	line-height: 1.4;
}

/* Checkbox grid for subjects */
.teachbd-frm-checkbox-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
	gap: 8px;
}
.teachbd-frm-check-label {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 13px;
	color: #100e29;
	cursor: pointer;
	padding: 8px 12px;
	border: 1.5px solid #e3def7;
	border-radius: 8px;
	background: #faf9ff;
	transition: border-color .15s, background .15s;
}
.teachbd-frm-check-label:hover {
	border-color: #8b6fe8;
	background: #f3f0fd;
}
.teachbd-frm-check-label input[type="checkbox"] {
	accent-color: #3a2d97;
	width: 15px;
	height: 15px;
	flex-shrink: 0;
}
.teachbd-frm-check-label:has(input:checked) {
	border-color: #3a2d97;
	background: #ece8fb;
}

/* Submit button */
.teachbd-frm-submit {
	display: block;
	width: 100%;
	padding: 15px 24px;
	background: linear-gradient(135deg, #3a2d97 0%, #5b46d6 100%);
	color: #fff;
	font-family: 'Work Sans', sans-serif;
	font-size: 15px;
	font-weight: 700;
	border: none;
	border-radius: 12px;
	cursor: pointer;
	text-align: center;
	transition: opacity .2s ease, transform .2s ease, box-shadow .2s ease;
	box-shadow: 0 8px 24px -8px rgba(58,45,151,.45);
	margin-top: 8px;
}
.teachbd-frm-submit:hover {
	opacity: .93;
	transform: translateY(-1px);
	box-shadow: 0 12px 28px -8px rgba(58,45,151,.55);
}
.teachbd-frm-submit:active {
	transform: translateY(0);
}

/* Login / register link at bottom */
.teachbd-frm-login-link {
	text-align: center;
	font-size: 13px;
	color: #6f6e85;
	margin-top: 20px;
}
.teachbd-frm-login-link a {
	color: #3a2d97;
	font-weight: 600;
	text-decoration: none;
}
.teachbd-frm-login-link a:hover {
	text-decoration: underline;
}

/* Error / notice messages inside forms */
.teachbd-frm-error {
	background: #fef2f2;
	border: 1px solid #fca5a5;
	color: #b91c1c;
	border-radius: 10px;
	padding: 12px 16px;
	font-size: 13px;
	margin-bottom: 20px;
	line-height: 1.5;
}
.teachbd-frm-success {
	background: #ecfdf5;
	border: 1px solid #6ee7b7;
	color: #065f46;
	border-radius: 10px;
	padding: 12px 16px;
	font-size: 13px;
	margin-bottom: 20px;
	line-height: 1.5;
}

/* ==========================================================================
   Guest Prompt Banner (Browse Tutors — not logged in)
   ========================================================================== */
.teachbd-guest-prompt {
	background: linear-gradient(135deg, #3a2d97 0%, #5b46d6 100%);
	border-radius: 16px;
	padding: 20px 24px;
	margin-bottom: 28px;
	box-shadow: 0 8px 28px -10px rgba(58,45,151,.4);
}
.teachbd-guest-prompt-inner {
	display: flex;
	align-items: center;
	gap: 16px;
	flex-wrap: wrap;
}
.teachbd-guest-prompt-icon {
	font-size: 32px;
	flex-shrink: 0;
}
.teachbd-guest-prompt-text {
	flex: 1;
	min-width: 200px;
	color: rgba(255,255,255,.9);
	font-size: 14px;
	line-height: 1.5;
}
.teachbd-guest-prompt-text strong {
	display: block;
	color: #fff;
	font-size: 15px;
	font-weight: 700;
	margin-bottom: 3px;
}
.teachbd-guest-prompt-actions {
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
}
.teachbd-guest-prompt-actions .teachbd-btn {
	background: #fff;
	color: #3a2d97;
	font-weight: 700;
	border: 2px solid #fff;
}
.teachbd-guest-prompt-actions .teachbd-btn:hover {
	background: rgba(255,255,255,.9);
}
.teachbd-btn-outline {
	background: transparent !important;
	color: #fff !important;
	border: 2px solid rgba(255,255,255,.7) !important;
}
.teachbd-btn-outline:hover {
	border-color: #fff !important;
	background: rgba(255,255,255,.12) !important;
}
@media (max-width: 600px) {
	.teachbd-guest-prompt-inner { flex-direction: column; align-items: flex-start; }
	.teachbd-guest-prompt-actions { width: 100%; }
	.teachbd-guest-prompt-actions .teachbd-btn { flex: 1; text-align: center; }
}

/* ==========================================================================
   Responsive tweaks for modern forms on mobile
   ========================================================================== */
@media (max-width: 480px) {
	.teachbd-frm-section { padding: 18px 16px 16px; }
	.teachbd-frm-hero-title { font-size: 22px; }
	.teachbd-frm-checkbox-grid { grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); }
}

/* ==========================================================================
   Demo Slot Counter
   ========================================================================== */
.teachbd-slot-counter {
	display: flex;
	align-items: center;
	gap: 14px;
	background: linear-gradient(135deg,#f4f2fe 0%,#ece8fb 100%);
	border: 1px solid #d8d2f5;
	border-radius: 14px;
	padding: 14px 18px;
	margin-bottom: 24px;
}
.teachbd-slot-counter-empty {
	background: linear-gradient(135deg,#fef2f2 0%,#fee2e2 100%);
	border-color: #fca5a5;
}
.teachbd-slot-pips {
	display: flex;
	gap: 6px;
	flex-shrink: 0;
}
.teachbd-slot-pip {
	width: 18px;
	height: 18px;
	border-radius: 50%;
	background: #e3def7;
	border: 2px solid #c4bbee;
	transition: background .25s, border-color .25s;
}
.teachbd-slot-pip.used {
	background: linear-gradient(135deg,#5b46d6,#8b6fe8);
	border-color: #4a38c4;
}
.teachbd-slot-counter-empty .teachbd-slot-pip.used {
	background: linear-gradient(135deg,#ef4444,#dc2626);
	border-color: #b91c1c;
}
.teachbd-slot-text {
	display: flex;
	flex-direction: column;
	gap: 2px;
}
.teachbd-slot-text strong {
	font-size: 14px;
	font-weight: 700;
	color: #100e29;
}
.teachbd-slot-counter-empty .teachbd-slot-text strong {
	color: #b91c1c;
}
.teachbd-slot-text span {
	font-size: 12px;
	color: #6f6e85;
}

/* ==========================================================================
   Status Cards (hired / not-hired / pending outcomes)
   ========================================================================== */
.teachbd-status-card {
	border-radius: 12px;
	padding: 16px 18px;
	margin-bottom: 14px;
	display: flex;
	align-items: flex-start;
	gap: 14px;
}
.teachbd-status-card-pending {
	background: #fefce8;
	border: 1px solid #fde68a;
}
.teachbd-status-card-not-hired {
	background: #fef2f2;
	border: 1px solid #fca5a5;
}
.teachbd-status-card-hired {
	background: #f0fdf4;
	border: 1px solid #86efac;
}
.teachbd-status-card-icon {
	font-size: 22px;
	flex-shrink: 0;
	margin-top: 2px;
}
.teachbd-status-card-body {
	flex: 1;
}
.teachbd-status-card-body strong {
	display: block;
	font-size: 14px;
	font-weight: 700;
	color: #100e29;
	margin-bottom: 3px;
}
.teachbd-status-card-body p {
	font-size: 13px;
	color: #6f6e85;
	margin: 0;
	line-height: 1.55;
}

/* ==========================================================================
   Status Pills — not_hired + teacher_accepted
   ========================================================================== */
.teachbd-status-not_hired {
	background: #fee2e2;
	color: #991b1b;
}
.teachbd-status-teacher_accepted {
	background: #dbeafe;
	color: #1e3a8a;
}
.teachbd-status-fee_pending {
	background: #fef9c3;
	color: #713f12;
}
.teachbd-status-fee_submitted {
	background: #ede9fe;
	color: #3a2d97;
}
.teachbd-status-fee_verified,
.teachbd-status-active {
	background: #dcfce7;
	color: #14532d;
}

/* Highlight row for not-hired bookings in guardian table */
.teachbd-row-not-hired td {
	background: #fff5f5;
	color: #7f1d1d;
}
.teachbd-row-not-hired td:first-child {
	border-left: 3px solid #ef4444;
}

/* ==========================================================================
   Invite / Demo Schedule Meta (teacher portal)
   ========================================================================== */
.teachbd-invite-meta {
	display: flex;
	gap: 14px;
	flex-wrap: wrap;
	font-size: 12.5px;
	color: #6f6e85;
	margin: 8px 0 12px;
}
.teachbd-invite-date {
	display: flex;
	align-items: center;
	gap: 5px;
	font-weight: 600;
	color: #3a2d97;
}
.teachbd-invite-mode {
	display: flex;
	align-items: center;
	gap: 5px;
}
.teachbd-invite-actions {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
	margin-top: 12px;
}

/* ==========================================================================
   Hired Banner (teacher billing tab)
   ========================================================================== */
.teachbd-hired-banner {
	display: flex;
	align-items: center;
	gap: 16px;
	background: linear-gradient(135deg,#065f46 0%,#047857 100%);
	border-radius: 14px;
	padding: 18px 22px;
	margin-bottom: 20px;
	color: #fff;
}
.teachbd-hired-check {
	font-size: 40px;
	flex-shrink: 0;
}
.teachbd-hired-banner-text strong {
	display: block;
	font-size: 17px;
	font-weight: 700;
	margin-bottom: 3px;
}
.teachbd-hired-banner-text p {
	font-size: 13px;
	opacity: .85;
	margin: 0;
}

/* ==========================================================================
   Fee Breakdown Table
   ========================================================================== */
.teachbd-fee-breakdown {
	background: #f8f7ff;
	border: 1px solid #e3def7;
	border-radius: 12px;
	overflow: hidden;
	margin-bottom: 20px;
}
.teachbd-fee-row {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 11px 16px;
	font-size: 13.5px;
	border-bottom: 1px solid #ece8fb;
}
.teachbd-fee-row:last-child {
	border-bottom: none;
}
.teachbd-fee-row-highlight {
	background: linear-gradient(90deg,#ede9fe,#f4f2fe);
	font-weight: 700;
	color: #3a2d97;
	font-size: 15px;
}
.teachbd-fee-row span:first-child {
	color: #4b5563;
}

/* ==========================================================================
   Fee Submitted Card (payment under review)
   ========================================================================== */
.teachbd-fee-submitted-card {
	display: flex;
	align-items: flex-start;
	gap: 14px;
	background: linear-gradient(135deg,#ede9fe 0%,#ddd6fe 100%);
	border: 1px solid #c4b5fd;
	border-radius: 12px;
	padding: 16px 18px;
	margin-bottom: 18px;
}
.teachbd-fee-submitted-card .icon {
	font-size: 26px;
	flex-shrink: 0;
}
.teachbd-fee-submitted-card strong {
	display: block;
	font-size: 14px;
	font-weight: 700;
	color: #3a2d97;
	margin-bottom: 3px;
}
.teachbd-fee-submitted-card p {
	font-size: 13px;
	color: #5b46d6;
	margin: 0;
}
/* v-fix — the emoji icon div actually rendered with class
   .teachbd-fee-submitted-icon, not .icon as this file's selector above
   expected, so it was never getting sized/aligned. Additive fix, the
   .icon rule above is untouched in case anything else still uses it. */
.teachbd-fee-submitted-icon { font-size: 26px; flex-shrink: 0; line-height: 1; }
/* v-new — green "resolved" variant for a verified/paid platform fee,
   reusing the same card layout so a teacher who already paid sees a
   clear success state here instead of the panel silently going quiet. */
.teachbd-fee-verified-card { background: linear-gradient(135deg,#e7f9ee 0%,#c9f2d9 100%); border-color: #86e0ac; }
.teachbd-fee-verified-card strong { color: #1a7a42; }
.teachbd-fee-verified-card p { color: #1f8a4c; margin-bottom: 10px; }

/* ==========================================================================
   Fee Payment Form (teacher billing tab)
   ========================================================================== */
.teachbd-fee-form {
	background: #fff;
	border: 1px solid #e3def7;
	border-radius: 14px;
	padding: 22px;
	margin-top: 6px;
}
.teachbd-fee-form h4 {
	font-size: 15px;
	font-weight: 700;
	color: #100e29;
	margin: 0 0 14px;
}
.teachbd-fee-instruction {
	background: #fefce8;
	border: 1px solid #fde68a;
	border-radius: 10px;
	padding: 12px 14px;
	font-size: 13px;
	color: #713f12;
	margin-bottom: 18px;
	line-height: 1.55;
}
.teachbd-file-label {
	display: block;
	font-size: 13px;
	font-weight: 600;
	color: #374151;
	margin-bottom: 6px;
}

/* ==========================================================================
   No Demo Slots Remaining message
   ========================================================================== */
.teachbd-no-slots-msg {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	font-size: 12px;
	font-weight: 600;
	color: #991b1b;
	background: #fee2e2;
	border: 1px solid #fca5a5;
	border-radius: 999px;
	padding: 4px 12px;
}

/* ==========================================================================
   Panel description helper
   ========================================================================== */
.teachbd-panel-desc {
	font-size: 13.5px;
	color: #6f6e85;
	margin: -4px 0 20px;
	line-height: 1.6;
}

/* ==========================================================================
   Pricing UI — Teacher & Guardian portals
   ========================================================================== */

/* Warning / rules box */
.teachbd-price-warning-box {
	background: #fffbeb;
	border: 1px solid #fde68a;
	border-radius: 12px;
	padding: 14px 16px;
	margin-bottom: 18px;
}
.teachbd-price-warning-box ul {
	margin: 6px 0 0 16px;
	padding: 0;
	font-size: 13px;
	color: #713f12;
	line-height: 1.7;
}
/* v4.0 — bilingual (Bengali) price-warning text */
.teachbd-price-warning-bn {
	margin: 10px 0 0;
	padding-top: 10px;
	border-top: 1px dashed #fde68a;
	font-size: 13px;
	color: #713f12;
	line-height: 1.8;
}

/* Current price status row */
.teachbd-price-status-row {
	display: flex;
	align-items: center;
	gap: 10px;
	background: #f5f3ff;
	border: 1px solid #e3def7;
	border-radius: 12px;
	padding: 12px 16px;
	margin-bottom: 12px;
}
.teachbd-price-current {
	display: flex;
	align-items: baseline;
	gap: 6px;
}
.teachbd-price-amount {
	font-size: 22px;
	font-weight: 800;
	color: var(--ee-primary, #3a2d97);
}
.teachbd-price-unset {
	font-size: 14px;
	color: #9ca3af;
	font-style: italic;
}
.teachbd-price-type-badge {
	display: inline-block;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .03em;
	text-transform: uppercase;
	background: #e0e7ff;
	color: #3730a3;
	border-radius: 999px;
	padding: 2px 9px;
}

/* Lock badge */
.teachbd-price-lock-status {
	margin-left: auto;
}
.teachbd-price-badge {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	font-size: 12px;
	font-weight: 700;
	border-radius: 999px;
	padding: 4px 12px;
	white-space: nowrap;
}
.teachbd-price-badge-unset {
	background: #f3f4f6;
	color: #6b7280;
	border: 1px solid #d1d5db;
}
.teachbd-price-badge-cooldown {
	background: #fff7ed;
	color: #c2410c;
	border: 1px solid #fed7aa;
}
.teachbd-price-badge-demolocked {
	background: #fee2e2;
	color: #991b1b;
	border: 1px solid #fca5a5;
}
.teachbd-price-badge-final {
	background: #dcfce7;
	color: #166534;
	border: 1px solid #86efac;
}

/* Countdown span inside cooldown badge */
.teachbd-countdown {
	font-variant-numeric: tabular-nums;
	font-weight: 800;
}

/* Notice strip for cooldown / demo-lock */
.teachbd-price-locked-notice {
	background: #fff7ed;
	border: 1px solid #fed7aa;
	border-radius: 10px;
	padding: 10px 14px;
	font-size: 13px;
	color: #92400e;
	margin-bottom: 14px;
	line-height: 1.55;
}
.teachbd-price-locked-notice.is-demolocked {
	background: #fee2e2;
	border-color: #fca5a5;
	color: #991b1b;
}

/* Price form */
.teachbd-price-form {
	background: #fff;
	border: 1px solid #e3def7;
	border-radius: 14px;
	padding: 20px;
	margin-top: 4px;
}
.teachbd-price-form h4 {
	font-size: 15px;
	font-weight: 700;
	color: var(--ee-ink, #100e29);
	margin: 0 0 14px;
}

/* Toggle: overall / per-subject */
.teachbd-price-type-toggle {
	display: flex;
	gap: 8px;
	margin-bottom: 16px;
}
.teachbd-price-toggle-opt {
	display: flex;
	align-items: center;
	gap: 5px;
	font-size: 13px;
	font-weight: 600;
	color: #374151;
	cursor: pointer;
	background: #f5f3ff;
	border: 1.5px solid #c4b5fd;
	border-radius: 999px;
	padding: 6px 14px;
	transition: background .15s, border-color .15s;
}
.teachbd-price-toggle-opt input[type=radio] {
	accent-color: var(--ee-primary, #3a2d97);
}
.teachbd-price-toggle-opt:has(input:checked) {
	background: var(--ee-primary, #3a2d97);
	border-color: var(--ee-primary, #3a2d97);
	color: #fff;
}

/* Single price input row */
.teachbd-price-label {
	display: block;
	font-size: 13px;
	font-weight: 600;
	color: #374151;
	margin-bottom: 6px;
}
.teachbd-price-input-row {
	display: flex;
	align-items: center;
	gap: 6px;
	margin-bottom: 14px;
}
.teachbd-price-currency {
	font-size: 16px;
	font-weight: 700;
	color: var(--ee-primary, #3a2d97);
}
.teachbd-price-input {
	width: 140px;
	border: 1.5px solid #c4b5fd;
	border-radius: 8px;
	padding: 7px 10px;
	font-size: 15px;
	color: var(--ee-ink, #100e29);
}
.teachbd-price-input:focus {
	outline: none;
	border-color: var(--ee-primary, #3a2d97);
	box-shadow: 0 0 0 3px rgba(91,70,214,.12);
}

/* Per-subject grid */
.teachbd-price-subjects-grid {
	display: grid;
	gap: 8px;
	margin-bottom: 14px;
}
.teachbd-price-subject-row {
	display: flex;
	align-items: center;
	gap: 8px;
}
.teachbd-price-subject-label {
	width: 100px;
	font-size: 13px;
	font-weight: 600;
	color: #374151;
}
.teachbd-price-subjects-note {
	font-size: 12px;
	color: #9ca3af;
	margin-bottom: 14px;
}

/* Bookmarks card price row */
.teachbd-card-price-row {
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 12.5px;
	margin: 4px 0;
}
.teachbd-card-price-label {
	color: #6b7280;
}
.teachbd-card-price-val {
	font-weight: 700;
	color: var(--ee-primary, #3a2d97);
}

/* Price gate message on cards */
.teachbd-price-gate-msg {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	font-size: 12px;
	font-weight: 600;
	color: #92400e;
	background: #fff7ed;
	border: 1px solid #fed7aa;
	border-radius: 999px;
	padding: 4px 12px;
	cursor: help;
}

/* ==========================================================================
   Admin: Booking card price context panel
   ========================================================================== */
.teachbd-admin-price-context {
	background: #f0f9ff;
	border: 1px solid #bae6fd;
	border-radius: 10px;
	padding: 10px 12px;
	margin-bottom: 10px;
	font-size: 12px;
}
.teachbd-admin-price-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	padding: 3px 0;
}
.teachbd-admin-price-label {
	color: #374151;
	font-weight: 500;
}
.teachbd-admin-price-val {
	font-weight: 700;
	color: #0c4a6e;
}
.teachbd-admin-price-val.is-unset {
	color: #9ca3af;
	font-weight: 400;
	font-style: italic;
}
.teachbd-admin-price-val.is-override {
	color: #9f1239;
}
.teachbd-admin-price-val.is-effective {
	color: #166534;
}
.teachbd-admin-price-override-active {
	background: #fff1f2;
	border-radius: 6px;
	margin: 2px -4px;
	padding: 3px 4px;
}
.teachbd-admin-price-effective {
	border-top: 1px solid #bae6fd;
	margin-top: 4px;
	padding-top: 5px;
}
.teachbd-admin-override-form input[type=number] {
	border: 1px solid #bae6fd;
	border-radius: 6px;
	padding: 4px 7px;
	color: #100e29;
}
.teachbd-admin-override-warn {
	font-size: 11px;
	color: #b32d2e;
	margin: 4px 0 0;
}

/* ==========================================================================
   Admin Panel: Unified Front-End Form Styles
   Overrides WordPress admin defaults so all TeachBD admin forms look
   identical to the front-end forms teachers and guardians see.
   ========================================================================== */

/* Wrapper card — same as front-end .teachbd-form-wrap */
body.wp-admin .teachbd-admin-form-wrap {
	max-width: 720px;
	margin-top: 20px;
}
body.wp-admin .teachbd-admin-form-wrap h2 {
	font-family: 'Fraunces', serif;
	font-size: 22px;
	font-weight: 600;
	color: #100e29;
	margin: 0 0 6px;
}

/* Reset WP admin input styles within teachbd-form */
body.wp-admin .teachbd-form input[type="text"],
body.wp-admin .teachbd-form input[type="email"],
body.wp-admin .teachbd-form input[type="password"],
body.wp-admin .teachbd-form input[type="number"],
body.wp-admin .teachbd-form input[type="date"],
body.wp-admin .teachbd-form input[type="time"],
body.wp-admin .teachbd-form input[type="file"],
body.wp-admin .teachbd-form input[type="tel"],
body.wp-admin .teachbd-form select,
body.wp-admin .teachbd-form textarea {
	display: block !important;
	width: 100% !important;
	max-width: 100% !important;
	margin-top: 7px !important;
	padding: 11px 14px !important;
	border: 1.5px solid #e3def7 !important;
	border-radius: 10px !important;
	font-size: 14px !important;
	font-family: 'Work Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
	color: #100e29 !important;
	background: #faf9ff !important;
	box-sizing: border-box !important;
	transition: border-color 0.15s ease, box-shadow 0.15s ease !important;
	box-shadow: none !important;
	height: auto !important;
	line-height: 1.5 !important;
}
body.wp-admin .teachbd-form input[type="text"]:focus,
body.wp-admin .teachbd-form input[type="email"]:focus,
body.wp-admin .teachbd-form input[type="password"]:focus,
body.wp-admin .teachbd-form input[type="number"]:focus,
body.wp-admin .teachbd-form input[type="date"]:focus,
body.wp-admin .teachbd-form input[type="time"]:focus,
body.wp-admin .teachbd-form select:focus,
body.wp-admin .teachbd-form textarea:focus {
	outline: none !important;
	border-color: #5b46d6 !important;
	background: #fff !important;
	box-shadow: 0 0 0 3px rgba(91, 70, 214, 0.12) !important;
}
body.wp-admin .teachbd-form label {
	display: block !important;
	margin-bottom: 16px !important;
	font-weight: 600 !important;
	font-size: 13.5px !important;
	color: #46455c !important;
}
body.wp-admin .teachbd-form h3 {
	font-family: 'Fraunces', serif !important;
	font-size: 16px !important;
	font-weight: 600 !important;
	color: #3a2d97 !important;
	margin: 28px 0 16px !important;
	padding-top: 20px !important;
	border-top: 1px solid #ece8fb !important;
}
body.wp-admin .teachbd-form h3:first-of-type {
	margin-top: 4px !important;
	padding-top: 0 !important;
	border-top: none !important;
}
body.wp-admin .teachbd-form select {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236f6e85' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E") !important;
	background-repeat: no-repeat !important;
	background-position: right 12px center !important;
	-webkit-appearance: none !important;
	appearance: none !important;
	padding-right: 40px !important;
}
body.wp-admin .teachbd-form .teachbd-btn {
	margin-top: 10px;
}
body.wp-admin .teachbd-form .teachbd-help {
	display: block;
	font-size: 12px;
	color: #8a7fb0;
	margin-top: 4px;
	margin-bottom: 12px;
	font-weight: 400;
}
body.wp-admin .teachbd-form .teachbd-checkbox-inline {
	display: flex;
	align-items: center;
	gap: 9px;
	font-weight: 500;
	font-size: 13.5px;
}
body.wp-admin .teachbd-form .teachbd-checkbox-inline input[type="checkbox"] {
	width: auto !important;
	height: auto !important;
	margin: 0 !important;
	display: inline !important;
	accent-color: #5b46d6;
}
body.wp-admin .teachbd-form .teachbd-form-row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 16px;
}
@media (max-width: 700px) {
	body.wp-admin .teachbd-form .teachbd-form-row { grid-template-columns: 1fr; }
}

/* ==========================================================================
   Login Page: Enhanced Branded Design
   Upgrades the existing .teachbd-form-modern login form with a stronger
   branded look — gradient bg, elevated card shadow, color-bar accent.
   ========================================================================== */

/* Outer login wrapper gets a soft gradient background */
.teachbd-login-wrap.teachbd-form-modern {
	max-width: 520px;
	padding: 0;
}
.teachbd-login-wrap .teachbd-frm-hero {
	background: linear-gradient(135deg, #3a2d97 0%, #5b46d6 60%, #8b6fe8 100%);
	border-radius: 20px 20px 0 0;
	padding: 36px 32px 28px;
	text-align: center;
	position: relative;
	overflow: hidden;
}
.teachbd-login-wrap .teachbd-frm-hero::before {
	content: '';
	position: absolute;
	top: -40px; right: -40px;
	width: 160px; height: 160px;
	background: rgba(255,255,255,.08);
	border-radius: 50%;
}
.teachbd-login-wrap .teachbd-frm-hero::after {
	content: '';
	position: absolute;
	bottom: -60px; left: -30px;
	width: 200px; height: 200px;
	background: rgba(255,255,255,.05);
	border-radius: 50%;
}
.teachbd-login-wrap .teachbd-frm-hero-icon {
	font-size: 52px;
	line-height: 1;
	display: block;
	margin-bottom: 14px;
	position: relative;
	z-index: 1;
	filter: drop-shadow(0 4px 12px rgba(0,0,0,.25));
}
.teachbd-login-wrap .teachbd-frm-hero-title {
	color: #fff;
	font-size: 28px;
	font-weight: 700;
	margin: 0 0 6px;
	position: relative;
	z-index: 1;
	text-shadow: 0 2px 8px rgba(0,0,0,.2);
}
.teachbd-login-wrap .teachbd-frm-hero-sub {
	color: rgba(255,255,255,.82);
	font-size: 14px;
	position: relative;
	z-index: 1;
}
.teachbd-login-wrap .teachbd-frm-section {
	border-radius: 0 0 20px 20px;
	border-top: none;
	padding: 28px 32px 28px;
	box-shadow: 0 12px 48px -12px rgba(58,45,151,.22);
}
.teachbd-login-wrap .teachbd-frm-input {
	border-radius: 12px;
	padding: 13px 16px;
	font-size: 15px;
}
.teachbd-login-wrap .teachbd-frm-submit {
	padding: 16px 28px;
	font-size: 16px;
	border-radius: 14px;
	letter-spacing: .2px;
}
.teachbd-login-forgot-link {
	color: #5b46d6;
	font-size: 13px;
	font-weight: 600;
	text-decoration: none;
}
.teachbd-login-forgot-link:hover {
	text-decoration: underline;
	color: #3a2d97;
}

/* ==========================================================================
   Teacher Slot Cards — Bookmarked / Browse view (redesigned)
   ========================================================================== */

/* Bookmarked card grid shares .teachbd-matches-grid */
.teachbd-match-card-accent {
	height: 4px;
	background: linear-gradient(90deg, #3a2d97 0%, #8b6fe8 50%, #c084fc 100%);
	flex-shrink: 0;
}
.teachbd-match-card.is-premium .teachbd-match-card-accent {
	background: linear-gradient(90deg, #6b21a8, #a855f7, #e879f9);
}
.teachbd-match-card.is-verified .teachbd-match-card-accent {
	background: linear-gradient(90deg, #047857, #10b981, #34d399);
}

/* Card header */
.teachbd-match-card-header {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	padding: 18px 18px 0;
}
.teachbd-match-avatar-wrap {
	position: relative;
	flex-shrink: 0;
}
.teachbd-match-avatar {
	width: 58px;
	height: 58px;
	border-radius: 50%;
	object-fit: cover;
	border: 2.5px solid #ece8fb;
	display: block;
	transition: border-color .18s;
}
.teachbd-match-card:hover .teachbd-match-avatar { border-color: #a78bfa; }
.teachbd-match-verified-tick {
	position: absolute;
	bottom: -2px;
	right: -2px;
	width: 18px;
	height: 18px;
	background: #10b981;
	color: #fff;
	border-radius: 50%;
	font-size: 10px;
	font-weight: 800;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 2px solid #fff;
}
.teachbd-match-identity {
	flex: 1;
	min-width: 0;
}
.teachbd-match-badges {
	display: flex;
	gap: 4px;
	flex-wrap: wrap;
	margin-bottom: 5px;
}
.teachbd-match-name {
	font-family: 'Fraunces', serif;
	font-size: 16px;
	font-weight: 600;
	color: #100e29;
	display: block;
	margin: 0 0 3px;
}
.teachbd-match-title {
	font-size: 12px;
	color: #6f6e85;
	margin: 0;
}
.teachbd-cv-bookmark {
	font-size: 18px;
	background: none;
	border: none;
	cursor: pointer;
	padding: 2px;
	line-height: 1;
	flex-shrink: 0;
	opacity: .7;
	transition: opacity .15s, transform .15s;
}
.teachbd-cv-bookmark:hover { opacity: 1; transform: scale(1.15); }

/* Subject chips */
.teachbd-match-subjects-wrap {
	display: flex;
	flex-wrap: wrap;
	gap: 5px;
	padding: 12px 18px 0;
}
.teachbd-match-subj-chip {
	font-size: 11.5px;
	font-weight: 600;
	color: #5b46d6;
	background: #ede9fe;
	border-radius: 999px;
	padding: 3px 10px;
	transition: background .15s, color .15s;
}
.teachbd-match-card:hover .teachbd-match-subj-chip { background: #ddd6fe; color: #3a2d97; }
.teachbd-match-subj-more {
	color: #8b6fe8;
	background: #f3f0ff;
}

/* Fact row */
.teachbd-match-facts {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	padding: 10px 18px;
}
.teachbd-match-fact {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	font-size: 12px;
	color: #6f6e85;
}
.teachbd-match-fact-icon {
	font-size: 13px;
	flex-shrink: 0;
}

/* Pricing card */
.teachbd-match-price-card {
	margin: 4px 18px 0;
	background: linear-gradient(135deg, #f8f7ff 0%, #ede9fe 100%);
	border: 1px solid #ddd6fe;
	border-radius: 12px;
	padding: 12px 16px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
}
.teachbd-match-price-inner {
	display: flex;
	flex-direction: column;
	gap: 1px;
}
.teachbd-match-price-label {
	font-size: 10.5px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .5px;
	color: #8b6fe8;
}
.teachbd-match-price-amount {
	font-size: 20px;
	font-weight: 800;
	color: #3a2d97;
	font-family: 'Space Mono', monospace;
}
.teachbd-match-price-amount span {
	font-size: 13px;
	font-weight: 400;
	color: #8b6fe8;
}

/* Card footer CTA */
.teachbd-match-card-footer {
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 14px 18px 18px;
	margin-top: auto;
}

/* "View Full Profile" button — creative arrow button */
.teachbd-match-profile-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	width: 100%;
	padding: 12px 20px;
	background: linear-gradient(135deg, #3a2d97 0%, #5b46d6 100%);
	color: #fff;
	font-family: 'Work Sans', sans-serif;
	font-size: 13.5px;
	font-weight: 700;
	border: none;
	border-radius: 10px;
	cursor: pointer;
	text-decoration: none;
	transition: opacity .18s, transform .18s, box-shadow .18s;
	box-shadow: 0 4px 14px -4px rgba(58,45,151,.40);
	letter-spacing: .2px;
}
.teachbd-match-profile-btn:hover {
	opacity: .92;
	transform: translateY(-2px);
	box-shadow: 0 8px 20px -4px rgba(58,45,151,.50);
}
.teachbd-match-profile-btn:active { transform: translateY(0); }
.teachbd-match-profile-btn svg {
	flex-shrink: 0;
	transition: transform .18s;
}
.teachbd-match-profile-btn:hover svg { transform: translateX(3px); }

/* Demo request button */
.teachbd-match-demo-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	width: 100%;
	padding: 10px 16px;
	background: #fff;
	color: #3a2d97;
	font-family: 'Work Sans', sans-serif;
	font-size: 13px;
	font-weight: 700;
	border: 2px solid #e3def7;
	border-radius: 10px;
	cursor: pointer;
	transition: background .15s, border-color .15s, color .15s, transform .15s;
}
.teachbd-match-demo-btn:hover {
	background: #ede9fe;
	border-color: #a78bfa;
	color: #3a2d97;
	transform: translateY(-1px);
}
.teachbd-match-demo-btn.is-free {
	background: linear-gradient(135deg, #047857, #10b981);
	border-color: transparent;
	color: #fff;
	box-shadow: 0 4px 14px -4px rgba(4,120,87,.35);
}
.teachbd-match-demo-btn.is-free:hover {
	opacity: .9;
	border-color: transparent;
	color: #fff;
}

/* ee-tutor-card "View profile →" link — upgrade to button style */
.ee-tc-view-link {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 12.5px;
	font-weight: 700;
	color: #5b46d6;
	background: #ede9fe;
	border-radius: 999px;
	padding: 5px 14px;
	transition: background .15s, color .15s, transform .15s;
}
.ee-tutor-card:hover .ee-tc-view-link {
	background: #3a2d97;
	color: #fff;
	transform: translateX(2px);
}

/* Responsive */
@media (max-width: 480px) {
	.teachbd-match-card-header { padding: 14px 14px 0; }
	.teachbd-match-subjects-wrap { padding: 10px 14px 0; }
	.teachbd-match-facts { padding: 8px 14px; }
	.teachbd-match-price-card { margin: 4px 14px 0; }
	.teachbd-match-card-footer { padding: 12px 14px 14px; }
}

/* ============================================================
   TBC CARD — redesigned teacher slot card (v15)
   Matches the sample design: avatar+ID+gender pill header,
   sectioned body (fee, teach, edu, location, travel),
   stats footer + dark "View Full Profile" button.
   ============================================================ */

/* Grid that holds the cards */
.ee-tutor-grid,
.teachbd-matches-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
	gap: 20px;
	align-items: start;
}

/* ── Card shell ─────────────────────────────────────── */
.tbc-card {
	background: #fff;
	border: 1px solid #e8e4f8;
	border-radius: 16px;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	box-shadow: 0 4px 20px -8px rgba(58,45,151,.13);
	transition: transform .22s cubic-bezier(.34,1.3,.64,1),
	            box-shadow .22s ease,
	            border-color .18s;
}
/* v-fix — "View Full Profile" inline expansion: while a card's profile
   is expanded, its own overflow:hidden (there only to clip the rounded
   top photo corners) must not clip the expanded content underneath it.
   Grids that hold these cards use align-items:start, so one card
   growing taller never overlaps or gets clipped by its row neighbours. */
.tbc-card.has-expanded-profile { overflow: visible; }
.teachbd-profile-expand {
	border-top: 1px solid #e8e4f8;
	background: #faf9ff;
	padding: 4px 0 0;
}
.teachbd-profile-expand .teachbd-cv-modal { border-radius: 0; }
/* v-fix — "looks like two copied versions expanding": the collapsed
   card above already shows the photo, name, verified badge, price,
   location and CTA — render_profile() was designed to stand alone (it
   used to be the whole modal), so its own header repeated all of that
   almost verbatim right underneath. Since this is now always shown
   directly below that same card, the header and footer/CTA are pure
   duplication; hiding them here leaves only what's actually NEW —
   education, per-subject pricing, availability, teaching style,
   languages, bio, etc. — which is what "expand for details" should
   mean. Nothing server-side changes: render_profile() still returns
   its full self-contained output for the (still-registered) AJAX/admin
   paths, this only trims the view when it's embedded inline. */
/* v-fix — the Save/Saved bookmark toggle lives inside this header and
   is the ONLY place to bookmark a teacher from the Matches / Browse
   Tutors views (the Saved Teachers tab has its own separate unbookmark
   button, but those two don't) — hiding the whole header would have
   silently removed the ability to save a teacher from those two tabs.
   Keep the header (and just the bookmark button in it), hide only the
   photo/name/badges/rating/price block that duplicates the card above. */
.teachbd-profile-expand .teachbd-cv-avatar-wrap,
.teachbd-profile-expand .teachbd-cv-identity { display: none; }
.teachbd-profile-expand .teachbd-cv-header {
	background: none;
	padding: 14px 20px 0;
	justify-content: flex-end;
}
.teachbd-profile-expand .teachbd-cv-bookmark {
	/* was styled in white for the dark gradient header, which is now
	   gone in this trimmed view — restyle to match the light card. */
	position: static;
	background: #ece8fb;
	border-color: #d8d1f5;
	color: #3a2d97;
	backdrop-filter: none;
}
.teachbd-profile-expand .teachbd-cv-bookmark:hover { background: #ddd6fb; border-color: #c3b8f2; }
.teachbd-profile-expand .teachbd-cv-footer { display: none; }
.teachbd-profile-expand .teachbd-cv-body { padding-top: 4px; }
/* v-fix -- "still looks clumsy / double information": the collapsed
   card's own CAN TEACH and CAN TRAVEL TO chip sections already list
   every subject and travel area (with a "+N" overflow badge), so
   render_profile()'s Subjects and Can Travel To sections repeated the
   exact same words underneath. Hide just those two (tagged with
   --subjects / --travel modifier classes) inside the expand panel
   only -- Pricing by Subject, Education, Levels & Medium, Availability,
   Teaching Mode, Style & Skills, Languages and About are all genuinely
   new info not shown on the card, so they stay. */
.teachbd-profile-expand .teachbd-cv-section--subjects,
.teachbd-profile-expand .teachbd-cv-section--travel { display: none; }
/* v-fix -- "demo requests should be at the end": the Request-Demo /
   Select-&-Request CTA used to sit in the collapsed card's footer,
   ahead of all the profile detail sections once expanded -- read the
   details, THEN decide, is the more natural order. It's now appended
   as the last block inside the expand panel. It's a plain sibling of
   .teachbd-cv-modal (not nested inside .teachbd-cv-body), so it needs
   its own matching 28px side padding, and a light teal-tinted band
   (echoing the teal "Request Demo" button colour used throughout) to
   read as the deliberate final call-to-action rather than a stray
   leftover form. */
.teachbd-profile-expand .teachbd-cv-section--demo-cta {
	padding: 18px 28px 22px;
	margin-top: 4px;
	background: #f1f8f6;
	border-top: 1px solid #e8e4f8;
}
.teachbd-profile-expand .teachbd-cv-section--demo-cta .teachbd-cv-section-label { color: #1f8a7a; }
.teachbd-profile-expand-toggle.is-expanded { background: #312e81; }
.tbc-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 14px 40px -10px rgba(58,45,151,.22);
	border-color: #c4b5fd;
}
.tbc-card.is-premium { border-color: #a78bfa; }
.tbc-card.is-featured { border-top: 3px solid #3a2d97; }

/* ── Match-score bar (matched teachers only) ─────── */
.tbc-score-bar {
	height: 5px;
	background: #ece8fb;
	position: relative;
	flex-shrink: 0;
}
.tbc-score-fill {
	height: 100%;
	background: linear-gradient(90deg, #3a2d97, #8b6fe8);
	transition: width .7s ease;
}
.tbc-score-label {
	position: absolute;
	right: 10px;
	top: 7px;
	font-size: 10px;
	font-weight: 800;
	color: #3a2d97;
	letter-spacing: .4px;
	text-transform: uppercase;
}

/* ── Card HEAD: avatar + identity ──────────────────── */
.tbc-head {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	padding: 16px 16px 12px;
	border-bottom: 1px solid #f3f0fc;
	position: relative;
}

/* Avatar circle */
.tbc-avatar-wrap {
	position: relative;
	flex-shrink: 0;
}
.tbc-avatar {
	width: 60px;
	height: 60px;
	border-radius: 50%;
	object-fit: cover;
	border: 2.5px solid #e3def7;
	display: block;
	transition: border-color .18s;
}
.tbc-card:hover .tbc-avatar { border-color: #a78bfa; }

.tbc-verified-tick {
	position: absolute;
	bottom: 0;
	right: -2px;
	width: 18px;
	height: 18px;
	background: #10b981;
	color: #fff;
	border-radius: 50%;
	border: 2px solid #fff;
	font-size: 9px;
	font-weight: 800;
	display: flex;
	align-items: center;
	justify-content: center;
	line-height: 1;
}

/* Identity block */
.tbc-identity {
	flex: 1;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 3px;
}
.tbc-identity-badges {
	display: flex;
	gap: 5px;
	flex-wrap: wrap;
	margin-bottom: 2px;
}
.tbc-badge {
	font-size: 9.5px;
	font-weight: 700;
	border-radius: 999px;
	padding: 2px 8px;
	letter-spacing: .3px;
	text-transform: uppercase;
}
.tbc-badge-featured { background: #fef9c3; color: #854d0e; }
.tbc-badge-verified  { background: #dcfce7; color: #166534; }
.tbc-badge-hired     { background: #fee2e2; color: #991b1b; }
.tbc-badge-unverified { background: #f3f4f6; color: #6b7280; border: 1px solid #e5e7eb; }

.tbc-name {
	font-family: 'Fraunces', serif;
	font-size: 16px;
	font-weight: 700;
	color: #100e29;
	margin: 0;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.tbc-id {
	font-size: 10px;
	color: #9c99b8;
	letter-spacing: .3px;
	margin: 0;
	font-family: 'Space Mono', monospace;
}
.tbc-meta-pills {
	display: flex;
	flex-wrap: wrap;
	gap: 5px;
	margin-top: 3px;
}
.tbc-pill {
	font-size: 10.5px;
	font-weight: 600;
	border-radius: 999px;
	padding: 2px 9px;
	letter-spacing: .2px;
}
.tbc-pill-gender  { background: #dbeafe; color: #1e40af; }
.tbc-pill-country { background: #f1f5f9; color: #475569; }

/* Bookmark button (saved-teachers section) */
.tbc-bm-btn {
	background: none;
	border: none;
	font-size: 16px;
	cursor: pointer;
	padding: 2px;
	line-height: 1;
	flex-shrink: 0;
	opacity: .7;
	transition: opacity .15s, transform .15s;
}
.tbc-bm-btn:hover { opacity: 1; transform: scale(1.15); }

/* ── Section rows ───────────────────────────────────── */
.tbc-section {
	padding: 10px 16px;
	border-bottom: 1px solid #f3f0fc;
}
.tbc-section:last-of-type { border-bottom: none; }

.tbc-section-label {
	font-size: 9.5px;
	font-weight: 800;
	letter-spacing: .8px;
	text-transform: uppercase;
	color: #9c99b8;
	margin: 0 0 7px;
}

/* v4.9.39 — About snippet on the collapsed card (marketing hook) */
.tbc-about-snippet {
	font-size: 12.5px;
	line-height: 1.55;
	color: #4b4763;
	margin: 0;
}

/* Fee box */
.tbc-fee-box {
	background: linear-gradient(135deg, #f0fdf4, #dcfce7);
	border: 1px solid #bbf7d0;
	border-radius: 10px;
	padding: 10px 14px;
	display: flex;
	align-items: baseline;
	gap: 8px;
}
.tbc-fee-amount {
	font-family: 'Space Mono', monospace;
	font-size: 22px;
	font-weight: 800;
	color: #166534;
	line-height: 1;
}
.tbc-fee-period {
	font-size: 11px;
	color: #16a34a;
	font-weight: 600;
}
.tbc-fee-from {
	font-size: 10.5px;
	font-weight: 700;
	text-transform: uppercase;
	color: #16a34a;
	letter-spacing: .3px;
}
.tbc-fee-note {
	font-size: 11px;
	color: #9c99b8;
	margin: 6px 0 0;
}

/* v4.2 — full profile: per-subject price breakdown table */
.teachbd-cv-price-table { display: flex; flex-direction: column; gap: 6px; }
.teachbd-cv-price-row {
	display: flex; align-items: center; justify-content: space-between; gap: 12px;
	background: #faf9ff; border: 1px solid #ece8fb; border-radius: 8px; padding: 8px 12px;
}
.teachbd-cv-price-row-subject { font-size: 13.5px; font-weight: 600; color: #3a2d97; }
.teachbd-cv-price-row-amount { font-family: 'Space Mono', monospace; font-size: 13.5px; font-weight: 700; color: #166534; }
.teachbd-cv-price-row-total {
	background: #f0fdf4; border-color: #bbf7d0; margin-top: 2px;
}
.teachbd-cv-price-row-total .teachbd-cv-price-row-subject { color: #100e29; }
.teachbd-cv-price-row-total .teachbd-cv-price-row-amount { font-size: 15px; }
.teachbd-cv-price-table-note { font-size: 11.5px; color: #9c99b8; margin: 8px 0 0; line-height: 1.5; }

/* Subject + travel chips */
.tbc-chips-wrap {
	display: flex;
	flex-wrap: wrap;
	gap: 5px;
}
.tbc-chip {
	font-size: 11.5px;
	font-weight: 600;
	color: #374151;
	background: #f9fafb;
	border: 1px solid #e5e7eb;
	border-radius: 6px;
	padding: 3px 10px;
	transition: background .15s, border-color .15s;
}
.tbc-chip:hover { background: #ede9fe; border-color: #c4b5fd; color: #3a2d97; }
.tbc-chip-travel { background: #eff6ff; border-color: #bfdbfe; color: #1d4ed8; }
.tbc-chip-travel:hover { background: #dbeafe; border-color: #93c5fd; }
.tbc-chip-more { background: #fafafa; color: #9c99b8; border-color: #e5e7eb; }

/* Education box */
.tbc-edu-box {
	background: #fafafa;
	border: 1px solid #f3f0fc;
	border-radius: 8px;
	padding: 9px 12px;
}
.tbc-edu-inst {
	font-size: 13px;
	font-weight: 700;
	color: #1e1b4b;
	display: block;
	margin-bottom: 3px;
}
.tbc-edu-loc,
.tbc-edu-dept,
.tbc-edu-cgpa {
	font-size: 11.5px;
	color: #6b7280;
	margin: 2px 0 0;
}
.tbc-edu-cgpa { font-weight: 700; color: #374151; }

/* Location box */
.tbc-loc-box {
	background: #fdf8ff;
	border: 1px solid #e9d5ff;
	border-radius: 8px;
	padding: 9px 12px;
}
.tbc-loc-box strong {
	font-size: 13px;
	font-weight: 700;
	color: #1e1b4b;
	display: block;
}
.tbc-loc-sub {
	font-size: 11.5px;
	color: #7c3aed;
	margin: 2px 0 0;
}

/* ── Footer ─────────────────────────────────────────── */
.tbc-footer {
	padding: 12px 16px;
	display: flex;
	flex-direction: column;
	gap: 8px;
	margin-top: auto;
	background: #fafaff;
	border-top: 1px solid #f3f0fc;
}

.tbc-stats {
	display: flex;
	gap: 14px;
	flex-wrap: wrap;
}
.tbc-stat {
	font-size: 11.5px;
	color: #6b7280;
	font-weight: 600;
}

/* View Full Profile button — dark navy, full width */
.tbc-view-btn {
	display: block;
	width: 100%;
	padding: 11px 16px;
	background: #1e1b4b;
	color: #fff;
	font-size: 13.5px;
	font-weight: 700;
	text-align: center;
	border: none;
	border-radius: 10px;
	cursor: pointer;
	letter-spacing: .2px;
	transition: background .18s, transform .18s, box-shadow .18s;
	box-shadow: 0 4px 14px -4px rgba(30,27,75,.35);
	font-family: 'Work Sans', -apple-system, sans-serif;
}
.tbc-view-btn:hover {
	background: #312e81;
	transform: translateY(-1px);
	box-shadow: 0 8px 20px -6px rgba(30,27,75,.45);
}
.tbc-view-btn:active { transform: translateY(0); }

/* Demo booking button */
.tbc-demo-form { margin: 0; }
.tbc-demo-btn {
	display: block;
	width: 100%;
	padding: 10px 16px;
	background: transparent;
	border: 2px solid #e3def7;
	border-radius: 10px;
	color: #3a2d97;
	font-size: 13px;
	font-weight: 700;
	cursor: pointer;
	transition: background .18s, border-color .18s, color .18s;
	font-family: 'Work Sans', -apple-system, sans-serif;
}
.tbc-demo-btn:hover { background: #ede9fe; border-color: #a78bfa; }
.tbc-demo-btn.is-free {
	background: linear-gradient(135deg, #047857, #10b981);
	border-color: transparent;
	color: #fff;
	box-shadow: 0 4px 12px -4px rgba(4,120,87,.4);
}
.tbc-demo-btn.is-free:hover { opacity: .92; }
/* v-fix -- "disabled buttons should visually change state to show the
   action is already taken" -- a one-time-action button left in its
   normal enabled look after being locked (e.g. "Already Requested")
   reads as broken/unclickable-by-accident rather than intentionally
   done. Applies to any submit button disabled by JS across the
   plugin's action forms, not just this one. */
button:disabled,
input[type="submit"]:disabled {
	cursor: not-allowed;
	opacity: .6;
	filter: grayscale(.3);
}
.tbc-demo-btn:disabled { background: #f3f2fa; border-color: #e3def7; color: #8a83ad; }
.tbc-demo-btn.is-free:disabled { background: #9ca3af; box-shadow: none; }

/* v4.9.39 — logged-out fallback CTA on the public teacher card (register/login to hire) */
.tbc-cta-note { margin: 0 0 8px; font-size: 12.5px; color: #6c6a82; line-height: 1.5; }
.tbc-cta-btn-row { display: flex; gap: 8px; }
.tbc-cta-btn-row .tbc-demo-btn { flex: 1; width: auto; text-align: center; text-decoration: none; }

/* v3.9 — exclusivity lock badge: shown on a teacher card to every guardian
   except the one currently holding the 15-minute selection hold. */
.tbc-locked-badge {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	width: 100%;
	padding: 10px 16px;
	background: #fef3c7;
	border: 2px solid #fde68a;
	border-radius: 10px;
	color: #92400e;
	font-size: 12.5px;
	font-weight: 700;
	text-align: center;
}

/* v4.0 — fully-booked / market-trust signals */
.tbc-card.is-fully-booked { opacity: .88; }
.tbc-fully-booked-ribbon {
	background: #7f1d1d;
	color: #fff;
	text-align: center;
	font-size: 11.5px;
	font-weight: 800;
	letter-spacing: .03em;
	padding: 7px 10px;
	border-radius: 12px 12px 0 0;
	margin: -1px -1px 10px -1px;
}
.tbc-locked-badge.tbc-fully-booked-badge {
	background: #fee2e2;
	border-color: #7f1d1d;
	color: #7f1d1d;
}
.teachbd-rating-stars {
	color: #d97706;
	font-size: 13px;
	letter-spacing: 1px;
}
.teachbd-rating-stars.teachbd-rating-none {
	color: #94a3b8;
	font-size: 11.5px;
	letter-spacing: normal;
	font-style: italic;
}
.teachbd-rating-num { color: #1e293b; font-weight: 700; font-size: 12px; margin-left: 2px; }
.teachbd-rating-count { color: #94a3b8; font-size: 11px; }

/* Gate / no-slots messages */
.tbc-no-slots-msg,
.tbc-gate-msg {
	font-size: 11.5px;
	color: #dc2626;
	font-weight: 600;
}
.tbc-gate-msg { color: #9c99b8; }

/* Free badge */
.tbc-free-badge {
	font-size: 11px;
	font-weight: 700;
	color: #166534;
	background: #dcfce7;
	border-radius: 999px;
	padding: 3px 10px;
	text-align: center;
}

/* ── Responsive ──────────────────────────────────────── */
@media (max-width: 480px) {
	.ee-tutor-grid,
	.teachbd-matches-grid {
		grid-template-columns: 1fr;
	}
	.tbc-name { font-size: 15px; }
	.tbc-fee-amount { font-size: 20px; }
}

/* ============================================================
   [teachbd_explore] — Accordion Browse Page
   ============================================================ */

/* Page wrapper — full-bleed breakout from narrow theme containers */
.tbexpl-page {
	font-family: 'Work Sans', -apple-system, sans-serif;
	box-sizing: border-box;
	width: 100%;
	padding-top: 24px; /* v3.7.0: breathing room above hero so it doesn't sit flush at the very top */
	overflow-x: hidden; /* v3.7.1: contains the header's mobile full-bleed breakout below */
	--tbexpl-bleed: calc(50% - 50vw); /* v3.7.3: single source of truth for the mobile full-bleed offset, used by header + container below instead of repeating the calc */
}
.tbexpl-page *,
.tbexpl-page *::before,
.tbexpl-page *::after {
	box-sizing: border-box;
}

/* ── Gradient header ── */
.tbexpl-header {
	background: linear-gradient(135deg, #1e1b4b 0%, #3a2d97 60%, #5b46d6 100%);
	padding: 52px 24px 72px;
	text-align: center;
	position: relative;
	overflow: hidden;
	margin-bottom: -28px;
}
.tbexpl-header::before {
	content: '';
	position: absolute;
	inset: 0;
	background: radial-gradient(ellipse 80% 60% at 50% 120%, rgba(255,255,255,.07) 0%, transparent 70%);
	pointer-events: none;
}
/* v3.7 — Home link added to the Explore header (point 2 of the v3.7 update) */
.tbexpl-header-links {
	display: flex;
	align-items: center;
	gap: 10px;
	flex-wrap: wrap;
	margin-bottom: 18px;
}
.tbexpl-home-link {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 6px 14px;
	font-size: 13.5px;
	font-weight: 600;
	color: rgba(255,255,255,.85);
	background: rgba(255,255,255,.08);
	border: 1px solid rgba(255,255,255,.18);
	border-radius: 999px;
	text-decoration: none;
	transition: background .15s ease, color .15s ease;
}
.tbexpl-home-link:hover {
	background: rgba(255,255,255,.16);
	color: #fff;
}
/* v4.1 — "Go to Dashboard" button, shown only when logged in */
.tbexpl-dashboard-link {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 6px 14px;
	font-size: 13.5px;
	font-weight: 700;
	color: #1e1b4b;
	background: #fde68a;
	border: 1px solid #fde68a;
	border-radius: 999px;
	text-decoration: none;
	transition: background .15s ease, transform .15s ease;
}
.tbexpl-dashboard-link:hover {
	background: #fcd34d;
	color: #1e1b4b;
	transform: translateY(-1px);
}
/* v-new — Login/Register buttons shown in the Explore header when logged
   out (mirrors .tbexpl-dashboard-link's shape/size, distinct colors per
   role so Guardian vs Tutor is obvious at a glance). */
.tbexpl-auth-link {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 6px 14px;
	font-size: 13.5px;
	font-weight: 700;
	border-radius: 999px;
	text-decoration: none;
	transition: background .15s ease, transform .15s ease;
}
.tbexpl-auth-link-guardian {
	color: #1e1b4b;
	background: #a7f3d0;
	border: 1px solid #a7f3d0;
}
.tbexpl-auth-link-guardian:hover {
	background: #6ee7b7;
	color: #1e1b4b;
	transform: translateY(-1px);
}
.tbexpl-auth-link-teacher {
	color: #fff;
	background: rgba(255,255,255,.14);
	border: 1px solid rgba(255,255,255,.32);
}
.tbexpl-auth-link-teacher:hover {
	background: rgba(255,255,255,.24);
	color: #fff;
	transform: translateY(-1px);
}
.tbexpl-header-title {
	font-family: 'Fraunces', serif;
	font-size: clamp(26px, 5vw, 44px);
	font-weight: 800;
	color: #fff;
	position: relative;
	letter-spacing: -.5px;
	line-height: 1.15;
	margin: 0 0 10px;
	text-wrap: balance; /* v3.7.3: avoids a long ragged first line on in-between viewport widths */
}
.tbexpl-header-title span { color: #c4b5fd; }
.tbexpl-header-sub {
	color: rgba(255,255,255,.72);
	font-size: 16px;
	position: relative;
	margin: 0 0 18px;
}
.tbexpl-header-chips {
	display: flex;
	justify-content: center;
	gap: 10px;
	flex-wrap: wrap;
	position: relative;
}
.tbexpl-hchip {
	background: rgba(255,255,255,.12);
	border: 1px solid rgba(255,255,255,.22);
	color: #e0d9ff;
	padding: 5px 14px;
	border-radius: 20px;
	font-size: 13px;
	font-weight: 500;
}

/* ── Accordion container ── */
.tbexpl-container {
	max-width: 1200px;
	margin: 0 auto 32px; /* v3.7.0: was 60px — now ~2x the inter-panel gap instead of ~4x, for a more uniform rhythm */
	padding: 0 20px;
	display: flex;
	flex-direction: column;
	gap: 16px;
	position: relative;
	z-index: 10;
}
.tbexpl-notice-success {
	padding: 12px 18px;
	background: #dcfce7;
	border: 1px solid #bbf7d0;
	border-radius: 10px;
	color: #166534;
	font-weight: 600;
	font-size: 14px;
}

/* ── Accordion panel ── */
.tbexpl-accordion {
	background: #fff;
	border-radius: 20px;
	border: none;
	box-shadow: 0 4px 24px -6px rgba(58,45,151,.13), 0 1px 4px rgba(0,0,0,.05);
	overflow: hidden;
	transition: box-shadow .3s, transform .2s;
}
.tbexpl-accordion:hover {
	box-shadow: 0 8px 36px -8px rgba(58,45,151,.20), 0 2px 8px rgba(0,0,0,.07);
	transform: translateY(-2px);
}
.tbexpl-accordion.tbexpl-open {
	box-shadow: 0 12px 48px -10px rgba(58,45,151,.22), 0 2px 8px rgba(0,0,0,.07);
	transform: translateY(0); /* don't lift when expanded */
}

/* ── Accordion trigger (header) — full-width gradient panels ── */
/* Force the button to behave as a proper full-width flex row
   regardless of any theme button resets */
button.tbexpl-trigger,
.tbexpl-trigger {
	display: -webkit-box !important;
	display: -ms-flexbox !important;
	display: flex !important;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	gap: 18px;
	padding: 24px 28px;
	cursor: pointer;
	width: 100% !important;
	min-width: 0;
	max-width: 100% !important;
	box-sizing: border-box !important;
	border: none !important;
	outline: none;
	text-align: left;
	font-family: inherit;
	position: relative;
	overflow: hidden;
	transition: filter .2s ease, box-shadow .2s ease;
}

/* Tutors trigger — deep indigo-to-violet */
#tbexpl-panel-tutors .tbexpl-trigger {
	background: linear-gradient(120deg, #1e1b4b 0%, #3a2d97 55%, #6d55e0 100%);
}
/* Jobs trigger — rich amber-to-orange */
#tbexpl-panel-jobs .tbexpl-trigger {
	background: linear-gradient(120deg, #78350f 0%, #b45309 55%, #d97706 100%);
}

/* Subtle shimmer overlay on hover */
button.tbexpl-trigger::after,
.tbexpl-trigger::after {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(90deg, transparent 40%, rgba(255,255,255,.08) 60%, transparent 80%);
	transform: translateX(-100%);
	transition: transform .55s ease;
	pointer-events: none;
}
button.tbexpl-trigger:hover::after,
.tbexpl-trigger:hover::after {
	transform: translateX(100%);
}
button.tbexpl-trigger:hover,
.tbexpl-trigger:hover {
	filter: brightness(1.08);
}

/* Icon bubble */
.tbexpl-trigger-icon {
	width: 52px;
	height: 52px;
	border-radius: 14px;
	display: -webkit-box !important;
	display: -ms-flexbox !important;
	display: flex !important;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	font-size: 24px;
	flex-shrink: 0;
	background: rgba(255,255,255,.18);
	border: 1.5px solid rgba(255,255,255,.28);
	box-shadow: 0 2px 8px rgba(0,0,0,.12);
}
/* Remove old colour-specific icon backgrounds */
.tbexpl-icon-tutors { background: rgba(255,255,255,.18); border-color: rgba(255,255,255,.28); }
.tbexpl-icon-jobs   { background: rgba(255,255,255,.18); border-color: rgba(255,255,255,.28); }

/* Label group */
.tbexpl-trigger-label {
	flex: 1 1 0;
	display: flex;
	flex-direction: column;
	gap: 3px;
	min-width: 0;
}
.tbexpl-trigger-title {
	font-family: 'Fraunces', serif;
	font-size: 20px;
	font-weight: 700;
	color: #fff;
	line-height: 1.2;
	text-shadow: 0 1px 3px rgba(0,0,0,.18);
}
.tbexpl-trigger-sub {
	font-size: 13.5px;
	color: rgba(255,255,255,.80);
	font-weight: 400;
}

/* Count pill */
.tbexpl-count {
	background: rgba(255,255,255,.20);
	border: 1px solid rgba(255,255,255,.35);
	color: #fff;
	font-family: 'Space Mono', monospace;
	font-size: 11.5px;
	font-weight: 700;
	padding: 5px 12px;
	border-radius: 20px;
	flex-shrink: 0;
	white-space: nowrap;
	backdrop-filter: blur(4px);
	transition: background .2s, border-color .2s;
}
.tbexpl-accordion.tbexpl-open .tbexpl-count {
	background: rgba(255,255,255,.32);
	border-color: rgba(255,255,255,.55);
}

/* Chevron arrow */
.tbexpl-arrow {
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background: rgba(255,255,255,.18);
	border: 1.5px solid rgba(255,255,255,.30);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	transition: transform .35s cubic-bezier(.34,1.3,.64,1), background .2s;
	color: #fff;
	font-size: 14px;
}
.tbexpl-accordion.tbexpl-open .tbexpl-arrow {
	transform: rotate(180deg);
	background: rgba(255,255,255,.30);
	border-color: rgba(255,255,255,.55);
}

/* ── Expand cue: a panel that is collapsed bounces its arrow gently and
   shows a small "Click to expand" pill, so first-time visitors immediately
   understand the headers are clickable. Both disappear the moment a panel
   is opened, and respect reduced-motion preferences. ── */
.tbexpl-accordion:not(.tbexpl-open) .tbexpl-arrow {
	animation: tbexpl-bounce-arrow 1.7s ease-in-out infinite;
}
@keyframes tbexpl-bounce-arrow {
	0%, 100% { transform: translateY(0); }
	50%      { transform: translateY(4px); }
}
.tbexpl-cue {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	margin-top: 7px;
	padding: 3px 11px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .2px;
	color: rgba(255,255,255,.95);
	background: rgba(255,255,255,.18);
	border: 1px solid rgba(255,255,255,.32);
	border-radius: 999px;
	width: fit-content;
	animation: tbexpl-cue-pulse 1.7s ease-in-out infinite;
}
.tbexpl-cue-arrow { display: inline-block; animation: tbexpl-bounce-arrow 1.7s ease-in-out infinite; }
@keyframes tbexpl-cue-pulse {
	0%, 100% { opacity: .75; }
	50%      { opacity: 1; }
}
.tbexpl-accordion.tbexpl-open .tbexpl-cue { display: none; }
@media (prefers-reduced-motion: reduce) {
	.tbexpl-arrow,
	.tbexpl-cue,
	.tbexpl-cue-arrow { animation: none !important; }
}

/* ── Accordion body ── */
.tbexpl-body {
	max-height: 0;
	overflow: hidden;
	transition: max-height .45s cubic-bezier(.4,0,.2,1);
}
.tbexpl-accordion.tbexpl-open .tbexpl-body { max-height: 9000px; }

.tbexpl-inner {
	padding: 0 24px 28px;
	border-top: 1px solid #e8e4f8;
}

/* ── Filter bar ── */
.tbexpl-filterbar {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 16px 0 18px;
	flex-wrap: wrap;
}
.tbexpl-search {
	flex: 1;
	min-width: 180px;
	height: 38px;
	border: 1.5px solid #e0dbf7;
	border-radius: 8px;
	padding: 0 14px;
	font-size: 13.5px;
	font-family: inherit;
	color: #100e29;
	outline: none;
	transition: border-color .15s;
}
.tbexpl-search:focus { border-color: #5b46d6; }
.tbexpl-select {
	height: 38px;
	border: 1.5px solid #e0dbf7;
	border-radius: 8px;
	padding: 0 10px;
	font-size: 13px;
	font-family: inherit;
	background: #fff;
	color: #100e29;
	cursor: pointer;
	outline: none;
	transition: border-color .15s;
}
.tbexpl-select:focus { border-color: #5b46d6; }
.tbexpl-clear-btn {
	height: 38px;
	padding: 0 16px;
	background: #fff;
	border: 1.5px solid #e0dbf7;
	border-radius: 8px;
	font-size: 13px;
	font-weight: 600;
	color: #6b6892;
	font-family: inherit;
	cursor: pointer;
	transition: background .15s, border-color .15s, color .15s;
}
.tbexpl-clear-btn:hover { background: #f5f3ff; border-color: #5b46d6; color: #3a2d97; }

/* ── Tiered sections (Featured / Verified / Non-Verified) ── */
.tbexpl-tiered-grid { display: flex; flex-direction: column; gap: 36px; }
.tbexpl-tier-section { }
.tbexpl-tier-title {
	font-family: 'Fraunces', serif; font-size: 19px; font-weight: 600;
	color: #100e29; margin: 0 0 4px;
}
.tbexpl-tier-count { font-family: inherit; font-weight: 400; font-size: 14px; color: #9c99b8; }
.tbexpl-tier-desc { font-size: 13px; color: #6f6e85; margin: 0 0 16px; }
.tbexpl-tier-featured .tbexpl-tier-title { color: #854d0e; }
.tbexpl-tier-verified .tbexpl-tier-title { color: #166534; }

/* ── Grids ── */
.tbexpl-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
	gap: 18px;
	align-items: start;
}
.tbexpl-item { display: contents; }
.tbexpl-item[style*="display: none"],
.tbexpl-item[style*="display:none"] { display: none !important; }

/* Override: when tbexpl-item wraps a tbc-card, it must be a block */
.tbexpl-grid > .tbexpl-item {
	display: block;
}

.tbexpl-no-results {
	text-align: center;
	padding: 28px;
	color: #9c99b8;
	font-style: italic;
}

/* ── Job cards ── */
.tbexpl-jobs-grid .tbexpl-item { display: block; }
.tbj-card {
	background: #fff;
	border: 1.5px solid #fde68a;
	border-radius: 16px;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	box-shadow: 0 4px 20px -8px rgba(180,130,0,.10);
	transition: transform .22s cubic-bezier(.34,1.3,.64,1), box-shadow .22s, border-color .18s;
}
.tbj-card:hover { transform: translateY(-4px); box-shadow: 0 14px 40px -10px rgba(180,130,0,.18); border-color: #f59e0b; }
.tbj-card-top { padding: 16px 16px 0; }
.tbj-head { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.tbj-guardian-avatar {
	width: 42px; height: 42px; border-radius: 50%; flex-shrink: 0;
	background: linear-gradient(135deg, #fde68a, #f59e0b);
	display: flex; align-items: center; justify-content: center;
	font-size: 16px; font-weight: 700; color: #fff;
}
.tbj-poster-meta { flex: 1; }
.tbj-poster-label { font-weight: 700; font-size: 13px; color: #1c1917; }
.tbj-time { font-size: 11px; color: #a8a29e; margin-top: 1px; }
.tbj-badge { font-size: 10px; font-weight: 700; letter-spacing: .5px; padding: 4px 9px; border-radius: 20px; text-transform: uppercase; }
.tbj-badge-open { background: #dcfce7; color: #166534; }
.tbj-divider { height: 1px; background: #fef3c7; margin: 0 0 12px; }
.tbj-section-label { font-size: 9.5px; font-weight: 700; letter-spacing: .8px; color: #b45309; text-transform: uppercase; margin-bottom: 6px; }
.tbj-chips { display: flex; flex-wrap: wrap; gap: 5px; margin-bottom: 12px; }
.tbj-chip { font-size: 11.5px; font-weight: 600; background: #fffbeb; border: 1px solid #fde68a; border-radius: 6px; padding: 3px 10px; color: #92400e; }
.tbj-info-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 12px; }
.tbj-info-item { background: #fffbeb; border: 1px solid #fef3c7; border-radius: 8px; padding: 8px 10px; }
.tbj-info-key { font-size: 10px; font-weight: 600; color: #b45309; margin-bottom: 2px; }
.tbj-info-val { font-size: 12.5px; font-weight: 600; color: #1c1917; }
.tbj-desc {
	font-size: 12.5px; color: #4b4869; line-height: 1.55;
	padding: 10px 12px; background: #fafafa; border: 1px solid #f3f0fc; border-radius: 8px;
	margin-bottom: 12px;
	display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.tbj-card-footer { padding: 12px 16px 16px; margin-top: auto; }
.tbj-apply-btn {
	display: block; width: 100%; padding: 11px 16px;
	background: linear-gradient(135deg, #b45309, #d97706); color: #fff;
	font-size: 13.5px; font-weight: 700; border-radius: 10px; text-align: center;
	border: none; cursor: pointer; font-family: inherit;
	box-shadow: 0 4px 14px -4px rgba(180,83,9,.35);
	transition: opacity .15s, transform .12s;
}
.tbj-apply-btn:hover { opacity: .88; transform: translateY(-1px); }
.tbj-login-btn {
	display: block; width: 100%; padding: 11px 16px; background: #1e1b4b; color: #fff;
	font-size: 13.5px; font-weight: 700; border-radius: 10px; text-align: center;
	text-decoration: none; box-shadow: 0 4px 14px -4px rgba(30,27,75,.35);
	transition: background .15s, transform .12s;
}
.tbj-login-btn:hover { background: #312e81; transform: translateY(-1px); color: #fff; }
.tbj-applied-badge {
	display: block; text-align: center; padding: 10px;
	background: #dcfce7; color: #166534; border-radius: 8px; font-weight: 700; font-size: 13px;
}
.tbj-ineligible-note {
	display: block; text-align: center; padding: 10px;
	background: #fef3c7; color: #92400e; border-radius: 8px; font-size: 12px;
}

/* Contact reveal box (guardian active booking) */
.teachbd-contact-reveal {
	padding: 10px 14px; background: #f0fdf4; border: 1px solid #bbf7d0;
	border-radius: 8px; display: flex; flex-direction: column; gap: 4px; font-size: 13px;
}
.teachbd-contact-name  { font-weight: 700; color: #064e3b; }
.teachbd-contact-email,
.teachbd-contact-phone { color: #065f46; }

/* v-new — click-to-call / open-in-maps buttons, shown once a booking's
   contact_shared gate is open (admin has verified the platform fee). */
.teachbd-contact-actions {
	display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px;
}
.teachbd-btn-call, .teachbd-btn-map {
	display: inline-flex; align-items: center; gap: 6px;
	padding: 8px 14px; border-radius: 8px; font-size: 13px; font-weight: 600;
	text-decoration: none; border: 1px solid transparent; cursor: pointer;
	transition: transform .12s ease, box-shadow .12s ease;
}
.teachbd-btn-call { background: #16a34a; color: #fff; }
.teachbd-btn-call:hover { background: #15803d; color: #fff; transform: translateY(-1px); box-shadow: 0 4px 10px rgba(22,163,74,.25); }
.teachbd-btn-map { background: #fff; color: #1d4ed8; border-color: #bfdbfe; }
.teachbd-btn-map:hover { background: #eff6ff; transform: translateY(-1px); box-shadow: 0 4px 10px rgba(29,78,216,.15); }

/* ══════════════════════════════════════════════════════════
   EXPLORE PAGE — RESPONSIVE SYSTEM
   Breakpoints:
     ≤ 1024px  Tablet landscape  (2-col grid, minor trim)
     ≤  768px  Tablet portrait   (2-col grid, filter rows)
     ≤  520px  Phone             (1-col grid, full stack)
   ══════════════════════════════════════════════════════════ */

/* ══════════════════════════════════════════════════════════
   EXPLORE PAGE — RESPONSIVE SYSTEM
   Breakpoints:
     ≤ 1024px  Tablet landscape
     ≤  768px  Tablet portrait
     ≤  520px  Phone
   ══════════════════════════════════════════════════════════ */

/* ── Tablet landscape (≤ 1024px) ── */
@media (max-width: 1024px) {
	.tbexpl-container {
		padding: 0 16px;
	}
	.tbexpl-header {
		padding: 44px 20px 64px;
	}
	button.tbexpl-trigger,
	.tbexpl-trigger {
		padding: 20px 22px !important;
		gap: 14px;
	}
	.tbexpl-inner {
		padding: 0 20px 24px;
	}
	.tbexpl-grid {
		grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
		gap: 14px;
	}
}

/* ── Tablet portrait (≤ 768px) ── */
@media (max-width: 768px) {
	.tbexpl-page {
		width: 100vw;
		margin-left: var(--tbexpl-bleed);
		margin-right: var(--tbexpl-bleed);
	} /* v3.7.4: breakout now happens ONCE here instead of separately on header + container — two independent
	     calc(50% - 50vw) calls were drifting apart on real devices, clipping content on alternating edges */
	.tbexpl-header {
		width: 100%; /* v3.7.4: was 100vw + its own margin breakout — now just fills the already-full-bleed page */
		padding: 36px 20px 56px; /* v3.7.3: horizontal padding 16px → 20px to compensate for the removed outer gutter */
		margin-bottom: 12px; /* v3.7.1: was -20px overlap — now a real gap so header & first panel don't blend */
	}
	.tbexpl-header-sub { font-size: 14.5px; }
	.tbexpl-hchip { font-size: 12px; padding: 4px 11px; }

	.tbexpl-container {
		width: 100%; /* v3.7.4: was 100vw + its own margin breakout — now just fills the already-full-bleed page */
		padding: 0; /* v3.7.2: was 0 12px — panels now go fully edge-to-edge */
		gap: 12px;
		margin-bottom: 24px; /* v3.7.0: was 40px */
	}
	.tbexpl-accordion { border-radius: 0; overflow: hidden; max-width: 100%; } /* v3.7.2/.4: no rounding, and a hard width cap so trigger content can never push the panel past the screen edge */

	button.tbexpl-trigger,
	.tbexpl-trigger {
		padding: 18px 20px !important; /* v3.7.3: horizontal padding 16px → 20px so icon/title/count/arrow aren't flush against the edge */
		gap: 12px;
	}
	.tbexpl-trigger-icon {
		width: 44px;
		height: 44px;
		font-size: 20px;
		border-radius: 12px;
	}
	.tbexpl-trigger-title { font-size: 17px; }
	.tbexpl-trigger-sub   { font-size: 12.5px; }
	.tbexpl-count         { font-size: 10.5px; padding: 4px 9px; }
	.tbexpl-arrow         { width: 30px; height: 30px; font-size: 12px; }

	.tbexpl-inner { padding: 0 20px 20px; } /* v3.7.3: was 0 14px 20px */

	/* Filter bar: search full width, selects 2-per-row */
	.tbexpl-filterbar {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 8px;
	}
	.tbexpl-search      { grid-column: 1 / -1; min-width: 0; }
	.tbexpl-select      { width: 100%; }
	.tbexpl-clear-btn   { grid-column: 1 / -1; }

	.tbexpl-grid {
		display: flex; /* v3.7.5: was a 2-col grid (stacked down) — now a horizontal scroll row */
		flex-wrap: nowrap;
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		-webkit-overflow-scrolling: touch;
		gap: 12px;
		padding-bottom: 6px;
		scrollbar-width: none;
	}
	.tbexpl-grid::-webkit-scrollbar { display: none; }
	.tbexpl-grid > .tbexpl-item {
		flex: 0 0 70%;
		max-width: 320px;
		scroll-snap-align: start;
	}
	.tbj-info-grid { grid-template-columns: 1fr 1fr; }
}

/* ── Phone (≤ 520px) ── */
@media (max-width: 520px) {
	.tbexpl-page { padding-top: 12px; } /* v3.7.0: smaller top breathing room on phone */
	.tbexpl-header {
		padding: 28px 18px 50px; /* v3.7.3: horizontal padding 14px → 18px to compensate for the removed outer gutter */
		margin-bottom: 10px; /* v3.7.1: was -16px overlap — now a real gap, matching this breakpoint's panel gap */
	}
	.tbexpl-header-sub { font-size: 13.5px; margin: 0 0 14px; }
	.tbexpl-hchip { font-size: 11.5px; padding: 4px 10px; }

	.tbexpl-container { padding: 0; gap: 10px; margin-bottom: 20px; } /* v3.7.2: padding was 0 10px, now edge-to-edge */
	.tbexpl-accordion { border-radius: 0; overflow: hidden; max-width: 100%; } /* v3.7.2/.4: was 14px */

	button.tbexpl-trigger,
	.tbexpl-trigger {
		padding: 16px 18px !important; /* v3.7.3: horizontal padding 14px → 18px so the count pill/arrow aren't flush against the edge */
		gap: 10px;
		min-height: 60px; /* comfortable touch target */
	}
	.tbexpl-trigger-icon {
		width: 40px;
		height: 40px;
		font-size: 18px;
		border-radius: 10px;
	}
	.tbexpl-trigger-title { font-size: 15px; }
	.tbexpl-trigger-sub   { display: none; }     /* save vertical space on phone */
	.tbexpl-cue           { display: none; }      /* bouncing arrow alone is the cue on phone */
	.tbexpl-count         { font-size: 10px; padding: 4px 8px; }
	.tbexpl-arrow         { width: 28px; height: 28px; font-size: 11px; }

	.tbexpl-inner { padding: 0 16px 16px; } /* v3.7.3: was 0 10px 16px */


	/* Filter bar: all stacked */
	.tbexpl-filterbar {
		display: flex;
		flex-direction: column;
		gap: 7px;
	}
	.tbexpl-search,
	.tbexpl-select,
	.tbexpl-clear-btn {
		width: 100%;
		box-sizing: border-box;
		min-width: 0;
		height: 44px;
		font-size: 14px;
	}

	/* Horizontal-scroll card row (v3.7.5) — was single-column, stacked vertically */
	.tbexpl-grid {
		display: flex;
		flex-wrap: nowrap;
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		-webkit-overflow-scrolling: touch;
		gap: 10px;
		padding-bottom: 6px;
		scrollbar-width: none;
	}
	.tbexpl-grid::-webkit-scrollbar { display: none; }
	.tbexpl-grid > .tbexpl-item {
		flex: 0 0 85%;
		max-width: 340px;
		scroll-snap-align: start;
	}
	.tbj-info-grid { grid-template-columns: 1fr; }
	.tbj-card-top  { padding: 14px 14px 0; }
	.tbj-card-footer { padding: 10px 14px 14px; }
	.tbj-apply-btn,
	.tbj-login-btn { font-size: 14px; padding: 12px 16px; }

	.teachbd-contact-reveal { flex-direction: column; }
}

/* ── Job card price / budget badge (added v1.3.0) ─────────────────────── */
.tbj-price-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	margin-bottom: 12px;
	background: linear-gradient(135deg, #fffbeb, #fef3c7);
	border: 1px solid #fde68a;
	border-radius: 10px;
	padding: 9px 12px;
}
.tbj-price-label {
	font-size: 10px;
	font-weight: 700;
	letter-spacing: .7px;
	color: #b45309;
	text-transform: uppercase;
}
.tbj-price-badge {
	font-size: 16px;
	font-weight: 800;
	color: #92400e;
	letter-spacing: -.3px;
	white-space: nowrap;
}
.tbj-price-per {
	font-size: 11px;
	font-weight: 500;
	color: #b45309;
	margin-left: 2px;
}

/* v-fix — per-subject job-post budget chips ("1 tutor for 3 subjects,
   set separately"). Shown wherever the single flat .tbj-price-badge
   used to be, on both the guardian's own post card and the shared
   teacher-facing job card. */
.tbj-subject-budget-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.tbj-subject-budget-chip {
	font-size: 12px; font-weight: 600; background: #fffbeb; border: 1px solid #fde68a;
	border-radius: 8px; padding: 5px 10px; color: #92400e; white-space: nowrap;
}
.tbj-subject-budget-chip strong { font-weight: 700; margin-right: 4px; }
.tbj-price-row-persubject { display: block; background: none; border: none; padding: 0; }
.tbj-price-row-persubject .tbj-price-label { display: block; margin-bottom: 6px; }

/* ── Budget field in job-post form ────────────────────────────────────── */
.tbj-budget-input-wrap {
	display: flex;
	align-items: center;
	gap: 0;
	border: 1.5px solid #d3cdf0;
	border-radius: 10px;
	overflow: hidden;
	background: #fff;
	transition: border-color .18s;
}
.tbj-budget-input-wrap:focus-within {
	border-color: #5b46d6;
	box-shadow: 0 0 0 3px rgba(91,70,214,.12);
}
.tbj-budget-currency,
.tbj-budget-suffix {
	padding: 0 12px;
	font-size: 14px;
	font-weight: 700;
	color: #6b7280;
	background: #f9f8ff;
	align-self: stretch;
	display: flex;
	align-items: center;
	border: none;
	white-space: nowrap;
}
.tbj-budget-currency { border-right: 1.5px solid #d3cdf0; }
.tbj-budget-suffix   { border-left:  1.5px solid #d3cdf0; }
.tbj-budget-input {
	flex: 1;
	border: none !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	padding: 9px 12px;
	font-size: 15px;
	font-weight: 600;
	color: #100e29;
	min-width: 0;
	background: transparent;
}
.tbj-budget-input:focus { outline: none; }

.teachbd-frm-hint {
	font-size: 12px;
	color: #6f6e85;
	margin: 6px 0 0;
	line-height: 1.5;
}

/* =====================================================================
   v2.0 — ALL NEW COMPONENT STYLES
   Added: badges, invite card v2, bKash copyable box, calendar links,
   multi-day schedule, class presence tab, absence/resignation forms,
   admin price context row, mobile dashboard responsiveness
===================================================================== */

/* ── Tab badges ────────────────────────────────────────────────────── */
.teachbd-tab-badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: #e84d4d;
	color: #fff;
	font-size: 10px;
	font-weight: 700;
	min-width: 16px;
	height: 16px;
	border-radius: 999px;
	padding: 0 4px;
	margin-left: 5px;
	line-height: 1;
	vertical-align: middle;
	animation: teachbd-badge-pop 0.25s cubic-bezier(.68,-.55,.27,1.55) both;
}
@keyframes teachbd-badge-pop {
	0%   { transform: scale(0); }
	100% { transform: scale(1); }
}

/* ── Demo invite card v2 ───────────────────────────────────────────── */
.teachbd-invite-card-v2 {
	background: #fff;
	border: 2px solid #ece8fb;
	border-radius: 16px;
	padding: 22px;
	margin-bottom: 18px;
	box-shadow: 0 4px 20px -8px rgba(58,45,151,0.12);
}
.teachbd-invite-header {
	margin-bottom: 14px;
}
.teachbd-invite-badge-new {
	background: linear-gradient(90deg, #3a2d97, #6c5ce7);
	color: #fff;
	font-size: 12px;
	font-weight: 700;
	padding: 4px 12px;
	border-radius: 999px;
	letter-spacing: 0.3px;
}
.teachbd-invite-details-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 10px 16px;
	margin-bottom: 16px;
}
.teachbd-invite-detail-item {
	display: flex;
	flex-direction: column;
	gap: 2px;
}
.teachbd-invite-detail-full { grid-column: 1 / -1; }
.teachbd-invite-detail-label { font-size: 11px; color: #9d9bb5; font-weight: 600; text-transform: uppercase; letter-spacing: 0.4px; }
.teachbd-invite-detail-val   { font-size: 14px; color: #100e29; }
.teachbd-invite-fee-notice {
	display: flex;
	gap: 12px;
	background: #fff8f0;
	border: 1.5px solid #f0c98f;
	border-radius: 12px;
	padding: 14px 16px;
	margin-bottom: 16px;
}
.teachbd-invite-fee-icon { font-size: 22px; flex-shrink: 0; }
.teachbd-invite-fee-body strong { font-size: 13px; color: #92400e; display: block; margin-bottom: 4px; }
.teachbd-invite-fee-body p { font-size: 12.5px; color: #78350f; margin: 0 0 5px; line-height: 1.5; }
.teachbd-invite-fee-note { font-size: 11.5px !important; color: #a16207 !important; }
.teachbd-invite-actions { display: flex; gap: 10px; flex-wrap: wrap; }

/* ── Google Calendar / ICS links ───────────────────────────────────── */
.teachbd-cal-links {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	align-items: center;
	padding: 10px 0 4px;
}
.teachbd-cal-btn {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	font-size: 12px;
	font-weight: 600;
	padding: 6px 12px;
	border-radius: 8px;
	text-decoration: none;
	transition: background 0.15s ease, transform 0.1s ease;
}
.teachbd-cal-google {
	background: #e8f0fe;
	color: #1a73e8;
	border: 1px solid #c5d8fd;
}
.teachbd-cal-google:hover { background: #d2e4fd; transform: translateY(-1px); color: #1558b0; }
.teachbd-cal-ics {
	background: #f1f0f5;
	color: #3a2d97;
	border: 1px solid #ddd8f5;
}
.teachbd-cal-ics:hover { background: #e4e0f7; transform: translateY(-1px); }
.teachbd-cal-note { font-size: 11px; color: #9d9bb5; display: block; margin-top: 2px; }

/* ── bKash copyable number box ─────────────────────────────────────── */
.teachbd-bkash-box {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	background: #fff0f6;
	border: 1.5px solid #f5c2dc;
	border-radius: 10px;
	padding: 8px 14px;
	margin: 8px 0;
}
.teachbd-bkash-number {
	font-family: 'Courier New', monospace;
	font-size: 15px;
	font-weight: 700;
	color: #be185d;
	letter-spacing: 1px;
}
.teachbd-bkash-copy-btn {
	background: #fce7f3;
	border: 1px solid #f5c2dc;
	border-radius: 6px;
	color: #be185d;
	cursor: pointer;
	font-size: 13px;
	padding: 3px 8px;
	transition: background 0.15s ease;
}
.teachbd-bkash-copy-btn:hover { background: #fbcfe8; }
.teachbd-bkash-copy-btn.copied { background: #d1fae5; border-color: #6ee7b7; color: #065f46; }

/* ── Multi-day schedule slots ──────────────────────────────────────── */
.teachbd-schedule-multi-wrap { display: flex; flex-direction: column; gap: 12px; }
.teachbd-schedule-slot-row {
	display: flex;
	gap: 10px;
	align-items: center;
	background: #f9f8ff;
	border: 1px solid #e3def7;
	border-radius: 10px;
	padding: 10px 14px;
	flex-wrap: wrap;
}
.teachbd-schedule-slot-row select,
.teachbd-schedule-slot-row input[type="time"] {
	flex: 1 1 120px;
	min-width: 0;
}
.teachbd-schedule-slot-label {
	font-size: 12px;
	font-weight: 600;
	color: #6f6e85;
	white-space: nowrap;
}

/* ── Class Presence tab ─────────────────────────────────────────────── */
.teachbd-presence-section { margin-bottom: 28px; }
.teachbd-presence-section h4 { font-size: 15px; font-weight: 700; color: #100e29; margin: 0 0 12px; }
.teachbd-presence-form {
	background: #fff;
	border: 1.5px solid #e3def7;
	border-radius: 14px;
	padding: 18px;
	margin-bottom: 16px;
}
.teachbd-presence-row {
	display: flex;
	gap: 12px;
	flex-wrap: wrap;
	align-items: flex-end;
	margin-bottom: 10px;
}
.teachbd-presence-row .teachbd-field { flex: 1 1 160px; min-width: 0; }
.teachbd-presence-history { overflow-x: auto; }
.teachbd-presence-status-badge {
	display: inline-block;
	font-size: 11px;
	font-weight: 700;
	padding: 2px 8px;
	border-radius: 99px;
}
.teachbd-presence-status-badge.present       { background: #d1fae5; color: #065f46; }
.teachbd-presence-status-badge.teacher_absent { background: #fee2e2; color: #991b1b; }
.teachbd-presence-status-badge.student_absent { background: #fef3c7; color: #92400e; }
.teachbd-presence-status-badge.exam_session   { background: #ede9fe; color: #5b21b6; }
.teachbd-presence-status-badge.govt_holiday   { background: #e0f2fe; color: #0369a1; }
.teachbd-presence-status-badge.teacher_sick   { background: #fee2e2; color: #991b1b; }
.teachbd-presence-status-badge.student_sick   { background: #fef3c7; color: #92400e; }

/* ── Absence / Resignation notice forms ─────────────────────────────── */
.teachbd-notice-form-wrap {
	background: #fffbeb;
	border: 1.5px solid #fde68a;
	border-radius: 14px;
	padding: 18px;
	margin-top: 16px;
}
.teachbd-notice-form-wrap h5 { font-size: 14px; font-weight: 700; color: #92400e; margin: 0 0 10px; }
.teachbd-resign-form-wrap {
	background: #fff1f2;
	border: 1.5px solid #fecdd3;
	border-radius: 14px;
	padding: 18px;
	margin-top: 16px;
}
.teachbd-resign-form-wrap h5 { font-size: 14px; font-weight: 700; color: #9f1239; margin: 0 0 10px; }

/* ── Admin: tutor asking price row ─────────────────────────────────── */
.teachbd-admin-price-asking .teachbd-admin-price-label { color: #6b7280; }
.is-asking { color: #3a2d97 !important; font-weight: 700 !important; }

/* =====================================================================
   v2.0 — MOBILE RESPONSIVENESS (Task 9)
   Target: phones ≤ 480px, small tablets ≤ 640px
   Focus: dashboard tab bar, portal stats, invite cards, forms
===================================================================== */

/* ── Small tablet: 2-col stats, grid tabs ──────────────────────────── */
/* v-fix — "people are not understanding that they need to scroll left
   or right." The tab bar used to scroll horizontally with a fading
   chevron hint, but plenty of people never noticed the hint (or didn't
   read it as "swipe") and just assumed those were the only tabs that
   existed — several tabs were effectively invisible to them. Switched
   to a real 3-column grid instead: every tab is always on-screen at
   once, wrapping into as many rows as needed, nothing to discover by
   scrolling. The old scroll-hint chevron has nothing left to point at,
   so it's gone too (.teachbd-tabs-scroll-hint stays display:none, its
   base/default state, and the scroller wrapper is now just a plain
   container). */
@media (max-width: 640px) {
	.teachbd-portal-stats { grid-template-columns: repeat(2, 1fr); gap: 8px; }
	.teachbd-portal-tabs  {
		display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px;
	}
	.teachbd-tab { font-size: 12.5px; font-weight: 700; padding: 10px 8px; white-space: normal; text-align: center; line-height: 1.25; }
	.teachbd-invite-details-grid { grid-template-columns: 1fr; }
	.teachbd-invite-fee-notice { flex-direction: column; gap: 8px; }

	/* v-new — "the financial dashboard details are off the grid in the
	   cell phones... place them vertically rather than horizontal." The
	   8-column receipts table (Booking/Subject/Guardian/Total Fee/
	   Commission/Net Earnings/Payment/Receipt) has no room to breathe
	   at phone widths — this turns it into a stack of labeled rows per
	   booking instead, using the data-label attribute each <td> now
	   carries (see TeachBD_Finance::render_receipts_table()). The
	   expanded receipt-detail row (full width, no data-label) is
	   excluded from the label treatment since it's its own already-
	   responsive block layout, not a data cell. */
	.teachbd-receipts thead { display: none; }
	.teachbd-receipts, .teachbd-receipts tbody, .teachbd-receipts tr { display: block; width: 100%; }
	.teachbd-receipts tr:not(.teachbd-receipt-detail) {
		margin-bottom: 12px; border: 1px solid #e3def7; border-radius: 10px;
		padding: 4px 12px; background: #fff;
	}
	.teachbd-receipts tr:not(.teachbd-receipt-detail) td {
		display: flex; justify-content: space-between; align-items: center;
		gap: 10px; padding: 8px 0; border-bottom: 1px solid #f3f1fb;
		text-align: right; font-size: 12.5px;
	}
	.teachbd-receipts tr:not(.teachbd-receipt-detail) td:last-child { border-bottom: none; }
	.teachbd-receipts tr:not(.teachbd-receipt-detail) td::before {
		content: attr(data-label); font-weight: 600; color: #6f6e85;
		text-align: left; padding-right: 10px; flex-shrink: 0;
	}
	.teachbd-receipts tr.teachbd-receipt-detail td { display: block; padding: 0; }

	/* v-new — "the attendance is still out of the grid" on phones. Same
	   stacked-card treatment as receipts above, applied to both
	   attendance tables (the per-booking confirm widget in
	   TeachBD_Attendance::render_attendance_widget() and the Class
	   Presence log table in
	   TeachBD_Shortcodes::render_class_presence_tab()) — both share the
	   .teachbd-attendance class and now both carry data-label on every
	   <td>. The trailing action-button cell (Confirm Class Held) has no
	   label of its own, so it's excluded from the label treatment and
	   just centers its button. */
	.teachbd-attendance thead, .teachbd-attendance-detail thead { display: none; }
	.teachbd-attendance, .teachbd-attendance tbody, .teachbd-attendance tr,
	.teachbd-attendance-detail, .teachbd-attendance-detail tbody, .teachbd-attendance-detail tr { display: block; width: 100%; }
	.teachbd-attendance tr, .teachbd-attendance-detail tr {
		margin-bottom: 12px; border: 1px solid #e3def7; border-radius: 10px;
		padding: 4px 12px; background: #fff;
	}
	.teachbd-attendance td, .teachbd-attendance-detail td {
		display: flex; justify-content: space-between; align-items: center;
		gap: 10px; padding: 8px 0; border-bottom: 1px solid #f3f1fb;
		text-align: right; font-size: 12.5px;
	}
	.teachbd-attendance td:last-child, .teachbd-attendance-detail td:last-child { border-bottom: none; }
	.teachbd-attendance td[data-label]::before, .teachbd-attendance-detail td[data-label]::before {
		content: attr(data-label); font-weight: 600; color: #6f6e85;
		text-align: left; padding-right: 10px; flex-shrink: 0;
	}
	.teachbd-attendance-action-cell { justify-content: center !important; }
	.teachbd-attendance-action-cell .teachbd-btn { width: 100%; }
}
/* v-new — "a tutor can confirm ahead of the date. This must be
   stopped." Sits outside the ≤640px block above (non-mobile-only)
   since the future-date gate applies at every width. */
.teachbd-attendance-not-yet {
	font-size: 11.5px; color: #9d9bb5; font-style: italic;
}

/* ── Phone: single-col stats, compact tabs ─────────────────────────── */
@media (max-width: 480px) {
	.teachbd-portal { padding: 12px 12px 32px; }
	.teachbd-portal-stats { grid-template-columns: repeat(2, 1fr); gap: 6px; }
	.teachbd-portal-stats .teachbd-stat-box { padding: 12px 6px; }
	.teachbd-portal-stats .teachbd-stat-box strong { font-size: 18px; }
	.teachbd-portal-stats .teachbd-stat-box span   { font-size: 10px; }

	/* Grid tab bar — 3 across, wraps into rows; every tab always visible,
	   nothing to scroll to find (see the ≤640px block above for why). */
	.teachbd-portal-tabs {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		gap: 5px;
		margin-bottom: 18px;
	}
	.teachbd-tab {
		font-size: 11.5px;
		font-weight: 700;
		padding: 9px 6px;
		white-space: normal;
		text-align: center;
		line-height: 1.25;
	}
	.teachbd-tab-badge { font-size: 9px; min-width: 14px; height: 14px; margin-left: 3px; }

	/* Invite card */
	.teachbd-invite-card-v2 { padding: 14px; }
	.teachbd-invite-actions { flex-direction: column; }
	.teachbd-invite-actions .teachbd-btn { width: 100%; text-align: center; }

	/* bKash box */
	.teachbd-bkash-box { flex-direction: column; align-items: flex-start; gap: 6px; }

	/* Schedule slots */
	.teachbd-schedule-slot-row { flex-direction: column; align-items: stretch; }

	/* Presence form */
	.teachbd-presence-row { flex-direction: column; }
	.teachbd-presence-row .teachbd-field { flex: none; width: 100%; }

	/* Calendar add links */
	.teachbd-cal-links { flex-direction: column; align-items: flex-start; }
	.teachbd-cal-btn   { width: 100%; justify-content: center; }
}

/* ── Very small phones (320px) ─────────────────────────────────────── */
@media (max-width: 360px) {
	.teachbd-tab { font-size: 11px; font-weight: 700; padding: 9px 10px; }
	.teachbd-portal-stats { grid-template-columns: 1fr 1fr; }
}


/* ============================================================
   TeachBD v3.0 — Form Builder + T&C Modal + Subject Selects
   ============================================================ */

/* T&C checkbox row */
.teachbd-frm-tnc-section {
    background: #f9f9fb;
    border: 1px solid #e0e4ef;
    border-radius: 8px;
    padding: 14px 18px;
}
.teachbd-frm-tnc-label {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 14px;
    cursor: pointer;
    flex-wrap: wrap;
}
.teachbd-frm-tnc-check {
    width: 18px;
    height: 18px;
    accent-color: #1f9c8c;
    cursor: pointer;
    flex-shrink: 0;
}
.teachbd-frm-tnc-link {
    background: none;
    border: none;
    color: #1f9c8c;
    font-weight: 600;
    cursor: pointer;
    text-decoration: underline;
    font-size: inherit;
    padding: 0;
}
.teachbd-frm-tnc-link:hover {
    color: #167a6e;
}

/* T&C Modal overlay */
#teachbd-tnc-modal {
    font-family: inherit;
}
#teachbd-tnc-modal pre {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

/* Admin checkgroup in Add Teacher/Guardian */
.teachbd-checkgroup {
    margin-bottom: 16px;
}
.teachbd-checkgroup label {
    font-size: 13px;
    break-inside: avoid;
}

/* Subject select in demo scheduling */
.teachbd-admin-form-wrap select[name="subject"] {
    min-width: 280px;
    max-width: 100%;
}

/* Form Builder admin page extras */
.teachbd-fb-list-item:hover {
    background: #f8f9fa;
}


/* =============================================================
   v3.2 — Booking fee visibility, breakdown, and waiver system
   ============================================================= */

/* Snapshot price pills on early-stage cards */
.teachbd-kanban-snap-row {
    display: flex;
    gap: 5px;
    flex-wrap: wrap;
    margin: 4px 0;
}
.teachbd-snap-pill {
    display: inline-block;
    padding: 2px 7px;
    border-radius: 20px;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: .02em;
}
.teachbd-snap-t {
    background: #eff6ff;
    color: #1d4ed8;
    border: 1px solid #bfdbfe;
}
.teachbd-snap-g {
    background: #f0fdf4;
    color: #166534;
    border: 1px solid #86efac;
}

/* Agreed fee row after hire */
.teachbd-fee-agreed {
    font-size: 11px;
    font-weight: 600;
    color: #1e40af;
    background: #eff6ff;
    border-radius: 6px;
    padding: 3px 7px;
    margin: 4px 0;
    display: flex;
    align-items: center;
    gap: 4px;
    flex-wrap: wrap;
}

/* Classes/month info row */
.teachbd-kanban-card-classes {
    font-size: 10px;
    color: #6b7280;
    margin: 2px 0 4px;
}

/* v-new -- teacher's own registered availability, shown on every
   Bookings kanban card (see page_bookings() in class-teachbd-admin.php) */
.teachbd-kanban-card-avail {
    font-size: 10.5px;
    color: #4a3f8f;
    background: #f2effc;
    border-radius: 4px;
    padding: 3px 6px;
    margin: 2px 0 4px;
    display: inline-block;
}

/* Waiver credit badge on card */
.teachbd-waiver-badge {
    display: inline-block;
    background: #fef9c3;
    color: #854d0e;
    border: 1px solid #fde047;
    border-radius: 20px;
    font-size: 10px;
    font-weight: 600;
    padding: 1px 6px;
}

/* Waiver available notice (teacher has credit) */
.teachbd-waiver-available {
    font-size: 10px;
    font-weight: 600;
    color: #78350f;
    background: #fffbeb;
    border: 1px solid #fde68a;
    border-radius: 6px;
    padding: 3px 8px;
    margin: 3px 0;
}

/* Live fee breakdown panel */
.teachbd-fee-breakdown {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 8px 10px;
    font-size: 11px;
    line-height: 1.7;
    color: #374151;
    margin: 4px 0;
    display: none;
}
.teachbd-fee-breakdown.tbfb-visible {
    display: block;
}
.teachbd-fee-breakdown .tbfb-row {
    display: flex;
    justify-content: space-between;
    gap: 8px;
}
.teachbd-fee-breakdown .tbfb-row.tbfb-total {
    font-weight: 700;
    color: #1e40af;
   }
/* =========================================================================
   v3.6 — God Mode Floating Admin Guide
   ========================================================================= */
.teachbd-godmode {
    position: fixed;
    bottom: 28px;
    right: 28px;
    z-index: 99999;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
.teachbd-godmode-fab {
    width: 54px;
    height: 54px;
    border-radius: 50%;
    background: #1e40af;
    color: #fff;
    border: none;
    cursor: pointer;
    font-size: 24px;
    box-shadow: 0 4px 18px rgba(30,64,175,.45);
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    transition: background .2s, transform .15s;
}
.teachbd-godmode-fab:hover { background: #1d4ed8; transform: scale(1.07); }
.teachbd-godmode-fab-count {
    position: absolute;
    top: -4px;
    right: -4px;
    background: #dc2626;
    color: #fff;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 700;
    min-width: 18px;
    height: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 4px;
    border: 2px solid #fff;
}
.teachbd-godmode-panel {
    position: absolute;
    bottom: 64px;
    right: 0;
    width: 360px;
    max-height: 70vh;
    overflow-y: auto;
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 8px 40px rgba(0,0,0,.18);
    display: flex;
    flex-direction: column;
}
.teachbd-godmode-panel[hidden] { display: none; }
.teachbd-godmode-panel-head {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 14px 16px;
    border-bottom: 1px solid #e5e7eb;
    background: #f8fafc;
    border-radius: 16px 16px 0 0;
    position: sticky;
    top: 0;
}
.teachbd-godmode-panel-total {
    margin-left: auto;
    font-size: 11px;
    color: #6b7280;
}
.teachbd-godmode-close {
    background: none;
    border: none;
    cursor: pointer;
    color: #6b7280;
    font-size: 16px;
    padding: 0 4px;
    line-height: 1;
}
.teachbd-godmode-close:hover { color: #111; }
.teachbd-godmode-panel-body { padding: 12px; display: flex; flex-direction: column; gap: 10px; }
.teachbd-godmode-scenario {
    border-radius: 10px;
    padding: 12px 14px;
    border-left: 4px solid transparent;
}
.teachbd-godmode-red    { background: #fef2f2; border-color: #dc2626; }
.teachbd-godmode-yellow { background: #fffbeb; border-color: #d97706; }
.teachbd-godmode-blue   { background: #eff6ff; border-color: #3b82f6; }
.teachbd-godmode-scenario-head {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin-bottom: 6px;
    flex-wrap: wrap;
}
.teachbd-godmode-scenario-icon { font-size: 18px; flex-shrink: 0; }
.teachbd-godmode-scenario-head strong { font-size: 13px; flex: 1; line-height: 1.4; }
.teachbd-godmode-link {
    font-size: 12px;
    color: #1d4ed8;
    text-decoration: none;
    white-space: nowrap;
    font-weight: 600;
}
.teachbd-godmode-link:hover { text-decoration: underline; }
.teachbd-godmode-scenario-guide { font-size: 12px; color: #374151; line-height: 1.55; }
.teachbd-godmode-items { margin: 6px 0 0 20px; font-size: 11px; color: #6b7280; }
.teachbd-godmode-items li { margin-bottom: 2px; }
.teachbd-godmode-clear { display: flex; align-items: center; gap: 10px; padding: 8px 0; font-size: 13px; color: #15803d; }

/* =========================================================================
   v3.6 — Notification Center
   ========================================================================= */
.teachbd-notif-list { display: flex; flex-direction: column; gap: 0; }
.teachbd-notif-row {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 14px 0;
    border-bottom: 1px solid #f1f5f9;
}
.teachbd-notif-row.is-unread { background: #f0f9ff; margin: 0 -12px; padding: 14px 12px; }
.teachbd-notif-icon { font-size: 22px; flex-shrink: 0; }
.teachbd-notif-body { flex: 1; min-width: 0; }
.teachbd-notif-label { font-size: 11px; font-weight: 700; text-transform: uppercase; color: #6b7280; margin-bottom: 2px; }
.teachbd-notif-msg { font-size: 13px; color: #111827; line-height: 1.5; }
.teachbd-notif-link { font-size: 12px; color: #2563eb; text-decoration: none; margin-top: 4px; display: inline-block; }
.teachbd-notif-link:hover { text-decoration: underline; }
.teachbd-notif-time { font-size: 11px; color: #9ca3af; white-space: nowrap; }
.teachbd-notif-mark-all { font-size: 12px; }

/* =========================================================================
   v3.6 — Job Cards on Explore Page
   ========================================================================= */
.tbexpl-job-card {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    padding: 18px 20px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    box-shadow: 0 2px 8px rgba(0,0,0,.06);
    transition: box-shadow .2s, transform .15s;
}
.tbexpl-job-card:hover {
    box-shadow: 0 6px 22px rgba(0,0,0,.10);
    transform: translateY(-2px);
}
.tbexpl-job-subjects {
    font-weight: 700;
    font-size: 16px;
    color: #1e293b;
    line-height: 1.3;
}
.tbexpl-job-location {
    font-size: 13px;
    color: #64748b;
}
.tbexpl-job-desc {
    font-size: 13px;
    color: #475569;
    line-height: 1.55;
}
.tbexpl-job-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 4px;
}
.tbexpl-job-badge {
    background: #f1f5f9;
    color: #334155;
    font-size: 12px;
    font-weight: 600;
    padding: 3px 10px;
    border-radius: 999px;
}
.tbexpl-apply-btn {
    display: inline-block;
    margin-top: 8px;
    background: #1e40af;
    color: #fff;
    font-size: 13px;
    font-weight: 600;
    padding: 8px 18px;
    border-radius: 8px;
    border: none;
    cursor: pointer;
    text-decoration: none;
    transition: background .15s;
    align-self: flex-start;
}
.tbexpl-apply-btn:hover { background: #1d4ed8; color: #fff; }
.tbexpl-applied-badge {
    display: inline-block;
    margin-top: 8px;
    background: #dcfce7;
    color: #15803d;
    font-size: 12px;
    font-weight: 700;
    padding: 5px 14px;
    border-radius: 999px;
}
.tbexpl-no-results {
    text-align: center;
    color: #94a3b8;
    font-size: 14px;
    padding: 24px 0;
    grid-column: 1 / -1;
}

/* v4.4 — silent background activity toast (see teachbd.js). Never appears
   without new data, never auto-dismisses/auto-refreshes; person-controlled. */
.teachbd-activity-toast {
	position: fixed;
	right: 20px;
	bottom: 20px;
	z-index: 99997;
	display: flex;
	align-items: center;
	gap: 10px;
	background: linear-gradient(135deg, #3a2d97, #5b46d6);
	color: #fff;
	padding: 12px 14px 12px 16px;
	border-radius: 14px;
	box-shadow: 0 12px 32px -8px rgba(58,45,151,0.5);
	font-size: 13.5px;
	font-weight: 600;
	max-width: 320px;
	opacity: 0;
	transform: translateY(12px);
	transition: opacity 0.25s ease, transform 0.25s ease;
	pointer-events: none;
}
.teachbd-activity-toast.is-visible {
	opacity: 1;
	transform: translateY(0);
	pointer-events: auto;
}
.teachbd-activity-toast-icon { font-size: 16px; flex-shrink: 0; }
.teachbd-activity-toast-text { flex: 1; line-height: 1.3; }
.teachbd-activity-toast-refresh {
	background: rgba(255,255,255,.18);
	border: 1px solid rgba(255,255,255,.3);
	color: #fff;
	font-size: 12.5px;
	font-weight: 700;
	padding: 6px 12px;
	border-radius: 999px;
	cursor: pointer;
	white-space: nowrap;
	transition: background 0.15s ease;
}
.teachbd-activity-toast-refresh:hover { background: rgba(255,255,255,.3); }
.teachbd-activity-toast-dismiss {
	background: none;
	border: none;
	color: rgba(255,255,255,.75);
	font-size: 18px;
	line-height: 1;
	cursor: pointer;
	padding: 0 2px;
}
.teachbd-activity-toast-dismiss:hover { color: #fff; }
@media (max-width: 480px) {
	.teachbd-activity-toast { left: 14px; right: 14px; max-width: none; }
}

/* v4.5 — "which subject?" field on Request Demo forms (per-subject-priced
   teachers only). Kept compact since it lives inside small card footers. */
.teachbd-request-subject-field {
	display: block;
	font-size: 12px;
	font-weight: 600;
	color: #3a2d97;
	margin: 8px 0;
	width: 100%;
}
.teachbd-request-subject-field select {
	display: block;
	width: 100%;
	margin-top: 4px;
	padding: 7px 10px;
	border: 1.5px solid #ece8fb;
	border-radius: 8px;
	font-size: 12.5px;
	font-weight: 500;
	color: #100e29;
	background: #faf9ff;
}

/* v4.8 — English/বাংলা tab switcher at the top of the registration forms */
.teachbd-lang-toggle {
	display: flex;
	justify-content: flex-end;
	margin-bottom: 14px;
}
.teachbd-lang-toggle .teachbd-lang-tabs {
	display: inline-flex;
	background: #ece8fb;
	border-radius: 999px;
	padding: 3px;
	gap: 2px;
}
.teachbd-lang-toggle a {
	color: #6b6591;
	text-decoration: none;
	padding: 6px 16px;
	border-radius: 999px;
	font-size: 12.5px;
	font-weight: 700;
	transition: background 0.15s ease, color 0.15s ease;
}
.teachbd-lang-toggle a.is-active {
	color: #fff;
	background: #3a2d97;
	box-shadow: 0 2px 8px rgba(58,45,151,0.35);
}

/* =====================================================================
   v-new — "there should not be systems where people can take screen
   shots." Companion to the keydown/blur guard in teachbd.js. See that
   file for the important caveat: no web page can block a real OS
   screenshot or a phone camera -- this is deterrence for the casual
   routes only (right-click save, Print-to-PDF, and a blur-out while
   the tab is unfocused), not a guarantee.
===================================================================== */
.teachbd-privacy-blur {
	filter: blur(6px);
	transition: filter 0.15s ease;
	user-select: none;
}
@media print {
	.teachbd-portal { display: none !important; }
	body::before {
		content: "Printing and saving as PDF is disabled for this page.";
		display: block; padding: 40px; font-family: sans-serif; font-size: 16px; text-align: center;
	}
}

/* =====================================================================
   v-new — "this attendance thing should be detailed." Admin-side
   per-booking weekly schedule vs actual outcome breakdown (see
   TeachBD_Admin::page_attendance()). Native <details>/<summary> keeps
   a long roster of active bookings collapsed by default.
===================================================================== */
.teachbd-att-detail {
	background: #fff; border: 1px solid #dcdcde; border-radius: 6px;
	padding: 10px 14px; margin-bottom: 8px;
}
.teachbd-att-detail summary {
	cursor: pointer; font-size: 13px; color: #1d2327; padding: 4px 0;
}
.teachbd-att-detail summary:hover { color: #2271b1; }
.teachbd-att-detail-ratio { color: #6f6e85; font-weight: 600; }
.teachbd-att-detail-table { margin-top: 10px; }
.teachbd-att-row-held td, .teachbd-att-row-held_partial td { background: #edf9f0; }
.teachbd-att-row-missed_no_entry td, .teachbd-att-row-teacher_absent td { background: #fdeeee; }
.teachbd-att-row-not_entered td { background: #fdf6ec; }
.teachbd-att-row-student_absent td { background: #fdf6ec; }
.teachbd-att-row-today_pending td, .teachbd-att-row-pending td { background: #f5f5f8; }