/*
Theme Name: Sober Child Theme
Theme URI: http://uix.store/sober/
Author: UIX Themes
Author URI: http://uix.store
Description: Sober is a fully responsive Premium WordPress Theme with a pixel perfect design and extensive functionality
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: sober
Tags: one-column, two-columns, right-sidebar, custom-colors, custom-menu, featured-images, flexible-header, microformats, post-formats, rtl-language-support, sticky-post, threaded-comments, translation-ready
Template: sober
*/

/* =============================================================
   SINGLE PRODUCT — TWO-COLUMN LAYOUT
   ACTUAL DOM:
     div.product.layout-style-4
       div.product-summary.clearfix
         div.summary.entry-summary   ← THIS is the flex container
           h1.product_title
           div.images                ← gallery (Sober JS places it here)
           div.short-description
           p.price / form.cart / product_meta
       section.related.products      ← direct child, full-width below
       div.woocommerce-tabs          ← direct child, full-width below
   ============================================================= */

/* Show gallery immediately — no OWL opacity flash */
div.product.layout-style-4 .woocommerce-product-gallery {
    opacity: 1 !important;
    transition: none !important;
}

/* Mobile: column layout — title → gallery → price → buttons → highlights */
@media (max-width: 1023px) {
    div.product.layout-style-4 .summary.entry-summary {
        display: flex !important;
        flex-direction: column !important;
    }
    div.product.layout-style-4 .summary.entry-summary .product_title                                  { order: 1 !important; margin-bottom: 12px !important; }
    div.product.layout-style-4 .summary.entry-summary .images                                         { order: 2 !important; width: 100% !important; margin: 0 0 12px !important; }
    div.product.layout-style-4 .summary.entry-summary .price                                          { order: 3 !important; margin-bottom: 12px !important; }
    div.product.layout-style-4 .summary.entry-summary form.cart                                       { order: 4 !important; }
    div.product.layout-style-4 .summary.entry-summary .woocommerce-product-details__short-description { order: 5 !important; }
    div.product.layout-style-4 .summary.entry-summary .product_meta                                   { order: 6 !important; }
}

/* Mobile title and price font sizes */
@media (max-width: 900px) {
    .single-product .product_title {
        font-size: 19px !important;
        line-height: 1.3 !important;
        margin-bottom: 8px !important;
    }

    .single-product .price {
        font-size: 16px !important;
    }
}

/* Short description styled as product highlights (Amazon-style) */
@media (max-width: 900px) {
    .single-product .woocommerce-product-details__short-description {
        margin-top: 20px !important;
        padding-top: 16px !important;
        border-top: 1px solid #e5e5e5 !important;
    }

    .single-product .woocommerce-product-details__short-description::before {
        content: "Product Highlights" !important;
        display: block !important;
        font-size: 13px !important;
        font-weight: 600 !important;
        text-transform: uppercase !important;
        letter-spacing: 0.08em !important;
        margin-bottom: 10px !important;
        color: #222 !important;
    }

    .single-product .woocommerce-product-details__short-description p,
    .single-product .woocommerce-product-details__short-description ul {
        font-size: 13px !important;
        line-height: 1.6 !important;
        color: #444 !important;
        margin: 0 !important;
    }

    .single-product .woocommerce-product-details__short-description ul {
        padding-left: 0 !important;
        list-style: none !important;
    }

    .single-product .woocommerce-product-details__short-description ul li::before {
        content: "✓ " !important;
        color: #222 !important;
        font-weight: 600 !important;
    }
}

