/*
 * MY BARBER SUPPLIER — CHECKOUT RESPONSIVE FIX V2
 * Astra + WooCommerce Classic Checkout + Stripe Express Checkout
 *
 */

/* =====================================================
   1. GENEL SAYFA VE TAM GENİŞLİK
===================================================== */

body.woocommerce-checkout {
    overflow-x: hidden !important;
    background: #ffffff !important;
}

body.woocommerce-checkout #secondary,
body.woocommerce-checkout .widget-area {
    display: none !important;
}

body.woocommerce-checkout #primary,
body.woocommerce-checkout .content-area,
body.woocommerce-checkout .site-main,
body.woocommerce-checkout .site-main > article,
body.woocommerce-checkout .entry-content {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 0 !important;
}

body.woocommerce-checkout .site-content > .ast-container,
body.woocommerce-checkout .site-content .ast-container {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 auto !important;
    padding-right: clamp(16px, 3vw, 48px) !important;
    padding-left: clamp(16px, 3vw, 48px) !important;
    box-sizing: border-box !important;
}

body.woocommerce-checkout .entry-content > .woocommerce {
    width: 100% !important;
    max-width: 1580px !important;
    margin: 0 auto !important;
    box-sizing: border-box !important;
}

/* =====================================================
   2. SAYFA BAŞLIĞI
===================================================== */

body.woocommerce-checkout .entry-header {
    width: 100% !important;
    max-width: 1580px !important;
    margin: 0 auto !important;
    padding: 28px 0 18px !important;
    border-bottom: 1px solid #d9dee6 !important;
}

body.woocommerce-checkout .entry-title {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #16233a !important;
    font-size: clamp(34px, 3vw, 48px) !important;
    font-weight: 600 !important;
    line-height: 1.1 !important;
}

body.woocommerce-checkout .entry-header::after,
body.woocommerce-checkout .entry-title::after {
    display: none !important;
    content: none !important;
}

/* =====================================================
   3. KUPON BİLDİRİMİ — İKON ÇAKIŞMASI DÜZELTME
===================================================== */

body.woocommerce-checkout .woocommerce-form-coupon-toggle,
body.woocommerce-checkout form.checkout_coupon {
    width: 100% !important;
    max-width: 1580px !important;
    margin-right: auto !important;
    margin-left: auto !important;
    box-sizing: border-box !important;
}

body.woocommerce-checkout .woocommerce-form-coupon-toggle {
    margin-top: 22px !important;
    margin-bottom: 18px !important;
}

body.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info {
    position: relative !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 20px 22px !important;
    background: #f7f7f8 !important;
    border: 1px solid #d9dee6 !important;
    border-left: 3px solid #c89a4b !important;
    color: #16233a !important;
    line-height: 1.45 !important;
    box-sizing: border-box !important;
}

/* Astra / WooCommerce bilgi ikonunu kaldır */
body.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info::before,
body.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info::after {
    display: none !important;
    content: none !important;
}

body.woocommerce-checkout form.checkout_coupon {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 12px !important;
    margin-top: 0 !important;
    margin-bottom: 26px !important;
    padding: 20px !important;
    background: #ffffff !important;
    border: 1px solid #d9dee6 !important;
}

body.woocommerce-checkout form.checkout_coupon p {
    width: 100% !important;
    margin: 0 !important;
}

body.woocommerce-checkout form.checkout_coupon .input-text {
    width: 100% !important;
    min-height: 48px !important;
    margin: 0 !important;
    box-sizing: border-box !important;
}

body.woocommerce-checkout form.checkout_coupon .button {
    min-height: 48px !important;
    margin: 0 !important;
    padding: 12px 26px !important;
    white-space: nowrap !important;
}

/* =====================================================
   4. STRIPE / GOOGLE PAY / LINK ALANI
===================================================== */

/* Bilinen Stripe express checkout kapsayıcıları */
body.woocommerce-checkout .wc-stripe-checkout-container,
body.woocommerce-checkout .wc-stripe-cart-checkout-container,
body.woocommerce-checkout .wc_stripe_checkout_banner_gateways,
body.woocommerce-checkout .wc-stripe-checkout-banner,
body.woocommerce-checkout .wc-stripe-express-checkout-element,
body.woocommerce-checkout #wc-stripe-express-checkout-element,
body.woocommerce-checkout .wcpay-express-checkout-wrapper,
body.woocommerce-checkout .wc-block-components-express-payment,
body.woocommerce-checkout .express-payment-methods,
body.woocommerce-checkout [class*="express-checkout"],
body.woocommerce-checkout [id*="express-checkout"] {
    width: 100% !important;
    max-width: 1580px !important;
    margin-right: auto !important;
    margin-left: auto !important;
    box-sizing: border-box !important;
}

