/* ================================
       BASE + TOKENS
       ================================ */
    * { box-sizing: border-box; margin: 0; padding: 0; }
    :root{
      --ink:#2c2c2c; --accent:#b8975a; --brand:#8b2e3b; --paper:#f5f0e8; --paper-2:#ebe6dc;
    }
    html, body { min-height: 100%; }
    body { font-family: Georgia, serif; background:#fff; color:var(--ink); }

    .page { display:none; min-height:100vh; width:100%; }
    .page.active { display:flex; }

    /* Focus styles */
    :where(button,[role="button"],.back-button,.fixed-back-button,.menu-item):focus{
      outline:3px solid var(--accent); outline-offset:3px; border-radius:12px;
    }

    /* Reduced motion */
    @media (prefers-reduced-motion: reduce){
      *{animation-duration:0.01ms !important; animation-iteration-count:1 !important; transition-duration:0.01ms !important; scroll-behavior:auto !important;}
      .menu-item:hover, .swipe-button:hover, .back-button:hover, .fixed-back-button:hover{ transform:none !important; }
    }

    /* ================================
       WELCOME
       ================================ */
    .welcome-page { background: linear-gradient(135deg, #1a4d3e 0%, #2d5f4f 100%); justify-content:center; align-items:center; padding:20px; position:relative; overflow:hidden; }
    .welcome-page::before{ content:""; position:absolute; inset:0; background-image: repeating-linear-gradient(0deg,transparent,transparent 2px, rgba(184,151,90,.03) 2px, rgba(184,151,90,.03) 4px); pointer-events:none; }

    .welcome-container{ background: linear-gradient(135deg, rgba(245,240,232,.85) 0%, rgba(235,230,220,.90) 100%); backdrop-filter: blur(10px); border-radius: 20px; padding: 30px; max-width: 460px; width: 100%; box-shadow: 0 20px 60px rgba(0,0,0,.4), inset 0 1px 0 rgba(255,255,255,.3); position:relative; z-index:1; }
    .card-border{ border: 3px solid var(--accent); border-radius: 15px; padding: 50px 30px; position:relative; min-height: 600px; display:flex; flex-direction:column; justify-content:space-between; }
    .card-border::before, .card-border::after{ content:""; position:absolute; width:25px; height:25px; border:3px solid var(--accent); }
    .card-border::before{ top:12px; left:12px; border-right:none; border-bottom:none; }
    .card-border::after{ top:12px; right:12px; border-left:none; border-bottom:none; }
    .corner-bottom-left, .corner-bottom-right{ position:absolute; width:25px; height:25px; border:3px solid var(--accent); bottom:12px; }
    .corner-bottom-left{ left:12px; border-right:none; border-top:none; }
    .corner-bottom-right{ right:12px; border-left:none; border-top:none; }

    .language-selector{ position:absolute; top:30px; right:40px; display:flex; align-items:center; gap:6px; }
    .logo-letter{ font-size:2em; color:var(--accent); font-weight:bold; font-family: "Times New Roman", serif; }
    .language-options{ display:flex; gap:6px; }
    .language-options button{ border:2px solid var(--accent); background:transparent; color:var(--accent); padding:4px 8px; border-radius:999px; font-size:.8em; cursor:pointer; }
    .language-options button[aria-pressed="true"]{ background:var(--accent); color:#1b1b1b; }

    .content{ text-align:center; flex-grow:1; display:flex; flex-direction:column; justify-content:center; align-items:center; }
    h1{ font-size:3.5em; color:var(--brand); margin-bottom:20px; margin-top:40px; font-weight:400; letter-spacing:2px; }
    .logo-container{ display:flex; justify-content:center; margin:50px 0; }
    .logo-container svg{ width:350px; height:auto; max-width:100%; filter: drop-shadow(0 4px 8px rgba(0,0,0,.2)); }

    .swipe-button{ display:flex; align-items:center; justify-content:center; gap:15px; margin-top:40px; cursor:pointer; transition: transform .3s ease; }
    .swipe-button:hover{ transform: translateX(10px); }
    .swipe-text{ font-size:1.3em; color:#2c2c2c; font-style: italic; }
    .arrow{ width:45px; height:45px; border:3px solid var(--accent); border-radius:50%; display:flex; align-items:center; justify-content:center; background:transparent; }
    .arrow svg{ width:22px; height:22px; fill:var(--accent); }

    /* ================================
       SUBMENU
       ================================ */
    .submenu-page{ background: linear-gradient(135deg, #1a4d3e 0%, #2d5f4f 100%); justify-content:center; align-items:center; padding:20px; position:relative; overflow:hidden; }
    .submenu-page::before{ content:""; position:absolute; inset:0; background-image: repeating-linear-gradient(0deg,transparent,transparent 2px, rgba(184,151,90,.03) 2px, rgba(184,151,90,.03) 4px); pointer-events:none; }

    .menu-container{ background: transparent; border-radius:20px; padding:40px 30px; max-width: 460px; width: 100%; position:relative; z-index:1; }
    .menu-border{ border:3px solid var(--accent); border-radius:15px; padding:50px 30px; position:relative; min-height:650px; display:flex; flex-direction:column; justify-content:space-between; background: rgba(235,230,220,.95); }
.menu-border::before, .menu-border::after{ content:""; position:absolute; width:25px; height:25px; border:3px solid var(--accent); }
.menu-border::before{ top:12px; left:12px; border-right:none; border-bottom:none; }
.menu-border::after{ top:12px; right:12px; border-left:none; border-bottom:none; }
.menu-corner-bottom-left, .menu-corner-bottom-right{ position:absolute; width:25px; height:25px; border:3px solid var(--accent); bottom:12px; }
.menu-corner-bottom-left{ left:12px; border-right:none; border-top:none; }
.menu-corner-bottom-right{ right:12px; border-left:none; border-top:none; }

    .menu-content{ text-align:center; flex-grow:1; display:flex; flex-direction:column; justify-content:center; gap:30px; }
    .menu-title{ font-size:3em; color: var(--brand); letter-spacing:8px; font-weight:400; margin-bottom:40px; }

    .menu-item{ font-size:2em; color:#f5f0e8; letter-spacing:6px; font-weight:400; transition: all .3s ease; padding: 18px 28px; background: var(--brand); backdrop-filter: blur(10px); border-radius: 15px; border: 2px solid var(--brand); box-shadow: 0 8px 25px rgba(0,0,0,.3), inset 0 1px 0 rgba(255,255,255,.1); }
    .menu-item:hover{ transform: translateY(-5px) scale(1.02); text-shadow: 0 0 20px rgba(255,255,255,.8); background: #a03848; border-color: #a03848; box-shadow: 0 12px 35px rgba(0,0,0,.4), inset 0 1px 0 rgba(255,255,255,.2); }
    .menu-item button{ background:none; border:none; color:inherit; font: inherit; letter-spacing: inherit; cursor:pointer; }

    .back-button{ position:absolute; top:30px; left:30px; width:40px; height:40px; border:2px solid var(--accent); border-radius:50%; display:flex; align-items:center; justify-content:center; cursor:pointer; transition: all .3s ease; background:transparent; z-index:10; }
.back-button:hover{ background: rgba(184,151,90,.1); transform: translateX(-5px); }
.back-button svg{ width:20px; height:20px; fill:var(--accent); }

    /* ================================
       COMMON PAGES (dishes/wines/spirits/cocktails/desserts)
       ================================ */
    .dishes-page{ background: linear-gradient(135deg, #1a4d3e 0%, #2d5f4f 100%); min-height:100vh; padding:20px; position:relative; overflow-x:hidden; }
    .dishes-page::before{ content:""; position:absolute; inset:0; background-image: repeating-linear-gradient(0deg,transparent,transparent 2px, rgba(184,151,90,.03) 2px, rgba(184,151,90,.03) 4px); pointer-events:none; }

    .dishes-container{ max-width: 940px; margin:0 auto; position:relative; padding-top:60px; padding-bottom:120px; }
    .dishes-border{ border:3px solid var(--accent); border-radius:15px; padding:50px 40px; background: rgba(245,240,232,.95); position:relative; box-shadow: 0 20px 60px rgba(0,0,0,.4); }
    .dishes-border::before, .dishes-border::after{ content:""; position:absolute; width:30px; height:30px; border:3px solid var(--accent); }
    .dishes-border::before{ top:15px; left:15px; border-right:none; border-bottom:none; }
    .dishes-border::after{ top:15px; right:15px; border-left:none; border-bottom:none; }
    .dishes-corner-bottom-left, .dishes-corner-bottom-right{ position:absolute; width:30px; height:30px; border:3px solid var(--accent); bottom:15px; }
    .dishes-corner-bottom-left{ left:15px; border-right:none; border-top:none; }
    .dishes-corner-bottom-right{ right:15px; border-left:none; border-top:none; }

    .fixed-back-button{ position:fixed; top:30px; left:30px; width:45px; height:45px; border:2px solid var(--accent); border-radius:50%; display:flex; align-items:center; justify-content:center; cursor:pointer; transition: all .3s ease; background: rgba(26,77,62,.9); z-index:100; box-shadow:0 2px 10px rgba(0,0,0,.3); }
    .fixed-back-button:hover{ background: var(--accent); transform: translateX(-5px); }
    .fixed-back-button svg{ width:22px; height:22px; fill:var(--accent); transition: fill .3s ease; }
    .fixed-back-button:hover svg{ fill:#1a4d3e; }

    .section-divider{ width:100%; height:2px; background: linear-gradient(to right, transparent, var(--accent), transparent); margin: 40px 0; }
    .ornament-divider{ text-align:center; margin:35px 0; font-size:1.8em; color:var(--accent); font-style: italic; }
    .subsection-title{ text-align:center; font-size:.9em; text-transform:uppercase; letter-spacing:2px; margin:25px 0 15px 0; color:#2c2c2c; font-weight: 400; }

    .two-column-dishes{ display:grid; grid-template-columns: 1fr 1fr; gap:30px; margin:20px 0; }
    .column-dishes{ padding:0 10px; }
    .column-title-dishes{ text-align:center; font-size:1.1em; text-transform:uppercase; letter-spacing:2px; margin-bottom:15px; font-weight:700; color:var(--brand); }

    .dish-item{ margin:18px 0; line-height:1.6; padding:10px 0; border-bottom:1px dotted rgba(139,46,59,.2); }
    .dish-item:last-child{ border-bottom:none; }
    .dish-name{ font-weight:700; font-style: italic; font-size:1.05em; color:#2c2c2c; }
    .dish-price{ float:right; font-weight:700; color:var(--brand); }
    .dish-description{ font-size:.9em; font-style: italic; color:#4a4a4a; margin-top:3px; clear:both; }

    .special-dish-box{ border:2px solid var(--accent); padding:20px; margin:25px 0; border-radius:10px; text-align:center; background: rgba(184,151,90,.05); }
    .special-dish-box-title{ font-size:1.2em; font-style: italic; margin-bottom:10px; font-weight:700; color:var(--brand); }
    .special-dish-box-content{ font-style: italic; color:#4a4a4a; }

    .footer-note{ text-align:center; font-size:.7em; font-style: italic; color:#666; margin-top:40px; padding-top:20px; border-top:2px solid var(--accent); }

    /* ===== Wines-specific ===== */
    .champagne-header{ text-align:center; font-size:2.5em; font-style: italic; color:#2c2c2c; margin:30px 0 25px; letter-spacing:1px; }
    .champagne-box{ border:3px solid #2c2c2c; padding:25px 30px; margin:0 20px 40px; background: rgba(255,255,255,.3); }
    .wine-item{ display:block; margin:12px 0; line-height:1.5; }
    .wine-name{ font-weight:700; text-transform:uppercase; font-size:.95em; letter-spacing:.5px; color:#2c2c2c; }
    .wine-description{ font-style: italic; margin-left:8px; color:#2c2c2c; }
    .wine-origin{ font-style: italic; color:#2c2c2c; }
    .wine-price{ float:right; font-weight:400; color:#2c2c2c; }
    .wine-by-glass-header{ text-align:center; margin:50px 0 40px; position:relative; display:flex; align-items:center; justify-content:center; gap:15px; }
    .decorative-line{ flex:1; height:1px; background: repeating-linear-gradient(to right,#2c2c2c 0px,#2c2c2c 5px, transparent 5px, transparent 10px); max-width:200px; }
    .wine-title{ font-size:3em; font-style: italic; color:#2c2c2c; letter-spacing:2px; }
    .by-glass-text{ font-size:1.2em; font-style: italic; color:#2c2c2c; position:absolute; bottom:-25px; left:50%; transform:translateX(-50%); white-space:nowrap; }
    .wine-columns{ display:grid; grid-template-columns:1fr 1fr 1fr; gap:30px; margin:40px 20px; }
    .wine-column{ padding:0 15px; }
    .rose-column{ border-left:1px solid rgba(44,44,44,.2); border-right:1px solid rgba(44,44,44,.2); }
    .wine-column-header{ text-align:center; font-size:1.3em; font-weight:400; letter-spacing:2px; margin-bottom:25px; color:#2c2c2c; text-transform:uppercase; }
    .wine-group{ margin-bottom:25px; }
    .wine-variety{ font-weight:700; text-transform:uppercase; font-size:.85em; letter-spacing:.5px; margin-bottom:8px; color:#2c2c2c; }
    .wine-listing{ display:block; font-size:.9em; line-height:1.6; margin:6px 0; color:#2c2c2c; }
    .producer{ font-style: italic; margin-right:5px; }
    .wine-prices{ float:right; font-weight:400; }
    .old-fashioned-section{ border:3px solid #2c2c2c; padding:30px 40px; margin:50px 40px 30px; text-align:center; background: rgba(255,255,255,.3); }
    .old-fashioned-header{ font-size:2.5em; font-style: italic; color:#2c2c2c; margin-bottom:5px; letter-spacing:2px; }
    .barrel-subtitle{ font-size:.85em; text-transform:uppercase; letter-spacing:1.5px; margin-bottom:20px; color:#2c2c2c; }
    .barrel-item{ font-size:1em; text-transform:uppercase; margin:12px 0; letter-spacing:.5px; color:#2c2c2c; }

    /* ===== Spirits-specific ===== */
    .spirits-header{ text-align:center; font-size:3em; font-style: italic; color:#2c2c2c; margin:30px 0 20px; letter-spacing:2px; position:relative; }
    .spirits-header::before, .spirits-header::after{ content:""; position:absolute; top:50%; width:150px; height:1px; background:#2c2c2c; }
    .spirits-header::before{ left:50px; }
    .spirits-header::after{ right:50px; }
    .spirits-border-box{ border:3px solid #2c2c2c; padding:30px 35px; margin:20px; background: rgba(255,255,255,.3); position:relative; }
    .spirits-border-box::before, .spirits-border-box::after{ content:""; position:absolute; width:20px; height:20px; border:3px solid #2c2c2c; }
    .spirits-border-box::before{ top:10px; left:10px; border-right:none; border-bottom:none; }
    .spirits-border-box::after{ top:10px; right:10px; border-left:none; border-bottom:none; }
    .spirits-corner-bl, .spirits-corner-br{ position:absolute; width:20px; height:20px; border:3px solid #2c2c2c; }
    .spirits-corner-bl{ bottom:10px; left:10px; border-right:none; border-top:none; }
    .spirits-corner-br{ bottom:10px; right:10px; border-left:none; border-top:none; }
    .spirits-grid{ display:grid; grid-template-columns:1fr 1fr; gap:40px; margin-bottom:30px; }
    .spirits-column{ display:flex; flex-direction:column; gap:25px; }
    .spirits-category{ margin-bottom:15px; }
    .spirits-category-title{ font-size:1.1em; font-style: italic; margin-bottom:12px; color:#2c2c2c; font-weight:400; }
    .spirits-item{ display:flex; justify-content:space-between; margin:8px 0; line-height:1.5; font-size:.9em; }
    .spirits-name{ color:#2c2c2c; text-transform:uppercase; flex:1; }
    .spirits-detail{ font-style: italic; margin-left:5px; }
    .spirits-price{ margin-left:10px; color:#2c2c2c; white-space:nowrap; }

    .sake-section{ margin:40px 20px 30px; text-align:center; padding:25px 30px; border-top:2px solid #2c2c2c; border-bottom:2px solid #2c2c2c; }
    .sake-title{ font-size:2em; font-weight:700; letter-spacing:6px; color:#2c2c2c; margin-bottom:5px; text-transform:uppercase; }
    .sake-ornament{ font-size:1.5em; color:#2c2c2c; margin:10px 0; }
    .sake-subtitle{ font-size:.8em; text-transform:uppercase; letter-spacing:1px; margin-bottom:15px; color:#2c2c2c; }
    .sake-grid{ display:grid; grid-template-columns: repeat(4, 1fr); gap:20px; margin-top:15px; }
    .sake-item{ text-align:center; }
    .sake-name{ font-weight:700; text-transform:uppercase; font-size:.85em; margin-bottom:5px; color:#2c2c2c; }
    .sake-producer{ font-size:.8em; text-transform:uppercase; margin-bottom:3px; color:#2c2c2c; }
    .sake-price{ font-size:.85em; color:#2c2c2c; }

    .beer-section{ margin:30px 20px; padding:20px 30px; border:3px solid #2c2c2c; background: rgba(255,255,255,.3); }
    .beer-grid{ display:grid; grid-template-columns: auto 1fr auto; gap:30px; align-items:start; }
    .beer-title-vertical{ writing-mode: vertical-rl; text-orientation:mixed; font-size:2em; font-weight:700; letter-spacing:3px; text-transform:uppercase; color:#2c2c2c; padding:10px 0; }
    .beer-price-vertical{ writing-mode: vertical-rl; text-orientation:mixed; font-size:1.2em; letter-spacing:2px; color:#2c2c2c; padding:10px 0; }
    .beer-list{ display:flex; flex-direction:column; gap:8px; }
    .beer-item{ line-height:1.6; }
    .beer-name{ font-weight:700; text-transform:uppercase; font-size:.9em; color:#2c2c2c; }
    .beer-description{ font-style: italic; font-size:.85em; color:#2c2c2c; margin-left:5px; }

    /* ===== Cocktails ===== */
    .cocktails-header{ text-align:center; font-size:4em; font-style: italic; color:#2c2c2c; margin:40px 0 50px; letter-spacing:3px; font-weight:400; }
    .cocktails-grid{ display:grid; grid-template-columns:1fr 1fr; gap:50px; margin:0 30px 40px; }
    .cocktails-column{ display:flex; flex-direction:column; gap:20px; }
    .cocktails-section-title{ text-align:center; font-size:1em; text-transform:uppercase; letter-spacing:2px; margin-bottom:10px; color:#2c2c2c; font-weight:400; }
    .cocktails-section-ornament{ text-align:center; font-size:1.2em; color:#2c2c2c; margin-bottom:20px; }
    .cocktail-item{ margin-bottom:20px; }
    .cocktail-name{ font-weight:700; font-size:1.05em; color:#2c2c2c; margin-bottom:5px; }
    .cocktail-ingredients{ font-style: italic; font-size:.9em; color:#2c2c2c; line-height:1.5; }
    .zero-proof-box{ border:3px solid #2c2c2c; border-radius:15px; padding:20px 30px; margin:30px 80px; text-align:center; background: rgba(255,255,255,.3); position:relative; }
    .zero-proof-title{ font-size:1.8em; font-style: italic; color:#2c2c2c; margin-bottom:5px; letter-spacing:2px; }
    .zero-proof-price{ font-size:1.2em; color:#2c2c2c; margin-bottom:10px; }
    .zero-proof-ornament{ font-size:1.5em; color:#2c2c2c; margin:10px 0; }
    .zero-proof-items{ display:flex; justify-content:center; gap:40px; margin-top:15px; flex-wrap:wrap; }
    .zero-proof-item{ font-weight:700; text-transform:uppercase; letter-spacing:1px; color:#2c2c2c; font-size:.95em; }
    .cocktails-footer{ text-align:right; font-size:2em; color:#2c2c2c; margin:30px 40px 20px 0; font-style: italic; }
    .cocktails-top-line, .cocktails-bottom-line{ width: calc(100% - 80px); height:2px; background:#2c2c2c; margin:0 auto; }
    .cocktails-top-line{ margin-top:20px; margin-bottom:30px; }
    .cocktails-bottom-line{ margin-top:30px; margin-bottom:20px; }

    /* ===== Desserts ===== */
    .desserts-header{ text-align:center; font-size:3em; font-style: italic; color:#2c2c2c; margin:20px 0 10px; letter-spacing:2px; }
    .desserts-grid{ display:grid; grid-template-columns:1fr 1fr; gap:30px; }

    /* ================================
       RESPONSIVE
       ================================ */
    @media (max-width: 500px){
      .welcome-container, .menu-container{ padding:20px 15px; }
      .card-border, .menu-border{ padding:35px 20px; min-height:550px; }
      h1, .menu-title{ font-size:2.2em; letter-spacing:6px; }
      .menu-item{ font-size:1.5em; letter-spacing:4px; padding: 16px 24px; }
      .logo-container svg{ width:300px; }
      .back-button{ width:35px; height:35px; top:25px; left:25px; }
    }

    @media (max-width: 768px){
      .dishes-border{ padding:30px 20px; }
      .two-column-dishes{ grid-template-columns:1fr; gap:20px; }
      .fixed-back-button{ width:40px; height:40px; top:20px; left:20px; }

      .wine-columns{ grid-template-columns:1fr; gap:30px; }
      .rose-column{ border-left:none; border-right:none; border-top:1px solid rgba(44,44,44,.2); border-bottom:1px solid rgba(44,44,44,.2); padding-top:20px; padding-bottom:20px; }
      .champagne-box{ margin:0 10px 30px; padding:20px; }
      .old-fashioned-section{ margin:40px 20px 30px; padding:25px 20px; }
      .wine-title{ font-size:2.5em; }
      .decorative-line{ max-width:80px; }

      .spirits-grid{ grid-template-columns:1fr; gap:25px; }
      .spirits-header::before, .spirits-header::after{ width:50px; }
      .spirits-header::before{ left:10px; }
      .spirits-header::after{ right:10px; }
      .sake-grid{ grid-template-columns: 1fr 1fr; gap:15px; }
      .beer-grid{ grid-template-columns:1fr; gap:20px; }
      .beer-title-vertical, .beer-price-vertical{ writing-mode: horizontal-tb; text-align:center; padding:10px 0; }

      .cocktails-grid{ grid-template-columns:1fr; gap:30px; margin:0 20px 30px; }
      .zero-proof-box{ margin:30px 20px; padding:20px; }
      .zero-proof-items{ gap:20px; }
      .cocktails-header{ font-size:3em; }

      .desserts-grid{ grid-template-columns:1fr; }
      
      /* Allergy filter responsive */
      #allergyFilterBar > div{ flex-direction:column; gap:10px; }
      #allergyFilterBar input{ max-width:100%; min-width:100%; }
    }

    /* PRINT */
    @media print{
      body { color:#000; }
      .page{ display:none !important; }
      .page.active{ display:block !important; }
      *{ box-shadow:none !important; background:none !important; }
      .fixed-back-button,.back-button,.language-selector,.swipe-button,#allergyFilterBar{ display:none !important; }
    }
  
.enter-btn{padding:10px 18px;border:2px solid var(--accent);background:transparent;border-radius:999px;cursor:pointer;font-size:1rem}


  /* --- Modal básico para descripciones --- */
  .dish-modal-backdrop{
    position:fixed; inset:0; background:rgba(0,0,0,.5);
    display:none; align-items:center; justify-content:center; z-index:1000;
  }
  .dish-modal{
    max-width:520px; width:calc(100% - 32px); background:#fff; color:#2c2c2c;
    border:3px solid var(--accent, #8a2be2); border-radius:14px; padding:20px 22px;
    box-shadow:0 20px 60px rgba(0,0,0,.4);
  }
  .dish-modal h3{ font-size:1.25rem; margin:0 0 8px 0; color:var(--brand, #222); }
  .dish-modal p{ line-height:1.55; margin:8px 0; }
  .dish-modal small{ color:#666; font-style:italic; }
  .dish-modal .modal-actions{ display:flex; justify-content:flex-end; margin-top:14px; }
  .dish-modal .close-btn{
    border:2px solid var(--accent, #8a2be2); background:transparent; color:var(--accent, #8a2be2);
    padding:8px 14px; border-radius:999px; cursor:pointer;
  }
  .dish-modal-backdrop.show{ display:flex; }


/* --- Modal básico para descripciones (modular) --- */
.dish-modal-backdrop{ position:fixed; inset:0; background:rgba(0,0,0,.5); display:none; align-items:center; justify-content:center; z-index:1000; }
.dish-modal{ max-width:520px; width:calc(100% - 32px); background:#fff; color:#2c2c2c; border:3px solid var(--accent); border-radius:14px; padding:20px 22px; box-shadow:0 20px 60px rgba(0,0,0,.4); }
.dish-modal h3{ font-size:1.25rem; margin:0 0 8px 0; color:var(--brand); }
.dish-modal p{ line-height:1.55; margin:8px 0; }
.dish-modal small{ color:#666; font-style:italic; }
.dish-modal .modal-actions{ display:flex; justify-content:flex-end; margin-top:14px; }
.dish-modal .close-btn{ border:2px solid var(--accent); background:transparent; color:var(--accent); padding:8px 14px; border-radius:999px; cursor:pointer; }
.dish-modal-backdrop.show{ display:flex; }
/* ========================================
   MEJORAS PARA EL MODAL Y FILTRO DE ALERGIAS
   Agregar al final de styles.css
   ======================================== */

/* MEJORAS DEL MODAL */
.dish-modal {
  position: relative;
  max-height: 90vh;
  overflow-y: auto;
}

.modal-close-x {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 35px;
  height: 35px;
  border: none;
  background: var(--accent);
  color: #fff;
  font-size: 24px;
  line-height: 1;
  cursor: pointer;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease;
  z-index: 10;
}

.modal-close-x:hover {
  background: var(--brand);
  transform: rotate(90deg);
}

.dish-modal h3 {
  padding-right: 40px;
}
/* ========================================
   ESTILOS PARA PÁGINA DE SPECIALS
   Agregar después de los estilos del modal
   ======================================== */

.specials-header {
  text-align: center;
  font-size: 3em;
  font-style: italic;
  color: #2c2c2c;
  margin: 20px 0 10px;
  letter-spacing: 2px;
  font-weight: 400;
}

/* Responsive para specials */
@media (max-width: 768px) {
  .specials-header {
    font-size: 2.5em;
  }
}
/* BADGE DE MODIFICABLE */
.modifiable-badge {
  margin-top: 8px;
  padding: 5px 10px;
  background: rgba(76, 175, 80, 0.1);
  border-radius: 4px;
}

/* CURSOR POINTER EN NOMBRES DE PLATOS */
.dish-name,
.nombre-plato,
.item-title {
  cursor: pointer;
  transition: all 0.2s ease;
}

.dish-name:hover,
.nombre-plato:hover,
.item-title:hover {
  color: var(--brand);
  text-decoration: underline;
}

/* RESPONSIVE PARA EL MODAL */
@media (max-width: 768px) {
  .dish-modal {
    max-height: 85vh;
    padding: 25px 18px;
  }
  
  .modal-close-x {
    width: 30px;
    height: 30px;
    font-size: 20px;
  }
  
  .dish-modal h3 {
    font-size: 1.1rem;
  }
}

/* MEJORAS PARA LA BARRA DE FILTRO DE ALERGIAS */
#allergyFilterBar input:focus {
  outline: 3px solid var(--accent);
  border-color: var(--brand);
}/* ========================================
   MEJORAS PARA EL MODAL Y FILTRO DE ALERGIAS
   Agregar al final de styles.css
   ======================================== */

/* MEJORAS DEL MODAL */
.dish-modal {
  position: relative;
  max-height: 90vh;
  overflow-y: auto;
}

.modal-close-x {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 35px;
  height: 35px;
  border: none;
  background: var(--accent);
  color: #fff;
  font-size: 24px;
  line-height: 1;
  cursor: pointer;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease;
  z-index: 10;
}

.modal-close-x:hover {
  background: var(--brand);
  transform: rotate(90deg);
}

.dish-modal h3 {
  padding-right: 40px;
}

/* BADGE DE MODIFICABLE */
.modifiable-badge {
  margin-top: 8px;
  padding: 5px 10px;
  background: rgba(76, 175, 80, 0.1);
  border-radius: 4px;
}

/* CURSOR POINTER EN NOMBRES DE PLATOS */
.dish-name,
.nombre-plato,
.item-title {
  cursor: pointer;
  transition: all 0.2s ease;
}

.dish-name:hover,
.nombre-plato:hover,
.item-title:hover {
  color: var(--brand);
  text-decoration: underline;
}

/* RESPONSIVE PARA EL MODAL */
@media (max-width: 768px) {
  .dish-modal {
    max-height: 85vh;
    padding: 25px 18px;
  }
  
  .modal-close-x {
    width: 30px;
    height: 30px;
    font-size: 20px;
  }
  
  .dish-modal h3 {
    font-size: 1.1rem;
  }
}

/* MEJORAS PARA LA BARRA DE FILTRO DE ALERGIAS */
#allergyFilterBar input:focus {
  outline: 3px solid var(--accent);
  border-color: var(--brand);
}
/* ==========================================
   FIX: Quitar outline azul del focus automático
   ========================================== */
h1[tabindex="-1"]:focus,
h2[tabindex="-1"]:focus,
h3[tabindex="-1"]:focus,
[role="heading"][tabindex="-1"]:focus {
  outline: none;
}