/* Outstanding February notes only. Loaded after the existing Forms Direct styles. */

/* The item count is informational. Only the separate View Cart link navigates. */
#masthead #fd-header-cart { cursor: default; background: #eef4f5 !important; border-color: #c8d9de !important; color: #326273 !important; }
/* Keep the subtotal readable, including nested WooCommerce price fragments. */
#masthead #fd-header-cart .fd-cart-contents__amount,
#masthead #fd-header-cart .fd-cart-contents__amount * {
    color: #326273 !important;
}
#masthead #fd-header-cart .fd-cart-contents__count { background: #326273 !important; color: #fff !important; }
#masthead #fd-header-cart .fd-cart-contents__label {
    display: inline-flex; align-items: center; min-height: 44px;
    color: #326273 !important; text-decoration: underline;
}
#masthead #fd-header-cart .fd-cart-contents__count,
#masthead #fd-header-cart .fd-cart-contents__amount { cursor: default; }
#masthead #fd-header-cart a:focus-visible,
#masthead .buzz-toggle:focus-visible,
#fd-mobile-menu a:focus-visible,
#fd-mobile-menu summary:focus-visible,
#fd-mobile-menu button:focus-visible {
    outline: 2px solid #326273 !important; outline-offset: 3px;
}

@media (max-width: 1100px) {
    /* The old 170px cart minimum steals space from the mobile logo. */
    #masthead #fd-header-cart { min-width: 0 !important; }
    #masthead .buzz-main-header.fd-headerbar .buzz-container.fd-headerbar__inner {
        min-height: 0 !important; padding: 8px 12px !important; gap: 8px !important;
    }
    #masthead .fd-headerbar__brand .buzz-logo .custom-logo,
    #masthead .fd-headerbar__brand .custom-logo-link img,
    #masthead .fd-headerbar__brand .custom-logo {
        width: auto !important; height: auto !important;
        max-height: 40px !important; max-width: 132px !important;
    }
    #masthead .fd-header-search__input {
        height: 40px !important; min-height: 40px !important; font-size: 16px !important;
    }
    #masthead .fd-header-search__button {
        height: 40px !important; min-height: 40px !important;
    }
    #masthead .buzz-toggle.mobile-only { width: 40px !important; height: 44px !important; }
    /* Legacy off-canvas search is already replaced by the persistent header search. */
    .header-mobile-menu .search-form { display: none !important; }
}
@media (max-width: 380px) {
    #masthead .fd-headerbar__brand { grid-template-columns: 36px minmax(0,1fr) !important; }
    #masthead .buzz-toggle.mobile-only { width: 36px !important; }
    #masthead .fd-headerbar__brand .buzz-logo .custom-logo,
    #masthead .fd-headerbar__brand .custom-logo-link img,
    #masthead .fd-headerbar__brand .custom-logo {
        max-width: 96px !important; max-height: 32px !important;
    }
    #masthead .buzz-main-header.fd-headerbar .buzz-container.fd-headerbar__inner { padding-inline: 8px !important; }
}

/* Elementor's actual home image carousel: controls below the artwork on phones. */
@media (max-width: 767px) {
    .home-carousel .elementor-widget-container { padding-bottom: 48px !important; position: relative; }
    .home-carousel .elementor-image-carousel-wrapper { position: static; }
    .home-carousel .swiper-pagination { bottom: 48px !important; }
    .home-carousel .elementor-swiper-button {
        top: auto !important; bottom: 0; transform: none !important;
        width: 44px; height: 40px; display: flex; align-items: center;
        justify-content: center; border-radius: 4px; font-size: 18px !important;
        background: #326273; color: #fff !important; z-index: 2;
    }
    .home-carousel .elementor-swiper-button-prev { left: calc(50% - 50px) !important; }
    .home-carousel .elementor-swiper-button-next { right: calc(50% - 50px) !important; }
    .home-carousel .elementor-swiper-button svg { width: 18px; height: 18px; fill: currentColor; }
}