/* Butonların bulunduğu satır */
body.woocommerce-checkout .wc_stripe_checkout_banner_gateways,
body.woocommerce-checkout .wc-stripe-checkout-banner,
body.woocommerce-checkout .wc-stripe-checkout-container,
body.woocommerce-checkout .wc-stripe-cart-checkout-container,
body.woocommerce-checkout .wcpay-express-checkout-wrapper,
body.woocommerce-checkout .express-payment-methods {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 16px !important;
    align-items: stretch !important;
    margin-top: 20px !important;
    margin-bottom: 22px !important;
    padding: 0 !important;
}

/* Her ödeme butonu tam sütun genişliği */
body.woocommerce-checkout .wc_stripe_checkout_banner_gateways > *,
body.woocommerce-checkout .wc-stripe-checkout-banner > *,
body.woocommerce-checkout .wc-stripe-checkout-container > *,
body.woocommerce-checkout .wc-stripe-cart-checkout-container > *,
body.woocommerce-checkout .wcpay-express-checkout-wrapper > *,
body.woocommerce-checkout .express-payment-methods > * {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    margin: 0 !important;
    box-sizing: border-box !important;
}

body.woocommerce-checkout .wc-stripe-checkout-container iframe,
body.woocommerce-checkout .wc-stripe-cart-checkout-container iframe,
body.woocommerce-checkout .wc_stripe_checkout_banner_gateways iframe,
body.woocommerce-checkout .wc-stripe-checkout-banner iframe,
body.woocommerce-checkout .wcpay-express-checkout-wrapper iframe,
body.woocommerce-checkout [class*="express-checkout"] iframe,
body.woocommerce-checkout [id*="express-checkout"] iframe {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

/* OR ayırıcısı */
body.woocommerce-checkout .wc-stripe-checkout-container .separator,
body.woocommerce-checkout .wc-stripe-cart-checkout-container .separator,
body.woocommerce-checkout .wc_stripe_checkout_banner_gateways .separator,
body.woocommerce-checkout .wc-stripe-checkout-banner .separator,
body.woocommerce-checkout .wcpay-express-checkout-wrapper .separator,
body.woocommerce-checkout [class*="express-checkout"] .separator,
body.woocommerce-checkout [class*="express-checkout"] [class*="divider"],
body.woocommerce-checkout [id*="express-checkout"] [class*="divider"] {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    margin: 14px 0 8px !important;
    text-align: center !important;
}

/* =====================================================
   5. CHECKOUT ANA GRID — ORDER İÇERİĞİ BAŞLIK ALTINDA
===================================================== */

body.woocommerce-checkout form.checkout {
    display: grid !important;
    grid-template-columns: minmax(0, 1.7fr) minmax(430px, 0.9fr) !important;
    grid-template-areas:
        "billing order-title"
        "billing order-review" !important;
    grid-template-rows: auto auto !important;
    column-gap: clamp(30px, 3vw, 56px) !important;
    row-gap: 0 !important;
    align-items: start !important;
    width: 100% !important;
    max-width: 1580px !important;
    margin: 0 auto !important;
    padding-top: 24px !important;
    padding-bottom: 70px !important;
    box-sizing: border-box !important;
}

body.woocommerce-checkout form.checkout > .col2-set {
    grid-area: billing !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
}

body.woocommerce-checkout form.checkout > #order_review_heading {
    grid-area: order-title !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
}

body.woocommerce-checkout form.checkout > #order_review {
    grid-area: order-review !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
}

/* Sticky kaldırıldı; içerik boş görünmesin */
body.woocommerce-checkout #order_review_heading,
body.woocommerce-checkout #order_review {
    position: static !important;
    top: auto !important;
    bottom: auto !important;
    transform: none !important;
}

body.woocommerce-checkout #order_review_heading {
    padding: 24px 26px !important;
    background: #fbfbfb !important;
    border: 1px solid #d9dee6 !important;
    border-bottom: 0 !important;
    color: #16233a !important;
    font-size: clamp(28px, 2.3vw, 36px) !important;
    font-weight: 600 !important;
    line-height: 1.15 !important;
    box-sizing: border-box !important;
}

body.woocommerce-checkout #order_review {
    border: 1px solid #d9dee6 !important;
    background: #ffffff !important;
    box-sizing: border-box !important;
}

/* =====================================================
   6. BILLING / SHIPPING FORM
===================================================== */

body.woocommerce-checkout .woocommerce-billing-fields > h3,
body.woocommerce-checkout .woocommerce-shipping-fields > h3,
body.woocommerce-checkout .woocommerce-additional-fields > h3 {
    margin: 0 0 20px !important;
    padding: 0 0 16px !important;
    border-bottom: 1px solid #d9dee6 !important;
    color: #16233a !important;
    font-size: clamp(27px, 2.2vw, 36px) !important;
    line-height: 1.15 !important;
}

