/* --red/--red2 drive the whole site's brand color (buttons, eyebrows, stat
numbers, gradients, badges, sidebar/nav accents, etc.) via
var(--red)/var(--red2) throughout this file and admin-v2.css. Changed here
to the figma-redesign's yellow/gold (matching --fh-gold/--fh-yellow in
figma-home-demo.css) so both the public marketing pages AND the dashboard/
admin app-shell share the same brand identity -- --red holds the gold
shade (readable as TEXT: eyebrows, icon colors, stat numbers, sidebar
highlights) and --red2 the brighter yellow (background-fill gradients:
buttons, avatar badges). */
:root{--red:#C78F18;--red2:#FFC531;--red-contrast:#1A2730;--black:#111111;--dark:#1C1C1C;--muted:#6B7280;--light:#F5F5F5;--radius:1rem;--shadow:0 20px 60px rgba(17,17,17,.12)}
/* Bootstrap's own .text-danger/.bg-danger/.btn-danger/.text-bg-danger/
.border-danger/.btn-outline-danger get used throughout the app (marketing
AND dashboard/admin) as a shorthand for "the brand accent color" in
decorative spots (contact icons, modal headers, badges, category icons)
rather than for real error/danger states -- flash()/toast errors render
through a separate system (TasklinkoToast), not these classes. Redirected
to --red/--red-contrast everywhere EXCEPT the specific delete/destructive
buttons and real inline error text below, which keep an explicit,
hardcoded red regardless of theme -- those need to stay unambiguously
"this is dangerous", not just on-brand. */
.text-danger:not(.danger-stays-red){color:var(--red)!important}
.border-danger:not(.danger-stays-red){border-color:var(--red)!important}
.bg-danger:not(.danger-stays-red),.btn-danger:not(.danger-stays-red),.text-bg-danger:not(.danger-stays-red){background-color:var(--red)!important;color:var(--red-contrast)!important}
.btn-danger:not(.danger-stays-red):hover,.btn-danger:not(.danger-stays-red):focus{background-color:var(--red2)!important;color:var(--red-contrast)!important}
.btn-outline-danger:not(.danger-stays-red){color:var(--red)!important;border-color:var(--red)!important}
.btn-outline-danger:not(.danger-stays-red):hover,.btn-outline-danger:not(.danger-stays-red):focus{background-color:var(--red)!important;border-color:var(--red)!important;color:var(--red-contrast)!important}
.danger-stays-red{color:#dc3545!important;border-color:#dc3545!important}
.bg-danger.danger-stays-red,.btn-danger.danger-stays-red,.text-bg-danger.danger-stays-red{background-color:#dc3545!important;color:#fff!important}
.btn-danger.danger-stays-red:hover,.btn-danger.danger-stays-red:focus{background-color:#c22636!important;color:#fff!important}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:var(--black);background:#fff;overflow-x:hidden}
.site-main{padding-top:76px}
.loader{position:fixed;inset:0;background:#fff;z-index:9999;display:grid;place-items:center;transition:.3s}
.loader.hide{opacity:0;visibility:hidden}
.glass-nav{background:rgba(17,17,17,.88);backdrop-filter:blur(18px);border-bottom:1px solid rgba(255,255,255,.1)}
.navbar-toggler{filter:invert(1)}
.brand-mark{width:42px;height:42px;border-radius:14px;display:inline-grid;place-items:center;background:linear-gradient(135deg,var(--red),var(--red2));color:#1A2730;font-weight:800;font-size:1.3rem;box-shadow:0 14px 35px rgba(199,143,24,.35)}
.brand-text{font-weight:900;font-size:1.55rem;background:linear-gradient(90deg,var(--red),var(--red2));-webkit-background-clip:text;background-clip:text;color:transparent}
.brand-logo{
height:46px;
width:auto;
max-width:180px;
object-fit:contain;
display:block;
}
.nav-pills-soft .nav-link{color:rgba(255,255,255,.72);border-radius:12px;padding:.6rem .85rem}
.nav-pills-soft .nav-link:hover,.nav-pills-soft .nav-link.active{color:#fff;background:rgba(199,143,24,.18)}
.btn-red{background:linear-gradient(135deg,var(--red),var(--red2));border:0;color:var(--red-contrast)!important;border-radius:14px;box-shadow:0 12px 28px rgba(199,143,24,.26);transition:.25s}
.btn-red:hover{transform:translateY(-2px);box-shadow:0 18px 40px rgba(199,143,24,.38)}
.btn-ghost{color:#fff;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.05);border-radius:14px}
.btn-ghost:hover{background:rgba(199,143,24,.2);color:#fff}
.btn-outline-red{border:1px solid rgba(199,143,24,.4);color:var(--red);border-radius:14px}
.btn-outline-red:hover{background:var(--red);color:var(--red-contrast)}
.hero{position:relative;min-height:720px;display:grid;align-items:center;overflow:hidden;background:radial-gradient(circle at 10% 20%,rgba(199,143,24,.16),transparent 26%),radial-gradient(circle at 90% 12%,rgba(255,77,90,.13),transparent 28%),linear-gradient(180deg,#fff,#fff)}
.hero:before{content:"";position:absolute;inset:auto -20% -35% -20%;height:420px;background:linear-gradient(90deg,transparent,rgba(199,143,24,.08),transparent);transform:rotate(-4deg)}
.hero-title{font-size:clamp(3rem,8vw,6.8rem);line-height:1.02;font-weight:950;letter-spacing:-.06em}
.gradient-text{background:linear-gradient(90deg,var(--red),var(--red2),var(--black));background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:gradientMove 5s ease infinite}
@keyframes gradientMove{0%,100%{background-position:0%}50%{background-position:100%}}
.hero-subtitle{font-size:clamp(1.1rem,2vw,1.5rem);color:#667085;max-width:820px}
.orb{position:absolute;border-radius:999px;filter:blur(42px);opacity:.8;animation:float 8s ease-in-out infinite}
.orb.one{width:280px;height:280px;background:rgba(199,143,24,.16);top:18%;left:4%}
.orb.two{width:360px;height:360px;background:rgba(255,77,90,.12);bottom:10%;right:5%;animation-delay:1.5s}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-22px)}}
.section{padding:96px 0}
.section-muted{background:#f8f8f9}
.eyebrow{color:var(--red);font-weight:800;text-transform:uppercase;letter-spacing:.14em;font-size:.78rem}
.section-title{font-weight:900;letter-spacing:-.04em;font-size:clamp(2rem,4vw,3.5rem)}
.soft-card{background:#fff;border:1px solid rgba(17,17,17,.08);border-radius:var(--radius);box-shadow:0 10px 30px rgba(17,17,17,.05);transition:.3s;height:100%}
.soft-card:hover{transform:translateY(-6px);box-shadow:var(--shadow);border-color:rgba(199,143,24,.32)}
.icon-box{width:58px;height:58px;border-radius:18px;display:grid;place-items:center;background:color-mix(in srgb,var(--red) 9%,transparent);color:var(--red);font-size:1.4rem;transition:.3s}
.review-photo-grid{display:flex;flex-wrap:wrap;gap:10px}
.review-photo-thumb{width:88px;height:88px;object-fit:cover;border-radius:14px;border:1px solid rgba(15,23,42,.08);transition:.15s ease}
.review-photo-thumb:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(15,23,42,.14)}
.soft-card:hover .icon-box{background:var(--red);color:var(--red-contrast);box-shadow:0 16px 34px color-mix(in srgb,var(--red) 25%,transparent)}
.stat-number{font-size:clamp(2rem,4vw,3.25rem);font-weight:900;color:var(--red)}
.logo-cloud span{font-weight:900;font-size:1.45rem;color:rgba(17,17,17,.32)}
.job-card .badge{border-radius:999px}
.profile-avatar{width:74px;height:74px;border-radius:24px;display:grid;place-items:center;background:linear-gradient(135deg,var(--red),var(--red2));color:#1A2730;font-weight:900;font-size:1.4rem}
.search-panel{background:#fff;border:1px solid rgba(17,17,17,.08);border-radius:24px;box-shadow:var(--shadow);padding:1rem}
.form-control,.form-select{border-radius:14px;border-color:rgba(17,17,17,.12);padding:.82rem 1rem}
.form-control:focus,.form-select:focus{border-color:var(--red);box-shadow:0 0 0 .25rem color-mix(in srgb,var(--red) 12%,transparent)}
/* Shared "type to search" location dropdown (assets/js/location-suggest.js),
same styling family as dashboard/provider-setup.php's own service-area
suggestions -- replaces the native popup. */
.location-suggest-wrap{position:relative}
.location-suggest-list{display:none;position:absolute;z-index:20;top:calc(100% + 6px);left:0;right:0;background:#fff;border:1px solid rgba(15,23,42,.12);border-radius:14px;box-shadow:0 18px 40px rgba(15,23,42,.14);padding:6px;max-height:260px;overflow-y:auto}
.location-suggest-list.is-open{display:block}
.location-suggest-item{display:flex;align-items:center;gap:8px;padding:9px 10px;border-radius:10px;cursor:pointer;font-size:.9rem;color:#111827}
.location-suggest-item i{opacity:.6;font-size:.8rem}
.location-suggest-item:hover,.location-suggest-item.is-active{background:#fdf6e3;color:#a5730f}
html[data-bs-theme=dark] body.app-shell .location-suggest-list{background:#1f2430;border-color:rgba(255,255,255,.12)}
html[data-bs-theme=dark] body.app-shell .location-suggest-item{color:#e5e7eb}
html[data-bs-theme=dark] body.app-shell .location-suggest-item:hover,html[data-bs-theme=dark] body.app-shell .location-suggest-item.is-active{background:rgba(199,143,24,.18);color:#f0c368}
/* Admin-managed ad placements (render_country_ad_slot()/render_country_ad_popup()
in marketplace.php) -- same component as figma-home-demo.css's version, ported
to this stylesheet's own tokens so it also renders correctly on pages that load
style.css instead (e.g. find-providers.php's logged-in/app-shell view). */
.country-ad-slot{max-width:1180px;margin:0 auto 24px;padding:16px 24px;border:1px solid rgba(17,17,17,.1);border-left:4px solid var(--red);border-radius:12px;background:#fff;box-shadow:0 10px 26px rgba(17,17,17,.08);display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:90px;position:relative;flex-wrap:wrap}
.country-ad-slot-tag{position:absolute;top:10px;right:12px;font-size:10px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);background:var(--light);border-radius:999px;padding:3px 10px}
.country-ad-slot-main{display:flex;align-items:center;gap:16px}
.country-ad-slot-logo{width:52px;height:52px;border-radius:12px;background:var(--red-contrast);color:var(--red2);font-weight:800;font-size:16px;display:flex;align-items:center;justify-content:center;flex-shrink:0;box-shadow:0 6px 14px rgba(26,39,48,.25)}
.country-ad-slot-text{display:flex;flex-direction:column;gap:3px}
.country-ad-slot-company{color:var(--red-contrast);font-size:16px;font-weight:800}
.country-ad-slot-label{color:var(--muted);font-size:13px;font-weight:600}
.country-ad-slot-cta{display:inline-flex;align-items:center;gap:6px;background:var(--red-contrast);color:var(--red2);font-weight:700;font-size:13.5px;padding:9px 18px;border-radius:999px;text-decoration:none;white-space:nowrap;flex-shrink:0}
.country-ad-slot-cta:hover{background:var(--red);color:var(--red-contrast)}
.country-ad-banner{max-width:1180px;margin:0 auto 24px;position:relative}
.country-ad-banner a{display:block;border-radius:12px;overflow:hidden;line-height:0}
.country-ad-banner img{width:100%;height:auto;display:block}
.country-ad-banner .country-ad-slot-tag{position:absolute;top:10px;right:10px;z-index:1}
html[data-bs-theme=dark] body.app-shell .country-ad-slot{background:#1f2430;border-color:rgba(255,255,255,.12)}
html[data-bs-theme=dark] body.app-shell .country-ad-slot-tag{background:#161c26;color:#9ca3af}
html[data-bs-theme=dark] body.app-shell .country-ad-slot-company{color:#e5e7eb}
.ad-popup-modal{position:fixed;inset:0;z-index:1000;align-items:center;justify-content:center;padding:20px}
.ad-popup-modal:not([hidden]){display:flex}
.ad-popup-modal-backdrop{position:absolute;inset:0;background:rgba(26,39,48,.55)}
.ad-popup-modal-dialog{position:relative;background:#fff;border-radius:20px;max-width:420px;width:100%;overflow:hidden;box-shadow:0 30px 70px rgba(26,39,48,.35)}
.ad-popup-modal-close{position:absolute;top:16px;right:16px;width:32px;height:32px;border-radius:50%;border:0;background:rgba(255,255,255,.85);color:var(--red-contrast);font-size:20px;line-height:1;cursor:pointer;z-index:2}
.ad-popup-modal-media img{width:100%;height:auto;display:block}
.ad-popup-modal-icon{width:64px;height:64px;margin:24px auto 0;border-radius:50%;background:#fff3e1;color:var(--red);font-weight:800;font-size:18px;display:flex;align-items:center;justify-content:center}
.ad-popup-modal-body{padding:24px;text-align:center}
.ad-popup-modal-tag{display:inline-block;font-size:10px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);background:var(--light);border-radius:999px;padding:3px 10px;margin-bottom:10px}
.ad-popup-modal-body h3{font-size:20px;font-weight:800;margin:0 0 8px;color:var(--red-contrast)}
.ad-popup-modal-body p{color:var(--muted);font-size:14px;margin:0 0 20px}
.ad-popup-modal-cta{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;background:var(--red2);color:var(--red-contrast);font-weight:700;font-size:15px;padding:12px;border-radius:8px;text-decoration:none}
.ad-popup-modal-cta:hover{background:var(--red);color:var(--red-contrast)}
html[data-bs-theme=dark] body.app-shell .ad-popup-modal-dialog{background:#1f2430}
html[data-bs-theme=dark] body.app-shell .ad-popup-modal-body h3{color:#e5e7eb}
.category-select-wrap{position:relative;display:flex;flex-direction:column;gap:6px;margin-bottom:1rem}
.category-select-row{display:flex;align-items:center;gap:8px}
.category-select-row select.js-category-select{flex:1 1 auto;margin:0!important}
.category-select-quick-btn{flex:0 0 44px;width:44px;box-sizing:border-box;margin:0;padding:0;line-height:1;border:1px solid rgba(17,17,17,.12);border-radius:14px;background:#fff;color:#6b7280;display:inline-flex;align-items:center;justify-content:center;font-size:.95rem}
.category-select-quick-btn:hover,.category-select-quick-btn:focus{color:var(--red);border-color:var(--red)}
.category-select-quick-panel{position:absolute;z-index:20;top:calc(100% + 6px);left:0;right:0;background:#fff;border:1px solid rgba(15,23,42,.12);border-radius:14px;box-shadow:0 18px 40px rgba(15,23,42,.14);padding:8px}
.category-select-quick-results{max-height:240px;overflow-y:auto;margin-top:6px}
.category-select-quick-result{padding:9px 10px;border-radius:10px;cursor:pointer;font-size:.9rem;color:#111827}
.category-select-quick-result:hover{background:#fff1f2;color:#b4232f}
html[data-bs-theme=dark] body.app-shell .category-select-quick-btn{background:#10151d;border-color:rgba(255,255,255,.14);color:#c9d1d9}
html[data-bs-theme=dark] body.app-shell .category-select-quick-panel{background:#1f2430;border-color:rgba(255,255,255,.12)}
html[data-bs-theme=dark] body.app-shell .category-select-quick-result{color:#e5e7eb}
html[data-bs-theme=dark] body.app-shell .category-select-quick-result:hover{background:rgba(220,53,69,.18);color:#fecaca}
.auth-shell{min-height:calc(100vh - 76px);background:radial-gradient(circle at top left,color-mix(in srgb,var(--red) 14%,transparent),transparent 34%),#fff}
.auth-card{max-width:520px;border:0;border-radius:28px;box-shadow:var(--shadow);overflow:hidden}
.footer-section{background:#111;color:#fff}
.footer-section a{display:block;color:rgba(255,255,255,.58);text-decoration:none;margin:.45rem 0}
.footer-section a:hover{color:#fff}
.socials a{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:rgba(255,255,255,.08)}
.dashboard-layout{display:grid;grid-template-columns:280px 1fr;gap:26px}
.dashboard-sidebar{position:sticky;top:96px;background:#111;border-radius:24px;padding:1rem;height:max-content}
.dash-link{display:flex;align-items:center;gap:.8rem;color:rgba(255,255,255,.68);text-decoration:none;border-radius:16px;padding:.9rem 1rem;margin:.2rem 0;font-weight:600}
.dash-link i{width:20px;text-align:center;opacity:.92}
.dash-link:hover,.dash-link.active{background:rgba(199,143,24,.2);color:#fff}
.dash-badge{margin-left:auto;min-width:20px;height:20px;padding:0 6px;border-radius:10px;background:#C78F18;color:#fff;font-size:.72rem;font-weight:700;line-height:20px;text-align:center;flex-shrink:0}
/* Marketplace pages a freelancer can't use yet without a category/service
area (require_provider_profile_complete() enforces this server-side too,
this is just the visual cue) -- dimmer than normal, lock icon pinned to
the right instead of a notification badge, hover state doesn't highlight
like a real active link would. */
.dash-link-locked{opacity:.45;cursor:not-allowed}
.dash-link-locked:hover{background:none;color:rgba(255,255,255,.68)}
.dash-lock-icon{margin-left:auto;opacity:.8;font-size:.78rem}
.metric-card{background:linear-gradient(135deg,#fff,#fafafa);border:1px solid rgba(17,17,17,.08);border-radius:22px;padding:1.35rem;box-shadow:0 10px 30px rgba(17,17,17,.05)}
.table{vertical-align:middle}
.table-responsive{border-radius:18px;border:1px solid rgba(17,17,17,.08)}
.red-glow{box-shadow:0 0 0 6px color-mix(in srgb,var(--red) 8%,transparent),0 18px 45px color-mix(in srgb,var(--red) 20%,transparent)}
.pricing-card.featured{background:#111;color:#fff;transform:scale(1.03);border-color:var(--red)}
.pricing-card.featured .text-muted{color:rgba(255,255,255,.65)!important}
@media(max-width:991.98px){
.navbar-collapse{padding:1rem 0}
.dashboard-layout{grid-template-columns:1fr}
.dashboard-sidebar{position:relative;top:auto}
.section{padding:68px 0}
.hero{min-height:640px}
.pricing-card.featured{transform:none}
}
/* Nearest handymen map */
.nearest-section{background:radial-gradient(circle at top left,rgba(199,143,24,.08),transparent 32%),#fff}
.nearest-hero{background:#fff;border:1px solid rgba(17,17,17,.08);border-radius:28px;box-shadow:var(--shadow);padding:1.5rem;display:flex;align-items:center;justify-content:space-between;gap:1.5rem}
.nearest-hero-actions{display:flex;gap:.75rem;flex-wrap:wrap;justify-content:flex-end}
.nearest-map-card,.nearest-list-card{background:#fff;border:1px solid rgba(17,17,17,.08);border-radius:28px;box-shadow:0 14px 42px rgba(17,17,17,.08);overflow:hidden;height:100%}
.nearest-map{min-height:620px;width:100%;z-index:1}
.nearest-map-status{padding:1rem 1.25rem;border-top:1px solid rgba(17,17,17,.08);color:#667085;font-weight:600;background:#fff}
.nearest-list-card{padding:1.25rem;max-height:706px;overflow:auto}
.nearest-handyman-list{display:grid;gap:1rem}
.nearest-person-card{border:1px solid rgba(17,17,17,.08);border-radius:22px;padding:1rem;cursor:pointer;transition:.25s;background:linear-gradient(135deg,#fff,#fffafa)}
.nearest-person-card:hover{transform:translateY(-3px);border-color:rgba(199,143,24,.36);box-shadow:0 14px 34px rgba(17,17,17,.08)}
.nearest-person-card h6{font-weight:900;margin-bottom:.2rem;color:#111}
.nearest-rate{font-weight:900;color:#111;white-space:nowrap}
.nearest-skills{color:#667085;font-size:.9rem;margin:.5rem 0 .75rem;line-height:1.5}
.nearest-distance{font-weight:800;color:var(--red);font-size:.85rem;white-space:nowrap}
.nearest-empty{border:1px dashed rgba(17,17,17,.16);border-radius:18px;padding:1.25rem;color:#667085;text-align:center;background:#fafafa}
@media(max-width:991.98px){.nearest-hero{align-items:flex-start;flex-direction:column}.nearest-hero-actions{justify-content:flex-start}.nearest-map{min-height:460px}.nearest-list-card{max-height:none}}
/* Admin UI v2 */
.admin-v2-page{
min-height:calc(100vh - 76px);
padding:32px 0 64px;
background:radial-gradient(circle at top left,rgba(199,143,24,.10),transparent 28%),linear-gradient(180deg,#f7f8fb 0%,#ffffff 100%);
}
.admin-v2-main{width:100%;min-width:0}
.admin-v2-hero,
.admin-page-header,
.review-admin-hero,
.category-admin-hero,
.featured-admin-hero,
.admin-users-hero,
.admin-jobs-hero,
.admin-reports-hero{
position:relative!important;
overflow:hidden!important;
display:flex!important;
align-items:center!important;
justify-content:space-between!important;
gap:24px!important;
margin-bottom:24px!important;
padding:30px!important;
border:1px solid rgba(255,255,255,.10)!important;
border-radius:28px!important;
color:#fff!important;
background:radial-gradient(circle at 88% 16%,rgba(199,143,24,.46),transparent 26%),linear-gradient(135deg,#171717 0%,#111827 58%,#56151b 100%)!important;
box-shadow:0 24px 64px rgba(15,23,42,.18)!important;
}
.admin-v2-hero:after,
.admin-page-header:after,
.review-admin-hero:after,
.category-admin-hero:after,
.featured-admin-hero:after,
.admin-users-hero:after,
.admin-jobs-hero:after,
.admin-reports-hero:after{
content:"";position:absolute;inset:auto -10% -64% 20%;height:190px;background:rgba(255,255,255,.08);transform:rotate(-6deg);border-radius:999px;pointer-events:none;
}
.admin-v2-hero .eyebrow,
.admin-page-header .eyebrow,
.review-admin-hero .eyebrow,
.category-admin-hero .eyebrow,
.featured-admin-hero .eyebrow,
.admin-users-hero .eyebrow,
.admin-jobs-hero .eyebrow,
.admin-reports-hero .eyebrow{color:rgba(255,255,255,.76)!important}
.admin-v2-hero h1,
.admin-page-header h1,
.review-admin-hero h1,
.category-admin-hero h1,
.featured-admin-hero h1,
.admin-users-hero h1,
.admin-jobs-hero h1,
.admin-reports-hero h1{margin:4px 0 8px!important;font-size:clamp(2.1rem,4vw,3.6rem)!important;font-weight:950!important;line-height:1!important;letter-spacing:-.055em!important;color:#fff!important}
.admin-v2-hero p,
.admin-page-header p,
.review-admin-hero p,
.category-admin-hero p,
.featured-admin-hero p,
.admin-users-hero p,
.admin-jobs-hero p,
.admin-reports-hero p{margin:0!important;max-width:820px!important;color:rgba(255,255,255,.74)!important}
.admin-v2-hero-badge{position:relative;z-index:1;min-width:150px;border:1px solid rgba(255,255,255,.14);border-radius:22px;background:rgba(255,255,255,.08);backdrop-filter:blur(10px);padding:16px 18px;text-align:center}
.admin-v2-hero-badge span{display:block;font-weight:950;font-size:2rem;line-height:1;color:#fff}.admin-v2-hero-badge small{color:rgba(255,255,255,.72);font-weight:800;text-transform:uppercase;font-size:.72rem;letter-spacing:.08em}
.admin-users-actions,.admin-jobs-actions,.admin-reports-actions{display:none!important}
.admin-v2-metric-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin-bottom:24px}.admin-v2-metric-grid.four{grid-template-columns:repeat(4,minmax(0,1fr))}
.admin-v2-metric-card{display:block;text-decoration:none;color:inherit;padding:22px;border:1px solid rgba(15,23,42,.07);border-radius:24px;background:#fff;box-shadow:0 16px 44px rgba(15,23,42,.06);transition:.2s ease;min-height:144px}
a.admin-v2-metric-card:hover{transform:translateY(-3px);border-color:rgba(199,143,24,.28);box-shadow:0 22px 56px rgba(15,23,42,.10)}
.admin-v2-metric-card span{color:#64748b;font-size:.84rem;font-weight:850;text-transform:uppercase;letter-spacing:.04em}.admin-v2-metric-card strong{display:block;margin-top:10px;color:#0f172a;font-size:2.05rem;line-height:1;font-weight:950;letter-spacing:-.05em}.admin-v2-metric-card p{margin:10px 0 0;color:#64748b;font-size:.92rem;line-height:1.4}
.admin-v2-grid-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}.admin-v2-panel{overflow:hidden;border:1px solid rgba(15,23,42,.07);border-radius:26px;background:#fff;box-shadow:0 18px 48px rgba(15,23,42,.07)}
.admin-v2-panel-header{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:22px 24px;border-bottom:1px solid rgba(15,23,42,.07);background:linear-gradient(180deg,#fff,#fbfbfc)}.admin-v2-panel-header h2{margin:0;color:#0f172a;font-size:1.12rem;font-weight:900;letter-spacing:-.025em}.admin-v2-panel-header p{margin:4px 0 0;color:#64748b;font-size:.92rem}
.admin-v2-list{display:grid}.admin-v2-list-row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 22px;border-bottom:1px solid rgba(15,23,42,.06)}.admin-v2-list-row:last-child{border-bottom:0}.admin-v2-list-row.stacked strong{display:block}.admin-v2-list-row small{display:block;margin-top:3px;color:#64748b}.admin-v2-list-row span:first-child{font-weight:800;color:#0f172a}
.admin-v2-table-wrap{width:100%;overflow-x:auto}.admin-v2-table{width:100%;min-width:960px;border-collapse:separate;border-spacing:0;margin:0}.admin-v2-table.wide{min-width:1120px}.admin-v2-table th{padding:14px 18px;color:#64748b;background:#f8fafc;border-bottom:1px solid rgba(15,23,42,.08);font-size:.72rem;font-weight:900;text-transform:uppercase;letter-spacing:.08em;white-space:nowrap}.admin-v2-table td{padding:17px 18px;border-bottom:1px solid rgba(15,23,42,.06);vertical-align:middle;color:#334155}.admin-v2-table tbody tr:hover td{background:#fcfcfd}.admin-v2-table tbody tr:last-child td{border-bottom:0}.admin-v2-table small{display:block;margin-top:4px;color:#64748b;font-size:.82rem;line-height:1.4}.admin-v2-table strong{color:#0f172a}
.admin-v2-person{display:flex;align-items:center;gap:12px;min-width:210px}.admin-v2-person.compact{min-width:170px}.admin-v2-avatar{width:42px;height:42px;border-radius:15px;display:grid;place-items:center;background:linear-gradient(135deg,#ffe4e6,#f8fafc);color:#be123c;font-weight:950;flex:0 0 auto}.admin-v2-avatar.muted{background:#f1f5f9;color:#475569}
.admin-v2-pill{display:inline-flex;align-items:center;justify-content:center;gap:6px;width:max-content;border-radius:999px;padding:7px 11px;font-size:.76rem;font-weight:900;line-height:1;white-space:nowrap;border:1px solid transparent}.admin-v2-pill.success{color:#047857;background:#d1fae5;border-color:#a7f3d0}.admin-v2-pill.warning{color:#92400e;background:#fef3c7;border-color:#fde68a}.admin-v2-pill.danger{color:#b91c1c;background:#fee2e2;border-color:#fecaca}.admin-v2-pill.muted{color:#475569;background:#f1f5f9;border-color:#e2e8f0}
.admin-v2-stack{display:flex;flex-direction:column;align-items:flex-start;gap:7px}.people-stack{gap:13px}.admin-v2-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.admin-v2-actions.justify-end{justify-content:flex-end}.admin-v2-inline-form{display:flex;align-items:center;gap:8px;margin:0}.admin-v2-inline-form .form-select,.admin-v2-actions .form-select{min-width:128px;border-radius:999px}.admin-v2-moderation-form{min-width:280px}.admin-v2-moderation-form textarea{border-radius:14px;resize:vertical}.admin-v2-review-copy{min-width:300px;max-width:460px}.admin-v2-review-copy.compact{min-width:280px;max-width:420px}.admin-v2-review-copy .stars{display:block;color:#f59e0b;letter-spacing:.04em;margin-bottom:7px}.admin-v2-review-copy .stars span{color:#64748b;font-size:.8rem;font-weight:900}.admin-v2-review-copy p{margin:0;color:#334155;line-height:1.55}.admin-v2-note{margin-top:8px;padding:8px 10px;border-radius:12px;background:#fffbeb;color:#92400e;border:1px solid #fde68a}.admin-v2-empty{text-align:center!important;color:#64748b!important;padding:36px 24px!important}.admin-v2-form-grid{display:grid;grid-template-columns:2fr repeat(4,1fr) 90px;gap:14px;align-items:end}.admin-v2-small-input{max-width:95px}.admin-v2-date-grid{display:grid;gap:8px;min-width:145px}.admin-v2-icon-select{display:flex;align-items:center;gap:10px;min-width:230px}.admin-v2-icon{width:40px;height:40px;border-radius:14px;display:grid;place-items:center;color:var(--red);background:rgba(199,143,24,.10);flex:0 0 auto}.admin-v2-switch{display:inline-flex;align-items:center;cursor:pointer}.admin-v2-switch input{display:none}.admin-v2-switch span{width:42px;height:24px;border-radius:999px;background:#cbd5e1;position:relative;transition:.2s}.admin-v2-switch span:after{content:"";position:absolute;width:18px;height:18px;border-radius:50%;top:3px;left:3px;background:#fff;box-shadow:0 2px 6px rgba(0,0,0,.15);transition:.2s}.admin-v2-switch input:checked+span{background:var(--red)}.admin-v2-switch input:checked+span:after{transform:translateX(18px)}
.admin-verification-page .verification-request-card,.admin-verification-page .verification-stat-card{border-radius:24px!important}.admin-verification-page .request-card-header h5,.admin-verification-page .requests-section h2{color:#0f172a!important;font-weight:900!important}.verification-header-pill{background:rgba(255,255,255,.10)!important;color:#fff!important;border-color:rgba(255,255,255,.16)!important}
@media(max-width:1200px){.admin-v2-metric-grid,.admin-v2-metric-grid.four{grid-template-columns:repeat(2,minmax(0,1fr))}.admin-v2-form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.admin-v2-form-grid .btn{height:48px}}
@media(max-width:991.98px){.admin-v2-hero,.admin-page-header,.review-admin-hero,.category-admin-hero,.featured-admin-hero,.admin-users-hero,.admin-jobs-hero,.admin-reports-hero{align-items:flex-start!important;flex-direction:column!important;padding:24px!important}.admin-v2-grid-two{grid-template-columns:1fr}.admin-v2-hero-badge{text-align:left}.admin-v2-page{padding:22px 0 48px}}
@media(max-width:640px){.admin-v2-metric-grid,.admin-v2-metric-grid.four,.admin-v2-form-grid{grid-template-columns:1fr}.admin-v2-panel-header{align-items:flex-start;flex-direction:column}.admin-v2-actions.justify-end{justify-content:flex-start}.admin-v2-inline-form{align-items:stretch;flex-direction:column}.admin-v2-inline-form .form-select,.admin-v2-inline-form .btn{width:100%}}
/* Floating Messenger */
.tl-messenger{position:fixed;right:28px;bottom:28px;z-index:1085;font-family:inherit}
/* Bootstrap's default modal/backdrop z-index (1055/1050) sits below the floating messenger
widget above, so any modal opened while the messenger is open (e.g. the close-conversation
confirm) rendered underneath it. Modals must always be topmost. */
.modal-backdrop{z-index:1090}
.modal{z-index:1095}
.tl-messenger-toggle{position:relative;display:inline-flex;align-items:center;gap:10px;border:0;border-radius:999px;background:#fff;color:#151515;padding:10px 16px 10px 10px;box-shadow:0 18px 42px rgba(15,23,42,.18);font-weight:800;transition:.2s ease}
.tl-messenger-toggle:hover{transform:translateY(-2px);box-shadow:0 22px 52px rgba(15,23,42,.22)}
.tl-messenger-toggle-icon{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:#C78F18;color:#fff;box-shadow:0 10px 24px rgba(199,143,24,.34)}
.tl-messenger-toggle-text{white-space:nowrap}
.tl-messenger-badge{position:absolute;top:-6px;right:-4px;min-width:22px;height:22px;padding:0 6px;border-radius:999px;background:#C78F18;color:#fff;border:2px solid #fff;display:grid;place-items:center;font-size:.72rem;font-weight:950;line-height:1}
.tl-messenger-badge.is-hidden{display:none}
.tl-messenger-panel{position:absolute;right:0;bottom:72px;width:min(760px,calc(100vw - 48px));height:min(620px,calc(100vh - 140px));border-radius:26px;background:#fff;border:1px solid rgba(15,23,42,.08);box-shadow:0 28px 80px rgba(15,23,42,.28);overflow:hidden;opacity:0;visibility:hidden;transform:translateY(16px) scale(.98);transform-origin:bottom right;transition:.2s ease}
.tl-messenger.is-open .tl-messenger-panel{opacity:1;visibility:visible;transform:translateY(0) scale(1)}
.tl-messenger-header{height:72px;padding:16px 18px 14px 20px;background:linear-gradient(135deg,#111827,#191919 58%,#56151b);color:#fff;display:flex;align-items:center;justify-content:space-between;gap:14px}
.tl-messenger-header strong{display:block;font-size:1.05rem;letter-spacing:-.02em}
.tl-messenger-header span{display:block;color:rgba(255,255,255,.68);font-size:.82rem;font-weight:600;margin-top:2px}
.tl-messenger-close{width:38px;height:38px;border:0;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.1);color:#fff;transition:.2s}
.tl-messenger-close:hover{background:rgba(255,255,255,.18)}
.tl-messenger-shell{display:grid;grid-template-columns:300px minmax(0,1fr);height:calc(100% - 72px);min-height:0}
.tl-messenger-list-panel{border-right:1px solid rgba(15,23,42,.08);background:#f8fafc;min-height:0;display:flex;flex-direction:column}
.tl-messenger-search{margin:14px;display:flex;align-items:center;gap:8px;padding:10px 12px;border:1px solid rgba(15,23,42,.08);border-radius:16px;background:#fff;color:#94a3b8}
.tl-messenger-search input{border:0;outline:0;background:transparent;width:100%;font-size:.9rem;color:#0f172a}
.tl-messenger-list{overflow:auto;padding:0 10px 12px;display:grid;gap:8px;min-height:0}
.tl-messenger-conversation{width:100%;border:0;border-radius:18px;background:transparent;padding:12px;display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:10px;text-align:left;color:inherit;transition:.18s ease}
.tl-messenger-conversation:hover,.tl-messenger-conversation.is-active{background:#fff;box-shadow:0 10px 28px rgba(15,23,42,.08)}
.tl-messenger-conversation.is-active{outline:2px solid rgba(199,143,24,.12)}
.tl-messenger-avatar{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#ffe4e6,#f8fafc);color:#be123c;font-weight:950;flex:0 0 auto;text-transform:uppercase}
.tl-messenger-conversation-title{display:flex;align-items:center;gap:8px;min-width:0}
.tl-messenger-conversation-title strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#0f172a;font-size:.94rem;line-height:1.2}
.tl-messenger-conversation-subject{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#64748b;font-size:.8rem;font-weight:750;margin-top:2px}
.tl-messenger-conversation-preview{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#94a3b8;font-size:.78rem;margin-top:3px}
.tl-messenger-conversation-time{color:#94a3b8;font-size:.7rem;font-weight:800;white-space:nowrap;text-align:right}
.tl-messenger-mini-badge{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 6px;margin-top:7px;border-radius:999px;background:#C78F18;color:#fff;font-size:.7rem;font-weight:950}
.tl-messenger-chat-panel{min-width:0;min-height:0;background:#fff;position:relative}
.tl-messenger-chat-empty{height:100%;display:grid;place-items:center;align-content:center;text-align:center;padding:30px;color:#64748b}
.tl-messenger-empty-icon{width:68px;height:68px;border-radius:24px;display:grid;place-items:center;margin-bottom:14px;background:rgba(199,143,24,.09);color:#C78F18;font-size:1.7rem}
.tl-messenger-chat-empty strong{display:block;color:#0f172a;font-size:1.1rem;margin-bottom:4px}.tl-messenger-chat-empty span{font-size:.92rem;max-width:260px}
.tl-messenger-chat{height:100%;display:flex;flex-direction:column;min-height:0}.tl-messenger-chat.is-hidden,.tl-messenger-chat-empty.is-hidden{display:none}
.tl-messenger-chat-head{height:70px;padding:12px 18px;border-bottom:1px solid rgba(15,23,42,.08);display:flex;align-items:center;gap:12px;background:#fff}
.tl-messenger-chat-head strong{display:block;color:#0f172a;font-weight:900;line-height:1.1}.tl-messenger-chat-head span{display:block;color:#64748b;font-size:.82rem;font-weight:700;margin-top:3px;max-width:320px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tl-messenger-chat-head-info{flex:1;min-width:0}
.tl-messenger-close-convo{width:36px;height:36px;flex:0 0 auto;border:1px solid rgba(199,143,24,.2);border-radius:50%;background:#fff5f5;color:#C78F18;display:grid;place-items:center;transition:.15s ease}
.tl-messenger-close-convo:hover{background:#C78F18;color:#fff}
.tl-messenger-close-convo.is-hidden{display:none}
.tl-messenger-back{display:none;width:36px;height:36px;border:0;border-radius:50%;background:#f1f5f9;color:#0f172a}
.tl-messenger-reminder{margin:0;padding:10px 18px;background:#fff7ed;border-bottom:1px solid rgba(245,158,11,.24);color:#9a3412;font-size:.82rem;font-weight:700;display:flex;align-items:center;gap:8px}
.tl-messenger-reminder.is-final{background:#fff1f2;border-color:rgba(199,143,24,.24);color:#b4232f}
.tl-messenger-reminder.is-hidden{display:none}
/* Slim proposal action bar (T-001), pinned directly under the chat header. The
whole element is the positioning context for the on-demand panel, which opens
DOWNWARD (position:absolute; top:100%) so it overlays the top of the message
list only while open and never permanently pushes the conversation down. */
.tl-messenger-proposal{position:relative;flex:0 0 auto;z-index:5;border-bottom:1px solid rgba(199,143,24,.2);background:linear-gradient(180deg,#fffdf6,#fff)}
.tl-messenger-proposal.is-hidden{display:none}
.tl-messenger-proposal-bar{display:flex;align-items:center;gap:10px;min-height:44px;padding:6px 12px}
.tl-messenger-proposal-info{display:flex;align-items:center;gap:8px;min-width:0;flex:1 1 auto}
.tl-messenger-proposal-coin{color:#C78F18;font-size:.95rem}
.tl-messenger-proposal-bid{font-size:1rem;font-weight:900;color:#0f172a;letter-spacing:-.02em;white-space:nowrap}
.tl-messenger-proposal-status{display:inline-flex;align-items:center;border-radius:999px;padding:2px 9px;font-size:.68rem;font-weight:800;text-transform:capitalize;white-space:nowrap}
.tl-messenger-proposal-status.is-pending{background:#fff7ed;color:#c2680c}
.tl-messenger-proposal-status.is-shortlisted{background:#eff6ff;color:#2563eb}
.tl-messenger-proposal-status.is-accepted{background:#ecfdf5;color:#16a34a}
.tl-messenger-proposal-status.is-rejected{background:#fef2f2;color:#dc2626}
.tl-messenger-proposal-bar.is-accepted{justify-content:flex-start}
.tl-messenger-proposal-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.tl-messenger-proposal-actions .tl-btn{border:0;border-radius:12px;padding:9px 12px;font-size:.84rem;font-weight:800;cursor:pointer;transition:.15s ease}
.tl-messenger-proposal-actions .tl-btn:disabled{opacity:.6;cursor:not-allowed}
/* Compact bar buttons; the panel keeps the full-size .tl-btn defaults. */
.tl-btn-sm{padding:6px 12px!important;font-size:.8rem!important}
.tl-btn-accept{background:#16a34a;color:#fff}
.tl-btn-accept:hover:not(:disabled){background:#15803d}
.tl-btn-decline{background:#fff;color:#dc2626;border:1px solid rgba(220,38,38,.4)!important}
.tl-btn-decline:hover:not(:disabled){background:#fef2f2}
.tl-btn-update{background:#C78F18;color:#fff}
.tl-btn-update:hover:not(:disabled){background:#a9781a}
.tl-btn-save{background:#C78F18;color:#fff}
.tl-btn-cancel{background:#f1f5f9;color:#475569}
/* Keyboard focus is always visible on the bar/panel controls. */
.tl-messenger-proposal .tl-btn:focus-visible,.tl-messenger-proposal-booking:focus-visible,.tl-messenger-proposal-panel-close:focus-visible{outline:2px solid #C78F18;outline-offset:2px}
.tl-messenger-proposal-booking{display:inline-flex;align-items:center;gap:7px;font-size:.9rem;font-weight:800;color:#16a34a;text-decoration:none}
.tl-messenger-proposal-booking:hover{text-decoration:underline}
/* Downward popover panel -- deliberately small: a light popover, not a card.
Anchored under the bar (top:100%), right-aligned and width-capped so it reads
as a menu bubble; a compact close (x) floats in the corner (no header row). */
.tl-messenger-proposal-panel{position:absolute;right:8px;left:auto;top:calc(100% - 1px);z-index:6;width:max-content;max-width:min(280px,calc(100% - 16px));padding:9px 10px;border:1px solid rgba(199,143,24,.26);border-radius:12px;background:#fff;box-shadow:0 12px 26px rgba(15,23,42,.14);max-height:42vh;overflow:auto}
.tl-messenger-proposal-panel-close{position:absolute;top:5px;right:5px;border:0;background:transparent;color:#b4bcc7;width:20px;height:20px;border-radius:6px;display:grid;place-items:center;font-size:.75rem;line-height:1;cursor:pointer;z-index:1}
.tl-messenger-proposal-panel-close:hover{background:#f1f5f9;color:#475569}
.tl-messenger-proposal-title{display:block;font-size:.62rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:#a9863c;margin:0 18px 4px 0}
.tl-messenger-proposal-panel .tl-messenger-proposal-actions{margin-top:8px;gap:6px}
.tl-messenger-proposal-panel .tl-messenger-proposal-actions .tl-btn{flex:1 1 auto;min-width:80px;padding:7px 10px;font-size:.8rem}
.tl-messenger-proposal-form{display:flex;flex-direction:column;gap:5px}
.tl-messenger-proposal-form label{font-size:.62rem;font-weight:800;color:#64748b;letter-spacing:.02em}
.tl-messenger-proposal-form input,.tl-messenger-proposal-form textarea{width:100%;border:1px solid rgba(15,23,42,.14);border-radius:9px;padding:6px 9px;font-size:.82rem;outline:0;background:#fff;color:#0f172a;font-family:inherit}
.tl-messenger-proposal-form input:focus,.tl-messenger-proposal-form textarea:focus{border-color:rgba(199,143,24,.5);box-shadow:0 0 0 2px rgba(199,143,24,.12)}
.tl-messenger-proposal-form textarea{min-height:48px;resize:vertical}
.tl-messenger-proposal-error{margin-top:4px;font-size:.72rem;font-weight:700;color:#dc2626}
.tl-messenger-messages{flex:1;min-height:0;overflow:auto;padding:18px;background:linear-gradient(180deg,#fff,#fbfbfc);display:flex;flex-direction:column;gap:10px}
.tl-messenger-message{display:flex;flex-direction:column;align-items:flex-start;max-width:82%}.tl-messenger-message.is-mine{align-self:flex-end;align-items:flex-end}
.tl-messenger-bubble{border-radius:20px 20px 20px 6px;background:#f1f5f9;color:#0f172a;padding:10px 13px;font-size:.92rem;line-height:1.42;word-break:break-word;box-shadow:0 6px 14px rgba(15,23,42,.04)}
.tl-messenger-message.is-mine .tl-messenger-bubble{border-radius:20px 20px 6px 20px;background:#C78F18;color:#fff}
.tl-messenger-message-time{margin-top:4px;color:#94a3b8;font-size:.7rem;font-weight:700}
.tl-messenger-compose{display:flex;align-items:center;gap:10px;padding:14px;border-top:1px solid rgba(15,23,42,.08);background:#fff}
.tl-messenger-compose input{flex:1;border:1px solid rgba(15,23,42,.1);border-radius:999px;padding:12px 15px;outline:0;font-size:.92rem;background:#f8fafc}
.tl-messenger-compose input:focus{border-color:rgba(199,143,24,.45);background:#fff;box-shadow:0 0 0 4px rgba(199,143,24,.08)}
.tl-messenger-compose button{width:44px;height:44px;border:0;border-radius:50%;background:#C78F18;color:#fff;display:grid;place-items:center;box-shadow:0 10px 24px rgba(199,143,24,.24)}
.tl-messenger-empty{padding:26px 18px;text-align:center;color:#64748b;background:#fff;border:1px dashed rgba(15,23,42,.12);border-radius:18px;margin:4px}.tl-messenger-error{padding:10px 12px;margin:10px;border-radius:14px;background:#fef2f2;color:#b91c1c;font-weight:700;font-size:.85rem}
.tl-messenger-attach{width:40px;height:40px;flex:0 0 auto;border:1px solid rgba(15,23,42,.1);border-radius:50%;background:#f8fafc;color:#64748b;display:grid;place-items:center;box-shadow:none;transition:.15s ease}
.tl-messenger-attach:hover{background:#f1f5f9;color:#C78F18}
.tl-messenger-attachment-preview{display:flex;align-items:center;gap:8px;margin:0 14px;padding:8px 12px;border:1px solid rgba(199,143,24,.2);background:#fff5f5;border-radius:14px;color:#b4232f;font-size:.84rem;font-weight:700}
.tl-messenger-attachment-preview.is-hidden{display:none}
.tl-messenger-attachment-preview span{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tl-messenger-attachment-preview button{border:0;background:transparent;color:#b4232f;width:22px;height:22px;display:grid;place-items:center}
.tl-messenger-attachment-image{display:block;max-width:220px;max-height:220px;border-radius:14px;margin-top:6px;object-fit:cover;cursor:pointer}
.tl-messenger-attachment-file{display:inline-flex;align-items:center;gap:8px;margin-top:6px;padding:8px 12px;border-radius:14px;background:rgba(15,23,42,.05);color:inherit;font-size:.86rem;font-weight:700;text-decoration:none}
.tl-messenger-message.is-mine .tl-messenger-attachment-file{background:rgba(255,255,255,.18);color:#fff}
.tl-messenger-attachment-file i{opacity:.75}
@media(max-width:767.98px){.tl-messenger{right:14px;bottom:18px}.tl-messenger-toggle-text{display:none}.tl-messenger-toggle{padding:8px}.tl-messenger-panel{position:fixed;left:10px;right:10px;bottom:82px;width:auto;height:min(680px,calc(100vh - 102px));border-radius:24px}.tl-messenger-shell{grid-template-columns:1fr}.tl-messenger-list-panel{border-right:0}.tl-messenger-chat-panel{position:absolute;inset:72px 0 0;background:#fff;transform:translateX(100%);transition:.2s ease}.tl-messenger.has-active-chat .tl-messenger-chat-panel{transform:translateX(0)}.tl-messenger-back{display:grid;place-items:center}.tl-messenger-chat-head span{max-width:190px}}
.tl-messenger-mini-badge.muted{background:#e2e8f0;color:#475569}.tl-messenger-compose.is-readonly{background:#f8fafc}.tl-messenger-compose.is-readonly input{background:#eef2f7;color:#64748b;cursor:not-allowed}.tl-messenger-compose.is-readonly button{background:#cbd5e1;box-shadow:none;cursor:not-allowed}
.tl-messenger-translation{margin-top:6px;padding-top:6px;border-top:1px dashed rgba(15,23,42,.14);font-size:.82rem;line-height:1.38;opacity:.82;white-space:pre-line}
.tl-messenger-message.is-mine .tl-messenger-translation{border-top-color:rgba(255,255,255,.28)}
.tl-messenger-translation-tag{display:inline-block;margin-right:6px;padding:1px 7px;border-radius:999px;background:rgba(15,23,42,.08);color:#475569;font-size:.62rem;font-weight:800;letter-spacing:.03em;text-transform:uppercase;vertical-align:middle}
.tl-messenger-message.is-mine .tl-messenger-translation-tag{background:rgba(255,255,255,.22);color:#fff}
.tl-messenger-translate-bar{display:flex;align-items:center;gap:10px;padding:8px 14px;border-top:1px solid rgba(15,23,42,.06);background:#fbfcfe}
.tl-messenger-translate-toggle{display:inline-flex;align-items:center;gap:7px;margin:0;font-size:.8rem;font-weight:700;color:#475569;cursor:pointer}
.tl-messenger-translate-toggle input{width:15px;height:15px;accent-color:#C78F18;cursor:pointer}
.tl-messenger-translate-lang{margin-left:auto;border:1px solid rgba(15,23,42,.12);border-radius:999px;padding:5px 12px;font-size:.8rem;font-weight:700;color:#334155;background:#fff;outline:0;cursor:pointer}
.tl-messenger-translate-lang:disabled{opacity:.5;cursor:not-allowed}
.tl-messenger-translate-lang:focus{border-color:rgba(199,143,24,.45);box-shadow:0 0 0 3px rgba(199,143,24,.1)}
html[data-bs-theme=dark] body.app-shell .tl-messenger-translate-bar{background:#0d1117!important;border-color:rgba(255,255,255,.08)!important}
html[data-bs-theme=dark] body.app-shell .tl-messenger-translate-toggle{color:#9aa4b2!important}
html[data-bs-theme=dark] body.app-shell .tl-messenger-translate-lang{background:#161c26!important;border-color:rgba(255,255,255,.1)!important;color:#e6edf3!important}
html[data-bs-theme=dark] body.app-shell .tl-messenger-translation-tag{background:rgba(255,255,255,.12)!important;color:#c9d1d9!important}
.admin-messages-filter-panel{margin-bottom:24px}.admin-messages-filters{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(190px,.65fr) auto;gap:16px;align-items:end;padding:20px 24px}.admin-messages-filter-actions{display:flex;gap:10px;align-items:center}.admin-messages-layout{display:grid;grid-template-columns:minmax(320px,430px) minmax(0,1fr);gap:24px;align-items:start}.admin-message-thread-list{display:grid;gap:10px;padding:14px;background:#f8fafc;max-height:760px;overflow:auto}.admin-message-thread{display:block;padding:15px;border-radius:20px;background:#fff;border:1px solid rgba(15,23,42,.07);color:inherit;text-decoration:none;transition:.18s ease}.admin-message-thread:hover,.admin-message-thread.active{border-color:rgba(199,143,24,.22);box-shadow:0 14px 34px rgba(15,23,42,.08);transform:translateY(-1px)}.admin-message-thread.active{outline:2px solid rgba(199,143,24,.12)}.admin-message-thread-top{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}.admin-message-thread-top strong{color:#0f172a;font-weight:900;line-height:1.25}.admin-message-thread-people{display:grid;gap:4px;margin-top:9px;color:#64748b;font-size:.84rem;font-weight:750}.admin-message-thread-people span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.admin-message-thread p{margin:10px 0 0;color:#475569;font-size:.88rem;line-height:1.45}.admin-message-thread-meta{display:flex;justify-content:space-between;gap:10px;margin-top:11px;color:#94a3b8;font-size:.75rem;font-weight:900;text-transform:uppercase;letter-spacing:.04em}.admin-message-transcript-header{align-items:flex-start}.admin-message-participants{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding:18px 22px;border-bottom:1px solid rgba(15,23,42,.07);background:#fff}.admin-message-note{margin:18px 22px 0;padding:12px 14px;border-radius:16px;background:#f8fafc;color:#475569;font-size:.9rem;font-weight:700;display:flex;gap:9px;align-items:flex-start}.admin-message-note i{color:#C78F18;margin-top:2px}.admin-message-transcript{display:flex;flex-direction:column;gap:12px;padding:22px;max-height:680px;overflow:auto;background:linear-gradient(180deg,#fff,#fbfbfc)}.admin-message-bubble{max-width:82%;padding:13px 15px;border-radius:20px;background:#f1f5f9;color:#0f172a;box-shadow:0 7px 18px rgba(15,23,42,.04)}.admin-message-bubble.from-provider{align-self:flex-end;background:#fff5f5;border:1px solid rgba(199,143,24,.11)}.admin-message-bubble-head{display:flex;justify-content:space-between;gap:14px;margin-bottom:7px}.admin-message-bubble-head strong{font-size:.92rem;color:#0f172a}.admin-message-bubble-head span{font-size:.73rem;color:#64748b;font-weight:850;white-space:nowrap}.admin-message-bubble p{margin:0;color:#334155;line-height:1.5;word-break:break-word}.admin-message-attachment-image{display:block;max-width:260px;max-height:260px;border-radius:14px;margin-top:8px;object-fit:cover}.admin-message-attachment-file{display:inline-flex;align-items:center;margin-top:8px;padding:8px 12px;border-radius:14px;background:rgba(15,23,42,.05);color:#0f172a;font-size:.86rem;font-weight:700;text-decoration:none}.admin-message-empty-state{min-height:420px;display:grid;place-items:center;align-content:center;text-align:center;color:#64748b;padding:32px}.admin-message-empty-state strong{display:block;color:#0f172a;font-size:1.1rem;margin-bottom:4px}.admin-message-empty-icon{width:68px;height:68px;border-radius:24px;display:grid;place-items:center;background:rgba(199,143,24,.09);color:#C78F18;font-size:1.7rem;margin-bottom:14px}@media(max-width:1199px){.admin-messages-layout{grid-template-columns:1fr}.admin-message-thread-list,.admin-message-transcript{max-height:none}}@media(max-width:767.98px){.admin-messages-filters,.admin-message-participants{grid-template-columns:1fr}.admin-messages-filter-actions{align-items:stretch;flex-direction:column}.admin-messages-filter-actions .btn{width:100%}.admin-message-bubble{max-width:100%}.admin-message-bubble-head{flex-direction:column;gap:3px}.admin-message-bubble-head span{white-space:normal}}
/* App dashboard (client & freelancer) */
.appdash{background:#f3f4f8;padding:2.2rem 0 3.2rem}
.appdash-container{max-width:1560px;margin:0 auto;padding:0 24px}
.appdash-kicker{display:block;font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.1em;color:#9ca3af;margin-bottom:.2rem}
.appdash-greeting h1{font-size:1.65rem;font-weight:800;letter-spacing:-.03em;margin:0}
.appdash-greeting p{color:#6b7280;margin:.2rem 0 0}
.appdash-card{background:#fff;border:1px solid rgba(17,17,17,.06);border-radius:20px;box-shadow:0 1px 3px rgba(17,17,17,.05)}
.appdash-card .card-pad{padding:1.4rem 1.5rem}
.appdash-stat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.stat-tile{display:flex;gap:14px;align-items:center;background:#fff;border:1px solid rgba(17,17,17,.06);border-radius:18px;padding:1.05rem 1.2rem;box-shadow:0 1px 3px rgba(17,17,17,.05);text-decoration:none;color:inherit;transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease}
a.stat-tile:hover,a.stat-tile:focus-visible{transform:translateY(-2px);box-shadow:0 10px 24px rgba(17,17,17,.09);border-color:rgba(230,57,70,.25);color:inherit;text-decoration:none}
.stat-tile strong{font-size:1.4rem;letter-spacing:-.03em;line-height:1.15;display:block}
.stat-tile span{color:#6b7280;font-size:.78rem;font-weight:600;line-height:1.3;display:block}
.tile-icon{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;font-size:1.05rem;flex-shrink:0}
.tile-icon.red{background:rgba(220,53,69,.1);color:#dc3545}
.tile-icon.blue{background:rgba(37,99,235,.1);color:#2563eb}
.tile-icon.green{background:rgba(5,150,105,.1);color:#059669}
.tile-icon.amber{background:rgba(217,119,6,.12);color:#d97706}
.tile-icon.violet{background:rgba(124,58,237,.1);color:#7c3aed}
.appdash-actions{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px}
.action-card{display:flex;align-items:center;gap:12px;border-radius:16px;padding:.95rem 1.15rem;border:1px solid transparent;text-decoration:none;font-weight:600;transition:.2s}
.action-card:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(17,17,17,.08)}
.action-card strong{font-weight:800}
.action-card.amber{background:#fff7ed;color:#9a3412;border-color:#fed7aa}
.action-card.amber:hover{color:#7c2d12}
.action-card.red{background:#fef2f2;color:#b91c1c;border-color:#fecaca}
.action-card.red:hover{color:#991b1b}
.action-card.blue{background:#eff6ff;color:#1d4ed8;border-color:#bfdbfe}
.action-card.blue:hover{color:#1e40af}
.pipeline-row{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.pipeline-row .label{width:96px;color:#6b7280;font-size:.78rem;font-weight:700;flex-shrink:0}
.pipeline-row strong{min-width:26px;text-align:right}
.pipeline-bar{flex:1;height:10px;background:#eef0f4;border-radius:99px;overflow:hidden}
.pipeline-bar i{display:block;height:100%;border-radius:99px;min-width:2px}
.chart-wrap{position:relative;height:260px}
.chart-wrap.donut{height:210px}
.appdash-table th{font-size:.72rem;text-transform:uppercase;letter-spacing:.06em;color:#9ca3af;border-bottom:1px solid #eef0f4;font-weight:800}
.appdash-table td{border-color:#f2f3f7}
.fl-hero{background:linear-gradient(135deg,#111827 0%,#1f2937 55%,#3d1116 100%);border-radius:22px;color:#fff;padding:1.7rem 1.9rem;position:relative;overflow:hidden}
.fl-hero::after{content:'';position:absolute;right:-70px;top:-70px;width:260px;height:260px;border-radius:50%;background:rgba(199,143,24,.3);filter:blur(70px)}
.fl-hero .avatar{width:64px;height:64px;border-radius:18px;background:rgba(255,255,255,.12);display:grid;place-items:center;font-weight:800;font-size:1.25rem;overflow:hidden;flex-shrink:0}
.fl-hero .avatar img{width:100%;height:100%;object-fit:cover}
.fl-hero .rating{color:#fbbf24;font-size:.88rem}
.fl-plan-pill{display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.2);color:#fff;border-radius:99px;padding:4px 12px;font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.06em}
.fl-completeness{margin-top:14px;max-width:420px}
.fl-completeness .bar{height:8px;border-radius:99px;background:rgba(255,255,255,.15);overflow:hidden}
.fl-completeness .bar i{display:block;height:100%;background:linear-gradient(90deg,#C78F18,#fb7185);border-radius:99px}
.fl-hero-stats{display:flex;gap:28px;flex-wrap:wrap}
.fl-hero-stats strong{display:block;font-size:1.3rem;letter-spacing:-.02em}
.fl-hero-stats span{color:rgba(255,255,255,.6);font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em}
.dashboard-status-pill{display:inline-flex;align-items:center;border-radius:999px;padding:7px 10px;font-size:.74rem;font-weight:900;line-height:1;border:1px solid transparent;white-space:nowrap}
.dashboard-status-pill.success{color:#047857;background:#d1fae5;border-color:#a7f3d0}
.dashboard-status-pill.warning{color:#92400e;background:#fef3c7;border-color:#fde68a}
.dashboard-status-pill.danger{color:#b91c1c;background:#fee2e2;border-color:#fecaca}
.dashboard-status-pill.muted{color:#475569;background:#f1f5f9;border-color:#e2e8f0}
.dashboard-notification-item{border:1px solid rgba(15,23,42,.08);border-radius:16px;padding:14px;background:#fff}
.dashboard-notification-item+.dashboard-notification-item{margin-top:12px}
.dashboard-main-content{min-width:0}
@media(max-width:1199.98px){.appdash-stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:767.98px){.appdash-stat-grid{grid-template-columns:1fr}.fl-hero{padding:1.3rem}.chart-wrap{height:220px}.appdash{padding:1.4rem 0 2.2rem}.appdash-container{padding:0 14px}}
/* ===== App chrome (backend navbar + footer) ===== */
/* Sticky footer: body is a flex column filling the viewport, site-main grows
to take up any leftover space, and the page's own top-level
(appdash, section-muted, admin-v2-page, etc. -- whichever a given app page
renders) stretches with it, so its background reaches the footer with no
dead gap either above or below the footer on short pages. */
body.app-shell{display:flex;flex-direction:column;min-height:100vh}
body.app-shell .site-main{padding-top:64px;flex:1 0 auto;display:flex;flex-direction:column}
body.app-shell .site-main>section{flex:1 0 auto}
.app-breadcrumb{background:transparent;border-bottom:1px solid rgba(17,17,17,.06);padding:10px 0}
.app-breadcrumb-inner{width:100%;max-width:1560px;margin:0 auto;padding:0 24px}
.app-breadcrumb .breadcrumb{font-size:.82rem;font-weight:700}
.app-breadcrumb .breadcrumb-item a{color:#6B7280;text-decoration:none}
.app-breadcrumb .breadcrumb-item a:hover{color:var(--red)}
.app-breadcrumb .breadcrumb-item.active{color:#111111}
html[data-bs-theme=dark] .app-breadcrumb{border-color:rgba(255,255,255,.08)}
html[data-bs-theme=dark] .app-breadcrumb .breadcrumb-item a{color:#8b949e}
html[data-bs-theme=dark] .app-breadcrumb .breadcrumb-item a:hover{color:#fda4af}
html[data-bs-theme=dark] .app-breadcrumb .breadcrumb-item.active{color:#f0f3f6}
html[data-bs-theme=dark] .app-breadcrumb .breadcrumb-item+.breadcrumb-item::before{color:#8b949e}
.app-nav{background:#0f1319;border-bottom:1px solid rgba(255,255,255,.08);min-height:64px;padding:.3rem 0}
.app-nav-container{width:100%;max-width:1560px;margin:0 auto;padding:0 24px;display:flex;align-items:center;flex-wrap:inherit;justify-content:space-between}
.app-nav .brand-logo{height:36px}
/* Dashboard's dark app-nav shows the current PandaTasker logo (a wide
horizontal wordmark, unlike the old stacked icon+wordmark sprite) as one
whole image scaled to fit, instead of the crop-split technique still used
below for the (currently unreachable, kept for parity) marketing
includes/navbar.php, which still renders the old sprite-based asset. */
.app-nav-logo-mark{height:auto;width:auto;max-height:52px;max-width:260px;flex-shrink:0}
.marketing-nav-logo-icon,.marketing-nav-logo-word{position:relative;overflow:hidden;flex-shrink:0}
.marketing-nav-logo-icon{width:52px;height:46px}
.marketing-nav-logo-word{width:150px;height:45px}
.marketing-nav-logo-icon img{position:absolute;max-width:none;width:165.44%;height:185.83%;left:-32.72%;top:-24.15%}
.marketing-nav-logo-word img{position:absolute;max-width:none;width:160.77%;height:535.9%;left:-30.38%;top:-352.56%}
.app-nav-role{font-size:.62rem;font-weight:900;text-transform:uppercase;letter-spacing:.1em;color:#fff;background:linear-gradient(135deg,var(--red),var(--red2));border-radius:8px;padding:4px 8px}
.app-nav-role-form{margin:0;display:flex}
.app-nav-role-btn{display:inline-flex;align-items:center;gap:6px;border:0;cursor:pointer;transition:transform .15s ease,box-shadow .15s ease}
/* The switch button shows the destination action ("Switch to Provider"),
not the short current-role label .app-nav-role normally shows elsewhere
(e.g. the non-dual-role fallback span) -- uppercase+wide letter-spacing
reads fine on one word but not a whole phrase, so this overrides just the
button's own text run rather than changing .app-nav-role globally. */
.app-nav-role-action{font-size:.74rem;font-weight:800;text-transform:none;letter-spacing:normal}
.app-nav-role-btn i{font-size:.68rem;opacity:.85}
.app-nav-role-btn:hover,.app-nav-role-btn:focus-visible{transform:translateY(-1px);box-shadow:0 6px 16px rgba(199,143,24,.4)}
/* Unread-activity count on the role-switch button/menu-item -- white-on-red
for the quick-toggle button (already sits on a red gradient), red-on-white
for the dropdown-menu item (sits on a plain white/dark row instead). */
.app-nav-role-badge{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:#fff;color:var(--red);font-size:.65rem;font-weight:900;line-height:1}
.app-nav-role-badge-inline{background:var(--red);color:#fff;margin-left:auto}
/* The quick-toggle button and hamburger are the only two things that stay
visible outside the #appNav collapse below the xl breakpoint -- language,
View Website, theme toggle, user chip, and Logout all hide behind the
hamburger instead. Below 480px specifically, [logo][full button text][
hamburger] gets tight, so the action text collapses to icon+badge only;
the full "Switch to Provider/Client" wording is still available via the
button's title tooltip and, more importantly, from the dropdown-menu item
inside the hamburger, which always shows the full text regardless.*/
@media(max-width:479.98px){.app-nav-role-action{display:none}.app-nav-role-btn{padding:.4rem .55rem}}
.app-nav-menu{gap:2px}
.app-nav-menu .nav-link{display:flex;align-items:center;gap:.45rem;color:rgba(255,255,255,.66);font-weight:600;font-size:.85rem;border-radius:10px;padding:.5rem .65rem;white-space:nowrap}
.app-nav-menu .nav-link i{font-size:.78rem;opacity:.9}
.app-nav-menu .nav-link:hover{color:#fff;background:rgba(255,255,255,.07)}
.app-nav-menu .nav-link.active{color:#fff;background:rgba(199,143,24,.24)}
.app-nav-menu .dash-badge{margin-left:2px}
.app-user-chip{display:flex;align-items:center;gap:8px;color:#fff;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:4px 10px 4px 4px;font-weight:700;font-size:.84rem;cursor:pointer}
.app-user-chip:hover{background:rgba(255,255,255,.1)}
.app-user-chip .avatar{width:30px;height:30px;border-radius:9px;background:linear-gradient(135deg,var(--red),var(--red2));display:grid;place-items:center;font-size:.7rem;font-weight:800;overflow:hidden;color:#fff}
.app-user-chip .avatar img{width:100%;height:100%;object-fit:cover}
.app-user-chip::after{color:rgba(255,255,255,.5)}
/* Uniform sizing for the right-hand cluster (language, View Website,
notification bell, avatar chip) -- these used to mix Bootstrap's default
.btn-outline-light radius (~6px), the custom .btn-ghost/.btn-red radius
(14px), .app-user-chip's own 12px, and the notification bell's fully
circular 999px, which read as visually inconsistent side by side. Scoped
to .app-nav specifically so .btn-ghost/.btn-red/.btn-outline-light keep
their normal appearance everywhere else on the site. */
.app-nav .btn-ghost,
.app-nav .btn-outline-light,
.app-nav .app-user-chip,
.app-nav .tl-notif-bell-toggle{height:38px;border-radius:12px}
.app-nav .btn-ghost,
.app-nav .btn-outline-light{display:inline-flex;align-items:center}
.app-nav .tl-notif-bell-toggle{width:38px}
/* Same border + hover treatment across the whole neutral cluster
(language, View Website, notification bell, avatar chip) -- these
previously mixed Bootstrap's solid-fill .btn-outline-light hover, two
different white-tint hover opacities, and border alphas from .12 to .25.
The standalone Logout button that used to sit here was removed (already
in the user dropdown menu, redundant) -- nothing left in .app-nav uses
.btn-red now. */
.app-nav .btn-ghost,
.app-nav .btn-outline-light,
.app-nav .app-user-chip,
.app-nav .tl-notif-bell-toggle{
border-color:rgba(255,255,255,.14)!important;
background:rgba(255,255,255,.06)!important;
color:#fff!important
}
.app-nav .btn-ghost:hover,
.app-nav .btn-outline-light:hover,
.app-nav .app-user-chip:hover,
.app-nav .tl-notif-bell-toggle:hover{
background:rgba(199,143,24,.2)!important;
color:#fff!important
}
.app-footer{background:#0f1319;color:rgba(255,255,255,.6)}
.app-footer-inner{max-width:1560px;margin:0 auto;padding:1rem 24px;display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;font-size:.84rem}
.app-footer-menu{display:flex;gap:1rem;flex-wrap:wrap}
.app-footer-menu a{color:rgba(255,255,255,.6);text-decoration:none;font-weight:600}
.app-footer-menu a:hover{color:#fff}
.app-footer-logout{color:#fb7185;text-decoration:none;font-weight:700}
.app-footer-logout:hover{color:#fda4af}
@media(max-width:1199.98px){.app-nav-menu .nav-link{padding:.6rem .75rem}.app-nav .navbar-collapse{max-height:calc(100vh - 70px);overflow-y:auto}}
/* Marketing-styled pages (subscription, stripe) rendered inside the app shell */
body.app-shell .section{padding:44px 0}
body.app-shell .section-muted{background:transparent}
/* ===== Dark mode (backend pages) ===== */
html[data-bs-theme=dark] body.app-shell{background:#0d1117;color:#c9d1d9}
html[data-bs-theme=dark] body.app-shell .loader{background:#0d1117}
html[data-bs-theme=dark] body.app-shell h1,html[data-bs-theme=dark] body.app-shell h2,html[data-bs-theme=dark] body.app-shell h3,html[data-bs-theme=dark] body.app-shell h4,html[data-bs-theme=dark] body.app-shell h5,html[data-bs-theme=dark] body.app-shell h6{color:#f0f3f6}
html[data-bs-theme=dark] body.app-shell .text-muted{color:#8b949e!important}
html[data-bs-theme=dark] body.app-shell .appdash{background:transparent}
html[data-bs-theme=dark] body.app-shell .appdash-card,
html[data-bs-theme=dark] body.app-shell .stat-tile,
html[data-bs-theme=dark] body.app-shell .soft-card,
html[data-bs-theme=dark] body.app-shell .metric-card,
html[data-bs-theme=dark] body.app-shell .dashboard-notification-item,
html[data-bs-theme=dark] body.app-shell .search-panel{background:#161c26;border-color:rgba(255,255,255,.08);box-shadow:none;color:#c9d1d9}
html[data-bs-theme=dark] body.app-shell .stat-tile span,
html[data-bs-theme=dark] body.app-shell .appdash-greeting p{color:#8b949e}
html[data-bs-theme=dark] body.app-shell .appdash-table th{border-color:rgba(255,255,255,.08)}
html[data-bs-theme=dark] body.app-shell .appdash-table td{border-color:rgba(255,255,255,.05)}
html[data-bs-theme=dark] body.app-shell .table-responsive{border-color:rgba(255,255,255,.08)}
html[data-bs-theme=dark] body.app-shell .pipeline-bar{background:#232b38}
html[data-bs-theme=dark] body.app-shell .badge.text-bg-light{background:#232b38!important;color:#c9d1d9!important;border-color:rgba(255,255,255,.1)!important}
html[data-bs-theme=dark] body.app-shell .btn-light{background:#232b38;border-color:rgba(255,255,255,.12);color:#c9d1d9}
html[data-bs-theme=dark] body.app-shell .action-card.blue{background:rgba(37,99,235,.16);color:#93c5fd;border-color:rgba(37,99,235,.35)}
html[data-bs-theme=dark] body.app-shell .action-card.amber{background:rgba(217,119,6,.16);color:#fcd34d;border-color:rgba(217,119,6,.35)}
html[data-bs-theme=dark] body.app-shell .action-card.red{background:rgba(220,53,69,.16);color:#fda4af;border-color:rgba(220,53,69,.35)}
html[data-bs-theme=dark] body.app-shell .dashboard-status-pill.success{color:#6ee7b7;background:rgba(5,150,105,.16);border-color:rgba(5,150,105,.35)}
html[data-bs-theme=dark] body.app-shell .dashboard-status-pill.warning{color:#fcd34d;background:rgba(217,119,6,.16);border-color:rgba(217,119,6,.35)}
html[data-bs-theme=dark] body.app-shell .dashboard-status-pill.danger{color:#fda4af;background:rgba(220,53,69,.16);border-color:rgba(220,53,69,.35)}
html[data-bs-theme=dark] body.app-shell .dashboard-status-pill.muted{color:#9aa4b2;background:#232b38;border-color:rgba(255,255,255,.1)}
html[data-bs-theme=dark] body.app-shell .form-control,
html[data-bs-theme=dark] body.app-shell .form-select{background:#10151d;border-color:rgba(255,255,255,.12);color:#c9d1d9}
html[data-bs-theme=dark] body.app-shell .form-control::placeholder{color:#6b7280}
html[data-bs-theme=dark] body.app-shell .table{--bs-table-bg:transparent;--bs-table-color:#c9d1d9}
/* Dark mode for admin-v2 (must out-specify the !important rules there) */
html[data-bs-theme=dark] body.app-shell .admin-v2-page{background:#0d1117!important}
html[data-bs-theme=dark] body.app-shell .admin-v2-panel,
html[data-bs-theme=dark] body.app-shell .admin-v2-metric-card{background:#161c26!important;border-color:rgba(255,255,255,.08)!important;box-shadow:none!important}
html[data-bs-theme=dark] body.app-shell .admin-v2-panel-header{background:#161c26!important;border-color:rgba(255,255,255,.08)!important}
html[data-bs-theme=dark] body.app-shell .admin-v2-panel-header h2,
html[data-bs-theme=dark] body.app-shell .admin-v2-metric-card strong,
html[data-bs-theme=dark] body.app-shell .admin-v2-table strong,
html[data-bs-theme=dark] body.app-shell .admin-v2-list-row span:first-child{color:#f0f3f6!important}
html[data-bs-theme=dark] body.app-shell .admin-v2-metric-card span,
html[data-bs-theme=dark] body.app-shell .admin-v2-metric-card p,
html[data-bs-theme=dark] body.app-shell .admin-v2-panel-header p,
html[data-bs-theme=dark] body.app-shell .admin-v2-list-row small,
html[data-bs-theme=dark] body.app-shell .admin-v2-table small,
html[data-bs-theme=dark] body.app-shell .admin-v2-empty{color:#8b949e!important}
html[data-bs-theme=dark] body.app-shell .admin-v2-table th{background:#10151d!important;border-color:rgba(255,255,255,.08)!important;color:#8b949e!important}
html[data-bs-theme=dark] body.app-shell .admin-v2-table td{border-color:rgba(255,255,255,.05)!important;color:#aeb7c2!important}
html[data-bs-theme=dark] body.app-shell .admin-v2-table tbody tr:hover td{background:#1a212c!important}
html[data-bs-theme=dark] body.app-shell .admin-v2-list-row{border-color:rgba(255,255,255,.05)!important}
html[data-bs-theme=dark] body.app-shell .admin-v2-pill.success{color:#6ee7b7!important;background:rgba(5,150,105,.16)!important;border-color:rgba(5,150,105,.35)!important}
html[data-bs-theme=dark] body.app-shell .admin-v2-pill.warning{color:#fcd34d!important;background:rgba(217,119,6,.16)!important;border-color:rgba(217,119,6,.35)!important}
html[data-bs-theme=dark] body.app-shell .admin-v2-pill.danger{color:#fda4af!important;background:rgba(220,53,69,.16)!important;border-color:rgba(220,53,69,.35)!important}
html[data-bs-theme=dark] body.app-shell .admin-v2-pill.muted{color:#9aa4b2!important;background:#232b38!important;border-color:rgba(255,255,255,.1)!important}
html[data-bs-theme=dark] body.app-shell .admin-v2-avatar.muted{background:#232b38!important;color:#9aa4b2!important}
html[data-bs-theme=dark] body.app-shell .admin-v2-note{background:rgba(217,119,6,.12)!important;color:#fcd34d!important;border-color:rgba(217,119,6,.3)!important}
/* admin/users.php page-local widgets (role tabs, user cards, info boxes, management
panel) hardcode their own light backgrounds on top of admin-v2, same issue as the
generic app-shell pages above but scoped to "admin-user-*" so it needs its own block. */
html[data-bs-theme=dark] body.app-shell .admin-user-role-tab{background:#161c26!important;border-color:rgba(255,255,255,.1)!important;color:#c9d1d9!important;box-shadow:none!important}
html[data-bs-theme=dark] body.app-shell .admin-user-role-tab:hover{border-color:rgba(199,143,24,.4)!important;color:#fda4af!important}
html[data-bs-theme=dark] body.app-shell .admin-user-role-tab.is-active{background:rgba(199,143,24,.16)!important;border-color:rgba(199,143,24,.4)!important;color:#fda4af!important;box-shadow:none!important}
html[data-bs-theme=dark] body.app-shell .admin-user-role-tab-count{background:rgba(255,255,255,.08)!important}
html[data-bs-theme=dark] body.app-shell .admin-user-role-tab.is-active .admin-user-role-tab-count{background:rgba(199,143,24,.22)!important}
html[data-bs-theme=dark] body.app-shell .admin-user-card{background:#161c26!important;border-color:rgba(255,255,255,.08)!important;box-shadow:none!important}
html[data-bs-theme=dark] body.app-shell .admin-user-identity-text h3,
html[data-bs-theme=dark] body.app-shell .admin-user-info-box strong,
html[data-bs-theme=dark] body.app-shell .admin-user-control-card h4{color:#f0f3f6!important}
html[data-bs-theme=dark] body.app-shell .admin-user-email,
html[data-bs-theme=dark] body.app-shell .admin-user-subtext,
html[data-bs-theme=dark] body.app-shell .admin-user-info-box .label,
html[data-bs-theme=dark] body.app-shell .admin-user-field label{color:#8b949e!important}
html[data-bs-theme=dark] body.app-shell .admin-user-info-box,
html[data-bs-theme=dark] body.app-shell .admin-user-control-card,
html[data-bs-theme=dark] body.app-shell .admin-user-empty-state{background:rgba(255,255,255,.04)!important;border-color:rgba(255,255,255,.1)!important;color:#c9d1d9!important}
html[data-bs-theme=dark] body.app-shell .admin-user-management{background:transparent!important;border-color:rgba(255,255,255,.08)!important}
/* admin/bypass.php (User Import) page-local widgets hardcode their own light
backgrounds/borders, same issue as the admin-user-* block above. */
html[data-bs-theme=dark] body.app-shell .admin-bypass-card-soft,
html[data-bs-theme=dark] body.app-shell .admin-bypass-option,
html[data-bs-theme=dark] body.app-shell .admin-bypass-code,
html[data-bs-theme=dark] body.app-shell .admin-bypass-history-card{background:#161c26!important;border-color:rgba(255,255,255,.08)!important;color:#c9d1d9!important}
html[data-bs-theme=dark] body.app-shell .admin-bypass-note,
html[data-bs-theme=dark] body.app-shell .admin-bypass-upload-box,
html[data-bs-theme=dark] body.app-shell .admin-bypass-danger-zone{background:rgba(220,53,69,.08)!important;border-color:rgba(220,53,69,.3)!important}
html[data-bs-theme=dark] body.app-shell .admin-bypass-list li{color:#aeb7c2!important}
html[data-bs-theme=dark] body.app-shell .admin-bypass-history-meta span{background:#232b38!important;border-color:rgba(255,255,255,.1)!important;color:#9aa4b2!important}
html[data-bs-theme=dark] body.app-shell .admin-bypass-upload-box .form-label,
html[data-bs-theme=dark] body.app-shell .admin-bypass-note strong,
html[data-bs-theme=dark] body.app-shell .admin-bypass-note p,
html[data-bs-theme=dark] body.app-shell .admin-bypass-note .small,
html[data-bs-theme=dark] body.app-shell .admin-bypass-upload-box .form-text{color:#c9d1d9!important}
/* admin/categories.php drag-handle + usage-count pill, same hardcoded-light-widget issue. */
html[data-bs-theme=dark] body.app-shell .admin-category-drag-handle{background:#161c26!important;border-color:rgba(255,255,255,.1)!important;color:#8b949e!important}
html[data-bs-theme=dark] body.app-shell .admin-category-drag-handle:hover{background:rgba(199,143,24,.16)!important;border-color:rgba(199,143,24,.4)!important;color:#fda4af!important}
html[data-bs-theme=dark] body.app-shell .admin-category-row.drag-over td{background:rgba(199,143,24,.12)!important}
html[data-bs-theme=dark] body.app-shell .admin-category-used-pill{background:rgba(255,255,255,.08)!important;color:#f0f3f6!important}
/* admin/verification.php page-local widgets not covered by the "-card"/"-panel"/"-box"/
"-note" suffix rules above (list header, request row, badge pill, empty state). */
html[data-bs-theme=dark] body.app-shell .verification-header-pill{background:#161c26!important;border-color:rgba(255,255,255,.1)!important}
html[data-bs-theme=dark] body.app-shell .verification-list-header,
html[data-bs-theme=dark] body.app-shell .verification-request-item,
html[data-bs-theme=dark] body.app-shell .empty-verification-state{background:#161c26!important;border-color:rgba(255,255,255,.08)!important;color:#c9d1d9!important}
html[data-bs-theme=dark] body.app-shell .verification-request-list{background:#10151d!important}
html[data-bs-theme=dark] body.app-shell .request-badge-pill{background:rgba(255,255,255,.08)!important;color:#c9d1d9!important}
/* admin/bypass.php (bulk import) page-local widgets, same hardcoded-light-surface issue. */
html[data-bs-theme=dark] body.app-shell .admin-bypass-card-soft,
html[data-bs-theme=dark] body.app-shell .admin-bypass-option,
html[data-bs-theme=dark] body.app-shell .admin-bypass-code,
html[data-bs-theme=dark] body.app-shell .admin-bypass-history-meta span,
html[data-bs-theme=dark] body.app-shell .admin-bypass-history-card,
html[data-bs-theme=dark] body.app-shell .admin-bypass-history-empty,
html[data-bs-theme=dark] body.app-shell .admin-bypass-stat{background:rgba(255,255,255,.04)!important;border-color:rgba(255,255,255,.1)!important;color:#c9d1d9!important}
html[data-bs-theme=dark] body.app-shell .admin-bypass-danger-zone{background:rgba(220,53,69,.1)!important;border-color:rgba(220,53,69,.3)!important;color:#fda4af!important}
html[data-bs-theme=dark] body.app-shell .admin-bypass-upload-box{background:rgba(199,143,24,.06)!important;border-color:rgba(199,143,24,.3)!important}
/* admin/messages.php (conversation list + transcript), same hardcoded-light-surface
issue — no inline