/* ============================================================================
 * Moxa Panel — Site Chrome (Header / Footer wrapper)
 *
 * Builder içindeki "Header tasarımı" / "Footer tasarımı" panelinden gelen
 * ayarları DOM'a uygular. PHP tarafı:
 *
 *   <header class="site-header site-header--custom site-chrome
 *                  site-chrome--header is-sticky has-solid-on-scroll …"
 *           data-chrome-threshold="40"
 *           style="--chrome-bg:#fff;--chrome-bg-scrolled:#fff;…">
 *
 * JS (site-chrome.js) scroll konumuna göre .is-scrolled ve .is-hidden ekler.
 * ========================================================================== */

.site-chrome {
    background: var(--chrome-bg, #ffffff);
    color: var(--chrome-text, inherit);
    transition: background-color var(--chrome-motion-duration, 350ms) var(--chrome-motion-easing, ease-out),
                color var(--chrome-motion-duration, 350ms) var(--chrome-motion-easing, ease-out),
                box-shadow var(--chrome-motion-duration, 350ms) var(--chrome-motion-easing, ease-out),
                transform var(--chrome-motion-duration, 350ms) cubic-bezier(.22,.61,.36,1),
                padding .25s ease,
                backdrop-filter var(--chrome-motion-duration, 350ms) ease,
                min-height var(--chrome-motion-duration, 350ms) var(--chrome-motion-easing, ease-out);
    will-change: transform, background-color;
    position: relative;
    z-index: var(--chrome-z, 100);
}

.site-chrome--header { width: 100%; max-width: 100%; min-height: var(--chrome-h, 0); max-height: var(--chrome-max-h, none); overflow-x: clip; }
.site-chrome--footer { width: 100%; max-height: var(--chrome-max-h, none); }

/* Positioning behaviors */
.site-chrome.is-sticky {
    position: sticky;
    top: 0;
}
.site-chrome.is-fixed {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
}
.site-chrome.is-absolute {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
}
.site-chrome--footer.is-sticky-bottom {
    position: sticky;
    bottom: 0;
    left: 0;
    right: 0;
}

/* Sayfa scroll ilerleme çubuğu (header üstü) */
.site-chrome__scroll-progress {
    position: absolute;
    top: 0;
    left: 0;
    height: var(--chrome-progress-h, 3px);
    width: 0;
    max-width: 100%;
    background: var(--chrome-progress-color, var(--color-secondary, #c9a227));
    z-index: calc(var(--chrome-z, 100) + 1);
    pointer-events: none;
    transition: width 0.12s linear;
}
.site-chrome.has-scroll-progress .site-chrome__inner {
    position: relative;
}

/* Inner wrapper — max width + padding + (optional) height anchor */
.site-chrome__inner {
    width: 100%;
    max-width: var(--chrome-max-w, 1400px);
    margin-inline: auto;
    padding-inline: var(--chrome-pad-x, 24px);
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
    transition: min-height .25s ease, padding .25s ease;
}
.site-chrome--header .site-chrome__inner {
    min-height: var(--chrome-h, 80px);
    max-height: var(--chrome-max-h, none);
    overflow-x: clip;
    overflow-y: visible;
    scrollbar-gutter: auto;
}
/* ═══ VXP FIX: Tek satırlı header'da row tam yüksekliğe yayılsın,
   panelde tasarlanan ile canlı birebir aynı görünsün ═══ */
.site-chrome--header.site-chrome--single-row .site-chrome__inner {
    align-items: stretch;
    min-height: var(--chrome-h, 80px);
    max-height: var(--chrome-max-h, none);
    gap: 0;
}
/* Tek satırda row'un chrome wrapper'ı tam doldurması — boşluk/sızıntı olmasın */
.site-chrome--header.site-chrome--single-row .site-chrome__inner > .layout-row {
    flex: 1 1 auto;
    align-self: stretch;
    min-height: 100%;
}
/* Chrome içindeki layout satırları — gereksiz py-16 / beyaz boşlukları önle.
   VXP: !important KALDIRILDI. Kullanıcı tasarım panelinden row padding
   ayarladıysa inline style CSS override'ı kazanır. */
.site-chrome .layout-row {
    padding-top: 0;
    padding-bottom: 0;
}
.site-chrome--header .pb-canvas-zone {
    overflow: hidden;
}
.site-chrome--header .pb-canvas-zone,
.site-chrome--footer .pb-canvas-zone {
    min-height: var(--chrome-h, auto);
}
.site-chrome .pb-canvas-placeholder {
    display: none !important;
}
/* Header / footer içindeki modüllerin geniş .module padding'i (py-16 vb.)
   chrome wrapper'a uymaz; chrome modülleri için varsayılan padding'i sıfırlıyoruz.
   VXP: !important KALDIRILDI. Kullanıcı tasarım panelinden module padding
   ayarladıysa inline style kazanır. */
.site-chrome .module {
    padding-top: 0;
    padding-bottom: 0;
}
.site-chrome--header .module {
    padding-block: 4px;
}
.site-chrome--footer .module {
    padding-block: 12px;
}

/* Borders */
.site-chrome.has-border-bottom {
    border-bottom: 1px solid var(--chrome-border, rgba(15,23,42,0.08));
}
.site-chrome.has-border-top {
    border-top: 1px solid var(--chrome-border, rgba(15,23,42,0.08));
}

/* Shadow scale */
.site-chrome.has-shadow-soft { box-shadow: 0 4px 14px -8px rgba(15,23,42,.18); }
.site-chrome.has-shadow-medium { box-shadow: 0 10px 24px -12px rgba(15,23,42,.25); }
.site-chrome.has-shadow-strong { box-shadow: 0 18px 38px -14px rgba(15,23,42,.35); }

/* Transparent at top of the page */
.site-chrome--header.has-transparent-top:not(.is-scrolled) {
    background: transparent !important;
    box-shadow: none;
    border-color: transparent;
}

/* Scrolled state — swap colors / shadow */
.site-chrome--header.has-solid-on-scroll.is-scrolled,
.site-chrome--footer.has-solid-on-scroll.is-scrolled {
    background: var(--chrome-bg-scrolled, var(--chrome-bg, #ffffff));
    color: var(--chrome-text-scrolled, var(--chrome-text, inherit));
}

.site-chrome.is-scrolled[data-shadow-scrolled="soft"]   { box-shadow: 0 4px 14px -8px rgba(15,23,42,.18); }
.site-chrome.is-scrolled[data-shadow-scrolled="medium"] { box-shadow: 0 10px 24px -12px rgba(15,23,42,.25); }
.site-chrome.is-scrolled[data-shadow-scrolled="strong"] { box-shadow: 0 18px 38px -14px rgba(15,23,42,.35); }
.site-chrome.is-scrolled[data-shadow-scrolled="none"]   { box-shadow: none; }

/* Shrink-on-scroll: reduce inner min-height */
.site-chrome--header.has-shrink-on-scroll.is-scrolled .site-chrome__inner {
    min-height: var(--chrome-h-scrolled, 64px);
    max-height: var(--chrome-max-h-scrolled, none);
}

/* Hide on scroll down */
.site-chrome--header.has-hide-on-down.is-hidden {
    transform: translateY(-100%);
}

/* Glass effect (overlay backwards compat with pb-chrome-glass.css) */
.site-chrome.is-glass {
    -webkit-backdrop-filter: blur(var(--chrome-blur, 14px)) saturate(var(--chrome-saturate, 150%));
    backdrop-filter: blur(var(--chrome-blur, 14px)) saturate(var(--chrome-saturate, 150%));
    background: color-mix(in oklab, var(--chrome-bg, #ffffff) calc(var(--chrome-backdrop-opacity, 1) * 60%), transparent);
}
.site-chrome.is-glass.is-scrolled {
    background: color-mix(in oklab, var(--chrome-bg-scrolled, var(--chrome-bg, #ffffff)) calc(var(--chrome-backdrop-opacity, 1) * 85%), transparent);
}

/* Giriş animasyonları (Wix / Webflow) */
.site-chrome.has-entrance-fade.is-chrome-entering {
    opacity: 0;
}
.site-chrome.has-entrance-fade.is-chrome-entered {
    opacity: 1;
    transition: opacity var(--chrome-motion-duration, 500ms) var(--chrome-motion-easing, ease-out);
}
.site-chrome.has-entrance-slide-down.is-chrome-entering {
    opacity: 0;
    transform: translateY(-16px);
}
.site-chrome.has-entrance-slide-down.is-chrome-entered {
    opacity: 1;
    transform: translateY(0);
    transition: opacity var(--chrome-motion-duration, 500ms) var(--chrome-motion-easing, ease-out),
                transform var(--chrome-motion-duration, 500ms) var(--chrome-motion-easing, ease-out);
}

/* Logo scroll küçültme */
.site-chrome.has-logo-shrink-on-scroll.is-scrolled .module-site_logo img,
.site-chrome.has-logo-shrink-on-scroll.is-scrolled .pb-canvas-module-embed .module-site_logo img {
    transform: scale(var(--chrome-logo-scale, 0.82));
    transform-origin: left center;
    transition: transform var(--chrome-motion-duration, 280ms) var(--chrome-motion-easing, ease-out);
}

/* When using fixed/sticky position, content below should not jump.
   We rely on natural sticky reservation when behavior=sticky. For 'fixed',
   we leave a CSS-only spacer via padding on body. JS adds .has-fixed-chrome
   to <body> with computed height variable. */
body.has-fixed-chrome { padding-top: var(--chrome-spacer, 0px); }

/* Reduce motion preference */
@media (prefers-reduced-motion: reduce) {
    .site-chrome { transition: background-color .15s linear, color .15s linear; }
    .site-chrome--header.has-hide-on-down.is-hidden { transform: none; opacity: 0; pointer-events: none; }
}

/* Builder içinde — sticky / fixed devre dışı, görsel parça olarak göster */
body.pb-body .site-chrome.is-sticky,
body.pb-body .site-chrome.is-fixed,
body.pb-body .site-chrome.is-absolute {
    position: relative;
}
body.pb-body .site-chrome.has-hide-on-down.is-hidden { transform: none; }

/* Chrome modül stilleri */
.site-menu-mod .site-nav-link,
.site-menu-mod .nav-dropdown-btn {
    color: var(--site-menu-color, var(--chrome-text, inherit));
}
.site-menu-mod .site-nav-link:hover,
.site-menu-mod .nav-dropdown-btn:hover {
    color: var(--site-menu-hover, var(--color-secondary, currentColor));
}
.site-menu-mod .site-nav-link.is-current,
.site-menu-mod .nav-dropdown-btn.is-current {
    color: var(--site-menu-active, var(--site-menu-hover, var(--color-secondary, currentColor)));
}
.site-logo-mod--stacked .site-logo-text-stack__name {
    letter-spacing: 0.04em;
}
.site-logo-mod--stacked .site-logo-text-stack__tagline {
    margin-top: 2px;
}
.site-chrome-mobile-menu a {
    color: inherit;
}
.site-chrome-mobile-menu a:hover {
    opacity: 0.85;
}
[data-lang-switcher="dropdown"] .lang-menu:not(.hidden) {
    display: block;
}
[data-lang-switcher="dropdown"] .lang-current {
    color: inherit;
}
.site-logo-mod,
.site-menu-mod,
.search-mod,
.contact-strip,
.copyright-line {
    color: inherit;
}
/* Chrome modülleri varsayılan olarak transparan arka plan kullanır.
   VXP: !important KALDIRILDI. Kullanıcı tasarım panelinden modül arka plan
   rengi ayarladıysa inline style kazanır. */
.site-chrome .module-site_logo,
.site-chrome .module-site_menu,
.site-chrome .module-language_switcher,
.site-chrome .module-contact_strip,
.site-chrome .module-social_icons,
.site-chrome .module-search_box,
.site-chrome .module-mobile_menu_toggle,
.site-chrome .module-copyright_line {
    background-color: transparent;
}

/* Duyuru şeridi kapanış animasyonu */
.pb-announce--closing {
    opacity: 0;
    transform: translateY(-100%);
    transition: opacity 0.25s ease, transform 0.25s ease;
    pointer-events: none;
}

/* Builder: chrome responsive breakpoint önizleme genişliği */
.pb-canvas-device.pb-chrome-preview--mobile {
    max-width: 390px;
    margin-left: auto;
    margin-right: auto;
}
.pb-canvas-device.pb-chrome-preview--tablet {
    max-width: 768px;
    margin-left: auto;
    margin-right: auto;
}

/* Builder: chrome scrolled / progress önizleme */
.pb-canvas-device.site-chrome .site-chrome__scroll-progress {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
}

/* --------------------------------------------------------------------------
 * site-chrome--flush: tam genişlik (edge-to-edge) header/footer
 * PHP header-render.php ve JS buildChromePreviewShell bu sınıfı ekler.
 * Hem canlı site (site-chrome__inner) hem builder (doğrudan satırlar)
 * için kenar boşluklarını ve max-width kısıtlamalarını kaldırır.
 * -------------------------------------------------------------------------- */
.site-chrome--flush .site-chrome__inner {
    padding-inline: 0 !important;
    max-width: 100% !important;
    margin-inline: 0 !important;          /* ← auto ortalamayı kır */
    transition: padding .25s ease !important;
}
/* Flush modunda site-chrome__inner'ın doğrudan çocukları (layout-row section)
   kesinlikle tam genişlikte olmalı */
.site-chrome--flush .site-chrome__inner > * {
    width: 100% !important;
    max-width: 100% !important;
}
/* Canlı site: site-chrome--flush altındaki TÜM container zincirini tam genişlik yap.
   Panelden "tam ekran genişliği" seçildiğinde row/kolon/modül seviyesinde
   kalan max-width, mx-auto, px-* kalıntılarını temizle. */
.site-chrome--flush .layout-row > .max-w-7xl,
.site-chrome--flush .layout-row > .max-w-6xl,
.site-chrome--flush .layout-row > [class*="max-w-"],
.site-chrome--flush .layout-row .mx-auto {
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}
/* Builder: pb-canvas-device doğrudan satır içerir, site-chrome__inner yok */
.pb-canvas-device.site-chrome--flush .layout-row > .w-full,
.pb-canvas-device.site-chrome--flush .pb-visual-canvas {
    padding-left: 0 !important;
    padding-right: 0 !important;
    max-width: 100% !important;
}
.pb-chrome-preview-toolbar {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 10px;
}

/* ═══════════════════════════════════════════════════════════
   VXP CHROME ROW VISIBILITY — Cihaz Bazlı Gösterme/Gizleme
   ═══════════════════════════════════════════════════════════ */

/* Tüm row'lar mobilde gizliyse chrome wrapper min-height:0, border/shadow kaldır */
@media (max-width: 767px) {
    .site-chrome--all-rows-hidden-mobile {
        min-height: 0 !important;
        border-bottom: none !important;
        box-shadow: none !important;
    }
    .site-chrome--all-rows-hidden-mobile .site-chrome__inner {
        min-height: 0 !important;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }
}

/* Chrome modül görünürlük sınıfları — pb-mod-vis CSS fallback (Tailwind yoksa) */
.pb-mod-vis-d-only,
.pb-mod-vis.pb-mod-vis-d-only { display: block; }
.pb-mod-vis-t-only,
.pb-mod-vis.pb-mod-vis-t-only { display: none; }
.pb-mod-vis-m-only,
.pb-mod-vis.pb-mod-vis-m-only { display: none; }
.pb-mod-vis-hide-m,
.pb-mod-vis.pb-mod-vis-hide-m { display: block; }
.pb-mod-vis-hide-t,
.pb-mod-vis.pb-mod-vis-hide-t { display: block; }

@media (max-width: 1023px) {
    .pb-mod-vis-d-only { display: none !important; }
    .pb-mod-vis-t-only { display: block !important; }
}

@media (max-width: 767px) {
    .pb-mod-vis-d-only { display: none !important; }
    .pb-mod-vis-t-only { display: none !important; }
    .pb-mod-vis-m-only { display: block !important; }
    .pb-mod-vis-hide-m { display: none !important; }
}

@media (min-width: 768px) and (max-width: 1023px) {
    .pb-mod-vis-hide-t { display: none !important; }
}

/* ── Responsive kolon visibility (data-col hidden override) ── */
@media (max-width: 767px) {
    [data-col-hidden-mobile="1"] { display: none !important; }
}
@media (min-width: 768px) and (max-width: 1023px) {
    [data-col-hidden-tablet="1"] { display: none !important; }
}
@media (min-width: 1024px) and (max-width: 1439px) {
    [data-col-hidden-laptop="1"] { display: none !important; }
}


/* ═══════════════════════════════════════════════════════════
   VXP ENTERPRISE: MOBILE DRAWER SYSTEM
   pb-mobile-drawer — tam animasyonlu mobil menü çekmecesi
   ═══════════════════════════════════════════════════════════ */

.pb-mobile-drawer {
    position: fixed;
    inset: 0;
    z-index: 1000;
    pointer-events: none;
    visibility: hidden;
}
.pb-mobile-drawer.is-open {
    pointer-events: auto;
    visibility: visible;
}

/* ── Backdrop ── */
.pb-mobile-drawer__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 42, 0);
    backdrop-filter: blur(0px);
    -webkit-backdrop-filter: blur(0px);
    transition: background 0.35s ease, backdrop-filter 0.35s ease, -webkit-backdrop-filter 0.35s ease;
    cursor: pointer;
}
.pb-mobile-drawer.is-open .pb-mobile-drawer__backdrop {
    background: rgba(15, 23, 42, 0.45);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
}

/* ── Panel (sağdan) ── */
.pb-mobile-drawer__panel {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    width: var(--pb-drawer-w, 320px);
    max-width: 85vw;
    background: #ffffff;
    box-shadow: -8px 0 40px rgba(0, 0, 0, 0.15);
    transform: translateX(105%);
    transition: transform 0.35s cubic-bezier(0.22, 0.61, 0.36, 1);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    z-index: 1;
}
.pb-mobile-drawer.is-open .pb-mobile-drawer__panel {
    transform: translateX(0);
}

/* Soldan gelen drawer */
.pb-mobile-drawer[data-drawer-position="left"] .pb-mobile-drawer__panel {
    right: auto;
    left: 0;
    transform: translateX(-105%);
    box-shadow: 8px 0 40px rgba(0, 0, 0, 0.15);
}
.pb-mobile-drawer[data-drawer-position="left"].is-open .pb-mobile-drawer__panel {
    transform: translateX(0);
}

/* ── Panel Header ── */
.pb-mobile-drawer__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
    flex-shrink: 0;
}
.pb-mobile-drawer__title {
    font-size: 16px;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.01em;
}
.pb-mobile-drawer__close {
    width: 36px;
    height: 36px;
    border: none;
    border-radius: 8px;
    background: rgba(0, 0, 0, 0.04);
    color: #64748b;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.15s, color 0.15s;
}
.pb-mobile-drawer__close:hover {
    background: rgba(0, 0, 0, 0.08);
    color: #0f172a;
}

/* ── Panel Body ── */
.pb-mobile-drawer__body {
    flex: 1;
    overflow-y: auto;
    padding: 12px 0;
    overscroll-behavior: contain;
}
.pb-mobile-drawer__body a {
    display: block;
    padding: 14px 20px;
    font-size: 15px;
    font-weight: 500;
    color: #1e293b;
    text-decoration: none;
    transition: background 0.15s, color 0.15s;
    border-left: 3px solid transparent;
}
.pb-mobile-drawer__body a:hover,
.pb-mobile-drawer__body a:focus-visible {
    background: rgba(59, 130, 246, 0.06);
    color: #3b82f6;
    border-left-color: #3b82f6;
    outline: none;
}
.pb-mobile-drawer__body a.pb-mobile-drawer__sub {
    padding: 10px 20px 10px 36px;
    font-size: 13px;
    font-weight: 400;
    color: #64748b;
    border-left-color: transparent;
}
.pb-mobile-drawer__body a.pb-mobile-drawer__sub small {
    display: block;
    font-size: 11px;
    color: #94a3b8;
    margin-top: 2px;
    font-weight: 400;
}
.pb-mobile-drawer__body a.pb-mobile-drawer__sub:hover {
    background: rgba(59, 130, 246, 0.04);
    color: #3b82f6;
    border-left-color: #93c5fd;
}

/* ── Mega menu mobil ── */
.pb-mobile-drawer__body .px-5.py-2.text-xs {
    padding: 8px 20px !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #94a3b8 !important;
    background: transparent;
    border-bottom: 1px solid rgba(0,0,0,0.04);
    margin-bottom: 4px;
}

/* ── Language section ── */
.pb-mobile-drawer__langs {
    display: flex;
    gap: 6px;
    padding: 14px 20px;
    border-top: 1px solid rgba(0, 0, 0, 0.06);
    flex-wrap: wrap;
    flex-shrink: 0;
}
.pb-mobile-drawer__langs a {
    padding: 6px 14px;
    font-size: 12px;
    font-weight: 500;
    color: #64748b;
    text-decoration: none;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-radius: 20px;
    transition: all 0.15s;
    display: flex;
    align-items: center;
    gap: 4px;
}
.pb-mobile-drawer__langs a:hover {
    background: rgba(59, 130, 246, 0.06);
    border-color: #93c5fd;
    color: #3b82f6;
}
.pb-mobile-drawer__langs a.is-active {
    background: #3b82f6;
    color: #fff;
    border-color: #3b82f6;
    font-weight: 600;
}

/* ── Body overlay koruma ── */
body.pb-drawer-open {
    overflow: hidden;
    touch-action: none;
}

/* ── Reduce motion ── */
@media (prefers-reduced-motion: reduce) {
    .pb-mobile-drawer__panel {
        transition: transform 0.15s linear;
    }
    .pb-mobile-drawer__backdrop {
        transition: background 0.15s linear;
    }
}

/* ═══ VXP ENTERPRISE: Back to Top Button ═══ */
.pb-back-to-top {
    position: fixed; bottom: 24px; right: 24px; z-index: 45;
    width: 44px; height: 44px; border-radius: 50%;
    border: 1px solid rgba(0,0,0,0.08); background: #fff;
    color: #333; box-shadow: 0 4px 6px rgba(0,0,0,0.1);
    cursor: pointer; display: flex; align-items: center; justify-content: center;
    opacity: 0; pointer-events: none;
    transition: opacity 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease;
}
.pb-back-to-top:hover { transform: translateY(-2px); box-shadow: 0 10px 15px rgba(0,0,0,0.15); }
.pb-back-to-top:active { transform: translateY(0); }

/* ═══ FLEX LAYOUT ENGINE: nötr inner wrapper (site-chrome__inner'ın flex+max-width'inden bağımsız) ═══ */
.site-header .fle-region-inner,
.site-footer .fle-region-inner {
    width: 100%;
    display: block;
    max-width: none;
    margin: 0;
    padding: 0;
}
/* Flex kök: contentWidth (full/contained) kendi CSS'inden gelir */
.fle-region-inner > .fle-root {
    box-sizing: border-box;
}

/* ═══ FLEX LOGO: item boyutuna esnek (canlı site) ═══ */
.fle-node[data-fle-type="logo"] { height: 44px; }
.fle-node[data-fle-type="logo"] .fle-logo-link { height: 100%; display: flex; align-items: center; }
.fle-node[data-fle-type="logo"] img { height: 100%; width: auto; max-width: 100%; max-height: 100%; object-fit: contain; display: block; }