/*
 * Fezma Luxury UI 1.0
 * Shared visual and interaction contract for Core and every module workspace.
 * Inspired by the density and predictability of established ERP interfaces.
 */
:root{
  --premium-purple:#0aaeb7;
  --premium-purple-hover:#078b93;
  --premium-purple-soft:#e3f8f9;
  --premium-purple-border:#9adfe2;
  --ui-accent:#079ba4;
  --ui-accent-hover:#057a82;
  --ui-accent-soft:#e4f6f7;
  --fezma-cyan:#19d3da;
  --fezma-teal:#078d96;
  --fezma-deep:#061719;
  --fezma-slate:#111718;
  --fezma-silver:#c7d0d1;
  --fezma-silver-light:#edf1f1;
  --fezma-line:#dbe2e3;
  --fezma-radius:13px;
  --fezma-radius-lg:17px;
  --fezma-shadow:0 1px 2px rgba(5,25,27,.05),0 10px 28px rgba(5,25,27,.055);
  --fezma-shadow-hover:0 2px 4px rgba(5,25,27,.06),0 16px 38px rgba(5,25,27,.09);
}
html:not([data-theme=dark]){
  --bg:#f3f6f6;
  --surface:#ffffff;
  --surface-2:#f6f8f8;
  --surface-raised:#ffffff;
  --surface-muted:#f1f5f5;
  --field:#ffffff;
  --field-border:#cbd5d6;
  --text:#172224;
  --muted:#677679;
  --line:#dde4e5;
  --accent:var(--ui-accent);
  --accent-soft:var(--ui-accent-soft);
  --hover:#edf7f7;
  --focus:#0ebbc4;
  --shadow:var(--fezma-shadow);
  --shadow-soft:var(--fezma-shadow);
  --shadow-raised:var(--fezma-shadow-hover);
}
html[data-theme=dark]{
  --bg:#0b1011;
  --surface:#141a1b;
  --surface-2:#192021;
  --surface-raised:#1b2324;
  --surface-muted:#101617;
  --field:#0e1415;
  --field-border:#334043;
  --text:#f2f6f6;
  --muted:#9eabad;
  --line:#293436;
  --accent:#45e0e5;
  --accent-soft:#0bb8c01d;
  --hover:#0fbcc414;
  --focus:#55e8ec;
  --shadow:0 1px 2px rgba(0,0,0,.35),0 12px 32px rgba(0,0,0,.22);
  --shadow-soft:var(--shadow);
  --shadow-raised:0 20px 52px rgba(0,0,0,.42);
}

