/* ==========================================================================
   1. ROOT / THEME TOKENS
   ========================================================================== */
:root{
  --brown-900:#3a1d14;
  --brown-800:#4a2417;
  --brown-700:#5c2e1e;
  --brown-600:#6b3624;
  --orange-600:#c1502e;
  --orange-500:#cf5f38;
  --orange-400:#e0784f;
  --yellow-400:#f6b93b;
  --cream-100:#fdf6f2;
  --white:#ffffff;
  --ink-900:#2b1a12;
  --ink-500:#8a6b5c;
  --muted-onbrown:#e8c6b8;
  --radius-card:22px;
  --radius-product:18px;
  --radius-pill:30px;
  --shadow-soft:0 10px 25px rgba(58,29,20,0.15);
  --shadow-strong:0 14px 30px rgba(58,29,20,0.28);
  --ease:cubic-bezier(.4,0,.2,1);
}

*{margin:0;padding:0;box-sizing:border-box;}

body{
  font-family:'Poppins',sans-serif;
  background:#e9e2dd;
  color:var(--ink-900);
  -webkit-font-smoothing:antialiased;
}

button{font-family:inherit;border:none;cursor:pointer;background:none;color:inherit;}
input,textarea{font-family:inherit;}
img{display:block;max-width:100%;}

/* ==========================================================================
   2. APP SHELL
   ========================================================================== */
.app{
  max-width:420px;
  margin:0 auto;
  height:100vh;
  height:100dvh;            /* mobil tarayıcı çubuğu dinamik yükseklik */
  background:var(--brown-700);
  position:relative;
  overflow:hidden;          /* hiçbir zaman dışarı taşmasın */
  box-shadow:0 0 60px rgba(0,0,0,0.25);
}

/* Her screen .app içinde tam ekran kaplar (position:absolute) —
   böylece sepet/ürün detay tıklanınca "yeni sayfa" gibi tam kaplar,
   altına eklenmez. */
.screen{
  display:none;
  position:absolute;
  inset:0;
  flex-direction:column;
  animation:fadeIn .3s var(--ease);
  overflow-y:auto;          /* içerik uzunsa screen kendi içinde scroll eder */
  background:var(--brown-700);
}
.screen.active{display:flex;}

@keyframes fadeIn{from{opacity:0;transform:translateY(6px);}to{opacity:1;transform:translateY(0);}}

/* ==========================================================================
   3. TOP HEADER (shared)
   ========================================================================== */
.topbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:22px 20px 10px;
  color:var(--white);
}

.icon-btn{
  width:38px;height:38px;
  border-radius:50%;
  background:rgba(255,255,255,0.14);
  display:flex;align-items:center;justify-content:center;
  color:var(--white);
  font-size:15px;
  transition:transform .3s var(--ease), background .3s var(--ease);
  position:relative;
  flex-shrink:0;
}
.icon-btn:hover{transform:scale(1.06);background:rgba(255,255,255,0.22);}
.icon-btn.solid{background:var(--white);color:var(--orange-600);}
.icon-btn.solid:hover{background:var(--white);}

.icon-group{display:flex;align-items:center;gap:10px;}

.cart-badge{
  position:absolute;top:-4px;right:-4px;
  background:var(--orange-600);
  color:#fff;
  font-size:10px;font-weight:700;
  width:18px;height:18px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  border:2px solid var(--brown-700);
}
.icon-btn.solid .cart-badge{border-color:var(--white);}

/* ==========================================================================
   4. HOME SCREEN — brand header (logo + name, clickable) + search
   ========================================================================== */
.brand-header{
  padding:6px 20px 0;        /* padding-bottom:0 — feed search-box'a sıfır mesafe */
  color:var(--white);
  background:var(--brown-700);
  position:sticky;
  top:0;
  z-index:30;
  flex-shrink:0;
}

.brand-mini{
  display:flex;align-items:center;gap:10px;
  cursor:pointer;
  transition:opacity .2s var(--ease);
}
.brand-mini:hover{opacity:.85;}
.brand-logo-circle{
  width:40px;height:40px;border-radius:50%;
  background:var(--orange-600);
  display:flex;align-items:center;justify-content:center;
  color:var(--yellow-400);
  font-size:16px;
  box-shadow:0 6px 14px rgba(0,0,0,0.25);
  flex-shrink:0;
  overflow:hidden;
}
.brand-logo-circle img{width:100%;height:100%;object-fit:cover;}
.brand-mini-text{display:flex;flex-direction:column;line-height:1.15;}
.brand-mini-name{font-size:16px;font-weight:700;}
.brand-mini-sub{font-size:11px;color:var(--muted-onbrown);font-weight:500;}

.search-box{
  background:var(--white);
  border-radius:var(--radius-pill);
  display:flex;align-items:center;gap:10px;
  padding:13px 18px;
  box-shadow:var(--shadow-soft);
  margin-top:16px;
}
.search-box i{color:var(--ink-500);font-size:14px;}
.search-box input{border:none;outline:none;flex:1;font-size:14px;color:var(--ink-900);}
.search-box input::placeholder{color:#b7a89e;}

/* ==========================================================================
   5. CATALOG LAYOUT — sticky sidebar + scrollable products
   ========================================================================== */
#screen-home{
  /* display/flex .screen ve .screen.active kurallarından gelir (ID specificity
     sorununu önlemek için buraya display yazmıyoruz). */
  flex-direction:column;
  height:100%;        /* .app (height:100vh) içinde tam kapla */
  min-height:0;       /* flex child taşmasını önler */
}

.catalog{
  display:flex;
  flex:1;
  min-height:0;
  background:var(--brown-700);
  position:relative;           /* kategori scroll okları absolute — bu parent'a göre */
}
/* Arama (search-box) ile menü/kategoriler arasına 5px geçişli bant.
   Kahverengi yukarıda (search-box'a bitişik), şeffaf aşağıda (menüye doğru). */
.catalog::before{
  content:'';
  position:absolute;
  top:0;left:0;right:0;
  height:5px;
  background:linear-gradient(180deg, var(--brown-700) 0%, rgba(0,0,0,0) 100%);
  z-index:5;
  pointer-events:none;
}

/* --- Sidebar (never scrolls away) --- */
.category-sidebar{
  position:sticky;
  top:0;
  align-self:stretch;
  height:100%;
  width:64px;
  flex:0 0 64px;
  display:flex;
  flex-direction:column;
  background:transparent;
  overflow-y:auto;
  scrollbar-width:none;              /* Firefox — scrollbar gizle */
  -ms-overflow-style:none;           /* IE/Edge — scrollbar gizle */
  padding-top:10px;
}
.category-sidebar::-webkit-scrollbar{display:none;}   /* Chrome/Safari — scrollbar gizle */

