/* Botellero — inventory page styles */

.inv-hero{padding:48px 0 32px}
.inv-hero p{max-width:520px;color:var(--muted);margin-top:14px;font-size:.95rem}

.preset-section{margin-bottom:24px}
.preset-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px;flex-wrap:wrap}
.preset-head-left{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.preset-actions{display:flex;gap:8px;flex-wrap:wrap}
.preset-hint{font-size:.72rem;color:var(--muted);font-weight:600}
.preset-bar{display:flex;flex-wrap:wrap;gap:10px}
.preset-card{
  display:flex;flex-direction:column;align-items:flex-start;gap:2px;text-align:left;
  padding:12px 16px;background:var(--card);border:1.5px solid var(--line);border-radius:14px;
  cursor:pointer;font-family:inherit;transition:transform .2s,border-color .2s,box-shadow .2s;min-width:140px
}
.preset-card:hover{transform:translateY(-2px);border-color:var(--accent);box-shadow:0 8px 24px var(--accent-wash)}
.preset-card.active{border-color:var(--accent);background:var(--accent-wash)}
.preset-emoji{font-size:1.2rem;line-height:1;margin-bottom:4px}
.preset-name{font-size:.82rem;font-weight:700;color:var(--ink)}
.preset-desc{font-size:.68rem;color:var(--muted);font-weight:600}
.preset-count{font-size:.62rem;font-weight:700;color:var(--accent);margin-top:4px;text-transform:uppercase;letter-spacing:.06em}

/* Event mode */
.event-mode{
  margin-bottom:24px;padding:18px 20px;background:var(--card);
  border:1px solid var(--line);border-radius:16px
}
.event-mode-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:14px;flex-wrap:wrap}
.event-mode-head h3{font-family:'Shippori Mincho',serif;font-size:.95rem;font-weight:700}
.event-slider{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.event-slider input[type=range]{flex:1;min-width:160px;accent-color:var(--accent)}
.event-guest-val{font-family:'Shippori Mincho',serif;font-size:1.4rem;font-weight:700;min-width:48px;text-align:right}
.event-guest-label{font-size:.72rem;color:var(--muted);font-weight:600}
.event-suggestion{
  margin-top:14px;padding:12px 14px;background:var(--accent-wash);border-radius:12px;
  font-size:.85rem;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap
}
.event-suggestion p{margin:0;color:var(--ink);flex:1;min-width:200px}
.event-suggestion strong{color:var(--accent)}

/* Compare modal */
#compare-backdrop{
  position:fixed;inset:0;background:rgba(28,24,20,.45);z-index:110;
  opacity:0;pointer-events:none;transition:opacity .3s
}
#compare-backdrop.open{opacity:1;pointer-events:auto}
#compare-modal{
  position:fixed;top:50%;left:50%;transform:translate(-50%,-48%) scale(.96);
  width:min(720px,calc(100vw - 32px));max-height:min(85vh,640px);overflow-y:auto;
  background:var(--card);border-radius:20px;z-index:120;padding:28px 24px 24px;
  opacity:0;pointer-events:none;transition:opacity .3s,transform .35s cubic-bezier(.4,0,.2,1);
  box-shadow:0 24px 64px rgba(28,24,20,.18)
}
#compare-modal.open{opacity:1;pointer-events:auto;transform:translate(-50%,-50%) scale(1)}
.compare-close{
  position:absolute;top:16px;right:16px;width:32px;height:32px;border-radius:50%;
  border:1.5px solid var(--line);background:var(--paper);font-size:1.2rem;line-height:1;cursor:pointer
}
.compare-title{font-family:'Shippori Mincho',serif;font-size:1.25rem;font-weight:700;margin-bottom:6px;padding-right:36px}
.compare-sub{font-size:.82rem;color:var(--muted);margin-bottom:20px}
.compare-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px}
.compare-card{
  padding:14px;background:var(--paper);border:1.5px solid var(--line);border-radius:14px;
  cursor:pointer;transition:border-color .2s,transform .2s;text-align:left;font-family:inherit
}
.compare-card:hover{border-color:var(--accent);transform:translateY(-2px)}
.compare-card-head{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.compare-card-emoji{font-size:1.1rem}
.compare-card-name{font-size:.82rem;font-weight:700}
.compare-stat{font-size:.72rem;color:var(--muted);font-weight:600;margin-bottom:8px}
.compare-cocktails{display:flex;flex-wrap:wrap;gap:4px}
.compare-cocktail{font-size:.62rem;font-weight:700;padding:3px 8px;border-radius:100px;background:var(--accent-wash);color:var(--accent)}

/* Toast */
#toast{
  position:fixed;bottom:88px;left:50%;transform:translateX(-50%) translateY(12px);
  background:var(--ink);color:var(--paper);padding:10px 18px;border-radius:100px;
  font-size:.78rem;font-weight:700;z-index:200;opacity:0;pointer-events:none;
  transition:opacity .3s,transform .3s;white-space:nowrap
}
#toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

