/*
 * Challenger Shop Theme – WooCommerce/Legacy-CSS migration layer.
 *
 * This file contains the useful, theme-independent parts of the former
 * WordPress "Additional CSS" setup. All visual colors are driven by the
 * Challenger design variables so Dark and Light mode stay configurable.
 * Astra-specific rules and forced-dark overrides are intentionally omitted.
 */

/* -----------------------------------------------------
   Shared WooCommerce surfaces and controls
----------------------------------------------------- */
.woocommerce,
.woocommerce-page,
.wc-block-checkout,
.wc-block-cart {
    color: var(--challenger-on-page, var(--challenger-text));
}

.woocommerce a:not(.button),
.woocommerce-page a:not(.button),
.wc-block-checkout a,
.wc-block-cart a {
    color: inherit;
}

.woocommerce input:not([type="checkbox"]):not([type="radio"]),
.woocommerce textarea,
.woocommerce select,
.wc-block-checkout input:not([type="checkbox"]):not([type="radio"]),
.wc-block-checkout textarea,
.wc-block-checkout select,
.wc-block-cart input:not([type="checkbox"]):not([type="radio"]),
.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple {
    background: var(--challenger-surface-alt) !important;
    color: var(--challenger-on-surface-alt, var(--challenger-text)) !important;
    border-color: var(--challenger-border) !important;
}

.woocommerce input::placeholder,
.woocommerce textarea::placeholder,
.wc-block-checkout input::placeholder,
.wc-block-checkout textarea::placeholder {
    color: var(--challenger-muted-on-surface-alt, var(--challenger-muted)) !important;
    opacity: 1;
}

.woocommerce table.shop_table,
.woocommerce-cart-form,
.cart_totals,
.woocommerce-checkout-review-order,
.woocommerce-checkout-payment,
.wc-block-components-sidebar,
.wc-block-components-order-summary,
.wc-block-components-totals-wrapper {
    background: var(--challenger-surface) !important;
    color: var(--challenger-on-surface, var(--challenger-text)) !important;
    border-color: var(--challenger-border) !important;
}

.woocommerce table.shop_table th,
.woocommerce table.shop_table td,
.wc-block-components-totals-wrapper,
.wc-block-components-order-summary-item {
    border-color: var(--challenger-border) !important;
    color: var(--challenger-on-surface, var(--challenger-text)) !important;
}

.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.wc-block-components-button,
.wc-block-components-checkout-place-order-button {
    background: var(--challenger-surface-alt) !important;
    color: var(--challenger-on-surface-alt, var(--challenger-text)) !important;
    border: 1px solid var(--challenger-border) !important;
    border-radius: 12px !important;
    box-shadow: none !important;
}

.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover,
.wc-block-components-button:hover,
.wc-block-components-checkout-place-order-button:hover {
    background: var(--challenger-accent) !important;
    color: var(--challenger-on-accent, var(--challenger-accent-text)) !important;
    border-color: var(--challenger-accent) !important;
}

.wc-block-components-checkout-place-order-button__text {
    color: inherit !important;
    opacity: 1 !important;
}

/* Generic WooCommerce account fallback. Challenger Customer Portal replaces
   this navigation on its own dashboard and subpages. */
.woocommerce-account .woocommerce {
    display: block !important;
}

.woocommerce-account .woocommerce-MyAccount-navigation {
    float: left;
    width: 220px;
    margin-right: 40px;
}

.woocommerce-account .woocommerce-MyAccount-content {
    float: none;
    overflow: hidden;
    background: transparent !important;
    color: var(--challenger-on-page, var(--challenger-text)) !important;
    box-shadow: none !important;
}

/* Account endpoints sit inside the theme's content card. The transparent
   WooCommerce wrapper must use that surface, not the page behind the card.
   Keep the generic fallback above for account layouts without this card. */
.woocommerce-account .challenger-content-card .woocommerce-MyAccount-content {
    color: var(--challenger-on-surface, var(--challenger-text)) !important;
}

/* Suite allocation options have their own inner surface. Do not inherit the
   outer card's foreground into these darker (or independently themed) rows. */
.woocommerce-account .woocommerce-MyAccount-content :is(.chs-allocation-pref-row, .chs-email-preference-row) {
    color: var(--challenger-on-inner-surface, var(--challenger-text));
}

.woocommerce-account .woocommerce-MyAccount-content :is(.chs-allocation-pref-row, .chs-email-preference-row) small {
    color: var(--challenger-muted-on-inner-surface, var(--challenger-muted));
    opacity: 1;
}