/* Aşağı/yukarı ok göstergeleri */
.cat-scroll-arrow{
  position:absolute;
  left:0;
  width:64px;
  height:28px;
  display:flex;align-items:center;justify-content:center;
  color:var(--yellow-400);
  font-size:16px;
  z-index:10;
  pointer-events:auto;
  cursor:pointer;
  transition:opacity .2s;
}
.cat-scroll-arrow.bottom{
  bottom:0;
  background:linear-gradient(0deg, rgba(74,36,23,0.95) 0%, rgba(74,36,23,0) 100%);
}
.cat-scroll-arrow.top{
  top:0;
  background:linear-gradient(180deg, rgba(74,36,23,0.95) 0%, rgba(74,36,23,0) 100%);
}
.cat-scroll-arrow.hidden{opacity:0;pointer-events:none;}

.category-item{
  flex:1 0 90px;
  display:flex;align-items:center;justify-content:center;
  padding:14px 4px;
  cursor:pointer;
  transition:background .3s var(--ease), color .3s var(--ease), border-radius .3s var(--ease);
  border-radius:0 18px 18px 0;
  margin:2px 0;
}
.category-item.active{
  background:var(--orange-600);
  box-shadow:var(--shadow-soft);
}
.category-item span{
  writing-mode:vertical-rl;
  transform:rotate(180deg);
  font-size:12.5px;
  font-weight:600;
  color:var(--muted-onbrown);
  letter-spacing:.3px;
  transition:color .3s var(--ease);
}
.category-item.active span{color:var(--white);font-weight:700;}
.category-item:not(.active):hover{background:rgba(255,255,255,0.06);}

/* --- Product feed --- */
.product-feed{
  flex:1;
  background:var(--brown-700);
  padding:0 16px 40vh;          /* padding-top:0 — boşluk section-heading margin ile */
  overflow-y:auto;
  height:100%;
  position:relative;         /* offsetTop bu feed'e göre hesaplanır */
}

.category-section{scroll-margin-top:0;margin-bottom:20px;}
.category-section + .category-section{margin-top:10px;}

.section-heading{
  color:var(--white);
  font-size:17px;
  font-weight:700;
  margin:0 0 14px;
  padding:10px 0 0 2px;        /* padding-top:10px (margin collapse yok) — search-box ile boşluk */
}

.product-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}

/* --- Product card --- */
.product-card{
  background:var(--white);
  border-radius:var(--radius-product);
  padding:12px 12px 14px;
  position:relative;
  box-shadow:var(--shadow-soft);
  transition:transform .3s var(--ease), box-shadow .3s var(--ease);
  cursor:pointer;
}
.product-card:hover{transform:scale(1.02);box-shadow:var(--shadow-strong);}

/* v3: Saat zamanlama — ürün şu an siparişe açık değil */
.product-card.time-unavailable{
  opacity:.75;
  cursor:default;
}
.product-card.time-unavailable:hover{transform:none;box-shadow:var(--shadow-soft);}

