/* ============================================================
   Webboll Page Builder — Frontend CSS v2.2
   Tam responsive, taşma koruması
============================================================ */

/* ── GLOBAL BOX MODEL ─────────────────────────────────────── */
.wpb-section,
.wpb-section-inner,
.wpb-columns-grid,
.wpb-column,
.wpb-block {
    box-sizing: border-box;
}

/* ── SECTION ─────────────────────────────────────────────── */
.wpb-section {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
}

.wpb-section-inner {
    width: 100%;
    box-sizing: border-box;
    /* Mobilde padding artır */
}

/* ── GRID ────────────────────────────────────────────────── */
.wpb-columns-grid {
    display: grid;
    width: 100%;
    box-sizing: border-box;
}

/* ── COLUMN ──────────────────────────────────────────────── */
.wpb-column {
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
    overflow: hidden;
    word-break: break-word;
    overflow-wrap: break-word;
}

/* ── BLOCK ───────────────────────────────────────────────── */
.wpb-block {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
    overflow: hidden;
}
/* Görsel bloğu: figure ve img sütunu tam doldursun */
.wpb-block--image { width: 100%; }
.wpb-block--image figure { width: 100%; margin: 0; }

/* Block içi her medya elemanı responsive */
.wpb-block video,
.wpb-block iframe,
.wpb-block embed,
.wpb-block object {
    max-width: 100% !important;
    height: auto !important;
    display: block;
}
/* Genel img: tasmayi onle ama width'i ezme */
.wpb-block img {
    max-width: 100%;
    height: auto;
    display: block;
}
/* Görsel ögesi: kullanicinin secdigi genislik kazanir */
.wpb-block figure img.wpb-img {
    display: block;
}
.wpb-block table {
    max-width: 100%;
    overflow-x: auto;
    display: block;
    width: 100%;
}
.wpb-block pre,
.wpb-block code {
    white-space: pre-wrap;
    word-break: break-all;
    max-width: 100%;
    overflow-x: auto;
}

/* ── SLIDER ──────────────────────────────────────────────── */
.wsl-slider {
    position: relative;
    width: 100%;
    max-width: 100%;
    overflow: hidden;
    display: block;
}
.wsl-track {
    display: flex;
    height: 100%;
}
.wsl-slide {
    min-width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
    flex-shrink: 0;
}
.wsl-bg-img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.wsl-layers { position: absolute; inset: 0; }
.wsl-layer  { position: absolute; opacity: 0; }
.wsl-layer.on { opacity: 1; }
.wsl-layer img { max-width: 100%; height: auto; }

/* ── MARQUEE ─────────────────────────────────────────────── */
.wpb-marquee-wrap { overflow: hidden; width: 100%; max-width: 100%; }

/* ── GİZLE / GÖSTER ──────────────────────────────────────── */
@media (max-width: 767px)  { .wpb-hide-mobile  { display: none !important; } }
@media (min-width: 768px) and (max-width: 1024px) { .wpb-hide-tablet  { display: none !important; } }
@media (min-width: 1025px) { .wpb-hide-desktop { display: none !important; } }

/* ── MOBİL GENEL ─────────────────────────────────────────── */
@media (max-width: 767px) {
    .wpb-section-inner {
        padding-left: 12px !important;
        padding-right: 12px !important;
    }
    .wpb-column {
        width: 100% !important;
        max-width: 100% !important;
        overflow: hidden !important;
    }
    .wpb-block {
        max-width: 100% !important;
        overflow: hidden !important;
    }
    /* Tüm medya */
    .wpb-section img,
    .wpb-section video,
    .wpb-section iframe {
        max-width: 100% !important;
        height: auto !important;
    }
    /* Tablo yatay scroll */
    .wpb-section table {
        display: block;
        overflow-x: auto;
        max-width: 100%;
    }
}

/* ── İÇ SATIR ────────────────────────────────────────────── */
.wpb-inner-section {
    width: 100%;
    box-sizing: border-box;
    overflow: hidden;
}
.wpbis-col {
    min-width: 0;
    overflow: hidden;
    box-sizing: border-box;
}
.wpbis-blk {
    max-width: 100%;
    overflow: hidden;
    box-sizing: border-box;
}
.wpbis-blk img,
.wpbis-blk video,
.wpbis-blk iframe {
    max-width: 100% !important;
    height: auto !important;
}
@media (max-width: 767px) {
    .wpb-inner-section {
        grid-template-columns: 1fr !important;
    }
    .wpbis-col { overflow: hidden; }
}

/* ── WOO ─────────────────────────────────────────────────── */
.wpb-add-to-cart { transition: opacity .2s; }
.wpb-add-to-cart:hover { opacity: .85; }
.wpb-woo-products,
.wpb-woo-cats {
    min-width: 0;
    max-width: 100%;
    width: 100%;
}

/* ════════════════════════════════════════════════
   GÖRSEL HOVER ZOOM
════════════════════════════════════════════════ */
/* Görsel zoom render içinde ID-tabanlı CSS ile yönetiliyor */

/* ════════════════════════════════════════════════
   GİRİŞ ANİMASYONLARI
════════════════════════════════════════════════ */
[data-wpb-anim] {
    opacity: 0;
    transition: opacity .7s ease, transform .7s ease;
}
[data-wpb-anim].wpb-animated {
    opacity: 1;
    transform: none !important;
}
[data-wpb-anim="fadeIn"]   { transform: none; }
[data-wpb-anim="fadeInUp"],
[data-wpb-anim="slideUp"]   { transform: translateY(40px); }
[data-wpb-anim="fadeInDown"]{ transform: translateY(-40px); }
[data-wpb-anim="zoomIn"]    { transform: scale(.85); }
[data-wpb-anim="slideLeft"] { transform: translateX(40px); }
[data-wpb-anim="slideRight"]{ transform: translateX(-40px); }

/* ════════════════════════════════════════════════════
   HIYERARSIK BOYUT SINIRLAMA (madde 5)
   Oge ≤ Sutun ≤ Satir ≤ Ekran — hicbiri parent'ini asamaz
════════════════════════════════════════════════════ */
.wpb-section {
    max-width: 100%;
    overflow-x: hidden;
    box-sizing: border-box;
}
.wpb-column {
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
    overflow: hidden;
}
.wpb-column > .wpb-block {
    max-width: 100%;
    box-sizing: border-box;
    overflow: hidden;
}
/* Ic medya hicbir zaman tasmaz */
.wpb-block img,
.wpb-block video,
.wpb-block iframe,
.wpb-block svg {
    max-width: 100%;
    box-sizing: border-box;
}

/* ── METİN BLOĞU paragraf boşlukları (kopyala-yapıştır sonrası dev boşlukları önler) ── */
.wpb-text p{
    margin: 0 0 0.8em 0;
}
.wpb-text p:last-child{
    margin-bottom: 0;
}
.wpb-text br + br{
    /* Ardışık boş satırları sınırla */
    display: none;
}