.drawer-meta{font-size:.82rem;color:var(--muted);margin-bottom:10px;line-height:1.5}
.drawer-meta strong{color:var(--ink);font-weight:700}

.toolbar{
  display:flex;flex-wrap:wrap;gap:12px;align-items:center;
  margin-bottom:16px;padding:16px 18px;background:var(--card);
  border:1px solid var(--line);border-radius:16px
}
.toolbar-row{display:flex;flex-wrap:wrap;gap:8px;align-items:center;width:100%}
.toolbar-row:last-child{margin-top:4px;padding-top:12px;border-top:1px solid var(--line)}
.search-wrap{flex:1;min-width:200px;position:relative}
.search-wrap input{
  width:100%;padding:11px 14px 11px 38px;border:1.5px solid var(--line);
  border-radius:100px;font-family:inherit;font-size:.88rem;background:var(--paper)
}
.search-wrap input:focus{outline:none;border-color:var(--accent)}
.search-wrap::before{
  content:'⌕';position:absolute;left:14px;top:50%;transform:translateY(-50%);
  color:var(--muted);font-size:1rem
}
.result-count{font-size:.78rem;color:var(--muted);font-weight:600;white-space:nowrap}
.toolbar-label{font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);margin-right:4px}
.sort-select{
  font-family:inherit;font-size:.78rem;font-weight:600;padding:8px 12px;
  border:1.5px solid var(--line);border-radius:100px;background:var(--paper);cursor:pointer
}
.view-toggle{display:flex;gap:4px}
.view-btn{
  font-family:inherit;font-size:.78rem;font-weight:600;padding:8px 14px;
  border:1.5px solid var(--line);border-radius:100px;background:var(--paper);cursor:pointer;transition:all .2s
}
.view-btn.on{background:var(--ink);color:var(--paper);border-color:var(--ink)}

#filter-bar{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:20px}

/* Cocktail unlock panel */
#cocktail-panel{
  display:none;margin-bottom:28px;padding:18px 20px;background:var(--card);
  border:1px solid var(--line);border-radius:16px
}
#cocktail-panel.visible{display:block}
.cocktail-panel-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:14px;flex-wrap:wrap}
.cocktail-panel-head h3{font-family:'Shippori Mincho',serif;font-size:1rem;font-weight:700}
.cocktail-panel-head span{font-size:.75rem;color:var(--muted);font-weight:600}
.cocktail-unlocks{display:flex;flex-wrap:wrap;gap:8px}
.cocktail-pill{
  font-size:.75rem;font-weight:700;padding:7px 14px;border-radius:100px;
  border:1.5px solid var(--line);background:var(--paper);transition:all .2s
}
.cocktail-pill.unlocked{background:var(--accent-wash);border-color:rgba(196,92,62,.35);color:var(--accent)}
.cocktail-pill.almost{opacity:.55;border-style:dashed}
.cocktail-pill .pill-meta{font-weight:500;opacity:.7;margin-left:4px}

/* Grid view */
.bottle-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:16px
}
.bottle-grid.shelf-mode{display:none}

.bottle-card{
  background:var(--card);border:1.5px solid var(--line);border-radius:16px;
  padding:0 0 14px;cursor:pointer;transition:transform .2s,box-shadow .2s,border-color .2s;
  display:flex;flex-direction:column;align-items:center;text-align:center
}
.bottle-card:hover{transform:translateY(-3px);box-shadow:0 12px 32px rgba(28,24,20,.08);border-color:rgba(28,24,20,.18)}
.bottle-card.selected{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent-wash)}

