/* ======================================================================
   CEO OFFICE WORKSPACE — UI V5 PREMIUM POLISH
   Final refinement layer. Loads after every other stylesheet/inline patch
   in the document, so it wins the cascade without needing !important on
   most rules. Pure visual refinement — zero HTML/JS/id/class changes,
   nothing here can break existing functionality or event wiring.
   ====================================================================== */

:root{
  /* Signature accent — warm brass, used sparingly for focus/active/emphasis */
  --px-brass:#B08D57;
  --px-brass-deep:#8C6D3F;
  --px-brass-soft:#F3E9D6;
  --px-ink:#1F2A36;
  --px-ink-2:#24384C;

  /* Layered shadow system — soft ambient + tighter contact shadow */
  --px-shadow-xs:0 1px 2px rgba(20,28,38,.05);
  --px-shadow-sm:0 1px 1px rgba(20,28,38,.04),0 6px 16px rgba(20,28,38,.06);
  --px-shadow-md:0 2px 4px rgba(20,28,38,.05),0 14px 32px rgba(20,28,38,.09);
  --px-shadow-lg:0 8px 16px rgba(20,28,38,.08),0 28px 64px rgba(20,28,38,.16);
  --px-shadow-nav:0 12px 28px rgba(20,28,38,.20),0 2px 6px rgba(20,28,38,.14);
  --px-ease:cubic-bezier(.22,1,.36,1);
}

/* ---------------------------------------------------------------------
   Typography — tighter hierarchy, tabular numerals for money/metrics
--------------------------------------------------------------------- */
html{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body{letter-spacing:-.008em}

.ax-module-head h1,.ax-module-head h2,
#documents-root .dc-title,#tenders-root .tn-title,#fleet-root .fl-dashboard-title,#fleet-root .fl-title,
#library-root .lib-title,#wj-root .wj-title,#directorclaim-root .dcl-title,#admin-root .adm-title,
#vendors-root .vm-title,#settings-root .set-title,
#documents-root .dc-head h2,#tenders-root .tn-head h2,#fleet-root h2,#library-root h2,#wj-root h2,
#directorclaim-root h2,#admin-root h2,#vendors-root h2,#settings-root h2{
  font-weight:780;
  letter-spacing:-.03em;
  background:linear-gradient(180deg,var(--px-ink) 0%,var(--px-ink-2) 100%);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:var(--px-ink);
}

[class*="-money"],[class*="-amount"],.mono,
table td:has(> [class*="money"]),
#directorclaim-root .dcl-cell,#tenders-root .tn-rp-money{
  font-variant-numeric:tabular-nums;
  font-feature-settings:"tnum" 1,"lnum" 1;
}

/* ---------------------------------------------------------------------
   Global surfaces — deepen depth beyond the flat contrast pass
--------------------------------------------------------------------- */
.card,.panel,.plate,.surface,
#documents-root .dc-card,#tenders-root .tn-card,#fleet-root .fl-card,#library-root .lib-card,
#wj-root .wj-card,#directorclaim-root .dcl-card,#admin-root .adm-card,#settings-root .set-card,#vendors-root .vm-card,
#tenders-root .tn-panel,#admin-root .adm-panel,
.vm-table-shell,#admin-root .adm-table-shell,#documents-root .dc-table-wrap,#tenders-root .tn-table-wrap,
#directorclaim-root .dcl-table-wrap,#fleet-root .fl-table-wrap,#library-root .lib-table-wrap{
  box-shadow:var(--px-shadow-sm)!important;
  transition:box-shadow .22s var(--px-ease),border-color .22s var(--px-ease),transform .22s var(--px-ease)!important;
}

/* Hoverable record/entity cards get a gentle lift — never on static panels */
#fleet-root .fl-vehicle-card,#fleet-root .fl-booking-card,#library-root .lib-file-card,
#directorclaim-root .dcl-summary-card,#vendors-root .vm-vendor-card,
#tenders-root .tn-project-card,#tenders-root .tn-cm-card{
  transition:box-shadow .22s var(--px-ease),border-color .22s var(--px-ease),transform .22s var(--px-ease)!important;
}
#fleet-root .fl-vehicle-card:hover,#fleet-root .fl-booking-card:hover,#library-root .lib-file-card:hover,
#directorclaim-root .dcl-summary-card:hover,#vendors-root .vm-vendor-card:hover,
#tenders-root .tn-project-card:hover,#tenders-root .tn-cm-card:hover{
  box-shadow:var(--px-shadow-md)!important;
  transform:translateY(-2px)!important;
}