/* W2P-generated specification labels and controls use the same text metrics. */
.single-product .price-matrix-container :is(#divSettings, #divFields) label,
.single-product .price-matrix-container :is(#divSettings, #divFields) .fieldname,
.single-product .price-matrix-container :is(#divSettings, #divFields) .fieldlabel,
.single-product .price-matrix-container :is(#divSettings, #divFields) select,
.single-product .price-matrix-container :is(#divSettings, #divFields) input,
.single-product .summary .variations label,
.single-product .summary .variations select {
    font-size: 16px !important; line-height: 1.4 !important; color: #326273 !important;
    -webkit-text-fill-color: #326273 !important;
}
.single-product .price-matrix-container :is(#divSettings, #divFields) label { margin: 0 0 6px; }
.single-product .price-matrix-container :is(#divSettings, #divFields) td,
.single-product .summary .variations td,
.single-product .summary .variations th { vertical-align: middle !important; }

/* Grey select fields with a visible chevron, limited to customer form controls. */
.woocommerce form.checkout select:not([multiple]):not([size]),
.single-product .price-matrix-container :is(#divSettings, #divFields) select:not([multiple]):not([size]),
.single-product .summary .variations select:not([multiple]):not([size]),
.woocommerce-account form select:not([multiple]):not([size]) {
    background-color: #f0f2f3 !important;
    border: 1px solid #657f86 !important;
    appearance: none; -webkit-appearance: none;
    background-image: linear-gradient(45deg, transparent 50%, #326273 50%), linear-gradient(135deg, #326273 50%, transparent 50%) !important;
    background-position: calc(100% - 18px) 50%, calc(100% - 12px) 50% !important;
    background-size: 6px 6px !important; background-repeat: no-repeat !important;
    padding-right: 36px !important; min-height: 44px !important;
}
.woocommerce-checkout .select2-container--default .select2-selection--single {
    background-color: #f0f2f3 !important; border-color: #657f86 !important; height: 46px !important; min-height: 46px;
    display: flex; align-items: center; padding: 0 !important;
}
.woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__rendered {
    font-size: 16px !important; line-height: 1.4 !important; width: 100%;
    color: #326273 !important; -webkit-text-fill-color: #326273 !important;
    padding-top: 0 !important; padding-bottom: 0 !important;
}
.woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__arrow {
    top: 0 !important; height: 44px !important;
}
.woocommerce form.checkout input[type="checkbox"],
.woocommerce form.checkout input[type="radio"] { accent-color: #326273 !important; }
.woocommerce form.checkout input[type="checkbox"]:focus-visible,
.woocommerce form.checkout input[type="radio"]:focus-visible {
    outline: 2px solid #326273 !important; outline-offset: 2px;
}
.woocommerce-checkout #shipping_method li,
.woocommerce-checkout #shipping_method label,
.woocommerce-checkout ul.woocommerce-shipping-methods label {
    white-space: normal !important; word-break: normal !important;
    overflow-wrap: normal !important; hyphens: none !important;
}
.woocommerce-checkout .elementor-element-7ed645b,
.woocommerce-checkout .elementor-element-7ed645b p {
    text-align: left !important; margin-bottom: 12px !important;
}
@media (max-width: 767px) {
    /* Specific checkout sidebar box; the footer contact details remain visible. */
    .woocommerce-checkout #custom_html-2 { display: none !important; }
}

/* Size the CAPTCHA widget as a unit; never crop or hide its challenge iframe. */
.woocommerce-account :is(.g-recaptcha, .g-recaptcha-login-i13, .g-recaptcha-register-i13) {
    transform: none !important; transform-origin: 0 0; max-width: none !important;
}
.woocommerce-account :is(.g-recaptcha, .g-recaptcha-login-i13, .g-recaptcha-register-i13) iframe {
    max-width: none !important; transform: none !important;
}
.woocommerce-account .fd-captcha-fit {
    transform: scale(var(--fd-captcha-scale, 1)) !important;
    width: var(--fd-captcha-width, 304px);
    margin-bottom: calc((var(--fd-captcha-scale, 1) - 1) * var(--fd-captcha-height, 78px));
}


/* Actual W2P option rows are generated as floated divs, not table cells.
 * Keep display non-important so the plugin's inline display:none still wins. */
.single-product .price-matrix-container :is(#divSettings, #divFields) div:has(> .fieldlabel) {
    display: grid; grid-template-columns: minmax(100px, 30%) minmax(0, 1fr);
    align-items: center; column-gap: 12px;
}
.single-product .price-matrix-container :is(#divSettings, #divFields) .fieldlabel,
.single-product .price-matrix-container :is(#divSettings, #divFields) .fieldcontrol {
    float: none !important; width: auto !important; min-width: 0;
}
.single-product .price-matrix-container :is(#divSettings, #divFields) .fieldlabel {
    margin: 0 !important; padding: 0 !important;
}
.single-product .price-matrix-container :is(#divSettings, #divFields) div:has(> .fieldlabel) > div[style*="clear"],
.single-product .price-matrix-container :is(#divSettings, #divFields) div:has(> .fieldlabel) > div:empty {
    display: none;
}
@media (max-width: 480px) {
    /* The parent theme's 320px minimum exceeds a 320px phone's content area. */
    .single-product .breadcrumbswrap .entry-header { min-width: 0; max-width: 100%; }
    .single-product .price-matrix-container :is(#divSettings, #divFields) div:has(> .fieldlabel) {
        grid-template-columns: minmax(0, 1fr); gap: 6px; margin-bottom: 14px !important;
    }
}

/* Visible keyboard focus survives the legacy theme's outline/shadow resets.
 * A white inner edge keeps the dark outer ring visible on filled buttons. */
body #masthead :is(a, button, input):focus-visible,
body #fd-mobile-menu :is(a, button, summary):focus-visible,
body .home-carousel :is(a, button, [role="button"]):focus-visible,
body .woocommerce :is(a, button, input, select, textarea, [role="combobox"]):focus-visible,
body.single-product .price-matrix-container :is(a, button, input, select, textarea, [role="combobox"]):focus-visible {
    outline: 3px solid #326273 !important;
    outline-offset: 3px !important;
    box-shadow: 0 0 0 3px #fff !important;
}
@media (prefers-reduced-motion: reduce) {
    #fd-mobile-menu .fdmm__panel { transition: none !important; }
}
@media (forced-colors: active) {
    .woocommerce form.checkout select:not([multiple]):not([size]),
    .woocommerce-account form select:not([multiple]):not([size]),
    .single-product .price-matrix-container :is(#divSettings, #divFields) select:not([multiple]):not([size]),
    .single-product .summary .variations select:not([multiple]):not([size]) {
        appearance: auto !important; -webkit-appearance: auto !important;
        background-image: none !important;
        border-color: ButtonText !important;
        color: CanvasText !important; -webkit-text-fill-color: CanvasText !important;
    }
    body #masthead :focus-visible,
    body #fd-mobile-menu :focus-visible,
    body .home-carousel :focus-visible,
    body .woocommerce :focus-visible,
    body.single-product .price-matrix-container :focus-visible {
        outline-color: Highlight !important;
    }
}

/* More is followed by Cart, so the legacy last-child alignment misses it. */
@media (min-width: 1101px) {
    nav.buzz-menulink .main-menu > #menu-item-219 > ul.sub-menu {
        left: auto !important;
        right: 0 !important;
    }
}
