/* ═══════════════════════════════════════════════════
   IR RESTAURANT — STYLES
   ir-restaurant/css/style.css
   ═══════════════════════════════════════════════════ */

:root {
  --cream: #FAF8F4;
  --warm-white: #FFFFFF;
  --burgundy: #7A1E2E;
  --burgundy-light: #9B2D41;
  --gold: #B8963E;
  --gold-light: #D4B06A;
  --dark: #1C1410;
  --mid: #4A3F38;
  --gray: #8A7D74;
  --border: #E8E0D4;
  --card-bg: #FFFFFF;
  --header-h: 56px;
  --cat-h: 46px;
  --tab-h: 60px;
  --waiter-h: 56px;
  --shadow-sm: 0 1px 6px rgba(28,20,16,0.08);
  --shadow-md: 0 4px 20px rgba(28,20,16,0.12);
  --shadow-lg: 0 8px 40px rgba(28,20,16,0.18);
  --radius: 14px;
  --radius-sm: 8px;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
html,body{height:100%;overflow:hidden}
body{font-family:'Jost',sans-serif;background:var(--cream);color:var(--dark);font-size:15px;line-height:1.5}

/* HEADER */
.header{
  position:fixed;top:0;left:0;right:0;z-index:100;
  height:var(--header-h);background:var(--warm-white);
  border-bottom:1px solid var(--border);
  display:flex;align-items:center;justify-content:space-between;
  padding:0 14px;gap:8px;
  box-shadow:var(--shadow-sm);
}
.header-lang-btn{
  display:flex;align-items:center;gap:5px;
  background:none;border:1px solid var(--border);border-radius:20px;
  padding:4px 10px;cursor:pointer;font-size:13px;color:var(--mid);
  font-family:'Jost',sans-serif;white-space:nowrap;min-width:0;
}
.header-lang-btn .flag{font-size:16px}
.header-table{
  flex:1;text-align:center;font-family:'Playfair Display',serif;
  font-size:13px;color:var(--gray);letter-spacing:0.02em;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.header-table span{color:var(--burgundy);font-weight:600}
.header-burger{
  background:none;border:none;cursor:pointer;padding:6px;
  display:flex;flex-direction:column;gap:4px;align-items:flex-end;
}
.burger-line{display:block;height:2px;background:var(--dark);border-radius:2px;transition:all .25s}
.burger-line:nth-child(1){width:22px}
.burger-line:nth-child(2){width:16px}
.burger-line:nth-child(3){width:22px}

/* CATEGORY NAV */
.cat-nav{
  position:fixed;top:var(--header-h);left:0;right:0;z-index:99;
  height:var(--cat-h);background:var(--warm-white);
  border-bottom:1px solid var(--border);
  overflow-x:auto;overflow-y:hidden;
  display:flex;align-items:center;gap:6px;padding:0 12px;
  scrollbar-width:none;-webkit-overflow-scrolling:touch;
}
.cat-nav::-webkit-scrollbar{display:none}
.cat-btn{
  flex-shrink:0;border:1px solid var(--border);border-radius:20px;
  background:none;padding:5px 14px;font-size:12.5px;font-weight:500;
  color:var(--mid);cursor:pointer;white-space:nowrap;
  font-family:'Jost',sans-serif;transition:all .2s;
}
.cat-btn.active{background:var(--burgundy);border-color:var(--burgundy);color:#fff}

/* MAIN CONTENT */
.main{
  position:fixed;
  top:calc(var(--header-h) + var(--cat-h));
  left:0;right:0;
  bottom:var(--tab-h);
  overflow-y:auto;overflow-x:hidden;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
}
.main::-webkit-scrollbar{display:none}
.main-inner{padding:16px 14px 16px;min-height:100%}
.main-inner.has-waiter{padding-bottom:calc(16px + var(--waiter-h) + 12px)}

/* SECTION */
.section{margin-bottom:28px}
.section-title{
  font-family:'Playfair Display',serif;font-size:22px;font-weight:700;
  color:var(--dark);margin-bottom:4px;
  display:flex;align-items:center;gap:10px;
  justify-content:center;
}
.section-title::before{content:'';flex:1;height:1px;background:var(--border);}
.section-title::after{content:'';flex:1;height:1px;background:var(--border);}
.section-sub{font-size:12px;color:var(--gray);margin-bottom:14px;letter-spacing:0.03em}

/* GRID */
.dish-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.dish-grid.wide{grid-template-columns:1fr}

/* DISH CARD */
.dish-card{
  background:var(--card-bg);border-radius:var(--radius);
  overflow:hidden;cursor:pointer;
  box-shadow:var(--shadow-sm);transition:transform .18s,box-shadow .18s;
  border:1px solid var(--border);
}
.dish-card:active{transform:scale(0.97);box-shadow:var(--shadow-sm)}
.dish-card-img{
  width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;
  display:block;background:#F0EBE3;
}
.dish-card-img.loaded{opacity:1}
.dish-card-body{padding:8px 10px 10px}
.dish-card-name{
  font-family:'Playfair Display',serif;font-size:13.5px;
  font-weight:600;line-height:1.3;color:var(--dark);margin-bottom:4px;
}
.dish-card-price{font-size:13px;font-weight:600;color:var(--burgundy);}
.dish-card-price .currency{font-size:11px;font-weight:400;color:var(--gray);margin-left:1px}
.dish-card-meta{display:flex;align-items:center;justify-content:space-between;margin-top:5px;}
.dish-card-weight{
  font-size:11px;color:var(--gray);background:var(--cream);
  border-radius:10px;padding:2px 7px;border:1px solid var(--border);
  letter-spacing:0.01em;
}

/* DRINK CARD */
.drink-card{
  background:var(--card-bg);border-radius:var(--radius-sm);
  overflow:hidden;
  box-shadow:var(--shadow-sm);
  border:1px solid var(--border);
  display:flex;align-items:stretch;gap:0;margin-bottom:8px;
  min-height:90px;
}
.drink-card-img-wrap{
  width:90px;flex-shrink:0;position:relative;align-self:stretch;
  background:#F0EBE3;
}
.drink-card-img{
  position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;display:block;
}
.drink-card-body{
  padding:10px 12px;flex:1;min-width:0;
  display:flex;flex-direction:column;justify-content:space-between;
}
.drink-card-name{
  font-family:'Playfair Display',serif;font-size:16px;
  font-weight:700;color:var(--dark);line-height:1.3;
}
.drink-card-desc{
  font-size:12px;color:var(--gray);margin-top:4px;line-height:1.45;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.drink-card-bottom{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:8px;}
.drink-card-price{font-size:14px;font-weight:700;color:var(--burgundy);}
.drink-card-vol{
  font-size:11px;color:var(--gray);background:var(--cream);
  border-radius:10px;padding:2px 7px;border:1px solid var(--border);
  display:inline-block;
}
.modal-weight{
  display:inline-flex;align-items:center;gap:5px;
  background:var(--cream);border:1px solid var(--border);
  border-radius:12px;padding:4px 12px;
  font-size:12px;color:var(--gray);margin-bottom:16px;
}

/* ABOUT LOGO */
.about-logo{
  display:flex;flex-direction:column;align-items:center;
  padding:28px 0 24px;
  border-bottom:1px solid var(--border);margin-bottom:20px;
}
.about-logo-mark{
  font-family:'Playfair Display',serif;
  font-size:52px;font-weight:700;letter-spacing:-0.03em;
  line-height:1;
  background:linear-gradient(135deg,var(--burgundy) 0%,var(--gold) 100%);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;
  background-clip:text;
}
.about-logo-ring{
  width:90px;height:90px;border-radius:50%;
  border:2px solid var(--border);
  display:flex;align-items:center;justify-content:center;
  margin-bottom:10px;
  background:var(--cream);
  box-shadow:0 2px 12px rgba(122,30,46,0.1);
}
.about-logo-sub{font-size:11px;letter-spacing:0.18em;text-transform:uppercase;color:var(--gray);margin-top:6px;}
.about-tagline{font-family:'Playfair Display',serif;font-size:13px;font-style:italic;color:var(--gray);margin-top:4px;text-align:center;}

/* GALLERY */
.gallery-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:16px 16px 24px;}
.gallery-item{border-radius:var(--radius-sm);overflow:hidden;aspect-ratio:1;background:#F0EBE3;box-shadow:var(--shadow-sm);}
.gallery-item.tall{grid-row:span 2;aspect-ratio:auto}
.gallery-item img{width:100%;height:100%;object-fit:cover;display:block;opacity:0;transition:opacity .4s;}
.gallery-item img.loaded{opacity:1}
.gallery-title{
  padding:16px 16px 8px;
  font-family:'Playfair Display',serif;font-size:14px;
  color:var(--gray);letter-spacing:0.04em;text-transform:uppercase;font-style:italic;
}

/* BOTTOM TAB BAR */
.tab-bar{
  position:fixed;bottom:0;left:0;right:0;z-index:100;
  height:var(--tab-h);background:var(--warm-white);
  border-top:1px solid var(--border);
  display:flex;
}
.tab-btn{
  flex:1;display:flex;flex-direction:column;align-items:center;
  justify-content:center;gap:3px;background:none;border:none;
  cursor:pointer;font-family:'Jost',sans-serif;font-size:10.5px;
  font-weight:500;color:var(--gray);transition:color .2s;padding:8px 4px;
}
.tab-btn.active{color:var(--burgundy)}
.tab-btn svg{width:22px;height:22px;transition:transform .2s;stroke:var(--gray);}
.tab-btn.active svg{transform:translateY(-1px);stroke:var(--burgundy);}

/* WAITER BUTTON */
.waiter-fab{
  position:fixed;bottom:calc(var(--tab-h) + 10px);left:50%;
  transform:translateX(-50%);z-index:101;
  background:var(--burgundy);color:#fff;
  border:none;border-radius:28px;
  padding:0 24px;height:var(--waiter-h);
  font-family:'Jost',sans-serif;font-size:14px;font-weight:600;
  display:flex;align-items:center;gap:8px;cursor:pointer;
  box-shadow:0 4px 20px rgba(122,30,46,0.4);
  transition:all .2s;white-space:nowrap;
}
.waiter-fab:active{transform:translateX(-50%) scale(0.96)}
.waiter-fab.calling{background:#5A6A7E;box-shadow:none;pointer-events:none}
.waiter-fab.success{background:#2D7A4F;box-shadow:0 4px 20px rgba(45,122,79,0.35)}
.waiter-fab.cooldown{background:#8A7D74;box-shadow:none;cursor:not-allowed}
.waiter-fab svg{flex-shrink:0}

/* SIDEBAR */
.sidebar-overlay{
  position:fixed;inset:0;z-index:200;background:rgba(28,20,16,0);
  pointer-events:none;transition:background .3s;
}
.sidebar-overlay.open{background:rgba(28,20,16,0.45);pointer-events:all}
.sidebar{
  position:absolute;top:0;right:0;bottom:0;
  width:min(300px,85vw);background:var(--warm-white);
  transform:translateX(100%);transition:transform .32s cubic-bezier(.4,0,.2,1);
  display:flex;flex-direction:column;box-shadow:var(--shadow-lg);
}
.sidebar-overlay.open .sidebar{transform:translateX(0)}
.sidebar-logo{padding:28px 24px 20px;border-bottom:1px solid var(--border);font-family:'Playfair Display',serif;}
.sidebar-logo-mark{
  font-size:32px;font-weight:700;letter-spacing:-0.02em;
  background:linear-gradient(135deg,var(--burgundy),var(--gold));
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
}
.sidebar-logo-sub{font-size:12px;color:var(--gray);letter-spacing:0.08em;text-transform:uppercase;margin-top:2px}
.sidebar-nav{flex:1;padding:16px 0;overflow-y:auto}
.sidebar-item{
  display:flex;align-items:center;gap:14px;padding:16px 24px;
  background:none;border:none;width:100%;text-align:left;cursor:pointer;
  font-family:'Jost',sans-serif;font-size:15px;font-weight:500;color:var(--dark);
  transition:background .15s;
}
.sidebar-item:active{background:var(--cream)}
.sidebar-item-icon{font-size:20px;width:26px;text-align:center;display:flex;align-items:center;justify-content:center;color:var(--mid)}
.sidebar-item-icon svg{stroke:var(--mid);flex-shrink:0}
.sidebar-close{padding:16px 24px;border-top:1px solid var(--border);font-size:12px;color:var(--gray);text-align:center;}

/* ABOUT & CONTACT panels */
.panel{
  position:fixed;inset:0;z-index:300;background:var(--warm-white);
  transform:translateX(100%);transition:transform .3s cubic-bezier(.4,0,.2,1);
  overflow-y:auto;display:flex;flex-direction:column;
}
.panel.open{transform:translateX(0)}
.panel-header{
  display:flex;align-items:center;gap:12px;
  padding:14px 16px;border-bottom:1px solid var(--border);
  background:var(--warm-white);position:sticky;top:0;z-index:1;
}
.panel-back{background:none;border:none;cursor:pointer;padding:4px;font-size:22px;color:var(--mid);display:flex;}
.panel-title{font-family:'Playfair Display',serif;font-size:18px;font-weight:700;color:var(--dark)}
.panel-body{padding:20px 18px;flex:1}
.panel-body h3{font-family:'Playfair Display',serif;font-size:16px;margin:0 0 8px;color:var(--burgundy)}
.panel-body p{font-size:14px;color:var(--mid);line-height:1.7;margin-bottom:16px}
.panel-body a{color:var(--burgundy);text-decoration:none}
.contact-row{display:flex;align-items:center;gap:12px;padding:14px 0;border-bottom:1px solid var(--border)}
.contact-row:last-child{border-bottom:none}
.contact-icon{font-size:22px;width:32px;text-align:center;display:flex;align-items:center;justify-content:center;color:var(--burgundy)}
.contact-icon svg{stroke:var(--burgundy);flex-shrink:0}
.contact-info{flex:1}
.contact-label{font-size:11px;color:var(--gray);text-transform:uppercase;letter-spacing:0.05em}
.contact-val{font-size:14px;color:var(--dark);font-weight:500;margin-top:2px}

/* LANG PANEL */
.lang-panel{
  position:fixed;inset:0;z-index:300;background:rgba(28,20,16,0);
  pointer-events:none;transition:background .25s;
  display:flex;align-items:flex-start;justify-content:flex-start;
}
.lang-panel.open{background:rgba(28,20,16,0.4);pointer-events:all}
.lang-dropdown{
  margin:calc(var(--header-h) + 8px) 0 0 10px;
  background:var(--warm-white);border-radius:var(--radius);
  box-shadow:var(--shadow-lg);overflow:hidden;
  transform:scaleY(0);transform-origin:top left;
  transition:transform .22s cubic-bezier(.4,0,.2,1),opacity .22s;opacity:0;
  min-width:180px;border:1px solid var(--border);
}
.lang-panel.open .lang-dropdown{transform:scaleY(1);opacity:1}
.lang-option{
  display:flex;align-items:center;gap:12px;padding:13px 16px;
  background:none;border:none;width:100%;cursor:pointer;
  font-family:'Jost',sans-serif;font-size:14px;color:var(--dark);
  transition:background .12s;
}
.lang-option:active{background:var(--cream)}
.lang-option.active{color:var(--burgundy);font-weight:600}
.lang-option .lflag{font-size:20px}

/* MODAL */
.modal-overlay{
  position:fixed;inset:0;z-index:400;background:rgba(28,20,16,0);
  pointer-events:none;transition:background .25s;
  display:flex;align-items:flex-end;
}
.modal-overlay.open{background:rgba(28,20,16,0.55);pointer-events:all}
.modal{
  width:100%;max-height:92vh;background:var(--warm-white);
  border-radius:20px 20px 0 0;transform:translateY(100%);
  transition:transform .32s cubic-bezier(.4,0,.2,1);
  overflow-y:auto;
}
.modal-overlay.open .modal{transform:translateY(0)}
.modal-img{width:100%;aspect-ratio:16/9;object-fit:cover;display:block;background:#F0EBE3;}
.modal-handle{width:36px;height:4px;background:var(--border);border-radius:2px;margin:12px auto 0;}
.modal-content{padding:18px 18px 30px}
.modal-name{font-family:'Playfair Display',serif;font-size:22px;font-weight:700;color:var(--dark);margin-bottom:6px;line-height:1.2;}
.modal-price{font-size:20px;font-weight:700;color:var(--burgundy);margin-bottom:14px;}
.modal-price .currency{font-size:14px;font-weight:400;color:var(--gray);margin-left:2px}
.modal-desc{font-size:14px;color:var(--mid);line-height:1.7;margin-bottom:14px}
.modal-label{font-size:11px;text-transform:uppercase;letter-spacing:0.06em;color:var(--gray);font-weight:600;margin-bottom:6px}
.modal-ingredients{font-size:13.5px;color:var(--mid);line-height:1.6}
.modal-close{
  position:sticky;top:12px;float:right;margin:12px 14px 0 0;z-index:1;
  background:rgba(255,255,255,0.92);border:1px solid var(--border);
  border-radius:50%;width:34px;height:34px;display:flex;align-items:center;
  justify-content:center;cursor:pointer;font-size:18px;color:var(--mid);
  backdrop-filter:blur(4px);
}

/* TOAST */
.toast{
  position:fixed;top:calc(var(--header-h) + var(--cat-h) + 10px);
  left:50%;transform:translateX(-50%) translateY(-10px);z-index:500;
  background:var(--dark);color:#fff;border-radius:20px;
  padding:10px 20px;font-size:13px;font-weight:500;
  opacity:0;transition:all .3s;pointer-events:none;white-space:nowrap;
}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
.toast.success{background:#2D7A4F}
.toast.error{background:#7A2D2D}

/* LAZY IMAGES */
img.lazy{opacity:0;transition:opacity .3s}
img.lazy.loaded{opacity:1}

/* SCROLLBAR HIDE */
.sidebar::-webkit-scrollbar,.panel::-webkit-scrollbar{display:none}

@media(prefers-reduced-motion:reduce){
  *{transition:none!important;animation:none!important}
}
