/*
  Chamelli — minimalist, high-performance theme (no external dependencies)
  Author: Sibermimar (Güray Avcı)
*/

:root{
  /* Light / airy food theme (default) */
  --bg:#fbfcfe;
  --text:#0b1020;
  --muted:#56607a;
  --card:#ffffff;
  --border:rgba(11,16,32,.09);
  /* Food accents: fresh green + warm amber */
  --accent:#18a56f;
  --accent2:#f59e0b;
  --shadow:0 16px 44px rgba(11,16,32,.08);
  --radius:18px;
  --radius-sm:12px;
  /* Brand / Public dark palette (panel → Tema Tokenları ile override edilebilir) */
  --brand-bg:#070a13;
  --brand-text:#f2f5ff;
  --brand-muted:#a7b0c7;
  --brand-card:#0d1222;
  --brand-border:rgba(242,245,255,.10);
  --brand-shadow:0 16px 38px rgba(0,0,0,.45);
  --container:100%;
  --container-pad:clamp(16px, 3.2vw, 56px);
  --space:16px;
  --space2:24px;
  --space3:40px;
  --focus:0 0 0 3px color-mix(in srgb, var(--accent) 26%, transparent);
  --focus2:0 0 0 3px color-mix(in srgb, var(--accent2) 28%, transparent);

  /* Typography (panelden değiştirilebilir) */
  --font-body:'Montserrat',system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,Arial,sans-serif;
  --font-head:'Montserrat',system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,Arial,sans-serif;
}