.card-top{height:4px;width:100%;border-radius:16px 16px 0 0;background:var(--cat-color)}

.bottle-icon{
  --bottle-color:var(--muted);width:48px;height:88px;margin:18px 0 10px;
  display:flex;flex-direction:column;align-items:center
}
.bottle-neck{
  width:14px;height:22px;background:var(--bottle-color);border-radius:4px 4px 0 0;opacity:.85
}
.bottle-body{
  width:38px;flex:1;background:linear-gradient(135deg,var(--bottle-color),color-mix(in srgb,var(--bottle-color) 70%,#fff));
  border-radius:4px 4px 8px 8px;position:relative;box-shadow:inset -4px 0 12px rgba(0,0,0,.12)
}
.bottle-label{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:22px;height:14px;background:rgba(255,255,255,.35);border-radius:2px
}

.card-meta{padding:0 14px;flex:1}
.card-cat{font-size:.65rem;font-weight:700;text-transform:uppercase;letter-spacing:.12em;color:var(--muted)}
.card-name{font-family:'Shippori Mincho',serif;font-size:.95rem;font-weight:700;margin:4px 0;line-height:1.2}
.card-brand{font-size:.72rem;color:var(--muted)}

.card-actions{display:flex;gap:8px;margin-top:12px;padding:0 14px;width:100%}
.card-detail,.card-toggle{
  font-family:inherit;font-size:.72rem;font-weight:700;cursor:pointer;border-radius:100px;
  border:1.5px solid var(--line);background:var(--paper);padding:6px 12px;transition:all .2s
}
.card-detail{flex:1}
.card-detail:hover{border-color:var(--ink)}
.card-toggle{width:36px;padding:6px;font-size:1rem;line-height:1}
.card-toggle.on,.card-toggle:hover{background:var(--ink);color:var(--paper);border-color:var(--ink)}

.empty-state{grid-column:1/-1;text-align:center;padding:48px 24px;color:var(--muted)}
.empty-title{font-family:'Shippori Mincho',serif;font-size:1.2rem;color:var(--ink);margin-bottom:8px}

/* Shelf view */
.shelf-view{display:none;flex-direction:column;gap:28px}
.shelf-view.active{display:flex}
.shelf-row{}
.shelf-row-head{
  display:flex;align-items:center;gap:10px;margin-bottom:14px;padding-bottom:8px;
  border-bottom:2px solid var(--line)
}
.shelf-row-dot{width:10px;height:10px;border-radius:50%;background:var(--row-color)}
.shelf-row-head h3{font-family:'Shippori Mincho',serif;font-size:.95rem;font-weight:700}
.shelf-row-head span{font-size:.72rem;color:var(--muted);font-weight:600}
.shelf-rack{
  display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end;
  padding:16px 12px 12px;background:linear-gradient(180deg,var(--paper-d) 0%,var(--card) 100%);
  border:1px solid var(--line);border-radius:12px;position:relative
}
.shelf-rack::after{
  content:'';position:absolute;bottom:0;left:0;right:0;height:6px;
  background:var(--ink);border-radius:0 0 10px 10px;opacity:.12
}
.shelf-bottle{
  display:flex;flex-direction:column;align-items:center;gap:6px;cursor:pointer;
  padding:8px 6px 4px;border-radius:10px;transition:background .2s,transform .2s;min-width:72px
}
.shelf-bottle:hover{background:rgba(28,24,20,.04);transform:translateY(-4px)}
.shelf-bottle.selected .bottle-body{box-shadow:0 0 0 2px var(--accent),inset -4px 0 12px rgba(0,0,0,.12)}
.shelf-bottle .bottle-icon{width:36px;height:72px;margin:0}
.shelf-bottle .bottle-neck{width:11px;height:18px}
.shelf-bottle .bottle-body{width:30px}
.shelf-bottle-name{
  font-size:.62rem;font-weight:700;text-align:center;line-height:1.2;max-width:72px;
  color:var(--ink)
}
.shelf-add{
  width:28px;height:28px;border-radius:50%;border:1.5px solid var(--line);
  background:var(--paper);font-size:.9rem;line-height:1;cursor:pointer;font-family:inherit;
  transition:all .2s
}
.shelf-add.on{background:var(--accent);color:var(--paper);border-color:var(--accent)}

/* Drawer */
#drawer-backdrop{
  position:fixed;inset:0;background:rgba(28,24,20,.4);z-index:90;
  opacity:0;pointer-events:none;transition:opacity .3s
}
#drawer-backdrop.open{opacity:1;pointer-events:auto}

#drawer{
  position:fixed;top:0;right:0;width:min(420px,100vw);height:100vh;
  background:var(--card);z-index:100;transform:translateX(100%);
  transition:transform .35s cubic-bezier(.4,0,.2,1);overflow-y:auto;
  box-shadow:-8px 0 40px rgba(28,24,20,.12)
}
#drawer.open{transform:translateX(0)}