body.woocommerce-checkout .woocommerce-billing-fields__field-wrapper,
body.woocommerce-checkout .woocommerce-shipping-fields__field-wrapper {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 16px 18px !important;
}

body.woocommerce-checkout .form-row {
    float: none !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
}

body.woocommerce-checkout .form-row-first,
body.woocommerce-checkout .form-row-last {
    width: 100% !important;
}

/* Tam satır alanlar */
body.woocommerce-checkout #billing_email_field,
body.woocommerce-checkout #billing_company_field,
body.woocommerce-checkout #billing_country_field,
body.woocommerce-checkout #billing_address_1_field,
body.woocommerce-checkout #billing_address_2_field,
body.woocommerce-checkout #billing_city_field,
body.woocommerce-checkout #billing_state_field,
body.woocommerce-checkout #billing_postcode_field,
body.woocommerce-checkout #billing_phone_field,
body.woocommerce-checkout #shipping_country_field,
body.woocommerce-checkout #shipping_address_1_field,
body.woocommerce-checkout #shipping_address_2_field,
body.woocommerce-checkout #shipping_city_field,
body.woocommerce-checkout #shipping_state_field,
body.woocommerce-checkout #shipping_postcode_field,
body.woocommerce-checkout .woocommerce-additional-fields {
    grid-column: 1 / -1 !important;
}

body.woocommerce-checkout .form-row label {
    display: block !important;
    margin: 0 0 7px !important;
    color: #16233a !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.35 !important;
}

body.woocommerce-checkout .form-row input.input-text,
body.woocommerce-checkout .form-row textarea,
body.woocommerce-checkout .form-row select,
body.woocommerce-checkout .select2-container .select2-selection--single {
    width: 100% !important;
    min-height: 48px !important;
    margin: 0 !important;
    padding: 11px 14px !important;
    background: #ffffff !important;
    border: 1px solid #ccd3dd !important;
    border-radius: 0 !important;
    color: #16233a !important;
    box-shadow: none !important;
    box-sizing: border-box !important;
}

body.woocommerce-checkout .form-row textarea {
    min-height: 130px !important;
    resize: vertical !important;
}

body.woocommerce-checkout .select2-container {
    width: 100% !important;
}

body.woocommerce-checkout .select2-container .select2-selection--single .select2-selection__rendered {
    padding: 0 !important;
    line-height: 24px !important;
}

body.woocommerce-checkout .select2-container .select2-selection--single .select2-selection__arrow {
    height: 46px !important;
}

/* =====================================================
   7. ORDER TABLE
===================================================== */

body.woocommerce-checkout #order_review table.shop_table {
    width: 100% !important;
    margin: 0 !important;
    table-layout: fixed !important;
    border-collapse: collapse !important;
}

body.woocommerce-checkout #order_review table.shop_table th,
body.woocommerce-checkout #order_review table.shop_table td {
    padding: 15px 18px !important;
    vertical-align: top !important;
    box-sizing: border-box !important;
}

body.woocommerce-checkout #order_review table.shop_table th.product-name,
body.woocommerce-checkout #order_review table.shop_table td.product-name {
    width: 72% !important;
    text-align: left !important;
    overflow-wrap: break-word !important;
    word-break: normal !important;
}

body.woocommerce-checkout #order_review table.shop_table th.product-total,
body.woocommerce-checkout #order_review table.shop_table td.product-total {
    width: 28% !important;
    text-align: right !important;
    white-space: nowrap !important;
}

body.woocommerce-checkout #order_review table.shop_table tfoot th {
    width: 38% !important;
    text-align: left !important;
}

body.woocommerce-checkout #order_review table.shop_table tfoot td {
    width: 62% !important;
    text-align: right !important;
}

/* =====================================================
   8. PAYMENT METHODS
===================================================== */

body.woocommerce-checkout #payment {
    margin: 0 !important;
    background: #ffffff !important;
    border-top: 1px solid #d9dee6 !important;
    border-radius: 0 !important;
}

body.woocommerce-checkout #payment ul.payment_methods {
    margin: 0 !important;
    padding: 18px !important;
    border-bottom: 1px solid #d9dee6 !important;
}

body.woocommerce-checkout #payment ul.payment_methods > li {
    margin: 0 0 12px !important;
    padding: 0 !important;
}

body.woocommerce-checkout #payment ul.payment_methods > li:last-child {
    margin-bottom: 0 !important;
}

