/* Tailwind'e ek küçük özel stiller */
body { font-family: 'Inter', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif; }
/* Vitrin yazı tipi (Tasarım Havuzu > Fontlar veya Ayarlar > Tema & Renkler; --font tailwind_head() içinde tanımlanır) */
body.t-page { font-family: var(--font, 'Inter'), 'Inter', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif; }

.no-scrollbar { scrollbar-width: none; }
.no-scrollbar::-webkit-scrollbar { display: none; }

.marquee { width: max-content; animation: marquee 35s linear infinite; }
.marquee:hover { animation-play-state: paused; }
@keyframes marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .marquee { animation: none; } }

/* Tema renkleri (Yönetim > Tema & Renkler; değişkenler tailwind_head() içinde tanımlanır) */
.t-page { background-color: var(--page-bg); }
.t-announce { background-color: var(--announce-bg); color: var(--announce-text); }
.t-newsletter { background-color: var(--newsletter-bg); color: var(--newsletter-text); }
.t-footer { background-color: var(--footer-bg); color: var(--footer-text); }
.t-footer-h { color: var(--footer-heading); }
.t-footer a:hover { color: var(--footer-heading); }
.t-footer-muted { opacity: .75; }
.t-footer-line { border-color: color-mix(in srgb, currentColor 18%, transparent); }
.t-footer-chip { background-color: color-mix(in srgb, currentColor 14%, transparent); }
.t-footer-chip:hover { background-color: rgb(var(--brand)); color: #fff; }
.t-btn { background-color: var(--btn-bg); color: var(--btn-text); }
.t-btn:hover { filter: brightness(.9); }

/* Anasayfa bölüm renkleri (bölüm ayarları > Renkler) */
.sec-bg { display: flow-root; padding-bottom: 2.5rem; }
.has-sec-heading .sec-h { color: var(--sec-heading) !important; }
.has-sec-text { color: var(--sec-text); }
.has-sec-text :is(p, li, blockquote, h1, h2, h3, h4, .prose-content):not(.product-card *):not(.sec-h) { color: var(--sec-text) !important; }

/* Yönetici panelinden girilen HTML içerik için tipografi */
.prose-content h2 { font-size: 1.35rem; font-weight: 700; margin: 1.4em 0 .6em; color: #111827; }
.prose-content h3 { font-size: 1.15rem; font-weight: 700; margin: 1.2em 0 .5em; color: #111827; }
.prose-content h4 { font-weight: 700; margin: 1em 0 .4em; }
.prose-content p { margin: 0 0 1em; }
.prose-content ul { list-style: disc; padding-left: 1.4em; margin: 0 0 1em; }
.prose-content ol { list-style: decimal; padding-left: 1.4em; margin: 0 0 1em; }
.prose-content a { color: rgb(var(--brand)); text-decoration: underline; }
.prose-content img { max-width: 100%; height: auto; border-radius: .5rem; margin: 1em 0; }
.prose-content table { width: 100%; border-collapse: collapse; margin: 1em 0; }
.prose-content th, .prose-content td { border: 1px solid #e5e7eb; padding: .5em .75em; text-align: left; }
.prose-content blockquote { border-left: 4px solid rgb(var(--brand)); padding-left: 1em; color: #4b5563; margin: 1em 0; }
.prose-content > :first-child { margin-top: 0; }

/* "Sepete eklendi" penceresi */
.cart-popup { animation: cart-popup-in .25s ease-out; }
.cart-popup-out { opacity: 0; transform: translateY(8px); transition: opacity .2s, transform .2s; }
@keyframes cart-popup-in { from { opacity: 0; transform: translateY(12px) scale(.98); } to { opacity: 1; transform: none; } }
.cart-bump { animation: cart-bump .45s ease-out; }
@keyframes cart-bump { 30% { transform: scale(1.45); } 100% { transform: scale(1); } }
@media (prefers-reduced-motion: reduce) { .cart-popup, .cart-bump { animation: none; } }

/* Canlı düzenleme (yalnızca yönetici görür) */
.inline-edit-hover { outline: 2px dashed rgb(var(--brand)); outline-offset: 3px; border-radius: 4px; cursor: text; }
.inline-edit-pencil {
    position: fixed; z-index: 85; width: 30px; height: 30px; display: flex; align-items: center; justify-content: center;
    border-radius: 9999px; background: rgb(var(--brand)); color: #fff; box-shadow: 0 4px 12px rgba(0,0,0,.25);
    border: 2px solid #fff; cursor: pointer; transition: transform .1s;
}
.inline-edit-pencil:hover { transform: scale(1.12); }
.inline-edit-pencil[hidden] { display: none; }
.inline-edit-sizer { background: #111827; }
.inline-edit-size {
    position: fixed; z-index: 85; pointer-events: none; padding: 2px 8px; border-radius: 6px;
    background: #111827; color: #fff; font: 600 11px/1.6 ui-monospace, SFMono-Regular, Menlo, monospace; white-space: nowrap;
    box-shadow: 0 2px 8px rgba(0,0,0,.25);
}
.inline-edit-size[hidden] { display: none; }
.inline-edit-modal .prose-content:empty::before { content: 'Metninizi yazın…'; color: #9ca3af; }
.admin-toolbar, .inline-edit-modal { font-family: 'Inter', ui-sans-serif, system-ui, sans-serif; }

/* Tasarım havuzu (canlı düzenlemede sol kenar çubuğu) */
.pool-panel {
    position: fixed; z-index: 87; top: 0; bottom: 0; left: 0; width: 340px; max-width: 92vw; display: flex; flex-direction: column;
    background: #fff; color: #1f2937; box-shadow: 4px 0 30px rgba(0,0,0,.18); font: 13px/1.45 'Inter', ui-sans-serif, system-ui, sans-serif;
}
@media (min-width: 1280px) {
    html.pool-open body { padding-left: 340px; }
    html.pool-open .admin-toolbar { left: calc(50% + 170px); }
}
.pool-head { display: flex; align-items: center; justify-content: space-between; padding: 14px 16px; border-bottom: 1px solid #e5e7eb; font-size: 15px; }
.pool-head button { border: 0; background: none; padding: 4px 8px; border-radius: 6px; color: #9ca3af; cursor: pointer; font-size: 15px; }
.pool-head button:hover { background: #f3f4f6; color: #374151; }
.pool-tabs { display: flex; gap: 4px; padding: 8px 10px 0; border-bottom: 1px solid #e5e7eb; background: #f9fafb; }
.pool-tabs button { flex: 1; padding: 8px 4px; border: 1px solid transparent; border-bottom: 0; border-radius: 8px 8px 0 0; background: none; color: #6b7280; font-weight: 600; font-size: 12px; cursor: pointer; }
.pool-tabs button:hover { color: #111827; }
.pool-tabs button.is-on { margin-bottom: -1px; background: #fff; border-color: #e5e7eb; color: rgb(var(--brand)); }
.pool-body { flex: 1; overflow-y: auto; padding: 12px 14px 20px; }
.pool-hint { margin: 0 0 12px; padding: 10px 12px; border-radius: 10px; background: #f3f4f6; color: #6b7280; font-size: 12px; }
.pool-muted { color: #9ca3af; }
.pool-card { margin-bottom: 12px; overflow: hidden; border: 1px solid #e5e7eb; border-radius: 12px; background: #fff; transition: border-color .15s, box-shadow .15s; }
.pool-card:hover { border-color: rgb(var(--brand) / .5); box-shadow: 0 4px 14px rgba(0,0,0,.08); }
.pool-card[draggable=true] { cursor: grab; }
.pool-thumb { position: relative; overflow: hidden; background: #f9fafb; pointer-events: none; border-bottom: 1px solid #f3f4f6; }
.pool-mini { position: absolute; top: 0; left: 0; width: 600px; transform-origin: 0 0; background: #fff; font-family: var(--font), sans-serif; }
.pool-card-foot { display: flex; align-items: center; gap: 8px; padding: 8px 10px; }
.pool-card-name { flex: 1; min-width: 0; }
.pool-card-name b { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; }
.pool-card-name small { color: #9ca3af; font-size: 11px; }
.pool-btn { flex-shrink: 0; padding: 6px 12px; border: 1px solid #d1d5db; border-radius: 8px; background: #fff; color: #1f2937; font-size: 12px; font-weight: 600; cursor: pointer; }
.pool-btn:hover { border-color: rgb(var(--brand)); color: rgb(var(--brand)); }
.pool-btn:disabled { opacity: .5; cursor: wait; }
.pool-btn.is-primary { background: rgb(var(--brand)); border-color: rgb(var(--brand)); color: #fff; }
.pool-group { margin: 16px 0 6px; color: #9ca3af; font-size: 11px; font-weight: 700; letter-spacing: .5px; text-transform: uppercase; }
.pool-group:first-of-type { margin-top: 4px; }
.pool-font { display: block; width: 100%; margin-bottom: 6px; padding: 10px 12px; border: 1px solid #e5e7eb; border-radius: 10px; background: #fff; text-align: left; cursor: pointer; color: #1f2937; }
.pool-font:hover { border-color: rgb(var(--brand) / .5); }
.pool-font.is-on { border-color: rgb(var(--brand)); background: rgb(var(--brand) / .06); box-shadow: inset 0 0 0 1px rgb(var(--brand)); }
.pool-font-name { display: block; font-size: 16px; font-weight: 700; }
.pool-font-name small { font: 600 11px 'Inter', sans-serif; color: rgb(var(--brand)); }
.pool-font-sample { display: block; margin-top: 2px; color: #6b7280; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pool-font-bar { display: flex; align-items: center; gap: 6px; padding: 12px 14px; border-top: 1px solid #e5e7eb; background: #fff; box-shadow: 0 -6px 16px rgba(0,0,0,.06); }
.pool-font-bar span { flex: 1; min-width: 0; font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pool-icons { padding: 10px 12px; }
.pool-icons-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 8px; }
.pool-link { padding: 0; border: 0; background: none; color: rgb(var(--brand)); font-size: 11px; font-weight: 600; cursor: pointer; }
.pool-link:hover { text-decoration: underline; }
.pool-icon-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(44px, 1fr)); gap: 6px; }
.pool-icon { height: 44px; display: flex; align-items: center; justify-content: center; border: 1px solid #e5e7eb; border-radius: 10px; background: #fff; color: #374151; cursor: pointer; }
.pool-icon svg { width: 22px; height: 22px; }
.pool-icon:hover { border-color: rgb(var(--brand)); color: rgb(var(--brand)); }
.pool-icon.is-on { border-color: rgb(var(--brand)); background: rgb(var(--brand) / .08); color: rgb(var(--brand)); box-shadow: inset 0 0 0 1px rgb(var(--brand)); }
.pool-icon:disabled { opacity: .5; cursor: wait; }
.pool-icon-hl { outline: 2px solid #db2777 !important; outline-offset: 3px; border-radius: 6px; }
.pool-drop-line { position: fixed; z-index: 86; height: 4px; border-radius: 2px; background: rgb(var(--brand)); box-shadow: 0 0 0 4px rgb(var(--brand) / .25); pointer-events: none; }
.pool-drop-line[hidden] { display: none; }
html.pool-dragging [data-section-id] { outline: 2px dashed rgb(var(--brand) / .35); outline-offset: 4px; }

input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
input[type=number] { -moz-appearance: textfield; }