/* KPI / stat tiles — give each a quiet accent edge instead of a flat box */
#tenders-root .tn-stat,#documents-root .dc-stat,#fleet-root .fl-stat,#fleet-root .fl-stat-card,
#library-root .lib-stat,#directorclaim-root .dcl-stat,.stat-card,.metric-card,
#tenders-root .tn-rp-kpi{
  position:relative;overflow:hidden;
  box-shadow:var(--px-shadow-xs)!important;
  transition:box-shadow .22s var(--px-ease),transform .22s var(--px-ease)!important;
}
#tenders-root .tn-stat::before,#documents-root .dc-stat::before,#fleet-root .fl-stat::before,
#fleet-root .fl-stat-card::before,#library-root .lib-stat::before,#directorclaim-root .dcl-stat::before,
.stat-card::before,.metric-card::before{
  content:"";position:absolute;left:0;top:0;bottom:0;width:3px;
  background:linear-gradient(180deg,var(--px-brass) 0%,var(--px-brass-deep) 100%);
  opacity:.85;
}
#tenders-root .tn-stat:hover,#documents-root .dc-stat:hover,#fleet-root .fl-stat:hover,
#fleet-root .fl-stat-card:hover,#library-root .lib-stat:hover,#directorclaim-root .dcl-stat:hover,
.stat-card:hover,.metric-card:hover{
  box-shadow:var(--px-shadow-sm)!important;
  transform:translateY(-1px)!important;
}

/* ---------------------------------------------------------------------
   Buttons — real depth on primary actions, tactile press feedback
--------------------------------------------------------------------- */
button,.btn,.dc-btn,.tn-btn,.fl-btn,.lib-btn,.wj-btn,.dcl-btn,.vm-btn,.set-btn,.adm-btn,.adm-act-btn{
  transition:background .16s var(--px-ease),border-color .16s var(--px-ease),color .16s var(--px-ease),
             box-shadow .16s var(--px-ease),transform .1s var(--px-ease)!important;
}
button:active,.btn:active,.dc-btn:active,.tn-btn:active,.fl-btn:active,.lib-btn:active,.wj-btn:active,
.dcl-btn:active,.vm-btn:active,.set-btn:active,.adm-btn:active,.adm-act-btn:active{
  transform:scale(.98)!important;
}

.btn.primary,.primary-btn,.dc-btn-primary,.tn-btn-primary,.fl-btn-primary,.lib-btn-primary,
.wj-btn-primary,.dcl-btn-primary,.vm-btn-primary,
#admin-root .adm-add-user-btn,#admin-root .adm-primary,#tenders-root .tn-primary{
  background:linear-gradient(155deg,#2A3947 0%,var(--px-ink) 55%,#182129 100%)!important;
  box-shadow:0 1px 0 rgba(255,255,255,.06) inset,0 6px 16px rgba(20,28,38,.22)!important;
}
.btn.primary:hover,.primary-btn:hover,.dc-btn-primary:hover,.tn-btn-primary:hover,.fl-btn-primary:hover,
.lib-btn-primary:hover,.wj-btn-primary:hover,.dcl-btn-primary:hover,.vm-btn-primary:hover,
#admin-root .adm-add-user-btn:hover{
  box-shadow:0 1px 0 rgba(255,255,255,.08) inset,0 10px 22px rgba(20,28,38,.28)!important;
  transform:translateY(-1px)!important;
}

/* Ghost/secondary buttons — crisper edge, subtle hover fill */
.btn:not(.primary),.dc-btn-ghost,.tn-btn-ghost,.fl-btn-ghost,.lib-btn-ghost,.wj-btn-ghost,.dcl-btn-ghost,.vm-btn-ghost{
  box-shadow:var(--px-shadow-xs)!important;
}

/* Focus ring — one consistent, elegant treatment app-wide */
button:focus-visible,.btn:focus-visible,a:focus-visible,
input:not([type=checkbox]):not([type=radio]):focus-visible,select:focus-visible,textarea:focus-visible{
  outline:2px solid rgba(176,141,87,.55)!important;
  outline-offset:2px!important;
}

