/* PittsFix CRM — design tokens + hand-tuned overrides. Loaded after css-file.css and theme-generated.css. */
:root{--font:'Inter','Albert Sans',system-ui,sans-serif;--font-hd:'Inter',sans-serif}

/* ---------- Light: "Pitts Light" ---------- */
:root,html[data-theme=light]{
  color-scheme:light;
  --bg:#f2f5fb;--side:#ffffff;--card:#ffffff;--card2:#f6f8fd;--line:#e3e8f2;--input:#ffffff;
  --tx:#0a1230;--mu:#64708a;--ac:#1240d0;--ac-d:#0e32a6;--ac-tx:#ffffff;--ac-soft:#e8eeff;
  --bad:#d93c3c;--warn:#d98a00;--info:#1f78d1;
  --r:16px;--r-sm:10px;--shadow:0 1px 2px rgba(10,18,48,.05),0 8px 24px rgba(10,18,48,.06);
  --logo:url('../images/pittsfix-logo-light.png');
}
/* ---------- Dark: "Pitts Dark" ---------- */
html[data-theme=dark]{
  color-scheme:dark;
  --bg:#080d1c;--side:#0c1326;--card:#111a31;--card2:#18223f;--line:#243055;--input:#0d1630;
  --tx:#eef2ff;--mu:#8a96b8;--ac:#ff7a2e;--ac-d:#e8631a;--ac-tx:#080d1c;--ac-soft:rgba(255,122,46,.13);
  --bad:#ff6363;--warn:#f5b73b;--info:#4aa8ff;
  --r:10px;--r-sm:8px;--shadow:none;
  --logo:url('../images/pittsfix-logo.png');
}

html[data-theme] body{background:var(--bg);color:var(--tx);font-family:var(--font);transition:background .2s,color .2s}
html[data-theme] .dashboard-header{background:var(--side);border-bottom:1px solid var(--line);box-shadow:none}
html[data-theme] .dashboard-header .logo{width:auto;height:44px;cursor:pointer}
html[data-theme] .dashboard-header .logo img{width:auto;height:44px;object-fit:contain}
.zf-logo-dark{display:none}
html[data-theme=dark] .zf-logo-dark{display:block}
html[data-theme=dark] .zf-logo-light{display:none}
html[data-theme] .dashboard-footer{color:var(--mu)}
html[data-theme] .dashboard-footer p{color:var(--mu)}

/* Sidebar */
html[data-theme] .dashboard-body .sidebar .sidebar-menu{background:var(--side);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);padding:16px 12px}
html[data-theme] .sidebar-menu .side-item{border-radius:var(--r-sm);color:var(--mu)}
html[data-theme] .sidebar-menu .side-item p{color:var(--mu);transition:color .15s}
html[data-theme] .sidebar-menu .side-item svg path,
html[data-theme] .sidebar-menu .side-item svg circle,
html[data-theme] .sidebar-menu .side-item svg rect{stroke:var(--mu);transition:stroke .15s}
html[data-theme] .sidebar-menu .side-item:hover{background:var(--card2)}
html[data-theme] .sidebar-menu .side-item:hover p{color:var(--tx)}
html[data-theme] .sidebar-menu .side-item:hover svg path,
html[data-theme] .sidebar-menu .side-item:hover svg circle,
html[data-theme] .sidebar-menu .side-item:hover svg rect{stroke:var(--tx)}
html[data-theme] .sidebar-menu .side-item.active{background:var(--ac-soft)}
html[data-theme] .sidebar-menu .side-item.active p{color:var(--ac);font-weight:700}
html[data-theme] .sidebar-menu .side-item.active svg path,
html[data-theme] .sidebar-menu .side-item.active svg circle,
html[data-theme] .sidebar-menu .side-item.active svg rect{stroke:var(--ac)}
html[data-theme=dark] .sidebar-menu .side-item.active{box-shadow:inset 3px 0 0 var(--ac)}
html[data-theme] .sidebar-menu .log-out{border-radius:var(--r-sm)}
html[data-theme] .sidebar-menu .log-out p{color:var(--mu)}
html[data-theme] .sidebar-menu .log-out svg path{fill:var(--mu)}
html[data-theme] .sidebar-menu .log-out:hover{background:var(--card2)}
html[data-theme] .sidebar-menu .log-out:hover p{color:var(--bad)}
html[data-theme] .sidebar-menu .log-out:hover svg path{fill:var(--bad);stroke:none}
html[data-theme] .sidebar .add-order{background:var(--ac);border:0;border-radius:var(--r-sm);box-shadow:var(--shadow)}
html[data-theme] .sidebar .add-order p{color:var(--ac-tx);font-weight:700}
html[data-theme] .sidebar .add-order svg path{stroke:var(--ac-tx)}
@media (max-width:1300px){html[data-theme] .dashboard-header .sidebar-toggle span{background:var(--tx)}html[data-theme] body{background:var(--bg)}}

