/* ZIP 3/12 — World-class design system, navigation and component standardization layer.
   Scope: templates only; does not unlock production/live GO. */
:root{
  --zip3-shell-bg:rgba(255,253,248,.965);
  --zip3-shell-border:rgba(143,91,52,.18);
  --zip3-shell-shadow:0 18px 46px rgba(53,36,21,.10);
  --zip3-nav-active-bg:linear-gradient(135deg,rgba(143,91,52,.12),rgba(199,141,86,.16));
  --zip3-nav-active-border:rgba(143,91,52,.34);
  --zip3-card-bg:linear-gradient(180deg,#fffdf8,#fbf6ee);
  --zip3-metric-good:#147a4d;
  --zip3-metric-warn:#a46414;
  --zip3-metric-risk:#b42318;
  --zip3-control-height:44px;
}
html[data-zip3-design-system] body{background:radial-gradient(circle at 8% -6%,rgba(199,141,86,.20),transparent 32%),linear-gradient(180deg,#fbf7f0 0%,#f2e7d8 100%);} 
body[data-zip3-design-system] .zip3-shell{isolation:isolate;}
body[data-zip3-design-system] .zip3-top-shell{border-bottom:1px solid var(--zip3-shell-border);background:var(--zip3-shell-bg);box-shadow:var(--zip3-shell-shadow);backdrop-filter:saturate(130%) blur(14px);} 
body[data-zip3-design-system] .zip3-shell-header{min-height:76px;align-items:center;}
body[data-zip3-design-system] .zip3-brand{min-width:0;}
body[data-zip3-design-system] .zip3-brand .r38-logo{border-radius:18px;background:linear-gradient(180deg,#fff,#f8efe3);}
.zip3-shell-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px;min-width:0;}
.zip3-logout-form{margin:0;display:flex;align-items:center;}
.zip3-scope-pill{display:inline-flex;align-items:center;gap:7px;max-width:240px;min-height:34px;padding:7px 10px;border-radius:999px;border:1px solid var(--depo-border);background:#fff;color:var(--depo-text-soft);font-size:.78rem;font-weight:900;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.zip3-scope-pill::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--depo-primary-2);box-shadow:0 0 0 4px rgba(199,141,86,.16);}
.zip3-scope-pill--platform-admin::before{background:var(--depo-danger);box-shadow:0 0 0 4px rgba(180,35,24,.12);}
.zip3-scope-pill--customer-owner::before{background:var(--depo-info);box-shadow:0 0 0 4px rgba(35,100,170,.12);}
.zip3-shell-nav{gap:10px;padding-bottom:14px;scroll-padding-inline:16px;}
.zip3-shell-nav .zip3-nav-link{position:relative;display:grid;grid-template-columns:1fr;align-content:center;gap:1px;min-width:104px;min-height:52px;padding:9px 14px;border-radius:18px;border:1px solid transparent;line-height:1.18;background:rgba(255,255,255,.45);}
.zip3-shell-nav .zip3-nav-link .zip3-nav-label{font-size:.92rem;font-weight:950;color:var(--depo-text);}
.zip3-shell-nav .zip3-nav-link small{font-size:.72rem;color:var(--depo-text-soft);font-weight:750;letter-spacing:0;}
.zip3-shell-nav .zip3-nav-link:is(:hover,:focus-visible),.zip3-shell-nav .zip3-nav-link.is-active,.zip3-shell-nav .zip3-nav-link[aria-current="page"]{background:var(--zip3-nav-active-bg);border-color:var(--zip3-nav-active-border);box-shadow:0 10px 26px rgba(53,36,21,.09);color:var(--depo-primary-dark);} 
.zip3-shell-nav .zip3-nav-link.is-active::after,.zip3-shell-nav .zip3-nav-link[aria-current="page"]::after{content:"";position:absolute;left:14px;right:14px;bottom:-8px;height:3px;border-radius:999px;background:linear-gradient(90deg,var(--depo-primary),var(--depo-primary-2));}
.zip3-context-container{padding-top:16px;padding-bottom:0;}
.zip3-context-toolbar{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:16px 18px;border:1px solid rgba(143,91,52,.16);border-radius:24px;background:linear-gradient(180deg,rgba(255,253,248,.96),rgba(255,248,238,.90));box-shadow:0 16px 38px rgba(53,36,21,.08);}
.zip3-context-toolbar__copy{min-width:0;display:grid;gap:3px;}
.zip3-context-toolbar h2{font-size:clamp(1.08rem,1.5vw,1.38rem);line-height:1.15;margin:0;letter-spacing:0!important;}
.zip3-context-toolbar p{margin:0;color:var(--depo-text-soft);font-size:.93rem;max-width:920px;}
.zip3-context-toolbar__actions{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex-wrap:wrap;}
.zip3-breadcrumbs{display:flex;align-items:center;gap:7px;min-width:0;color:var(--depo-text-soft);font-size:.78rem;font-weight:850;}
.zip3-breadcrumbs strong{max-width:min(62vw,520px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--depo-primary-dark);font-weight:950;}
.zip3-main{padding-top:18px;}
.zip3-public-header{position:sticky;top:14px;z-index:80;background:rgba(255,253,248,.94);backdrop-filter:saturate(130%) blur(12px);border-color:rgba(143,91,52,.16);}
.zip3-public-nav{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end;}
.zip3-public-nav .public-topnav-link{min-height:40px;border-radius:999px;padding:9px 12px;}
.zip3-public-nav .public-topnav-link.is-active,.zip3-public-nav .public-topnav-link[aria-current="page"]{background:rgba(143,91,52,.10);color:var(--depo-primary-dark);border-color:rgba(143,91,52,.18);}
/* Cross-page component normalization */
body[data-zip3-design-system] :where(.card,.panel,.surface-card,.dashboard-card,.module-card,.stat-card,.form-card,.table-card,.auth-card){border-color:rgba(143,91,52,.14);background:var(--zip3-card-bg);box-shadow:0 14px 34px rgba(53,36,21,.07);}
body[data-zip3-design-system] :where(.card,.panel,.surface-card,.dashboard-card,.module-card,.stat-card,.form-card,.table-card,.auth-card):where(:hover,:focus-within){box-shadow:0 20px 48px rgba(53,36,21,.10);}
body[data-zip3-design-system] :where(.btn,button.btn,a.btn,.button,.primary-button,.secondary-button,input[type="submit"]){min-height:var(--zip3-control-height);border-radius:14px;transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease,background .16s ease;}
body[data-zip3-design-system] :where(.btn,button.btn,a.btn,.button,.primary-button,.secondary-button,input[type="submit"]):where(:hover,:focus-visible){transform:translateY(-1px);box-shadow:0 13px 26px rgba(53,36,21,.12);}
body[data-zip3-design-system] :where(input,select,textarea){min-height:var(--zip3-control-height);border-radius:14px;border-color:rgba(143,91,52,.18);background:#fffdf8;}
body[data-zip3-design-system] :where(input,select,textarea):focus{border-color:var(--depo-primary-2);box-shadow:0 0 0 4px rgba(199,141,86,.20);}
body[data-zip3-design-system] :where(label){letter-spacing:0;font-weight:900;}
body[data-zip3-design-system] :where(.form-help,.help-text,.field-hint){font-size:.86rem;color:var(--depo-text-soft);}
body[data-zip3-design-system] :where(.alert,.runtime-pulse-banner){border-radius:20px;border-color:rgba(143,91,52,.18);}
body[data-zip3-design-system] :where(.badge,.pill,.status-badge){border-color:rgba(143,91,52,.17);font-weight:900;}
/* Table upgrade: JS writes labels from thead; CSS makes mobile card tables usable in the warehouse. */
body[data-zip3-design-system] .table-wrap,body[data-zip3-design-system] .table-responsive,body[data-zip3-design-system] .data-table-wrap,body[data-zip3-design-system] .data-table-shell{border-radius:22px;border-color:rgba(143,91,52,.14);background:#fffdf8;box-shadow:0 14px 34px rgba(53,36,21,.07);} 
body[data-zip3-design-system] table.zip3-table-enhanced th{background:linear-gradient(180deg,#fffaf3,#f4eadc);color:var(--depo-text);}
body[data-zip3-design-system] table.zip3-table-enhanced td{color:var(--depo-text-soft);}
body[data-zip3-design-system] :where(.numeric,.money,.qty,.stat-value,.metric-value){font-variant-numeric:tabular-nums;}
body[data-zip3-design-system] [aria-busy="true"]{cursor:progress;opacity:.82;}
body[data-zip3-design-system] [data-zip3-form-ready="true"] .form-actions{gap:12px;}
body[data-zip3-design-system] .empty-state{border-radius:24px;background:rgba(255,253,248,.72);}
@media (max-width:960px){
  .zip3-shell-actions{gap:8px;}
  .zip3-desktop-only{display:none!important;}
  .zip3-shell-nav .zip3-nav-link{min-width:96px;}
  .zip3-context-toolbar{align-items:flex-start;}
}
@media (max-width:720px){
  body[data-zip3-design-system] .zip3-shell-header{min-height:66px;}
  .zip3-shell-actions .zip3-scope-pill{display:none;}
  .zip3-shell-nav{width:calc(100% - 20px);gap:8px;padding-bottom:12px;}
  .zip3-shell-nav .zip3-nav-link{min-width:92px;min-height:50px;padding:8px 10px;border-radius:16px;}
  .zip3-shell-nav .zip3-nav-link small{font-size:.68rem;}
  .zip3-context-container{padding-top:10px;}
  .zip3-context-toolbar{display:grid;padding:14px;border-radius:20px;}
  .zip3-context-toolbar__actions{justify-content:flex-start;}
  .zip3-context-toolbar__actions .btn{flex:1 1 140px;}
  .zip3-public-header{position:static;margin-top:10px;}
  .zip3-public-nav{justify-content:flex-start;overflow-x:auto;flex-wrap:nowrap;max-width:100%;}
  body[data-zip3-design-system] .zip3-main{padding-top:14px;}
}
@media (max-width:640px){
  body[data-zip3-design-system] table.zip3-table-enhanced{min-width:0!important;border-spacing:0 .75rem;border-collapse:separate;background:transparent;}
  body[data-zip3-design-system] table.zip3-table-enhanced thead{display:none;}
  body[data-zip3-design-system] table.zip3-table-enhanced tbody,body[data-zip3-design-system] table.zip3-table-enhanced tr,body[data-zip3-design-system] table.zip3-table-enhanced td{display:block;width:100%;}
  body[data-zip3-design-system] table.zip3-table-enhanced tr{margin:0 0 .85rem;padding:.72rem;border:1px solid rgba(143,91,52,.14);border-radius:18px;background:#fffdf8;box-shadow:0 12px 28px rgba(53,36,21,.07);}
  body[data-zip3-design-system] table.zip3-table-enhanced td{display:grid;grid-template-columns:minmax(7.25rem,38%) minmax(0,1fr);gap:.65rem;padding:.54rem .35rem;border:0;border-bottom:1px solid rgba(143,91,52,.08);text-align:left!important;}
  body[data-zip3-design-system] table.zip3-table-enhanced td:last-child{border-bottom:0;}
  body[data-zip3-design-system] table.zip3-table-enhanced td::before{content:attr(data-label);font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;font-weight:950;color:var(--depo-text);}
}
@media (max-width:420px){
  .zip3-shell-actions .btn.small{min-height:38px;padding:8px 10px;}
  .zip3-breadcrumbs strong{max-width:52vw;}
  .zip3-context-toolbar__actions .btn{flex-basis:100%;}
}
@media (prefers-reduced-motion:reduce){
  body[data-zip3-design-system] *,body[data-zip3-design-system] *::before,body[data-zip3-design-system] *::after{transition:none!important;animation:none!important;scroll-behavior:auto!important;}
  body[data-zip3-design-system] :where(.btn,button.btn,a.btn,.button):where(:hover,:focus-visible){transform:none;}
}
@media print{
  .zip3-context-toolbar,.zip3-top-shell,.zip3-public-header{display:none!important;}
}
