@font-face{font-family:Archivo;src:url(/static/fonts/archivo.woff2) format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url(/static/fonts/plexmono.woff2) format("woff2");font-weight:400;font-display:swap}

/* ---- Custom Properties ---- */
:root{
  --bg:#F1EFEA;
  --ink:#111;
  --mut:#5B5B57;
  --red:#D7261E;
  --red-dark:#B81D17;
  --border:rgba(17,17,17,.14);
  --border-solid:rgba(17,17,17,.8);
  --white:#fff;
  --r:0;
  --focus:2px solid #111;
  --trans:150ms ease;
}

/* ---- Reset / Base ---- */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:16px;-webkit-text-size-adjust:100%}
body{background:var(--bg);color:var(--ink);font-family:Archivo,system-ui,sans-serif;font-size:1rem;line-height:1.55;min-width:360px}
a{color:var(--ink);text-underline-offset:.2em}
a:hover{color:var(--red)}
img,svg{display:block;max-width:100%}
ul,ol{padding-left:1.25rem}
table{border-collapse:collapse;width:100%}
th,td{text-align:left;vertical-align:top;padding:.5rem .75rem;border-bottom:1px solid var(--border)}
th{font-weight:700;font-size:.875rem;color:var(--mut)}
input,select,textarea,button{font-family:inherit;font-size:inherit}
button{cursor:pointer}

/* ---- Layout ---- */
.wrap{max-width:1120px;margin:0 auto;padding:0 1rem}
.sec{padding:3rem 0}

/* ---- Nav / Bar ---- */
.bar{background:var(--white);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:100}
.bar-in{display:flex;align-items:center;gap:1rem;padding:.75rem 1rem;max-width:1120px;margin:0 auto}
.brand{font-weight:800;font-size:1.1rem;letter-spacing:-.02em;text-decoration:none;color:var(--ink);margin-right:auto}
.nav{display:flex;align-items:center;gap:.25rem;flex-wrap:wrap}
.nav a{padding:.375rem .625rem;text-decoration:none;color:var(--mut);font-size:.875rem;border-radius:var(--r);transition:color var(--trans),background var(--trans)}
.nav a:hover{color:var(--ink);background:var(--border)}
.nav a:focus-visible{outline:var(--focus);outline-offset:2px}
.nav .btn{margin-left:.25rem}

/* ---- Footer ---- */
.foot{border-top:1px solid var(--border);padding:1.5rem 0;text-align:center;font-size:.875rem;color:var(--mut)}
.foot a{color:var(--mut)}

/* ---- Flash messages ---- */
.flash{padding:.75rem 1rem;border-left:3px solid var(--ink);background:var(--white);margin-bottom:1rem;font-size:.9375rem}
.flash.warn{border-color:var(--red);color:var(--red)}

/* ---- Buttons ---- */
.btn{display:inline-flex;align-items:center;gap:.375rem;padding:.5rem 1rem;font-size:.9375rem;font-weight:600;border:2px solid transparent;border-radius:var(--r);text-decoration:none;transition:background var(--trans),color var(--trans),border-color var(--trans);cursor:pointer;line-height:1.2}
.btn:focus-visible{outline:var(--focus);outline-offset:2px}
.btn:active{transform:scale(.98)}
.btn[disabled],.btn--disabled{opacity:.5;pointer-events:none}

/* btn red = legacy alias for btn--primary */
.btn.red,.btn--primary{background:var(--red);color:var(--white);border-color:var(--red)}
.btn.red:hover,.btn--primary:hover{background:var(--red-dark);border-color:var(--red-dark)}
.btn--secondary{background:var(--white);color:var(--ink);border-color:var(--border-solid)}
.btn--secondary:hover{border-color:var(--ink)}
.btn--quiet{background:transparent;color:var(--ink);border-color:transparent}
.btn--quiet:hover{background:var(--border)}
.btn--danger{background:transparent;color:var(--red);border-color:var(--red)}
.btn--danger:hover{background:var(--red);color:var(--white)}