.woocommerce-account .challenger-content-card .chs-allocation-preferences :is(.chs-front-muted, .chs-allocation-optout-state, .chs-allocation-optout-row small, .chs-allocation-leave-all-copy small),
.woocommerce-account .challenger-content-card .chs-email-preferences > .chs-front-muted {
    color: var(--challenger-muted-on-surface, var(--challenger-muted));
    opacity: 1;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul {
    overflow: hidden;
    margin: 0 !important;
    padding: 0 !important;
    background: var(--challenger-surface) !important;
    border: 1px solid var(--challenger-border) !important;
    border-radius: var(--challenger-radius) !important;
}

.woocommerce-account .woocommerce-MyAccount-navigation li {
    list-style: none !important;
    border-bottom: 1px solid var(--challenger-border) !important;
}

.woocommerce-account .woocommerce-MyAccount-navigation li:last-child {
    border-bottom: 0 !important;
}

.woocommerce-account .woocommerce-MyAccount-navigation a {
    display: block !important;
    padding: 14px 18px !important;
    color: var(--challenger-on-surface, var(--challenger-text)) !important;
    text-decoration: none !important;
}

.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a,
.woocommerce-account .woocommerce-MyAccount-navigation a:hover {
    background: var(--challenger-inner-surface) !important;
    color: var(--challenger-on-inner-surface, var(--challenger-text)) !important;
}

/* Generic WooCommerce password reveal control for account, checkout and login. */
.woocommerce form .password-input {
    position: relative !important;
    display: block !important;
}

.woocommerce form .show-password-input,
.woocommerce form .hide-password-input,
.woocommerce form .display-password {
    position: absolute !important;
    top: 50% !important;
    right: 18px !important;
    z-index: 20 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 22px !important;
    height: 22px !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    color: var(--challenger-muted-on-surface-alt, var(--challenger-muted)) !important;
    border: 0 !important;
    opacity: 1 !important;
    visibility: visible !important;
    line-height: 1 !important;
    transform: translateY(-50%) !important;
}

.woocommerce form .password-input input[type="password"],
.woocommerce form .password-input input[type="text"] {
    padding-right: 55px !important;
}

/* -----------------------------------------------------
   WooCommerce Blocks checkout/cart
----------------------------------------------------- */
.wc-block-components-order-summary-item,
.wc-block-components-order-summary-item__description,
.wc-block-components-order-summary-item__individual-prices,
.wc-block-components-product-name,
.wc-block-components-formatted-money-amount,
.wc-block-components-totals-item__description,
.wc-block-components-totals-footer-item-tax-value {
    color: var(--challenger-on-surface, var(--challenger-text)) !important;
    opacity: 1 !important;
}

.wc-block-components-order-summary-item__image,
.wc-block-components-order-summary-item__image img {
    background: transparent !important;
    opacity: 1 !important;
}

.wc-block-components-order-summary-item__quantity {
    background: var(--challenger-contrast-bg, var(--challenger-text)) !important;
    color: var(--challenger-on-contrast, var(--challenger-contrast-text, var(--challenger-page-bg))) !important;
    border-color: var(--challenger-contrast-bg, var(--challenger-text)) !important;
    opacity: 1 !important;
}

.wc-block-components-order-summary-item__quantity * {
    color: inherit !important;
}

.wc-block-checkout__shipping-method,
.wc-block-components-shipping-rates-control,
.wc-block-components-radio-control-accordion-option,
.wc-block-components-radio-control__option {
    color: var(--challenger-on-page, var(--challenger-text)) !important;
}

.wc-block-components-radio-control-accordion-option,
.wc-block-components-radio-control__option,
.wc-block-checkout__shipping-method-option {
    background: var(--challenger-inner-surface) !important;
    color: var(--challenger-on-inner-surface, var(--challenger-text)) !important;
    border-color: var(--challenger-border) !important;
}

.wc-block-components-radio-control-accordion-option--checked,
.wc-block-components-radio-control__option--checked,
.wc-block-checkout__shipping-method-option--selected,
.wc-block-checkout__shipping-method-option[aria-checked="true"] {
    background: var(--challenger-surface-alt) !important;
    color: var(--challenger-on-surface-alt, var(--challenger-text)) !important;
    border-color: var(--challenger-accent) !important;
}

.wc-block-components-radio-control__option {
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) auto !important;
    align-items: center !important;
    column-gap: 10px !important;
    overflow: hidden !important;
}

