/* =============================================================================
   Technologia — Theme fixes & overrides
   Loaded after style.min.css to override specific rules without editing source
   ============================================================================= */

/* --- Header row: prevent icons from wrapping to a new line --- */
.header .row {
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

/* --- Navigation: prevent menu items from wrapping inside their links --- */
.header .top-menu > li > a {
    white-space: nowrap;
}

/* --- CF7 submit button: top spacing inside Elementor form template --- */
.elementor input[type="submit"].wpcf7-submit {
    margin-top: 20px;
}

/* --- Mobile menu: prevent body scroll when nav overlay is open --- */
body.menu-open {
    overflow: hidden;
}

/* === Mobile header layout (≤767px): [Logo → fills →][Account][Cart][☰] === */
@media (max-width: 767px) {
    /* Switch row to left-align; logo grows and pushes icons+hamburger right */
    .header .row.between-xs {
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start;
    }

    /* Override ≤991px rule that set width:100% on all header-items */
    .header-v3 .header-item {
        width: auto;
        -webkit-flex: 0 0 auto;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
    }

    /* Logo grows to push icons/hamburger to the right; content stays left */
    .header .header-logo.header-item {
        -webkit-flex: 1 1 auto;
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
        max-width: none;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start;
    }

    /* Icons: between logo and hamburger */
    .header .header-icons {
        -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
        order: 2;
        -webkit-flex: 0 0 auto;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
        gap: 4px;
    }

    /* Navigation container: own position context so hamburger is relative to it.
       Width 70px matches the hamburger's 69px visual width — no icon overlap. */
    .header .navigation-container {
        position: relative;
        -webkit-box-ordinal-group: 4;
        -ms-flex-order: 3;
        order: 3;
        -webkit-flex: 0 0 70px;
        -ms-flex: 0 0 70px;
        flex: 0 0 70px;
        width: 70px;
    }

    /* Hamburger: flush to right edge of its now-relative container */
    .nav-open {
        right: 0;
        left: auto;
    }

    /* Icons in the mobile menu are now visible in the header — remove duplicates */
    .nav-icons {
        display: none !important;
    }
}

/* --- Hide "View cart" link after add-to-cart (header icon is sufficient) --- */
a.added_to_cart {
    display: none !important;
}

/* --- Add-to-cart button: success checkmark state --- */
.atc-check-icon {
    display: inline-block;
    vertical-align: middle;
    width: 1em;
    height: 1em;
    margin-left: 6px;
    margin-bottom: 2px;
    pointer-events: none;
}

/* --- My Account: Register form spacing & typography --- */
.woocommerce-form-register p:not([class]) {
    margin-top: 12px;
    margin-bottom: 20px;
    font-size: 13px;
    color: #666;
}

.woocommerce-form-register .woocommerce-privacy-policy-text {
    margin-top: 0;
    margin-bottom: 20px;
    font-size: 12px;
    color: #888;
    line-height: 1.5;
}

/* --- Checkout: Select2 country dropdown positioning fix ---
   .woocommerce-input-wrapper is a <span> (display:inline by default).
   Select2 cannot calculate available viewport space around an inline element,
   so it opens the dropdown above instead of below and positions it incorrectly.
   Setting display:block gives the wrapper a proper layout box. */
.woocommerce-input-wrapper {
    display: block;
}

/* --- Shop pages banner: shorter block + smaller breadcrumb text ---
   Scoped to body.woocommerce-page so regular pages/posts (which reuse the
   same .header-section/#breadcrumbs markup) are unaffected. */
body.woocommerce-page .header-section {
    padding: 20px 0;
}

body.woocommerce-page #breadcrumbs {
    font-size: 14px;
}

/* .header-section-v3's padding-right:calc(50% - 555px) is meant for the site
   header, not this banner — it collapses to 0 at the .container width used
   here, leaving padding-left:50px on one side only. Force both sides equal. */
@media (min-width: 1130px) {
    body.woocommerce-page .header-section-v3 .container-fluid {
        padding-right: 50px;
    }
}

@media (max-width: 1199px) {
    body.woocommerce-page .header-section {
        padding: 16px 0;
    }
}

@media (max-width: 767px) {
    body.woocommerce-page .header-section {
        padding: 12px 0;
    }

    body.woocommerce-page #breadcrumbs {
        font-size: 13px;
        line-height: 16px;
    }
}