/* === BASE === */
:root{
    --bg:#070809;--card:#101214;--card2:#171a1d;--text:#eef1f3;--muted:#9aa1a8;
    --line:rgba(201,205,210,.22);--accent:#c9cdd2;--danger:#ef6b73;
}
*{box-sizing:border-box}
body{
    margin:0;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    background:
        radial-gradient(circle at 12% 0%, rgba(210,216,222,.10), transparent 26rem),
        radial-gradient(circle at 90% 15%, rgba(115,122,130,.08), transparent 24rem),
        #070809;
    color:var(--text);line-height:1.35;
}
body::before{
    content:"";position:fixed;inset:0;pointer-events:none;z-index:-1;opacity:.10;
    background:
        repeating-linear-gradient(97deg, rgba(255,255,255,.04) 0 1px, transparent 1px 26px),
        repeating-linear-gradient(3deg, rgba(255,255,255,.018) 0 1px, transparent 1px 34px);
    mix-blend-mode:soft-light;
}
.wrap{max-width:1180px;margin:0 auto;padding:18px}
a{color:var(--accent);text-decoration:none}

/* === TYPOGRAPHY === */
h1{
    margin:0;font-family:Georgia,"Times New Roman",serif;
    font-size:clamp(42px,8vw,82px);font-weight:500;letter-spacing:-.07em;
    color:#eef1f3;text-shadow:0 18px 60px rgba(0,0,0,.5);
}
h2{margin:0 0 10px;font-size:20px;font-weight:800;letter-spacing:-.03em}
.subtitle{color:var(--muted);margin-top:4px}
.kicker{
    color:var(--muted);font-size:10.5px;text-transform:uppercase;letter-spacing:.075em;
    margin-bottom:3px;display:flex;gap:4px;flex-wrap:wrap
}
.name{font-family:Georgia,"Times New Roman",serif;font-size:20px;font-weight:500;letter-spacing:-.035em;margin-bottom:6px}
.notes{color:#cfd4d8;white-space:pre-wrap;margin:6px 0;font-size:13px;line-height:1.35}

/* === LAYOUT === */
.top{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:16px;min-height:120px;padding:20px 0 8px}
.crumbs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.filters{display:grid;grid-template-columns:2fr 1fr 1fr 1fr 1fr auto;gap:10px}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.full{grid-column:1/-1}

/* === PANELS === */
.panel,.drink,.stat,.choice,.modal-card,.dropzone,.guest-home-card,.ai-rec-card{
    background:linear-gradient(145deg, rgba(20,22,25,.96), rgba(8,9,11,.98));
    border:1px solid var(--line);
    box-shadow:0 18px 60px rgba(0,0,0,.32),inset 0 1px 0 rgba(255,255,255,.045);
}
.panel{border-radius:28px;padding:16px;margin-bottom:14px}
.dropzone{border-style:dashed;border-radius:18px;padding:12px}

/* === BUTTONS / INPUTS === */
.btn,button,input,select,textarea{font:inherit;border-radius:13px}
.btn,button{
    border:1px solid var(--line);
    background:linear-gradient(145deg, rgba(35,38,42,.92), rgba(13,14,16,.96));
    color:var(--text);padding:9px 12px;cursor:pointer;
    display:inline-flex;gap:6px;align-items:center;justify-content:center;min-height:38px;
    transition:border-color .15s,box-shadow .15s;
}
.btn:hover,button:hover{border-color:rgba(238,241,243,.55);box-shadow:0 0 0 3px rgba(238,241,243,.08)}
.primary{background:linear-gradient(145deg, #e3e6e8, #aab0b7)!important;color:#08090b!important;border-color:#f1f3f4!important;font-weight:800}
.danger{border-color:#703139!important;color:#ffd1d5!important}
.small{padding:5px 8px!important;min-height:30px!important;font-size:12px!important}
input,select,textarea{width:100%;background:rgba(5,6,8,.74);border:1px solid var(--line);color:var(--text);padding:10px 12px;outline:none}
textarea{min-height:42px;resize:vertical}
input::placeholder,textarea::placeholder{color:#5a6068}
label{display:block;color:var(--muted);font-size:13px;margin-bottom:5px}
.checkrow{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.checkrow label{color:var(--text);display:inline-flex;align-items:center;gap:8px;margin:0}
.checkrow input{width:auto}

/* === STATS === */
.stats{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;margin-bottom:10px}
.stat{border-radius:14px;padding:8px 10px}
.stat b{display:block;font-size:17px;line-height:1.1}
.stat span{color:var(--muted);font-size:11px}

/* === ADMIN TABS === */
.admin-tabs{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:14px}
.admin-tab{font-size:16px;font-weight:900;padding:16px}
.admin-panel{display:none}
.admin-panel.open{display:block}
.admin-panel{scroll-margin-top:14px}
.export-links{display:flex;gap:8px;flex-wrap:wrap;margin:8px 0}

/* === DRINK CARDS === */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:12px}
.drink{border-left:8px solid var(--tone,#8b929a);border-radius:20px;padding:10px 12px;position:relative}
.drink.inactive{opacity:.55}
.drink.special{box-shadow:inset 0 0 0 1px rgba(238,241,243,.22)}
.drink-head{display:grid;grid-template-columns:minmax(0,1fr) 86px;gap:8px;align-items:start}
.drink-titleline{min-width:0}
.drink-actions-inline{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end;flex-direction:column;align-items:flex-end}
.drink-actions-inline .compact-info-btn{width:100%}
.compact-info-btn{
    background:rgba(238,241,243,.075)!important;border-color:rgba(238,241,243,.23)!important;
    color:#eef1f3!important;min-height:28px!important;padding:4px 8px!important;
    font-size:12px!important;border-radius:999px!important;
}
.admin-actions{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.inline-form{display:inline}
.note-form{display:grid;grid-template-columns:1fr auto;gap:6px;margin-top:8px}

/* === BADGES === */
.badges{display:flex;flex-wrap:wrap;gap:4px;margin-top:5px}
.badge{
    font-size:11px;padding:3px 7px;border:1px solid var(--line);border-radius:999px;
    color:var(--muted);background:rgba(255,255,255,.025);white-space:normal;line-height:1.25
}
.badge.chilled{color:#e9edf0!important;border-color:rgba(201,205,210,.42)!important}
.badge.special{color:#ffe7b5;border-color:rgba(233,184,95,.45)}
.badge.low{color:#ffe1a3;border-color:rgba(233,184,95,.45)}
.badge.inactive,.badge.missing{color:#ffc7cc;border-color:rgba(239,107,115,.7)}
.badge.available{color:#b5f5d0;border-color:rgba(100,220,140,.55)}
.badge.nearly{color:#ffe7b5;border-color:rgba(233,184,95,.65)}

/* === TONE COLORS === */
.tone-redwine{--tone:#6d555a}.tone-whitewine{--tone:#c7c1ac}.tone-rose{--tone:#a98d92}
.tone-sparkling{--tone:#d0d0c6}.tone-dessert{--tone:#89715e}.tone-beer{--tone:#a48962}
.tone-cider{--tone:#9da28b}.tone-whisky{--tone:#9f8261}.tone-gin{--tone:#8fa0a1}
.tone-rum{--tone:#887061}.tone-vodka{--tone:#c9cdd2}.tone-tequila{--tone:#aaa78e}
.tone-brandy{--tone:#91715e}.tone-bitter{--tone:#6f5e5b}.tone-liqueur{--tone:#878090}
.tone-rice{--tone:#b9b9b9}.tone-mixer{--tone:#8d9298}.tone-cocktail{--tone:#b67846}
.tone-default{--tone:#8b929a}

/* === CHOICE GRID === */
.choice-title{font-family:Georgia,"Times New Roman",serif;font-weight:500;letter-spacing:-.045em;margin:0 0 10px}
.choice-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px}
.choice{
    padding:16px;border-radius:22px;color:var(--text);display:flex;flex-direction:column;
    justify-content:space-between;min-height:96px;
    transition:transform .16s ease,border-color .16s ease;
}
.choice:hover{transform:translateY(-2px)}
.choice strong{font-family:Georgia,"Times New Roman",serif;font-weight:500;font-size:22px;letter-spacing:-.04em;display:block}
.choice span{color:var(--muted);font-size:13px}
.aux-choice{background:transparent!important;border:none!important;box-shadow:none!important;padding:4px 0!important}
.aux-choice strong{font-size:14px!important;color:var(--muted)!important}

/* === GUEST HOME === */
.guest-home{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:18px 0}
.guest-home-card{
    min-height:180px;padding:24px;border-radius:24px;color:var(--text);
    display:flex;flex-direction:column;justify-content:space-between;
    position:relative;overflow:hidden;
    transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
}
.guest-home-card::after{
    content:"";position:absolute;right:-45px;top:-60px;width:150px;height:150px;
    background:radial-gradient(circle, rgba(196,138,58,.22), transparent 64%);
}
.guest-home-card:hover{transform:translateY(-3px);border-color:rgba(196,138,58,.75)!important;box-shadow:0 28px 90px rgba(0,0,0,.42)}
.guest-home-card strong{font-family:Georgia,"Times New Roman",serif;font-size:clamp(26px,3vw,36px);font-weight:500;letter-spacing:-.055em;display:block}
.guest-home-card span{font-size:14px;color:var(--muted);margin-top:8px;display:block;max-width:28ch}
.guest-section{display:none}
.guest-section.open{display:block}
.guest-section-title{display:flex;justify-content:space-between;gap:10px;align-items:flex-start;flex-wrap:wrap;margin-bottom:10px}

/* === COCKTAIL CARDS === */
.cocktail-card{border-radius:20px!important;padding:14px 16px!important}
.cocktail-card .drink-head{grid-template-columns:minmax(0,1fr) 118px!important;gap:12px!important}
.cocktail-card .drink-actions-inline{flex-direction:column!important;gap:6px!important;align-items:stretch!important}
.cocktail-card .drink-actions-inline .badge,
.cocktail-card .drink-actions-inline .compact-info-btn{
    width:100%!important;min-height:34px!important;text-align:center!important;
    justify-content:center!important;display:inline-flex!important;align-items:center!important;
}

/* === KOKTÉL KÁRTYA BELSŐ ELEMEK === */
.cocktail-ingredients{
    font-size:13px;color:var(--muted);margin:4px 0 2px;line-height:1.35;
}
.cocktail-desc{
    font-size:13px;color:#b0bac6;margin:3px 0;line-height:1.35;
    display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.cocktail-tags{display:flex;flex-wrap:wrap;gap:4px;margin-top:6px}
.ctag{
    font-size:11px;padding:2px 8px;border-radius:999px;
    background:rgba(182,120,70,.13);border:1px solid rgba(182,120,70,.32);
    color:#e8c99a;white-space:nowrap;
}
:root[data-theme="light"] .cocktail-ingredients{color:#5f6872}
:root[data-theme="light"] .cocktail-desc{color:#343a40}
:root[data-theme="light"] .ctag{background:rgba(120,80,30,.10);border-color:rgba(120,80,30,.28);color:#7a4e18}

/* === #9 KOKTÉL SZEKCIÓK === */
.cocktail-section-header{
    display:flex;align-items:center;justify-content:space-between;gap:10px;
    padding:10px 0 6px;margin-top:10px;border-top:1px solid var(--line);flex-wrap:wrap;
}
.cocktail-section-header:first-of-type{border-top:none;margin-top:0;padding-top:0}
.cocktail-section-title{font-size:15px;font-weight:800;letter-spacing:-.02em}
.cocktail-section-title.available{color:#b5f5d0}
.cocktail-section-title.nearly{color:#ffd97a}
.cocktail-section-title.unavailable{color:var(--muted)}

/* === AI PICKER === */
.cocktail-hero{border-left:8px solid #b67846}
.cocktail-hero-title{font-family:Georgia,"Times New Roman",serif;font-size:28px;font-weight:500;letter-spacing:-.04em;margin:0 0 8px}
.ai-picker-result{margin-top:12px;display:grid;gap:8px}
.ai-rec-card{border-radius:16px;padding:10px}
.ai-rec-card strong{display:block;font-size:16px;margin-bottom:3px}
.ai-rec-card p{margin:6px 0;color:#d8cec0}

/* === MODAL BELSŐ FORMÁZÁS === */
.modal-cocktail-name{font-family:Georgia,serif;font-size:22px;font-weight:500;letter-spacing:-.03em;margin-bottom:4px}
.modal-meta{font-size:13px;color:var(--muted);margin-bottom:10px}
.modal-section-head{
    font-size:11px;text-transform:uppercase;letter-spacing:.10em;
    color:var(--muted);margin:14px 0 6px;padding-top:10px;
    border-top:1px solid var(--line);
}
.modal-section-head:first-of-type{border-top:none;margin-top:4px;padding-top:0}
.modal-match{display:flex;gap:8px;align-items:baseline;padding:3px 0;font-size:14px;line-height:1.4}
.modal-ok{color:#6ee89a;font-weight:700;flex-shrink:0}
.modal-miss{color:#ef6b73;font-weight:700;flex-shrink:0}
.modal-bullet{font-size:14px;padding:2px 0 2px 4px;line-height:1.4}
.modal-step{font-size:14px;padding:3px 0;color:#d8e0ea;line-height:1.4}
.modal-line{font-size:14px;line-height:1.5;padding:1px 0}
.modal-spacer{height:6px}
:root[data-theme="light"] .modal-ok{color:#1a7a44}
:root[data-theme="light"] .modal-miss{color:#a33b3b}
:root[data-theme="light"] .modal-step{color:#343a40}

/* === MODAL === */
.modal{position:fixed;inset:0;background:rgba(0,0,0,.72);display:none;align-items:center;justify-content:center;padding:16px;z-index:1000}
.modal.open{display:flex}
.modal-card{max-width:720px;width:100%;max-height:85vh;overflow:auto;border-radius:22px;padding:18px;box-shadow:0 30px 90px rgba(0,0,0,.5)}
.info-text{white-space:pre-wrap;color:#edf1f7;font-size:15px;line-height:1.55}

/* === LOADING === */
.loading-overlay{position:fixed;inset:0;background:rgba(0,0,0,.58);display:none;align-items:center;justify-content:center;z-index:3000;padding:20px}
.loading-overlay.open{display:flex}
.loading-card{width:min(420px,100%);border-radius:22px;padding:18px;box-shadow:0 24px 80px rgba(0,0,0,.45)}
.spinner{width:32px;height:32px;border-radius:50%;border:4px solid rgba(201,205,210,.2);border-top-color:var(--accent);animation:spin 1s linear infinite;margin-bottom:12px}
@keyframes spin{to{transform:rotate(360deg)}}
.progress{height:8px;background:rgba(255,255,255,.09);border:1px solid var(--line);border-radius:999px;overflow:hidden;margin-top:10px}
.progress div{height:100%;width:42%;background:var(--accent);animation:progressMove 1.2s ease-in-out infinite alternate}
@keyframes progressMove{from{transform:translateX(-55%)}to{transform:translateX(160%)}}

/* === MISC === */
.empty{color:var(--muted);padding:28px;text-align:center}
.login{max-width:420px;margin:12vh auto}
.footer{color:var(--muted);font-size:13px;margin:22px 0 4px;text-align:center;opacity:.55}
.candidate{display:flex;justify-content:space-between;gap:8px;align-items:center;border:1px solid var(--line);border-radius:14px;padding:8px;margin:8px 0}
.guest-admin{position:fixed;right:10px;bottom:10px;opacity:.35;font-size:11px;padding:5px 7px;min-height:auto;border-radius:999px;z-index:50}
.guest-admin:hover{opacity:1}
.theme-toggle{position:fixed;left:10px;bottom:10px;z-index:60;opacity:.72;border-color:rgba(196,138,58,.25)!important}
.category-box-lite{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}
.category-box-lite a{border:1px solid var(--line);border-radius:999px;padding:7px 10px;background:rgba(255,255,255,.035);color:var(--text);font-size:13px}

/* === LIGHT THEME === */
:root[data-theme="light"]{
    --bg:#f5f6f7;--card:#ffffff;--card2:#eef0f2;--text:#111315;--muted:#5f6872;
    --line:rgba(40,45,50,.22);--accent:#34383d;--danger:#a33b3b;
}
:root[data-theme="light"] body{background:radial-gradient(circle at 12% 0%, rgba(40,45,50,.10), transparent 26rem),#f5f6f7;color:#111315}
:root[data-theme="light"] body::before{opacity:.04}
:root[data-theme="light"] .panel,:root[data-theme="light"] .drink,:root[data-theme="light"] .stat,
:root[data-theme="light"] .choice,:root[data-theme="light"] .modal-card,:root[data-theme="light"] .dropzone,
:root[data-theme="light"] .guest-home-card,:root[data-theme="light"] .ai-rec-card{background:linear-gradient(145deg, #ffffff, #eef0f2)!important;color:#111315!important;border-color:rgba(40,45,50,.20)!important}
:root[data-theme="light"] .btn,:root[data-theme="light"] button{background:linear-gradient(145deg, #ffffff, #dfe3e7)!important;color:#111315!important;border-color:rgba(40,45,50,.24)!important}
:root[data-theme="light"] .primary{background:linear-gradient(145deg, #2f343a, #111315)!important;color:#ffffff!important;border-color:#2f343a!important}
:root[data-theme="light"] input,:root[data-theme="light"] select,:root[data-theme="light"] textarea{background:#ffffff!important;color:#111315!important;border-color:rgba(40,45,50,.24)!important}
:root[data-theme="light"] .subtitle,:root[data-theme="light"] .muted,:root[data-theme="light"] .kicker,:root[data-theme="light"] .footer{color:#5f6872!important}
:root[data-theme="light"] .compact-info-btn{background:#eef0f2!important;color:#111315!important;border-color:rgba(40,45,50,.22)!important}
:root[data-theme="light"] .cocktail-section-title.available{color:#1a7a44}
:root[data-theme="light"] .cocktail-section-title.nearly{color:#8a6200}
:root[data-theme="light"] .notes{color:#343a40!important}
:root[data-theme="light"] h1{color:#111315;text-shadow:none}

/* === OVERFLOW PROTECTION === */
.wrap,.panel,.grid,.drink,.choice,.stat,.filters,.form-grid,.admin-actions,.badges,.kicker,.note-form{min-width:0;max-width:100%}
.drink,.choice,.stat,.panel{overflow:hidden}
.name,.notes,.kicker,.badge,.btn,button,.choice strong,.choice span,input,select,textarea,label{overflow-wrap:anywhere;word-break:break-word;hyphens:auto;min-width:0;max-width:100%}
.badge{white-space:normal;line-height:1.25}

/* === RESPONSIVE === */
@media(max-width:900px){
    .top{flex-direction:column;min-height:auto;align-items:flex-start}
    .filters{grid-template-columns:1fr}
    .stats{grid-template-columns:1fr 1fr 1fr}
    .form-grid{grid-template-columns:1fr}
    .wrap{padding:12px}
    .note-form{grid-template-columns:1fr}
    .choice-grid{grid-template-columns:1fr 1fr}
    .admin-tabs{grid-template-columns:1fr 1fr}
    .guest-home{grid-template-columns:1fr}
    .guest-home-card{min-height:120px}
}
@media(max-width:520px){
    .choice-grid{grid-template-columns:1fr}
    .stats{grid-template-columns:1fr 1fr}
    .grid{grid-template-columns:1fr}
    .admin-actions{display:grid;grid-template-columns:1fr 1fr}
    .admin-actions .inline-form,.admin-actions a{width:100%}
    .admin-actions button,.admin-actions select{width:100%}
    .drink{padding:10px}
    .name{font-size:17px}
    .drink-head{grid-template-columns:minmax(0,1fr) 90px}
    .cocktail-card .drink-head{grid-template-columns:minmax(0,1fr) 104px!important}
    .admin-tabs{grid-template-columns:1fr}
}