/* OZR BUILDERS — design system + responsive layer.
   Views copy the prototype's inline styles 1:1 (desktop); this file adds the mobile/tablet overrides via helper classes. */
:root{
  --ink:#0B0B0B; --gold:#D4AF37; --gold-dark:#B8941F; --gold-tint:#FBF3DC; --cream:#FAF8F4; --paper:#F7F5F1;
  --line:#EFEDE7; --line-2:#EDEBE4; --muted:#6b6b66; --danger:#C0392B; --ok:#1f8f5f;
  --f-head:'Bricolage Grotesque',sans-serif; --f-body:'Plus Jakarta Sans',sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:#fff;color:var(--ink);font-family:var(--f-body);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%}
a{color:var(--gold)} a:hover{color:var(--gold-dark)}
button{font-family:inherit}
[x-cloak],[wire\:cloak]{display:none!important}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
input,select,textarea{font-family:inherit;font-size:14px;max-width:100%}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--gold)!important;box-shadow:0 0 0 3px rgba(212,175,55,.18)}

/* generic building blocks */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:9px;padding:13px 22px;font-weight:700;font-size:14px;cursor:pointer;text-decoration:none;white-space:nowrap;font-family:inherit;transition:filter .15s,transform .05s}
.btn:active{transform:translateY(1px)}
.btn-gold{background:var(--gold);color:var(--ink)} .btn-gold:hover{filter:brightness(.95);color:var(--ink)}
.btn-dark{background:var(--ink);color:#fff} .btn-dark:hover{background:#222;color:#fff}
.btn-ghost{background:#fff;border:1.5px solid #E2DFD6;color:var(--ink)} .btn-ghost:hover{border-color:var(--gold);color:var(--ink)}
.btn-danger{background:#fff;border:1.5px solid #f0c6c1;color:var(--danger)}
.btn-sm{padding:8px 14px;font-size:12.5px;border-radius:8px}
.btn[disabled],.btn.is-loading{opacity:.6;pointer-events:none}
.field{width:100%;padding:12px 14px;border:1.5px solid #E2DFD6;border-radius:9px;background:#fff;color:var(--ink);min-height:44px}
.field.has-error{border-color:var(--danger)}
.err{color:var(--danger);font-size:12px;margin-top:5px;font-weight:600}
.card{background:#fff;border:1px solid var(--line-2);border-radius:14px}
.pill{display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border-radius:999px;font-size:11.5px;font-weight:700;white-space:nowrap}
.toast{position:fixed;right:20px;bottom:20px;z-index:200;background:var(--ink);color:#fff;padding:13px 18px;border-radius:10px;font-size:13.5px;font-weight:600;box-shadow:0 12px 30px -8px rgba(0,0,0,.45);border-left:4px solid var(--gold);max-width:calc(100vw - 40px)}
.toast.err-t{border-left-color:var(--danger)}
.skeleton{background:linear-gradient(90deg,#f0eee8,#faf8f4,#f0eee8);background-size:200% 100%;animation:sk 1.2s infinite}
@keyframes sk{to{background-position:-200% 0}}
.hide-scroll{scrollbar-width:none} .hide-scroll::-webkit-scrollbar{display:none}
.tbl-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}

/* public header */
.pub-header{position:sticky;top:0;z-index:50;background:var(--ink);border-bottom:1px solid #232323;display:flex;align-items:center;justify-content:space-between;padding:0 48px;height:76px}
.pub-nav{display:flex;align-items:center;gap:34px}
.pub-actions{display:flex;align-items:center;gap:22px}
.burger{display:none;background:none;border:0;color:#fff;font-size:28px;cursor:pointer;padding:6px;line-height:1}
.drawer{position:fixed;inset:0;z-index:100;display:none}
.drawer.open{display:block}
.drawer-bg{position:absolute;inset:0;background:rgba(0,0,0,.6)}
.drawer-panel{position:absolute;top:0;right:0;bottom:0;width:min(86vw,340px);background:var(--ink);padding:22px;display:flex;flex-direction:column;gap:6px;overflow-y:auto}
.drawer-panel a.dl{color:rgba(255,255,255,.85);text-decoration:none;font-weight:600;font-size:16px;padding:14px 4px;border-bottom:1px solid #1e1e1e}
.drawer-panel a.dl.active{color:var(--gold)}
.wa-float{position:fixed;bottom:28px;right:28px;width:58px;height:58px;border-radius:50%;background:#25D366;display:flex;align-items:center;justify-content:center;box-shadow:0 8px 24px -6px rgba(0,0,0,.4);z-index:80;text-decoration:none}
.sticky-cta{display:none}

/* admin shell */
.adm-shell{display:flex;min-height:100vh;background:var(--paper);font-family:var(--f-body)}
.adm-side{width:240px;flex-shrink:0;position:sticky;top:0;height:100vh;z-index:60}
.adm-main{flex:1;min-width:0;display:flex;flex-direction:column}
.adm-content{padding:28px;flex:1}
.adm-burger{display:none}
.adm-scrim{display:none}
.adm-topbar{position:sticky;top:0;z-index:40}

/* ============ RESPONSIVE ============ */
/* tablet */
@media (max-width:1100px){
  .pub-header{padding:0 24px}
  .pub-nav{gap:20px}
  .r-pad{padding-left:24px!important;padding-right:24px!important}
  .r-grid-4{grid-template-columns:repeat(2,1fr)!important}
  .r-grid-3{grid-template-columns:repeat(2,1fr)!important}
  .r-split{grid-template-columns:1fr!important;gap:36px!important}
}
/* mobile / small tablet */
@media (max-width:900px){
  .pub-nav,.pub-actions .pub-lang,.pub-actions .pub-lock,.pub-actions .pub-cta{display:none!important}
  .burger{display:block}
  .pub-header{height:64px;padding:0 16px}
  .pub-header .brand-img{width:42px!important;height:42px!important}
  .adm-side{position:fixed;left:0;top:0;transform:translateX(-100%);transition:transform .22s}
  .adm-side.open{transform:none}
  .adm-scrim.open{display:block;position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:55}
  .adm-burger{display:inline-flex;align-items:center;background:none;border:0;font-size:26px;cursor:pointer;color:var(--ink);padding:4px 8px 4px 0}
  .adm-content{padding:16px}
  .adm-topbar{padding:0 14px!important;height:60px!important}
  .adm-topbar .tb-link span{display:none}
  .r-split,.r-grid-2,.r-grid-3,.r-grid-4{grid-template-columns:1fr!important}
  .r-grid-2-sm{grid-template-columns:repeat(2,1fr)!important}
  .r-pad{padding-left:20px!important;padding-right:20px!important}
  .r-pad-y{padding-top:44px!important;padding-bottom:44px!important}
  .r-h1{font-size:36px!important;line-height:1.1!important}
  .r-h2{font-size:28px!important;line-height:1.15!important}
  .r-h3{font-size:22px!important}
  .r-stack{flex-direction:column!important;align-items:stretch!important}
  .r-wrap{flex-wrap:wrap!important}
  .r-hide{display:none!important}
  .r-show{display:block!important}
  .r-full{width:100%!important;max-width:100%!important}
  .r-min0{min-width:0!important}
  .r-scroll-x{display:flex!important;overflow-x:auto;gap:12px;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch}
  .r-scroll-x>*{flex:0 0 78%;scroll-snap-align:start}
  .wa-float{bottom:84px;right:16px;width:52px;height:52px}
  .sticky-cta{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:70;background:var(--ink);border-top:1px solid #232323;padding:10px 14px;gap:10px}
  .sticky-cta a{flex:1;text-align:center;padding:13px 10px;border-radius:9px;font-weight:800;font-size:14px;text-decoration:none}
  body.has-sticky{padding-bottom:70px}
  .toast{left:16px;right:16px;bottom:84px}
  /* tables → stacked cards */
  table.r-cards thead{display:none}
  table.r-cards,table.r-cards tbody,table.r-cards tr,table.r-cards td{display:block;width:100%}
  table.r-cards tr{border:1px solid var(--line-2);border-radius:12px;margin-bottom:10px;padding:10px 12px;background:#fff}
  table.r-cards td{padding:5px 0!important;border:0!important;display:flex;justify-content:space-between;gap:12px;text-align:right}
  table.r-cards td::before{content:attr(data-label);font-size:11px;font-weight:700;color:#8a8a80;text-transform:uppercase;letter-spacing:.5px;text-align:left;flex-shrink:0}
  table.r-cards td[data-label=""]::before{display:none}
}
@media (max-width:480px){
  .r-h1{font-size:31px!important}
  .r-grid-2-sm{grid-template-columns:1fr!important}
  .btn{padding:13px 18px}
  .r-btn-full{width:100%}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media print{.adm-side,.adm-topbar,.wa-float,.sticky-cta,.no-print{display:none!important}.adm-content{padding:0}}