/* Content surfaces */
html[data-theme] .right-content,
html[data-theme] .overview-container,
html[data-theme] .dashboard-body > div:not(.sidebar){color:var(--tx)}
html[data-theme] h1,html[data-theme] h2,html[data-theme] h3,html[data-theme] h4{color:var(--tx)}
html[data-theme] .tittle h1,html[data-theme] .tittle p{color:var(--tx)}
html[data-theme] table{color:var(--tx)}
html[data-theme] th{color:var(--mu)}
html[data-theme] td{border-color:var(--line)}
html[data-theme] tbody tr:hover{background-color:var(--card2)}
html[data-theme] hr{border-color:var(--line)}

/* Form controls */
html[data-theme] input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]):not([type=submit]):not([type=button]),
html[data-theme] select,html[data-theme] textarea{background-color:var(--input);color:var(--tx);border-color:var(--line)}
html[data-theme] input::placeholder,html[data-theme] textarea::placeholder{color:var(--mu);opacity:.8}
html[data-theme] input:focus,html[data-theme] select:focus,html[data-theme] textarea:focus{outline:0;border-color:var(--ac);box-shadow:0 0 0 3px var(--ac-soft)}
html[data-theme] option{background:var(--card);color:var(--tx)}
html[data-theme=dark] input[type=date]::-webkit-calendar-picker-indicator,
html[data-theme=dark] input[type=time]::-webkit-calendar-picker-indicator{filter:invert(.85)}
html[data-theme] a{color:inherit}

/* Popups / overlays / dropdowns written inline in pages */
html[data-theme] .schedule-popup,html[data-theme] .popup,html[data-theme] .modal,html[data-theme] [class*=popup-content],
html[data-theme] [class*=modal-content],html[data-theme] .dropdown-menu,html[data-theme] .addr-suggest{background:var(--card);color:var(--tx);border-color:var(--line)}
html[data-theme] .addr-suggest .item{border-color:var(--line)}
html[data-theme] .addr-suggest .item:hover{background:var(--card2)}
html[data-theme] .sched-header,html[data-theme] .sched-grid th,html[data-theme] .sched-grid td{border-color:var(--line)}
html[data-theme] .sched-grid thead th,html[data-theme] .sched-grid thead .tech-cell,html[data-theme] .sched-grid .tech-cell{background:var(--card2);color:var(--tx)}
html[data-theme] .sched-nav .nav-btn,html[data-theme] .sched-tabs button{background:var(--card);color:var(--tx);border-color:var(--line)}
html[data-theme] .sched-tabs button.active,html[data-theme] .sched-nav .today-btn{background:var(--ac);border-color:var(--ac);color:var(--ac-tx)}
html[data-theme] .sched-close{color:var(--mu)}