body.woocommerce-checkout #payment ul.payment_methods input[type="radio"] {
    position: static !important;
    float: none !important;
    width: 16px !important;
    height: 16px !important;
    margin: 3px 8px 0 0 !important;
    appearance: auto !important;
    -webkit-appearance: radio !important;
    transform: none !important;
}

body.woocommerce-checkout #payment ul.payment_methods label {
    display: inline-flex !important;
    align-items: flex-start !important;
    margin: 0 !important;
    line-height: 1.4 !important;
}

body.woocommerce-checkout #payment .place-order {
    margin: 0 !important;
    padding: 20px !important;
}

body.woocommerce-checkout #payment #place_order {
    width: 100% !important;
    min-height: 52px !important;
    margin: 0 !important;
    padding: 14px 18px !important;
    box-sizing: border-box !important;
}

/* =====================================================
   9. TABLET
===================================================== */

@media screen and (max-width: 1179px) {
    body.woocommerce-checkout form.checkout {
        display: block !important;
        width: 100% !important;
        max-width: 1000px !important;
        margin: 0 auto !important;
    }

    body.woocommerce-checkout form.checkout > .col2-set,
    body.woocommerce-checkout form.checkout > #order_review_heading,
    body.woocommerce-checkout form.checkout > #order_review {
        width: 100% !important;
        margin-right: 0 !important;
        margin-left: 0 !important;
    }

    body.woocommerce-checkout #order_review_heading {
        margin-top: 34px !important;
    }
}

/* =====================================================
   10. MOBİL
===================================================== */

@media screen and (max-width: 767px) {
    body.woocommerce-checkout .site-content > .ast-container,
    body.woocommerce-checkout .site-content .ast-container {
        padding-right: 12px !important;
        padding-left: 12px !important;
    }

    body.woocommerce-checkout .woocommerce-billing-fields__field-wrapper,
    body.woocommerce-checkout .woocommerce-shipping-fields__field-wrapper {
        display: block !important;
    }

    body.woocommerce-checkout .form-row {
        margin-bottom: 14px !important;
    }

    body.woocommerce-checkout form.checkout_coupon {
        display: block !important;
    }

    body.woocommerce-checkout form.checkout_coupon .button {
        width: 100% !important;
        margin-top: 10px !important;
    }

    body.woocommerce-checkout .wc_stripe_checkout_banner_gateways,
    body.woocommerce-checkout .wc-stripe-checkout-banner,
    body.woocommerce-checkout .wc-stripe-checkout-container,
    body.woocommerce-checkout .wc-stripe-cart-checkout-container,
    body.woocommerce-checkout .wcpay-express-checkout-wrapper,
    body.woocommerce-checkout .express-payment-methods {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 12px !important;
    }

    body.woocommerce-checkout #order_review_heading {
        padding: 20px 16px !important;
        font-size: 28px !important;
    }

    body.woocommerce-checkout #order_review table.shop_table th,
    body.woocommerce-checkout #order_review table.shop_table td {
        padding: 13px 12px !important;
    }

    body.woocommerce-checkout #order_review table.shop_table th.product-name,
    body.woocommerce-checkout #order_review table.shop_table td.product-name {
        width: 68% !important;
    }

    body.woocommerce-checkout #order_review table.shop_table th.product-total,
    body.woocommerce-checkout #order_review table.shop_table td.product-total {
        width: 32% !important;
    }
}

/* =====================================================
   11. EXPRESS CHECKOUT KONUM DÜZELTMESİ
   Google Pay ve Link butonlarını checkout formunun
   en üstüne alır; Billing / Your order yapısını korur.
===================================================== */