/* Dark mode (kept very lightweight) */
@media (prefers-color-scheme: dark){
  :root{
    --bg:var(--brand-bg, #070a13);
    --text:var(--brand-text, #f2f5ff);
    --muted:var(--brand-muted, #a7b0c7);
    --card:var(--brand-card, #0d1222);
    --border:var(--brand-border, rgba(242,245,255,.10));
    --shadow:var(--brand-shadow, 0 16px 38px rgba(0,0,0,.45));
  }
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:var(--font-body);
  line-height:1.55;
  text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;
}

::selection{
  background:color-mix(in srgb, var(--accent) 22%, transparent);
  color:var(--text);
}

h1,h2,h3,h4,h5,h6{
  font-family:var(--font-head);
}

a{
  color:inherit;
  text-decoration:none;
  text-decoration-thickness:2px;
  text-underline-offset:3px;
}
a:hover{opacity:1}
a:focus-visible{
  outline:3px solid color-mix(in srgb, var(--accent) 65%, transparent);
  outline-offset:3px;
  border-radius:10px;
}

/* Inline link visibility (accessibility) */
p a, .note a, .small a, .product-desc a{
  text-decoration:underline;
  text-decoration-color:color-mix(in srgb, var(--accent) 70%, transparent);
}
p a:hover, .note a:hover, .small a:hover, .product-desc a:hover{
  text-decoration-color:color-mix(in srgb, var(--accent2) 80%, var(--accent));
}

img{max-width:100%; height:auto; display:block}

.container{
  width:100%;
  max-width:var(--container);
  margin:0 auto;
  padding:0 var(--container-pad);
}

.skip-link{
  position:absolute;
  left:-999px;
  top:auto;
  width:1px;height:1px;
  overflow:hidden;
}
.skip-link:focus{
  left:var(--space);
  top:var(--space);
  width:auto;height:auto;
  background:var(--bg);
  border:1px solid var(--border);
  padding:10px 12px;
  border-radius:var(--radius-sm);
  box-shadow:var(--shadow);
  z-index:9999;
}

.sr-only{
  position:absolute!important;
  width:1px;height:1px;
  padding:0;margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}

header.site-header{
  position:sticky;
  top:0;
  z-index:50;
  background:color-mix(in srgb, var(--card) 96%, transparent);
  border-bottom:1px solid var(--border);
}

.header-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:12px 0;
}

.brand{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:180px;
}
.brand svg{width:34px;height:34px}
.brand .name{
  font-weight:800;
  letter-spacing:.2px;
}
.brand .tag{
  display:block;
  font-size:12px;
  color:var(--muted);
  margin-top:2px;
}

.nav{
  display:flex;
  align-items:center;
  gap:14px;
}

.nav a{
  padding:10px 10px;
  border-radius:12px;
  color:var(--muted);
  font-weight:600;
}
.nav a.active{
  color:var(--text);
  background:color-mix(in srgb, var(--card) 80%, transparent);
  border:1px solid var(--border);
}

.right-actions{
  display:flex;
  align-items:center;
  gap:10px;
}


/* Language switcher (SVG button + dropdown) */
.lang-wrap{position:relative}
.lang-wrap > summary{list-style:none}
.lang-wrap > summary::-webkit-details-marker{display:none}
.lang-btn{
  appearance:none;
  display:inline-flex;
  align-items:center;
  gap:8px;
  border:1px solid var(--border);
  background:var(--bg);
  color:var(--text);
  padding:10px 12px;
  border-radius:14px;
  font-weight:900;
  cursor:pointer;
}
.lang-btn:focus{outline:none; box-shadow:var(--focus2)}
.lang-code{font-size:12px; letter-spacing:.8px}
.lang-menu{
  position:absolute;
  top:calc(100% + 10px);
  right:0;
  min-width:200px;
  max-width:calc(100vw - 32px);
  max-height:min(60vh, 360px);
  overflow:auto;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  padding:8px;
  border-radius:16px;
  background:var(--card);
  border:1px solid var(--border);
  box-shadow:var(--shadow);
  display:none;
  gap:4px;
  z-index:80;
}
.lang-menu a{
  padding:10px 12px;
  border-radius:12px;
  color:var(--muted);
  font-weight:800;
}
.lang-menu a:hover{background:color-mix(in srgb, var(--bg) 70%, transparent)}
.lang-menu a[aria-current="true"]{
  background:color-mix(in srgb, var(--card) 70%, transparent);
  border:1px solid var(--border);
  color:var(--text);
}
[dir="rtl"] .lang-menu{right:auto; left:0}
.lang-wrap[open] .lang-menu{display:grid}


/* Panel: Kur + Dil durum widget (header) */
.is-panel .panel-status-wrap{position:relative}
.is-panel .panel-status-btn{gap:8px}
.is-panel .panel-status-dot{
  width:10px;
  height:10px;
  border-radius:999px;
  display:inline-block;
  margin-left:6px;
  box-shadow:0 0 0 3px rgba(255,255,255,.06);
}
.is-panel .panel-status-dot.ok{background:color-mix(in srgb, var(--accent) 80%, #000)}
.is-panel .panel-status-dot.warn{background:color-mix(in srgb, #f59e0b 85%, #000)}
.is-panel .panel-status-dot.off{background:color-mix(in srgb, var(--muted) 70%, transparent)}
.is-panel .panel-status-menu{min-width:280px}
.is-panel .panel-status-item{
  padding:10px 12px;
  border-radius:12px;
  color:var(--muted);
  font-weight:800;
  font-size:13px;
  line-height:1.35;
}
.is-panel .panel-status-item strong{color:var(--text)}
.is-panel .panel-status-link{margin-top:4px}
@media(max-width:520px){
  .is-panel .panel-status-wrap{display:none}
}

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:10px 14px;
  border-radius:14px;
  border:1px solid var(--border);
  background:var(--bg);
  font-weight:600;
  cursor:pointer;
  white-space:nowrap;
}
.btn:focus{outline:none; box-shadow:var(--focus)}
.btn.primary{
  /* Tema accent rengi çok açık seçilse bile butonun kaybolmaması için hafif koyulaştırma */
  background:linear-gradient(
    135deg,
    color-mix(in srgb, var(--accent) 92%, #000),
    color-mix(in srgb, var(--accent2) 40%, color-mix(in srgb, var(--accent) 92%, #000))
  );
  border:none;
  color:white;
  box-shadow:0 14px 36px rgba(24,165,111,.18);
}
.btn.ghost{
  background:color-mix(in srgb, var(--card) 70%, transparent);
}

.btn:not(.primary):hover{
  background:color-mix(in srgb, var(--card) 92%, var(--bg));
  border-color:color-mix(in srgb, var(--accent) 14%, var(--border));
}
.btn:not(.primary):active{transform:translateY(1px)}
.btn.primary:hover{
  filter:brightness(1.02);
  box-shadow:0 18px 44px rgba(24,165,111,.22);
}
.btn.primary:active{transform:translateY(1px)}
.btn.ghost:hover{background:color-mix(in srgb, var(--card) 84%, transparent)}

.burger{
  display:none;
  border:1px solid var(--border);
  border-radius:12px;
  padding:10px;
  background:var(--bg);
}
.burger:focus{outline:none; box-shadow:var(--focus)}

.hero{
  padding:56px 0 26px;
}
.hero-grid{
  display:grid;
  grid-template-columns:1.15fr .85fr;
  gap:var(--space3);
  align-items:center;
}
.hero h1{
  margin:0 0 12px 0;
  font-size:clamp(28px, 3.4vw, 44px);
  line-height:1.12;
  letter-spacing:-.4px;
}
.hero p{
  margin:0 0 18px 0;
  color:var(--muted);
  font-size:clamp(14px, 1.4vw, 18px);
}
.hero-actions{display:flex; gap:10px; flex-wrap:wrap; margin-top:8px}

.hero-card{
  background:radial-gradient(1200px 420px at 20% 10%, rgba(24,165,111,.16), transparent 55%),
             radial-gradient(900px 340px at 80% 20%, rgba(245,158,11,.14), transparent 60%),
             var(--card);
  border:1px solid var(--border);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  padding:18px;
}
.hero-card .stat{
  display:flex;
  gap:12px;
  align-items:flex-start;
  padding:12px;
  border-radius:14px;
  background:color-mix(in srgb, var(--bg) 55%, transparent);
  border:1px solid var(--border);
  margin-bottom:10px;
}
.hero-card .dot{
  width:12px;height:12px;border-radius:50%;
  background:var(--accent);
  margin-top:4px;
  box-shadow:0 0 0 6px rgba(24,165,111,.12);
}
.hero-card h3{
  margin:0;
  font-size:14px;
}
.hero-card p{
  margin:4px 0 0 0;
  font-size:13px;
  color:var(--muted);
}



/* Home (full-screen 4 category cover) */
/* Safe area aware defaults (iOS notch/home-indicator) */
body{--float-bottom:calc(18px + env(safe-area-inset-bottom)); --home-bottom-space:0px}
body.layout-home{background:var(--bg); --float-bottom:calc(120px + env(safe-area-inset-bottom)); --home-bottom-space:120px}
body.layout-cover{
  background:radial-gradient(1200px 420px at 20% 10%, rgba(24,165,111,.14), transparent 55%),
             radial-gradient(900px 340px at 80% 20%, rgba(245,158,11,.12), transparent 60%),
             var(--bg);
  --float-bottom:calc(120px + env(safe-area-inset-bottom));
}

/* ---------------------------------------------------------
   v0.1.88 — Public sayfalarda tema tutarlılığı
   - Cihazın light/dark tercihinden bağımsız, varsayılan marka koyu paleti kullanılır
   - Panel (is-panel) etkilenmez
   v0.1.96 — Tema tokenları ile renkleri tek yerden yönetme:
   - Bu zorlayıcı koyu palet sadece `tema-default` için geçerli
   - Renkler `--brand-*` değişkenlerinden gelir (panel → Tema Tokenları)
----------------------------------------------------------*/
body.tema-default.layout-home:not(.is-panel),
body.tema-default.layout-cover:not(.is-panel){
  --bg:var(--brand-bg, #070a13);
  --text:var(--brand-text, #f2f5ff);
  --muted:var(--brand-muted, #a7b0c7);
  --card:var(--brand-card, #0d1222);
  --border:var(--brand-border, rgba(242,245,255,.10));
  --shadow:var(--brand-shadow, 0 16px 38px rgba(0,0,0,.45));
}

.site-header-home{
  position:absolute;
  inset:0;
  z-index:40;
  background:transparent;
  border:none;
  pointer-events:none;
}
.site-header-home .lang-wrap{pointer-events:auto}

.site-header-home .header-actions.home-actions{
  position:absolute;
  top:max(18px, env(safe-area-inset-top));
  right:max(18px, env(safe-area-inset-right));
  z-index:20;
  pointer-events:auto;
}

/* Cover layout (applies homepage concept to all inner pages) */
.site-header-cover{
  position:fixed;
  top:0;
  left:0;
  right:0;
  height:72px;
  z-index:46;
  background:linear-gradient(180deg, color-mix(in srgb, var(--bg) 86%, transparent) 0%, rgba(0,0,0,0) 100%);
  border:none;
  pointer-events:none;
}
.site-header-cover .cover-logo{
  position:absolute;
  left:50%;
  top:max(14px, env(safe-area-inset-top));
  transform:translateX(-50%);
  pointer-events:auto;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:8px 10px;
  border-radius:999px;
  background:color-mix(in srgb, var(--bg) 70%, transparent);
  border:1px solid var(--border);
  box-shadow:0 16px 40px rgba(11,16,32,.14);
}
.site-header-cover .cover-logo img{width:44px; height:44px}
.site-header-cover .header-actions.cover-actions{
  position:absolute;
  top:max(18px, env(safe-area-inset-top));
  right:max(18px, env(safe-area-inset-right));
  z-index:20;
  pointer-events:auto;
}

.cover-main{
  position:fixed;
  inset:0;
  z-index:10;
  padding:0;
}
.cover-scroll{
  height:100%;
  overflow:auto;
  -webkit-overflow-scrolling:touch;
  padding-top:calc(92px + env(safe-area-inset-top));
  padding-bottom:calc(160px + env(safe-area-inset-bottom));
}
.cover-panel{
  background:color-mix(in srgb, var(--card) 92%, transparent);
  border:1px solid var(--border);
  border-radius:22px;
  box-shadow:var(--shadow);
  padding:6px;
}

[dir="rtl"] .site-header-cover .header-actions.cover-actions{right:auto; left:max(18px, env(safe-area-inset-left))}

.layout-home .lang-btn, .layout-cover .lang-btn{
  background:color-mix(in srgb, var(--bg) 72%, transparent);
  border:1px solid var(--border);
  color:var(--text);
}
.layout-home .lang-menu, .layout-cover .lang-menu{
  background:color-mix(in srgb, var(--card) 86%, transparent);
  border:1px solid var(--border);
  box-shadow:var(--shadow);
}
.layout-home .lang-menu a, .layout-cover .lang-menu a{color:var(--muted)}
.layout-home .lang-menu a:hover, .layout-cover .lang-menu a:hover{background:color-mix(in srgb, var(--bg) 70%, transparent)}
.layout-home .lang-menu a[aria-current="true"], .layout-cover .lang-menu a[aria-current="true"]{background:color-mix(in srgb, var(--card) 85%, transparent); color:var(--text); border-color:var(--border)}

.home-main{padding:0}
.home-cover{
  position:relative;
  width:100%;
  height:100vh;
  height:100svh;
  overflow:hidden;
}
.home-grid{
  position:absolute;
  top:0;
  left:0;
  right:0;
  bottom:var(--home-bottom-space, 0px);
  box-sizing:border-box;
  display:grid;
  grid-template-columns:repeat(var(--home-cols, 2), 1fr);
  grid-template-rows:repeat(var(--home-rows, 2), 1fr);
  grid-auto-flow:dense;
  gap:var(--home-gap, 2px);
  padding:var(--home-pad, 0);
  /* gap separators */
  background:var(--home-gap-bg, var(--bg));
}

/* Home Cover modları — özel davranışlar */
.home-mode-vertical-fill .home-grid,
.home-mode-vertical-rot80 .home-grid,
.home-mode-horizontal-rot30 .home-grid{
  display:flex;
  gap:0;
  padding:0;
  background:transparent;
}

/* Dikey (Tam alan): görsel sayısı kadar kolon */
.home-mode-vertical-fill .home-grid{flex-direction:row}
.home-mode-vertical-fill .home-grid a.home-tile{flex:1 1 0}

/* Dikey(çapraz): kolonlar; birleşimler / şeklinde */
.home-mode-vertical-rot80 .home-grid{
  flex-direction:row;
  background:transparent;
  /* kolon sayısına göre otomatik kesim miktarı */
  --home-vcut: clamp(26px, calc(100% / var(--home-cols, 4) / 2.6), 150px);
}
.home-mode-vertical-rot80 .home-grid a.home-tile{
  flex:1 1 0;
  position:relative;
}

/* clip-path destekliyse gerçek çapraz birleşimleri uygula (fallback: düz Dikey) */
@supports (clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%)){
  /* overlap nedeniyle sağ tarafta boşluk kalmaması için grid'i hafif genişlet */
  .home-mode-vertical-rot80 .home-grid{right: calc(0px - var(--home-vcut));}

  .home-mode-vertical-rot80 .home-grid a.home-tile{
    z-index:1;
    /* "/" birleşim: sol kenarı çapraz kes, alttaki görsel görünsün */
    clip-path: polygon(var(--home-vcut) 0, 100% 0, 100% 100%, 0 100%);
    margin-left: calc(var(--home-vcut) * -1);
    transition: transform .42s ease, clip-path .42s ease;
    transform: translateZ(0);
  }
  .home-mode-vertical-rot80 .home-grid a.home-tile:first-child,
  .home-mode-vertical-rot80 .home-grid a.home-tile:only-child{
    clip-path:none;
    margin-left:0;
  }

  /* Hover'da z-index yükselirken birleşim çizgisi düzleşmesin diye sağ kenarı da paralel kes */
  .home-mode-vertical-rot80 .home-grid a.home-tile:hover{
    z-index:3;
    transform: scale(1.03);
  }
  .home-mode-vertical-rot80 .home-grid a.home-tile:hover:not(:last-child){
    clip-path: polygon(var(--home-vcut) 0, 100% 0, calc(100% - var(--home-vcut)) 100%, 0 100%);
  }
  .home-mode-vertical-rot80 .home-grid a.home-tile:first-child:hover:not(:last-child){
    clip-path: polygon(0 0, 100% 0, calc(100% - var(--home-vcut)) 100%, 0 100%);
  }
}


/* Yatay(çapraz): yatay şeritler; satırların sağ uçları yukarı kalkık */
.home-mode-horizontal-rot30 .home-grid{
  flex-direction:column;
  background:transparent;
  /* satır yüksekliğine göre otomatik eğim; sağ uçtaki yükselme */
  --home-hraise: clamp(56px, 10vh, 160px);
}
.home-mode-horizontal-rot30 .home-grid a.home-tile{
  flex:1 1 0;
  position:relative;
}

/* clip-path destekliyse gerçek çapraz birleşimleri uygula (fallback: düz Yatay) */
@supports (clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%)){
  /* Not: anasayfa alt bar yüksekliği hesaplanıp grid aşağıdan kırpılır (JS -> --home-bottom-space) */
  .home-mode-horizontal-rot30 .home-grid{bottom:var(--home-bottom-space, 0px);}

  .home-mode-horizontal-rot30 .home-grid a.home-tile{
    z-index:1;
    /* tüm satır boyunca çapraz: üst/alt kenarlar sol→sağ yükselir */
    clip-path: polygon(
      0 var(--home-hraise),
      100% 0,
      100% calc(100% - var(--home-hraise)),
      0 100%
    );
    margin-top: calc(var(--home-hraise) * -1);
    transition: transform .42s ease, clip-path .42s ease;
    transform: translateZ(0);
  }
  .home-mode-horizontal-rot30 .home-grid a.home-tile:first-child{
    margin-top:0;
    clip-path: polygon(
      0 0,
      100% 0,
      100% calc(100% - var(--home-hraise)),
      0 100%
    );
  }
  .home-mode-horizontal-rot30 .home-grid a.home-tile:last-child{
    clip-path: polygon(
      0 var(--home-hraise),
      100% 0,
      100% 100%,
      0 100%
    );
  }
  .home-mode-horizontal-rot30 .home-grid a.home-tile:only-child{
    clip-path:none;
    margin-top:0;
  }
  .home-mode-horizontal-rot30 .home-grid a.home-tile:hover{z-index:3; transform: scale(1.02)}
}


a.home-tile.is-wide{grid-column:span 2}

a.home-tile{
  position:relative;
  display:block;
  overflow:hidden;
  isolation:isolate;
  container-type:size;
  background:#000;
}

a.home-tile img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  transform:none;
  transition:transform .55s ease;
  filter:none;
}

a.home-tile:hover img{transform:scale(var(--home-img-scale-hover, 1.06))}

a.home-tile .tile-overlay{
  position:absolute;
  inset:0;
  padding:18px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:flex-end;
  gap:0;
  text-align:left;
  background:linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.62) 100%);
  color:#fff;
}

a.home-tile:hover .tile-overlay{
  background:linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.66) 100%);
}

a.home-tile .tile-text{
  max-width:min(50ch, 92%);
  padding:10px 12px;
  border-radius:18px;
  background:rgba(0,0,0,var(--home-text-frame-a, .48));
  border:1px solid rgba(255,255,255,var(--home-text-frame-border-a, .14));
  box-shadow:0 14px 40px rgba(0,0,0,.22);
  -webkit-backdrop-filter: blur(var(--home-text-frame-blur, 8px));
  backdrop-filter: blur(var(--home-text-frame-blur, 8px));
}


a.home-tile:hover .tile-text{
  background:rgba(0,0,0,var(--home-text-frame-a-hover, .56));
  border-color:rgba(255,255,255,var(--home-text-frame-border-hover-a, .18));
}

/* Yazı çerçevesi tamamen kapalıysa (panel ayarı) */
.home-text-frame-off a.home-tile .tile-text{
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  -webkit-backdrop-filter:none;
  backdrop-filter:none;
}
.home-text-frame-off a.home-tile:hover .tile-text{
  background:transparent;
  border-color:transparent;
}

a.home-tile .tile-text h2{
  margin:0;
  font-size:clamp(16px, 2vw, 28px);
  letter-spacing:-.2px;
  text-shadow:0 10px 28px rgba(0,0,0,.35);
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

a.home-tile .tile-text p{
  margin:0;
  margin-top:6px;
  font-size:13px;
  opacity:.92;
  max-width:46ch;
  text-shadow:0 10px 28px rgba(0,0,0,.25);
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

/* Grid modlarında yazıyı tam ortada tut */
.home-mode-grid-square a.home-tile .tile-overlay,
.home-mode-mosaic a.home-tile .tile-overlay{
  align-items:center;
  justify-content:center;
  text-align:center;
  background:radial-gradient(circle at 50% 50%, rgba(0,0,0,.18) 0%, rgba(0,0,0,.64) 100%);
}
.home-mode-grid-square a.home-tile:hover .tile-overlay,
.home-mode-mosaic a.home-tile:hover .tile-overlay{
  background:radial-gradient(circle at 50% 50%, rgba(0,0,0,.12) 0%, rgba(0,0,0,.62) 100%);
}

/* Dikey/Yatay + Çapraz modlarda yazıyı ortala */
.home-mode-vertical-fill a.home-tile .tile-overlay,
.home-mode-vertical-rot80 a.home-tile .tile-overlay,
.home-mode-horizontal-stack a.home-tile .tile-overlay,
.home-mode-horizontal-rot30 a.home-tile .tile-overlay{
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:clamp(14px, 2.2vw, 28px);
  background:radial-gradient(circle at 50% 55%, rgba(0,0,0,.58) 0%, rgba(0,0,0,.24) 42%, rgba(0,0,0,0) 78%);
}

.home-mode-vertical-fill a.home-tile:hover .tile-overlay,
.home-mode-vertical-rot80 a.home-tile:hover .tile-overlay,
.home-mode-horizontal-stack a.home-tile:hover .tile-overlay,
.home-mode-horizontal-rot30 a.home-tile:hover .tile-overlay{
  background:radial-gradient(circle at 50% 55%, rgba(0,0,0,.62) 0%, rgba(0,0,0,.28) 42%, rgba(0,0,0,0) 80%);
}

/* Dikey(çapraz): sol kesime girmesin diye içerik alanını sağa kaydır */
.home-mode-vertical-rot80 a.home-tile .tile-overlay{
  padding-left: calc(clamp(14px, 2.2vw, 28px) + (var(--home-vcut, 0px) / 2));
  padding-right: clamp(14px, 2.2vw, 28px);
  background:radial-gradient(circle at 60% 55%, rgba(0,0,0,.58) 0%, rgba(0,0,0,.24) 42%, rgba(0,0,0,0) 78%);
}
.home-mode-vertical-rot80 a.home-tile:hover .tile-overlay{
  background:radial-gradient(circle at 60% 55%, rgba(0,0,0,.62) 0%, rgba(0,0,0,.28) 42%, rgba(0,0,0,0) 80%);
}

/* Bu modlarda varsayılan: yazı kutusu (çerçeve) yok.
   Panelde “Yazı Çerçevesi: Açık” seçilirse yeniden aktif olur. */
.home-mode-vertical-fill:not(.home-text-frame-on) a.home-tile .tile-text,
.home-mode-vertical-rot80:not(.home-text-frame-on) a.home-tile .tile-text,
.home-mode-horizontal-stack:not(.home-text-frame-on) a.home-tile .tile-text,
.home-mode-horizontal-rot30:not(.home-text-frame-on) a.home-tile .tile-text{
  max-width:min(48ch, 92%);
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  -webkit-backdrop-filter:none;
  backdrop-filter:none;
}

/* Tipografi: mod bazlı daha dengeli kararlar */
.home-mode-vertical-fill a.home-tile .tile-text h2,
.home-mode-vertical-rot80 a.home-tile .tile-text h2,
.home-mode-horizontal-stack a.home-tile .tile-text h2,
.home-mode-horizontal-rot30 a.home-tile .tile-text h2{
  line-height:1.06;
  text-shadow:0 6px 20px rgba(0,0,0,.55);
  text-wrap:balance;
}

.home-mode-vertical-fill a.home-tile .tile-text p,
.home-mode-vertical-rot80 a.home-tile .tile-text p,
.home-mode-horizontal-stack a.home-tile .tile-text p,
.home-mode-horizontal-rot30 a.home-tile .tile-text p{
  margin-top:8px;
  max-width:46ch;
  text-shadow:0 6px 18px rgba(0,0,0,.45);
  opacity:.92;
}

/* Dikey: başlık daha büyük, açıklama okunur */
.home-mode-vertical-fill a.home-tile .tile-text h2{font-size:clamp(18px, 3.2vw, 36px); -webkit-line-clamp:3}
.home-mode-vertical-fill a.home-tile .tile-text p{font-size:clamp(13px, 1.8vw, 17px); -webkit-line-clamp:3}

/* Dikey(çapraz): kesime girmesin diye daha sıkı */
.home-mode-vertical-rot80 a.home-tile .tile-text h2{font-size:clamp(17px, 3vw, 34px); -webkit-line-clamp:3}
.home-mode-vertical-rot80 a.home-tile .tile-text p{font-size:clamp(13px, 1.7vw, 16px); -webkit-line-clamp:2; max-width:40ch}

/* Yatay: açıklamalar görünsün, boşluk hissi azalsın */
.home-mode-horizontal-stack a.home-tile .tile-text h2{font-size:clamp(18px, 2.6vw, 34px); -webkit-line-clamp:2}
.home-mode-horizontal-stack a.home-tile .tile-text p{font-size:clamp(13px, 1.5vw, 16px); -webkit-line-clamp:2}

/* Yatay(çapraz): mevcut iyi görünüm + taşma önleme */
.home-mode-horizontal-rot30 a.home-tile .tile-text h2{font-size:clamp(18px, 2.6vw, 34px); -webkit-line-clamp:2}
.home-mode-horizontal-rot30 a.home-tile .tile-text p{font-size:clamp(13px, 1.5vw, 16px); -webkit-line-clamp:2}

@supports (width: 1cqw){
  .home-mode-vertical-fill a.home-tile .tile-text h2{font-size:clamp(18px, 7cqw, 36px)}
  .home-mode-vertical-fill a.home-tile .tile-text p{font-size:clamp(13px, 3.2cqw, 17px)}

  .home-mode-vertical-rot80 a.home-tile .tile-text h2{font-size:clamp(17px, 6.4cqw, 34px)}
  .home-mode-vertical-rot80 a.home-tile .tile-text p{font-size:clamp(13px, 3cqw, 16px)}

  .home-mode-horizontal-stack a.home-tile .tile-text h2{font-size:clamp(18px, 4.2cqw, 34px)}
  .home-mode-horizontal-stack a.home-tile .tile-text p{font-size:clamp(13px, 2.2cqw, 16px)}

  .home-mode-horizontal-rot30 a.home-tile .tile-text h2{font-size:clamp(18px, 4.2cqw, 34px)}
  .home-mode-horizontal-rot30 a.home-tile .tile-text p{font-size:clamp(13px, 2.2cqw, 16px)}
}

/* Tile boyutu küçükse (çok görsel): fontları sıkılaştır; çok küçükte açıklamayı gizle */
@container (max-height: 220px){
  a.home-tile .tile-overlay{padding:12px}
  a.home-tile .tile-text{padding:8px 10px; border-radius:16px}
  a.home-tile .tile-text p{-webkit-line-clamp:1}
  a.home-tile .tile-text h2{font-size:clamp(13px, 2.6vw, 20px)}
}
@container (max-height: 140px){
  a.home-tile .tile-overlay{padding:10px}
  a.home-tile .tile-text{padding:7px 9px; border-radius:14px}
  a.home-tile .tile-text p{display:none}
  a.home-tile .tile-text h2{-webkit-line-clamp:1; font-size:13px}
}



/* Tile çok dar ise (dikey modlarda): yazıyı otomatik sadeleştir */
@container (max-width: 260px){
  a.home-tile .tile-overlay{padding:12px}
  a.home-tile .tile-text{max-width:94%; padding:8px 10px}
  a.home-tile .tile-text p{-webkit-line-clamp:1}
  a.home-tile .tile-text h2{font-size:14px; -webkit-line-clamp:2}
}
@container (max-width: 200px){
  a.home-tile .tile-text p{display:none}
  a.home-tile .tile-text h2{-webkit-line-clamp:1; font-size:13px}
}
a.home-tile:focus{outline:none; box-shadow:0 0 0 3px rgba(255,255,255,.28) inset}

.home-center{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  z-index:30;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:var(--hc-gap, 10px);
  padding:var(--hc-pad-y, 16px) var(--hc-pad-x, 18px);
  border-radius:var(--hc-radius, 22px);
  background:color-mix(in srgb, var(--bg) var(--hc-bg-mix, 64%), transparent);
  border:1px solid color-mix(in srgb, var(--border) var(--hc-border-mix, 100%), transparent);
  box-shadow:0 18px 44px rgba(11,16,32,.14);
  -webkit-backdrop-filter: blur(var(--hc-blur, 0px));
  backdrop-filter: blur(var(--hc-blur, 0px));
}
.home-center img{width:var(--hc-logo, 82px); height:var(--hc-logo, 82px)}
.home-center .name{color:var(--text); font-weight:950; font-size:var(--hc-title, 22px); letter-spacing:.2px}
.home-center .tag{color:var(--muted); font-size:var(--hc-tag, 12px); text-align:center; max-width:var(--hc-tag-max, 34ch)}

/* v0.1.97 — Orta logo kartı: tagline rozet (opsiyonel) */
.home-center.hc-tag-pill-d .tag{
  padding:4px 10px;
  border-radius:999px;
  background: color-mix(in srgb, var(--bg) 78%, transparent);
  border:1px solid color-mix(in srgb, var(--border) 70%, transparent);
  color: color-mix(in srgb, var(--text) 86%, var(--muted));
}

/* Panel önizleme: absolute konumlandırma devre dışı */
.home-center.is-preview{
  position:relative;
  left:auto;
  top:auto;
  right:auto;
  bottom:auto;
  transform:none;
  margin:0 auto;
  z-index:auto;
}


/* Home logo konumu (panelden seçilebilir) */
.home-center.pos-top-left{left:18px; top:92px; transform:none; align-items:flex-start; text-align:left}
.home-center.pos-top-center{left:50%; top:92px; transform:translateX(-50%)}
.home-center.pos-top-right{left:auto; right:18px; top:92px; transform:none; align-items:flex-end; text-align:right}
.home-center.pos-middle-left{left:18px; top:50%; transform:translateY(-50%); align-items:flex-start; text-align:left}
.home-center.pos-middle-right{left:auto; right:18px; top:50%; transform:translateY(-50%); align-items:flex-end; text-align:right}
.home-center.pos-bottom-left{left:18px; top:auto; bottom:calc(var(--float-bottom) + 84px); transform:none; align-items:flex-start; text-align:left}
.home-center.pos-bottom-center{left:50%; top:auto; bottom:calc(var(--float-bottom) + 84px); transform:translateX(-50%)}
.home-center.pos-bottom-right{left:auto; right:18px; top:auto; bottom:calc(var(--float-bottom) + 84px); transform:none; align-items:flex-end; text-align:right}

[dir="rtl"] .home-center.pos-top-left,[dir="rtl"] .home-center.pos-middle-left,[dir="rtl"] .home-center.pos-bottom-left{left:auto; right:18px}
[dir="rtl"] .home-center.pos-top-right,[dir="rtl"] .home-center.pos-middle-right,[dir="rtl"] .home-center.pos-bottom-right{right:auto; left:18px}

.market-cta{
  position:absolute;
  left:clamp(12px, 3.2vw, 54px);
  top:50%;
  z-index:31;
  width:248px;
  height:60px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  color:var(--text);
  text-decoration:none;
  /* Konumlandırma (panelden seçilebilir) */
  --cta-base-transform: translateY(-50%);
  transform:var(--cta-base-transform);
  filter:drop-shadow(0 18px 38px rgba(11,16,32,.22));
  transition:transform .25s ease, filter .25s ease;
}

/* Market butonu konumları (panel) */
.market-cta.pos-middle-left{left:clamp(12px, 3.2vw, 54px); right:auto; top:50%; bottom:auto; --cta-base-transform: translateY(-50%)}
.market-cta.pos-middle-right{left:auto; right:clamp(12px, 3.2vw, 54px); top:50%; bottom:auto; --cta-base-transform: translateY(-50%)}

.market-cta.pos-top-left{left:clamp(12px, 3.2vw, 54px); right:auto; top:92px; bottom:auto; --cta-base-transform: none}
.market-cta.pos-top-center{left:50%; right:auto; top:92px; bottom:auto; --cta-base-transform: translateX(-50%)}
.market-cta.pos-top-right{left:auto; right:clamp(12px, 3.2vw, 54px); top:92px; bottom:auto; --cta-base-transform: none}

.market-cta.pos-bottom-left{left:clamp(12px, 3.2vw, 54px); right:auto; top:auto; bottom:calc(var(--float-bottom) + 12px); --cta-base-transform: none}
.market-cta.pos-bottom-center{left:50%; right:auto; top:auto; bottom:calc(var(--float-bottom) + 12px); --cta-base-transform: translateX(-50%)}
.market-cta.pos-bottom-right{left:auto; right:clamp(12px, 3.2vw, 54px); top:auto; bottom:calc(var(--float-bottom) + 12px); --cta-base-transform: none}
.market-cta svg{position:absolute; inset:0; width:100%; height:100%}
.market-cta svg .cta-bg{fill:color-mix(in srgb, var(--bg) 70%, transparent); stroke:var(--border); stroke-width:1.5}
.market-cta svg .cta-line{fill:none; stroke:color-mix(in srgb, var(--accent2) 86%, var(--accent)); stroke-width:2.6; stroke-dasharray:14 12; stroke-dashoffset:0; opacity:0}
.market-cta .txt{position:relative; font-weight:950; letter-spacing:.2px}
.market-cta .arr{position:relative; opacity:.92; transition:transform .2s ease}
.market-cta:focus{outline:none; box-shadow:var(--focus2); border-radius:999px}
.market-cta:hover{transform:var(--cta-base-transform, none) translateX(-2px) scale(1.03); filter:drop-shadow(0 22px 44px rgba(11,16,32,.26))}
.market-cta:hover svg .cta-line{opacity:1; animation:ctaDash 2.6s linear infinite}
.market-cta:hover svg .cta-bg{stroke:color-mix(in srgb, var(--accent2) 30%, var(--border))}
.market-cta:hover .arr{transform:translateX(4px)}

@keyframes ctaDash{to{stroke-dashoffset:-70}}

.home-bottom{
  position:fixed;
  left:0;
  right:0;
  bottom:0;
  z-index:45;
  pointer-events:auto;
  padding:12px var(--container-pad) max(12px, env(safe-area-inset-bottom));
  background:linear-gradient(180deg, rgba(255,255,255,0) 0%, color-mix(in srgb, var(--bg) 88%, transparent) 38%, color-mix(in srgb, var(--bg) 96%, transparent) 100%);
  border-top:1px solid color-mix(in srgb, var(--border) 70%, transparent);
}

.home-menu{
  display:flex;
  justify-content:center;
  gap:10px;
  flex-wrap:wrap;
}
.home-menu a{
  padding:10px 12px;
  border-radius:14px;
  font-weight:600;
  color:var(--text);
  border:1px solid var(--border);
  background:color-mix(in srgb, var(--bg) 72%, transparent);
}
.home-menu a:hover{opacity:1; background:color-mix(in srgb, var(--card) 80%, transparent)}
.home-menu a.active{background:color-mix(in srgb, var(--card) 92%, transparent); border-color:color-mix(in srgb, var(--accent) 26%, var(--border)); color:var(--text)}
.home-menu a:focus-visible{outline:none; box-shadow:var(--focus2)}

/* Menü konumu varyantları (Anasayfa) */
.home-menu.pos-top{
  position:fixed;
  top:0;
  left:0;
  right:0;
  z-index:44;
  pointer-events:none;
  padding:max(12px, env(safe-area-inset-top)) var(--container-pad);
  background:linear-gradient(180deg, color-mix(in srgb, var(--bg) 96%, transparent) 0%, color-mix(in srgb, var(--bg) 86%, transparent) 70%, rgba(255,255,255,0) 100%);
  border-bottom:1px solid color-mix(in srgb, var(--border) 70%, transparent);
}
.home-menu.pos-top a{pointer-events:auto}

.home-menu.pos-left, .home-menu.pos-right{
  position:fixed;
  top:50%;
  transform:translateY(-50%);
  z-index:44;
  pointer-events:auto;
  flex-direction:column;
  align-items:stretch;
  gap:8px;
  padding:12px;
  border-radius:18px;
  background:color-mix(in srgb, var(--bg) 88%, transparent);
  border:1px solid var(--border);
  box-shadow:0 18px 42px rgba(11,16,32,.18);
  max-height:calc(100vh - 48px);
  overflow:auto;
}
.home-menu.pos-left{left:12px}
.home-menu.pos-right{right:12px}
.home-menu.pos-left a, .home-menu.pos-right a{pointer-events:auto; text-align:center}

.home-footline{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  margin-top:8px;
  padding-top:8px;
  border-top:1px solid var(--border);
  font-size:12px;
  color:var(--muted);
}
.hf-brand{color:var(--accent); font-weight:950}

.home-bottom.footer-only .home-footline{margin-top:0; padding-top:0; border-top:none}

.float-btn{
  position:fixed;
  bottom:var(--float-bottom);
  z-index:60;
  display:flex;
  align-items:center;
  gap:8px;
  min-height:44px;
  padding:12px 14px;
  font-size:14px;
  border-radius:999px;
  color:var(--text);
  font-weight:600;
  text-decoration:none;
  background:color-mix(in srgb, var(--bg) 74%, transparent);
  border:1px solid var(--border);
  box-shadow:0 18px 42px rgba(11,16,32,.18);
}
.float-btn:hover{background:color-mix(in srgb, var(--card) 86%, transparent)}
.float-btn:focus{outline:none; box-shadow:var(--focus), 0 18px 42px rgba(11,16,32,.18)}
.float-call{left:16px}
.float-call span{white-space:nowrap}
.float-wa{right:16px}
.float-wa span{display:inline-flex; align-items:center; white-space:nowrap}

.float-btn svg{width:20px; height:20px}
@media (max-width: 340px){
  .float-wa span{display:none}
}


.float-call{border-color:color-mix(in srgb, var(--accent2) 34%, var(--border))}
.float-wa{border-color:color-mix(in srgb, var(--accent) 34%, var(--border))}
.float-call svg{color:var(--accent2)}
.float-wa svg{color:var(--accent)}

@supports ((-webkit-backdrop-filter: blur(10px)) or (backdrop-filter: blur(10px))){
  .site-header-cover{backdrop-filter: blur(10px) saturate(1.08)}
  .site-header-cover .cover-logo{backdrop-filter: blur(10px) saturate(1.08)}
  .layout-home .lang-btn, .layout-cover .lang-btn{backdrop-filter: blur(10px) saturate(1.08)}
  .layout-home .lang-menu, .layout-cover .lang-menu{backdrop-filter: blur(12px) saturate(1.05)}
  .home-bottom{backdrop-filter: blur(12px) saturate(1.08)}
  .float-btn{backdrop-filter: blur(10px) saturate(1.08)}
}

[dir="rtl"] .site-header-home .header-actions.home-actions{right:auto; left:max(18px, env(safe-area-inset-left))}
/* RTL: left/right konumları otomatik aynala (başlangıç/bitiş) */
[dir="rtl"] .market-cta.pos-middle-left,
[dir="rtl"] .market-cta.pos-top-left,
[dir="rtl"] .market-cta.pos-bottom-left{left:auto; right:clamp(12px, 3.2vw, 54px)}

[dir="rtl"] .market-cta.pos-middle-right,
[dir="rtl"] .market-cta.pos-top-right,
[dir="rtl"] .market-cta.pos-bottom-right{right:auto; left:clamp(12px, 3.2vw, 54px)}

@media (max-width: 860px){
  /* home grid vars */
  .home-grid{grid-template-columns:repeat(var(--home-cols-m, 2), 1fr);grid-template-rows:repeat(var(--home-rows-m, 2), 1fr)}

  /* Grid kare modunda mobil için ayrı span mantığı */
  .home-mode-grid-square .home-grid a.home-tile.is-wide{grid-column:auto}
  .home-mode-grid-square .home-grid a.home-tile.is-wide-m{grid-column:span 2}

  /* Dikey modlar: mobilde alt alta (okunabilirlik) */
  .home-mode-vertical-fill .home-grid{flex-direction:column}
  .home-mode-vertical-rot80 .home-grid{flex-direction:column}
  .home-mode-vertical-rot80 .home-grid a.home-tile{clip-path:none; margin:0}

  /* Yatay(çapraz): mobilde eğimi daha küçük tut */
  .home-mode-horizontal-rot30 .home-grid{--home-hraise: clamp(34px, 8vh, 92px)}
  .home-tile .tile-text p{display:none}
  .home-center.pos-center{top:48%}
  .home-center.pos-top-left, .home-center.pos-top-center, .home-center.pos-top-right{top:76px}
  .market-cta.pos-top-left, .market-cta.pos-top-center, .market-cta.pos-top-right{top:76px}
  .home-center.pos-bottom-left, .home-center.pos-bottom-center, .home-center.pos-bottom-right{bottom:calc(var(--float-bottom) + 96px)}
  .market-cta{width:210px; height:56px}
  .home-footline{flex-direction:column; align-items:flex-start}
  .float-call span{font-size:12px}
  /* cover layout */
  .site-header-cover{height:64px}
  .site-header-cover .cover-logo{top:max(10px, env(safe-area-inset-top))}
  .site-header-cover .cover-logo img{width:38px; height:38px}
  .site-header-cover .header-actions.cover-actions{top:max(12px, env(safe-area-inset-top)); right:max(12px, env(safe-area-inset-right))}
  [dir="rtl"] .site-header-cover .header-actions.cover-actions{right:auto; left:max(12px, env(safe-area-inset-left))}
  .site-header-home .header-actions.home-actions{top:max(12px, env(safe-area-inset-top)); right:max(12px, env(safe-area-inset-right))}
  [dir="rtl"] .site-header-home .header-actions.home-actions{right:auto; left:max(12px, env(safe-area-inset-left))}
  .cover-scroll{padding-top:calc(84px + env(safe-area-inset-top)); padding-bottom:calc(190px + env(safe-area-inset-bottom))}
}


@media (prefers-reduced-motion: reduce){
  a.home-tile img{transition:none}
}
/* Portal (home categories with photos) */
.portal{
  padding:26px 0 22px;
}
.portal-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:var(--space2);
  margin-bottom:14px;
}
.portal-head h1{
  margin:0;
  font-size:clamp(26px, 3vw, 40px);
  line-height:1.12;
  letter-spacing:-.4px;
}
.portal-head p{
  margin:6px 0 0 0;
  color:var(--muted);
  max-width:70ch;
}
.portal-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  justify-content:flex-end;
}

.portal-grid{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:14px;
  align-items:stretch;
}

a.portal-card{
  position:relative;
  display:block;
  border-radius:var(--radius);
  overflow:hidden;
  border:1px solid var(--border);
  box-shadow:var(--shadow);
  background:#000;
  min-height:clamp(220px, 42vh, 440px);
  isolation:isolate;
}
a.portal-card img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  transform:rotate(var(--home-img-rotate, 0deg)) scale(var(--home-img-scale, 1.02));
  filter:saturate(1.05) contrast(1.02);
}
a.portal-card .overlay{
  position:absolute;
  inset:0;
  padding:16px;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  gap:6px;
  background:linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.78) 100%);
  color:#fff;
}
a.portal-card .kicker{
  font-size:12px;
  font-weight:900;
  letter-spacing:.8px;
  text-transform:uppercase;
  opacity:.9;
}
a.portal-card h3{
  margin:0;
  font-size:18px;
  letter-spacing:-.2px;
}
a.portal-card p{
  margin:0;
  font-size:13px;
  opacity:.9;
  max-width:46ch;
}
a.portal-card .cta{
  margin-top:8px;
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-weight:900;
}
a.portal-card:focus{
  outline:none;
  box-shadow:var(--focus2), var(--shadow);
}

/* Subcategory photo cards (e.g. live seafood) */
.subcat-grid{
  margin-top:16px;
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:14px;
}
a.subcat-card{
  position:relative;
  display:block;
  border-radius:var(--radius);
  overflow:hidden;
  border:1px solid var(--border);
  box-shadow:var(--shadow);
  background:#000;
  min-height:180px;
}
a.subcat-card img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  transform:rotate(var(--home-img-rotate, 0deg)) scale(var(--home-img-scale, 1.02));
}
a.subcat-card .overlay{
  position:absolute;
  inset:0;
  padding:14px;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  gap:6px;
  background:linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.80) 100%);
  color:#fff;
}
a.subcat-card .kicker{
  font-size:12px;
  font-weight:900;
  letter-spacing:.8px;
  text-transform:uppercase;
  opacity:.9;
}
a.subcat-card h3{
  margin:0;
  font-size:16px;
  letter-spacing:-.2px;
}
a.subcat-card p{
  margin:0;
  font-size:13px;
  opacity:.9;
  max-width:46ch;
}
a.subcat-card:focus{
  outline:none;
  box-shadow:var(--focus2), var(--shadow);
}