/* ---- Forms ---- */
.form{display:grid;gap:1.25rem;max-width:480px}
.field{display:grid;gap:.25rem}
.field__label{font-size:.875rem;font-weight:600;color:var(--ink)}
.field__help{font-size:.8125rem;color:var(--mut)}
.field__error{font-size:.8125rem;color:var(--red);font-weight:600}
.field input,.field select,.field textarea{width:100%;padding:.5rem .75rem;border:1px solid var(--border-solid);border-radius:var(--r);background:var(--white);color:var(--ink);transition:border-color var(--trans),outline var(--trans)}
.field input:focus,.field select:focus,.field textarea:focus{outline:var(--focus);outline-offset:2px;border-color:var(--ink)}
.field--error input,.field--error select,.field--error textarea{border-color:var(--red)}
.field--error input:focus,.field--error select:focus,.field--error textarea:focus{outline-color:var(--red)}
.field input[disabled],.field select[disabled],.field textarea[disabled]{opacity:.5;cursor:not-allowed}
.field textarea{resize:vertical;min-height:80px}
.field input[type="checkbox"],.field input[type="radio"]{width:auto;margin-right:.375rem;accent-color:var(--red)}

.inline{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}
.inline .field{margin:0;flex:1;min-width:0}

.err{color:var(--red);font-size:.875rem;font-weight:600}

/* Checkbox row layout */
.check-row{display:flex;align-items:flex-start;gap:.5rem;font-size:.9375rem}
.check-row input[type="checkbox"]{margin-top:.25rem;accent-color:var(--red);flex-shrink:0}

/* ---- Utility ---- */
.mut{color:var(--mut)}
.mono{font-family:"IBM Plex Mono",monospace;font-size:.875em}
.n{white-space:nowrap}
.deliv{color:var(--red);font-weight:700}
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ---- Scroll / Table wrapper ---- */
.scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}

/* ---- Icons ---- */
.icon{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;flex-shrink:0;vertical-align:middle}
.icon-20{width:20px;height:20px}
.icon-24{width:24px;height:24px}