/* Scrollbars */
html[data-theme=dark] *{scrollbar-color:#2e362e transparent}
html[data-theme=dark] ::-webkit-scrollbar{width:10px;height:10px}
html[data-theme=dark] ::-webkit-scrollbar-thumb{background:#2e362e;border-radius:8px}

/* Theme toggle button (header) */
.zf-theme-toggle{display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 12px;border-radius:99px;border:1px solid var(--line);background:var(--card);color:var(--tx);cursor:pointer;font:600 13px var(--font);margin-right:14px}
.zf-theme-toggle:hover{border-color:var(--ac)}
.zf-theme-toggle svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.zf-theme-toggle .sun{display:none}
html[data-theme=dark] .zf-theme-toggle .sun{display:block}
html[data-theme=dark] .zf-theme-toggle .moon{display:none}
@media(max-width:640px){.zf-theme-toggle span{display:none}.zf-theme-toggle{padding:0 10px;margin-right:8px}}
.dashboard-header .right{flex-direction:row;align-items:center}

/* ---------- Dashboard overview cards ---------- */
html[data-theme] .right-content{background:transparent;padding:0}
html[data-theme] .overview-container{background:transparent;gap:16px}
html[data-theme] .overview-container .overview-box{height:auto;min-height:132px;border-radius:var(--r);padding:20px 22px;background:var(--card);border:1px solid var(--line);box-shadow:var(--shadow);position:relative;overflow:hidden;transition:transform .15s,border-color .15s}
html[data-theme] .overview-container .overview-box:hover{transform:translateY(-2px);border-color:var(--ac)}
html[data-theme] .overview-container .overview-box::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--bar,var(--ac))}
html[data-theme] .overview-container .overview-box.orders{--bar:var(--ac);background:var(--ac);border-color:var(--ac)}
html[data-theme] .overview-container .overview-box.orders::before{background:var(--ac-tx);opacity:.25}
html[data-theme] .overview-container .overview-box.orders h1,
html[data-theme] .overview-container .overview-box.orders .more-info p{color:var(--ac-tx)}
html[data-theme] .overview-container .overview-box.invoices{--bar:var(--info)}
html[data-theme] .overview-container .overview-box.reports{--bar:var(--warn)}
html[data-theme] .overview-container .overview-box.calendar{--bar:var(--mu)}
html[data-theme] .overview-container .overview-box.closed-orders{--bar:var(--ac)}
html[data-theme] .overview-container .overview-box.open-orders{--bar:var(--warn)}
html[data-theme] .overview-container .overview-box h1{color:var(--tx);font-family:var(--font-hd);font-size:30px;font-weight:700}
html[data-theme=dark] .overview-container .overview-box h1{letter-spacing:.02em}
html[data-theme] .overview-container .overview-box .top p{color:var(--mu)}
html[data-theme] .overview-box .more-info p{color:var(--ac);font-style:normal;font-weight:600}
html[data-theme] .overview-container .overview-box.orders .more-info::after{background:var(--ac-tx)}
html[data-theme] .overview-box .more-info::after{background:var(--ac)}
html[data-theme] .charts-section{padding:0}
html[data-theme] .income-container,html[data-theme] .status-container,html[data-theme] .charts-section > div{color:var(--tx)}
html[data-theme] .income-container .left .head h1,html[data-theme] .income-container .left .head p{color:var(--tx)}

/* Dashboard charts: legend dots, year selector, annual income */
html[data-theme] .income-container .blue-circle-label .circle{background-color:var(--ac)}
html[data-theme] .status-item-container .status-item .circle.yellow{background-color:var(--warn)}
html[data-theme] .status-item-container .status-item .circle.blue{background-color:var(--info)}
html[data-theme] .status-item-container .status-item .circle.green{background-color:var(--ac)}
html[data-theme] .status-item-container .status-item .circle.pink{background-color:var(--bad)}
html[data-theme] .year-selector svg path{stroke:var(--tx)}
html[data-theme] .income-div{background:var(--card);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow)}
html[data-theme] .income-div .income-text p{color:var(--ac);font-weight:700}
html[data-theme] .income-div .income-text span{color:var(--mu)}
html[data-theme=dark] .income-image img{filter:invert(1) hue-rotate(180deg);mix-blend-mode:screen}
html[data-theme] .Orderproses-container,html[data-theme] .income-chart-div{color:var(--tx)}
html[data-theme] .status-text p,html[data-theme] .status-item p,html[data-theme] .order-date-div h1{color:var(--tx)}
html[data-theme] .status-text span{color:var(--ac);font-weight:700}

/* =====================================================================
   Round 2: layout + typography polish
   ===================================================================== */