.drawer-close{
  position:absolute;top:16px;right:16px;width:36px;height:36px;border-radius:50%;
  border:1.5px solid var(--line);background:var(--paper);font-size:1.4rem;line-height:1;
  cursor:pointer;z-index:2;transition:background .2s
}
.drawer-close:hover{background:var(--paper-d)}

.drawer-hero{
  padding:48px 32px 32px;text-align:center;
  background:linear-gradient(180deg,color-mix(in srgb,var(--cat-color) 18%,var(--card)),var(--card))
}
.drawer-hero .bottle-icon{width:64px;height:120px;margin:0 auto}

.drawer-body{padding:24px 28px 40px}
.drawer-title{font-family:'Shippori Mincho',serif;font-size:1.5rem;font-weight:700;line-height:1.2}
.drawer-sub{font-size:.82rem;color:var(--muted);margin:6px 0 16px}
.drawer-notes{font-size:.9rem;margin-bottom:16px}
.drawer-tags{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:24px}
.tag{
  font-size:.7rem;font-weight:600;padding:5px 10px;border-radius:100px;
  background:var(--paper);border:1px solid var(--line);color:var(--muted)
}
.drawer-section h4{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);margin-bottom:10px}
.cocktail-list{list-style:none;display:flex;flex-wrap:wrap;gap:8px}
.cocktail-list li{
  font-size:.78rem;font-weight:600;padding:6px 12px;border-radius:100px;
  background:var(--accent-wash);color:var(--accent)
}
.drawer-add{width:100%;margin-top:24px}
.drawer-add.on{background:var(--ink)}

/* Selection bar */
#selection-bar{
  position:fixed;bottom:0;left:0;right:0;z-index:80;
  background:var(--ink);color:var(--paper);padding:14px 24px;
  transform:translateY(100%);transition:transform .35s cubic-bezier(.4,0,.2,1);
  box-shadow:0 -8px 32px rgba(28,24,20,.2)
}
#selection-bar.visible{transform:translateY(0)}
.sel-inner{max-width:1080px;margin:0 auto;display:flex;flex-wrap:wrap;align-items:center;gap:12px 16px}
.sel-label{font-size:.78rem;font-weight:700;white-space:nowrap}
#selection-list{display:flex;flex-wrap:wrap;gap:6px;flex:1;min-width:0}
.sel-chip{
  display:inline-flex;align-items:center;gap:4px;font-size:.72rem;font-weight:600;
  padding:4px 8px 4px 10px;border-radius:100px;background:rgba(255,255,255,.12)
}
.sel-chip button{
  background:none;border:none;color:var(--paper);cursor:pointer;font-size:1rem;line-height:1;opacity:.7;padding:0 2px
}
.sel-chip button:hover{opacity:1}
.sel-actions{display:flex;gap:8px;flex-shrink:0}
.sel-actions .btn-ghost{background:transparent;border-color:rgba(255,255,255,.25);color:var(--paper)}
.sel-actions .btn-ghost:hover{border-color:var(--paper)}
.sel-actions .btn-primary{flex-shrink:0}

@media(max-width:640px){
  .toolbar{flex-direction:column;align-items:stretch}
  .bottle-grid{grid-template-columns:repeat(2,1fr);gap:10px}
  .sel-inner{flex-direction:column;align-items:stretch}
  .sel-actions{width:100%}
  .sel-actions .btn{flex:1}
  .shelf-rack{gap:8px}
  .shelf-bottle{min-width:60px}
}