/* Shared Fat Coffee interface system. Load this after page-specific styles. */
:root{
  --cream:#fbf3e6;
  --paper:#fffaf2;
  --brown:#482b1c;
  --caramel:#ac652c;
  --tan:#edd4b4;
  --line:#d9b995;
  --muted:#73533b;
  --green:#27543b;
  --grab:#00b14f;
  --grab-ink:#102b1a;
  --error:#a32c24;
  --serif:Fraunces,Georgia,serif;
  --sans:Nunito,Arial,sans-serif;
  --radius-control:999px;
  --radius-card:20px;
  --radius-field:12px;
  --control-height:48px;
  --shadow-float:0 12px 36px #482b1c1f;
}

body{background:var(--cream);color:var(--brown);font:400 17px/1.6 var(--sans)}
:where(h1,h2,h3){font-family:var(--serif);font-weight:900;line-height:1.12;color:var(--brown)}
:where(button,input,select,textarea){font-family:var(--sans)}
:where(.muted,.small,.field-help){color:var(--muted)}
.eyebrow{color:var(--caramel);font:700 .75rem/1.4 var(--sans);letter-spacing:.16em;text-transform:uppercase}

/* One control shape and type treatment; color communicates the action. */
:is(.button,.order-choice,.primary,.primary-cta,.secondary,.cart-checkout,.drink-buy button,.filter,.category-filter,.desk-page-nav button,.desk-tabs button),#options-add{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:var(--control-height);
  padding:12px 20px;
  border:1px solid var(--brown);
  border-radius:var(--radius-control);
  font:700 14px/1.35 var(--sans);
  text-align:center;
  text-decoration:none;
  cursor:pointer;
  transition:background-color .15s,border-color .15s,color .15s,box-shadow .15s;
}
:is(.button,.primary,.primary-cta,.cart-checkout,.drink-buy button),#options-add{background:var(--brown);border-color:var(--brown);color:var(--paper)}
:is(.button,.primary,.primary-cta,.cart-checkout,.drink-buy button):hover:not(:disabled),#options-add:hover:not(:disabled){background:#67402a;border-color:#67402a;color:var(--paper);transform:none}
:is(.secondary,.button.secondary-link){background:var(--paper);border-color:var(--line);color:var(--brown)}
:is(.secondary,.button.secondary-link):hover:not(:disabled){background:var(--cream);border-color:var(--brown);color:var(--brown)}
:is(.order-choice.delivery,.order-choice.account-choice){background:var(--grab);border-color:var(--grab);color:#fff}
:is(.order-choice.delivery,.order-choice.account-choice):hover{background:#00a449;border-color:#00a449;color:#fff}
:is(.danger,.secondary.danger){border-color:#deb6ad;color:var(--error);background:#fff8f5}
:is(.danger,.secondary.danger):hover:not(:disabled){border-color:var(--error);background:#fff0eb;color:var(--error)}
:is(.filter,.category-filter){min-height:44px;padding:9px 18px;background:transparent;border-color:var(--line);color:var(--brown)}
:is(.filter,.category-filter)[aria-pressed="true"]{background:var(--brown);border-color:var(--brown);color:var(--paper)}
:is(.filter,.category-filter):hover:not([aria-pressed="true"]){background:var(--tan);border-color:var(--line)}
:is(.desk-page-nav button,.desk-tabs button)[aria-pressed="true"]{background:var(--brown);border-color:var(--brown);color:var(--paper)}
:where(.info-button,.icon-button){width:44px;height:44px;min-height:44px;padding:0}
:where(button,.button,.order-choice):disabled{cursor:not-allowed;opacity:.52}
:where(button,a,input,select,textarea,summary):focus-visible{outline:3px solid var(--caramel);outline-offset:3px}

/* Fields and surfaces share the same border rhythm. */
:is(input:not([type="checkbox"]):not([type="radio"]),select,textarea){
  width:100%;
  min-height:var(--control-height);
  padding:12px 14px;
  border:1px solid var(--line);
  border-radius:var(--radius-field);
  background:var(--paper);
  color:var(--brown);
  font:400 16px/1.4 var(--sans);
}
:where(label){font-size:14px;font-weight:700}
:is(.drink-card,.product-card,.checkout-card,.order-card,.admin-card,.admin-order,.rewards-page .card,.product-options,.checkout-signin){border-color:var(--line);border-radius:var(--radius-card)}
:where(.notice,.gift-note,.inline-error){border-radius:var(--radius-field)}
:where(.text-link){font-weight:700;text-underline-offset:4px}
:where(.text-link):hover{color:var(--caramel)}

/* Owner surfaces use the same brand components without losing dense desk layout. */
.owner-desk .login-panel{border-radius:var(--radius-card)}
.owner-desk .login-panel h1{font-size:38px;letter-spacing:-.035em}
.owner-desk .admin-card h2,.owner-desk .settings-card summary{font-family:var(--serif);font-weight:900;color:var(--brown)}
.owner-desk .primary,.owner-desk .secondary,.owner-desk .desk-tabs button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:var(--control-height);
  padding:12px 20px;
  border:1px solid var(--brown);
  border-radius:var(--radius-control);
  font:700 14px/1.35 var(--sans);
  text-align:center;
}
.owner-desk .primary{background:var(--brown);border-color:var(--brown)}
.owner-desk .primary:hover:not(:disabled){background:#67402a;border-color:#67402a}
.owner-desk .secondary{background:var(--paper);border-color:var(--line);color:var(--brown)}
.owner-desk .desk-page-nav{padding:5px;background:#f1e3d0;border-radius:var(--radius-control);width:max-content;max-width:100%}
.owner-desk .desk-page-nav button{min-width:112px;border-color:transparent}
.owner-desk .desk-tabs{background:#f1e3d0}
.owner-desk .desk-tabs button{min-height:44px;padding:10px 18px;border-color:transparent;background:transparent;color:var(--muted)}
.owner-desk .desk-tabs button[aria-pressed="true"]{border-color:var(--brown);background:var(--brown);color:var(--paper)}
.owner-desk :is(input:not([type="checkbox"]):not([type="radio"]),select,textarea){min-height:var(--control-height);border:1px solid var(--line);border-radius:var(--radius-field);background:#fff;color:var(--brown);font:600 16px/1.4 var(--sans)}
.owner-desk :is(.admin-order,.admin-card){border-radius:var(--radius-card)}
.owner-desk .admin-order,.owner-desk .admin-card{box-shadow:none}
.owner-desk dialog{background:var(--paper);color:var(--brown)}

/* Dialog close buttons remain compact icons while matching the shared outline. */
:where(.dialog-close,.options-close){display:grid;place-items:center;width:40px;height:40px;min-height:40px;padding:0;border:1px solid var(--line);border-radius:50%;background:var(--paper);color:var(--brown);font:400 26px/1 var(--sans)}

/* Footer type and spacing are uniform on public and desk pages. */
body>.site-footer{display:flex;align-items:center;justify-content:space-between;gap:24px;width:min(1180px,calc(100% - 64px));max-width:none;margin:0 auto;padding:28px 0;border-top:1px solid var(--line);color:var(--muted);font:700 13px/1.5 var(--sans);text-align:left}
.site-footer .footer-nav{display:flex;align-items:center;justify-content:flex-start;gap:20px;flex-wrap:wrap}
.site-footer :is(a,.analytics-settings){margin:0;padding:0;border:0;background:transparent;color:var(--muted);font:700 13px/1.5 var(--sans);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px;cursor:pointer}
.site-footer p{margin:0;color:var(--muted);font:700 13px/1.5 var(--sans);text-align:right}

@media(max-width:700px){
  body{font-size:16px}
  :is(.button,.order-choice,.primary,.primary-cta,.secondary,.cart-checkout,.drink-buy button),#options-add{min-height:46px;padding:11px 17px;font-size:13px}
  .owner-desk .login-panel h1{font-size:34px}
  body>.site-footer{width:calc(100% - 36px);padding:24px 0;flex-direction:column;align-items:center;justify-content:center;gap:14px;text-align:center}.site-footer .footer-nav{justify-content:center;gap:10px 16px}.site-footer p{max-width:none;text-align:center}
}
@media(max-width:540px){
  .drink-grid{grid-template-columns:1fr;gap:18px}
  .drink-card{border-radius:var(--radius-card)}
  .drink-body{padding:20px}
  .drink-body h3{font-size:1.5rem}
  .drink-body>p:not(.drink-note){font-size:1rem}
  .owner-desk .desk-page-nav{display:grid;grid-template-columns:1fr 1fr;width:100%}
  .owner-desk .desk-page-nav button{min-width:0;width:100%}
}
@media(prefers-reduced-motion:reduce){
  :where(.button,.order-choice,.primary,.primary-cta,.secondary,.cart-checkout,.drink-buy button,#options-add,.filter,.category-filter){transition:none}
}