/* Desktop: sidebar stays put; only its menu scrolls internally */
html[data-theme] .dashboard-body{align-items:flex-start}
html[data-theme] .dashboard-body > .sidebar{position:sticky;top:88px;height:calc(100vh - 108px);align-self:flex-start;gap:12px}
html[data-theme] .dashboard-body .sidebar .sidebar-menu{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin}
html[data-theme] .dashboard-body .sidebar .add-order{flex:none}
html[data-theme] .dashboard-body > *:not(.sidebar){min-width:0;flex:1 1 auto}

/* Calmer typography */
html[data-theme] .tittle h1,html[data-theme] .zf-settings h1,html[data-theme] .map-section .tittle h1{font-family:var(--font);font-size:24px;font-weight:700;letter-spacing:-.01em;line-height:1.2}
html[data-theme] .overview-container .overview-box h1{font-family:var(--font);font-size:20px;font-weight:700;letter-spacing:-.01em}
html[data-theme] .overview-container .overview-box .top h1{font-size:30px;line-height:1}
html[data-theme] .overview-container .overview-box .top p{font-size:14px}
html[data-theme] .overview-container .overview-box{min-height:112px;padding:18px 20px}
html[data-theme] .income-container .left .head h1,
html[data-theme] .order-date-div h1,
html[data-theme] .Orderproses-container .order-date-div h1{font-family:var(--font);font-size:17px;font-weight:600;letter-spacing:0}
html[data-theme] .overview-box .more-info p{font-size:13px}
html[data-theme] .charts-section{gap:36px}
html[data-theme] .right-content{gap:24px}
html[data-theme] .sidebar-menu .side-item p{font-size:13.5px}
html[data-theme=dark] .zf-login-card h1{font-size:24px}

/* Login: inputs must stay inside the card */
.zf-login-card .input-div{width:100%;max-width:100%;display:block;padding:0;margin-left:0;margin-right:0}
.zf-login-card input[type=email],.zf-login-card input[type=password],.zf-login-card input[type=text]{box-sizing:border-box;width:100%;max-width:100%;margin:0}
.zf-login-card form{width:100%}

/* Bottom tab bar (mobile) – hidden on desktop */
.zf-tabbar,.zf-scrim{display:none}