/* Masaüstü checkout grid sırası */
@media screen and (min-width: 1180px) {

    body.woocommerce-checkout form.checkout {
        grid-template-columns: minmax(0, 1.7fr) minmax(430px, 0.9fr) !important;
        grid-template-areas:
            "express express"
            "separator separator"
            "billing order-title"
            "billing order-review" !important;
        grid-template-rows: auto auto auto auto !important;
        column-gap: clamp(30px, 3vw, 56px) !important;
        row-gap: 0 !important;
        align-items: start !important;
    }

    /* Google Pay + Link ana kapsayıcısı */
    body.woocommerce-checkout form.checkout > .wc_stripe_checkout_banner_gateways,
    body.woocommerce-checkout form.checkout > .wc-stripe-checkout-banner,
    body.woocommerce-checkout form.checkout > .wc-stripe-checkout-container,
    body.woocommerce-checkout form.checkout > .wc-stripe-cart-checkout-container,
    body.woocommerce-checkout form.checkout > .wc-stripe-express-checkout-element,
    body.woocommerce-checkout form.checkout > #wc-stripe-express-checkout-element,
    body.woocommerce-checkout form.checkout > .wcpay-express-checkout-wrapper,
    body.woocommerce-checkout form.checkout > .wc-block-components-express-payment,
    body.woocommerce-checkout form.checkout > .express-payment-methods {
        grid-area: express !important;
        grid-column: 1 / -1 !important;
        grid-row: 1 !important;

        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 16px !important;
        align-items: stretch !important;

        width: 100% !important;
        max-width: none !important;
        min-width: 0 !important;

        margin: 0 0 16px !important;
        padding: 0 !important;

        box-sizing: border-box !important;
    }

    /* Her express ödeme seçeneği */
    body.woocommerce-checkout form.checkout > .wc_stripe_checkout_banner_gateways > *,
    body.woocommerce-checkout form.checkout > .wc-stripe-checkout-banner > *,
    body.woocommerce-checkout form.checkout > .wc-stripe-checkout-container > *,
    body.woocommerce-checkout form.checkout > .wc-stripe-cart-checkout-container > *,
    body.woocommerce-checkout form.checkout > .wc-stripe-express-checkout-element > *,
    body.woocommerce-checkout form.checkout > #wc-stripe-express-checkout-element > *,
    body.woocommerce-checkout form.checkout > .wcpay-express-checkout-wrapper > *,
    body.woocommerce-checkout form.checkout > .wc-block-components-express-payment > *,
    body.woocommerce-checkout form.checkout > .express-payment-methods > * {
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        margin: 0 !important;
        box-sizing: border-box !important;
    }

    /* Ayrı DOM öğesi olarak gelen OR alanı */
    body.woocommerce-checkout form.checkout > .wc_stripe_checkout_banner_separator,
    body.woocommerce-checkout form.checkout > .wc-stripe-checkout-banner-separator,
    body.woocommerce-checkout form.checkout > .wc-stripe-express-checkout-separator,
    body.woocommerce-checkout form.checkout > .wc-stripe-checkout-separator,
    body.woocommerce-checkout form.checkout > .express-checkout-separator,
    body.woocommerce-checkout form.checkout > .express-payment-methods-separator {
        grid-area: separator !important;
        grid-column: 1 / -1 !important;
        grid-row: 2 !important;

        display: block !important;
        width: 100% !important;
        max-width: none !important;

        margin: 0 0 34px !important;
        padding: 0 !important;

        text-align: center !important;
        box-sizing: border-box !important;
    }

    /* Billing ve sipariş kutusunu express alanından sonra başlat */
    body.woocommerce-checkout form.checkout > .col2-set {
        grid-area: billing !important;
        grid-column: 1 !important;
        grid-row: 3 / span 2 !important;
    }

    body.woocommerce-checkout form.checkout > #order_review_heading {
        grid-area: order-title !important;
        grid-column: 2 !important;
        grid-row: 3 !important;
    }

    body.woocommerce-checkout form.checkout > #order_review {
        grid-area: order-review !important;
        grid-column: 2 !important;
        grid-row: 4 !important;
    }
}

/* Express butonlarının içindeki iframe / Stripe elemanları */
body.woocommerce-checkout form.checkout .wc_stripe_checkout_banner_gateways iframe,
body.woocommerce-checkout form.checkout .wc-stripe-checkout-banner iframe,
body.woocommerce-checkout form.checkout .wc-stripe-checkout-container iframe,
body.woocommerce-checkout form.checkout .wc-stripe-cart-checkout-container iframe,
body.woocommerce-checkout form.checkout .wc-stripe-express-checkout-element iframe,
body.woocommerce-checkout form.checkout #wc-stripe-express-checkout-element iframe,
body.woocommerce-checkout form.checkout .wcpay-express-checkout-wrapper iframe,
body.woocommerce-checkout form.checkout .wc-block-components-express-payment iframe,
body.woocommerce-checkout form.checkout .express-payment-methods iframe {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    box-sizing: border-box !important;
}

/* Kapsayıcının içinde bulunan OR alanı */
body.woocommerce-checkout form.checkout .wc_stripe_checkout_banner_gateways .separator,
body.woocommerce-checkout form.checkout .wc-stripe-checkout-banner .separator,
body.woocommerce-checkout form.checkout .wc-stripe-checkout-container .separator,
body.woocommerce-checkout form.checkout .wc-stripe-cart-checkout-container .separator,
body.woocommerce-checkout form.checkout .wc-stripe-express-checkout-element .separator,
body.woocommerce-checkout form.checkout #wc-stripe-express-checkout-element .separator,
body.woocommerce-checkout form.checkout .wcpay-express-checkout-wrapper .separator,
body.woocommerce-checkout form.checkout .express-payment-methods .separator,
body.woocommerce-checkout form.checkout [class*="express-checkout"] [class*="divider"] {
    grid-column: 1 / -1 !important;
    display: block !important;
    width: 100% !important;
    margin: 14px 0 18px !important;
    text-align: center !important;
}

