/* Off Your Plate by FATHOM1 – theme skin (loads after style.css) */
:root {
  --bg-main:#ffffff; --bg-card:#ffffff; --border-subtle:#e2e8f0;
  --text-primary:#1a1a35; --text-muted:#5e6b7f;
  --cta-warm-primary:#f0a03d; --cta-warm-ember:#da572b;
  --brand-wave:#5f7e9a; --brand-slate:#3c526a; --freshness-accent:#4db8b8;
  --fathom-dark:#232347; --cta-gradient:linear-gradient(135deg,#f0a03d,#da572b);
  /* Approved contrast treatment: preserve the exact warm gradient. */
  --cta-label:#111122; --ember-text:#9b3819; --focus-ring:#3c526a;
  /* Approved non-text treatment: use exact brand slate for control edges. */
  --control-border:var(--brand-slate);
  --disabled-surface:#e2e8f0;
  /* legacy aliases */
  --green-dark:#3c526a; --green-mid:#da572b; --green-light:#f0a03d;
  --green-pale:#f8fafc; --green-bg:#f8fafc; --text-light:#5f7e9a;
  --border:#e2e8f0; --white:#ffffff;
  --shadow-sm:0 4px 12px rgba(0,0,0,.04); --shadow-md:0 4px 12px rgba(0,0,0,.08);
  --radius-sm:8px; --radius-md:12px; --radius-lg:12px;
  --font:"Montserrat",system-ui,sans-serif;
}
body,button,input,textarea,select{font-family:var(--font)}
body{background:var(--bg-main);color:var(--text-primary)}
a{color:var(--brand-slate)}
a:hover{color:var(--ember-text)}