/* Fix mobile gallery — 1:1 square crop + prevent blank space */
@media (max-width: 900px) {
    div.product.layout-style-4 .woocommerce-product-gallery,
    div.product.layout-style-4 .images {
        position: relative !important;
    }

    div.product.layout-style-4 .woocommerce-product-gallery__wrapper {
        overflow: hidden !important;
        aspect-ratio: 1 / 1 !important;
    }

    div.product.layout-style-4 .woocommerce-product-gallery__image {
        aspect-ratio: 1 / 1 !important;
        overflow: hidden !important;
    }

    div.product.layout-style-4 .woocommerce-product-gallery__image img {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
        aspect-ratio: 1 / 1 !important;
    }

    /* Video — constrain to 1:1 to match image slides, no more blank space */
    div.product.layout-style-4 .sober-product-video,
    div.product.layout-style-4 .woocommerce-product-gallery__video {
        aspect-ratio: 1 / 1 !important;
        overflow: hidden !important;
        height: auto !important;
    }

    div.product.layout-style-4 .sober-product-video iframe,
    div.product.layout-style-4 .woocommerce-product-gallery__video iframe {
        width: 100% !important;
        height: 100% !important;
    }

    /* Ensure slider doesn't leave empty white block */
    div.product.layout-style-4 .woocommerce-product-gallery__slider {
        min-height: unset !important;
    }

}

/* =============================================================
   BUY NOW BUTTON
   All screens: qty + ATC + Buy Now in one row
   ============================================================= */

/* Simple products — one row: qty + ATC + Buy Now */
.single-product form.cart:not(.variations_form) {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    gap: 8px !important;
}

/* Variable products — column: variation dropdown, then qty+buttons row */
.single-product form.variations_form.cart {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
}

/* The qty+ATC+BuyNow row inside variable product form */
.single-product .woocommerce-variation-add-to-cart {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    gap: 8px !important;
}

.single-product form.cart .quantity,
.single-product .woocommerce-variation-add-to-cart .quantity {
    flex: 0 0 auto !important;
    margin: 0 !important;
}

