/* WOODY V4.27.0 — approved interface refresh
   Presentation only: no business logic, data or document templates are changed. */

:root{
  --bg:#f3f5f2;
  --panel:#fff;
  --ink:#18221c;
  --muted:#68736c;
  --line:#dfe5df;
  --dark:#17251d;
  --gold:#c58b52;
  --green:#2f6d50;
  --red:#a34c47;
  --amber:#9a6a2a;
  --shadow:0 1px 2px rgba(20,35,26,.04),0 5px 18px rgba(20,35,26,.035);
  --woody-sidebar:258px;
  --woody-topbar-height:70px;
}

html{scroll-behavior:smooth}
body{background:var(--bg);font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:15px;line-height:1.5;-webkit-font-smoothing:antialiased}
button,input,select,textarea{font-family:inherit}
button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,a:focus-visible{outline:3px solid rgba(47,109,80,.2);outline-offset:2px}

/* Login */
.login-screen{background:#f3f5f2}
.login-brand{background:linear-gradient(155deg,rgba(197,139,82,.09),transparent 34%),linear-gradient(180deg,#17251d,#132018 76%);padding:70px clamp(36px,7vw,100px)}
.login-brand:before{content:"";position:absolute;inset:0 0 auto 0;height:4px;background:linear-gradient(90deg,#c58b52,#dfb37f 52%,transparent)}
.login-brand:after{border-color:rgba(197,139,82,.2);box-shadow:0 0 0 70px rgba(197,139,82,.045),0 0 0 140px rgba(197,139,82,.025)}
.login-wordmark strong{font-family:inherit;font-size:48px;font-weight:800;letter-spacing:.11em}
.login-wordmark span{color:#9fb0a5}
.login-intro h1{font-size:46px;font-weight:400;letter-spacing:-.045em;line-height:1.08}
.login-intro p{color:#c1ccc5}
.login-card{border-color:#dfe5df;border-radius:18px;box-shadow:0 20px 65px rgba(20,35,26,.12)}
.login-card h2{font-size:30px;font-weight:760;letter-spacing:-.035em}
.login-card input{border-color:#d9e0da;border-radius:10px}

/* Shell and sidebar */
#appShell.app{grid-template-columns:var(--woody-sidebar) minmax(0,1fr);background:var(--bg)}
#appShell>aside{position:fixed;inset:0 auto 0 0;z-index:40;width:var(--woody-sidebar);height:100vh;padding:22px 16px 16px;background:linear-gradient(155deg,rgba(197,139,82,.08),transparent 32%),linear-gradient(180deg,#17251d,#132018 76%);border-right:1px solid rgba(255,255,255,.06);overscroll-behavior:contain}
#appShell>aside:after{content:"";position:absolute;inset:0 0 auto 0;height:4px;background:linear-gradient(90deg,#c58b52,#dfb37f 52%,transparent)}
#appShell .brand{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;min-height:160px;margin:0 0 20px;padding:3px 6px 22px;border-bottom:1px solid rgba(255,255,255,.1);position:relative}
#appShell .brand-logo{display:block!important;width:108px!important;height:108px!important;max-height:108px!important;margin:0 auto!important;padding:0;object-fit:contain;border-radius:0;background:transparent;box-shadow:none}
#appShell .brand:before{content:none;display:none}
#appShell .brand>div{display:block!important;width:100%;margin:0!important;text-align:center!important;font-family:inherit!important;font-size:28px!important;font-weight:500!important;line-height:1!important;letter-spacing:.12em!important;color:#fff}
#appShell .brand>span{display:none!important}
#appShell .brand>span:after{content:none}
#appShell nav{display:grid;grid-template-columns:1fr;gap:4px;margin:0}
#appShell .nav-section-label{padding:0 11px;margin:2px 0 7px;color:#789083;font-size:11px;font-weight:750;letter-spacing:.12em;text-transform:uppercase}
#appShell .nav-section-label.admin{margin-top:19px}
#appShell nav button{position:relative;width:100%;min-height:44px;display:grid;grid-template-columns:22px minmax(0,1fr);gap:11px;align-items:center;padding:9px 11px;border:0;border-radius:10px;background:transparent;color:#b8c5bd;text-align:left;font-size:14px;font-weight:560;transition:background .16s,color .16s,transform .16s}
#appShell nav button svg{width:19px;height:19px;display:block;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
#appShell nav button:hover{background:rgba(255,255,255,.06);color:#fff;transform:translateX(1px)}
#appShell nav button.active{background:linear-gradient(90deg,rgba(197,139,82,.18),rgba(255,255,255,.065));color:#fff;box-shadow:inset 0 0 0 1px rgba(255,255,255,.035)}
#appShell nav button.active:before{content:"";position:absolute;left:0;top:10px;bottom:10px;width:3px;border-radius:0 4px 4px 0;background:#c58b52;box-shadow:0 0 12px rgba(197,139,82,.45)}
#appShell .user{margin-top:auto;padding:13px 13px 12px;border:1px solid rgba(255,255,255,.1);border-radius:12px;background:rgba(255,255,255,.035);color:#92a59a;font-size:11px}
#appShell .user b{font-size:13px;color:#fff}
#appShell #rolePreview{min-height:36px;margin-top:9px!important;padding:7px 9px;background:#20352a!important;border-color:rgba(255,255,255,.13)!important;border-radius:8px;color:#eef4ef!important}
#appShell .sign-out-btn{border-color:rgba(255,255,255,.14);border-radius:8px;color:#c8d2cb}

/* Top bar */
#appShell>main{grid-column:2;min-width:0;padding:0;overflow:visible}
.woody-topbar{height:var(--woody-topbar-height);position:sticky;top:0;z-index:30;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:0 clamp(22px,3vw,42px);border-bottom:1px solid rgba(221,228,222,.92);background:rgba(250,251,249,.9);backdrop-filter:blur(14px)}
.flash{top:calc(var(--woody-topbar-height) + 12px);max-width:min(420px,calc(100vw - 40px));z-index:120;overflow-wrap:anywhere;box-shadow:0 8px 24px rgba(20,35,26,.18)}
.woody-topbar-left,.woody-topbar-right{display:flex;align-items:center;gap:11px}
.woody-topbar-copy strong,.woody-topbar-copy span{display:block}
.woody-topbar-copy strong{font-size:13px;letter-spacing:.01em}
.woody-topbar-copy span{margin-top:1px;color:#7c8780;font-size:11px}
.woody-system-state{display:flex;align-items:center;gap:7px;padding:7px 10px;border:1px solid #dfe5df;border-radius:999px;background:#fff;color:#607068;font-size:11px;font-weight:700}
.woody-system-state i{width:7px;height:7px;border-radius:50%;background:#3a8a61;box-shadow:0 0 0 3px rgba(58,138,97,.12);animation:woody-live-pulse 2s ease-in-out infinite;transform-origin:center}
@keyframes woody-live-pulse{
  0%,100%{opacity:1;transform:scale(1);box-shadow:0 0 0 3px rgba(58,138,97,.12)}
  50%{opacity:.72;transform:scale(.88);box-shadow:0 0 0 7px rgba(58,138,97,0)}
}
.woody-mobile-menu{display:none;width:38px;height:38px;place-items:center;border:1px solid #dfe5df;border-radius:10px;background:#fff;color:#536159}
.woody-mobile-menu svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round}
.woody-sidebar-overlay{display:none}
#appShell>main>.view{width:min(100%,1600px);margin:0 auto;padding:34px clamp(22px,3vw,42px) 64px}

/* Page headings */
#appShell .top{align-items:flex-end;gap:24px;margin-bottom:27px}
#appShell .top>div:first-child{min-width:0}
#appShell .top>div:first-child:before{display:block;margin-bottom:4px;color:#2f6d50;font-size:11px;font-weight:800;letter-spacing:.11em;text-transform:uppercase}
#dashboard>.top>div:first-child:before{content:"Business overview"}
#quotes>.top>div:first-child:before{content:"Sales pipeline"}
#invoices>.top>div:first-child:before{content:"Customer accounts"}
#accountsFeed>.top>div:first-child:before{content:"Cash movement"}
#customers>.top>div:first-child:before{content:"Customer records"}
#products>.top>div:first-child:before{content:"Product library"}
#suppliers>.top>div:first-child:before{content:"Supplier directory"}
#calendar>.top>div:first-child:before{content:"Studio schedule"}
#reports>.top>div:first-child:before{content:"Performance reporting"}
#settings>.top>div:first-child:before{content:"Administration"}
#appShell h1:not(.quote-doc-title):not(.client-payment-title){margin:4px 0 5px;font-family:inherit;font-size:clamp(29px,3vw,38px);font-weight:760;line-height:1.12;letter-spacing:-.045em}
.woody-version-badge{display:inline-flex;align-items:center;padding:7px 11px;border:1px solid #17251d;border-radius:999px;background:#17251d;color:#fff;font-size:13px;font-weight:600;line-height:1;letter-spacing:.02em;white-space:nowrap;box-shadow:0 4px 12px rgba(23,37,29,.12)}
#appShell h2:not(.quote-doc-box h2){font-family:inherit;font-size:18px;font-weight:730;letter-spacing:-.025em}
#appShell h3{font-family:inherit;font-weight:720;letter-spacing:-.015em}
#appShell .top p{font-size:15px;color:#68736c}

/* Controls */
#appShell input,#appShell select,#appShell textarea{min-height:40px;padding:9px 11px;border:1px solid #d9e0da;border-radius:9px;outline:0;background:#fff;color:#18221c;transition:border-color .15s,box-shadow .15s}
#appShell input:focus,#appShell select:focus,#appShell textarea:focus{border-color:#699079;box-shadow:0 0 0 3px rgba(47,109,80,.1)}
#appShell label{color:#68736c;font-size:12px;font-weight:620}
#appShell .btn{min-height:40px;display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:9px 14px;border:1px solid #dfe5df;border-radius:10px;background:#fff;color:#18221c;font-size:13px;font-weight:700;white-space:nowrap;transition:transform .14s,background .14s,border-color .14s,box-shadow .14s}
#appShell .btn:hover{transform:translateY(-1px);border-color:#bdc9bf;background:#f8faf7}
#appShell .btn.primary{background:#17251d;border-color:#17251d;color:#fff;box-shadow:0 6px 16px rgba(23,37,29,.15)}
#appShell .btn.primary:hover{background:#21372a;border-color:#21372a;box-shadow:0 8px 20px rgba(23,37,29,.2)}
#appShell .btn.small{min-height:32px;padding:6px 10px;border-radius:8px;font-size:11px}
#appShell .btn.danger{color:#a34c47}
#appShell a.link{color:#255c42;text-decoration:none}
#appShell a.link:hover{text-decoration:underline}

/* Surfaces and metrics */
#appShell .card,#appShell .calendar-shell{border:1px solid #dfe5df;border-radius:14px;background:#fff;box-shadow:var(--shadow)}
#appShell .card{padding:19px;margin-bottom:16px}
#appShell .metrics{gap:14px;margin-bottom:16px}
#appShell .metrics .metric.card{min-height:145px;position:relative;overflow:hidden;padding:19px 18px 16px}
#appShell .metrics .metric.card:before{content:"";position:absolute;top:0;left:18px;right:18px;height:2px;background:linear-gradient(90deg,#2f6d50,transparent)}
#appShell .metric span{font-size:12px;font-weight:620;color:#68736c}
#appShell .metric strong{margin-top:11px;font-size:28px;font-weight:780;line-height:1;letter-spacing:-.035em;font-variant-numeric:tabular-nums}
#appShell .metric small{display:block;margin-top:9px;color:#8a948d!important;font-size:11px}
#appShell .dashboard-history-metrics{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
#appShell .dashboard-activity-grid{gap:12px}
#appShell .dashboard-activity-stat{padding:15px;border:1px solid #dfe5df;border-top-width:3px;border-radius:12px;background:#fff;box-shadow:0 1px 10px rgba(20,35,26,.025)}
#appShell .dashboard-activity-stat span{font-weight:620}
#appShell .dashboard-activity-stat strong{font-size:26px;letter-spacing:-.035em}
#appShell .historical-year-card{border-color:#dfe5df;border-radius:12px;background:#f8faf7}

/* Filters */
#dashboard>.card.no-print,#appShell .quote-search-card,#accountsFeed>.card.no-print{padding:14px 16px;border-color:#dfe5df;background:rgba(255,255,255,.78)}
#appShell .dashboard-report-filters{grid-template-columns:minmax(150px,.75fr) minmax(150px,.75fr) minmax(300px,1.8fr) auto;gap:12px}
#appShell .dashboard-report-filters .full{grid-column:auto}
#appShell .studio-multi-select{min-height:40px;margin-top:6px;padding:5px;border-color:#dfe5df;border-radius:9px;background:#fff}
#appShell .studio-multi-option{padding:6px 9px;border-color:#e3e8e4;background:#f8faf7}
#appShell .studio-multi-option:has(input:checked){border-color:#84a18f;background:#e8f0eb;color:#24583e}
#appShell .quote-search-card{gap:11px;margin-bottom:14px}
#appShell .quote-filter-note{color:#879089}

/* Data tables */
#appShell table:not(.quote-doc-table):not(.client-payment-table){width:100%;border-collapse:collapse}
#appShell table:not(.quote-doc-table):not(.client-payment-table) th,#appShell table:not(.quote-doc-table):not(.client-payment-table) td{padding:13px 12px;border-bottom:1px solid #ebefeb;text-align:left;vertical-align:middle;font-size:13px}
#appShell table:not(.quote-doc-table):not(.client-payment-table) th{padding-top:9px;padding-bottom:10px;color:#758078;font-size:11px;font-weight:750;letter-spacing:.035em;text-transform:uppercase}
#appShell table:not(.quote-doc-table):not(.client-payment-table) tbody tr{transition:background .12s}
#appShell table:not(.quote-doc-table):not(.client-payment-table) tbody tr:hover{background:#fafcfa}
#appShell .quote-list-card{overflow:hidden;padding:18px}
#appShell .quote-date-heading,#appShell .product-category-heading{margin-top:0;padding-bottom:10px;border-color:#dfe5df;font-family:inherit;font-size:18px;font-weight:730;letter-spacing:-.02em}
#appShell .pill,#appShell .activity-kind{border-radius:999px;background:#edf0ed;color:#5f6962;font-weight:700}
#appShell .quote-outcome-pill{padding:4px 8px;border-radius:999px;font-size:11px;font-weight:750}
#appShell .quote-outcome-pill.live{background:#f8efdf;color:#83591f}
#appShell .quote-outcome-pill.won{background:#e3f1e8;color:#276b48}
#appShell .quote-outcome-pill.lost{background:#f7e7e5;color:#97453f}

/* Quote and invoice editors */
#appShell .refbox{position:relative;overflow:hidden;padding:18px 20px;border-radius:14px;background:linear-gradient(115deg,#17251d,#294032);box-shadow:0 10px 26px rgba(23,37,29,.13)}
#appShell .refbox:after{content:"";position:absolute;right:-45px;top:-95px;width:230px;height:230px;border:1px solid rgba(218,177,133,.2);border-radius:50%;box-shadow:0 0 0 35px rgba(218,177,133,.035)}
#appShell .refbox>*{position:relative;z-index:1}
#appShell .refbox strong{font-family:inherit;font-size:27px;font-weight:760;letter-spacing:-.025em}
#appShell .quote-option-bar,#appShell .tabs{gap:7px;padding:5px 0 12px;border-color:#dfe5df}
#appShell .quote-option-tab,#appShell .tabs .btn{border-color:#dfe5df;border-radius:9px}
#appShell .quote-option-tab.active{background:#17251d;border-color:#17251d;color:#fff}
#quoteEditor #detailsTab>.two{grid-template-columns:minmax(0,1fr) 365px;gap:16px;align-items:start}
#appShell .quote-preview-card{top:88px;border-radius:14px}
#appShell .quote-preview-head{padding:19px;background:#17251d}
#appShell .quote-preview-head strong{font-family:inherit;font-size:21px;font-weight:740;letter-spacing:-.02em}
#appShell .quote-preview-body{padding:18px}
#appShell .line-grid{padding:14px;border-color:#e1e6e2;border-radius:12px;background:#fafcfa}
#appShell .line-grid:nth-child(even){background:#f6f8f6}
#appShell .quote-line-compact{border-color:#dfe5df;background:#f1f4f1}
#appShell .quote-line-compact:hover{background:#e9eeea}
#appShell .product-search-panel{max-width:100%;min-width:0}
#appShell .product-search-row{display:flex;flex-wrap:wrap;gap:8px;align-items:flex-end;max-width:100%;min-width:0}
#appShell .product-search-row label{flex:1 0 100%;min-width:0}
#appShell .product-search-row .btn{flex:1 1 140px;min-width:0;max-width:180px;white-space:nowrap}
#appShell .area-summary{border:1px solid #e4e9e5;border-radius:12px;background:#f8faf7}
#appShell .notice{border-left-color:#c58b52;border-radius:9px;background:#fff8ef;color:#74675b}
#appShell .summary.total{border-top-color:#18221c}
#appShell .completed-banner{background:#e5f1e9;border-left-color:#2f6d50}

/* Lists, directories and calendar */
#appShell .supplier-directory{gap:14px}
#appShell .supplier-directory-card{border-color:#dfe5df;border-radius:14px;background:#fff;box-shadow:var(--shadow)}
#appShell .supplier-directory-card:hover{border-color:#c5d0c7;box-shadow:0 14px 35px rgba(20,35,26,.08)}
#appShell .supplier-avatar{background:#e3efe7;color:#2f6d50;font-family:inherit}
#appShell .calendar-shell{padding:18px}
#appShell .calendar-title{font-family:inherit;font-size:20px;font-weight:740;letter-spacing:-.025em}
#appShell .calendar-head{background:#f8faf7}
#appShell .calendar-day:hover,#appShell .week-column:hover{background:#fafcfa}
#appShell .calendar-day.today{box-shadow:inset 0 0 0 2px #2f6d50}
#appShell .calendar-entry{background:#e6f0e9;color:#2a6346;font-weight:650}
#appShell .calendar-entry.installation{background:#f3e7da;color:#875627}
#appShell .calendar-modal{background:rgba(12,22,16,.55);backdrop-filter:blur(3px)}
#appShell .calendar-modal-card{border:1px solid #dfe5df;border-radius:16px;box-shadow:0 25px 70px rgba(0,0,0,.25)}
#appShell .flash{border-radius:10px;background:#17251d;box-shadow:0 12px 30px rgba(15,27,20,.22)}

@media(max-width:1200px){
  #appShell .dashboard-report-filters{grid-template-columns:1fr 1fr}
  #appShell .dashboard-report-filters .full{grid-column:1/-1}
  #appShell .dashboard-report-filters .btn{justify-self:start}
  #quoteEditor #detailsTab>.two{grid-template-columns:1fr}
  #appShell .quote-preview-card{position:relative;top:auto}
}

@media(max-width:900px){
  :root{--woody-topbar-height:64px}
  #appShell.app{display:block}
  #appShell>aside{position:fixed!important;inset:0 auto 0 0!important;width:var(--woody-sidebar);height:100vh!important;transform:translateX(-104%);transition:transform .2s ease;box-shadow:20px 0 50px rgba(14,25,18,.2)}
  #appShell>aside.mobile-open{transform:none}
  #appShell .user{display:block}
  #appShell nav{grid-template-columns:1fr!important;overflow:visible}
  #appShell nav button{text-align:left;font-size:14px}
  #appShell>main{margin-left:0}
  .woody-mobile-menu{display:grid}
  .woody-sidebar-overlay{display:block;position:fixed;inset:0;z-index:35;border:0;background:rgba(12,22,16,.45);opacity:0;pointer-events:none;transition:opacity .2s}
  .woody-sidebar-overlay.open{opacity:1;pointer-events:auto}
  body.woody-nav-open{overflow:hidden}
  .woody-topbar{padding:0 20px}
  #appShell>main>.view{padding:28px 20px 55px}
  #appShell .top{align-items:flex-start}
}

@media(max-width:650px){
  .woody-topbar{padding:0 12px}
  .woody-version-badge{padding:6px 8px;font-size:11px}
  .woody-system-state span{display:none}
  #appShell>main>.view{padding:24px 12px 48px}
  #appShell .top{display:block;margin-bottom:22px}
  #appShell .top .actions{justify-content:flex-start;margin-top:15px}
  #appShell .top .actions .btn{flex:1}
  #appShell h1:not(.quote-doc-title):not(.client-payment-title){font-size:28px}
  #appShell .top p{font-size:13px}
  #appShell .metrics .metric.card{min-height:128px}
  #appShell .metric strong{font-size:25px}
  #dashboard>.card.no-print,#appShell .quote-search-card,#accountsFeed>.card.no-print{padding:12px}
  #appShell .dashboard-report-filters{grid-template-columns:1fr}
  #appShell .dashboard-report-filters .full{grid-column:auto}
  #appShell .dashboard-report-filters .btn{width:100%}
  #appShell .quote-list-card{padding:12px}
  #appShell .quote-list-table tr{border-color:#dfe5df!important;border-radius:12px!important;box-shadow:0 1px 7px rgba(20,35,26,.025)}
  #appShell .quote-list-table td[data-label="Actions"]{border-top-color:#ebefeb!important}
  #appShell .refbox{padding:16px}
  #appShell .line-grid{padding:12px}
}

@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation-duration:.001ms!important;transition-duration:.001ms!important}.woody-system-state i{animation:none!important}}

@media print{
  .woody-topbar,.woody-sidebar-overlay{display:none!important}
  #appShell>main>.view{width:auto!important;margin:0!important;padding:0!important}
  #appShell .card{box-shadow:none!important}
}