/* Header */
.app-header{background:#fff;color:var(--text-primary);border-bottom:1px solid var(--border-subtle);box-shadow:none}
.logo{display:flex;align-items:center;gap:.6rem;color:var(--text-primary);letter-spacing:0}
.logo-img{height:44px;width:auto;display:block}
.text-center{text-align:center}
.logo-text{display:flex;flex-direction:column;line-height:1.15}
.logo-title{font-size:1.05rem;font-weight:700;color:var(--text-primary)}
.logo-sub{font-size:.68rem;font-weight:600;color:var(--text-muted);letter-spacing:.04em}
.nav-link{color:var(--text-muted);border-radius:8px;font-weight:600}
.nav-link:hover{background:#f8fafc;color:var(--ember-text)}
.nav-link.active,.nav-link.active:hover{background:var(--cta-gradient);color:var(--cta-label);font-weight:700;box-shadow:inset 0 0 0 1px var(--control-border)}
.nav-link:focus-visible,.btn:focus-visible,.mobile-tab:focus-visible{outline:3px solid var(--focus-ring);outline-offset:2px}
.account-status{color:var(--text-muted)}
.btn-account{color:var(--brand-slate);background:#fff;border:1px solid var(--brand-slate)}
.btn-account:hover{background:#f8fafc;color:var(--ember-text)}

/* Surfaces */
.panel,.account-security-summary,.account-data-backup,.account-share,.account-feedback,.account-sign-out,.account-profile-panel,.account-landing-card,.notebook-card{background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:12px;box-shadow:0 4px 12px rgba(0,0,0,.04)}
.account-data-backup,.account-share,.admin-feedback-item{background:#fff}
.notebook-card::before{background:var(--cta-gradient)}
.notebook-landing{background:#fff}
.notebook-brand,.account-kicker{color:var(--ember-text)}
.notebook-features li::before{background-color:rgba(77,184,184,.15)}
.panel-header,.add-item-form,.library-footer{background:#fff}
.panel-header h2,.account-settings-heading h1,.account-landing h1,.notebook-title,.account-security-summary h2,.account-data-backup h2,.account-share h2,.account-feedback h2,.account-sign-out h2{color:var(--text-primary)}
.agent-heading{display:flex;align-items:center;gap:.5rem}
.agent-mark{width:28px;height:28px;object-fit:contain;padding:2px;border:1.5px solid var(--freshness-accent);border-radius:50%;background:#fff;flex:0 0 auto}

/* Buttons */
.btn{border-radius:8px;font-weight:600}
.btn-primary{background:var(--cta-gradient);color:var(--cta-label);border:none;box-shadow:inset 0 0 0 1px var(--control-border)}
.btn-primary:not(:disabled):hover{background:var(--cta-gradient);color:var(--cta-label);transform:translateY(-1px);box-shadow:inset 0 0 0 1px var(--control-border),0 4px 14px rgba(240,160,61,.35)}
.btn-primary:not(:disabled):active{transform:none}
.btn-secondary{background:#fff;color:var(--brand-slate);border:1px solid var(--brand-slate)}
.btn-secondary:not(:disabled):hover{background:#fff;color:var(--ember-text);border-color:var(--ember-text)}
.btn-ghost{color:var(--text-muted)}
.btn-ghost:hover{background:#f8fafc;color:var(--ember-text)}
.btn:disabled,.pantry-starter:disabled,.pantry-guidance-close:disabled{opacity:1;background:var(--disabled-surface);color:var(--brand-slate);box-shadow:none;transform:none;cursor:not-allowed}
@media (prefers-reduced-motion:reduce){.btn,.btn-primary:not(:disabled):hover{transition:none;transform:none}}

/* Pantry Agent */
.panel-chat{background:#f8fafc}
.panel-chat .panel-header,.panel-chat .chat-form{background:#f8fafc}
.message-agent .bubble{background:#fff;border:1px solid var(--border-subtle);color:var(--text-primary)}
.message-user .bubble{background:var(--brand-slate);color:#fff}
.pantry-guidance{background:#fff}
.pantry-starter{color:var(--brand-slate);border-color:var(--control-border)}
.pantry-starter:not(:disabled):hover{background:#f8fafc;color:var(--ember-text)}
.pantry-starter:focus-visible,.pantry-guidance-close:focus-visible,.pantry-header-actions .btn:focus-visible{outline-color:var(--focus-ring)}
.chat-input,.add-item-input,.administration input[type="search"],.account-feedback textarea{background:#fff;border:1px solid #cbd5e1;color:var(--text-primary)}
.chat-input,.add-item-input{border-color:var(--control-border)}
.chat-input:focus,.add-item-input:focus,.administration input[type="search"]:focus,.account-feedback textarea:focus{outline:2px solid var(--focus-ring);outline-offset:0;border-color:var(--focus-ring);box-shadow:none}

/* Library / list */
.recipe-card{background:#fff;border-radius:12px}
.recipe-card.selected,.recipe-card.selected:hover{border-color:var(--control-border);box-shadow:0 0 0 2px var(--control-border)}
.recipe-card-header:hover,.grocery-item:hover .grocery-item-content{background:#f8fafc}
.recipe-card-body{background:#f8fafc}
.recipe-card-body li::before{color:var(--cta-warm-primary)}
.recipe-checkbox,.grocery-item-check{accent-color:var(--cta-warm-ember)}
/* Keep native inputs/semantics and existing sizes; make both states deterministic
   across browsers rather than relying on native accent-color checkmark choices. */
.recipe-checkbox,.grocery-item-check{
  appearance:none;-webkit-appearance:none;display:inline-grid;place-content:center;
  border:1px solid var(--control-border);border-radius:2px;background:#fff;
}
.recipe-checkbox::after,.grocery-item-check::after{
  content:"";width:4px;height:8px;border:solid #fff;border-width:0 2px 2px 0;
  transform:translateY(-1px) rotate(45deg);visibility:hidden;
}
.recipe-checkbox:checked,.grocery-item-check:checked{background:var(--cta-warm-ember)}
.recipe-checkbox:checked::after,.grocery-item-check:checked::after{visibility:visible}
/* Let the browser honor the user's system colors, and preserve native print marks. */
@media (forced-colors:active),print{
  .recipe-checkbox,.grocery-item-check{appearance:auto;-webkit-appearance:auto;background:revert;border:revert}
  .recipe-checkbox::after,.grocery-item-check::after{content:none}
}
.selector-item-card,.selector-item-card:hover{border-color:var(--control-border)}
.selector-item-card.selected,.selector-item-card.selected:hover{border-color:var(--control-border);box-shadow:0 0 0 2px var(--control-border)}
.recipe-edit-form input,.side-choice-card select{border-color:var(--control-border)}
.recipe-expand-btn:hover,.pantry-guidance-close:not(:disabled):hover{background:#f8fafc}
.category-title{color:#0a5c79;background:rgba(77,184,184,.15);border-radius:8px}
.recipe-box-bar{background:var(--bg-card);border-color:var(--border-subtle);border-radius:12px;box-shadow:var(--shadow-sm)}
.recipe-box-title{color:var(--text-primary)}
#btn-recipe-box-entrees{background:rgba(240,160,61,.15);color:var(--ember-text)}
#btn-recipe-box-starch,#btn-recipe-box-vegetable{background:rgba(77,184,184,.15);color:#0a5c79}
.recipe-box-count-button,.recipe-box-count-button:hover{box-shadow:inset 0 0 0 1px var(--control-border)}
/* Counters inherit their category color, including the legacy hover rule. */
.recipe-box-count-button strong,.recipe-box-count-button:hover strong{color:inherit}
.recipe-box-count-button:focus-visible,.recipe-box-bar:focus-visible,.recipe-box-dish:focus-within,.side-choice-card:focus-within,.generation-preview-edit:focus-visible,.account-preferences input:focus-visible,.account-preferences button:focus-visible{outline:3px solid var(--focus-ring);outline-offset:2px}
.notebook-brand{display:flex;align-items:center;justify-content:center;gap:.6rem;flex-wrap:wrap}
.notebook-brand img{width:42px;height:42px;object-fit:contain}
.brand-attribution{font-size:.7rem;font-weight:600;color:var(--text-muted);letter-spacing:.04em}
.toast{background:var(--fathom-dark)}

/* Auth transition */
.auth-transition-card{background:#fff;color:var(--text-muted);border-radius:12px}
.auth-transition-spinner{border-color:var(--border-subtle);border-top-color:var(--cta-warm-primary)}

/* Mobile */
@media (max-width:768px){
  .logo-img{height:36px}
  .mobile-tab.active,.mobile-tab.active:hover{background:var(--cta-gradient);border-color:var(--control-border);color:var(--cta-label)}
  .mobile-tab{border-radius:8px;border-color:var(--control-border)}
}