/* ---------- Mobile: app-like shell ---------- */
@media (max-width:1300px){
  html[data-theme] body{background:var(--bg);padding-bottom:calc(76px + env(safe-area-inset-bottom))}
  html[data-theme] .dashboard{gap:0}
  html[data-theme] .dashboard-header{padding:10px 16px;gap:10px;position:sticky;top:0;padding-top:calc(10px + env(safe-area-inset-top))}
  html[data-theme] .dashboard-header .sidebar-toggle{display:none}
  html[data-theme] .dashboard-header .logo{display:block;height:34px}
  html[data-theme] .dashboard-header .logo img{height:34px}
  html[data-theme] .dashboard-header .left{display:flex;align-items:center}
  html[data-theme] .dashboard-header .user-name{display:none}
  html[data-theme] .dashboard-header .circle-arrow{display:none}
  html[data-theme] .dashboard-header .user-image img{width:36px;height:36px}
  .zf-theme-toggle{margin-right:6px;height:36px}
  html[data-theme] .dashboard-body{padding:14px 14px 0;gap:0;display:block}
  html[data-theme] .dashboard-body > *:not(.sidebar){width:100%}

  /* sidebar becomes a slide-in drawer opened from the "Menu" tab */
  html[data-theme] .dashboard-body > .sidebar{position:fixed;top:0;bottom:0;left:0;height:100dvh;width:min(84vw,320px);min-width:0;transform:translateX(-105%);transition:transform .28s cubic-bezier(.2,.8,.2,1);z-index:1001;padding:calc(12px + env(safe-area-inset-top)) 12px calc(12px + env(safe-area-inset-bottom));background:var(--side);border-right:1px solid var(--line);box-shadow:none;visibility:hidden;transition:transform .28s cubic-bezier(.2,.8,.2,1),visibility 0s .28s}
  html[data-theme] .dashboard-body > .sidebar.active{transform:none;left:0;visibility:visible;box-shadow:0 0 40px rgba(0,0,0,.35);transition:transform .28s cubic-bezier(.2,.8,.2,1),visibility 0s}
  html[data-theme] .dashboard-body .sidebar .sidebar-menu{border:0;box-shadow:none;padding:4px;background:transparent}
  html[data-theme] .sidebar-menu .side-item{padding:12px 14px}
  .zf-scrim{position:fixed;inset:0;background:rgba(0,0,0,.5);backdrop-filter:blur(2px);z-index:1000;opacity:0;pointer-events:none;transition:opacity .25s;display:block}
  body:has(.sidebar.active) .zf-scrim{opacity:1;pointer-events:auto}

  /* bottom tab bar */
  .zf-tabbar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:999;align-items:stretch;justify-content:space-around;background:color-mix(in srgb,var(--side) 92%,transparent);backdrop-filter:saturate(1.4) blur(16px);border-top:1px solid var(--line);padding:6px 6px calc(6px + env(safe-area-inset-bottom))}
  .zf-tabbar a,.zf-tabbar button{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;border:0;background:none;color:var(--mu);font:600 10.5px var(--font);padding:6px 0;border-radius:12px;cursor:pointer;-webkit-tap-highlight-color:transparent;text-decoration:none}
  .zf-tabbar svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
  .zf-tabbar .on{color:var(--ac)}
  .zf-tabbar .on svg{stroke-width:2.2}
  .zf-tabbar .fab{flex:0 0 56px;height:56px;margin-top:-22px;border-radius:50%;background:var(--ac);color:var(--ac-tx);box-shadow:0 8px 20px rgba(0,0,0,.28);align-self:flex-start;padding:0}
  .zf-tabbar .fab svg{width:26px;height:26px;stroke-width:2.4}
  html[data-theme] .dashboard-body > .sidebar .add-order{display:none}
  html[data-theme] .dashboard-footer{display:none}

  /* content tuned for touch */
  html[data-theme] .overview-container{grid-template-columns:1fr 1fr;gap:10px}
  html[data-theme] .overview-container .overview-box{min-height:92px;padding:14px 16px}
  html[data-theme] .overview-container .overview-box h1{font-size:16px}
  html[data-theme] .overview-container .overview-box .top h1{font-size:26px}
  html[data-theme] .tittle h1{font-size:22px}
  html[data-theme] input,html[data-theme] select,html[data-theme] textarea{font-size:16px}
  html[data-theme] .table-container,html[data-theme] [class*=table-wrap]{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .zf-theme-toggle span{display:none}
  .zf-settings .zf-set-head .zf-btn{width:100%}
  #gMap{height:calc(100dvh - 330px) !important;min-height:340px !important}
}

/* Desktop: keep the page at least viewport-tall so the sticky sidebar never scrolls away */
html[data-theme] .dashboard{min-height:100vh}
html[data-theme] .dashboard-body{flex:1 0 auto;padding-bottom:20px}
html[data-theme] .dashboard-footer{display:none}

/* "Order processes" heading was rendered twice on desktop (original bug) */
html[data-theme] .Orderproses-container .order-date-div.mobile{display:none}
@media (max-width:1300px){html[data-theme] .Orderproses-container .right .order-date-div.mobile{display:block;border:0;padding-bottom:6px}}

/* =====================================================================
   Round 3: refined typography (lighter, smaller, one family)
   ===================================================================== */