/* =====================================================
   TABLET VE MOBİL EXPRESS CHECKOUT
===================================================== */

@media screen and (max-width: 1179px) {

    /* Form block yapıda kalır; express alanı ilk sıraya alınır */
    body.woocommerce-checkout form.checkout {
        display: flex !important;
        flex-direction: column !important;
    }

    body.woocommerce-checkout form.checkout > .wc_stripe_checkout_banner_gateways,
    body.woocommerce-checkout form.checkout > .wc-stripe-checkout-banner,
    body.woocommerce-checkout form.checkout > .wc-stripe-checkout-container,
    body.woocommerce-checkout form.checkout > .wc-stripe-cart-checkout-container,
    body.woocommerce-checkout form.checkout > .wc-stripe-express-checkout-element,
    body.woocommerce-checkout form.checkout > #wc-stripe-express-checkout-element,
    body.woocommerce-checkout form.checkout > .wcpay-express-checkout-wrapper,
    body.woocommerce-checkout form.checkout > .wc-block-components-express-payment,
    body.woocommerce-checkout form.checkout > .express-payment-methods {
        order: 1 !important;

        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 14px !important;

        width: 100% !important;
        max-width: none !important;
        margin: 0 0 14px !important;
        padding: 0 !important;
    }

    body.woocommerce-checkout form.checkout > .wc_stripe_checkout_banner_separator,
    body.woocommerce-checkout form.checkout > .wc-stripe-checkout-banner-separator,
    body.woocommerce-checkout form.checkout > .wc-stripe-express-checkout-separator,
    body.woocommerce-checkout form.checkout > .wc-stripe-checkout-separator,
    body.woocommerce-checkout form.checkout > .express-checkout-separator,
    body.woocommerce-checkout form.checkout > .express-payment-methods-separator {
        order: 2 !important;
        width: 100% !important;
        margin: 0 0 28px !important;
        text-align: center !important;
    }

    body.woocommerce-checkout form.checkout > .col2-set {
        order: 3 !important;
    }

    body.woocommerce-checkout form.checkout > #order_review_heading {
        order: 4 !important;
    }

    body.woocommerce-checkout form.checkout > #order_review {
        order: 5 !important;
    }
}

@media screen and (max-width: 767px) {

    body.woocommerce-checkout form.checkout > .wc_stripe_checkout_banner_gateways,
    body.woocommerce-checkout form.checkout > .wc-stripe-checkout-banner,
    body.woocommerce-checkout form.checkout > .wc-stripe-checkout-container,
    body.woocommerce-checkout form.checkout > .wc-stripe-cart-checkout-container,
    body.woocommerce-checkout form.checkout > .wc-stripe-express-checkout-element,
    body.woocommerce-checkout form.checkout > #wc-stripe-express-checkout-element,
    body.woocommerce-checkout form.checkout > .wcpay-express-checkout-wrapper,
    body.woocommerce-checkout form.checkout > .wc-block-components-express-payment,
    body.woocommerce-checkout form.checkout > .express-payment-methods {
        grid-template-columns: 1fr !important;
        gap: 12px !important;
    }
}

/* =====================================================
   12. CART SAYFASIYLA AYNI GÖRSEL DİL
   Checkout alanını tek bir sayfa/panel gibi gösterir.
===================================================== */

body.woocommerce-checkout {
    --mbs-page-bg: #eef4fa;
    --mbs-panel-bg: #ffffff;
    --mbs-soft-bg: #fbfbfb;
    --mbs-border: #d9dee6;
    --mbs-text: #16233a;
    --mbs-muted: #6f7887;

    background: var(--mbs-page-bg) !important;
    color: var(--mbs-text) !important;
}

/* Header altındaki açık gri sayfa zemini */
body.woocommerce-checkout .site-content {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 0 34px !important;
    background: var(--mbs-page-bg) !important;
}

/* Cart sayfasındaki gibi tek, geniş ve beyaz ana panel */
body.woocommerce-checkout .site-content > .ast-container {
    display: block !important;
    width: calc(100% - 96px) !important;
    max-width: 1740px !important;
    min-width: 0 !important;

    margin: 0 auto !important;
    padding: 48px 52px 70px !important;

    background: var(--mbs-panel-bg) !important;
    box-sizing: border-box !important;
}