/* ---- Status Badges ---- */
.badge{display:inline-block;padding:.125rem .5rem;font-size:.75rem;font-weight:700;border-radius:var(--r);text-transform:uppercase;letter-spacing:.04em;color:var(--white)}
.badge--draft{background:#5B5B57}
.badge--authorized{background:#7C5C1E}
.badge--paid{background:#1A6B3C}
.badge--in_production{background:#1A5C8A}
.badge--qc{background:#7C3C8A}
.badge--delivered{background:#1A6B3C}
.badge--posted{background:#111}
.badge--declined{background:#D7261E}
.badge--cancelled{background:#5B5B57}
.badge--refunded{background:#7C5C1E}

/* ---- Notice ---- */
.notice{padding:.75rem 1rem;border-left:3px solid var(--ink);background:var(--white);font-size:.9375rem;margin-bottom:1rem}
.notice--warn{border-color:#7C5C1E;background:#fdf8f0;color:#5a3e0a}
.notice--error{border-color:var(--red);background:#fdf0f0;color:var(--red)}
.notice--ok{border-color:#1A6B3C;background:#f0fdf5;color:#0f4023}
.warn{border-color:var(--red);color:var(--red)}

/* ---- Stat Cards ---- */
.stat-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:1rem;margin-bottom:2rem}
.stat-card{background:var(--white);border:1px solid var(--border);padding:1.25rem 1.5rem;display:grid;gap:.25rem}
.stat-card__value{font-size:2rem;font-weight:800;line-height:1;color:var(--ink)}
.stat-card__label{font-size:.875rem;color:var(--mut);font-weight:600}
.stat-card__detail{font-size:.8125rem}

/* ---- Card ---- */
.card{background:var(--white);border:1px solid var(--border);margin-bottom:1.5rem}
.card__header{padding:1rem 1.5rem;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between}
.card__header h2{font-size:1.125rem;font-weight:700}
.card__body{padding:1.5rem}

/* ---- Page Header ---- */
.page-header{padding:2rem 0 1.5rem}
.page-header h1{font-size:clamp(1.5rem,4vw,1.75rem);font-weight:800;line-height:1.15}
.page-header .lede{font-size:1.1875rem;color:var(--mut);margin-top:.5rem}

/* ---- Stepper (Order Progress) ---- */
.stepper{display:flex;align-items:flex-start;gap:0;margin:1.5rem 0;overflow-x:auto;padding-bottom:.5rem}
.stepper__step{display:flex;flex-direction:column;align-items:center;flex:1;min-width:44px;text-align:center}
.stepper__dot{width:14px;height:14px;border-radius:50%;background:var(--border);border:2px solid var(--mut);margin-bottom:.375rem;transition:background var(--trans),border-color var(--trans)}
.stepper__label{font-size:.6875rem;color:var(--mut);font-weight:600;text-transform:uppercase;letter-spacing:.04em}
.stepper__line{flex:1;height:2px;background:var(--border);margin-top:.4375rem;min-width:4px}
.stepper__step--done .stepper__dot{background:#1A6B3C;border-color:#1A6B3C}
.stepper__step--done .stepper__label{color:#1A6B3C}
.stepper__step--current .stepper__dot{background:var(--red);border-color:var(--red)}
.stepper__step--current .stepper__label{color:var(--red)}

/* ---- Offer Cards (order_new selectable) ---- */
.offer-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1rem;margin-bottom:1.5rem}
.offer-card{position:relative;border:2px solid var(--border-solid);padding:1.25rem;cursor:pointer;transition:border-color var(--trans);background:var(--white)}
.offer-card:hover{border-color:var(--ink)}
.offer-card--selected{border-color:var(--red)}
.offer-card input[type="radio"]{position:absolute;opacity:0;width:0;height:0}
.offer-card__title{font-size:1rem;font-weight:700;margin-bottom:.25rem}
.offer-card__price{font-size:1.375rem;font-weight:800;color:var(--red);margin-bottom:.5rem}
.offer-card__note{font-size:.875rem;color:var(--mut)}

/* ---- Filter Chips ---- */
.filter-chips{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:1rem}
.filter-chip{display:inline-block;padding:.3rem .75rem;font-size:.875rem;font-weight:600;border:1px solid var(--border-solid);border-radius:var(--r);text-decoration:none;color:var(--mut);background:var(--white);transition:background var(--trans),color var(--trans),border-color var(--trans)}
.filter-chip:hover{border-color:var(--ink);color:var(--ink)}
.filter-chip--active{background:var(--ink);color:var(--white);border-color:var(--ink)}
.filter-chip:focus-visible{outline:var(--focus);outline-offset:2px}

/* ---- Empty State ---- */
.empty-state{text-align:center;padding:3rem 1rem;display:flex;flex-direction:column;align-items:center;gap:1rem}
.empty-state__icon{color:var(--mut);opacity:.5}
.empty-state__title{font-size:1.125rem;font-weight:700}

/* ---- Admin Shell ---- */
.admin-shell{display:grid;grid-template-columns:220px 1fr;min-height:calc(100vh - 56px);gap:0}
.admin-sidebar{background:var(--white);border-right:1px solid var(--border);padding:1.5rem 1rem;display:flex;flex-direction:column;gap:.25rem}
.admin-sidebar .sidebar-label{font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--mut);padding:.5rem .625rem .25rem}
.admin-sidebar a{display:flex;align-items:center;gap:.5rem;padding:.5rem .625rem;text-decoration:none;color:var(--mut);font-size:.9375rem;border-radius:var(--r);transition:color var(--trans),background var(--trans)}
.admin-sidebar a:hover{color:var(--ink);background:var(--border)}
.admin-sidebar a.active{color:var(--ink);background:var(--border);font-weight:600;box-shadow:inset 3px 0 0 var(--red)}
.admin-sidebar a:focus-visible{outline:var(--focus);outline-offset:2px}
.admin-main{padding:2rem;min-width:0}

/* ---- Danger zone ---- */
.danger-zone{border:1px solid var(--red);padding:1.25rem;margin-top:2rem}
.danger-zone h2{color:var(--red);font-size:1rem;margin-bottom:1rem}

/* ---- Responsive ---- */
@media(max-width:600px){
  .admin-shell{grid-template-columns:1fr}
  .admin-sidebar{border-right:none;border-bottom:1px solid var(--border);padding:1rem;flex-direction:row;flex-wrap:wrap;gap:.5rem}
  .admin-sidebar .sidebar-label{display:none}
  .admin-main{padding:1rem}
  .offer-cards{grid-template-columns:1fr}
  .stat-cards{grid-template-columns:repeat(2,1fr)}
  .bar-in{flex-wrap:wrap}
}
@media(max-width:360px){
  .stat-cards{grid-template-columns:1fr}
  .btn{font-size:.875rem;padding:.4375rem .75rem}
}

/* ---- Reduced Motion ---- */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{transition-duration:0ms !important;animation-duration:0ms !important}
}

/* ---- Specific section padding ---- */
.sec-sm{padding:1.5rem 0}

.nav a.btn--primary{color:var(--white)}
.nav a.btn--primary:hover{background:var(--red-dark)}
.nav a.btn--secondary{color:var(--ink)}
@media(max-width:480px){.stepper__step{min-width:0}.stepper__label{font-size:.5625rem;letter-spacing:0}}