/* Shell and navigation */
.app-shell,.platform-shell{--brand:#06757c;--accent:#079ba4}
html[data-theme=dark] .app-shell,html[data-theme=dark] .platform-shell{--brand:#19cbd2;--accent:#45e0e5}
body{background:var(--bg);font-feature-settings:"kern" 1,"tnum" 1;color:var(--text)}
.app-shell{grid-template-columns:238px minmax(0,1fr);transition:grid-template-columns .2s ease}
.app-shell .sidebar,
html[data-theme=dark] .app-shell .sidebar{
  position:relative;
  isolation:isolate;
  border-right:1px solid rgba(115,224,228,.16);
  background-image:linear-gradient(168deg,rgba(5,15,17,.88),rgba(11,22,24,.94) 52%,rgba(3,13,15,.98)),url('/static/brand/fezma-slate-texture.webp');
  background-size:cover;
  background-position:center;
  box-shadow:8px 0 34px rgba(3,16,18,.12),inset -1px 0 rgba(255,255,255,.035);
}
.app-shell .sidebar::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(circle at 30% 4%,rgba(38,220,226,.13),transparent 27%),linear-gradient(90deg,rgba(255,255,255,.025),transparent 42%)}
.app-shell .brand{border-bottom:1px solid rgba(214,242,243,.12)}
.app-shell .fezma-brand-wordmark{filter:drop-shadow(0 5px 12px rgba(0,0,0,.35))}
.app-shell .organization-chip{border:1px solid rgba(127,208,211,.18);background:rgba(8,27,29,.62);box-shadow:inset 0 1px rgba(255,255,255,.04)}
.app-shell .organization-chip span{color:#8ea0a2}.app-shell .organization-chip strong{color:#eef7f7}
.app-shell .nav-group>summary{color:#89999b}
.app-shell .nav-group>summary:hover{color:#d5e6e7}
.app-shell .nav-link{position:relative;color:#bdc9ca;border:1px solid transparent}
.app-shell .nav-link:hover{border-color:rgba(113,203,207,.12);background:rgba(96,191,195,.08);color:#fff}
.app-shell .nav-link.active{
  border-color:rgba(87,225,230,.23);
  background:linear-gradient(105deg,rgba(9,169,178,.24),rgba(28,214,220,.09));
  color:#fff;
  box-shadow:inset 0 1px rgba(255,255,255,.05),0 7px 18px rgba(0,0,0,.12);
}
.app-shell .nav-link.active::before{width:3px;background:linear-gradient(#70f2f5,#0bb2ba);box-shadow:0 0 13px rgba(42,222,228,.7)}
.app-shell .nav-icon{color:#8ea2a4}.app-shell .nav-link:hover .nav-icon,.app-shell .nav-link.active .nav-icon{color:#67e4e8}
.app-shell .sidebar-footer{border-top-color:rgba(255,255,255,.1)}
.app-shell .sidebar-footer :is(.theme-switch,.admin-switch,.user-card,.text-button){color:#c4d0d1}
.app-shell .sidebar-footer :is(.admin-switch,.user-card):hover{background:rgba(77,203,208,.1);color:#fff}
.app-shell .sidebar-footer small{color:#78888a}
.app-shell .avatar{border:1px solid rgba(113,229,233,.25);background:linear-gradient(145deg,#123d41,#087b82);color:#eaffff;box-shadow:inset 0 1px rgba(255,255,255,.12)}
.app-shell .sidebar-collapse{border-color:rgba(74,183,188,.25);background:#122527;color:#aeeaed;box-shadow:0 6px 18px rgba(0,0,0,.3)}

/* Odoo-like compact control bar */
.app-shell .topbar{
  min-height:66px;
  border-bottom:1px solid var(--line);
  background:color-mix(in srgb,var(--surface) 94%,transparent);
  box-shadow:0 1px 0 rgba(255,255,255,.6),0 5px 20px rgba(3,24,26,.035);
  backdrop-filter:blur(18px) saturate(125%);
}
html[data-theme=dark] .app-shell .topbar{background:rgba(13,19,20,.9);box-shadow:0 1px rgba(255,255,255,.025),0 8px 24px rgba(0,0,0,.2)}
.app-shell .topbar::after{content:"";position:absolute;inset:auto 0 -1px;height:1px;background:linear-gradient(90deg,transparent,rgba(12,178,187,.25) 24%,rgba(12,178,187,.08) 62%,transparent)}
.app-shell .topbar h1{font-size:16px;font-weight:720;letter-spacing:-.018em}
.app-shell .topbar .eyebrow{color:var(--accent);font-size:8px;letter-spacing:.14em}
.app-shell .topbar-search{border:1px solid var(--line);background:var(--surface-2);box-shadow:inset 0 1px rgba(255,255,255,.6)}
.app-shell .topbar-search:hover{border-color:color-mix(in srgb,var(--accent) 38%,var(--line));background:var(--surface)}
.app-shell .topbar-search kbd{border-color:var(--line);background:var(--surface);color:var(--muted)}
.app-shell .topbar-actions details>summary{border:1px solid transparent;border-radius:10px}
.app-shell .topbar-actions details>summary:hover{border-color:var(--line);background:var(--surface-2)}
.app-shell .topbar-menu-panel{border:1px solid var(--line);border-radius:14px;background:color-mix(in srgb,var(--surface) 96%,transparent);box-shadow:var(--shadow-raised);backdrop-filter:blur(20px)}

/* Workspace canvas and page hierarchy */
.app-shell .main{background:var(--bg)}
.app-shell .main::before{content:"";position:fixed;inset:66px 0 0 238px;z-index:0;pointer-events:none;background:radial-gradient(ellipse at 88% -5%,rgba(16,183,191,.07),transparent 34%),linear-gradient(180deg,rgba(255,255,255,.28),transparent 180px)}
html[data-theme=dark] .app-shell .main::before{background:radial-gradient(ellipse at 88% -5%,rgba(25,214,221,.055),transparent 33%),linear-gradient(180deg,rgba(255,255,255,.012),transparent 220px)}
.app-shell .content{position:relative;z-index:1;max-width:1640px;padding-top:25px}
.app-shell .content :is(.page-intro,.base-page-head,.record-page-head,.customer-page-head,.sales-record-head,.shared-record-head,.svc-header){position:relative;margin-bottom:20px;padding-bottom:14px;border-bottom:1px solid var(--line)}
.app-shell .content :is(.page-intro,.base-page-head,.record-page-head,.customer-page-head,.sales-record-head,.shared-record-head,.svc-header)::after{content:"";position:absolute;left:0;bottom:-1px;width:54px;height:2px;border-radius:2px;background:linear-gradient(90deg,var(--accent),var(--fezma-cyan))}
.app-shell .content :is(.page-intro,.base-page-head,.record-page-head,.customer-page-head,.sales-record-head,.shared-record-head,.svc-header) h2{font-size:clamp(23px,2vw,29px);font-weight:710;letter-spacing:-.035em}
.app-shell .section-label,.app-shell .eyebrow{color:var(--accent);font-weight:820;letter-spacing:.14em}
.content-navigation{margin-bottom:12px}.content-back,.back-link,.visit-back,.asset-back-button{border-radius:9px}

/* Branded hero panels */
.app-shell .content :is(.hero-card,.shared-hero,.sales-hero,.module-hero,.sales-start){
  position:relative;
  isolation:isolate;
  overflow:hidden;
  border-color:rgba(74,218,223,.24);
  background:linear-gradient(122deg,#081c1e,#0b393c 55%,#056c72);
  color:#eefafa;
  box-shadow:0 15px 38px rgba(4,28,30,.17),inset 0 1px rgba(255,255,255,.07);
}
.app-shell .content :is(.hero-card,.shared-hero,.sales-hero,.module-hero,.sales-start)::after{content:"";position:absolute;z-index:-1;width:390px;aspect-ratio:1;right:-130px;top:-225px;border:52px solid rgba(73,229,234,.075);border-radius:48%;rotate:-25deg}
.app-shell .content :is(.hero-card,.shared-hero,.sales-hero,.module-hero,.sales-start) :is(h2,h3,strong){color:#fff}
.app-shell .content :is(.hero-card,.shared-hero,.sales-hero,.module-hero,.sales-start) :is(p,.section-label,.eyebrow){color:#bcd8da}

/* Premium surfaces and application cards */
.app-shell .main .content :is(.card,.module-card,.kpi-card,.workflow-tile,.service-card,.record-card,.supplier-card,.overview-module,.overview-metric,.tracking-stats article,.sales-total-grid article,.record-meta-grid article,.billing-summary>a,.process-strip>a,.customer-list-card,.asset-directory-list,.asset-detail-head,.asset-block,.asset-create-section,.svc-panel){
  border-color:var(--line);
  border-radius:var(--fezma-radius);
  background:var(--surface);
  box-shadow:var(--fezma-shadow),inset 0 1px rgba(255,255,255,.7);
}
html[data-theme=dark] .app-shell .main .content :is(.card,.module-card,.kpi-card,.workflow-tile,.service-card,.record-card,.supplier-card,.overview-module,.overview-metric,.tracking-stats article,.sales-total-grid article,.record-meta-grid article,.customer-list-card,.asset-directory-list,.asset-detail-head,.asset-block,.asset-create-section,.svc-panel){box-shadow:var(--shadow),inset 0 1px rgba(255,255,255,.035)}
.app-shell .main .content :is(.module-card,.workflow-tile,.service-card,.record-card,.supplier-card,.overview-module,.overview-metric):hover{border-color:color-mix(in srgb,var(--accent) 35%,var(--line));box-shadow:var(--fezma-shadow-hover);transform:translateY(-1px)}
.app-shell .card-head,.app-shell .shared-card-head,.app-shell .settings-section-head{border-bottom-color:var(--line)}
.app-shell .card-head h3{font-weight:720}
.app-shell .kpi-card{position:relative;overflow:hidden}
.app-shell .kpi-card::after{content:"";position:absolute;inset:0 0 auto;height:2px;background:linear-gradient(90deg,var(--accent),transparent 72%);opacity:.55}
.app-shell .kpi-card strong{color:var(--text);font-weight:720}

/* Workspace overview as a polished app launcher */
.dashboard-aurora span:first-child{background:#0cc4cb}.dashboard-aurora span:last-child{background:#006a70}
.workspace-welcome{padding-bottom:18px;border-bottom:1px solid var(--line)}
.workspace-clock .clock-time{font-weight:630;color:var(--text)}
.overview-metrics{gap:12px}
.app-shell .overview-metric{position:relative;min-height:112px;overflow:hidden}
.app-shell .overview-metric::before{content:"";position:absolute;inset:0 auto 0 0;width:3px;background:linear-gradient(var(--fezma-cyan),var(--fezma-teal))}
.app-shell .overview-metric strong{color:var(--text);font-weight:730}
.overview-modules{gap:13px}
.app-shell .overview-module{min-height:94px;padding:17px}
.app-shell .overview-module-icon{border:1px solid color-mix(in srgb,var(--accent) 20%,var(--line));border-radius:12px;background:linear-gradient(145deg,var(--accent-soft),var(--surface));color:var(--accent);box-shadow:inset 0 1px rgba(255,255,255,.8)}
html[data-theme=dark] .app-shell .overview-module-icon{background:linear-gradient(145deg,rgba(17,199,207,.16),rgba(11,34,36,.6));box-shadow:inset 0 1px rgba(255,255,255,.04)}
.app-shell .overview-module-arrow{color:var(--muted)}
.app-shell .overview-module:hover .overview-module-arrow{color:var(--accent);transform:translateX(2px)}

/* Buttons and Odoo-like action hierarchy */
.app-shell :is(.button,button.button),.platform-shell :is(.button,button.button),.login-panel :is(.button,button.button){border-radius:9px;font-weight:700;letter-spacing:.005em;transition:translate .15s ease,box-shadow .15s ease,border-color .15s ease,background-color .15s ease,color .15s ease}
.app-shell .button.primary,.platform-shell .button.primary,.login-panel .button.primary{
  border-color:#078d95;
  background:linear-gradient(135deg,#10b9c1,#07858d);
  color:#fff;
  box-shadow:0 5px 13px rgba(4,134,142,.2),inset 0 1px rgba(255,255,255,.16);
}
.app-shell .button.primary:hover,.platform-shell .button.primary:hover,.login-panel .button.primary:hover{border-color:#056d73;background:linear-gradient(135deg,#0eabb3,#056f76);box-shadow:0 7px 17px rgba(4,113,120,.25)}
.app-shell .button.secondary,.platform-shell .button.secondary,.login-panel .button.secondary{border-color:var(--field-border);background:linear-gradient(180deg,var(--surface),var(--surface-2));color:var(--text);box-shadow:0 1px 2px rgba(3,24,26,.05)}
.app-shell .button.secondary:hover,.platform-shell .button.secondary:hover,.login-panel .button.secondary:hover{border-color:color-mix(in srgb,var(--accent) 38%,var(--field-border));background:var(--surface)}
.app-shell .icon-link{border-radius:8px}.app-shell .icon-link:hover{background:var(--accent-soft);color:var(--accent)}

/* Forms */
.app-shell label,.platform-shell label,.login-panel label{color:color-mix(in srgb,var(--text) 86%,var(--muted));font-weight:680}
.app-shell :is(input:not([type=checkbox]):not([type=radio]):not([type=color]):not([type=file]),textarea,select),.platform-shell :is(input:not([type=checkbox]):not([type=radio]):not([type=color]):not([type=file]),textarea,select){border-color:var(--field-border);border-radius:9px;background:var(--field);box-shadow:inset 0 1px 2px rgba(5,28,30,.025),0 1px rgba(255,255,255,.55)}
.app-shell :is(input,textarea,select):focus,.platform-shell :is(input,textarea,select):focus{border-color:var(--focus);box-shadow:0 0 0 3px color-mix(in srgb,var(--focus) 14%,transparent),inset 0 1px 2px rgba(5,28,30,.02)}
.app-shell fieldset{background:color-mix(in srgb,var(--surface-2) 62%,var(--surface));border-radius:var(--fezma-radius)}
.app-shell .form-card{border-radius:var(--fezma-radius-lg)}

/* List and kanban views */
.app-shell :is(.list-toolbar,.customer-toolbar,.shared-filter,.svc-toolbar){border:1px solid var(--line);border-radius:var(--fezma-radius) var(--fezma-radius) 0 0;background:color-mix(in srgb,var(--surface) 94%,var(--surface-2));box-shadow:inset 0 1px rgba(255,255,255,.7)}
.app-shell .segmented-control,.app-shell :is(.record-tabs,.visit-pane-tabs){border-color:var(--line);border-radius:10px;background:var(--surface-2);box-shadow:inset 0 1px 2px rgba(5,28,30,.04)}
.app-shell .segmented-control a.selected,.app-shell .record-tabs a.selected,.app-shell .visit-pane-tabs button[aria-selected=true]{background:var(--surface);color:var(--accent);box-shadow:0 2px 6px rgba(6,42,45,.1),inset 0 -2px var(--accent)}
.app-shell .table-wrap{border-radius:0 0 var(--fezma-radius) var(--fezma-radius);border-color:var(--line);background:var(--surface)}
.app-shell table{font-size:12.5px}
.app-shell th{padding:10px 13px;background:linear-gradient(180deg,var(--surface-2),color-mix(in srgb,var(--surface-2) 78%,var(--surface)));color:#5f7073;font-size:9.5px;font-weight:800;letter-spacing:.075em}
html[data-theme=dark] .app-shell th{background:linear-gradient(180deg,#1b2425,#182021);color:#9eadaf}
.app-shell td{padding:11px 13px}
.app-shell tbody tr{transition:background-color .13s ease,box-shadow .13s ease}
.app-shell tbody tr:hover{background:color-mix(in srgb,var(--accent-soft) 62%,var(--surface));box-shadow:inset 3px 0 var(--accent)}
.app-shell .record-number{color:var(--accent);font-weight:760}
.app-shell :is(.svc-board,.kanban-board,.board-columns){gap:12px}
.app-shell :is(.svc-column,.kanban-column,.board-column){border:1px solid var(--line);border-radius:var(--fezma-radius);background:var(--surface-muted)}

/* Status and feedback */
.app-shell :is(.badge,.status-dot,.sales-status,.record-count,.svc-badge){border-color:color-mix(in srgb,currentColor 20%,var(--line));box-shadow:inset 0 1px rgba(255,255,255,.4)}
.app-shell .alert{border-radius:10px;box-shadow:0 4px 14px rgba(4,29,31,.045)}
.app-shell :is(.pdf-drop,.intake-drop,.document-drop,.photo-drop,.upload-card){border-color:color-mix(in srgb,var(--accent) 38%,var(--line));background:linear-gradient(145deg,color-mix(in srgb,var(--accent-soft) 55%,var(--surface)),var(--surface))}

/* Dialogs and record details */
.app-shell dialog,.customer-dialog,.command-menu{border-radius:var(--fezma-radius-lg)}
.command-menu-panel,.customer-dialog-card{border:1px solid var(--line);border-radius:var(--fezma-radius-lg);box-shadow:0 30px 90px rgba(3,18,20,.3)}
.command-menu-item:hover,.command-menu-item:focus{border-color:color-mix(in srgb,var(--accent) 25%,var(--line));background:var(--accent-soft)}
.command-menu-item:hover .command-menu-item-mark,.command-menu-item:focus .command-menu-item-mark{background:var(--accent);box-shadow:0 0 0 5px color-mix(in srgb,var(--accent) 12%,transparent)}
.app-shell details:not(.nav-group):not(.topbar-popover)>summary{font-weight:680}
.app-shell details:not(.nav-group):not(.topbar-popover)[open]{border-color:color-mix(in srgb,var(--accent) 22%,var(--line));background:color-mix(in srgb,var(--accent-soft) 20%,var(--surface))}

/* Legacy module colors yield to the Fezma system */
.app-shell .main .content :is(.workflow-icon,.service-icon,.customer-avatar,.contact-avatar,.location-mark,.asset-directory-icon){background:var(--accent-soft);color:var(--accent)}
.app-shell .main .content :is(.workflow-main strong,.workflow-calc,.workflow-bottom,.text-link,.calculator-total strong,.commercial-total strong,.commercial-card h4){color:var(--accent)}
.app-shell .main .content :is(.shared-record-head,.sales-record-head){border-color:color-mix(in srgb,var(--accent) 20%,var(--line));background:linear-gradient(120deg,color-mix(in srgb,var(--accent-soft) 52%,var(--surface)),var(--surface))}
.app-shell .main .content .workflow-tile:nth-child(n){border-color:var(--line);background:var(--surface);color:var(--text)}
.app-shell .main .content .workflow-tile:nth-child(n) :is(h3,strong,p,.workflow-calc,.workflow-bottom){color:inherit}
.app-shell .main .content .workflow-tile:nth-child(n) :is(.workflow-icon,.workflow-tag){background:var(--accent-soft);color:var(--accent)}
.app-shell .main .content .workflow-tile:nth-child(n)::after{opacity:.14}
.app-shell .main .content .commercial-card{border-color:var(--line);background:var(--surface)}
.app-shell .main .content .commercial-card h4{background:var(--accent-soft)}
.app-shell .main .content .commercial-total{background:var(--surface-2)}
.app-shell .main .content .conversation-body{background:var(--surface-2);border-color:var(--line)}
.app-shell .main .content .calculator-total{background:linear-gradient(135deg,var(--accent-soft),var(--surface-2))}

/* Keep interactions crisp and businesslike. */
.app-shell .overview-module,.app-shell .overview-metric,.app-shell .customer-list-card,.app-shell .customer-dialog-card,.app-shell .asset-directory-row,.app-shell :is(a,button,summary,input,select,textarea){transition-duration:.16s;transition-timing-function:ease}

/* Platform administration */
.platform-shell .platform-bar{background:linear-gradient(100deg,#051012,#09272a);border-bottom-color:rgba(90,218,223,.18)}
.platform-shell .platform-mark{background:linear-gradient(145deg,#13c6ce,#067a82);box-shadow:0 7px 19px rgba(3,102,109,.25)}
.platform-shell .card{border-color:var(--line);border-radius:var(--fezma-radius);box-shadow:var(--fezma-shadow)}
.platform-shell .package-card{border-color:var(--line);background:var(--surface-2)}

@media(max-width:1050px) and (min-width:861px){
  .app-shell{grid-template-columns:224px minmax(0,1fr)}
  .app-shell .main::before{left:224px}
}
@media(max-width:860px){
  .app-shell,html[data-sidebar=collapsed] .app-shell{display:block;min-height:100vh}
  .app-shell .main::before{inset:60px 0 0}
  .app-shell .topbar{min-height:60px}
  .app-shell .content{padding:17px 13px 40px}
  .app-shell .content :is(.page-intro,.base-page-head,.record-page-head,.customer-page-head,.sales-record-head,.shared-record-head,.svc-header){padding-bottom:12px}
  .workspace-welcome{align-items:flex-start;gap:14px}
  .workspace-clock{text-align:left;min-width:0}.clock-time{font-size:34px}.clock-date{margin-top:4px}
  .overview-modules{grid-template-columns:repeat(2,minmax(0,1fr))}
  .app-shell .overview-module{min-height:108px;align-items:flex-start}
  .app-shell .overview-module-copy small{white-space:normal}
  .app-shell :is(.list-toolbar,.customer-toolbar,.shared-filter,.svc-toolbar){border-radius:var(--fezma-radius)}
  .app-shell .table-wrap{border-radius:var(--fezma-radius)}
}
@media(max-width:600px){
  .overview-modules{grid-template-columns:1fr}
  .app-shell .overview-module{min-height:82px}
  .app-shell .content :is(.card,.svc-panel){border-radius:11px}
  .app-shell table{font-size:12px}
  .app-shell th,.app-shell td{padding:10px 11px}
  .app-shell .topbar-actions .profile-summary{display:none}
}
@media(prefers-reduced-motion:reduce){
  .app-shell *,.platform-shell *{transition-duration:.01ms!important;animation-duration:.01ms!important}
}

/* Keyboard access for wide ERP lists */
.app-shell :is(.table-wrap,.asset-import-table-wrap,[style*="overflow-x:auto"]):focus-visible{outline:3px solid color-mix(in srgb,var(--focus) 24%,transparent);outline-offset:3px}

/* Standalone authentication steps */
.auth-page-card{
  width:min(500px,calc(100vw - 32px));
  border:1px solid color-mix(in srgb,var(--accent) 16%,var(--line));
  border-radius:var(--fezma-radius-lg);
  background:var(--surface);
  box-shadow:0 28px 80px rgba(3,23,25,.2),inset 0 1px rgba(255,255,255,.75);
}
.auth-page-card .auth-page-form{margin-top:20px;text-align:left}
.auth-page-card .auth-page-form label{color:color-mix(in srgb,var(--text) 86%,var(--muted));font-weight:680}
.auth-page-card .auth-page-form input:not([type=hidden]){
  border-color:var(--field-border);
  border-radius:9px;
  background:var(--field);
  color:var(--text);
  box-shadow:inset 0 1px 2px rgba(5,28,30,.025);
}
.auth-page-card .auth-page-form input:focus{border-color:var(--focus);box-shadow:0 0 0 3px color-mix(in srgb,var(--focus) 14%,transparent)}
.auth-page-card .button{border-radius:9px;font-weight:700}
.auth-page-card .button.primary{border-color:#078d95;background:linear-gradient(135deg,#10b9c1,#07858d);color:#fff;box-shadow:0 5px 13px rgba(4,134,142,.2),inset 0 1px rgba(255,255,255,.16)}
.auth-page-card .button.secondary{border-color:var(--field-border);background:linear-gradient(180deg,var(--surface),var(--surface-2));color:var(--text)}
.auth-page-card .alert{margin:18px 0;border-left-width:3px;text-align:left}
.auth-status-mark{width:54px;height:54px;margin:20px auto 4px;border-radius:50%;display:grid;place-items:center;background:var(--success-bg);color:var(--success);font-size:23px;font-weight:900}
.auth-security-note{display:flex;align-items:flex-start;gap:8px;margin:18px 0 0;color:var(--muted);font-size:10px;line-height:1.5;text-align:left}
.auth-security-note>span{color:var(--accent);font-size:16px;line-height:1}
html[data-theme=dark] .auth-page-card{box-shadow:0 28px 80px rgba(0,0,0,.45),inset 0 1px rgba(255,255,255,.04)}

/* Fezma shell refinements: quiet cloud mark, edge-reveal sidebar handle and compact clock. */
.app-shell .brand-fezma{gap:9px}
.app-shell .fezma-brand-cloud{
  margin-left:auto;
  display:grid;
  place-items:center;
  flex:0 0 auto;
  color:#58e5e9;
  filter:drop-shadow(0 2px 8px rgba(30,211,218,.2));
}
.app-shell .fezma-brand-cloud .ui-icon{width:18px;height:18px;stroke-width:1.7}
html[data-sidebar=collapsed] .app-shell .fezma-brand-cloud{display:none}

.app-shell .sidebar .sidebar-collapse{
  top:50%;
  right:-15px;
  width:30px;
  height:44px;
  border-radius:10px;
  opacity:0;
  transform:translateY(-50%);
  transition:opacity .16s ease,background-color .16s ease,color .16s ease,border-color .16s ease,box-shadow .16s ease,transform .2s ease;
}
.app-shell .sidebar .sidebar-collapse:hover,
.app-shell .sidebar .sidebar-collapse:focus-visible{
  opacity:1;
  border-color:rgba(90,224,229,.46);
  background:#172b2d;
  color:#dcffff;
  box-shadow:0 7px 22px rgba(0,0,0,.38),0 0 0 3px rgba(39,206,213,.1);
}
html[data-sidebar=collapsed] .app-shell .sidebar .sidebar-collapse{
  transform:translateY(-50%) rotate(180deg);
}
@media(hover:none) and (min-width:861px){
  .app-shell .sidebar .sidebar-collapse{opacity:.5}
}
@media(min-width:861px){
  .app-shell .sidebar .sidebar-collapse{display:grid}
  html[data-sidebar=collapsed] .app-shell{grid-template-columns:76px minmax(0,1fr)}
  html[data-sidebar=collapsed] .app-shell .main::before{left:76px}
}

.app-shell .topbar-live-clock{
  min-width:82px;
  margin-left:5px;
  padding-left:13px;
  border-left:1px solid var(--line);
  text-align:right;
  line-height:1.1;
}
.app-shell .topbar-live-clock .clock-time{
  display:block;
  color:var(--text);
  font-size:15px;
  font-weight:680;
  letter-spacing:.015em;
  font-variant-numeric:tabular-nums;
}
.app-shell .topbar-live-clock .clock-date{
  display:block;
  margin-top:3px;
  color:var(--muted);
  font-size:8px;
  font-weight:550;
  letter-spacing:.025em;
  white-space:nowrap;
}
@media(max-width:1050px) and (min-width:861px){
  .app-shell .brand-fezma{justify-content:flex-start;padding:0 8px 16px}
  .app-shell .brand-fezma .fezma-brand-wordmark{display:block}
  .app-shell .brand-fezma .fezma-brand-mark{display:none}
  .app-shell .organization-chip,.app-shell .nav-caption,.app-shell .nav-link>span:last-child{display:block}
  .app-shell .nav-link{justify-content:flex-start}
  .app-shell .nav-group>summary{justify-content:space-between;padding:5px 10px 7px}
  .app-shell .nav-group>summary span{font-size:9px}
  .app-shell .sidebar-footer>.admin-switch,.app-shell .sidebar-footer>.user-card{display:flex}
  .app-shell .sidebar-footer>form,.app-shell .sidebar-footer>small{display:block}
  .app-shell .theme-switch{min-height:0;flex-direction:row;margin:0;padding:9px 0 13px}
  .app-shell .theme-switch>span:nth-child(2){display:inline}
  .app-shell .theme-track{width:35px;flex-basis:35px;margin-left:7px}
  html[data-sidebar=collapsed] .app-shell .brand-fezma{justify-content:center;padding-inline:0}
  html[data-sidebar=collapsed] .app-shell .brand-fezma .fezma-brand-wordmark{display:none}
  html[data-sidebar=collapsed] .app-shell .brand-fezma .fezma-brand-mark{display:block}
  .app-shell .topbar-live-clock{min-width:62px;padding-left:9px}
  .app-shell .topbar-live-clock .clock-date{display:none}
}
@media(max-width:860px){
  .app-shell .fezma-brand-cloud{display:grid}
  .app-shell .topbar-live-clock{min-width:62px;margin-left:2px;padding-left:9px}
  .app-shell .topbar-live-clock .clock-date{display:none}
}
@media(max-width:480px){
  .app-shell .topbar-live-clock{min-width:54px;padding-left:7px}
  .app-shell .topbar-live-clock .clock-time{font-size:13px}
}

/* Fezma dashboard: production implementation of the approved workspace preview. */
.app-shell .topbar-breadcrumb{display:flex;align-items:center;gap:9px;min-width:0;white-space:nowrap}
.app-shell .topbar-breadcrumb>span{color:var(--muted);font-size:12px}
.app-shell .topbar-breadcrumb>strong{overflow:hidden;color:var(--text);font-size:12px;font-weight:700;text-overflow:ellipsis}
.app-shell .topbar-breadcrumb>.ui-icon{width:14px;height:14px;color:var(--muted)}
.app-shell .help-menu>summary{width:38px;height:38px;display:grid;place-items:center;color:var(--muted)}
.app-shell .help-menu>summary>.ui-icon{width:18px;height:18px}
.app-shell .help-panel{width:270px}
.app-shell .help-panel>a{display:flex;align-items:center;gap:8px;margin-top:9px;padding:9px 10px;border-radius:8px;color:var(--text);text-decoration:none}
.app-shell .help-panel>a:hover{background:var(--accent-soft);color:var(--accent)}
.app-shell .help-panel>a>.ui-icon{width:16px;height:16px}

.workspace-premium-dashboard{max-width:1540px;margin:0 auto}
.workspace-premium-dashboard .dashboard-aurora{opacity:.42}
.workspace-premium-dashboard .workspace-welcome{
  align-items:flex-end;
  margin:0 0 20px;
  padding:0 0 18px;
  border:0;
  border-bottom:1px solid var(--line);
  border-radius:0;
  background:transparent;
  box-shadow:none;
  backdrop-filter:none;
}
html:not([data-theme=dark]) .main .workspace-premium-dashboard .workspace-welcome,
html[data-theme=dark] .workspace-premium-dashboard .workspace-welcome{border:0;border-bottom:1px solid var(--line);background:transparent;box-shadow:none}
.workspace-premium-dashboard .workspace-welcome h2{margin:8px 0 6px;font-size:clamp(27px,2.6vw,35px);font-weight:730;letter-spacing:-.045em}
.workspace-premium-dashboard .workspace-welcome p{font-size:13px}
.workspace-today{display:block;font-size:9px;letter-spacing:.12em}
.workspace-header-actions{display:flex;align-items:center;gap:9px;flex:0 0 auto}
.workspace-header-actions .button{min-height:40px;padding-inline:15px}
.workspace-header-actions .ui-icon{width:16px;height:16px}

.workspace-premium-dashboard .overview-metrics{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:0 0 17px}
.workspace-premium-dashboard .overview-metric{
  min-height:108px;
  padding:16px 17px;
  border:1px solid var(--line);
  border-radius:13px;
  background:color-mix(in srgb,var(--surface) 97%,var(--bg));
  color:var(--text);
  box-shadow:var(--fezma-shadow);
}
html:not([data-theme=dark]) .main .workspace-premium-dashboard .overview-metric:is(.tone-blue,.tone-cyan,.tone-amber,.tone-violet){border-color:var(--line);background:var(--surface);color:var(--text)}
.workspace-premium-dashboard .overview-metric::before{content:"";position:absolute;inset:0 auto 0 0;width:3px;border-radius:13px 0 0 13px;background:linear-gradient(var(--fezma-cyan),var(--fezma-teal))}
.workspace-premium-dashboard .overview-metric::after{display:none}
.workspace-premium-dashboard .overview-metric-head{display:flex;align-items:center;justify-content:space-between;gap:10px;color:var(--muted);font-size:10px;font-weight:600}
.workspace-premium-dashboard .overview-metric-head>.ui-icon{width:16px;height:16px;stroke-width:1.65}
.workspace-premium-dashboard .overview-metric>strong{margin:12px 0 4px;color:var(--text);font-size:23px;font-weight:720;letter-spacing:-.035em}
.workspace-premium-dashboard .overview-metric>small{margin-top:0;color:var(--muted);font-size:9px}
.workspace-premium-dashboard .overview-metric:hover{transform:translateY(-1px);border-color:color-mix(in srgb,var(--accent) 42%,var(--line));box-shadow:var(--fezma-shadow-hover)}

.workspace-dashboard-grid{display:grid;grid-template-columns:minmax(0,2.35fr) minmax(280px,.95fr);gap:14px;align-items:start}
.workspace-side-stack{display:grid;gap:14px}
.workspace-dashboard-surface{overflow:hidden;border:1px solid var(--line);border-radius:14px;background:var(--surface);box-shadow:var(--fezma-shadow)}
.workspace-surface-head{min-height:58px;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:0 17px;border-bottom:1px solid var(--line)}
.workspace-surface-head h3{margin:0;color:var(--text);font-size:14px;font-weight:720}
.workspace-surface-head>a:not(.workspace-icon-link){color:var(--accent);font-size:10px;text-decoration:none}
.workspace-icon-link{width:34px;height:34px;display:grid;place-items:center;border:1px solid var(--line);border-radius:9px;color:var(--muted);text-decoration:none}
.workspace-icon-link:hover{border-color:var(--accent);color:var(--accent)}
.workspace-icon-link>.ui-icon{width:16px;height:16px}
.workspace-table-wrap{min-height:330px;overflow:auto}
.workspace-record-table{min-width:650px}
.workspace-record-table th{height:34px;padding:8px 14px;font-size:8px}
.workspace-record-table td{padding:13px 14px;font-size:10px}
.workspace-record-link{display:block;color:inherit;text-decoration:none}
.workspace-record-link strong{display:block;color:var(--accent);font-size:11px;font-weight:720}
.workspace-record-link small{display:block;max-width:280px;margin-top:4px;overflow:hidden;color:var(--muted);font-size:8.5px;text-overflow:ellipsis;white-space:nowrap}
.workspace-record-status{display:inline-flex;align-items:center;gap:7px;white-space:nowrap}
.workspace-record-status::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--accent)}
.workspace-record-status.is-warning::before{background:#f0b95e}.workspace-record-status.is-done::before{background:#55d7a9}.workspace-record-status.is-muted::before{background:var(--muted)}
.workspace-empty{height:180px;text-align:center!important;color:var(--muted)!important}
.workspace-empty strong,.workspace-empty small{display:block}.workspace-empty strong{color:var(--text)}.workspace-empty small{margin-top:6px}
.workspace-empty.compact{height:auto;padding:25px 18px;text-align:left!important}

.workspace-agenda{padding:0 17px}
.workspace-agenda-row{display:grid;grid-template-columns:40px 9px minmax(0,1fr);gap:9px;align-items:start;padding:14px 0;border-bottom:1px solid var(--line);color:inherit;text-decoration:none}
.workspace-agenda-row:last-child{border-bottom:0}
.workspace-agenda-row>time{padding-top:2px;color:var(--muted);font-size:9px;font-variant-numeric:tabular-nums}
.workspace-agenda-mark{width:8px;height:8px;margin-top:2px;border:2px solid color-mix(in srgb,var(--accent) 35%,transparent);border-radius:50%;background:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 14%,transparent)}
.workspace-agenda-row strong,.workspace-agenda-row small{display:block}
.workspace-agenda-row strong{color:var(--text);font-size:10px;font-weight:700}
.workspace-agenda-row small{margin-top:6px;color:var(--muted);font-size:8px}
.workspace-agenda-row:hover strong{color:var(--accent)}
.workspace-quick-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;padding:12px}
.workspace-quick-actions>a{min-height:70px;display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;gap:9px;padding:12px;border:1px solid var(--line);border-radius:10px;background:var(--surface-2);color:var(--text);font-size:9px;font-weight:650;text-decoration:none}
.workspace-quick-actions>a:hover{border-color:color-mix(in srgb,var(--accent) 50%,var(--line));background:var(--accent-soft);color:var(--accent)}
.workspace-quick-actions .ui-icon{width:17px;height:17px;color:var(--accent)}

html[data-theme=dark] .workspace-premium-dashboard .overview-metric,
html[data-theme=dark] .workspace-dashboard-surface{border-color:#2b3739;background:#151b1c;box-shadow:none}
html[data-theme=dark] .workspace-quick-actions>a{border-color:#2b3739;background:#182021}
html[data-theme=dark] .workspace-record-table th{background:#192122}

@media(max-width:1180px){
  .workspace-dashboard-grid{grid-template-columns:minmax(0,1fr) 270px}
  .workspace-premium-dashboard .overview-metric{padding:15px}
}
@media(max-width:980px){
  .workspace-premium-dashboard .overview-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
  .workspace-dashboard-grid{grid-template-columns:1fr}
  .workspace-side-stack{grid-template-columns:1fr 1fr}
}
@media(max-width:700px){
  .workspace-premium-dashboard .workspace-welcome{align-items:flex-start;flex-direction:column}
  .workspace-header-actions{width:100%}.workspace-header-actions .button{flex:1}
  .workspace-side-stack{grid-template-columns:1fr}
}
@media(max-width:520px){
  .workspace-premium-dashboard .overview-metrics{grid-template-columns:1fr}
  .workspace-premium-dashboard .overview-metric{min-height:96px}
  .workspace-header-actions{display:grid;grid-template-columns:1fr 1fr}
}

/* Final parity pass for the approved Fezma shell and overview. */
.login-hero-brand .login-cloud-only{
  width:32px;height:32px;display:grid;place-items:center;flex:0 0 32px;
  color:#55e6ea;filter:drop-shadow(0 2px 8px rgba(30,211,218,.26));
}
.login-hero-brand .login-cloud-only .ui-icon{width:21px;height:21px;stroke-width:1.65}
.workspace-record-filters{display:inline-flex;align-items:center;gap:2px;padding:3px;border-radius:9px;background:var(--surface-2)}
.workspace-record-filters button{min-height:29px;padding:6px 10px;border:0;border-radius:7px;background:transparent;color:var(--muted);font-size:9px;font-weight:650;cursor:pointer}
.workspace-record-filters button:hover{color:var(--text)}
.workspace-record-filters button.is-active{background:var(--surface);color:var(--accent);box-shadow:0 2px 7px rgba(3,25,27,.16)}
html[data-theme=dark] .workspace-record-filters button.is-active{background:#1c2728}
.workspace-record-table tr[hidden]{display:none}

/* Natural slate shell, cloud-free brand and a legible organization clock. */
.app-shell .brand-fezma{gap:0}
.app-shell .fezma-brand-cloud,.login-hero-brand .login-cloud-only{display:none!important}
.app-shell .sidebar,
html[data-theme=dark] .app-shell .sidebar{
  background-color:#0d1314;
  background-image:
    linear-gradient(168deg,rgba(3,12,14,.66),rgba(8,18,20,.76) 52%,rgba(2,10,12,.84)),
    url('/static/brand/fezma-slate-texture.webp?v=20260912-slate4');
  background-position:center;
  background-repeat:no-repeat;
  background-size:cover;
}
html[data-theme=dark] .app-shell .main{
  background-color:#0a0f10;
  background-image:
    linear-gradient(160deg,rgba(7,13,14,.93),rgba(7,13,14,.965) 58%,rgba(3,9,10,.94)),
    url('/static/brand/fezma-slate-texture.webp?v=20260912-slate4');
  background-position:center;
  background-repeat:no-repeat;
  background-size:cover;
  background-attachment:fixed;
}
html[data-theme=dark] .app-shell .topbar{
  background-color:#101718;
  background-image:
    linear-gradient(90deg,rgba(10,18,19,.86),rgba(12,20,21,.91)),
    url('/static/brand/fezma-slate-texture.webp?v=20260912-slate4');
  background-position:center 42%;
  background-repeat:no-repeat;
  background-size:cover;
}
.app-shell .topbar-live-clock{
  min-width:118px;
  margin-left:8px;
  padding:7px 0 7px 16px;
  border-left-color:color-mix(in srgb,var(--accent) 22%,var(--line));
  line-height:1.05;
}
.app-shell .topbar-live-clock .clock-time{
  color:var(--text);
  font-size:19px;
  font-weight:760;
  letter-spacing:.025em;
}
.app-shell .topbar-live-clock .clock-date{
  display:block;
  margin-top:5px;
  color:color-mix(in srgb,var(--text) 72%,var(--muted));
  font-size:10px;
  font-weight:650;
  letter-spacing:.035em;
}
html[data-theme=dark] .app-shell .topbar-live-clock .clock-time{color:#f6fbfb}
html[data-theme=dark] .app-shell .topbar-live-clock .clock-date{color:#b5c2c4}
@media(max-width:1050px) and (min-width:861px){
  .app-shell .topbar-live-clock{min-width:102px;padding-left:12px}
  .app-shell .topbar-live-clock .clock-date{display:block;font-size:8.5px}
}
@media(max-width:860px){
  .app-shell .topbar-live-clock{min-width:94px;padding-left:10px}
  .app-shell .topbar-live-clock .clock-time{font-size:17px}
  .app-shell .topbar-live-clock .clock-date{display:block;font-size:8px}
}
@media(max-width:400px){
  .app-shell .topbar-live-clock{min-width:58px}
  .app-shell .topbar-live-clock .clock-date{display:none}
}