/* Checkout içindeki tüm içerik aynı ana panel genişliğini kullansın */
body.woocommerce-checkout .entry-header,
body.woocommerce-checkout .entry-content,
body.woocommerce-checkout .entry-content > .woocommerce,
body.woocommerce-checkout .woocommerce-form-coupon-toggle,
body.woocommerce-checkout form.checkout_coupon,
body.woocommerce-checkout form.checkout,
body.woocommerce-checkout form.woocommerce-checkout {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    margin-right: 0 !important;
    margin-left: 0 !important;
    box-sizing: border-box !important;
}

/* Sayfa başlığı cart başlığıyla aynı konumda */
body.woocommerce-checkout .entry-header {
    margin: 0 !important;
    padding: 0 0 34px !important;
    border: 0 !important;
    background: transparent !important;
}

body.woocommerce-checkout .entry-title {
    margin: 0 !important;
    padding: 0 !important;
    color: var(--mbs-text) !important;
    font-size: clamp(34px, 3vw, 48px) !important;
    font-weight: 600 !important;
    line-height: 1.1 !important;
}

/* Kupon alanını ana panel içinde, kontrollü bir şerit olarak tut */
body.woocommerce-checkout .woocommerce-form-coupon-toggle {
    margin: 0 0 12px !important;
}

body.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info {
    margin: 0 !important;
    padding: 17px 20px !important;

    background: #f7f7f8 !important;
    color: var(--mbs-text) !important;

    border: 1px solid var(--mbs-border) !important;
    border-left: 3px solid #c89a4b !important;
    box-sizing: border-box !important;
}

body.woocommerce-checkout form.checkout_coupon {
    margin: 0 0 24px !important;
    padding: 16px 18px !important;

    background: var(--mbs-panel-bg) !important;
    border: 1px solid var(--mbs-border) !important;
    box-sizing: border-box !important;
}

/* Express ödeme alanı da aynı içerik genişliğinde */
body.woocommerce-checkout .wc_stripe_checkout_banner_gateways,
body.woocommerce-checkout .wc-stripe-checkout-banner,
body.woocommerce-checkout .wc-stripe-checkout-container,
body.woocommerce-checkout .wc-stripe-cart-checkout-container,
body.woocommerce-checkout .wc-stripe-express-checkout-element,
body.woocommerce-checkout #wc-stripe-express-checkout-element,
body.woocommerce-checkout .wcpay-express-checkout-wrapper,
body.woocommerce-checkout .wc-block-components-express-payment,
body.woocommerce-checkout .express-payment-methods {
    width: 100% !important;
    max-width: none !important;
}

/* Billing ve order bölümlerini cart sayfasındaki oranlara yaklaştır */
@media screen and (min-width: 1180px) {
    body.woocommerce-checkout form.checkout,
    body.woocommerce-checkout form.woocommerce-checkout {
        grid-template-columns: minmax(0, 2.05fr) minmax(410px, 0.95fr) !important;
        column-gap: clamp(30px, 2.7vw, 44px) !important;
        padding-top: 30px !important;
        padding-bottom: 0 !important;
    }
}

/* Billing alanı ayrı bir sayfa gibi görünmesin */
body.woocommerce-checkout form.checkout > .col2-set {
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

body.woocommerce-checkout .woocommerce-billing-fields,
body.woocommerce-checkout .woocommerce-shipping-fields,
body.woocommerce-checkout .woocommerce-additional-fields {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

body.woocommerce-checkout .woocommerce-billing-fields > h3,
body.woocommerce-checkout .woocommerce-shipping-fields > h3,
body.woocommerce-checkout .woocommerce-additional-fields > h3 {
    margin: 0 0 22px !important;
    padding: 0 0 18px !important;

    color: var(--mbs-text) !important;
    background: transparent !important;

    border: 0 !important;
    border-bottom: 1px solid var(--mbs-border) !important;

    font-size: clamp(28px, 2.2vw, 36px) !important;
    font-weight: 600 !important;
    line-height: 1.15 !important;
}

/* Form alanları cart tablosundaki temiz çizgi stiline yaklaştır */
body.woocommerce-checkout .form-row input.input-text,
body.woocommerce-checkout .form-row textarea,
body.woocommerce-checkout .form-row select,
body.woocommerce-checkout .select2-container .select2-selection--single {
    min-height: 48px !important;

    background: #ffffff !important;
    color: var(--mbs-text) !important;

    border: 1px solid #ccd3dd !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

body.woocommerce-checkout .form-row input.input-text:focus,
body.woocommerce-checkout .form-row textarea:focus,
body.woocommerce-checkout .form-row select:focus,
body.woocommerce-checkout .select2-container--focus .select2-selection--single {
    outline: 0 !important;
    border-color: #8e9baa !important;
    box-shadow: 0 0 0 1px #8e9baa !important;
}

/* Your order başlığı ve içeriği tek bir kart gibi görünür */
body.woocommerce-checkout #order_review_heading {
    margin: 0 !important;
    padding: 27px 28px !important;

    background: var(--mbs-soft-bg) !important;
    color: var(--mbs-text) !important;

    border: 1px solid var(--mbs-border) !important;
    border-bottom: 0 !important;

    font-size: clamp(31px, 2.4vw, 40px) !important;
    font-weight: 600 !important;
    line-height: 1.15 !important;

    box-sizing: border-box !important;
}

body.woocommerce-checkout #order_review {
    margin: 0 !important;
    padding: 0 !important;

    background: var(--mbs-panel-bg) !important;

    border: 1px solid var(--mbs-border) !important;
    border-top: 0 !important;

    box-shadow: none !important;
    box-sizing: border-box !important;
}

/* Sipariş tablosu ve ödeme alanı aynı kart içinde devam etsin */
body.woocommerce-checkout #order_review table.shop_table {
    margin: 0 !important;
    border: 0 !important;
    border-collapse: collapse !important;
    background: transparent !important;
}