html[data-theme=dark]{--tx:#e9eee7;--mu:#8a958a}
html[data-theme] .dashboard,html[data-theme] .dashboard *{font-family:var(--font)}
html[data-theme] .dashboard{font-size:13px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
/* normal weight by default … */
html[data-theme] .dashboard *{font-weight:400}
/* … headings, table heads, buttons, badges and labels get a modest 600/500 */
html[data-theme] .dashboard h1,html[data-theme] .dashboard h2,html[data-theme] .dashboard h3,html[data-theme] .dashboard h4,
html[data-theme] .dashboard th,html[data-theme] .dashboard b,html[data-theme] .dashboard strong,
html[data-theme] .dashboard button,html[data-theme] .dashboard [class*=btn],html[data-theme] .dashboard [class*=badge],
html[data-theme] .dashboard .zf-btn,html[data-theme] .dashboard .pill{font-weight:600}
html[data-theme] .dashboard label{font-weight:500}

/* header */
html[data-theme] .dashboard-header .right .user-name p{font-size:13px;font-weight:600;color:var(--tx)}
html[data-theme] .dashboard-header .right .user-name span{font-size:11.5px;font-weight:400;color:var(--mu)}
html[data-theme] .zf-theme-toggle{font-size:12.5px;font-weight:500}
html[data-theme] .dashboard-header .right .bottom-option p,html[data-theme] .dashboard-header .right .bottom-option span{font-size:13px;font-weight:500}

/* sidebar */
html[data-theme] .sidebar-menu .side-item p,html[data-theme] .sidebar-menu .log-out p{font-size:13px;font-weight:500}
html[data-theme] .sidebar-menu .side-item.active p{font-weight:600}
html[data-theme] .sidebar .add-order p{font-size:13.5px;font-weight:600}

/* page titles + sections */
html[data-theme] .tittle h1,html[data-theme] .zf-settings h1,html[data-theme] .map-section .tittle h1{font-size:21px;font-weight:600}
html[data-theme] .tittle p{font-size:13px;color:var(--mu)}
html[data-theme] .income-container .left .head h1,html[data-theme] .order-date-div h1,
html[data-theme] .Orderproses-container .order-date-div h1{font-size:15px;font-weight:600}
html[data-theme] .overview-container .overview-box h1{font-size:16px;font-weight:600}
html[data-theme] .overview-container .overview-box .top h1{font-size:26px;font-weight:600}
html[data-theme] .overview-container .overview-box .top p{font-size:12.5px;font-weight:400}
html[data-theme] .overview-box .more-info p{font-size:12.5px;font-weight:500}
html[data-theme] .income-div .income-text p{font-size:18px;font-weight:600}
html[data-theme] .income-div .income-text span{font-size:12.5px}
html[data-theme] .status-text p,html[data-theme] .status-item p,html[data-theme] .blue-circle-label p,html[data-theme] .year-selector span{font-size:13px;font-weight:400}
html[data-theme] .status-text span{font-weight:600}

/* tables */
html[data-theme] th{font-size:11.5px;letter-spacing:.04em;text-transform:uppercase;color:var(--mu);font-weight:600}
html[data-theme] td{font-size:13px;font-weight:400}
html[data-theme] .status-badge{font-size:11.5px;font-weight:600}

/* forms */
html[data-theme] label{font-size:12px;color:var(--mu)}
html[data-theme] input,html[data-theme] select,html[data-theme] textarea{font-size:13.5px;font-weight:400}
html[data-theme] .head p{font-size:15px;font-weight:600}
html[data-theme] .dashboard-body button{font-size:13px}
.zf-field label,.zf-set-tabs button{font-weight:500}
@media (max-width:1300px){html[data-theme] input,html[data-theme] select,html[data-theme] textarea{font-size:16px}
  html[data-theme] .tittle h1{font-size:20px}html[data-theme] .overview-container .overview-box h1{font-size:15px}}

/* =====================================================================
   Round 4: page titles, compact header, calendar (mobile), invoice buttons
   ===================================================================== */
/* every page title, whatever markup the page uses */
html[data-theme] .page-title,html[data-theme] .tittle-calendar h1,html[data-theme] .dashboard-body > div > h1,
html[data-theme] .dashboard-body > div > .tittle h1,html[data-theme] .tittle h1{font-family:var(--font);font-size:21px;font-weight:600;letter-spacing:-.01em;line-height:1.25;margin:0 0 4px}

/* compact header */
html[data-theme] .dashboard-header{padding:10px 24px}
html[data-theme] .dashboard-header .logo,html[data-theme] .dashboard-header .logo img{height:36px}
html[data-theme] .dashboard-header .right .user-image{width:34px;height:34px}
html[data-theme] .dashboard-header .right .user-image img{width:34px;height:34px;border-radius:50%;object-fit:cover}
html[data-theme] .dashboard-header .right .user-info{gap:10px}
html[data-theme] .dashboard-header .right .user-name p{font-size:12.5px;line-height:1.2}
html[data-theme] .dashboard-header .right .user-name span{font-size:11px;line-height:1.2}
html[data-theme] .dashboard-header .right .circle-arrow{width:20px;height:20px}
.zf-theme-toggle{height:32px;padding:0 11px;font-size:12px;margin-right:12px}
.zf-theme-toggle svg{width:15px;height:15px}
html[data-theme] .dashboard-body > .sidebar{top:70px;height:calc(100vh - 90px)}

/* Invoice action buttons */
html[data-theme] .invoince-content .buttons-div{display:flex;gap:10px;flex-wrap:wrap;align-items:stretch}
html[data-theme] .invoince-content .buttons-div > button,html[data-theme] .invoince-content .buttons-div .show-invoice{height:42px;min-width:130px;border-radius:var(--r-sm);font-size:13px;font-weight:600;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:none}
html[data-theme] .invoince-content .buttons-div .update{background:var(--ac);color:var(--ac-tx);border:1px solid var(--ac)}
html[data-theme] .invoince-content .buttons-div .Checkout{background:var(--ac-soft);color:var(--ac);border:1px solid var(--ac)}
html[data-theme] .invoince-content .buttons-div .show-invoice{background:transparent;border:1px solid var(--line);padding:0}
html[data-theme] .invoince-content .buttons-div .show-invoice a{display:flex !important;align-items:center;justify-content:center;width:100%;height:100%;padding:0 18px;background:transparent !important;color:var(--tx) !important;border:0;font-size:13px;font-weight:600;text-decoration:none}
html[data-theme] .invoince-content .buttons-div .show-invoice:hover{border-color:var(--ac)}
@media (max-width:1300px){html[data-theme] .invoince-content .buttons-div > *{flex:1 1 100%}}

/* Calendar: month grid on desktop, agenda list on phones */
html[data-theme] .calendar-container{background:var(--card);border:1px solid var(--line);border-radius:var(--r)}
html[data-theme] .calendar-section table th{font-size:11.5px;text-transform:uppercase;letter-spacing:.04em;color:var(--mu)}
html[data-theme] .cal-event{font-size:11.5px;font-weight:500;color:#0a1230}
@media (max-width:920px){
  html[data-theme] .calendar-section{padding:0}
  html[data-theme] .mobile-calendar-container{padding:0;background:transparent}
  html[data-theme] .mobile-calendar .weeks{display:none}
  html[data-theme] .mobile-head{margin-bottom:10px}
  html[data-theme] .mobile-calendar-container .monthYear{font-size:15px;font-weight:600;color:var(--tx)}
  html[data-theme] .calendar-body-mobile{display:flex;flex-direction:column;gap:8px;text-align:left}
  html[data-theme] .calendar-body-mobile .mday{display:grid;grid-template-columns:78px 1fr;gap:12px;align-items:start;margin:0;padding:12px;border-radius:var(--r);border:1px solid var(--line);background:var(--card)}
  html[data-theme] .calendar-body-mobile .mhead{display:flex;flex-direction:column;gap:2px;margin:0;font-size:12px;color:var(--mu)}
  html[data-theme] .calendar-body-mobile .mhead span:first-child{font-size:13px;font-weight:600;color:var(--tx)}
  html[data-theme] .calendar-body-mobile .mhead span+span{color:var(--ac);font-weight:600;font-size:11px}
  html[data-theme] .calendar-body-mobile .mevents{gap:6px}
  html[data-theme] .calendar-body-mobile .mevent{font-size:13px;padding:8px 10px;border-radius:8px;color:#0a1230}
  html[data-theme] .calendar-body-mobile .mevents > div:not(.mevent){font-size:12.5px;color:var(--mu);padding:2px 0}
  /* days without orders: slim row */
  html[data-theme] .calendar-body-mobile .mday:not(:has(.mevent)){padding:8px 12px;opacity:.75}
}