/* Lightweight cookie consent banner - replaces CookieYes (2026-10-03).
   Scope: analytics only. Ad consent stays with Google's own AdSense
   "Privacy & messaging" tool; nothing here touches ad_storage /
   ad_user_data / ad_personalization. See assets/js/cookie-consent.js
   and /areas/foodmiles.md. */

.fm-cookie-banner{
    position:fixed; left:0; right:0; bottom:0; z-index:9999;
    background:var(--card); border-top:2px solid var(--card-border);
    box-shadow:0 -10px 24px rgba(43,36,32,.14);
    display:flex; flex-wrap:wrap; gap:16px; align-items:center;
    justify-content:space-between;
    padding:18px 24px; font-family:'Nunito Sans',-apple-system,BlinkMacSystemFont,sans-serif;
}
.fm-cookie-text{ flex:1 1 320px; color:var(--ink); max-width:640px; }
.fm-cookie-text strong{ display:block; margin-bottom:4px; font-size:1.05rem; }
.fm-cookie-text p{ margin:0; color:var(--ink-soft); font-size:.92rem; line-height:1.4; }
.fm-cookie-text a{ color:var(--route); text-decoration:underline; }
.fm-cookie-actions{ display:flex; flex-wrap:wrap; gap:10px; }

.fm-cookie-btn{
    padding:11px 20px; border-radius:10px; font-weight:700; font-size:.92rem;
    cursor:pointer; white-space:nowrap; font-family:inherit;
}
.fm-cookie-btn-outline{
    background:var(--card); color:var(--ink); border:2px solid var(--card-border);
}
.fm-cookie-btn-outline:hover{ border-color:var(--route); }
.fm-cookie-btn-accept{ background:var(--route); color:#fff; border:none; }
.fm-cookie-btn-accept:hover{ background:var(--route-dark); }

.fm-cookie-panel{
    position:fixed; inset:0; z-index:10000; display:flex; align-items:center;
    justify-content:center; padding:20px; background:rgba(43,36,32,.45);
}
.fm-cookie-panel-card{
    position:relative; background:var(--card); border:2px solid var(--card-border);
    border-radius:16px; padding:28px; max-width:480px; width:100%;
    box-shadow:0 10px 24px rgba(43,36,32,.18);
    font-family:'Nunito Sans',-apple-system,BlinkMacSystemFont,sans-serif;
}
.fm-cookie-panel-card h3{ margin:0 0 16px; color:var(--ink); }
.fm-cookie-cat{ padding:14px 0; border-top:1px solid var(--line); }
.fm-cookie-cat:first-of-type{ border-top:none; }
.fm-cookie-cat-head{ display:flex; align-items:center; justify-content:space-between; font-weight:700; color:var(--ink); }
.fm-cookie-cat p{ margin:6px 0 0; color:var(--ink-soft); font-size:.88rem; line-height:1.4; }
.fm-cookie-always-on{ font-size:.78rem; font-weight:700; color:var(--ink-soft); background:var(--paper); padding:4px 10px; border-radius:999px; }

.fm-cookie-switch{ position:relative; display:inline-block; width:44px; height:26px; }
.fm-cookie-switch input{ opacity:0; width:0; height:0; }
.fm-cookie-slider{
    position:absolute; cursor:pointer; inset:0; background:var(--card-border);
    border-radius:999px; transition:.2s;
}
.fm-cookie-slider:before{
    position:absolute; content:""; height:20px; width:20px; left:3px; bottom:3px;
    background:#fff; border-radius:50%; transition:.2s; box-shadow:0 1px 3px rgba(43,36,32,.3);
}
.fm-cookie-switch input:checked + .fm-cookie-slider{ background:var(--route); }
.fm-cookie-switch input:checked + .fm-cookie-slider:before{ transform:translateX(18px); }

.fm-cookie-panel-actions{ display:flex; flex-wrap:wrap; gap:10px; margin-top:18px; }
.fm-cookie-panel-close{
    position:absolute; top:14px; right:14px; width:30px; height:30px; border:none;
    background:none; font-size:1.4rem; line-height:1; color:var(--ink-soft); cursor:pointer;
}
.fm-cookie-panel-close:hover{ color:var(--ink); }

.fm-cookie-reopen{
    position:fixed; left:20px; bottom:20px; z-index:9998;
    background:var(--card); border:2px solid var(--card-border); border-radius:999px;
    padding:10px 18px; font-weight:700; font-size:.85rem; color:var(--ink);
    box-shadow:0 6px 16px rgba(43,36,32,.18); cursor:pointer;
    font-family:'Nunito Sans',-apple-system,BlinkMacSystemFont,sans-serif;
}
.fm-cookie-reopen:hover{ border-color:var(--route); }

.fm-cookie-toast{
    position:fixed; left:50%; bottom:90px; transform:translateX(-50%); z-index:10001;
    background:var(--ink); color:#fff; padding:10px 20px; border-radius:999px;
    font-size:.88rem; font-weight:600; box-shadow:0 6px 16px rgba(43,36,32,.25);
    font-family:'Nunito Sans',-apple-system,BlinkMacSystemFont,sans-serif;
}

@media (max-width:640px){
    .fm-cookie-banner{ padding:16px; }
    .fm-cookie-actions{ width:100%; }
    .fm-cookie-btn{ flex:1 1 auto; text-align:center; }
}

/* The elements above set their own `display` (flex), which has the same
   specificity as the browser's built-in `[hidden]{display:none}` rule, so
   without this, toggling the `hidden` attribute does nothing visually and
   the "hidden" panel still sits full-screen over the page, intercepting
   clicks. !important guarantees hidden always wins regardless of rule
   order or future edits above. */
.fm-cookie-banner[hidden],
.fm-cookie-panel[hidden]{ display:none !important; }