.section{
  padding:30px 0;
}
.section h2{
  margin:0 0 8px 0;
  font-size:22px;
  letter-spacing:-.2px;
}
.section .lead{
  margin:0 0 18px 0;
  color:var(--muted);
}

.grid{
  display:grid;
  grid-template-columns:repeat(12, 1fr);
  gap:14px;
}
.card{
  background:var(--card);
  border:1px solid var(--border);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  padding:16px;
  min-height:100%;
}
.card h3{margin:0 0 6px 0}
.card p{margin:0;color:var(--muted);font-size:14px}
.card .icon{
  width:42px;height:42px;
  border-radius:14px;
  border:1px solid var(--border);
  background:color-mix(in srgb, var(--bg) 70%, transparent);
  display:flex;align-items:center;justify-content:center;
  margin-bottom:12px;
}
.card .icon svg{width:22px;height:22px}

.cols-4{grid-column:span 3}
.cols-6{grid-column:span 6}
.cols-12{grid-column:span 12}

.badges{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:10px;
}
.badge{
  display:inline-flex;
  gap:8px;
  align-items:center;
  padding:8px 10px;
  border-radius:999px;
  border:1px solid var(--border);
  background:color-mix(in srgb, var(--bg) 60%, transparent);
  font-size:13px;
  color:var(--muted);
  font-weight:600;
}