/* ---------------------------------------------------------------------
   Inputs — quiet inset, warmer focus glow tying back to the brass accent
--------------------------------------------------------------------- */
input:not([type=checkbox]):not([type=radio]),select,textarea,
.dc-input,.tn-input,.fl-input,.lib-input,.wj-input,.dcl-input,.vm-input,.adm-input{
  box-shadow:0 1px 2px rgba(20,28,38,.035) inset!important;
  transition:border-color .16s var(--px-ease),box-shadow .16s var(--px-ease)!important;
}
input:not([type=checkbox]):not([type=radio]):focus,select:focus,textarea:focus{
  box-shadow:0 1px 2px rgba(20,28,38,.035) inset,0 0 0 3px rgba(176,141,87,.14)!important;
}

/* ---------------------------------------------------------------------
   Tables — sticky, opaque header with a hairline shadow on scroll areas
--------------------------------------------------------------------- */
thead th,.vm-table th,#admin-root table th,#documents-root table th,#tenders-root table th,
#directorclaim-root table th,#fleet-root table th,#library-root table th{
  position:sticky!important;top:0!important;z-index:2!important;
}
tbody tr{transition:background .14s var(--px-ease)!important}

/* ---------------------------------------------------------------------
   Status pills — small dot marker in addition to colour, reads faster
--------------------------------------------------------------------- */
.status,.badge,.pill,.dc-pill,.tn-pill,.tn-badge,.fl-pill,.lib-pill,.wj-pill,.dcl-pill,
.adm-status-pill,.adm-access-badge{
  display:inline-flex!important;align-items:center!important;gap:6px!important;
}
.status::before,.badge::before,.pill::before,.dc-pill::before,.tn-pill::before,.tn-badge::before,
.fl-pill::before,.lib-pill::before,.wj-pill::before,.dcl-pill::before,.adm-status-pill::before{
  content:"";width:5px;height:5px;border-radius:50%;background:currentColor;opacity:.75;flex:0 0 auto;
}

/* ---------------------------------------------------------------------
   Sidebar — signature accent bar + subtle glow on the active module
--------------------------------------------------------------------- */
#sidebar{box-shadow:var(--px-shadow-nav)!important}
#navList .modItem{position:relative!important;overflow:hidden!important}
#navList .modItem.on{
  background:linear-gradient(155deg,#F3EEE4 0%,#F0EDE7 100%)!important;
  box-shadow:0 6px 16px rgba(0,0,0,.18)!important;
}
#navList .modItem.on::after{
  content:"";position:absolute;left:0;top:8px;bottom:8px;width:3px;border-radius:0 3px 3px 0;
  background:linear-gradient(180deg,var(--px-brass) 0%,var(--px-brass-deep) 100%);
}
#sidebar:not(.expanded) #navList .modItem.on::after{display:none}

/* ---------------------------------------------------------------------
   Modals / drawers / command palette — crisper separation, softer entry
--------------------------------------------------------------------- */
.modal,.modal-card,.dc-modal,.tn-modal,.fl-modal,.lib-modal,.wj-modal,.dcl-modal,.vm-modal,
.adm-user-manager-panel,.adm-drawer,.drawer,
body > .dc-modal-ov > div,body > .tn-modal-ov > div,
#gsCard,.gs-card,.gsPanel{
  box-shadow:var(--px-shadow-lg)!important;
}

/* ---------------------------------------------------------------------
   Scrollbars — thinner, more elegant everywhere (desktop / WebKit)
--------------------------------------------------------------------- */
*{scrollbar-width:thin;scrollbar-color:#C7B79A transparent}
*::-webkit-scrollbar{width:8px;height:8px}
*::-webkit-scrollbar-track{background:transparent}
*::-webkit-scrollbar-thumb{background:#CBBB9C;border-radius:999px;border:2px solid transparent;background-clip:padding-box}
*::-webkit-scrollbar-thumb:hover{background:var(--px-brass);background-clip:padding-box}

/* ---------------------------------------------------------------------
   Empty states — quiet, centred, a touch of brand warmth on the icon
--------------------------------------------------------------------- */
.vm-empty-state,.vm-empty,[class*="-empty-state"],[class*="-empty"]{
  color:#8A96A0!important;
}
.vm-empty-state svg,.vm-empty svg,[class*="-empty-state"] svg,[class*="-empty"] svg{
  opacity:.55;
}

/* Respect reduced-motion preferences */
@media (prefers-reduced-motion: reduce){
  *{transition-duration:.001ms!important;animation-duration:.001ms!important}
}