/*
 * Ortak tema iskeleti (Kyro, Toz). Görünüm tamamen değişkenlerle temadan gelir; tema editörü bu değişkenleri canlı değiştirir.
 * Tema dosyası (public/themes/<tema>/style.css) --kit-* değişkenlerini tanımlar.
 */
.kit-body { margin: 0; background: var(--kit-bg); color: var(--kit-text); font-family: var(--kit-font-body); -webkit-font-smoothing: antialiased; }
.kit-body *, .kit-body *::before, .kit-body *::after { box-sizing: border-box; }
:where(.kit-body) a { color: inherit; }
:where(.kit-body) img { max-width: 100%; }
.kit { max-width: var(--kit-max, 1360px); margin: 0 auto; padding: 32px; display: flex; flex-direction: column; gap: var(--kit-gap, 24px); }
@media (max-width: 760px) { .kit { padding: 20px 16px; } }
.kit-display, .kit-h1, .kit-h2, .kit-h3 { font-family: var(--kit-font-display); font-weight: var(--kit-display-weight, 600); text-transform: var(--kit-display-transform, none); letter-spacing: var(--kit-display-tracking, -0.02em); margin: 0; }
.kit-h1 { font-size: clamp(38px, 6vw, var(--kit-h1, 72px)); line-height: .95; }
.kit-h2 { font-size: clamp(26px, 3.4vw, var(--kit-h2, 44px)); line-height: 1.02; }
.kit-h3 { font-size: var(--kit-h3, 20px); line-height: 1.15; }
.kit-eyebrow { font-family: var(--kit-font-label, var(--kit-font-body)); font-size: 12px; letter-spacing: .24em; text-transform: uppercase; color: var(--kit-accent); }
.kit-muted { color: var(--kit-muted); }
.kit-crumb { display: flex; gap: 8px; flex-wrap: wrap; font-family: var(--kit-font-label, var(--kit-font-body)); font-size: 13px; color: var(--kit-muted); text-transform: var(--kit-label-transform, none); }
.kit-crumb a { text-decoration: none; }
.kit-crumb b { color: var(--kit-text); font-weight: 600; }
.kit-box { background: var(--kit-surface); border: var(--kit-border-w, 1px) solid var(--kit-line); border-radius: var(--kit-radius, 24px); box-shadow: var(--kit-shadow, none); padding: 28px; }
.kit-box-head { margin: -28px -28px 20px; padding: 16px 28px; border-bottom: var(--kit-border-w, 1px) solid var(--kit-line); background: var(--kit-head-bg, transparent); border-radius: var(--kit-radius, 24px) var(--kit-radius, 24px) 0 0; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.kit-box-head .kit-h3 { font-size: 18px; }
@media (max-width: 760px) { .kit-box { padding: 20px; } .kit-box-head { margin: -20px -20px 16px; padding: 14px 20px; } }
.kit-btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; height: var(--kit-btn-h, 54px); padding: 0 26px; border-radius: var(--kit-btn-radius, 999px); border: var(--kit-border-w, 1px) solid var(--kit-btn-border, transparent); background: var(--kit-btn-bg); color: var(--kit-btn-ink); font: inherit; font-weight: 600; font-size: 15px; text-transform: var(--kit-btn-transform, none); letter-spacing: var(--kit-btn-tracking, 0); text-decoration: none; cursor: pointer; box-shadow: var(--kit-shadow-sm, none); transition: transform .12s, filter .15s, box-shadow .15s; white-space: nowrap; }
.kit-btn:hover { filter: brightness(1.06); transform: translate(var(--kit-press, 0), var(--kit-press, 0)); }
.kit-btn:active { transform: translate(var(--kit-press-2, 0), var(--kit-press-2, 0)); box-shadow: none; }
.kit-btn-accent { background: var(--kit-accent); color: var(--kit-accent-ink); border-color: var(--kit-btn-border, transparent); }
.kit-btn-ghost { background: transparent; color: var(--kit-text); border-color: var(--kit-line-2); box-shadow: none; }
.kit-btn-block { width: 100%; }
.kit-btn-sm { height: 42px; padding: 0 18px; font-size: 14px; }
.kit-link { color: var(--kit-link, var(--kit-accent)); font-weight: 600; text-decoration: none; }
.kit-link:hover { text-decoration: underline; }
.kit-field { display: flex; flex-direction: column; gap: 6px; font-size: 13px; font-weight: 600; font-family: var(--kit-font-label, var(--kit-font-body)); text-transform: var(--kit-label-transform, none); color: var(--kit-label-ink, var(--kit-text)); }
.kit-input, .kit-body .kit-field select, .kit-body #city { width: 100%; height: 52px; padding: 0 16px; border-radius: var(--kit-radius-sm, 14px); border: var(--kit-border-w, 1px) solid var(--kit-line-2); background: var(--kit-field-bg, var(--kit-surface)); color: var(--kit-text); font: inherit; font-family: var(--kit-font-body); font-size: 15px; font-weight: 400; text-transform: none; outline: none; }
textarea.kit-input { height: auto; padding: 12px 16px; resize: vertical; }
.kit-input:focus, .kit-body #city:focus { border-color: var(--kit-accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--kit-accent) 25%, transparent); }
.kit-input::placeholder { color: var(--kit-muted); }
.kit-check { display: flex; align-items: flex-start; gap: 10px; font-size: 14px; line-height: 1.5; cursor: pointer; text-transform: none; font-weight: 400; font-family: var(--kit-font-body); }
.kit-check input { width: 18px; height: 18px; flex: none; margin-top: 1px; accent-color: var(--kit-accent); }
.kit-chip { display: inline-flex; align-items: center; gap: 8px; height: 42px; padding: 0 18px; border-radius: var(--kit-chip-radius, 999px); border: var(--kit-border-w, 1px) solid var(--kit-line-2); background: var(--kit-chip-bg, transparent); color: var(--kit-text); font-size: 14px; font-weight: 500; text-decoration: none; white-space: nowrap; font-family: var(--kit-font-chip, var(--kit-font-body)); text-transform: var(--kit-chip-transform, none); }
.kit-chip.on, .kit-chip[aria-checked=true], .kit-chip[aria-current] { background: var(--kit-chip-on-bg, var(--kit-text)); color: var(--kit-chip-on-ink, var(--kit-bg)); border-color: var(--kit-chip-on-border, var(--kit-chip-on-bg, var(--kit-text))); }
.kit-badge { display: inline-flex; align-items: center; height: 26px; padding: 0 10px; border-radius: var(--kit-badge-radius, 999px); font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; background: var(--kit-badge-bg, var(--kit-accent)); color: var(--kit-badge-ink, var(--kit-accent-ink)); border: var(--kit-badge-border, 0); font-family: var(--kit-font-label, var(--kit-font-body)); }
.kit-badge.alt { background: var(--kit-accent-2); color: var(--kit-accent-2-ink, var(--kit-accent-ink)); }
.kit-badge.dark { background: var(--kit-text); color: var(--kit-bg); }
.kit-alert { padding: 12px 16px; border-radius: var(--kit-radius-sm, 14px); font-size: 14px; border: var(--kit-border-w, 1px) solid currentColor; }
.kit-alert.err { color: var(--kit-danger, #e5484d); background: color-mix(in srgb, var(--kit-danger, #e5484d) 10%, transparent); }
.kit-alert.ok { color: var(--kit-ok-ink, var(--kit-text)); background: color-mix(in srgb, var(--kit-ok, #3ee6e0) 18%, transparent); }
.kit-split { display: flex; flex-wrap: wrap; gap: var(--kit-gap, 24px); align-items: flex-start; }
.kit-col-main { flex: 999 1 560px; min-width: 0; display: flex; flex-direction: column; gap: 16px; }
.kit-col-side { flex: 1 1 340px; max-width: 440px; min-width: 0; position: sticky; top: calc(var(--kit-header-h, 76px) + 16px); display: flex; flex-direction: column; gap: 16px; }
@media (max-width: 900px) { .kit-col-side { position: static; max-width: none; } }
.kit-row { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; font-size: 15px; }
.kit-row span:first-child { color: var(--kit-muted); }
.kit-sep { height: var(--kit-border-w, 1px); background: var(--kit-line); border: 0; margin: 0; }
.kit-total { font-family: var(--kit-font-display); font-size: 34px; font-weight: var(--kit-display-weight, 600); letter-spacing: -0.02em; }
.kit-img { position: relative; display: flex; align-items: center; justify-content: center; overflow: hidden; background: var(--kit-img-bg); color: var(--kit-muted); font-size: 12px; letter-spacing: .12em; text-transform: uppercase; text-decoration: none; }
.kit-img img { width: 100%; height: 100%; object-fit: var(--kit-img-fit, cover); }
.kit-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, var(--kit-card-min, 260px)), 1fr)); gap: var(--kit-grid-gap, 20px); }
@media (max-width: 640px) { .kit-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--kit-grid-gap-m, 12px); } }
.kit-steps { list-style: none; margin: 0; padding: 0; display: flex; gap: 8px; flex-wrap: wrap; }
.kit-steps li { display: flex; align-items: center; gap: 8px; height: 38px; padding: 0 16px; border-radius: var(--kit-chip-radius, 999px); border: var(--kit-border-w, 1px) solid var(--kit-line-2); font-size: 13px; font-weight: 600; color: var(--kit-muted); font-family: var(--kit-font-label, var(--kit-font-body)); text-transform: var(--kit-label-transform, none); }
.kit-steps li.on { background: var(--kit-chip-on-bg, var(--kit-text)); color: var(--kit-chip-on-ink, var(--kit-bg)); border-color: var(--kit-chip-on-border, var(--kit-chip-on-bg, var(--kit-text))); }
.kit-qty { display: inline-flex; align-items: center; height: 46px; border: var(--kit-border-w, 1px) solid var(--kit-line-2); border-radius: var(--kit-radius-sm, 14px); background: var(--kit-field-bg, transparent); overflow: hidden; }
.kit-qty button { width: 44px; height: 100%; border: 0; background: var(--kit-qty-btn-bg, transparent); color: var(--kit-qty-btn-ink, var(--kit-text)); font-size: 18px; cursor: pointer; font-weight: 700; }
.kit-qty input { width: 36px; height: 100%; text-align: center; border: 0; background: transparent; color: var(--kit-text); font: inherit; font-weight: 700; }
.kit-line-item { display: flex; gap: 18px; flex-wrap: wrap; padding: 16px; }
.kit-line-item .kit-img { width: 112px; aspect-ratio: 1 / 1; border-radius: var(--kit-radius-sm, 14px); flex: none; }
.kit-line-info { flex: 1 1 200px; min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.kit-line-price { display: flex; flex-direction: column; align-items: flex-end; justify-content: space-between; gap: 12px; }
.kit-progress { height: 8px; border-radius: 999px; background: color-mix(in srgb, var(--kit-text) 14%, transparent); overflow: hidden; }
.kit-progress i { display: block; height: 100%; background: var(--kit-accent); border-radius: inherit; }
.kit-timeline { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.kit-timeline li { display: flex; gap: 14px; }
.kit-timeline .dot { width: 20px; height: 20px; flex: none; border-radius: 50%; border: 2px solid var(--kit-line-2); background: var(--kit-surface); }
.kit-timeline .bar { width: 2px; flex: 1; min-height: 28px; background: var(--kit-line); margin: 0 auto; }
.kit-timeline li.done .dot { background: var(--kit-accent); border-color: var(--kit-accent); }
.kit-timeline li.done .bar { background: var(--kit-accent); }
.kit-timeline li > div:last-child { padding-bottom: 18px; display: flex; flex-direction: column; gap: 2px; font-size: 13px; color: var(--kit-muted); }
.kit-timeline b { font-size: 15px; color: var(--kit-text); }
.kit-pay { display: flex; align-items: center; gap: 14px; min-height: 64px; padding: 12px 18px; border-radius: var(--kit-radius-sm, 14px); border: var(--kit-border-w, 1px) solid var(--kit-line-2); background: var(--kit-field-bg, transparent); cursor: pointer; }
.kit-pay:has(input:checked) { border-color: var(--kit-accent); background: color-mix(in srgb, var(--kit-accent) 12%, var(--kit-surface)); box-shadow: var(--kit-shadow-sm, none); }
.kit-pay input { width: 20px; height: 20px; accent-color: var(--kit-accent); }
.kit-pay span { flex: 1; display: flex; flex-direction: column; gap: 2px; font-size: 13px; color: var(--kit-muted); }
.kit-pay b { font-size: 15px; color: var(--kit-text); }
.kit-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.kit-table th { text-align: left; padding: 10px 8px; color: var(--kit-muted); font-weight: 500; font-family: var(--kit-font-label, var(--kit-font-body)); font-size: 12px; text-transform: uppercase; letter-spacing: .06em; }
.kit-table td { padding: 14px 8px; border-top: var(--kit-border-w, 1px) solid var(--kit-line); }
.kit-filters { display: flex; flex-direction: column; gap: 16px; }
.kit-filters fieldset { border: var(--kit-border-w, 1px) solid var(--kit-line); border-radius: var(--kit-radius-sm, 14px); padding: 16px; margin: 0; background: var(--kit-surface); box-shadow: var(--kit-shadow-sm, none); display: flex; flex-direction: column; gap: 8px; }
.kit-filters legend { padding: 2px 8px; font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; background: var(--kit-legend-bg, transparent); color: var(--kit-legend-ink, var(--kit-text)); font-family: var(--kit-font-label, var(--kit-font-body)); }
.kit-filters label { display: flex; align-items: center; gap: 10px; font-size: 14px; cursor: pointer; }
.kit-filters input[type=checkbox], .kit-filters input[type=radio] { width: 18px; height: 18px; accent-color: var(--kit-accent); }
.kit-listing { display: grid; grid-template-columns: 1fr; gap: 24px; align-items: start; }
.kit-listing.has-side { grid-template-columns: 240px minmax(0, 1fr); }
@media (max-width: 900px) { .kit-listing.has-side { grid-template-columns: 1fr; } }
.kit-pager { display: flex; justify-content: center; gap: 8px; flex-wrap: wrap; padding: 16px 0; }
.kit-pager a { min-width: 48px; height: 48px; padding: 0 8px; display: flex; align-items: center; justify-content: center; border-radius: var(--kit-chip-radius, 999px); border: var(--kit-border-w, 1px) solid var(--kit-line-2); text-decoration: none; font-weight: 600; background: var(--kit-surface); }
.kit-pager a[aria-current] { background: var(--kit-chip-on-bg, var(--kit-text)); color: var(--kit-chip-on-ink, var(--kit-bg)); border-color: var(--kit-chip-on-border, var(--kit-chip-on-bg, var(--kit-text))); }
.kit-gallery { display: grid; gap: 12px; grid-template-columns: repeat(var(--kit-gallery-cols, 4), minmax(0, 1fr)); }
.kit-gallery .main { grid-column: 1 / -1; aspect-ratio: var(--kit-gallery-ratio, 1 / 1); border-radius: var(--kit-radius, 24px); border: var(--kit-border-w, 1px) solid var(--kit-line); box-shadow: var(--kit-shadow, none); }
.kit-gallery .thumb { aspect-ratio: 1 / 1; border-radius: var(--kit-radius-sm, 14px); border: var(--kit-border-w, 1px) solid var(--kit-line); padding: 0; cursor: pointer; }
.kit-var { display: flex; gap: 8px; flex-wrap: wrap; }
.kit-var button { min-width: 56px; height: 48px; padding: 0 16px; border-radius: var(--kit-radius-sm, 14px); border: var(--kit-border-w, 1px) solid var(--kit-line-2); background: var(--kit-field-bg, transparent); color: var(--kit-text); font: inherit; font-weight: 600; font-size: 14px; cursor: pointer; }
.kit-var button.on { background: var(--kit-chip-on-bg, var(--kit-text)); color: var(--kit-chip-on-ink, var(--kit-bg)); border-color: var(--kit-chip-on-border, var(--kit-chip-on-bg, var(--kit-text))); box-shadow: var(--kit-shadow-sm, none); }
.kit-var button:disabled { opacity: .45; text-decoration: line-through; cursor: not-allowed; }
.kit-specs { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); border: var(--kit-border-w, 1px) solid var(--kit-line); border-radius: var(--kit-radius, 24px); overflow: hidden; }
.kit-specs > div { padding: 18px 20px; border-right: var(--kit-border-w, 1px) solid var(--kit-line); border-bottom: var(--kit-border-w, 1px) solid var(--kit-line); display: flex; flex-direction: column; gap: 4px; background: var(--kit-surface); }
.kit-specs span { font-size: 12px; color: var(--kit-muted); }
.kit-specs b { font-size: 15px; font-weight: 600; }
.kit-acc { border: var(--kit-border-w, 1px) solid var(--kit-line); border-radius: var(--kit-radius-sm, 14px); background: var(--kit-surface); overflow: hidden; }
.kit-acc + .kit-acc { margin-top: 10px; }
.kit-acc summary { list-style: none; cursor: pointer; padding: 16px 18px; font-weight: 700; display: flex; justify-content: space-between; text-transform: var(--kit-label-transform, none); font-family: var(--kit-font-label, var(--kit-font-body)); font-size: 14px; }
.kit-acc summary::-webkit-details-marker { display: none; }
.kit-acc summary::after { content: '+'; }
.kit-acc[open] summary { background: var(--kit-acc-open, transparent); }
.kit-acc[open] summary::after { content: '−'; }
.kit-acc > div { padding: 0 18px 18px; font-size: 15px; line-height: 1.7; color: var(--kit-soft, var(--kit-muted)); }
.kit-empty { padding: 48px; text-align: center; border: var(--kit-border-w, 1px) dashed var(--kit-line-2); border-radius: var(--kit-radius, 24px); display: flex; flex-direction: column; gap: 12px; align-items: center; }
.kit-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.kit-reviews .text-sm, .kit-reviews p { color: var(--kit-soft, var(--kit-muted)); }
.kit-body .theme-main { min-height: 50vh; }
.kit-drop { position: relative; }
.kit-drop > summary { list-style: none; cursor: pointer; }
.kit-drop > summary::-webkit-details-marker { display: none; }
.kit-sort { display: flex; align-items: center; gap: 10px; }
.kit-count { font-family: var(--kit-font-label, var(--kit-font-body)); font-size: 14px; color: var(--kit-muted); }
.kit-hero-band { background: var(--kit-band-bg, transparent); border-bottom: var(--kit-border-w, 1px) solid var(--kit-band-line, var(--kit-line)); }
/* Tailwind ile yazılmış iç sayfalar (iletişim, blog, şifre sıfırlama, destek…) tema değişkenlerine uyarlanır. */
.kit-body .theme-main { --th-btn: var(--kit-btn-bg); --th-btn-hover: var(--kit-btn-bg); --th-link: var(--kit-link, var(--kit-accent)); --th-btn-r: var(--kit-btn-radius, 999px); --th-field-r: var(--kit-radius-sm, 14px); --th-card-r: var(--kit-radius, 24px); --th-border: var(--kit-line-2); color: var(--kit-text); }
.kit-body .theme-main :is(.bg-white, .bg-slate-50, .bg-gray-50, .bg-slate-100, .bg-gray-100) { background-color: var(--kit-surface) !important; }
.kit-body .theme-main :is(.text-slate-900, .text-gray-900, .text-slate-800, .text-gray-800, .text-slate-700, .text-gray-700, .text-black) { color: var(--kit-text) !important; }
.kit-body .theme-main :is(.text-slate-600, .text-gray-600, .text-slate-500, .text-gray-500, .text-slate-400, .text-gray-400) { color: var(--kit-muted) !important; }
.kit-body .theme-main :is(.border, .border-b, .border-t, .border-slate-200, .border-gray-200) { border-color: var(--kit-line) !important; }
.kit-body .theme-main :is(input.border:not([type=checkbox]):not([type=radio]), select.border, textarea.border) { background: var(--kit-field-bg, var(--kit-surface)) !important; color: var(--kit-text) !important; border: var(--kit-border-w, 1px) solid var(--kit-line-2) !important; }
.kit-body .theme-main :is(button.bg-slate-900, a.bg-slate-900, input[type=submit].bg-slate-900) { background-color: var(--kit-btn-bg) !important; color: var(--kit-btn-ink) !important; border: var(--kit-border-w, 1px) solid var(--kit-btn-border, transparent) !important; box-shadow: var(--kit-shadow-sm, none); }
.kit-body .theme-main :is(.border.rounded-lg, details.border, .rounded-xl.shadow, .shadow) { background-color: var(--kit-surface); border-radius: var(--kit-radius, 24px); box-shadow: var(--kit-shadow-sm, none) !important; }
.kit-body .theme-main :is(h1, h2, h3).font-bold, .kit-body .theme-main h1 { font-family: var(--kit-font-display); text-transform: var(--kit-display-transform, none); }
.kit-body .theme-main .prose, .kit-body .theme-main .prose :is(p, li, h2, h3, strong) { color: inherit; }
.kit-price-tag { display: inline-block; }
.kit-body .theme-main :is(button.border, a.border.rounded) { background: transparent !important; color: var(--kit-text) !important; border: var(--kit-border-w, 1px) solid var(--kit-line-2) !important; border-radius: var(--kit-btn-radius, 999px) !important; font-weight: 600; }
.kit-body .theme-main form label + label { margin-left: 0; }
.kit-filters fieldset { max-height: 320px; overflow-y: auto; }
.kit-filters fieldset.kit-price { overflow: visible; }
.kit-body :is(.kit-h1, .kit-h2, .kit-h3, .toz-title, .toz-hero h1, .toz-drop h2, .kyro-hero h1) { overflow-wrap: anywhere; }
.kit-body :is(.kit-h1, .kit-h2, .toz-title) { min-width: 0; max-width: 100%; }