/* Form rozetleri (kuru/taze/dondurulmuş/konserve/yağ/canlı) */
.badge .dot{
  width:8px;
  height:8px;
  border-radius:999px;
  background:color-mix(in srgb, var(--muted) 70%, transparent);
  box-shadow:0 0 0 3px rgba(255,255,255,.06);
}

.badge.form-frozen{border-color:color-mix(in srgb, #3ba4ff 30%, var(--border)); background:color-mix(in srgb, #3ba4ff 12%, var(--bg)); color:color-mix(in srgb, var(--text) 80%, #3ba4ff)}
.badge.form-frozen .dot{background:#3ba4ff}

.badge.form-fresh{border-color:color-mix(in srgb, #56d364 30%, var(--border)); background:color-mix(in srgb, #56d364 12%, var(--bg)); color:color-mix(in srgb, var(--text) 80%, #56d364)}
.badge.form-fresh .dot{background:#56d364}

.badge.form-dried{border-color:color-mix(in srgb, #f7c948 30%, var(--border)); background:color-mix(in srgb, #f7c948 12%, var(--bg)); color:color-mix(in srgb, var(--text) 86%, #f7c948)}
.badge.form-dried .dot{background:#f7c948}

.badge.form-canned{border-color:color-mix(in srgb, #9d7bff 30%, var(--border)); background:color-mix(in srgb, #9d7bff 12%, var(--bg)); color:color-mix(in srgb, var(--text) 80%, #9d7bff)}
.badge.form-canned .dot{background:#9d7bff}

.badge.form-oil{border-color:color-mix(in srgb, #ffb020 30%, var(--border)); background:color-mix(in srgb, #ffb020 12%, var(--bg)); color:color-mix(in srgb, var(--text) 86%, #ffb020)}
.badge.form-oil .dot{background:#ffb020}

.badge.form-live{border-color:color-mix(in srgb, #22d3ee 30%, var(--border)); background:color-mix(in srgb, #22d3ee 12%, var(--bg)); color:color-mix(in srgb, var(--text) 80%, #22d3ee)}
.badge.form-live .dot{background:#22d3ee}

.toolbar{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  margin:14px 0;
}
.search{
  flex:1;
  min-width:220px;
  display:flex;
  gap:10px;
  align-items:center;
}
.search input{
  flex:1 1 auto;
  min-width:0;
  width:100%;
  padding:12px 12px;
  border-radius:14px;
  border:1px solid var(--border);
  background:var(--bg);
  color:var(--text);
  font-weight:600;
}
.search input:focus{outline:none; box-shadow:var(--focus2); border-color:color-mix(in srgb, var(--accent2) 40%, var(--border))}

/* Toolbar select blocks (panel lists) */
.toolbar .tool-sel{
  display:flex;
  flex-direction:column;
  gap:6px;
  min-width:180px;
}
.toolbar .tool-sel label{
  margin:0;
  color:var(--muted);
  font-size:12px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.7px;
}
.toolbar .tool-sel select{
  padding:12px 12px;
  border-radius:14px;
  border:1px solid var(--border);
  background:var(--bg);
  color:var(--text);
  font-weight:700;
}
.toolbar .tool-sel select:focus{outline:none; box-shadow:var(--focus2); border-color:color-mix(in srgb, var(--accent2) 40%, var(--border))}
.search .clear{
  flex:0 0 auto;
  width:44px;
  height:44px;
  border-radius:999px;
  border:1px solid var(--border);
  background:color-mix(in srgb, var(--card) 70%, transparent);
  color:var(--muted);
  font-size:18px;
  font-weight:950;
  line-height:1;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

/* Table horizontal scroll wrapper (mobile friendly) */
.table-wrap{overflow-x:auto; -webkit-overflow-scrolling:touch}
.table-wrap .table{min-width:760px}

/* Category sub-editor grid */
.subcat-grid{
  display:grid;
  grid-template-columns:110px 1.4fr 1.1fr 120px 90px;
  gap:10px;
  align-items:end;
}
@media (max-width: 820px){
  .subcat-grid{grid-template-columns:1fr 1fr}
  .subcat-grid > div:last-child{grid-column:1 / -1; justify-content:flex-start}
}
@media (max-width: 520px){
  .subcat-grid{grid-template-columns:1fr}
}
.search .clear:hover{
  background:color-mix(in srgb, var(--card) 86%, transparent);
  border-color:color-mix(in srgb, var(--accent) 18%, var(--border));
  color:var(--text);
}
.search .clear:focus-visible{outline:none; box-shadow:var(--focus2)}
.chips{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}
.chip{
  border:1px solid var(--border);
  background:color-mix(in srgb, var(--card) 70%, transparent);
  padding:9px 12px;
  border-radius:999px;
  font-weight:700;
  color:var(--muted);
  cursor:pointer;
}
.chip.active{
  background:color-mix(in srgb, var(--accent) 15%, var(--card));
  color:var(--text);
  border-color:color-mix(in srgb, var(--accent) 30%, var(--border));
}

.chip:hover{
  background:color-mix(in srgb, var(--card) 86%, transparent);
  border-color:color-mix(in srgb, var(--accent) 18%, var(--border));
  color:var(--text);
}
.chip:focus-visible{outline:none; box-shadow:var(--focus2)}


.result-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-top:6px;
  margin-bottom:10px;
}
.result-count{
  font-size:13px;
  font-weight:850;
  color:var(--muted);
}
.no-results{
  margin-top:10px;
  padding:14px;
  border:1px dashed color-mix(in srgb, var(--accent2) 30%, var(--border));
  border-radius:var(--radius-sm);
  background:color-mix(in srgb, var(--accent2) 8%, var(--bg));
  color:color-mix(in srgb, var(--text) 86%, var(--muted));
  font-weight:800;
}

/* Panel: Bulk actions bar (UX Sprint-4) */
.bulkbar{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:flex-end;
  justify-content:space-between;
  padding:10px;
  border:1px dashed color-mix(in srgb, var(--accent2) 28%, var(--border));
  border-radius:var(--radius-sm);
  background:color-mix(in srgb, var(--accent2) 6%, var(--bg));
}
.bulkbar .tool-sel{min-width:200px}
.bulkbar .bulk-hint{
  font-size:12px;
  color:var(--muted);
  font-weight:800;
}
.bulk-check{width:18px; height:18px}

.product-grid{
  display:grid;
  grid-template-columns:repeat(12, 1fr);
  gap:14px;
}
.product{
  grid-column:span 3;
  background:var(--card);
  border:1px solid var(--border);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  overflow:hidden;
  display:flex;
  flex-direction:column;
}
.product:focus-within{
  border-color:color-mix(in srgb, var(--accent) 35%, var(--border));
  box-shadow:0 0 0 3px color-mix(in srgb, var(--accent) 18%, transparent), var(--shadow);
}
.product .thumb{
  padding:0;
  border-bottom:1px solid var(--border);
  background:#000;
  position:relative;
  overflow:hidden;
  aspect-ratio:4/3;
}
.product .thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
  opacity:1;
  display:block;
  transform:scale(1.01);
  transition:transform .6s ease;
}
.product:hover .thumb img{transform:scale(1.05)}
.product .body{padding:14px}
.product .body h3{
  margin:0 0 6px 0;
  font-size:15px;
  letter-spacing:-.1px;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.product .body .meta{
  font-size:12px;
  color:var(--muted);
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}
.product .body p{
  margin:10px 0 0 0;
  font-size:13px;
  color:color-mix(in srgb, var(--text) 82%, var(--muted));
  line-height:1.45;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.product .actions{
  margin-top:auto;
  padding:14px;
  display:flex;
  gap:10px;
}

/* Product detail templates (panelden seçilebilir) */
.product-detail{padding-bottom:4px}
.product-hero{
  margin-top:14px;
  display:grid;
  grid-template-columns:minmax(260px, 480px) 1fr;
  gap:14px;
  align-items:start;
}
.product-media{padding:0; overflow:hidden; background:#000}
.product-media .product-zoom{
  display:block;
  position:relative;
  cursor:zoom-in;
  outline:none;
  aspect-ratio:1/1;
}
.product-media .product-zoom:focus{box-shadow:0 0 0 3px rgba(255,255,255,.16)}
.product-media .product-image{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transform:scale(1.01);
  transition:transform .6s ease;
}
.product-media .product-zoom:hover .product-image{transform:scale(1.04)}
.product-media .zoom-hint{
  position:absolute;
  top:12px;
  right:12px;
  width:34px;
  height:34px;
  border-radius:999px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(11,16,32,.55);
  border:1px solid rgba(255,255,255,.22);
  color:#fff;
  font-weight:950;
  line-height:1;
  user-select:none;
}

/* Optional product gallery (thumbs) */
.product-gallery{
  display:flex;
  gap:10px;
  padding:10px;
  border-top:1px solid rgba(255,255,255,.14);
  overflow:auto;
  -webkit-overflow-scrolling:touch;
}
.product-gallery::-webkit-scrollbar{height:8px}
.product-gallery::-webkit-scrollbar-thumb{
  background:rgba(255,255,255,.18);
  border-radius:999px;
}
.gthumb{
  width:80px;
  height:80px;
  flex:0 0 auto;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.18);
  background:rgba(0,0,0,.25);
  padding:0;
  overflow:hidden;
  cursor:pointer;
  transition:transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}
.gthumb img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.gthumb:hover{transform:translateY(-1px); border-color:rgba(255,255,255,.30)}
.gthumb.is-active{
  border-color:rgba(245,158,11,.62);
  box-shadow:0 0 0 3px rgba(245,158,11,.18);
}
.gthumb:focus-visible{outline:none; box-shadow:0 0 0 3px rgba(255,255,255,.18)}

.product-info{padding:18px}
.product-title{
  margin:0;
  font-size:clamp(22px, 2.3vw, 34px);
  letter-spacing:-.4px;
}
.product-meta-line{
  margin-top:8px;
  color:var(--muted);
  font-weight:800;
  font-size:13px;
}
.product-desc{
  margin:12px 0 0 0;
  color:color-mix(in srgb, var(--text) 86%, var(--muted));
  line-height:1.55;
}

.spec-chips{
  margin-top:12px;
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.spec-chips .chip{
  display:inline-flex;
  align-items:baseline;
  gap:8px;
  padding:8px 10px;
  border-radius:999px;
  border:1px solid var(--border);
  background:color-mix(in srgb, var(--bg) 60%, transparent);
  font-size:12px;
  font-weight:850;
}
.spec-chips .chip .k{
  font-size:11px;
  letter-spacing:.7px;
  text-transform:uppercase;
  color:var(--muted);
  font-weight:950;
}
.spec-chips .chip .v{font-weight:950; color:var(--text)}
.product-cta{
  margin-top:16px;
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
.product-specs-grid{
  display:grid;
  grid-template-columns:repeat(12, 1fr);
  gap:12px;
  margin-top:14px;
}
.product-spec{
  grid-column:span 4;
  border:1px solid var(--border);
  background:color-mix(in srgb, var(--bg) 60%, transparent);
  border-radius:var(--radius-sm);
  padding:12px;
}
.product-spec .k{
  font-size:12px;
  color:var(--muted);
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.7px;
}
.product-spec .v{
  margin-top:6px;
  font-weight:800;
}
@media (max-width: 980px){
  .product-hero{grid-template-columns:1fr}
  .product-media .product-zoom{aspect-ratio:16/10}
  .product-spec{grid-column:span 6}
}
@media (max-width: 560px){
  .product-info{padding:14px}
  .product-spec{grid-column:span 12}
}


/* --- Ek Ürün Şablonları: centered / showcase / minimal --- */
.product-section-title{
  margin:0 0 10px 0;
  font-size:15px;
  letter-spacing:.4px;
  text-transform:uppercase;
  color:var(--muted);
  font-weight:950;
}
.product-desc-long{
  margin:0;
  line-height:1.7;
  font-size:15px;
}
.product-desc-card{padding:18px}

/* Centered */
.product-detail--centered .product-centered{
  max-width:980px;
  margin:14px auto 0;
  display:grid;
  gap:14px;
}
.product-detail--centered .product-centered-top{
  display:grid;
  grid-template-columns:minmax(260px, 420px) 1fr;
  gap:14px;
  align-items:start;
}
.product-detail--centered .product-centered-specs{margin-top:2px}
@media (max-width: 980px){
  .product-detail--centered .product-centered-top{grid-template-columns:1fr}
}

/* Showcase */
.product-detail--showcase .product-showcase{
  margin-top:14px;
  display:grid;
  grid-template-columns:minmax(260px, 460px) 1fr;
  gap:14px;
  align-items:start;
}
.product-detail--showcase .product-showcase-media{
  position:sticky;
  top: calc(72px + env(safe-area-inset-top));
  align-self:start;
}
.product-detail--showcase .product-showcase-side{
  display:grid;
  gap:14px;
}
.product-detail--showcase .product-showcase-header{padding:18px}
.product-detail--showcase .product-showcase-desc{padding:18px}
.product-detail--showcase .product-showcase-specs{padding:18px}
@media (max-width: 980px){
  .product-detail--showcase .product-showcase{grid-template-columns:1fr}
  .product-detail--showcase .product-showcase-media{position:static}
}

/* Minimal */
.product-detail--minimal .product-minimal{
  max-width:860px;
  margin:14px auto 0;
}
.product-detail--minimal .product-minimal-card{padding:18px}
.product-detail--minimal .product-minimal-head{
  display:flex;
  gap:14px;
  align-items:flex-start;
}
.product-detail--minimal .pm-head-text{flex:1}
@media (max-width: 640px){
  .product-detail--minimal .product-minimal-head{flex-direction:column}
}

.pm-acc{
  margin-top:12px;
  border:1px solid var(--border);
  border-radius:var(--radius-md);
  overflow:hidden;
  background:var(--bg);
}
.pm-acc summary{
  cursor:pointer;
  padding:12px 14px;
  font-weight:950;
  color:var(--text);
  list-style:none;
}
.pm-acc summary::-webkit-details-marker{display:none}
.pm-acc summary::after{
  content:'+';
  float:right;
  opacity:.7;
}
.pm-acc[open] summary::after{content:'–'}
.pm-acc-body{
  border-top:1px solid var(--border);
  padding:12px 14px;
}

/* Subcategory editor grid (category edit page) */
.subcat-grid{
  display:grid;
  grid-template-columns:110px 1.4fr 1.1fr 120px 90px;
  gap:10px;
  align-items:end;
}
@media (max-width: 860px){
  .subcat-grid{grid-template-columns:1fr 1fr}
  .subcat-grid > div:last-child{grid-column:1 / -1}
}
@media (max-width: 520px){
  .subcat-grid{grid-template-columns:1fr}
}

.kv{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  margin-top:14px;
}
.kv .box{
  border:1px solid var(--border);
  background:color-mix(in srgb, var(--bg) 60%, transparent);
  border-radius:var(--radius-sm);
  padding:12px;
}
.kv .k{
  font-size:12px;
  color:var(--muted);
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.7px;
}
.kv .v{
  margin-top:6px;
  font-weight:800;
}

.form{
  display:grid;
  gap:12px;
  margin-top:10px;
}
.form label{
  font-size:13px;
  font-weight:800;
}
.form input, .form textarea, .form select{
  width:100%;
  padding:12px 12px;
  border-radius:14px;
  border:1px solid var(--border);
  background:var(--bg);
  color:var(--text);
  font-weight:600;
}
.form input::placeholder, .form textarea::placeholder{
  color:color-mix(in srgb, var(--muted) 78%, transparent);
}
.form textarea{min-height:120px; resize:vertical}
.form input:focus, .form textarea:focus, .form select:focus{outline:none; box-shadow:var(--focus); border-color:color-mix(in srgb, var(--accent) 40%, var(--border))}
.note{
  font-size:13px;
  color:var(--muted);
}
.note.warn{
  color:color-mix(in srgb, #e11d48 72%, var(--muted));
  font-weight:700;
}
.form input.is-invalid{
  border-color:color-mix(in srgb, #e11d48 55%, var(--border));
  box-shadow:0 0 0 3px color-mix(in srgb, #e11d48 18%, transparent);
}

.btn-row{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:center;
}

footer.site-footer{
  margin-top:30px;
  border-top:1px solid var(--border);
  padding:24px 0;
}
.footer-grid{
  display:grid;
  grid-template-columns:1.3fr .7fr;
  gap:24px;
}
.footer-links{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
.footer-links a{
  color:var(--muted);
  font-weight:700;
  padding:8px 10px;
  border-radius:12px;
}
.footer-links a:hover{background:color-mix(in srgb, var(--card) 70%, transparent);}




/* Payment method chooser (checkout) */
.pay-chooser{display:grid; gap:10px; margin-top:8px}
@media (min-width:900px){.pay-chooser{grid-template-columns:repeat(2, minmax(0,1fr))}}
.pay-radio{position:absolute; opacity:0; pointer-events:none}
.pay-card{
  display:block;
  border:1px solid var(--border);
  border-radius:18px;
  padding:14px;
  background:color-mix(in srgb, var(--card) 75%, transparent);
  cursor:pointer;
  transition:transform .08s ease, border-color .12s ease, box-shadow .12s ease;
}
.pay-card:hover{transform:translateY(-1px)}
.pay-top{display:flex; gap:10px; align-items:flex-start; justify-content:space-between}
.pay-title{font-weight:900; letter-spacing:.2px}
.pay-badge{
  font-size:12px;
  font-weight:900;
  border:1px solid var(--border);
  border-radius:999px;
  padding:6px 10px;
  white-space:nowrap;
  background:color-mix(in srgb, var(--bg) 70%, transparent);
}
.pay-desc{margin-top:6px; font-size:13px; color:var(--muted); line-height:1.4}
.pay-meta{margin-top:10px; display:flex; flex-wrap:wrap; gap:8px}
.pay-chip{
  font-size:12px;
  font-weight:800;
  border:1px dashed var(--border);
  border-radius:999px;
  padding:6px 10px;
  color:var(--muted);
}
.pay-details{margin-top:12px; padding-top:10px; border-top:1px solid var(--border); display:none}
.pay-radio:checked + .pay-card{border-color:color-mix(in srgb, var(--accent) 45%, var(--border)); box-shadow:0 0 0 3px color-mix(in srgb, var(--accent) 15%, transparent)}
.pay-radio:checked + .pay-card .pay-details{display:block}
.pay-kv{display:grid; gap:10px; grid-template-columns:1fr}
@media (min-width:720px){.pay-kv{grid-template-columns:1fr 1fr}}
.pay-kv-item{border:1px solid var(--border); border-radius:14px; padding:12px; background:color-mix(in srgb, var(--bg) 70%, transparent)}
.pay-kv-item .k{font-size:12px; font-weight:900; color:var(--muted); margin-bottom:6px}
.pay-kv-item .v{font-size:13px}

.small{font-size:12px;color:var(--muted)}

/* Admin (Panel UI/UX revamp) */
body.is-panel .container{max-width:100%}
body.is-panel .cover-scroll{padding-bottom:64px}

.panel-shell{
  display:flex;
  flex-direction:column;
  gap:14px;
}


/* Panel: grid responsive (cards stack on small screens) */
@media (max-width: 980px){
  body.is-panel .cols-4,
  body.is-panel .cols-6{
    grid-column:span 12;
  }
}


/* Panel head + helper blocks (UX Sprint-1) */
body.is-panel .panel-head{
  padding:12px 14px;
  border:1px solid var(--border);
  background:color-mix(in srgb, var(--bg) 60%, transparent);
  border-radius:var(--radius);
}
body.is-panel .panel-head h1,
body.is-panel .panel-head h2{
  margin:0;
}
body.is-panel .panel-head .small{margin-top:6px}

body.is-panel details.pm-acc.panel-help{margin-top:10px; background:color-mix(in srgb, var(--bg) 70%, transparent)}
body.is-panel details.pm-acc.panel-help summary{font-weight:800; font-size:13px; padding:10px 12px}
body.is-panel details.pm-acc.panel-help .pm-acc-body{padding:10px 12px}
body.is-panel .panel-help ol,
body.is-panel .panel-help ul{margin:6px 0 0 18px; padding:0}
body.is-panel .panel-help li{margin:6px 0}


/* Top navigation (grouped) */
.panel-menu{
  position:sticky;
  top:72px;
  z-index:60;
  border:1px solid var(--border);
  background:color-mix(in srgb, var(--card) 92%, transparent);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  padding:10px;
}

.panel-menu .pm-row{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:center;
}

.panel-menu .pm-spacer{flex:1 1 auto}

.panel-menu a,
.panel-menu .pm-summary{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:8px 10px;
  border-radius:999px;
  border:1px solid transparent;
  background:transparent;
  color:var(--muted);
  font-weight:600;
  font-size:13px;
  letter-spacing:.01em;
  line-height:1;
  cursor:pointer;
  user-select:none;
  white-space:nowrap;
}

.panel-menu a:hover,
.panel-menu .pm-summary:hover{
  background:color-mix(in srgb, var(--card) 86%, transparent);
  color:var(--text);
}
.panel-menu a:focus-visible,
.panel-menu .pm-summary:focus-visible{outline:none; box-shadow:var(--focus)}

.panel-menu a.active{
  background:color-mix(in srgb, var(--accent) 14%, var(--bg));
  color:var(--text);
  border:1px solid var(--border);
}

/* Panel menu: küçük rozet (yeni teklif/sipariş sayısı gibi) */
.panel-menu .pm-count{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin-left:8px;
  min-width:22px;
  height:22px;
  padding:0 7px;
  border-radius:999px;
  font-size:12px;
  font-weight:950;
  border:1px solid var(--border);
  background:color-mix(in srgb, var(--accent) 14%, var(--bg));
  color:var(--text);
  line-height:1;
}

.panel-menu details.pm-group{position:relative}
.panel-menu details.pm-group[open] > summary{background:color-mix(in srgb, var(--card) 88%, transparent); color:var(--text); border-color:var(--border)}
.panel-menu summary.pm-summary{list-style:none}
.panel-menu summary.pm-summary::-webkit-details-marker{display:none}
.panel-menu summary.pm-summary .pm-caret{display:inline-flex; width:12px; height:12px; margin-left:8px; opacity:.7}
.panel-menu summary.pm-summary .pm-caret svg{width:12px; height:12px; fill:currentColor}

.panel-menu .pm-drop{
  position:absolute;
  top:calc(100% + 8px);
  left:0;
  min-width:240px;
  max-width:min(320px, 90vw);
  background:var(--card);
  border:1px solid var(--border);
  border-radius:16px;
  box-shadow:var(--shadow);
  padding:8px;
  display:flex;
  flex-direction:column;
  gap:4px;
}

.panel-menu .pm-drop a{
  justify-content:flex-start;
  width:100%;
  border-radius:12px;
}

.panel-menu .pm-sep{width:1px; height:22px; background:var(--border); opacity:.8}

[dir="rtl"] .panel-menu .pm-drop{left:auto; right:0}

/* Panel: Denetim (audit) */
.audit-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:12px;
}
.audit-item{
  display:flex;
  gap:12px;
  align-items:flex-start;
  padding:12px;
  border:1px solid var(--border);
  border-radius:16px;
  background:color-mix(in srgb, var(--bg) 70%, transparent);
}
.audit-ico{
  width:36px;
  height:36px;
  border-radius:12px;
  border:1px solid var(--border);
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:950;
  background:color-mix(in srgb, var(--card) 92%, transparent);
}
.audit-item.is-ok .audit-ico{background:color-mix(in srgb, var(--accent) 16%, var(--bg))}
.audit-item.is-warn .audit-ico{background:color-mix(in srgb, #ffb020 18%, var(--bg))}
.audit-item.is-bad .audit-ico{background:color-mix(in srgb, #ff3b3b 18%, var(--bg))}
.audit-body{flex:1 1 auto}
.audit-body .t{font-weight:950}
.audit-body .d{margin-top:6px; font-size:13px; color:var(--muted)}
.audit-body .a{margin-top:10px}

@media (max-width: 980px){
  .audit-grid{grid-template-columns:1fr}
}

/* Panel menu: very small screens -> horizontal scroll */
@media (max-width: 560px){
  .panel-menu .pm-row{
    flex-wrap:nowrap;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    gap:6px;
  }
  .panel-menu .pm-sep{display:none}
  .panel-menu .pm-spacer{display:none}
  .panel-menu details.pm-group{flex:0 0 auto}
}

/* Dashboard stat blocks */
.panel-stats{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
.panel-stat{
  flex:1 1 180px;
  min-width:180px;
  padding:12px;
  border-radius:16px;
  border:1px solid var(--border);
  background:color-mix(in srgb, var(--bg) 58%, transparent);
}

/* Panel: Satış Merkezi mini liste (kompakt kart içi satırlar) */
.panel-mini-list{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.panel-mini-item{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
  flex-wrap:wrap;
  padding:12px;
  border:1px solid var(--border);
  border-radius:16px;
  background:color-mix(in srgb, var(--bg) 70%, transparent);
}
.panel-mini-item .meta{flex:1 1 320px; min-width:220px}
.panel-mini-item .meta .t{display:flex; gap:10px; align-items:center; flex-wrap:wrap}
.panel-mini-item .meta .s{margin-top:4px; font-size:13px; color:var(--muted)}
.panel-mini-item .actions{display:flex; gap:8px; flex-wrap:wrap; align-items:center}
.panel-stat .k{font-size:12px; color:var(--muted); letter-spacing:.08em; text-transform:uppercase}
.panel-stat .v{font-size:18px; font-weight:900; margin-top:6px}
.panel-stat .sub{margin-top:8px; font-size:12px; color:var(--muted)}
.panel-stat .bars{margin-top:10px; display:flex; flex-direction:column; gap:6px}
.panel-stat .bar{height:8px; border-radius:999px; background:color-mix(in srgb, var(--card) 72%, transparent); border:1px solid var(--border); overflow:hidden}
.panel-stat .bar > span{display:block; height:100%; background:color-mix(in srgb, var(--accent) 56%, transparent)}

/* Panel: sağ orta "Kaydet" (floating) butonu */
.panel-float-save{
  position:fixed;
  right:18px;
  top:50%;
  transform:translateY(-50%);
  z-index:120;
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:12px 14px;
  border-radius:999px;
  border:1px solid color-mix(in srgb, var(--accent) 28%, var(--border));
  background:linear-gradient(135deg, color-mix(in srgb, var(--accent) 86%, #000), var(--accent));
  color:#fff;
  box-shadow:0 18px 48px rgba(0,0,0,.18);
  cursor:pointer;
  font-weight:900;
}
.panel-float-save .pfs-ico{display:inline-flex; width:18px; height:18px}
.panel-float-save .pfs-ico svg{width:18px; height:18px; fill:currentColor}
.panel-float-save .pfs-text{letter-spacing:.02em}
.panel-float-save .pfs-dot{
  display:none;
  width:10px;
  height:10px;
  border-radius:999px;
  background:color-mix(in srgb, #fff 80%, transparent);
  box-shadow:0 0 0 3px rgba(0,0,0,.12);
}
.panel-float-save[data-dirty="1"] .pfs-dot{display:inline-block}
.panel-float-save:hover{filter:brightness(1.03)}
.panel-float-save:active{transform:translateY(-50%) scale(.99)}
.panel-float-save:focus-visible{outline:none; box-shadow:var(--focus2)}
.panel-float-save[data-dirty="1"]{
  box-shadow:0 18px 48px rgba(0,0,0,.18), 0 0 0 4px color-mix(in srgb, var(--accent2) 32%, transparent);
}

@media (max-width: 980px){
  .panel-float-save{top:auto; bottom:18px; transform:none}
}

/* Panel: tema seçimi UI */
.theme-help{
  margin-top:10px;
  padding:10px;
  border:1px solid var(--border);
  background:color-mix(in srgb, var(--card) 92%, transparent);
  border-radius:var(--radius-sm);
}
.theme-grid{
  margin-top:12px;
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:12px;
}
.theme-card{
  position:relative;
  display:block;
  cursor:pointer;
  border:1px solid var(--border);
  background:color-mix(in srgb, var(--card) 96%, transparent);
  border-radius:var(--radius);
  /* Sağ üst radio için güvenli boşluk */
  padding:12px 44px 12px 12px;
  box-shadow:0 12px 34px rgba(0,0,0,.06);
}
.theme-card:hover{filter:brightness(1.01)}
.theme-card.is-active{
  border-color:color-mix(in srgb, var(--accent) 42%, var(--border));
  box-shadow:0 18px 46px rgba(0,0,0,.10);
}
.theme-card.has-warn{border-color:color-mix(in srgb, var(--accent2) 38%, var(--border))}
.theme-radio{
  position:absolute;
  right:12px;
  top:12px;
  width:18px;
  height:18px;
}
[dir="rtl"] .theme-card{padding:12px 12px 12px 44px}
[dir="rtl"] .theme-radio{right:auto; left:12px}
.theme-card-body{display:grid; grid-template-columns:110px 1fr; gap:12px; align-items:start}
.theme-thumb{
  width:100%;
  aspect-ratio:1/1;
  border-radius:14px;
  overflow:hidden;
  border:1px solid var(--border);
  background:color-mix(in srgb, var(--bg) 60%, transparent);
}
.theme-thumb img{width:100%; height:100%; object-fit:cover; display:block}
.theme-thumb-empty{display:flex; align-items:center; justify-content:center; width:100%; height:100%; font-size:32px; font-weight:900; color:var(--muted)}
.theme-head{display:flex; justify-content:space-between; gap:10px; align-items:flex-start}
.theme-name{font-weight:1000; letter-spacing:.01em}
.theme-badges{display:flex; flex-wrap:wrap; gap:6px; justify-content:flex-end}
.theme-desc{margin-top:8px; font-size:13px; color:var(--muted)}
.theme-warns{margin:10px 0 0; padding-left:18px; color:var(--muted); font-size:13px}
.theme-warns li{margin:4px 0}

@media (max-width: 980px){
  .theme-grid{grid-template-columns:1fr}
  .theme-card-body{grid-template-columns:1fr}
  .theme-thumb{aspect-ratio:16/9}
}


/* Tema canlı önizleme (Panel) */
.theme-preview{
  margin-top:12px;
  border:1px solid var(--border);
  border-radius:var(--radius);
  background:var(--card);
  overflow:hidden;
}
.theme-preview-bar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:10px 12px;
  border-bottom:1px solid var(--border);
  background:color-mix(in srgb, var(--card) 75%, var(--bg));
  flex-wrap:wrap;
}
.theme-preview-left{
  display:flex;
  align-items:center;
  gap:10px;
}
.theme-preview-left strong{white-space:nowrap}
.theme-preview-left select.input{min-width:180px; max-width:260px}
.theme-preview-actions{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}
.theme-preview-devices{
  display:flex;
  align-items:center;
  gap:8px;
}
.theme-preview-devices .btn{padding:8px 10px}
.theme-preview-devices .btn.is-active{
  outline:2px solid color-mix(in srgb, var(--accent) 60%, transparent);
  outline-offset:1px;
}
.theme-preview-wrap{
  padding:12px;
  background:var(--bg);
}
.theme-preview-viewport{
  width:100%;
  max-width:100%;
  margin:0 auto;
  border:1px solid var(--border);
  border-radius:18px;
  overflow:hidden;
  background:#000;
  box-shadow:0 10px 30px rgba(0,0,0,.12);
}
.theme-preview-viewport iframe{
  width:100%;
  height:560px;
  border:0;
  display:block;
  background:#000;
}
.theme-preview-viewport[data-device="mobile"]{width:390px}
.theme-preview-viewport[data-device="tablet"]{width:820px}

@media (max-width: 980px){
  .theme-preview-left select.input{min-width:160px}
  .theme-preview-viewport[data-device="tablet"]{width:100%}
  .theme-preview-viewport[data-device="mobile"]{width:min(390px, 100%)}
  .theme-preview-viewport iframe{height:520px}
}

.theme-preview-note{margin:10px 12px}

/* Panel: Anasayfa cover yerleşim modu — canlı mini önizleme */
.home-preview{
  position:relative;
  height:260px;
  border:1px solid var(--border);
  border-radius:18px;
  overflow:hidden;
  background:var(--bg);
  box-shadow:0 10px 30px rgba(0,0,0,.08);
}
.home-preview .home-grid{position:absolute; inset:0}
.home-preview.home-mode-horizontal-rot30 .home-grid{--home-hraise: clamp(40px, 22%, 96px)}
.home-preview a.home-tile{pointer-events:none; background:color-mix(in srgb, var(--accent) 12%, #000)}
.home-preview a.home-tile:nth-child(3n){background:color-mix(in srgb, var(--accent2) 12%, #000)}
.home-preview a.home-tile:nth-child(4n){background:color-mix(in srgb, var(--card) 22%, #000)}
.home-preview .tile-text{max-width:92%; padding:9px 10px; border-radius:16px}
.home-preview .tile-text h2{font-size:16px; -webkit-line-clamp:1}
.home-preview .tile-text p{display:none}

@media (max-width: 860px){
  .home-preview{height:220px}
}

/* Panel: ürün galeri yöneticisi */
.check-row{display:grid; gap:6px; padding:10px; border:1px solid var(--border); background:color-mix(in srgb, var(--card) 86%, transparent); border-radius:var(--radius-sm)}
.chk{display:flex; gap:10px; align-items:center; font-weight:900}
.chk input{width:18px; height:18px}

.gal-mgr{display:grid; gap:10px; margin-top:10px}
.gal-tools{display:flex; gap:10px; flex-wrap:wrap; align-items:center}
.gal-list{list-style:none; padding:0; margin:0; display:grid; gap:8px}
.gal-item{
  display:grid;
  grid-template-columns:34px 64px 1fr auto auto;
  gap:10px;
  align-items:center;
  padding:10px;
  border:1px solid var(--border);
  background:var(--card);
  border-radius:var(--radius-sm);
  box-shadow:0 8px 20px rgba(0,0,0,.04);
}
.gal-item.is-dragging{opacity:.7}
.gal-drag{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:34px;
  height:34px;
  border-radius:12px;
  border:1px solid var(--border);
  background:color-mix(in srgb, var(--bg) 80%, transparent);
  cursor:grab;
  font-weight:900;
}
.gal-drag:active{cursor:grabbing}

/* Panel: anasayfa cover tile yöneticisi */
.home-drag{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:34px;
  height:34px;
  border-radius:12px;
  border:1px solid var(--border);
  background:color-mix(in srgb, var(--bg) 80%, transparent);
  cursor:grab;
  font-weight:900;
  user-select:none;
}
.home-drag:active{cursor:grabbing}
[data-home-tile-row].is-dragging{opacity:.7}
.gal-thumb{display:block}
.gal-thumb img{width:56px; height:56px; object-fit:cover; border-radius:14px; border:1px solid rgba(0,0,0,.10); background:var(--bg)}
.gal-mgr .btn.small{font-size:12px; padding:8px 10px; color:inherit}


/* Panel: Popup (dialog) base component */
.pm-dlg{border:none; padding:0; background:transparent}
.pm-dlg::backdrop{background:rgba(0,0,0,.55)}
.pm-dlg .pm-dlg-inner{background:var(--bg); border:1px solid var(--border); border-radius:var(--radius); box-shadow:0 20px 60px rgba(0,0,0,.30); padding:12px}
.pm-dlg .pm-dlg-close{appearance:none; border:1px solid var(--border); background:var(--card); border-radius:12px; width:40px; height:40px; font-size:22px; font-weight:900; cursor:pointer; display:inline-flex; align-items:center; justify-content:center}
.pm-dlg .pm-dlg-close:focus-visible{outline:none; box-shadow:var(--focus2)}

.imgdlg{border:none; padding:0; background:transparent}
.imgdlg::backdrop{background:rgba(0,0,0,.55)}
.imgdlg-inner{width:min(900px, 92vw); background:var(--bg); border:1px solid var(--border); border-radius:var(--radius); box-shadow:0 20px 60px rgba(0,0,0,.30); padding:12px}
.imgdlg-inner img{width:100%; height:auto; border-radius:var(--radius-sm); border:1px solid rgba(0,0,0,.08); background:var(--card)}
.imgdlg-close{appearance:none; border:1px solid var(--border); background:var(--card); border-radius:12px; width:40px; height:40px; font-size:22px; font-weight:900; cursor:pointer; display:inline-flex; align-items:center; justify-content:center; margin-bottom:10px}

/* Panel: Teklif cevap popup (dialog) */
.teklifdlg{border:none; padding:0; background:transparent}
.teklifdlg::backdrop{background:rgba(0,0,0,.55)}
.teklifdlg .tdlg-inner{width:min(980px, 94vw); max-height:min(86vh, 820px); overflow:auto; background:var(--bg); border:1px solid var(--border); border-radius:var(--radius); box-shadow:0 20px 60px rgba(0,0,0,.30); padding:14px}
.teklifdlg .tdlg-head{display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:10px}
.teklifdlg .tdlg-title{font-weight:1000; letter-spacing:.01em}
.teklifdlg .tdlg-close{appearance:none; border:1px solid var(--border); background:var(--card); border-radius:12px; width:40px; height:40px; font-size:22px; font-weight:900; cursor:pointer; display:inline-flex; align-items:center; justify-content:center}
.teklifdlg .tdlg-grid{display:grid; gap:14px; grid-template-columns:1fr}
@media (min-width: 980px){
  .teklifdlg .tdlg-grid{grid-template-columns:1fr 1fr}
}
.teklifdlg .tdlg-preview textarea{min-height:260px}

/* Teklif: Hazır Yanıt Blokları */
.reply-blocks{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.reply-blocks .badge{
  cursor:pointer;
  user-select:none;
  border:1px solid var(--border);
  background:transparent;
}
.reply-blocks .badge:hover{
  background:rgba(255,255,255,.06);
}
.reply-blocks .badge:active{
  transform:translateY(1px);
}

/* Teklif: Yanıt Geçmişi */
.history-item .tpl-area{
  min-height:120px;
}



/* Panel: Teklif kalem bazlı fiyatlandırma tablosu */
.teklif-kalem-table td{vertical-align:middle}
.teklif-kalem-table td:nth-child(2),
.teklif-kalem-table td:nth-child(3),
.teklif-kalem-table td:nth-child(4){text-align:right; white-space:nowrap}
.teklif-kalem-table td:first-child{white-space:normal}
.teklif-kalem-table input{width:100%}
.teklif-kalem-table [data-kalem-line-total]{display:inline-block; min-width:84px}

/* Panel: Teklif cevap alanları (daha kompakt) */
.textarea-compact{min-height:80px}
.tpl-area{min-height:180px; resize:vertical}


/* Frontend: Product image lightbox (popup) */
.imglb{
  position:fixed;
  inset:0;
  margin:0;
  border:none;
  padding:max(12px, env(safe-area-inset-top)) max(12px, env(safe-area-inset-right)) max(12px, env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left));
  background:rgba(0,0,0,.62);
  backdrop-filter:blur(4px);
  -webkit-backdrop-filter:blur(4px);
  display:none;
  align-items:center;
  justify-content:center;
  z-index:9999;
}
.imglb[open]{display:flex}
.imglb .imglb-inner{
  width:min(980px, 94vw);
  max-height:92vh;
  background:var(--bg);
  border:1px solid var(--border);
  border-radius:var(--radius);
  box-shadow:0 20px 70px rgba(0,0,0,.35);
  padding:12px;
  display:flex;
  flex-direction:column;
  gap:10px;
}
.imglb-top{display:flex; gap:10px; align-items:center; justify-content:space-between}
.imglb-title{
  font-weight:950;
  font-size:13px;
  color:color-mix(in srgb, var(--text) 72%, var(--muted));
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
  max-width:60vw;
}
.imglb-actions{display:flex; gap:8px; align-items:center}
.imglb-nav{display:flex; gap:8px; align-items:center}
.imglb-btn,
.imglb-close{
  appearance:none;
  border:1px solid var(--border);
  background:color-mix(in srgb, var(--card) 92%, transparent);
  border-radius:12px;
  width:42px;
  height:42px;
  font-size:22px;
  font-weight:950;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.imglb-btn:focus-visible,
.imglb-close:focus-visible{outline:none; box-shadow:var(--focus2)}
.imglb-media{
  flex:1 1 auto;
  overflow:auto;
  -webkit-overflow-scrolling:touch;
  border-radius:var(--radius-sm);
  border:1px solid rgba(0,0,0,.10);
  background:#000;
}
.imglb-img{width:100%; height:auto; object-fit:contain; background:#000}
.imglb-cap{margin:0; font-size:12px; color:color-mix(in srgb, var(--text) 68%, var(--muted))}

@media (prefers-color-scheme: dark){
  .imglb-media{border-color:rgba(255,255,255,.12)}
}

@media (max-width: 560px){
  .imglb .imglb-inner{width:100%; padding:10px}
  .imglb-title{max-width:52vw}
}

/* Classic product template: inline zoom link */
.product-zoom-inline{display:inline-block; cursor:zoom-in; outline:none}
.product-zoom-inline:focus-visible{outline:none; box-shadow:var(--focus2); border-radius:14px}

@media (max-width: 560px){
  .gal-item{grid-template-columns:34px 64px 1fr; grid-template-rows:auto auto; align-items:start}
  .gal-item [data-gal-preview]{grid-column:2; grid-row:2; justify-self:start}
  .gal-item [data-gal-remove]{grid-column:3; grid-row:2; justify-self:end}
}
/* Responsive table wrapper */
.table-wrap{
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
}
.table-wrap .table{
  min-width:780px;
}

.table{
  width:100%;
  border-collapse:collapse;
  border:1px solid var(--border);
  background:var(--bg);
  border-radius:var(--radius);
  overflow:hidden;
}
.table th, .table td{
  border-bottom:1px solid var(--border);
  padding:10px 10px;
  text-align:left;
  vertical-align:top;
}
.table th{
  font-size:12px;
  color:var(--muted);
  text-transform:uppercase;
  letter-spacing:.7px;
}
.table td{font-size:13px}
.table tr:last-child td{border-bottom:none}

.flash{
  border:1px solid var(--border);
  background:color-mix(in srgb, var(--accent) 14%, var(--bg));
  padding:12px 14px;
  border-radius:var(--radius-sm);
  font-weight:800;
  margin:10px 0;
}
.flash.warn{
  background:color-mix(in srgb, #ffb020 14%, var(--bg));
}


/* Higher contrast preference */
@media (prefers-contrast: more){
  :root{
    --border:rgba(11,16,32,.22);
    --muted:#33405f;
    --shadow:0 0 0 rgba(0,0,0,0);
  }
  .card, .cover-panel, .btn, .chip, .badge, .home-menu a, .float-btn, .lang-btn{
    border-color:var(--border);
  }
  .btn.primary{box-shadow:none}
}

/* Responsive */
@media (max-width: 980px){
  .hero-grid{grid-template-columns:1fr}
  .portal-head{flex-direction:column; align-items:flex-start}
  .portal-actions{justify-content:flex-start}
  .portal-grid{grid-template-columns:repeat(2, 1fr)}
  .subcat-grid{grid-template-columns:repeat(2, 1fr)}
  .product{grid-column:span 6}
  .cols-4{grid-column:span 6}
  /* Panel shell is flex-column on all breakpoints; keep menu non-sticky on small screens */
  .panel-menu{position:relative; top:0}
}
@media (max-width: 560px){
  .nav{display:none}
  .burger{display:inline-flex}
  .portal-grid{grid-template-columns:1fr}
  .subcat-grid{grid-template-columns:1fr}
  header.site-header.open .nav{
    display:flex;
    flex-direction:column;
    align-items:stretch;
    position:absolute;
    top:64px; left:16px; right:16px;
    background:var(--bg);
    border:1px solid var(--border);
    border-radius:var(--radius);
    padding:10px;
    box-shadow:var(--shadow);
  }
  .product{grid-column:span 12}
  .footer-grid{grid-template-columns:1fr}
}

/* RTL tweaks */
[dir="rtl"] .header-inner{flex-direction:row-reverse}
[dir="rtl"] .right-actions{flex-direction:row-reverse}
[dir="rtl"] .hero-grid{direction:rtl}
[dir="rtl"] .nav a{text-align:right}
[dir="rtl"] .table th, [dir="rtl"] .table td{text-align:right}

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  *{scroll-behavior:auto!important; transition:none!important; animation:none!important}
}
/* v0.1.85 — Mobil üst bar (logo + hamburger + dil/kur) ve alt aksiyon barı */
.nav-wrap .lang-menu{left:0; right:auto;}
[dir="rtl"] .nav-wrap .lang-menu{left:auto; right:0;}
.nav-btn{min-width:44px; justify-content:center;}
.nav-btn .lang-ico{display:flex; align-items:center; justify-content:center;}
.nav-menu{min-width:240px;}
.nav-menu a{font-weight:800;}

/* HOME: üst bar */
.site-header-home .home-topbar{
  position:absolute;
  top:max(18px, env(safe-area-inset-top));
  left:max(18px, env(safe-area-inset-left));
  right:max(18px, env(safe-area-inset-right));
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  pointer-events:auto;
}
.site-header-home .home-top-start{display:flex; align-items:center; gap:10px;}
.site-header-home .home-top-end{display:flex; align-items:center; gap:10px;}
.site-header-home .home-top-logo{
  display:none;
  width:38px;
  height:38px;
  border-radius:14px;
  overflow:hidden;
  border:1px solid color-mix(in srgb, var(--border) 70%, transparent);
  background:color-mix(in srgb, var(--bg) 70%, transparent);
  box-shadow:var(--shadow);
}
.site-header-home .home-top-logo img{
  display:block;
  width:38px;
  height:38px;
  object-fit:contain;
  padding:6px;
}
.site-header-home .nav-wrap.home-nav{display:none;}

/* COVER: hamburger varsayılan kapalı */
.site-header-cover .nav-wrap.cover-nav{display:none;}

/* Alt aksiyon barı (mobil) */
.home-actionbar{
  display:none;
  width:100%;
  gap:10px;
  flex-wrap:wrap;
  justify-content:center;
}
.home-actionbar .habtn{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:10px 12px;
  border-radius:999px;
  border:1px solid var(--border);
  background:color-mix(in srgb, var(--bg) 72%, transparent);
  box-shadow:var(--shadow);
  color:var(--text);
  font-weight:900;
  letter-spacing:.2px;
  min-height:44px;
}
.home-actionbar .habtn .hab-ico{display:inline-flex; align-items:center; justify-content:center;}
.home-actionbar .habtn .hab-ico svg{width:18px; height:18px;}
.home-actionbar .habtn:active{transform:translateY(1px);}

@media (max-width: 860px){
  /* Mobilde menü hamburger olacak: eski home-menu alanlarını gizle */
  .home-menu{display:none !important;}

  /* Mobilde eski serbest butonlar yerine alt aksiyon barını kullan */
  .market-cta{display:none !important;}
  .float-btn{display:none !important;}

  .home-actionbar{display:flex;}

  /* Dil/Kur + Logo/Hamburger çakışmasın */
  .site-header-home .home-topbar{
    top:max(12px, env(safe-area-inset-top));
    left:max(12px, env(safe-area-inset-left));
    right:max(12px, env(safe-area-inset-right));
    gap:8px;
  }
  .site-header-home .home-top-logo{display:flex;}
  .site-header-home .nav-wrap.home-nav{display:block;}

  /* Cover header'ı mobilde flex bar yap (logo + hamburger + dil/kur aynı satırda) */
  .site-header-cover{
    pointer-events:auto;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    height:auto;
    padding: max(10px, env(safe-area-inset-top)) max(12px, env(safe-area-inset-right)) 10px max(12px, env(safe-area-inset-left));
  }
  .site-header-cover .cover-start{display:flex; align-items:center; gap:10px;}
  .site-header-cover .cover-logo{
    position:static;
    left:auto;
    top:auto;
    transform:none;
    box-shadow:none;
  }
  .site-header-cover .header-actions.cover-actions{
    position:static;
    right:auto;
    top:auto;
    gap:8px;
  }
  .site-header-cover .nav-wrap.cover-nav{display:block;}

  /* Küçük ekranlarda footer yazısı biraz daha dengeli */
  .home-footline{font-size:12px;}
}

/* v0.1.86 — Anasayfa (desktop/mobil) ayrımı + mobil alt aksiyon barı düzeni */

/* HOME: desktopta sadece Dil/Kur sağ üstte görünsün (logo + hamburger gizli) */
.site-header-home .home-top-start{display:none;}
.site-header-home .home-top-logo{display:none !important;}
.site-header-home .nav-wrap.home-nav{display:none !important;}
.site-header-home .home-topbar{
  left:auto;
  right:max(18px, env(safe-area-inset-right));
  width:auto;
  justify-content:flex-end;
}

/* Mobil alt aksiyon barı: footer'dan bağımsız, sabit konum */
.home-actionbar{display:none;}
.home-actionbar .hab-row{display:grid; gap:10px;}
.home-actionbar .hab-row + .hab-row{margin-top:10px;}

@media (max-width: 860px){
  /* HOME: mobilde hamburger göster, üstte logo gösterme, Dil/Kur daha kompakt */
  .site-header-home .home-topbar{
    left:max(12px, env(safe-area-inset-left));
    right:max(12px, env(safe-area-inset-right));
    width:auto;
    justify-content:space-between;
  }
  .site-header-home .home-top-start{display:flex;}
  .site-header-home .nav-wrap.home-nav{display:block !important;}
  .site-header-home .home-top-logo{display:none !important;}

  .site-header-home .home-top-end{gap:8px;}
  .site-header-home .home-top-end .lang-btn{
    padding:8px 10px;
    min-height:38px;
  }
  .site-header-home .home-top-end .lang-code{font-size:12px;}

  /* Cover sayfalarda da (mobil) Dil/Kur butonları daha kompakt */
  .site-header-cover .header-actions.cover-actions .lang-btn{
    padding:8px 10px;
    min-height:38px;
    border-radius:14px;
    font-size:12px;
  }
  .site-header-cover .header-actions.cover-actions .lang-code{font-size:12px;}

  /* Mobil dock görünür */
  .home-actionbar{
    display:block;
    position:fixed;
    left:max(12px, env(safe-area-inset-left));
    right:max(12px, env(safe-area-inset-right));
    bottom: calc(var(--home-footer-h, 0px) + 12px + env(safe-area-inset-bottom));
    z-index:60;
    pointer-events:auto;
    padding:12px;
    border-radius:22px;
    border:1px solid color-mix(in srgb, var(--border) 60%, transparent);
    background:color-mix(in srgb, var(--bg) 82%, transparent);
    box-shadow:var(--shadow);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
  }
  .home-actionbar .hab-row-main{grid-template-columns:repeat(2, minmax(0, 1fr));}
  .home-actionbar .hab-row-contact{grid-template-columns:repeat(2, minmax(0, 1fr));}

  /* Tek kalan (odd) son buton varsa satırı tam genişlik kaplasın */
  .home-actionbar .hab-row > .habtn:last-child:nth-child(odd){grid-column: 1 / -1;}

  .home-actionbar .habtn{
    width:100%;
    justify-content:center;
    border-radius:18px;
  }
  .home-actionbar .hab-label{
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
}


/* ---------------------------------------------------------
   v0.1.87 — Mobil ana sayfa (UI/UX) iyileştirmeleri
   - Alt dock: Market/Giriş/Kayıt minimal, WhatsApp/Ara belirgin
   - Footer: gövdeye bitişik his + gereksiz boşluk azaltma
   - Orta logo kartı: daha minimal
----------------------------------------------------------*/
@media (max-width: 860px){
  /* Dock: footer safe-area ile çakışmasın (double count önle) */
  .home-actionbar{
    bottom: calc(max(var(--home-footer-h, 0px), env(safe-area-inset-bottom)) + 10px);
    padding:10px;
    border-radius:20px;
  }
  .home-actionbar .hab-row{gap:8px;}
  .home-actionbar .hab-row + .hab-row{margin-top:8px;}

  /* Üst satır (Market + Auth) daha minimal */
  .home-actionbar .hab-row-main{
    display:flex;
    gap:8px;
  }
  .home-actionbar .hab-row-main .habtn{
    flex:1 1 0;
    min-width:0;
    min-height:36px;
    padding:8px 10px;
    border-radius:14px;
    font-size:12px;
    font-weight:800;
  }

  /* İletişim satırı (WhatsApp/Ara) daha belirgin kalsın */
  .home-actionbar .hab-row-contact{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:8px;
  }
  .home-actionbar .hab-row-contact .habtn{
    min-height:46px;
    padding:10px 12px;
    border-radius:18px;
    font-size:14px;
    font-weight:900;
  }

  /* Footer: daha "site parçası" hissettirsin (mobilde menü gizli olduğu için) */
  .home-bottom{
    padding:10px var(--container-pad) max(10px, env(safe-area-inset-bottom));
    background: color-mix(in srgb, var(--bg) 92%, transparent);
  }
  .home-bottom .home-footline{
    margin-top:0;
    padding-top:0;
    border-top:none;
    gap:6px;
  }

  /* Orta logo kartı: daha minimal */
  .home-center{
    padding:10px 12px;
    border-radius:18px;
    gap:6px;
    background: color-mix(in srgb, var(--bg) 42%, transparent);
    border-color: color-mix(in srgb, var(--border) 55%, transparent);
    box-shadow:0 10px 24px rgba(11,16,32,.14);
  }
  .home-center img{width:64px; height:64px}
  .home-center .name{font-size:18px}
  .home-center .tag{font-size:11px; max-width:26ch}
}

@media (max-width: 360px){
  .home-center .tag{display:none}
}


/* v0.1.87 — Cover sayfalarda içerik alanı: alt sabit katman (footer+dock) yüksekliğine göre dinamik padding */
.layout-cover .cover-scroll{
  padding-bottom: calc(var(--home-stack-h, 160px) + 24px);
}
@media (max-width: 860px){
  .layout-cover .cover-scroll{
    padding-bottom: calc(var(--home-stack-h, 190px) + 24px);
  }
}


/* ---------------------------------------------------------
   v0.1.88 — Mobil alt bar & footer davranışı (anasayfa uyumluluk)
   - Mobilde footer artık sticky/fixed değil: sayfanın sonunda statik ve minimal görünür
   - Alt dock: tek satır, daha az yer kaplar (Market/Auth ikon butonları minimal)
   - Orta logo kartı: daha minimal + tag (Türkiye'den...) okunurluğu artırıldı
----------------------------------------------------------*/
@media (max-width: 860px){
  /* Mobilde footer sabit katman gibi davranmasın: sayfanın sonunda statik ve minimal */
  .home-bottom{
    position:static;
    left:auto;
    right:auto;
    bottom:auto;
    z-index:auto;
    padding:12px var(--container-pad) calc(var(--home-dock-h, 0px) + 14px + env(safe-area-inset-bottom));
    background: color-mix(in srgb, var(--bg) 94%, transparent);
    border-top:1px solid color-mix(in srgb, var(--border) 70%, transparent);
  }
  .home-bottom .home-footline{
    margin-top:0;
    padding-top:0;
    border-top:none;
    text-align:center;
    justify-content:center;
    flex-direction:column;
    gap:4px;
    font-size:11px;
  }
  .home-bottom .home-footline .hf-left,
  .home-bottom .home-footline .hf-right{width:100%;}

  /* Alt dock: footer olmadığı için safe-area'e göre konumlan */
  .home-actionbar{
    bottom:0;
    padding:8px;
    padding-bottom: calc(8px + env(safe-area-inset-bottom));
    border-radius:18px;
    background: color-mix(in srgb, var(--bg) 72%, transparent);
  }

  /* Dock içi: yatay yerleşim */
  .home-actionbar{
    display:flex;
    align-items:stretch;
    gap:8px;
  }
  .home-actionbar .hab-row{display:flex; gap:6px;}
  .home-actionbar .hab-row + .hab-row{margin-top:0;}

  .home-actionbar .hab-row-main{flex:0 0 auto;}
  .home-actionbar .hab-row-contact{flex:1 1 auto;}

  /* WhatsApp / Ara: aynı satırda full width hissi */
  .home-actionbar .hab-row-contact .habtn{
    flex:1 1 0;
    min-height:44px;
    padding:10px 12px;
    border-radius:16px;
    font-size:13px;
    font-weight:900;
  }

  /* "Ara: 0532..." yerine: "Ara" + numara alt satır (daha estetik/kompakt) */
  .home-actionbar .hab-row-contact .hab-txt{
    display:flex;
    flex-direction:column;
    align-items:center;
    min-width:0;
  }
  .home-actionbar .hab-row-contact .hab-label{display:block; line-height:1.05;}
  .home-actionbar .hab-row-contact .hab-sub{
    display:block;
    font-size:11px;
    line-height:1.05;
    opacity:.82;
    margin-top:2px;
    font-weight:800;
    letter-spacing:.2px;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }

  /* Market / Auth: minimal ikon butonlar */
  .home-actionbar .hab-row-main .habtn{
    position:relative;
    width:44px;
    min-width:44px;
    min-height:44px;
    padding:10px;
    border-radius:14px;
    justify-content:center;
    gap:0;
  }
  .home-actionbar .hab-row-main .hab-ico{margin:0;}
  .home-actionbar .hab-row-main .hab-label{
    position:absolute!important;
    width:1px;height:1px;
    padding:0;margin:-1px;
    overflow:hidden;
    clip:rect(0,0,0,0);
    white-space:nowrap;
    border:0;
  }

  /* Orta logo kartı: daha minimal + tag okunurluğu (admin ayarlı) */
  .home-center{
    padding:var(--hc-pad-y-m, 8px) var(--hc-pad-x-m, 10px);
    border-radius:var(--hc-radius-m, 16px);
    gap:var(--hc-gap-m, 5px);
    background: color-mix(in srgb, var(--bg) var(--hc-bg-mix-m, 52%), transparent);
    border-color: color-mix(in srgb, var(--border) var(--hc-border-mix-m, 60%), transparent);
    box-shadow:0 12px 30px rgba(0,0,0,.22);
    -webkit-backdrop-filter: blur(var(--hc-blur-m, 10px));
    backdrop-filter: blur(var(--hc-blur-m, 10px));
  }
  .home-center img{width:var(--hc-logo-m, 56px); height:var(--hc-logo-m, 56px)}
  .home-center .name{font-size:var(--hc-title-m, 16px)}
  .home-center .tag{
    font-size:var(--hc-tag-m, 11px);
    max-width:var(--hc-tag-max-m, 30ch);
    color: color-mix(in srgb, var(--text) 86%, var(--muted));
    text-shadow:0 1px 2px rgba(0,0,0,.35);
  }
  .home-center.hc-tag-pill-m .tag{
    padding:3px 8px;
    border-radius:999px;
    background: color-mix(in srgb, var(--bg) 78%, transparent);
    border:1px solid color-mix(in srgb, var(--border) 60%, transparent);
  }
}

/* --------------------------- v0.1.90 (Contact: map) --------------------------- */

.map-embed-wrap{
  width:100%;
  aspect-ratio:16/9;
  border-radius:14px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(0,0,0,.20);
}

.map-embed{
  width:100%;
  height:100%;
  border:0;
  display:block;
}

@media (max-width:860px){
  .map-embed-wrap{aspect-ratio:4/3}
}