.card-photo{
  width:100%;
  aspect-ratio:1/0.85;
  border-radius:14px;
  overflow:hidden;
  margin-bottom:10px;
  background:linear-gradient(145deg,#f3e3d8,#e9cdba);
  position:relative;
}
.card-photo img{width:100%;height:100%;object-fit:cover;}
/* Resmi olmayan ürünler için icon yer tutucu */
.card-photo .no-photo{
  width:100%;height:100%;
  display:flex;align-items:center;justify-content:center;
  color:#c98a63;font-size:42px;
  background:linear-gradient(145deg,#f3e3d8,#e9cdba);
}

/* Best-seller tag: subtle ribbon centered horizontally over the bottom edge of the photo */
/* "En Çok Tercih Edilen" rozeti: ürün görselinin alt kenarına yapışık,
   soldan ve sağdan görsel kenarına sıfır (tam genişlik), yazı+ikon ortalı,
   arkaplan tam (yarı saydam değil solid). */
.badge-best{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  background:rgba(43,26,18,0.92);
  backdrop-filter:blur(2px);
  color:var(--yellow-400);
  font-size:9.5px;
  font-weight:700;
  padding:6px 8px;
  border-radius:0 0 14px 14px;   /* görselin alt köşeleriyle uyumlu */
  z-index:2;
  letter-spacing:.2px;
  display:flex;align-items:center;justify-content:center;gap:4px;
  white-space:nowrap;
  width:100%;
  text-align:center;
}
.badge-best i{font-size:9px;}

/* v3: Saat zamanlama overlay — ürün fotoğrafının üzerine */
.product-time-overlay{
  position:absolute;
  inset:0;
  background:rgba(43,26,18,0.65);
  backdrop-filter:blur(2px);
  border-radius:14px;
  z-index:3;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:6px;
  padding:10px;
  color:var(--white);
  text-align:center;
}
.product-time-overlay .time-overlay-icon{
  font-size:22px;
  color:var(--yellow-400);
}
.product-time-overlay .time-overlay-text{
  font-size:11px;
  font-weight:600;
  line-height:1.35;
  max-width:140px;
}

.card-name{font-size:13.5px;font-weight:600;color:var(--ink-900);line-height:1.3;margin-bottom:4px;}
.card-price{font-size:14px;font-weight:700;color:var(--orange-600);}

/* Fiyat + Sepete Ekle satırı — fiyat solda, buton sağda, yatayda hizalı */
.card-price-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:4px;
  margin-top:2px;
}
/* online sipariş kapalıyken "+" butonu yok — fiyatı sola yasla, kart normale göre biraz sade */
.card-price-row:not(:has(.card-add-btn)){
  justify-content:flex-start;
}
.card-price-row .card-price:only-child{
  font-size:14px;
}
/* Aynı kart için "online sipariş kapalı" rozeti (renderFeed tarafından eklenmez; sadece not) */
.card-price-row.is-orders-disabled .card-add-btn{ display:none; }
.card-price{
  font-size:14px;
  font-weight:700;
  color:var(--orange-600);
  white-space:nowrap;            /* ₺ işareti alt satıra kaymasın */
}
.card-add-btn{
  background:var(--orange-600);
  color:#fff;
  border:none;
  width:32px;                   /* yuvarlak */
  height:32px;
  border-radius:50%;            /* tam yuvarlak */
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  padding:0;
  transition:background .2s var(--ease), transform .2s var(--ease);
}
.card-add-btn:hover{background:var(--orange-500);transform:scale(1.1);}
.card-add-btn i{font-size:14px;line-height:1;}

/* v3: Yorum puan — ürün kartında rating */
.card-rating{
  display:flex;
  align-items:center;
  gap:3px;
  margin-bottom:2px;
  font-size:11px;
}
.card-rating .stars{
  display:inline-flex;
  align-items:center;
  gap:1px;
  color:var(--yellow-400);
  font-size:10px;
}
.card-rating .stars .fa-regular.fa-star{color:#d4c4b8;}
.card-rating .rating-val{
  font-weight:700;
  color:var(--orange-600);
  font-size:11px;
}
.card-rating .rating-count{
  color:var(--ink-500);
  font-size:10px;
  font-weight:500;
}

/* ==========================================================================
   6. PRODUCT DETAIL SCREEN
   ========================================================================== */
/* Hero alanı: kahverengi arkaplan, görsel ortalanmış, ekranın üst yarısını kaplar.
   Ürün adı (detail-card içinde) aşağıda, görsel onun üstünde durur.
   Görsel kare + köşeleri oval, ince çerçeve, beyaz card'ın üstüne taşar. */
.detail-hero{
  padding:48px 30px 20px;     /* üst padding artırıldı — görsel daha aşağıda */
  margin:0;
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:300px;
  background:var(--brown-700);
}
.detail-photo-oval{
  width:280px;                /* büyük */
  height:280px;
  border-radius:24px;         /* kare + köşeleri oval (daire değil) */
  overflow:hidden;
  box-shadow:none;            /* gölge efekti kaldırıldı */
  border:3px solid #4a2417;   /* ince çizgi + koyu kahverengi */
  flex-shrink:0;
  position:relative;
  z-index:3;                  /* detail-card'ın üstünde dursun */
}
.detail-photo-oval img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
/* Ürün detayında resmi olmayan ürünler için icon yer tutucu */
.detail-photo-oval .no-photo{
  width:100%;height:100%;
  display:flex;align-items:center;justify-content:center;
  color:#c98a63;font-size:90px;
  background:linear-gradient(145deg,#f3e3d8,#e9cdba);
}

.detail-card{
  background:var(--white);
  border-radius:28px 28px 0 0;
  margin-top:-40px;          /* görsel card'ın üstüne daha çok taşar (20px→40px) */
  position:relative;
  z-index:2;
  flex:1;
  padding:46px 24px 30px;    /* üst padding 6px artırıldı (40→46) — ürün adı + tüm içerik 6px aşağıda */
  display:flex;flex-direction:column;
  box-shadow:0 -10px 30px rgba(0,0,0,0.15);
}
.detail-top-row{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:8px;}
.detail-name{font-size:20px;font-weight:700;}

.detail-badge{
  display:inline-flex;align-items:center;gap:6px;
  background:var(--cream-100);
  color:var(--orange-600);
  font-size:10.5px;font-weight:700;
  padding:6px 12px;border-radius:20px;
  margin:6px 0 16px;
}
.detail-badge i{color:var(--yellow-400);font-size:10px;}

.detail-price{font-size:22px;font-weight:800;color:var(--ink-900);margin-bottom:16px;}

.stepper{display:flex;align-items:center;gap:16px;margin-bottom:20px;}
.stepper button{
  width:34px;height:34px;border-radius:50%;
  background:var(--orange-600);color:#fff;font-size:15px;font-weight:700;
  display:flex;align-items:center;justify-content:center;
  transition:transform .2s var(--ease);
}
.stepper button:hover{transform:scale(1.08);}
.stepper .qty{font-size:16px;font-weight:700;min-width:20px;text-align:center;}

.detail-desc{color:var(--ink-500);font-size:13.5px;line-height:1.6;margin-bottom:24px;}

/* v3: Saat zamanlama banner — detay ekranı */
.detail-time-banner{
  display:flex;
  align-items:center;
  gap:10px;
  background:var(--cream-100);
  border-left:4px solid var(--orange-600);
  border-radius:14px;
  padding:12px 14px;
  margin-bottom:16px;
  font-size:13px;
  color:var(--ink-900);
  font-weight:600;
}
.detail-time-banner i{
  color:var(--orange-600);
  font-size:16px;
  flex-shrink:0;
}
.detail-time-banner strong{
  color:var(--orange-600);
}

/* v3: Yorum puan — detay ekranı rating */
.detail-rating-row{
  display:flex;
  align-items:center;
  gap:4px;
  margin-bottom:8px;
  font-size:12px;
}
.detail-rating-row .stars{
  display:inline-flex;
  align-items:center;
  gap:2px;
  color:var(--yellow-400);
  font-size:13px;
}
.detail-rating-row .stars .fa-regular.fa-star{color:#d4c4b8;}
.detail-rating-row .rating-val{
  font-weight:700;
  color:var(--orange-600);
  font-size:13px;
}
.detail-review-count{
  color:var(--ink-500);
  font-size:11px;
  font-weight:500;
}

/* v3: Yorum listesi — detay ekranı */
.detail-reviews-title{
  font-size:14px;
  font-weight:700;
  color:var(--ink-900);
  margin:18px 0 10px;
  display:flex;
  align-items:center;
  gap:6px;
}
.detail-reviews-title i{
  color:var(--orange-600);
  font-size:13px;
}
.detail-review-item{
  background:var(--cream-100);
  border-radius:14px;
  padding:10px 12px;
  margin-bottom:8px;
}
.detail-review-item .review-item-stars{
  display:inline-flex;
  align-items:center;
  gap:1px;
  color:var(--yellow-400);
  font-size:11px;
}
.detail-review-item .review-item-stars .fa-regular.fa-star{color:#d4c4b8;}
.detail-review-item .review-item-stars .rating-val{
  font-weight:700;
  color:var(--orange-600);
  font-size:11px;
  margin-left:3px;
}
.detail-review-item .review-item-comment{
  font-size:12px;
  color:var(--ink-900);
  line-height:1.5;
  margin-top:4px;
}
.detail-review-item .review-item-date{
  font-size:10px;
  color:var(--ink-500);
  margin-top:4px;
}

.btn-primary{
  margin-top:auto;
  background:var(--orange-600);
  color:#fff;
  padding:16px;
  border-radius:var(--radius-pill);
  font-size:15px;font-weight:700;
  text-align:center;
  transition:transform .2s var(--ease), background .3s var(--ease);
  box-shadow:0 10px 20px rgba(193,80,46,0.35);
}
.btn-primary:hover{transform:translateY(-2px);background:var(--orange-500);}
.btn-primary:active{transform:translateY(0);}

.btn-outline{
  background:rgba(255,255,255,0.1);
  color:#fff;
  padding:16px;
  border-radius:var(--radius-pill);
  font-size:15px;font-weight:700;
  text-align:center;
  border:1.5px solid rgba(255,255,255,0.55);
  transition:transform .2s var(--ease), background .3s var(--ease);
}
.btn-outline:hover{transform:translateY(-2px);background:rgba(255,255,255,0.18);}
.btn-outline i{margin-right:8px;}

/* ==========================================================================
   7. CART SCREEN
   ========================================================================== */
.cart-title-row{padding:20px 20px 6px;display:flex;align-items:center;justify-content:space-between;color:var(--white);}
.cart-title-row h1{font-size:20px;font-weight:700;}

.cart-body{
  background:var(--white);
  border-radius:28px 28px 0 0;
  flex:1;
  margin-top:14px;
  padding:22px 20px 26px;
  display:flex;flex-direction:column;
}

.cart-item{
  display:flex;align-items:center;gap:12px;
  padding:10px 0;
  border-bottom:1px solid #f1e8e2;
  position:relative;
}
.cart-item-photo{width:56px;height:56px;border-radius:14px;overflow:hidden;background:#f3e3d8;flex-shrink:0;}
.cart-item-photo img{width:100%;height:100%;object-fit:cover;}
.cart-item-info{flex:1;min-width:0;}
.cart-item-name{font-size:14px;font-weight:600;margin-bottom:2px;}
.cart-item-price{font-size:13px;font-weight:700;color:var(--orange-600);}
.cart-item-remove{
  position:absolute;top:8px;right:0;
  width:22px;height:22px;border-radius:50%;
  background:#f4ede9;color:var(--ink-500);
  display:flex;align-items:center;justify-content:center;font-size:11px;
  transition:background .2s var(--ease), color .2s var(--ease);
}
.cart-item-remove:hover{background:var(--orange-600);color:#fff;}
.cart-item-stepper{display:flex;align-items:center;gap:10px;margin-top:6px;}
.cart-item-stepper button{
  width:22px;height:22px;border-radius:50%;background:var(--orange-600);color:#fff;font-size:11px;font-weight:700;
  display:flex;align-items:center;justify-content:center;
}
.cart-item-stepper .qty{font-size:13px;font-weight:600;min-width:14px;text-align:center;}

.empty-cart{text-align:center;padding:50px 20px;color:var(--ink-500);}
.empty-cart i{font-size:38px;color:#e6d2c6;margin-bottom:14px;display:block;}

.coupon-box{
  margin-top:18px;
  background:var(--cream-100);
  border:1px dashed #e4c3ac;
  border-radius:16px;
  padding:14px;
}
.coupon-label{display:flex;align-items:center;gap:8px;font-size:12.5px;font-weight:600;color:var(--ink-900);margin-bottom:10px;}
.coupon-label i{color:var(--orange-600);}
.coupon-row{display:flex;gap:8px;}
.coupon-row input{
  flex:1;border:1px solid #e8d7cb;border-radius:12px;padding:11px 14px;font-size:13px;outline:none;background:#fff;
}
.coupon-row input:focus{border-color:var(--orange-500);}
.coupon-btn{
  background:var(--orange-600);color:#fff;font-size:13px;font-weight:600;
  padding:0 18px;border-radius:12px;transition:background .2s var(--ease);
}
.coupon-btn:hover{background:var(--orange-500);}
.coupon-msg{font-size:11.5px;margin-top:8px;font-weight:600;}
.coupon-msg.success{color:#2e8b57;}
.coupon-msg.error{color:#c1502e;}

.cart-summary{margin-top:20px;}
.summary-row{display:flex;justify-content:space-between;font-size:13.5px;color:var(--ink-500);padding:5px 0;}
.summary-row.discount{color:#2e8b57;font-weight:600;}
.summary-row.total{
  font-size:17px;font-weight:800;color:var(--ink-900);
  border-top:1px solid #f1e8e2;margin-top:8px;padding-top:14px;
}

/* ==========================================================================
   8. TABLE / MASA SCREEN (garson çağırma + hesap isteme)
   ========================================================================== */
.table-screen-body{
  flex:1;display:flex;flex-direction:column;align-items:center;
  padding:40px 30px;color:var(--white);text-align:center;
}
.table-label{font-size:14px;color:var(--muted-onbrown);font-weight:600;margin-bottom:14px;letter-spacing:.3px;}
.table-number{
  background:var(--orange-600);
  color:#fff;font-size:34px;font-weight:800;
  padding:16px 40px;border-radius:20px;
  box-shadow:0 14px 26px rgba(193,80,46,0.4);
  margin-bottom:50px;
}
.waiter-icon{
  width:100px;height:100px;border-radius:50%;
  background:rgba(255,255,255,0.12);
  display:flex;align-items:center;justify-content:center;
  font-size:38px;color:var(--white);
  margin-bottom:30px;
}
.table-question{font-size:19px;font-weight:700;margin-bottom:10px;}
.table-sub{font-size:13.5px;color:var(--muted-onbrown);line-height:1.6;margin-bottom:30px;max-width:280px;}
.btn-waiter{
  width:100%;
  background:var(--orange-600);
  color:#fff;font-size:16px;font-weight:700;
  padding:18px;border-radius:var(--radius-pill);
  box-shadow:0 14px 26px rgba(193,80,46,0.4);
  transition:transform .2s var(--ease), background .3s var(--ease);
  margin-bottom:12px;
}
.btn-waiter:hover{transform:translateY(-2px);background:var(--orange-500);}
.btn-waiter.called{background:#2e8b57;}
.btn-bill{
  width:100%;
  background:transparent;
  color:#fff;font-size:15px;font-weight:700;
  padding:16px;border-radius:var(--radius-pill);
  border:1.5px solid rgba(255,255,255,0.55);
  transition:transform .2s var(--ease), background .3s var(--ease);
  margin-bottom:6px;
}
.btn-bill:hover{transform:translateY(-2px);background:rgba(255,255,255,0.18);}
.btn-bill.called{background:#2e8b57;border-color:#2e8b57;}
.btn-back-home{
  margin-top:8px;
  font-size:13px;font-weight:600;color:var(--muted-onbrown);
  padding:10px;
}
.btn-back-home:hover{color:var(--white);}

/* ==========================================================================
   9. WELCOME / SPLASH SCREEN (tam ekran — 100vh)
   ========================================================================== */
#screen-welcome{
  padding:0;
  height:100%;          /* .app (height:100vh) içinde tam kapla */
  min-height:0;
  overflow:hidden;
  /* display:flex BURADA YAZILMAZ — ID selector .screen{display:none} kuralını
     ezer ve welcome ekranı hiçbir zaman gizlenmez. .screen.active{display:flex}
     active class'ı ile flex olur. */
  flex-direction:column;
}
.welcome-hero{
  flex:0 0 auto;
  height:25vh;
  min-height:120px;
  max-height:220px;
  background-image:url('https://images.pexels.com/photos/302896/pexels-photo-302896.jpeg?auto=compress&cs=tinysrgb&w=900');
  background-size:cover;
  background-position:center;
  position:relative;
}
.welcome-hero::after{
  content:'';
  position:absolute;inset:0;
  background:linear-gradient(180deg, rgba(58,29,20,0.05) 30%, var(--brown-700) 96%);
}
.welcome-card{
  background:var(--white);
  border-radius:32px 32px 0 0;
  margin-top:-30px;
  flex:1;
  min-height:0;
  position:relative;
  z-index:2;
  padding:28px 24px 12px;       /* padding-bottom:22px→12px — alt stack aşağıya yapışık dursun */
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  overflow-y:auto;             /* visible→auto: içerik taşarsa welcome-card kendi içinde scroll etsin */
  scrollbar-width:none;        /* Firefox — scrollbar gizle */
  -ms-overflow-style:none;     /* IE/Edge — scrollbar gizle */
}
.welcome-card::-webkit-scrollbar{display:none;}  /* Chrome/Safari — scrollbar gizle */

/* İşletme bilgileri grubu (logo + isim + tagline + greeting/qr-hint + masa pill) — en üstte */
.welcome-business-info{
  display:flex;
  flex-direction:column;
  align-items:center;
  width:100%;
  /* işletme bilgilerinin bittiği yerden 5px aşağıda beyaz kart bitsin diye
     bu grubun altına padding-bottom eklenir — welcome-card padding ile ayarlanır */
}

/* Alt stack: butonlar üstte, sosyal iconlar en altta — aşağıya yapışık */
.welcome-bottom-stack{
  margin-top:auto;             /* işletme bilgileri ile arayı açar, en alta yapışır */
  display:flex;
  flex-direction:column;
  align-items:center;
  width:100%;
  gap:14px;
}
.welcome-logo-circle{
  width:60px;height:60px;border-radius:50%;
  background:var(--orange-600);
  display:flex;align-items:center;justify-content:center;
  color:var(--yellow-400);font-size:24px;
  box-shadow:0 12px 24px rgba(193,80,46,0.35);
  margin-top:-25px;             /* -30px→-25px: logo 5px aşağı kaydırıldı, hero ile çakışmasın */
  margin-bottom:12px;
  border:5px solid var(--white);
  overflow:hidden;
  flex-shrink:0;
  position:relative;
  z-index:3;                    /* welcome-hero::after üzerinde dursun */
}
.welcome-logo-circle img{width:100%;height:100%;object-fit:cover;}
.welcome-brand{
  font-family:'Playfair Display', serif;
  font-size:24px;
  font-weight:800;
  color:var(--ink-900);
  margin-bottom:4px;
  letter-spacing:.2px;
}
.welcome-tagline{font-size:11.5px;color:var(--ink-500);font-weight:500;letter-spacing:.4px;text-transform:uppercase;margin-bottom:12px;}
.welcome-greeting{font-size:14px;color:var(--orange-600);font-weight:700;margin-bottom:12px;}
.welcome-greeting.hidden{display:none;}

/* QR yok ekranı yerine welcome'da gösterilen bilgilendirme mesajı */
.welcome-qr-hint{
  font-size:13px;color:var(--ink-500);font-weight:600;
  line-height:1.5;margin-bottom:14px;max-width:260px;
}

.welcome-table-pill{
  display:inline-flex;align-items:center;gap:8px;
  background:var(--cream-100);
  border:1px dashed #e4c3ac;
  color:var(--ink-900);
  font-size:12.5px;font-weight:600;
  padding:8px 16px;border-radius:20px;
  margin-bottom:16px;
}
.welcome-table-pill i{color:var(--orange-600);}
.welcome-table-pill strong{color:var(--orange-600);font-size:14px;}

/* DUYURU KARTI (welcome ekranı) — işletme bilgileri ile alt buton stack arasında.
   Aktif duyuru varsa JS .show ekler; yoksa display:none kalır. */
.welcome-announcement{
  display:none;                  /* varsayılan gizli — JS .show ekleyince flex olur */
  width:100%;
  background:var(--cream-100);
  border-left:4px solid var(--orange-600);
  border-radius:14px;
  padding:12px 14px;
  margin:6px 0 14px;
  text-align:left;               /* welcome-card text-align:center'ını ezdik */
  box-shadow:0 4px 12px rgba(193,80,46,0.08);
}
.welcome-announcement.show{
  display:flex;
  gap:10px;
  align-items:flex-start;
}
.welcome-announcement .wa-icon{
  flex-shrink:0;
  width:30px;height:30px;border-radius:50%;
  background:var(--orange-600);
  color:var(--white);
  display:flex;align-items:center;justify-content:center;
  font-size:14px;
}
.welcome-announcement .wa-body{
  flex:1;
  min-width:0;
}
.welcome-announcement .wa-title{
  font-size:13px;font-weight:700;
  color:var(--brown-700);
  margin-bottom:4px;
  line-height:1.3;
}
.welcome-announcement .wa-message{
  font-size:12.5px;color:var(--ink-900);line-height:1.45;
  word-break:break-word;white-space:pre-wrap;
}
.welcome-announcement .wa-toggle{
  background:none;border:none;cursor:pointer;
  color:var(--orange-600);font-weight:700;font-size:12px;
  padding:0;margin-top:6px;
  text-decoration:underline;
}
.welcome-announcement .wa-toggle:hover{color:var(--orange-500);}

/* Carousel noktaları — birden fazla duyuru varsa balonun altında.
   Aktif duyuru dolu turuncu, diğerleri boş (outlined). */
.welcome-announcement .wa-dots{
  display:flex;
  flex-direction:row;
  gap:6px;
  margin-top:8px;
  padding-top:4px;
}
.welcome-announcement .wa-dot{
  width:8px;height:8px;border-radius:50%;
  background:transparent;
  border:1.5px solid var(--orange-600);
  cursor:pointer;
  padding:0;margin:0;
  transition:background .2s var(--ease), transform .15s var(--ease);
  flex-shrink:0;
}
.welcome-announcement .wa-dot:hover{transform:scale(1.15);}
.welcome-announcement .wa-dot.is-active{
  background:var(--orange-600);
  border-color:var(--orange-600);
}

/* Kısa viewport'lar için duyuru kartı kompakt */
@media (max-height:700px){
  .welcome-announcement{padding:10px 12px;margin:4px 0 10px;}
  .welcome-announcement .wa-icon{width:26px;height:26px;font-size:12px;}
  .welcome-announcement .wa-title{font-size:12.5px;}
  .welcome-announcement .wa-message{font-size:12px;}
}

/* Welcome ekranında sosyal medya ikonları — yan yana 4 tane, ortalı */
.welcome-social{
  display:flex;
  flex-direction:row;            /* yan yana */
  gap:12px;
  justify-content:center;        /* yatayda ortalı */
  padding:4px 0;
}
.welcome-social:empty{display:none;}
.welcome-social a{
  width:48px;height:48px;border-radius:50%;
  background:var(--cream-100);color:var(--orange-600);
  display:flex;align-items:center;justify-content:center;font-size:20px;
  text-decoration:none;          /* alt çizgi kaldırıldı */
  line-height:1;
  transition:background .2s var(--ease), transform .2s var(--ease);
  flex-shrink:0;
}
.welcome-social a:hover{background:var(--orange-600);color:#fff;transform:translateY(-2px);}

.welcome-actions{width:100%;display:flex;flex-direction:column;gap:10px;}
.welcome-actions .btn-primary{margin-top:0;padding:14px;}
.welcome-actions .btn-outline{padding:14px;}
.welcome-actions .btn-outline{
  color:var(--orange-600);
  border:1.5px solid #e8c6b8;
  background:var(--cream-100);
}
.welcome-actions .btn-outline:hover{background:#f7e6dc;}

/* Kısa viewport'lar için welcome içeriği daha da kompakt */
@media (max-height:700px){
  .welcome-hero{height:18vh;min-height:90px;max-height:160px;}
  .welcome-card{padding:22px 22px 18px;}
  .welcome-logo-circle{width:50px;height:50px;font-size:20px;margin-top:-42px;margin-bottom:8px;border-width:4px;}
  .welcome-brand{font-size:21px;margin-bottom:2px;}
  .welcome-tagline{margin-bottom:8px;font-size:11px;}
  .welcome-greeting{margin-bottom:10px;font-size:13px;}
  .welcome-qr-hint{margin-bottom:10px;font-size:12px;}
  .welcome-table-pill{margin-bottom:12px;padding:6px 14px;font-size:11.5px;}
  .welcome-social{gap:10px;}
  .welcome-social a{width:42px;height:42px;font-size:17px;}
  .welcome-actions{gap:8px;}
  .welcome-actions .btn-primary, .welcome-actions .btn-outline{padding:12px;font-size:14px;}
}

/* ==========================================================================
   10. TOAST
   ========================================================================== */
.toast{
  position:fixed;left:50%;bottom:26px;transform:translate(-50%,20px);
  background:var(--ink-900);color:#fff;
  padding:12px 22px;border-radius:var(--radius-pill);
  font-size:13px;font-weight:600;
  opacity:0;pointer-events:none;
  transition:opacity .3s var(--ease), transform .3s var(--ease);
  z-index:999;
  box-shadow:0 10px 24px rgba(0,0,0,0.3);
  max-width:90%;
  display:flex;align-items:center;gap:8px;
}
.toast i{color:var(--yellow-400);}
.toast.show{opacity:1;transform:translate(-50%,0);}

/* ==========================================================================
   11. SCROLLBAR / RESPONSIVE
   ========================================================================== */
.product-feed::-webkit-scrollbar{width:5px;}
.product-feed::-webkit-scrollbar-thumb{background:rgba(255,255,255,0.15);border-radius:10px;}

@media (max-width:380px){
  .category-sidebar{width:56px;flex-basis:56px;}
  .category-item span{font-size:11px;}
  .product-grid{gap:9px;}
  .card-name{font-size:12.5px;}
  /* detail-photo-oval artık tam genişlik — küçük ekranda aspect-ratio korur */
}

/* ==========================================================================
   12. YENİ EKRANLAR — Siparişlerim / Masa kapandı / Modal / Varyasyon / Not
   ========================================================================== */

/* --- Siparişlerim ikonu (sepette yanında) --- */
.icon-btn.my-orders-btn{
  background:rgba(255,255,255,0.14);
  color:var(--white);
  position:relative;
}
.icon-btn.my-orders-btn.solid{
  background:var(--white);
  color:var(--orange-600);
}
.icon-btn.my-orders-btn .cart-badge{
  background:var(--yellow-400);
  color:var(--brown-900);
  border-color:var(--brown-700);
}
.icon-btn.my-orders-btn.solid .cart-badge{
  border-color:var(--white);
}

/* --- Siparişlerim ekranı --- */
.orders-body{
  background:var(--white);
  border-radius:28px 28px 0 0;
  flex:1;
  margin-top:14px;
  padding:22px 20px 26px;
  display:flex;flex-direction:column;
  gap:14px;
  overflow-y:auto;
}
.orders-section-title{
  font-size:13px;font-weight:700;color:var(--ink-500);
  text-transform:uppercase;letter-spacing:.4px;
  margin:6px 0 4px;
}
.order-card{
  background:var(--cream-100);
  border-radius:18px;
  padding:14px 16px;
  border:1px solid #f1e4dc;
}
.order-card-head{
  display:flex;justify-content:space-between;align-items:center;
  margin-bottom:8px;
}
.order-card-id{font-size:13px;font-weight:700;color:var(--ink-900);}
.order-card-time{font-size:11.5px;color:var(--ink-500);}
.order-status-pill{
  display:inline-flex;align-items:center;gap:5px;
  font-size:11px;font-weight:700;
  padding:4px 10px;border-radius:20px;
}
.order-status-pill.yeni{background:#fff3cd;color:#a87c1e;}
.order-status-pill.hazirlaniyor{background:#e3f0ff;color:#1f6fc0;}
.order-status-pill.hazir{background:#e1f4e7;color:#2e8b57;}
.order-status-pill.teslim_edildi{background:#eef0f3;color:#5a6470;}
.order-status-pill.iptal{background:#fdecea;color:#c1502e;}
.order-card-items{
  display:flex;flex-direction:column;gap:4px;
  font-size:13px;color:var(--ink-900);
  padding:8px 0;
  border-top:1px dashed #e3d2c8;
  margin-top:6px;
}
.order-card-item{display:flex;justify-content:space-between;gap:8px;}
.order-card-item .name{flex:1;}
.order-card-item .qty{color:var(--ink-500);font-weight:600;}
.order-card-item .note{font-size:11.5px;color:var(--ink-500);font-style:italic;}
.order-card-foot{
  display:flex;justify-content:space-between;align-items:center;
  margin-top:8px;padding-top:8px;
  border-top:1px solid #f1e4dc;
}
.order-card-total{font-size:14px;font-weight:800;color:var(--orange-600);}
.orders-table-total{
  margin-top:10px;
  background:var(--brown-800);
  color:var(--white);
  border-radius:18px;
  padding:18px 16px;
  display:flex;justify-content:space-between;align-items:center;
}
.orders-table-total .label{font-size:13px;font-weight:600;color:var(--muted-onbrown);}
.orders-table-total .val{font-size:20px;font-weight:800;color:var(--yellow-400);}
.empty-orders{text-align:center;padding:40px 20px;color:var(--ink-500);}
.empty-orders i{font-size:38px;color:#e6d2c6;margin-bottom:14px;display:block;}

/* "Yeni Sipariş Ver" butonu — en alta */
.new-order-btn{
  margin-top:16px;
  width:100%;
}

/* --- Masa kapandı ("Tekrar Bekleriz") ekranı --- */
#screen-closed{padding:0;}
.closed-hero{
  flex:1;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:40px 30px;color:var(--white);text-align:center;
}
.closed-icon{
  width:120px;height:120px;border-radius:50%;
  background:rgba(255,255,255,0.08);
  display:flex;align-items:center;justify-content:center;
  font-size:50px;color:var(--yellow-400);
  margin-bottom:30px;
  border:3px solid rgba(255,255,255,0.18);
}
.closed-title{
  font-family:'Playfair Display', serif;
  font-size:28px;font-weight:800;
  color:var(--white);
  margin-bottom:10px;
}
.closed-sub{
  font-size:14px;color:var(--muted-onbrown);line-height:1.6;
  max-width:280px;margin-bottom:34px;
}
.closed-actions{width:100%;display:flex;flex-direction:column;gap:12px;}

/* --- QR yok / hata ekranı --- */
#screen-noqr{padding:0;}
.noqr-hero{
  flex:1;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:40px 30px;color:var(--white);text-align:center;
}
.noqr-icon{
  width:110px;height:110px;border-radius:50%;
  background:rgba(255,255,255,0.08);
  display:flex;align-items:center;justify-content:center;
  font-size:46px;color:var(--yellow-400);
  margin-bottom:26px;
  border:3px solid rgba(255,255,255,0.18);
}
.noqr-title{font-family:'Playfair Display', serif;font-size:24px;font-weight:800;color:var(--white);margin-bottom:10px;}
.noqr-sub{font-size:14px;color:var(--muted-onbrown);line-height:1.6;max-width:300px;}

/* --- İşletme profil modalı (tam ekran — mobil full, masaüstü ortada büyük kart) --- */
.modal-overlay{
  position:fixed;inset:0;
  background:rgba(43,26,18,0.65);
  backdrop-filter:blur(4px);
  z-index:998;
  display:none;align-items:center;justify-content:center;
  opacity:0;transition:opacity .25s var(--ease);
  padding:20px;
}
.modal-overlay.show{display:flex;opacity:1;}
.business-modal{
  background:var(--white);
  width:100%;max-width:420px;
  border-radius:28px;
  padding:10px 26px 30px;       /* padding-top:10px — logo tam görünsün (margin-top:0 ile) */
  transform:translateY(40px);
  transition:transform .3s var(--ease);
  display:flex;flex-direction:column;align-items:center;text-align:center;
  max-height:100vh;
  overflow-y:auto;
  position:relative;
}
.modal-overlay.show .business-modal{transform:translateY(0);}
.business-modal .modal-close{
  position:absolute;top:14px;right:14px;
  width:34px;height:34px;border-radius:50%;
  background:#f4ede9;color:var(--ink-500);
  display:flex;align-items:center;justify-content:center;font-size:14px;
}
.business-modal .modal-close:hover{background:var(--orange-600);color:#fff;}
.business-modal-logo{
  width:88px;height:88px;border-radius:50%;
  background:var(--orange-600);
  display:flex;align-items:center;justify-content:center;
  color:var(--yellow-400);font-size:36px;
  box-shadow:0 12px 24px rgba(193,80,46,0.35);
  margin-bottom:16px;
  border:5px solid var(--white);
  margin-top:10px;               /* 10px — modal padding-top:10px ile logo tam görünsün, kesilmesin */
  overflow:hidden;
  flex-shrink:0;
}
.business-modal-logo img{width:100%;height:100%;object-fit:cover;}
.business-modal-name{
  font-family:'Playfair Display', serif;
  font-size:22px;font-weight:800;color:var(--ink-900);
  margin-bottom:6px;
}
.business-modal-tagline{font-size:12px;color:var(--ink-500);text-transform:uppercase;letter-spacing:.4px;margin-bottom:18px;}
.business-modal-contact{
  width:100%;display:flex;flex-direction:column;gap:10px;
  margin-bottom:18px;
}
.business-contact-row{
  display:flex;align-items:center;gap:12px;
  background:var(--cream-100);
  padding:12px 14px;border-radius:14px;
  color:var(--ink-900);font-size:13px;font-weight:600;
  text-decoration:none;
  transition:background .2s var(--ease);
}
.business-contact-row:hover{background:#f7e6dc;}
.business-contact-row i{
  width:30px;height:30px;border-radius:50%;
  background:var(--white);color:var(--orange-600);
  display:flex;align-items:center;justify-content:center;font-size:13px;
  flex-shrink:0;
}
/* Sosyal medya satırları (Instagram, Google) — alt alta kart tarzı, telefon/WhatsApp ile aynı.
   İconlar büyütüldü. */
.business-social-row{
  display:flex;
  flex-direction:column;       /* alt alta */
  gap:10px;
  width:100%;
  margin-bottom:10px;
}
.business-social-row a{
  display:flex;align-items:center;gap:12px;
  background:var(--cream-100);
  padding:12px 14px;border-radius:14px;
  color:var(--ink-900);font-size:13px;font-weight:600;
  text-decoration:none;
  transition:background .2s var(--ease);
}
.business-social-row a:hover{background:#f7e6dc;}
.business-social-row a i{
  width:36px;height:36px;border-radius:50%;     /* büyütüldü (30px→36px) */
  background:var(--white);color:var(--orange-600);
  display:flex;align-items:center;justify-content:center;font-size:17px;  /* büyütüldü (13px→17px) */
  flex-shrink:0;
}

/* --- Varyasyon seçici (ürün detayında) --- */
.variation-picker{
  margin-bottom:18px;
}
.variation-picker .vp-label{
  font-size:12.5px;font-weight:700;color:var(--ink-900);
  margin-bottom:10px;display:flex;align-items:center;gap:6px;
}
.variation-picker .vp-label i{color:var(--orange-600);font-size:11px;}
.variation-picker .vp-options{
  display:flex;flex-wrap:wrap;gap:8px;
}
.variation-picker .vp-option{
  border:1.5px solid #e8d7cb;
  background:var(--cream-100);
  color:var(--ink-900);
  padding:9px 14px;border-radius:14px;
  font-size:12.5px;font-weight:600;
  cursor:pointer;
  transition:all .2s var(--ease);
  display:flex;align-items:center;gap:6px;
}
.variation-picker .vp-option:hover{border-color:var(--orange-500);}
.variation-picker .vp-option.selected{
  background:var(--orange-600);color:#fff;border-color:var(--orange-600);
}
.variation-picker .vp-option .vp-price{
  font-size:11px;font-weight:700;opacity:.85;
}

/* --- Not alanı (ürün detayı + sepet kalemi) --- */
.note-field{margin-bottom:18px;}
.note-field .nf-label{
  font-size:12.5px;font-weight:700;color:var(--ink-900);
  margin-bottom:8px;display:flex;align-items:center;gap:6px;
}
.note-field .nf-label i{color:var(--orange-600);font-size:11px;}
.note-field textarea{
  width:100%;
  border:1.5px solid #e8d7cb;
  background:var(--cream-100);
  border-radius:14px;
  padding:11px 14px;
  font-size:13px;color:var(--ink-900);
  outline:none;resize:vertical;min-height:60px;
  transition:border-color .2s var(--ease);
}
.note-field textarea:focus{border-color:var(--orange-500);}
.cart-item-note-display{
  font-size:11.5px;color:var(--ink-500);font-style:italic;
  margin-top:4px;line-height:1.4;
}
.cart-item-note-display::before{content:'"';}
.cart-item-note-display::after{content:'"';}

/* --- Genel sipariş notu (sepet ekranı) --- */
.order-note-box{
  margin-top:14px;
  background:var(--cream-100);
  border:1px dashed #e4c3ac;
  border-radius:16px;
  padding:14px;
}
.order-note-box .onf-label{
  display:flex;align-items:center;gap:8px;
  font-size:12.5px;font-weight:600;color:var(--ink-900);margin-bottom:8px;
}
.order-note-box .onf-label i{color:var(--orange-600);}
.order-note-box textarea{
  width:100%;border:1px solid #e8d7cb;border-radius:12px;
  padding:10px 12px;font-size:13px;outline:none;background:#fff;
  resize:vertical;min-height:54px;
}
.order-note-box textarea:focus{border-color:var(--orange-500);}

/* --- Detay ekranı fiyat + varyasyon uyumu --- */
.detail-price .price-original{font-size:13px;color:var(--ink-500);text-decoration:line-through;font-weight:600;margin-right:6px;}

/* --- Loading spinner --- */
.loader{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:40px 20px;color:var(--ink-500);gap:12px;
}
.loader i{font-size:26px;color:var(--orange-600);animation:spin 1s linear infinite;}
@keyframes spin{to{transform:rotate(360deg);}}

/* ==========================================================================
   13. v3 NEW FEATURES CSS — Language / Time Schedule / Reviews / Receipt
   ========================================================================== */

/* --- Dil seçimi dropdown (brand header icon-group içinde) --- */
.lang-selector-wrapper{
  display:flex;
  align-items:center;
}
.lang-selector-wrapper select{
  appearance:none;
  -webkit-appearance:none;
  background:rgba(255,255,255,0.14);
  color:var(--white);
  font-size:11px;
  font-weight:600;
  padding:5px 22px 5px 10px;
  border-radius:20px;
  border:1px solid rgba(255,255,255,0.25);
  cursor:pointer;
  outline:none;
  /* custom arrow */
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 6px center;
  background-size:12px;
  transition:background .2s var(--ease), border-color .2s var(--ease);
  min-width:80px;
  max-width:120px;
}
.lang-selector-wrapper select:hover{
  background:rgba(255,255,255,0.22);
  border-color:rgba(255,255,255,0.4);
}
.lang-selector-wrapper select:focus{
  border-color:var(--orange-500);
}
.lang-selector-wrapper select option{
  background:var(--brown-800);
  color:var(--white);
  font-size:11px;
  padding:4px 8px;
}

/* --- Fiş yazdır butonu (siparişler ekranı) --- */
.btn-fis-yazdir{
  width:100%;
  background:var(--brown-800);
  color:var(--white);
  font-size:14px;
  font-weight:700;
  padding:14px;
  border-radius:var(--radius-pill);
  border:1.5px solid rgba(255,255,255,0.3);
  margin-top:8px;
  display:flex;
  align-items:center;
  justify-content:center;
  transition:background .2s var(--ease), transform .2s var(--ease);
}
.btn-fis-yazdir:hover{
  background:var(--brown-900);
  transform:translateY(-1px);
}

/* --- Yorum/Puan bölümü (siparişler ekranı) --- */
.orders-review-section{
  margin-top:12px;
  padding:0;
}
.review-products-list{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.review-empty-msg{
  text-align:center;
  padding:16px 10px;
  color:var(--ink-500);
  font-size:13px;
  font-weight:500;
}

/* Yorum yapılabilecek ürün kartı */
.review-product-item{
  display:flex;
  align-items:center;
  gap:10px;
  background:var(--cream-100);
  border-radius:14px;
  padding:10px 12px;
  border:1px solid #f1e4dc;
  position:relative;
  transition:background .2s var(--ease);
}
.review-product-item:hover{background:#f7e6dc;}

.review-product-photo{
  width:42px;height:42px;border-radius:12px;overflow:hidden;
  background:#f3e3d8;
  flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
}
.review-product-photo img{width:100%;height:100%;object-fit:cover;}
.review-product-photo .fa-solid{font-size:16px;color:#c98a63;}

.review-product-info{
  flex:1;
  min-width:0;
}
.review-product-name{
  font-size:13px;font-weight:600;color:var(--ink-900);
  line-height:1.3;
}
.review-product-price{
  font-size:11px;font-weight:600;color:var(--orange-600);
}

.btn-review-open{
  background:var(--orange-600);
  color:#fff;
  font-size:11px;font-weight:700;
  padding:6px 12px;
  border-radius:12px;
  cursor:pointer;
  transition:background .2s var(--ease);
  white-space:nowrap;
  flex-shrink:0;
}
.btn-review-open:hover{background:var(--orange-500);}

/* Yorum formu */
.review-form{
  background:var(--white);
  border-radius:16px;
  padding:14px;
  margin-top:10px;
  border:1px solid #e8d7cb;
}
.review-form-stars{
  display:flex;
  align-items:center;
  gap:8px;
  margin-bottom:10px;
}
.review-form-label{
  font-size:12px;font-weight:700;color:var(--ink-900);
}
.star-picker{
  display:flex;
  align-items:center;
  gap:4px;
}
.star-btn{
  width:28px;height:28px;border-radius:50%;
  background:var(--cream-100);
  display:flex;align-items:center;justify-content:center;
  font-size:14px;color:#d4c4b8;
  cursor:pointer;
  transition:background .2s var(--ease), color .2s var(--ease);
}
.star-btn:hover{background:#f7e6dc;color:var(--yellow-400);}
.star-btn.selected{
  background:var(--orange-600);
  color:var(--yellow-400);
}
.star-btn.selected i{color:var(--yellow-400);}

.review-comment-input{
  width:100%;
  border:1.5px solid #e8d7cb;
  background:var(--cream-100);
  border-radius:14px;
  padding:10px 12px;
  font-size:13px;
  color:var(--ink-900);
  outline:none;
  resize:vertical;
  min-height:54px;
  margin-bottom:10px;
  transition:border-color .2s var(--ease);
}
.review-comment-input:focus{border-color:var(--orange-500);}

.review-form-actions{
  display:flex;
  gap:8px;
}
.btn-review-submit{
  background:var(--orange-600);
  color:#fff;
  font-size:13px;font-weight:700;
  padding:10px 20px;
  border-radius:var(--radius-pill);
  cursor:pointer;
  transition:background .2s var(--ease), transform .2s var(--ease);
}
.btn-review-submit:hover{background:var(--orange-500);transform:translateY(-1px);}
.btn-review-submit:disabled{opacity:.6;cursor:not-allowed;transform:none;}

.btn-review-cancel{
  background:transparent;
  color:var(--ink-500);
  font-size:13px;font-weight:600;
  padding:10px 16px;
  border-radius:var(--radius-pill);
  border:1.5px solid #e8d7cb;
  cursor:pointer;
  transition:background .2s var(--ease);
}
.btn-review-cancel:hover{background:var(--cream-100);}

/* Yorum gönderildi mesajı */
.review-done-msg{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  padding:12px;
  background:var(--cream-100);
  border-radius:14px;
  font-size:13px;
  font-weight:600;
  color:#2e8b57;
}
.review-done-msg i{font-size:14px;color:#2e8b57;}

/* ==========================================================================
   14. PRINT RECEIPT — window içi stil (receipt HTML ayrı dosyada inline)
   ========================================================================== */
/* Fiş penceresi kendi inline stilini içerir — burada ek CSS gerekmez */