.wc-block-components-radio-control__label,
.wc-block-components-radio-control__description,
.wc-block-components-radio-control__secondary-label,
.wc-block-components-radio-control__option * {
    color: inherit !important;
    opacity: 1 !important;
}

.wc-block-components-radio-control__label {
    min-width: 0 !important;
    white-space: normal !important;
}

.wc-block-components-radio-control__secondary-label {
    justify-self: end !important;
    margin-left: 8px !important;
    padding-right: 8px !important;
    white-space: nowrap !important;
}

.wc-block-checkout__shipping-method-option svg,
.wc-block-checkout__shipping-method-option svg *,
.wc-block-components-radio-control__option svg,
.wc-block-components-radio-control__option svg * {
    color: currentColor !important;
    fill: currentColor !important;
    stroke: currentColor !important;
}

.wc-block-components-radio-control__input,
.woocommerce input[type="radio"],
.wc-block-checkout input[type="radio"] {
    accent-color: var(--challenger-accent) !important;
}

.wc-block-components-checkbox__input {
    appearance: none !important;
    -webkit-appearance: none !important;
    position: relative !important;
    width: 18px !important;
    height: 18px !important;
    min-width: 18px !important;
    padding: 0 !important;
    background: var(--challenger-surface-alt) !important;
    border: 1px solid var(--challenger-border) !important;
    border-radius: 4px !important;
    cursor: pointer !important;
}

.wc-block-components-checkbox__input:checked {
    background: var(--challenger-accent) !important;
    border-color: var(--challenger-accent) !important;
}

.wc-block-components-checkbox__input:checked::after {
    content: "✓" !important;
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -58%) !important;
    color: var(--challenger-on-accent, var(--challenger-accent-text)) !important;
    font-size: 15px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
}

/* -----------------------------------------------------
   Mobile behaviour migrated from Additional CSS
----------------------------------------------------- */
@media (max-width: 768px) {
    .woocommerce-account .woocommerce-MyAccount-navigation {
        float: none !important;
        width: 100% !important;
        margin-right: 0 !important;
        margin-bottom: 24px !important;
    }

    .woocommerce-account .woocommerce-MyAccount-content {
        overflow: visible !important;
    }

    /* Classic cart as readable cards on phones. */
    .woocommerce-cart table.shop_table,
    .woocommerce-cart table.shop_table tbody,
    .woocommerce-cart table.shop_table tr,
    .woocommerce-cart table.shop_table td {
        display: block !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    .woocommerce-cart table.shop_table thead {
        display: none !important;
    }

    .woocommerce-cart table.shop_table tr.cart_item {
        margin-bottom: 18px !important;
        padding: 18px !important;
        background: var(--challenger-inner-surface) !important;
        border: 1px solid var(--challenger-border) !important;
        border-radius: calc(var(--challenger-radius) + 4px) !important;
    }

    .woocommerce-cart table.shop_table td {
        padding: 8px 0 !important;
        border: 0 !important;
        color: var(--challenger-on-inner-surface, var(--challenger-text)) !important;
        text-align: left !important;
        white-space: normal !important;
    }

    .woocommerce-cart table.shop_table td.product-thumbnail {
        padding-bottom: 14px !important;
        text-align: center !important;
    }

    .woocommerce-cart table.shop_table td.product-thumbnail img {
        display: block;
        width: 100% !important;
        max-width: 140px !important;
        height: auto !important;
        margin: 0 auto !important;
    }

    .woocommerce-cart table.shop_table td.product-name::before { content: "Produkt: "; font-weight: 700; }
    .woocommerce-cart table.shop_table td.product-price::before { content: "Preis: "; font-weight: 700; }
    .woocommerce-cart table.shop_table td.product-quantity::before { content: "Anzahl: "; display: block; margin-bottom: 8px; font-weight: 700; }
    .woocommerce-cart table.shop_table td.product-subtotal::before { content: "Zwischensumme: "; font-weight: 700; }

    .woocommerce-cart table.shop_table .quantity {
        display: flex !important;
        justify-content: center !important;
        max-width: 160px !important;
        margin: 0 auto !important;
    }

    .woocommerce-cart table.shop_table .quantity input.qty {
        max-width: 70px !important;
        text-align: center !important;
    }

    .woocommerce-cart table.shop_table td.product-remove {
        text-align: right !important;
    }

    .woocommerce-cart table.shop_table td.actions {
        padding-top: 20px !important;
    }

    .woocommerce-cart .cart_totals {
        margin-top: 24px !important;
        padding: 18px !important;
        border-radius: calc(var(--challenger-radius) + 4px) !important;
    }

}