/* Indra Menu Plugin - Exact copy of menu.html styles */
:root{
  --bg:#0b0f12; --card:#11161a; --text:#e8eef3; --muted:#9aa5b1;
  --accent:#29b37d; --divider:#1b2329; --chip:#1a2127;
  --radius:16px; --pad:14px; --shadow:0 10px 24px rgba(0,0,0,.28);
}
*{box-sizing:border-box} html,body{height:100%}
body{margin:0;background:var(--bg);color:var(--text);font:16px/1.45 ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Inter,Arial}
.wrap{max-width:100%;margin:0 auto;padding-bottom:80px; padding: 10px;}
main {background-color: #0b0f12;}

/* Header */
.topbar{display:flex;align-items:center;gap:16px}
.topbar .logo{display:flex;align-items:center;gap:10px;text-decoration:none;color:inherit}
.topbar .logo img{height:35px}
.spacer{flex:1}
.btn{
  appearance:none;border:1px solid var(--line); background:transparent; color:var(--text);
  padding:10px 14px; border-radius:999px; cursor:pointer; text-decoration:none; display:inline-flex; gap:10px; align-items:center; font-size: 0.85rem;
}
.btn:hover{border-color:#2a3845}
.btn--accent{background: linear-gradient(172deg, #3ce544, #25bc70);
  color: #07120c;
  border-color: transparent;
  box-shadow: 0 6px 20px rgb(116 179 41 / 35%);}
.btn--ghost{background:rgba(255,255,255,.04)}
.btn svg{opacity:.9}

/* Header */
.brand{
  position:sticky;top:0;z-index:20;backdrop-filter:saturate(1.2) blur(8px);
  background:linear-gradient(180deg,rgba(11,15,18,.9),rgba(11,15,18,.65));
  border-bottom:1px solid var(--divider);
  padding: 0 10px;border-radius: 10px;
}
.brand__in{display:flex;gap:12px;align-items:center;padding:12px env(safe-area-inset-right,16px) 12px env(safe-area-inset-left,16px)}
.brand h1{font-size:18px;margin:0}
.hours{margin-left:auto;font-size:12px;color:var(--muted)}
.tag{font-size:11px;padding:4px 8px;border-radius:999px;background:var(--chip);border:1px solid var(--divider);color:var(--text)}

/* Tools */
.tools{position:sticky;top:56px;z-index:19;background:var(--bg);border-bottom:1px solid var(--divider); border-radius: 10px; padding: 10px;}
.tools__in{padding:12px env(safe-area-inset-right,16px) 12px env(safe-area-inset-left,16px);display:grid;gap:10px}
.search{
  display:flex;align-items:center;gap:10px;background:var(--card);border:1px solid var(--divider);
  border-radius:999px;padding:10px 14px
}
.search input{flex:1;background:transparent;border:0;color:var(--text);font-size:16px;outline:none}
.pillbar{display:flex;gap:8px;overflow:auto hidden;scrollbar-width:none;-ms-overflow-style:none;}
.pillbar::-webkit-scrollbar{display:none}
.pill{white-space:nowrap;padding:8px 12px;border-radius:999px;background:var(--chip);border:1px solid var(--divider);font-size:13px;text-decoration: none;color: #ffffff;}
.pill[data-active="1"]{background:transparent;border-color:var(--accent);color:var(--accent)}

/* Section */
section{padding:10px env(safe-area-inset-right,16px) 0 env(safe-area-inset-left,16px)}
.cat{margin:16px 0 8px;font-size:13px;color:var(--muted);letter-spacing:.08em;text-transform:uppercase}

/* Visual card list */
.vlist{display:grid;gap:10px}
.item{
  display:grid;grid-template-columns:88px 1fr auto;gap:12px;align-items:center;
  background:var(--card);border:1px solid var(--divider);border-radius:var(--radius);box-shadow:var(--shadow);padding:var(--pad)
}
.thumb{
  width:88px;height:88px;border-radius:14px;border:1px solid var(--divider);
  display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;
  background: radial-gradient(120% 100% at 0% 0%, #1c242b 0%, #0f151a 60%);
}
.thumb::before{content: attr(data-emoji);font-size: 40px; filter: drop-shadow(0 4px 10px rgba(0,0,0,.35));}
.thumb::after{content:""; position:absolute; inset:0; background: repeating-linear-gradient(45deg, rgba(255,255,255,.03) 0 2px, transparent 2px 4px); mix-blend-mode: soft-light; opacity:.6;}
.title{font-size:16px}
.meta{color:var(--muted);font-size:13px;margin-top:2px;display:flex;gap:8px;flex-wrap:wrap}
.price{font-variant-numeric:tabular-nums;letter-spacing:.3px;font-weight:600}
.price .cur{opacity:.75;margin-right:2px}

/* time chip */
.time{display:inline-flex;align-items:center;gap:6px;font-size:12px;padding:4px 8px;border-radius:999px;background:var(--chip);border:1px solid var(--divider);color:#cfe7d9}
.time::before{content:"⏱"}

.note{color:var(--muted);text-align:center;font-size:12px;margin:14px 16px}

footer{margin-top:38px; padding-top:18px; border-top:1px solid var(--line); color:var(--muted); font-size:13px; display:flex; justify-content:space-between; gap:10px; flex-wrap:wrap}

.footer-item a {
  color: #fff;
}

/* Big touch targets (mobile) */
@media (pointer:coarse){
  .item{grid-template-columns:76px 1fr auto; padding:16px}
  .thumb{width:76px;height:76px}
}

/* Print */
@media print{
  body{background:#fff;color:#111}
  .brand,.tools{position:static;backdrop-filter:none}
  .pillbar{display:none}
  .item{box-shadow:none}
}

/* Tablet ve altı: paddingleri yumuşat */
@media (max-width: 900px){
  .container{ padding-left: 12px; padding-right: 12px; }
}

/* 720px ve altı: spacer'ı kaldır, butonları sıkılaştır */
@media (max-width: 720px){
  .topbar{ display: grid;grid-template-columns: 1fr;justify-content: center; }
  .spacer{ display: none; }                 /* Ortada boşluk yaratmasın */
  .topbar .btn{ padding: 8px 12px; font-size: .85rem; }
}

/* 480px ve altı: butonlar iki sütuna dizilsin, "Ara" butonu alt satıra tam gelsin */
@media (max-width: 480px){
  .topbar{ display: grid;grid-template-columns: 1fr; gap: 8px; }
  .topbar .btn{ flex: 1 1 48%; text-align: center; } /* 2 sütun */
  .topbar .btn.btn--accent{ flex-basis: 100%; order: 3; } /* Rezervasyon için Ara en altta tam genişlik */
}

/* WordPress Plugin Specific Classes - Higher Specificity */
body .indra-menu-container,
body .wrap.indra-menu-container {
  background: var(--bg) !important;
  color: var(--text) !important;
  font: 16px/1.45 ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Inter, Arial !important;
  margin: 0 !important;
  padding: 10px !important;
  max-width: 100% !important;
}

body .indra-menu-header,
body .topbar { display: flex !important; align-items: center !important; gap: 16px !important; margin-bottom: 20px !important; padding: 12px 0 !important; }
body .indra-menu-logo,
body .logo { display: flex !important; align-items: center !important; gap: 10px !important; text-decoration: none !important; color: inherit !important; }
body .indra-menu-logo img,
body .logo img { height: 35px !important; }
body .indra-menu-spacer,
body .spacer { flex: 1 !important; }
body .indra-menu-btn,
body .btn { appearance: none !important; border: 1px solid var(--divider) !important; background: transparent !important; color: var(--text) !important; padding: 10px 14px !important; border-radius: 999px !important; cursor: pointer !important; text-decoration: none !important; display: inline-flex !important; gap: 10px !important; align-items: center !important; font-size: 0.85rem !important; }
body .indra-menu-btn:hover,
body .btn:hover { border-color: #2a3845 !important; }
body .indra-menu-btn--accent,
body .btn--accent { background: linear-gradient(172deg, #3ce544, #25bc70) !important; color: #07120c !important; border-color: transparent !important; box-shadow: 0 6px 20px rgb(116 179 41 / 35%) !important; }
body .indra-menu-btn--ghost,
body .btn--ghost { background: rgba(255,255,255,.04) !important; }
body .indra-menu-btn svg,
body .btn svg { opacity: .9 !important; }

/* Header Language Selector */
body .header-language-selector { display: flex !important; gap: 4px !important; margin-right: 12px !important; }
body .lang-link { 
    appearance: none !important; 
    border: 1px solid var(--divider) !important; 
    background: var(--chip) !important; 
    color: var(--text) !important; 
    padding: 6px 10px !important; 
    border-radius: 999px !important; 
    cursor: pointer !important; 
    font-size: 11px !important; 
    text-decoration: none !important;
    transition: all 0.2s ease !important;
    display: inline-flex !important;
    align-items: center !important;
}
body .lang-link:hover { border-color: var(--accent) !important; background: rgba(255,255,255,.08) !important; }
body .lang-link.active { 
    background: var(--accent) !important; 
    color: #07120c !important; 
    border-color: var(--accent) !important; 
}

body .indra-menu-tools,
body .tools { position: sticky !important; top: 0 !important; z-index: 19 !important; background: var(--bg) !important; border-bottom: 1px solid var(--divider) !important; border-radius: 10px !important; padding: 10px !important; }
body .indra-menu-tools-inner,
body .tools__in { padding: 12px !important; display: grid !important; gap: 10px !important; }

/* Language Selector */
body .language-selector { display: flex !important; gap: 8px !important; margin-bottom: 10px !important; }
body .lang-btn { 
    appearance: none !important; 
    border: 1px solid var(--divider) !important; 
    background: var(--chip) !important; 
    color: var(--text) !important; 
    padding: 6px 12px !important; 
    border-radius: 999px !important; 
    cursor: pointer !important; 
    font-size: 12px !important; 
    transition: all 0.2s ease !important;
}
body .lang-btn:hover { border-color: var(--accent) !important; }
body .lang-btn.active { 
    background: var(--accent) !important; 
    color: #07120c !important; 
    border-color: var(--accent) !important; 
}
body .indra-menu-search,
body .search { display: flex !important; align-items: center !important; gap: 10px !important; background: var(--card) !important; border: 1px solid var(--divider) !important; border-radius: 999px !important; padding: 10px 14px !important; }
body .indra-menu-search input,
body .search input { flex: 1 !important; background: transparent !important; border: 0 !important; color: var(--text) !important; font-size: 16px !important; outline: none !important; }
body .indra-menu-pillbar,
body .pillbar { display: flex !important; gap: 8px !important; overflow: auto hidden !important; scrollbar-width: none !important; -ms-overflow-style: none !important; }
body .indra-menu-pillbar::-webkit-scrollbar,
body .pillbar::-webkit-scrollbar { display: none !important; }
body .indra-menu-pill,
body .pill { white-space: nowrap !important; padding: 8px 12px !important; border-radius: 999px !important; background: var(--chip) !important; border: 1px solid var(--divider) !important; font-size: 13px !important; text-decoration: none !important; color: #ffffff !important; cursor: pointer !important; }
body .indra-menu-pill[data-active="1"],
body .pill[data-active="1"] { background: transparent !important; border-color: var(--accent) !important; color: var(--accent) !important; }

body .indra-menu-category,
body section { margin: 16px 0 8px !important; scroll-margin-top: 120px !important; }
body .indra-menu-category-title,
body .cat { margin: 16px 0 8px !important; font-size: 13px !important; color: var(--muted) !important; letter-spacing: .08em !important; text-transform: uppercase !important; }
body .indra-menu-items,
body .vlist { display: grid !important; gap: 10px !important; }
body .indra-menu-item,
body .item { display: grid !important; grid-template-columns: 88px 1fr auto !important; gap: 12px !important; align-items: center !important; background: var(--card) !important; border: 1px solid var(--divider) !important; border-radius: var(--radius) !important; box-shadow: var(--shadow) !important; padding: var(--pad) !important; cursor: pointer !important; }
body .indra-menu-item-thumb,
body .thumb { width: 88px !important; height: 88px !important; border-radius: 14px !important; border: 1px solid var(--divider) !important; display: flex !important; align-items: center !important; justify-content: center !important; position: relative !important; overflow: hidden !important; background: radial-gradient(120% 100% at 0% 0%, #1c242b 0%, #0f151a 60%) !important; }
body .indra-menu-item-thumb::before,
body .thumb::before { content: attr(data-emoji) !important; font-size: 40px !important; filter: drop-shadow(0 4px 10px rgba(0,0,0,.35)) !important; }
body .indra-menu-item-thumb::after,
body .thumb::after { content: "" !important; position: absolute !important; inset: 0 !important; background: repeating-linear-gradient(45deg, rgba(255,255,255,.03) 0 2px, transparent 2px 4px) !important; mix-blend-mode: soft-light !important; opacity: .6 !important; }
body .indra-menu-item-info { display: flex !important; flex-direction: column !important; gap: 4px !important; }
body .indra-menu-item-name,
body .title { font-size: 16px !important; font-weight: 600 !important; color: var(--text) !important; }
body .indra-menu-item-description,
body .meta { color: var(--muted) !important; font-size: 13px !important; line-height: 1.4 !important; display: flex !important; gap: 8px !important; flex-wrap: wrap !important; align-items: center !important; }
body .indra-menu-item-price,
body .price { font-variant-numeric: tabular-nums !important; letter-spacing: .3px !important; font-weight: 600 !important; color: var(--accent) !important; }
body .indra-menu-item-price .currency,
body .price .cur { opacity: .75 !important; margin-right: 2px !important; }
body .indra-menu-time,
body .time { display: inline-flex !important; align-items: center !important; gap: 6px !important; font-size: 12px !important; padding: 4px 8px !important; border-radius: 999px !important; background: var(--chip) !important; border: 1px solid var(--divider) !important; color: #cfe7d9 !important; }
body .indra-menu-time::before,
body .time::before { content: "⏱" !important; }

.indra-menu-footer { margin-top: 38px; padding-top: 18px; border-top: 1px solid var(--divider); color: var(--muted); font-size: 13px; display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.indra-menu-footer a { color: #fff; text-decoration: none; }
.indra-menu-note { color: var(--muted); text-align: center; font-size: 12px; margin: 14px 16px; }

.indra-menu-loading, .indra-menu-error, .indra-menu-empty { text-align: center; padding: 40px; color: var(--muted); font-size: 1.1rem; }
.indra-menu-error { color: #ff6b6b; background: rgba(255, 107, 107, 0.1); border-radius: var(--radius); margin: 20px 0; }

/* Legacy support */
.indra-menu-actions { display: flex; gap: 10px; }
.indra-menu-refresh { background: var(--accent); color: #07120c; border: none; padding: 8px 16px; border-radius: 999px; cursor: pointer; font-size: 14px; transition: all 0.3s ease; box-shadow: 0 4px 15px rgba(41, 179, 125, 0.3); }
.indra-menu-refresh:hover { background: linear-gradient(172deg, #3ce544, #25bc70); transform: translateY(-1px); }
.indra-menu-refresh:disabled { background: var(--muted); cursor: not-allowed; transform: none; }
.indra-menu-content { margin-bottom: 30px; }
.indra-menu-meta { color: var(--muted); font-size: 0.9rem; margin: 0; }