/* Equal-width buttons — flex-basis 0 so both grow from same starting point */
.single-product form.cart .single_add_to_cart_button:not(.irasin-buy-now),
.single-product .woocommerce-variation-add-to-cart .single_add_to_cart_button:not(.irasin-buy-now) {
    flex: 1 1 0 !important;
    margin: 0 !important;
    white-space: nowrap !important;
    min-width: 0 !important;
    height: 52px !important;
    line-height: 52px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.single-product .irasin-buy-now.button {
    flex: 1 1 0 !important;
    margin: 0 !important;
    white-space: nowrap !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 0 !important;
    height: 52px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

/* Hide category/brand meta — info belongs in product description */
.single-product .product_meta {
    display: none !important;
}

/* =============================================================
   VARIABLE PRODUCT — variation selector as dropdown on mobile
   ============================================================= */
@media (max-width: 900px) {
    /* Hide only the swatch list items inside WCBoost — keep the container so select is accessible */
    .single-product .wcboost-variation-swatches > *:not(select) {
        display: none !important;
    }

    /* Show the underlying native select inside the WCBoost container */
    .single-product .wcboost-variation-swatches select,
    .single-product .variations select {
        display: block !important;
        width: auto !important;
        min-width: 80px !important;
        max-width: 180px !important;
        height: 36px !important;
        padding: 0 8px !important;
        font-size: 13px !important;
        border: 1px solid #aaa !important;
        border-radius: 4px !important;
        background: #fff !important;
        appearance: auto !important;
        -webkit-appearance: auto !important;
        margin-bottom: 0 !important;
    }

    /* Variation label text — inline with select */
    .single-product .variations .label label {
        display: inline !important;
        font-size: 13px !important;
        font-weight: 600 !important;
        text-transform: uppercase !important;
        letter-spacing: 0.04em !important;
        color: #222 !important;
        margin: 0 !important;
        vertical-align: middle !important;
    }

    /* Clean up spacing around the variations block */
    .single-product .variations {
        margin-bottom: 12px !important;
    }

    /* Variation row: label + select side by side, tight together */
    .single-product .variable-options {
        display: flex !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 8px !important;
        width: 100% !important;
    }

    .single-product .variable-options .label {
        flex: 0 0 auto !important;
        float: none !important;
        width: auto !important;
        padding: 0 !important;
        white-space: nowrap !important;
        vertical-align: middle !important;
        line-height: 1 !important;
    }

    .single-product .variable-options .label label {
        vertical-align: middle !important;
        line-height: 36px !important;
        display: inline-block !important;
    }

    .single-product .variable-options .value {
        flex: 0 0 auto !important;
        float: none !important;
        width: auto !important;
        padding: 0 !important;
    }

    /* Hide the clear link — takes up space */
    .single-product .reset_variations {
        display: none !important;
    }
}

/* Sticky add-to-cart bar — removed (main buttons are always visible, bar was duplicate) */
.sticky-cart-form {
    display: none !important;
}

/* =============================================================
   MOBILE PRODUCT PAGE — slim header (hide logo, keep nav + cart)
   ============================================================= */
@media (max-width: 900px) {
    .single-product .site-header {
        padding-top: 8px !important;
        padding-bottom: 8px !important;
    }

    .single-product .site-branding {
        display: none !important;
    }

    /* Expand nav and icons to fill space left by hidden logo */
    .single-product .site-header .main-navigation {
        width: 50% !important;
    }

    .single-product .site-header .header-icon {
        width: 50% !important;
        text-align: right !important;
    }
}

/* =============================================================
   MOBILE GALLERY — image counter badge + thumbnail strip
   ============================================================= */

/* Owl carousel dots — make visible and styled on mobile product gallery */
@media (max-width: 900px) {
    .single-product .images .owl-dots {
        display: flex !important;
        justify-content: center !important;
        gap: 6px !important;
        padding: 8px 0 4px !important;
    }

    .single-product .images .owl-dot {
        width: 8px !important;
        height: 8px !important;
        border-radius: 50% !important;
        background: #ccc !important;
        border: none !important;
        padding: 0 !important;
        transition: background 0.2s !important;
    }

    .single-product .images .owl-dot span {
        display: none !important;
    }

    .single-product .images .owl-dot.active {
        background: #222 !important;
        width: 20px !important;
        border-radius: 4px !important;
    }
}

/* Counter badge — bottom-right of main image */
.irasin-img-counter {
    position: absolute !important;
    bottom: 12px !important;
    right: 12px !important;
    background: rgba(0,0,0,0.55) !important;
    color: #fff !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    padding: 3px 8px !important;
    border-radius: 20px !important;
    pointer-events: none !important;
    z-index: 10 !important;
    letter-spacing: 0.04em !important;
}

/* Thumbnail strip — hidden for now, using counter-only option */
.irasin-thumb-strip {
    display: none !important;
}

/* Video tap-to-play overlay — prevents iframe stealing touch/swipe events */
.irasin-video-overlay {
    position: absolute !important;
    inset: 0 !important;
    background: rgba(0,0,0,0.35) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    z-index: 10 !important;
}

.irasin-play-btn {
    width: 60px !important;
    height: 60px !important;
    background: rgba(255,255,255,0.9) !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 22px !important;
    color: #222 !important;
    padding-left: 4px !important;
}

/* Quantity select dropdown — replaces +/- widget */
.single-product select.irasin-qty-select {
    display: inline-flex !important;
    align-items: center !important;
    height: 52px !important;
    padding: 0 8px !important;
    font-size: 15px !important;
    border: 1px solid #222 !important;
    background: #fff !important;
    cursor: pointer !important;
    flex: 0 0 auto !important;
    appearance: auto !important;
    -webkit-appearance: auto !important;
    min-width: 60px !important;
    max-width: 80px !important;
}

/* Mobile: shrink quantity box + override theme min-width so all 3 fit on one row */
@media (max-width: 767px) {
    .single-product form.cart .quantity,
    .single-product .woocommerce-variation-add-to-cart .quantity {
        width: 90px !important;
        min-width: 90px !important;
        max-width: 90px !important;
    }

    .single-product form.cart .quantity .qty {
        width: 100% !important;
        min-width: unset !important;
    }

    /* Ensure equal-width holds on mobile too (already set globally above) */

    .single-product form.cart .button {
        font-size: 13px !important;
        padding-left: 12px !important;
        padding-right: 12px !important;
    }
}

@media (max-width: 400px) {
    .single-product form.cart .quantity {
        width: 76px !important;
        min-width: 76px !important;
        max-width: 76px !important;
    }

    .single-product form.cart .button {
        font-size: 12px !important;
        padding-left: 8px !important;
        padding-right: 8px !important;
    }
}

/* =============================================================
   HIDE WISHLIST & COMPARE ON SINGLE PRODUCT
   ============================================================= */

.wcboost-wishlist-button.wcboost-wishlist-single-button,
.single-product .wcboost-wishlist-button,
.wcboost-products-compare-button.wcboost-products-compare-button--single,
.single-product .wcboost-products-compare-button,
.product-quickview .wcboost-wishlist-button,
.product-quickview .wcboost-products-compare-button {
    display: none !important;
    visibility: hidden !important;
}

/* =============================================================
   QUICK VIEW — side-by-side buttons, no overlap
   ============================================================= */

.product-quickview form.cart {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 8px !important;
}

.product-quickview form.cart .quantity {
    flex: 0 0 auto !important;
    width: auto !important;
}

.product-quickview form.cart .single_add_to_cart_button:not(.irasin-buy-now) {
    flex: 1 1 auto !important;
    margin: 0 !important;
}

.product-quickview .irasin-buy-now.button {
    flex: 1 1 auto !important;
    margin: 0 !important;
}

/* Share buttons removed via PHP hook — hide any remnant container */
.single-product .product-share {
    display: none !important;
}

/* =============================================================
   RELATED PRODUCTS — above tabs, 4→2 col grid
   ============================================================= */

.single-product .related.products {
    margin-bottom: 40px;
}

.single-product .related.products > h2 {
    font-size: 16px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    margin-bottom: 20px;
}

@media (max-width: 767px) {
    .single-product .related.products > h2 {
        font-size: 14px;
    }
}

/* =============================================================
   PRODUCT GRID (SHOP + HOME) — 4→3→2 columns
   Exclude owl carousels (related products on single product page)
   ============================================================= */

/* Apply grid only on shop/archive pages, not on single product carousels */
.woocommerce:not(.single-product) ul.products:not(.owl-carousel),
.woocommerce-page:not(.single-product) ul.products:not(.owl-carousel) {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 24px !important;
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

@media (max-width: 1024px) {
    .woocommerce:not(.single-product) ul.products:not(.owl-carousel),
    .woocommerce-page:not(.single-product) ul.products:not(.owl-carousel) {
        grid-template-columns: repeat(3, 1fr) !important;
    }
}

@media (max-width: 767px) {
    .woocommerce:not(.single-product) ul.products:not(.owl-carousel),
    .woocommerce-page:not(.single-product) ul.products:not(.owl-carousel) {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 12px !important;
    }
}

.woocommerce ul.products:not(.owl-carousel) li.product {
    margin: 0 !important;
    float: none !important;
    width: auto !important;
}

.woocommerce ul.products li.product a img {
    width: 100%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    display: block;
}

.woocommerce ul.products li.product .woocommerce-loop-product__title {
    font-size: 14px;
    line-height: 1.4;
    margin: 8px 0 4px;
}

@media (max-width: 767px) {
    .woocommerce ul.products li.product .woocommerce-loop-product__title {
        font-size: 13px;
    }

    .woocommerce ul.products li.product .price {
        font-size: 13px;
    }
}

/* Desktop reinforcement: direct selector, no body-class dependency (1024px+) */
@media (min-width: 1024px) {
    ul.products.columns-4:not(.owl-carousel),
    ul.products.columns-3:not(.owl-carousel) {
        display: grid !important;
        grid-template-columns: repeat(4, 1fr) !important;
        gap: 24px !important;
        list-style: none !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    ul.products:not(.owl-carousel) li.product {
        margin: 0 !important;
        float: none !important;
        width: auto !important;
        max-width: none !important;
        clear: none !important;
    }
}

/* =============================================================
   DESKTOP — SINGLE PRODUCT TWO-COLUMN LAYOUT (900px+)
   50:50 grid is applied via wp_add_inline_style in functions.php
   so it renders in <head> before any JS runs (prevents layout flash).
   CSS here handles gallery sizing, OWL polish, and caption hiding.
   ============================================================= */

@media (min-width: 900px) {
    /* 1:1 image container — OWL internals fill it */
    .single-product .product-summary.clearfix > .images {
        aspect-ratio: 1 / 1 !important;
        overflow: hidden !important;
    }
    .single-product .product-summary.clearfix > .images .owl-stage-outer {
        height: 100% !important;
        overflow: hidden !important;
    }
    .single-product .product-summary.clearfix > .images .owl-stage,
    .single-product .product-summary.clearfix > .images .owl-item {
        height: 100% !important;
    }
    .single-product .product-summary.clearfix > .images .owl-item img {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
        display: block !important;
    }

    /* Hide image captions / alt-text labels */
    .single-product .images .caption,
    .single-product .images figcaption,
    .single-product .woocommerce-product-gallery .caption {
        display: none !important;
    }

    /* OWL nav arrows — small white circles, centred vertically */
    .single-product .images .owl-nav button.owl-prev,
    .single-product .images .owl-nav button.owl-next {
        position: absolute !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        width: 40px !important;
        height: 40px !important;
        background: rgba(255,255,255,0.85) !important;
        border-radius: 50% !important;
        border: none !important;
        box-shadow: 0 2px 8px rgba(0,0,0,0.18) !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        font-size: 18px !important;
        color: #222 !important;
        cursor: pointer !important;
        z-index: 10 !important;
        padding: 0 !important;
    }
    .single-product .images .owl-nav button.owl-prev { left: 10px !important; }
    .single-product .images .owl-nav button.owl-next { right: 10px !important; }
    .single-product .images .owl-nav button:hover {
        background: #fff !important;
        box-shadow: 0 3px 12px rgba(0,0,0,0.25) !important;
    }

    /* OWL pagination dots */
    .single-product .images .owl-dots {
        display: flex !important;
        justify-content: center !important;
        gap: 6px !important;
        padding: 10px 0 6px !important;
    }
    .single-product .images .owl-dot span {
        display: block !important;
        width: 8px !important;
        height: 8px !important;
        border-radius: 50% !important;
        background: #ccc !important;
        transition: background 0.2s !important;
    }
    .single-product .images .owl-dot.active span {
        background: #222 !important;
        width: 20px !important;
        border-radius: 4px !important;
    }
}

/* =============================================================
   PRICE — sale price same size as original, current price bold
   ============================================================= */

.single-product .price {
    font-size: inherit !important;
}

/* Both del (original) and ins (sale) the same size; ins bold */
.single-product .price del,
.single-product .price ins {
    font-size: 1em !important;
}

.single-product .price ins {
    font-weight: 700 !important;
    text-decoration: none !important;
}

/* =============================================================
   DISCOUNT BADGE — inside top-left of product image
   ============================================================= */

/* Badge moved inside .images by JS — position top-left of the photo */
@media (max-width: 900px) {
    .single-product .images {
        position: relative !important;
    }

    .single-product .images .ribbons.woocommerce-badges {
        position: absolute !important;
        top: 10px !important;
        left: 10px !important;
        z-index: 20 !important;
        margin: 0 !important;
    }

    .single-product .images .ribbons.woocommerce-badges .onsale {
        font-size: 13px !important;
        font-weight: 700 !important;
        min-width: 48px !important;
        min-height: 48px !important;
        line-height: 48px !important;
        border-radius: 50% !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }
}

/* =============================================================
   MOBILE — general touch/readability
   ============================================================= */

@media (max-width: 767px) {
    .single-product .product_title {
        font-size: 19px;
        line-height: 1.3;
    }

    .single-product .price {
        font-size: 16px;
    }

    .quantity .qty {
        height: 44px;
        font-size: 16px;
    }

    .woocommerce-tabs .tabs li a {
        font-size: 13px;
        padding: 10px 12px;
    }
}

/* =============================================================
   CART ICON COUNT BADGE
   Hidden by default; JS adds .irasin-badge-active when count > 0.
   Positioning parent: a.cart-contents (position:relative below).
   ============================================================= */
li.menu-item-cart,
li.shopping-cart-link {
    position: relative !important;
    overflow: visible !important;
}

a.cart-contents {
    position: relative !important;
    overflow: visible !important;
}

span.count.cart-counter {
    display: none !important;
}

span.count.cart-counter.irasin-badge-active {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    position: absolute !important;
    top: -6px !important;
    right: -8px !important;
    margin: 0 !important;
    min-width: 18px !important;
    height: 18px !important;
    padding: 0 4px !important;
    line-height: 1 !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    background: #cc0000 !important;
    color: #fff !important;
    border-radius: 9px !important;
    text-align: center !important;
    z-index: 100 !important;
    pointer-events: none !important;
}

/* =============================================================
   CHECKOUT PILL (Part A)
   Small green pill next to mobile cart icon; JS shows/hides.
   ============================================================= */
a.irasin-header-pill {
    display: none;
    align-items: center;
    background: #1D9E75;
    color: #fff !important;
    font-size: 11px;
    font-weight: 700;
    line-height: 1;
    padding: 5px 10px;
    border-radius: 20px;
    text-decoration: none !important;
    white-space: nowrap;
    margin-left: 6px;
    vertical-align: middle;
    transition: opacity 0.15s;
}

a.irasin-header-pill.irasin-pill-visible {
    display: inline-flex;
}

/* =============================================================
   ATC NUDGE BAR (Part B)
   Full-width fixed bar below header; slides in/out via JS.
   ============================================================= */
#irasin-nudge-bar {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 9980;
    background: #fff;
    border-bottom: 2px solid #1D9E75;
    box-shadow: 0 3px 12px rgba(0,0,0,0.12);
    display: none;
}

.irasin-nudge-bar-inner {
    padding: 10px 16px 12px;
    max-width: 600px;
    margin: 0 auto;
}

.irasin-nudge-bar-top {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
}

.irasin-nudge-bar-check {
    width: 24px;
    height: 24px;
    background: #1D9E75;
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    font-weight: 700;
    flex-shrink: 0;
}

.irasin-nudge-bar-info {
    flex: 1;
    min-width: 0;
    line-height: 1.3;
}

.irasin-nudge-bar-title {
    display: block;
    font-size: 13px;
    font-weight: 700;
    color: #1a1a1a;
}

.irasin-nudge-bar-product {
    display: block;
    font-size: 12px;
    color: #555;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.irasin-nudge-bar-actions {
    display: flex;
    gap: 8px;
}

.irasin-nudge-bar-continue,
.irasin-nudge-bar-checkout {
    flex: 1;
    min-height: 44px;
    padding: 0 10px;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 600;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    text-decoration: none !important;
    box-sizing: border-box;
}

.irasin-nudge-bar-continue {
    border: 1px solid #ccc;
    background: #fff;
    color: #333;
}

.irasin-nudge-bar-checkout {
    border: none;
    background: #1D9E75;
    color: #fff !important;
}

/* =============================================================
   CHECKOUT PAGE — hide hero banner and breadcrumb
   ============================================================= */
.woocommerce-checkout .page-header {
    display: none !important;
}
.woocommerce-checkout .woocommerce-breadcrumb {
    display: none !important;
}
/* Hide Sober's injected "Billing Details" heading and WC login prompt */
.woocommerce-checkout #customer_details > div > h3,
.woocommerce-checkout .woocommerce-billing-fields > h3,
.woocommerce-checkout .woocommerce-account-fields,
.woocommerce-checkout .woocommerce-form-login-toggle {
    display: none !important;
}

/* =============================================================
   SINGLE-PAGE CHECKOUT
   ============================================================= */
.irasin-checkout-form {
    max-width: 560px;
    margin: 0 auto;
    padding: 0 16px 40px;
}

.irasin-checkout-section {
    background: #fff;
    border: 1px solid #e8e8e8;
    border-radius: 10px;
    margin-bottom: 16px;
    overflow: hidden;
}

.irasin-section-title {
    font-size: 15px;
    font-weight: 700;
    color: #111;
    margin: 0;
    padding: 16px 16px 12px;
    border-bottom: 1px solid #f0f0f0;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

/* Section A — Order items */
.irasin-order-items {
    padding: 8px 0 4px;
}

.irasin-order-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 16px;
    border-bottom: 1px solid #f5f5f5;
}

.irasin-order-item:last-child {
    border-bottom: none;
}

.irasin-item-img {
    width: 60px;
    height: 60px;
    object-fit: cover;
    border-radius: 6px;
    flex-shrink: 0;
    border: 1px solid #eee;
}

.irasin-item-info {
    flex: 1;
    min-width: 0;
}

.irasin-item-name {
    font-size: 13px;
    font-weight: 600;
    color: #222;
    line-height: 1.3;
}

.irasin-item-variation {
    font-size: 12px;
    color: #777;
    margin-top: 2px;
}

.irasin-item-subtotal {
    font-size: 13px;
    font-weight: 700;
    color: #222;
    margin-top: 4px;
}

.irasin-qty-stepper {
    display: flex;
    align-items: center;
    gap: 4px;
    flex-shrink: 0;
}

.irasin-qty-btn {
    width: 32px;
    height: 32px;
    border: 1px solid #ccc;
    background: #f8f8f8;
    border-radius: 6px;
    font-size: 18px;
    font-weight: 400;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #333;
    line-height: 1;
    min-height: 44px;
    min-width: 44px;
    padding: 0;
}

.irasin-qty-btn:disabled {
    opacity: 0.4;
    cursor: not-allowed;
}

.irasin-qty-val {
    min-width: 28px;
    text-align: center;
    font-size: 15px;
    font-weight: 600;
    color: #222;
}

/* Section B — Delivery fields */
.irasin-checkout-section-b {
    padding-bottom: 8px;
}

.irasin-field {
    margin: 0;
    padding: 12px 16px 0;
}

.irasin-field label {
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: #444;
    margin-bottom: 6px;
}

.irasin-field label .required {
    color: #cc0000;
    margin-left: 2px;
}

.irasin-field label .optional {
    font-weight: 400;
    color: #999;
    font-size: 12px;
}

.irasin-field .input-text,
.irasin-field .irasin-address-textarea {
    width: 100%;
    box-sizing: border-box;
    border: 1px solid #ccc;
    border-radius: 8px;
    padding: 12px 14px;
    font-size: 15px;
    color: #222;
    background: #fafafa;
    min-height: 48px;
    appearance: none;
    -webkit-appearance: none;
    outline: none;
    transition: border-color 0.15s;
}

.irasin-field .irasin-address-textarea {
    min-height: 80px;
    resize: vertical;
    line-height: 1.5;
}

.irasin-field .input-text:focus,
.irasin-field .irasin-address-textarea:focus {
    border-color: #222;
    background: #fff;
}

/* Section C — COD box */
.irasin-cod-block {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 16px;
}

.irasin-cod-icon {
    width: 44px;
    height: 44px;
    background: #e8f5e9;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    flex-shrink: 0;
    color: #2a9d2a;
    font-weight: 700;
}

.irasin-cod-content {
    flex: 1;
}

.irasin-cod-content strong {
    display: block;
    font-size: 15px;
    color: #222;
    font-weight: 700;
}

.irasin-cod-content span {
    font-size: 12px;
    color: #666;
    margin-top: 2px;
    display: block;
}

.irasin-cod-selected {
    width: 24px;
    height: 24px;
    background: #2a9d2a;
    border-radius: 50%;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    font-weight: 700;
    flex-shrink: 0;
}

/* Section D — Subtotal / Shipping breakdown rows */
.irasin-breakdown-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 16px;
    border-bottom: 1px solid #f0f0f0;
    font-size: 14px;
    color: #555;
}

/* Section D — Total + button */
.irasin-total-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 16px 12px;
    border-bottom: 1px solid #f0f0f0;
}

.irasin-total-label {
    font-size: 16px;
    font-weight: 600;
    color: #111;
}

.irasin-total-amount {
    font-size: 20px;
    font-weight: 700;
    color: #111;
}

.irasin-confirm-btn {
    display: block !important;
    width: calc(100% - 32px) !important;
    margin: 16px 16px 8px !important;
    min-height: 52px !important;
    font-size: 17px !important;
    font-weight: 700 !important;
    background: #222 !important;
    color: #fff !important;
    border-radius: 8px !important;
    text-align: center !important;
    letter-spacing: 0.03em !important;
    border: none !important;
    cursor: pointer !important;
}

.irasin-confirm-btn:hover {
    background: #000 !important;
}

.irasin-confirm-subtext {
    text-align: center;
    font-size: 12px;
    color: #888;
    margin: 0 16px 16px;
    line-height: 1.4;
}

/* Coupon section */
.irasin-coupon-section {
    padding: 0 !important;
    overflow: hidden !important;
}

.irasin-coupon-toggle {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 14px 16px;
    background: none;
    border: none;
    font-size: 14px;
    font-weight: 600;
    color: #1D9E75;
    cursor: pointer;
    text-align: left;
}

.irasin-coupon-toggle-arrow {
    margin-left: auto;
    font-size: 20px;
    transition: transform 0.2s;
    color: #999;
}

.irasin-coupon-toggle.open .irasin-coupon-toggle-arrow {
    transform: rotate(90deg);
}

.irasin-coupon-body {
    display: none;
    padding: 0 16px 16px;
}

.irasin-coupon-row {
    display: flex;
    gap: 8px;
}

.irasin-coupon-row .input-text {
    flex: 1;
    border: 1px solid #ccc;
    border-radius: 8px;
    padding: 10px 12px;
    font-size: 14px;
    background: #fafafa;
    min-height: 44px;
    box-sizing: border-box;
}

.irasin-coupon-row button {
    flex: 0 0 auto;
    padding: 0 16px;
    min-height: 44px;
    background: #222;
    color: #fff;
    border: none;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
}

.irasin-coupon-row button:hover {
    background: #000;
}

.irasin-coupon-msg {
    margin-top: 8px;
    font-size: 13px;
    min-height: 18px;
}

.irasin-coupon-msg.success { color: #1D9E75; }
.irasin-coupon-msg.error   { color: #cc0000; }

/* Discount row in total */
.irasin-discount-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 16px;
    border-bottom: 1px solid #f0f0f0;
}

.irasin-remove-coupon {
    background: none;
    border: none;
    color: #999;
    font-size: 12px;
    cursor: pointer;
    margin-left: 6px;
    padding: 2px 4px;
    vertical-align: middle;
}

.irasin-remove-coupon:hover { color: #cc0000; }

.irasin-discount-amount {
    font-size: 15px;
    font-weight: 600;
    color: #1D9E75;
}

/* WC checkout error notices */
.irasin-checkout-form .woocommerce-NoticeGroup {
    margin-bottom: 16px;
}

.irasin-checkout-form .woocommerce-error {
    border-left: 3px solid #cc0000;
    padding: 12px 14px;
    background: #fff5f5;
    border-radius: 6px;
    font-size: 13px;
    list-style: none;
    margin: 0 0 4px;
}

/* =============================================================
   ORDER CONFIRMATION (THANK YOU PAGE)
   ============================================================= */
.irasin-thankyou-header {
    text-align: center;
    padding: 32px 16px 24px;
}

.irasin-thankyou-check {
    width: 64px;
    height: 64px;
    background: #2a9d2a;
    border-radius: 50%;
    color: #fff;
    font-size: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 16px;
}

.irasin-thankyou-title {
    font-size: 24px;
    font-weight: 700;
    color: #111;
    margin: 0 0 8px;
}

.irasin-thankyou-order-num {
    font-size: 15px;
    color: #666;
    margin: 0;
}

.irasin-thankyou-footer {
    text-align: center;
    padding: 24px 16px 40px;
}

.irasin-thankyou-call {
    font-size: 15px;
    color: #333;
    background: #f0faf0;
    border: 1px solid #c3e6c3;
    border-radius: 8px;
    padding: 14px 16px;
    margin: 0 auto 20px;
    max-width: 400px;
    line-height: 1.5;
}

.irasin-thankyou-continue {
    display: inline-block;
    min-height: 48px;
    padding: 0 32px;
    line-height: 48px;
    background: #222 !important;
    color: #fff !important;
    border-radius: 8px;
    font-size: 15px;
    font-weight: 600;
    text-decoration: none;
}
