:root{
  --lime: #a4d82a;
  --lime-dark: #8fc021;
  --orange: #df6f1b;
  --orange-dark: #c65f13;
  --orange-rgb: 223,111,27;
  --dark: #111111;
  --dark-soft: #1c1c1c;
  --text-muted: #6b6b70;
  --radius-lg: 22px;
  --radius-md: 14px;
}

*{ -webkit-tap-highlight-color: transparent; touch-action: manipulation; }

body{
  font-family: 'Poppins', 'Nunito', system-ui, -apple-system, sans-serif;
  background: #f4f4f5;
  color: #1f1f22;
}

/* ---------- SPLASH / WELCOME PAGE ---------- */
.splash-wrap{
  min-height: 100vh;
  min-height: 100dvh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px 24px calc(100px + env(safe-area-inset-bottom));
  background: linear-gradient(180deg, #fafafa 0%, #eeeeef 100%);
}

.splash-card{
  position: relative;
  width: 100%;
  max-width: 420px;
  background: #fff;
  border-radius: var(--radius-lg);
  box-shadow: 0 20px 60px rgba(0,0,0,0.10), 0 4px 12px rgba(0,0,0,0.05);
  padding: 30px 28px 24px;
  text-align: center;
  display: flex;
  flex-direction: column;
  min-height: min(62vh, 540px);
}

.splash-logo{
  width: 168px;
  height: 168px;
  border-radius: 50%;
  object-fit: cover;
  margin: 0 auto 20px;
  box-shadow: 0 0 0 6px #fff, 0 6px 20px rgba(0,0,0,0.15);
}

.splash-title{
  font-weight: 700;
  font-size: 1.9rem;
  color: #1a1a1a;
  margin-bottom: 6px;
}

.splash-sub{
  font-weight: 500;
  font-size: 1.1rem;
  color: #3a3a3a;
  margin-bottom: 18px;
}

.btn-lime-pill{
  display: inline-block;
  background: var(--orange);
  color: #fff;
  font-weight: 600;
  padding: 11px 34px;
  border-radius: 50px;
  text-decoration: none;
  box-shadow: 0 8px 20px rgba(var(--orange-rgb),0.35);
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
  border: none;
}
.btn-lime-pill:hover, .btn-lime-pill:focus{
  background: var(--orange-dark);
  color: #fff;
  transform: translateY(-2px);
  box-shadow: 0 12px 26px rgba(var(--orange-rgb),0.4);
}

.splash-footer{
  margin-top: auto;
  padding-top: 18px;
  font-size: .8rem;
  color: var(--text-muted);
}
.splash-footer a{ color: var(--orange); text-decoration: none; font-weight: 600; }

.page-footer-credit{
  text-align: center;
  padding: 18px 0 6px;
  font-size: .74rem;
  color: var(--text-muted);
}
.page-footer-credit a{ color: var(--orange); text-decoration: none; font-weight: 600; }

/* ---------- ANASAYFA İKİNCİL BUTONLAR ---------- */
.splash-secondary-actions{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: center;
  margin-top: 12px;
}
.btn-outline-pill{
  flex: 1 1 140px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  border: 2px solid #e2e2e6;
  color: #333;
  background: #fff;
  padding: 8px 12px;
  border-radius: 50px;
  font-weight: 600;
  font-size: .76rem;
  text-decoration: none;
  transition: all .15s ease;
}
.btn-outline-pill i{ font-size: .88rem; }
.btn-outline-pill:hover{
  border-color: var(--orange);
  color: var(--orange);
}
.btn-outline-pill.google:hover{
  border-color: #4285F4;
  color: #4285F4;
}

/* ---------- SİTE POPUP ---------- */
.site-popup-overlay{
  position: fixed;
  inset: 0;
  z-index: 200;
  background: rgba(20, 20, 22, .55);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  opacity: 0;
  pointer-events: none;
  transition: opacity .2s ease;
}
.site-popup-overlay.show{ opacity: 1; pointer-events: auto; }
.site-popup-card{
  position: relative;
  width: 100%;
  max-width: 380px;
  max-height: 88vh;
  overflow-y: auto;
  background: #fff;
  border-radius: 18px;
  box-shadow: 0 20px 50px rgba(0,0,0,.3);
  transform: translateY(14px) scale(.97);
  transition: transform .2s ease;
}
.site-popup-overlay.show .site-popup-card{ transform: translateY(0) scale(1); }
.site-popup-close{
  position: absolute;
  top: 10px; right: 10px;
  width: 32px; height: 32px;
  border: none;
  border-radius: 50%;
  background: rgba(0,0,0,.5);
  color: #fff;
  font-size: 20px;
  line-height: 1;
  z-index: 1;
}
.site-popup-img{ width: 100%; max-height: 220px; object-fit: cover; border-radius: 18px 18px 0 0; display: block; }
.site-popup-card > a{ display: block; line-height: 0; }
.site-popup-body{ padding: 22px 20px 24px; text-align: center; }
.site-popup-body h3{ font-size: 1.15rem; font-weight: 800; margin: 0 0 8px; }
.site-popup-body p{ font-size: .88rem; color: #555; line-height: 1.5; margin: 0 0 16px; white-space: pre-line; }
.site-popup-btn{
  display: inline-block;
  background: var(--orange);
  color: #fff;
  font-weight: 700;
  font-size: .88rem;
  padding: 11px 26px;
  border-radius: 50px;
  text-decoration: none;
}

/* ---------- ALT SOSYAL MEDYA BARI ---------- */
.social-bar{
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 50;
  background: var(--dark);
  padding: 12px 14px calc(12px + env(safe-area-inset-bottom));
  display: flex;
  overflow-x: auto;
  scrollbar-width: none;
  box-shadow: 0 -6px 20px rgba(0,0,0,0.18);
}
.social-bar::-webkit-scrollbar{ display: none; }
.social-bar-inner{
  /* İkon boyutu sabit değil - kaç ikon gösterileceğine (--sosyal-sayisi, PHP'den
     basılıyor) göre ORANTILI hesaplanıyor: az ikon varsa büyük, çok ikon varsa
     küçük, her durumda mobilde kaydırma gerekmeden tek satıra sığacak şekilde
     (28-40px aralığında sabitlenir). Bkz. CLAUDE.md §7am. */
  --sb-size: clamp(28px, calc((100vw - 32px) / var(--sosyal-sayisi, 8) - 8px), 40px);
  display: flex;
  align-items: center;
  gap: clamp(5px, calc(var(--sb-size) * 0.2), 12px);
  margin: 0 auto;
  flex-shrink: 0;
  padding: 0 2px;
}
.social-icon{
  width: var(--sb-size, 40px);
  height: var(--sb-size, 40px);
  border-radius: 50%;
  background: #232323;
  color: #e8e8e8;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: calc(var(--sb-size, 40px) * 0.42);
  text-decoration: none;
  transition: all .15s ease;
  flex-shrink: 0;
}
.social-icon:hover{
  background: var(--lime);
  color: #131300;
  transform: translateY(-2px);
}
/* Her platformun kendi marka rengiyle hover - jenerik limon yeşili yerine */
.social-icon-instagram:hover{ background: #e4405f; color: #fff; }
.social-icon-facebook:hover{ background: #1877f2; color: #fff; }
.social-icon-x:hover{ background: #000; color: #fff; }
.social-icon-youtube:hover{ background: #ff0000; color: #fff; }
.social-icon-linkedin:hover{ background: #0a66c2; color: #fff; }
.social-icon-whatsapp:hover{ background: #25d366; color: #fff; }
.social-icon.rate-icon,
.social-icon.google-icon{
  background: var(--orange);
  color: #fff;
}
.social-icon.rate-icon:hover,
.social-icon.google-icon:hover{
  background: var(--orange-dark);
  color: #fff;
}

/* ---------- MENU PAGE ---------- */
.menu-header{
  position: sticky;
  top: 0;
  z-index: 40;
  background: var(--dark);
  color: #fff;
  padding: 14px 16px 12px;
  box-shadow: 0 6px 18px rgba(0,0,0,0.18);
}
.menu-header-top{
  display: flex;
  align-items: center;
  gap: 12px;
}
.menu-header-logo{
  width: 46px;
  height: 46px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
  box-shadow: 0 0 0 2px rgba(255,255,255,0.15);
}
.menu-header-name{
  font-weight: 700;
  font-size: 1.15rem;
  line-height: 1.1;
}
.menu-header-tag{
  font-size: .72rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--lime);
  font-weight: 700;
}
.menu-header-back{
  margin-left: auto;
  color: #cfcfcf;
  font-size: 1.3rem;
  text-decoration: none;
  line-height: 1;
}
.menu-header-back:hover{ color: #fff; }

.category-nav{
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding: 14px 2px 2px;
  scrollbar-width: none;
}
.category-nav::-webkit-scrollbar{ display: none; }
.category-pill{
  flex: 0 0 auto;
  background: #2a2a2a;
  color: #d8d8d8;
  border: 1px solid #3a3a3a;
  border-radius: 50px;
  padding: 8px 18px;
  font-size: .86rem;
  font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
  transition: all .15s ease;
}
.category-pill.active,
.category-pill:hover{
  background: var(--lime);
  color: #131300;
  border-color: var(--lime);
}

.menu-search{
  margin-top: 12px;
}
.menu-search input{
  width: 100%;
  border: none;
  border-radius: 50px;
  padding: 10px 18px;
  font-size: .92rem;
  background: #232323;
  color: #eee;
}
.menu-search input::placeholder{ color: #8a8a8a; }
.menu-search input:focus{
  outline: none;
  box-shadow: 0 0 0 2px var(--lime);
}

.menu-content{
  max-width: 880px;
  margin: 0 auto;
  padding: 20px 14px 100px;
}

.category-section{ scroll-margin-top: 148px; margin-bottom: 34px; }

.category-heading{
  display: flex;
  align-items: baseline;
  gap: 10px;
  margin-bottom: 14px;
  padding-left: 2px;
}
.category-heading .emoji{ font-size: 1.4rem; }
.category-heading h2{
  font-size: 1.25rem;
  font-weight: 700;
  color: #161616;
  margin: 0;
}
.category-heading small{
  color: var(--text-muted);
  font-size: .8rem;
}

.product-card{
  background: #fff;
  border-radius: var(--radius-md);
  padding: 14px 16px;
  margin-bottom: 10px;
  display: flex;
  align-items: center;
  gap: 14px;
  box-shadow: 0 1px 3px rgba(0,0,0,0.04);
  border: 1px solid #eceded;
}
.product-thumb{
  width: 52px;
  height: 52px;
  border-radius: 12px;
  background: linear-gradient(135deg, var(--lime), var(--lime-dark));
  color: #14210a;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 1.1rem;
  flex-shrink: 0;
}
.product-info{ flex: 1 1 auto; min-width: 0; }
.product-name{
  font-weight: 600;
  font-size: .98rem;
  color: #1a1a1a;
  margin-bottom: 2px;
}
.product-desc{
  font-size: .82rem;
  color: var(--text-muted);
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.product-price{
  flex-shrink: 0;
  font-weight: 700;
  color: var(--orange);
  font-size: 1rem;
  background: #fdf1e7;
  padding: 6px 12px;
  border-radius: 50px;
  white-space: nowrap;
}

.back-to-top{
  position: fixed;
  right: 18px;
  bottom: 22px;
  width: 46px;
  height: 46px;
  border-radius: 50%;
  background: var(--dark);
  color: var(--lime);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.3rem;
  box-shadow: 0 8px 20px rgba(0,0,0,0.3);
  text-decoration: none;
  opacity: 0;
  pointer-events: none;
  transform: translateY(10px);
  transition: all .2s ease;
  z-index: 50;
}
.back-to-top.show{ opacity: 1; pointer-events: auto; transform: translateY(0); }

@media (min-width: 576px){
  .product-card{ padding: 16px 18px; }
}

@media (min-width: 992px){
  .menu-content{ padding-top: 28px; }
  .category-heading h2{ font-size: 1.4rem; }
}

/* ---------- KATEGORİ ARŞİV SAYFASI ---------- */
.kategori-wrap{
  min-height: 100vh;
  min-height: 100dvh;
  background: linear-gradient(180deg, #fafafa 0%, #eeeeef 100%);
  padding: 24px 16px calc(96px + env(safe-area-inset-bottom));
  display: flex;
  justify-content: center;
}

.kategori-card{
  width: 100%;
  max-width: 460px;
  background: #fff;
  border-radius: var(--radius-lg);
  box-shadow: 0 20px 60px rgba(0,0,0,0.10), 0 4px 12px rgba(0,0,0,0.05);
  overflow: hidden;
}

.kategori-header{
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 20px 16px;
  box-shadow: 0 4px 6px -6px #222;
}
.kategori-back{
  flex-shrink: 0;
  color: #111;
  font-size: 1.3rem;
  text-decoration: none;
  line-height: 1;
}
.kategori-back:hover{ color: var(--orange); }
.kategori-header h1{
  flex: 1 1 auto;
  min-width: 0;
  text-align: center;
  font-size: 1.15rem;
  font-weight: 700;
  margin: 0;
  color: #111;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.kategori-aciklama{
  margin: 16px 24px 14px;
  padding: 12px 16px;
  text-align: left;
  font-size: .82rem;
  line-height: 1.5;
  color: #1a1a1a;
  background: rgba(var(--orange-rgb), 0.12);
  border-radius: var(--radius-md);
}

/* ---------- DİL DEĞİŞTİRİCİ (bayraklı açılır menü) ---------- */
.lang-dropdown{
  position: relative;
  flex-shrink: 0;
}
.lang-dropdown-trigger{
  display: flex;
  align-items: center;
  gap: 6px;
  border: none;
  background: #f1f1f3;
  border-radius: 50px;
  padding: 6px 12px 6px 10px;
  font-family: inherit;
  font-size: .76rem;
  font-weight: 700;
  color: #1f1f22;
  cursor: pointer;
}
.lang-dropdown-trigger .flag{ font-size: 1.05rem; line-height: 1; }
.lang-dropdown-trigger .chevron{
  font-size: .56rem;
  color: #808088;
  transition: transform .18s ease;
}
.lang-dropdown.open .lang-dropdown-trigger .chevron{ transform: rotate(180deg); }

.lang-dropdown-menu{
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  z-index: 50;
  min-width: 100px;
  width: max-content;
  background: #fff;
  border-radius: 13px;
  padding: 4px;
  box-shadow: 0 14px 32px rgba(0,0,0,.16), 0 2px 6px rgba(0,0,0,.07);
  display: none;
  flex-direction: column;
  gap: 1px;
}
.lang-dropdown.open .lang-dropdown-menu{ display: flex; }

.lang-dropdown-item{
  display: flex;
  align-items: center;
  gap: 6px;
  width: 100%;
  border: none;
  background: transparent;
  font-family: inherit;
  font-size: .74rem;
  font-weight: 600;
  color: #1f1f22;
  text-align: left;
  white-space: nowrap;
  padding: 6px 8px;
  border-radius: 8px;
  cursor: pointer;
  transition: background .12s ease;
}
.lang-dropdown-item .flag{ font-size: .95rem; line-height: 1; }
.lang-dropdown-item:hover{ background: #f4f4f5; }
.lang-dropdown-item.active{ background: var(--dark); color: #fff; }

.splash-lang-dropdown{
  position: absolute;
  top: 18px;
  right: 18px;
}

[dir="rtl"] .lang-dropdown-menu{ right: auto; left: 0; }
[dir="rtl"] .splash-lang-dropdown{ right: auto; left: 18px; }
[dir="rtl"] .lang-dropdown-item{ text-align: right; }

.kategori-grid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4px;
  padding: 16px;
}

.kategori-item{
  position: relative;
  border-radius: 20px;
  overflow: hidden;
  aspect-ratio: 1 / 1;
  display: block;
  text-decoration: none;
  isolation: isolate;
}
.kategori-item-bg{
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 2.6rem;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.kategori-item-bg::after{
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,0) 45%, rgba(0,0,0,0.55) 100%);
}
.kategori-item-title{
  position: absolute;
  left: 12px;
  bottom: 10px;
  right: 10px;
  color: #fff;
  font-weight: 700;
  font-size: .82rem;
  line-height: 1.2;
  overflow-wrap: break-word;
  word-break: break-word;
  hyphens: auto;
  text-shadow: 0 1px 4px rgba(0,0,0,0.4);
  z-index: 2;
}

/* background-image (longhand) kullanılıyor - background (shorthand) kullanılırsa
   inline style="background-image:url(...)" ile gerçek bir görsel ayarlandığında
   bile bu kural background-size/position'ı auto/0-0'a sıfırlayıp görseli
   yalnızca sol-üst köşesinden, ölçeklenmeden gösteriyordu (koyu fonlu
   fotoğraflarda bu köşe genelde en karanlık kısım oluyor, "her yeri siyah"
   görünümüne yol açıyordu). Longhand kullanmak bu kuralı yalnızca görsel HİÇ
   ayarlanmamışsa devreye giren saf bir yedek renge indirger. */
.kategori-item:nth-child(6n+1) .kategori-item-bg{ background-image: linear-gradient(135deg, #2c2c2c, #4a4a4a); }
.kategori-item:nth-child(6n+2) .kategori-item-bg{ background-image: linear-gradient(135deg, var(--orange), var(--orange-dark)); }
.kategori-item:nth-child(6n+3) .kategori-item-bg{ background-image: linear-gradient(135deg, var(--lime), var(--lime-dark)); }
.kategori-item:nth-child(6n+4) .kategori-item-bg{ background-image: linear-gradient(135deg, #3a3a3a, #1a1a1a); }
.kategori-item:nth-child(6n+5) .kategori-item-bg{ background-image: linear-gradient(135deg, var(--lime-dark), #5c8c17); }
.kategori-item:nth-child(6n+6) .kategori-item-bg{ background-image: linear-gradient(135deg, var(--orange-dark), #8a3f0c); }

@media (min-width: 380px){
  .kategori-item-bg{ font-size: 3rem; }
  .kategori-item-title{ font-size: .92rem; }
}

/* ---------- ÜRÜN DETAY SAYFASI ---------- */
.urun-list{
  padding: 4px 18px 28px;
}

.urun-row{
  display: flex;
  gap: 14px;
  align-items: flex-start;
  padding: 22px 0;
  border-bottom: 1px solid #f0f0f1;
}
.urun-row:last-child{ border-bottom: none; }

.urun-img{
  width: 72px;
  height: 72px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
  background: #f4f4f5;
}

.urun-img-wrap{
  position: relative;
  flex-shrink: 0;
}
.urun-tukendi-ribbon{
  position: absolute;
  bottom: -3px;
  left: 50%;
  transform: translateX(-50%);
  background: var(--orange);
  color: #fff;
  font-size: .56rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .03em;
  padding: 2px 8px;
  border-radius: 20px;
  white-space: nowrap;
  box-shadow: 0 1px 4px rgba(0,0,0,.28);
}

.urun-info{ flex: 1 1 auto; min-width: 0; }

.urun-name{
  font-size: 1.02rem;
  font-weight: 700;
  color: #161616;
  margin: 0 0 4px;
}

.urun-row.urun-tukendi .urun-img{
  filter: grayscale(1);
  opacity: .55;
}
.urun-row.urun-tukendi .urun-name{ color: #a8a8a8; }
.urun-row.urun-tukendi .urun-desc{ color: #c2c2c2; }
.urun-row.urun-tukendi .urun-price{ color: #b8b8b8; }
.urun-row.urun-tukendi .urun-kalori-badge{ color: #c2c2c2; background: #f4f4f4; }
.urun-row.urun-tukendi .urun-gramaj-badge{ color: #c2c2c2; background: #f4f4f4; }
.urun-row.urun-tukendi .diyet-tag{ color: #b3b3b3; background: #f4f4f4; border-color: #e8e8e8; }
.urun-tukendi-badge{
  display: inline-block;
  font-size: .62rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: #fff;
  background: var(--orange);
  padding: 2px 8px;
  border-radius: 20px;
  vertical-align: middle;
  margin-left: 4px;
}

.urun-diyet-tags{
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin: 0 0 6px;
}
.diyet-tag{
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: .62rem;
  font-weight: 600;
  color: var(--lime-dark);
  background: #f2fbe6;
  border: 1px solid #dcf0bd;
  padding: 3px 9px;
  border-radius: 20px;
  white-space: nowrap;
  line-height: 1.3;
}
.diyet-tag i{ font-size: .62rem; }

.urun-desc{
  font-size: .82rem;
  color: var(--text-muted);
  line-height: 1.45;
  margin: 0 0 8px;
}
.urun-desc ol{
  padding-left: 18px;
  margin: 0;
}
.urun-desc p{ margin: 0; }

.urun-price{
  font-size: .98rem;
  font-weight: 700;
  color: var(--orange);
  margin: 0 0 8px;
}

.urun-kalori-badge{
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: .6rem;
  font-weight: 700;
  color: #c45b1f;
  background: #fef1e6;
  padding: 2px 8px;
  border-radius: 20px;
  vertical-align: middle;
  white-space: nowrap;
  cursor: help;
}
.urun-kalori-badge i{ font-size: .62rem; }
.urun-kalori-tahmini{
  font-weight: 500;
  opacity: .8;
}

.urun-gramaj-badge{
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: .6rem;
  font-weight: 700;
  color: #4a5a6b;
  background: #eef2f6;
  padding: 2px 8px;
  border-radius: 20px;
  vertical-align: middle;
  white-space: nowrap;
}
.urun-gramaj-badge i{ font-size: .62rem; }

.urun-allergens-label{
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: .56rem;
  font-weight: 600;
  color: #b5790a;
  background: #fff6e6;
  padding: 2px 8px;
  border-radius: 20px;
  margin: 7px 0 5px;
}
.urun-allergens-label i{
  font-size: .5rem;
}
.urun-allergens{
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}
.alerjen-tag{
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: .58rem;
  font-weight: 600;
  color: #5a5a60;
  background: #f2f2f4;
  border: 1px solid #e4e4e8;
  padding: 2px 8px;
  border-radius: 20px;
  white-space: nowrap;
  line-height: 1.3;
}
.alerjen-tag.yok{
  color: var(--lime-dark);
  background: #f2fbe6;
  border-color: #dcf0bd;
}
.alerjen-info-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 13px;
  height: 13px;
  border-radius: 50%;
  background: #e29a1f;
  color: #fff;
  border: none;
  padding: 0;
  font-size: .55rem;
  font-weight: 800;
  line-height: 1;
  cursor: pointer;
  flex-shrink: 0;
}
.alerjen-info-overlay{
  position: fixed; inset: 0; z-index: 1200;
  background: rgba(20,20,22,.5);
  display: flex; align-items: center; justify-content: center;
  padding: 20px;
  opacity: 0; visibility: hidden;
  transition: opacity .2s ease;
}
.alerjen-info-overlay.show{ opacity: 1; visibility: visible; }
.alerjen-info-card{
  position: relative;
  background: #fff;
  border-radius: 16px;
  padding: 24px 22px 22px;
  max-width: 360px;
  width: 100%;
  box-shadow: 0 20px 50px -12px rgba(0,0,0,.35);
  transform: translateY(8px) scale(.97);
  transition: transform .2s ease;
}
.alerjen-info-overlay.show .alerjen-info-card{ transform: translateY(0) scale(1); }
.alerjen-info-close{
  position: absolute; top: 10px; right: 10px;
  width: 28px; height: 28px; border-radius: 50%;
  border: none; background: #f2f2f4; color: #5a5a60;
  font-size: 18px; line-height: 1; cursor: pointer;
}
.alerjen-info-card h4{ margin: 0 22px 8px 0; font-size: .95rem; font-weight: 700; color: #222; }
.alerjen-info-card p{ margin: 0; font-size: .82rem; line-height: 1.5; color: #555; }

.alerjen-bilgi{
  margin: 4px 18px 22px;
  padding: 14px 16px;
  background: #fbfbfc;
  border: 1px solid #eee;
  border-radius: 14px;
  display: flex;
  gap: 10px;
  align-items: flex-start;
}
.alerjen-bilgi .icon{
  font-size: 1.1rem;
  line-height: 1;
  flex-shrink: 0;
}
.alerjen-bilgi p{
  margin: 0;
  font-size: .76rem;
  line-height: 1.5;
  color: var(--text-muted);
}
.alerjen-bilgi strong{ color: #333; }

.fiyat-bilgi{
  margin: 4px 18px 22px;
  padding: 4px 16px;
  text-align: center;
}
.fiyat-bilgi p{
  margin: 0;
  font-size: .72rem;
  line-height: 1.6;
  color: var(--text-muted);
}

.calisma-saatleri-card{
  position: relative;
  overflow: hidden;
  border-radius: var(--radius-md);
  background: linear-gradient(115deg, rgba(var(--orange-rgb),0.14) 0%, rgba(var(--orange-rgb),0.14) 30%, #fff 78%);
  padding: 18px 18px 14px;
  margin: 22px -4px 4px;
  text-align: left;
}
.calisma-saatleri-title{
  text-align: center;
  font-weight: 700;
  font-size: 1.05rem;
  color: #1f1f22;
  margin: 0 0 14px;
}
.calisma-saatleri-row{
  display: flex;
  align-items: baseline;
  gap: 8px;
  padding: 6px 0;
  font-size: .84rem;
  color: #333;
}
.calisma-saatleri-row .gun{ flex-shrink: 0; }
.calisma-saatleri-row .dolgu{
  flex: 1;
  border-bottom: 1px dashed #c9c9cc;
  height: 0;
  margin-bottom: 4px;
}
.calisma-saatleri-row .saat{ flex-shrink: 0; font-variant-numeric: tabular-nums; }
.calisma-saatleri-row.bugun{ font-weight: 700; color: var(--orange); }
.calisma-saatleri-row.bugun .dolgu{ border-bottom-color: var(--orange); }

@media (min-width: 380px){
  .urun-img{ width: 80px; height: 80px; }
  .urun-name{ font-size: 1.08rem; }
}

@media (min-width: 420px){
  .kategori-item-title{ font-size: .98rem; }
}

/* ---------- DEĞERLENDİRME / ANKET SAYFASI ---------- */
.degerlendirme-body{
  padding: 8px 20px 32px;
}

.degerlendirme-intro{
  text-align: center;
  margin-bottom: 18px;
}
.degerlendirme-intro img{
  width: 64px;
  height: 64px;
  border-radius: 50%;
  margin-bottom: 12px;
  box-shadow: 0 0 0 4px #fff, 0 4px 14px rgba(0,0,0,0.1);
}
.degerlendirme-intro p{
  font-size: .86rem;
  color: var(--text-muted);
  margin: 0;
}

.rating-group{
  margin-bottom: 20px;
}
.rating-label{
  display: block;
  font-size: .9rem;
  font-weight: 600;
  color: #222;
  margin-bottom: 8px;
}
.opsiyonel-etiket{
  font-weight: 400;
  font-size: .78rem;
  color: var(--text-muted);
}
.zorunlu-yildiz{
  color: #c0392b;
  font-weight: 700;
}
.zorunlu-etiket{
  font-weight: 400;
  font-size: .78rem;
  color: #c0392b;
}

.star-rating{
  display: flex;
  flex-direction: row-reverse;
  justify-content: center;
  gap: 6px;
}
.star-rating input{
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}
.star-rating label{
  font-size: 1.7rem;
  color: #dcdce0;
  cursor: pointer;
  transition: color .1s ease, transform .1s ease;
}
.star-rating input:checked ~ label,
.star-rating label:hover,
.star-rating label:hover ~ label{
  color: var(--orange);
}
.star-rating label:active{ transform: scale(1.15); }

.anket-textarea{
  width: 100%;
  border: 1px solid #e4e4e8;
  border-radius: var(--radius-md);
  padding: 12px 14px;
  font-family: inherit;
  font-size: .88rem;
  resize: vertical;
  color: #1f1f22;
}
.anket-textarea:focus{
  outline: none;
  border-color: var(--lime-dark);
  box-shadow: 0 0 0 3px rgba(164,216,42,0.2);
}

.pill-radio-group{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.pill-radio-group input{
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}
.pill-radio{
  padding: 9px 20px;
  border-radius: 50px;
  border: 2px solid #e4e4e8;
  font-size: .85rem;
  font-weight: 600;
  color: #555;
  cursor: pointer;
  transition: all .15s ease;
}
.pill-radio-group input:checked + .pill-radio{
  background: var(--orange);
  border-color: var(--orange);
  color: #fff;
}

.anket-select{
  width: 100%;
  border: 1px solid #e4e4e8;
  border-radius: var(--radius-md);
  padding: 12px 14px;
  font-family: inherit;
  font-size: .88rem;
  color: #1f1f22;
  background: #fff;
}
.anket-select:focus{
  outline: none;
  border-color: var(--lime-dark);
  box-shadow: 0 0 0 3px rgba(164,216,42,0.2);
}

.anket-submit{
  width: 100%;
  margin-top: 4px;
  border: none;
  cursor: pointer;
}

.tesekkur-mesaji{
  text-align: center;
  padding: 40px 20px;
}
.tesekkur-mesaji .check{
  font-size: 3rem;
  margin-bottom: 12px;
}
.tesekkur-mesaji h3{
  font-weight: 700;
  font-size: 1.2rem;
  color: #1a1a1a;
  margin-bottom: 8px;
}
.tesekkur-mesaji p{
  color: var(--text-muted);
  font-size: .88rem;
  margin: 0;
}

.google-cta{
  margin-top: 20px;
  padding-top: 20px;
  border-top: 1px dashed #e2e2e6;
}
.google-cta-text{
  color: var(--text-muted);
  font-size: .86rem;
  margin: 0 0 18px;
}

.tesekkur-menu-btn{
  display: inline-block;
  margin-top: 24px;
}

.kvkk-notice{
  color: var(--text-muted);
  font-size: .76rem;
  line-height: 1.4;
  margin: 6px 2px 0;
}

/* ---------- RTL (ARAPÇA) TABAN KATMANI ----------
   Çoğu flex satırı (display:flex; flex-direction:row/row-reverse) dir="rtl"
   altında tarayıcıda otomatik ters döner, buraya SADECE fiziksel
   (left/right/margin-left gibi yöne bağlı) özellik kullanan, otomatik
   dönmeyen noktalar eklendi. Piksel-mükemmel bir RTL cilası değil, pratik/
   okunabilir bir temel seviye - bkz. CLAUDE.md §7o. */
[dir="rtl"] body{ text-align: right; }
[dir="rtl"] .kategori-back{ transform: scaleX(-1); }
[dir="rtl"] .urun-desc ol{ padding-left: 0; padding-right: 18px; }
[dir="rtl"] .urun-tukendi-badge{ margin-left: 0; margin-right: 4px; }
[dir="rtl"] .calisma-saatleri-card{ text-align: right; }

/* ---------- TEKNORITIM FOOTER ROZETİ ----------
   Footer'daki düz "teknoritim" metin linkinin yerini alan, üstüne gelince
   3D dönüş animasyonu + "Web Tasarımı" etiketi gösteren rozet (Desktop/teknoritim/
   Teknoritim Footer Rozeti kitinden, açık/light footer sürümü - bu site açık
   zeminli olduğu için). Kaynak kitteki background-image yolları "assets/img/..."
   idi, bu dosya assets/css/ içinde olduğundan "../img/..." olarak düzeltildi. */
.footer-bottom-inner{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  flex-wrap: wrap;
}

.teknoritim-badge{
  display: inline-block;
  line-height: 0;
  margin-top: -4px;
}

.teknoritim-icon{
  width: 90px;
  height: 37px;
  position: relative;
}

.teknoritim-icon .teknoritim-icon-link{
  text-indent: -99999px;
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: 1;
}

.teknoritim-icon .teknoritim-tooltip{
  display: block;
  position: relative;
  z-index: 999;
}

.teknoritim-icon .teknoritim-tooltip-content{
  position: absolute;
  z-index: 9999;
  width: 140px;
  left: 50%;
  bottom: 100%;
  font-size: 14px;
  line-height: 1.4;
  text-align: center;
  font-weight: 400;
  opacity: 0;
  margin: 0 0 10px -70px;
  cursor: default;
  pointer-events: none;
  font-family: Arial, sans-serif;
  transition: opacity 0.3s 0.3s;
  color: #fff;
}

.teknoritim-icon .teknoritim-tooltip-content span{ display: block; }

.teknoritim-icon .teknoritim-tooltip-text{
  overflow: hidden;
  transform: scale3d(0, 1, 1);
  transition: transform 0.3s 0.3s;
  border-bottom: 2px solid #fffaf0;
}

.teknoritim-icon .teknoritim-tooltip-inner{
  padding: 10px;
  transform: translate3d(0, 100%, 0);
  transition: transform 0.3s;
  background: rgba(0, 0, 0, 0.75);
}

.teknoritim-icon:hover .teknoritim-tooltip-content{
  opacity: 1;
  pointer-events: auto;
  transition-delay: 0s;
}

.teknoritim-icon:hover .teknoritim-tooltip-text{
  transform: scale3d(1, 1, 1);
  transition-delay: 0s;
}

.teknoritim-icon:hover .teknoritim-tooltip-inner{
  transform: translate3d(0, 0, 0);
  transition-delay: 0.3s;
}

.teknoritim-icon .teknoritim-icon-card-container{
  width: 100%;
  height: 100%;
  position: relative;
  perspective: 100px;
}

.teknoritim-icon .teknoritim-icon-card-container figure{
  display: block;
  height: 100%;
  width: 100%;
  position: absolute;
  margin: 0;
  padding: 0 2px;
  backface-visibility: hidden;
  transition: transform 0.4s;
  transform-style: preserve-3d;
}

.teknoritim-icon .teknoritim-icon-card-container figure > div{
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  height: 100%;
  width: 100%;
  background-image: url('../img/teknoritim-logo.png');
}

.teknoritim-icon .teknoritim-icon-card-container .teknoritim-icon-back{
  transform: rotateY(180deg);
}

.teknoritim-icon:hover .teknoritim-icon-card-container .teknoritim-icon-front{
  transform: rotateY(180deg);
}

.teknoritim-icon:hover .teknoritim-icon-card-container .teknoritim-icon-back{
  transform: rotateY(360deg);
}

/* ---------- ANASAYFA (SPLASH) - KÜÇÜK/KISA MOBİL EKRANLAR ----------
   Alttaki sabit sosyal medya çubuğu (.social-bar) yüzünden kart içeriği
   (özellikle "Menüye Git" ve ikincil butonlar) görünür alanın dışında kalabiliyordu -
   logo/başlık/boşluklar küçültüldü, kart "min-height" zorlaması kaldırıldı. Bu blok
   BİLEREK dosyanın en SONUNDA: aynı class'ların üstteki media-query'siz (temel) tanımları
   dosyanın farklı yerlerinde (bazıları bu bloktan önce, bazıları sonra - ör.
   .calisma-saatleri-* ve .splash-secondary-actions) olduğu için, blok dosyanın ortasında
   bir yere konulduğunda eşit specificity'deki SONRAKİ temel kural onu sessizce eziyordu
   (CSS cascade: eşit specificity'de dosyada sonra gelen kazanır, media query içinde olması
   fark etmez). Yeni bir mobil override eklerken bu deseni koru - media query bloğunu HER
   ZAMAN ilgili temel kuralların hepsinden SONRAYA (ideal: dosyanın en sonuna) koy. */
@media (max-width: 480px){
  .splash-card{
    padding: 16px 18px 12px;
    min-height: 0;
  }
  .splash-logo{
    width: 88px;
    height: 88px;
    margin: 0 auto 10px;
  }
  .splash-title{
    font-size: 1.2rem;
    margin-bottom: 4px;
  }
  .splash-sub{
    font-size: .84rem;
    margin-bottom: 10px;
  }
  .btn-lime-pill{
    padding: 9px 28px;
    font-size: .92rem;
  }
  .splash-secondary-actions{
    margin-top: 8px;
  }
  .btn-outline-pill{
    padding: 7px 10px;
    font-size: .72rem;
  }
  .calisma-saatleri-card{
    padding: 12px 14px 8px;
    margin: 12px -4px 4px;
  }
  .calisma-saatleri-title{
    font-size: .92rem;
    margin-bottom: 8px;
  }
  .calisma-saatleri-row{
    padding: 4px 0;
    font-size: .76rem;
  }
  .splash-footer{
    padding-top: 10px;
    font-size: .66rem;
  }
}