body.woocommerce-checkout #order_review table.shop_table th,
body.woocommerce-checkout #order_review table.shop_table td {
    border-color: var(--mbs-border) !important;
}

body.woocommerce-checkout #payment {
    margin: 0 !important;
    padding: 0 !important;

    background: #ffffff !important;

    border: 0 !important;
    border-top: 1px solid var(--mbs-border) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

body.woocommerce-checkout #payment ul.payment_methods {
    margin: 0 !important;
    padding: 20px !important;
    background: #ffffff !important;
    border-bottom: 1px solid var(--mbs-border) !important;
}

body.woocommerce-checkout #payment .payment_box {
    margin: 12px 0 0 !important;
    padding: 16px !important;

    background: #f5f6f7 !important;
    border: 1px solid var(--mbs-border) !important;
    border-radius: 0 !important;
}

body.woocommerce-checkout #payment .payment_box::before {
    display: none !important;
    content: none !important;
}

body.woocommerce-checkout #payment .place-order {
    margin: 0 !important;
    padding: 22px !important;
    background: #ffffff !important;
}

body.woocommerce-checkout #payment #place_order {
    width: 100% !important;
    min-height: 52px !important;
    margin: 0 !important;

    background: #ffffff !important;
    color: #111111 !important;

    border: 1px solid #111111 !important;
    border-radius: 0 !important;

    font-weight: 500 !important;
    box-shadow: none !important;
}

body.woocommerce-checkout #payment #place_order:hover {
    background: #111111 !important;
    color: #ffffff !important;
}

/* Sağ kutu fazla aşağı uzarsa masaüstünde üstten hizalı kalsın */
@media screen and (min-width: 1180px) {
    body.woocommerce-checkout form.checkout > #order_review_heading,
    body.woocommerce-checkout form.checkout > #order_review {
        align-self: start !important;
    }
}

/* =====================================================
   TABLET
===================================================== */

@media screen and (max-width: 1179px) {
    body.woocommerce-checkout .site-content {
        padding-bottom: 24px !important;
    }

    body.woocommerce-checkout .site-content > .ast-container {
        width: calc(100% - 48px) !important;
        padding: 38px 34px 54px !important;
    }

    body.woocommerce-checkout form.checkout,
    body.woocommerce-checkout form.woocommerce-checkout {
        padding-top: 26px !important;
        padding-bottom: 0 !important;
    }

    body.woocommerce-checkout #order_review_heading {
        margin-top: 34px !important;
    }
}

/* =====================================================
   MOBİL
===================================================== */

@media screen and (max-width: 767px) {
    body.woocommerce-checkout .site-content {
        padding-bottom: 0 !important;
        background: #ffffff !important;
    }

    body.woocommerce-checkout .site-content > .ast-container {
        width: 100% !important;
        max-width: none !important;
        margin: 0 !important;
        padding: 28px 14px 42px !important;
        background: #ffffff !important;
    }

    body.woocommerce-checkout .entry-header {
        padding-bottom: 26px !important;
    }

    body.woocommerce-checkout form.checkout_coupon {
        padding: 14px !important;
    }

    body.woocommerce-checkout #order_review_heading {
        padding: 21px 16px !important;
        font-size: 28px !important;
    }

    body.woocommerce-checkout #payment ul.payment_methods,
    body.woocommerce-checkout #payment .place-order {
        padding: 16px !important;
    }
}

/* Çok küçük telefonlar */
@media screen and (max-width: 420px) {
    body.woocommerce-checkout .site-content > .ast-container {
        padding-right: 10px !important;
        padding-left: 10px !important;
    }

    body.woocommerce-checkout .entry-title {
        font-size: 32px !important;
    }
}

