/**
 * STW Subscriptions Frontend Styles
 * Minimal CSS - relies on Bootstrap utilities from theme
 */

/* Product page subscription message — primary-themed. Forced to its own full
   width row in form.cart's flex layout so it can never share a row with the
   quantity stepper — at tablet widths (~768-850px) the summary column was
   wide enough for the message and .quantity to sit side by side, stranding
   the stepper right of the message and the Add to cart button on its own
   line below. */
.stw-subscription-message {
    background: var(--bs-primary-bg-subtle, #cfe2ff);
    color: var(--bs-primary-text-emphasis, #052c65);
    border: 1px solid var(--bs-primary-border-subtle, #b6d4fe);
    border-radius: var(--bs-border-radius, 0.375rem);
    padding: 0.75rem 1rem;
    flex: 0 0 100%;
    width: 100%;
    max-width: 100%;
}

#stw-subscription-options .stw-purchase-option {
    cursor: pointer;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    background: #fff;
}

#stw-subscription-options .stw-purchase-option:hover {
    border-color: var(--bs-primary, #7f54b3) !important;
}

#stw-subscription-options .stw-purchase-option input[type="radio"]:checked ~ * {
    color: var(--bs-primary, #7f54b3);
}

#stw-subscription-options .stw-purchase-option:has(input:checked) {
    border-color: var(--bs-primary, #7f54b3) !important;
    box-shadow: 0 0 0 1px var(--bs-primary, #7f54b3);
}

/* Cart subscription options */
.stw-cart-subscription .form-check-label {
    cursor: pointer;
}

/* Cart radio card styles for single-frequency layout */
.stw-cart-subscription .stw-purchase-option {
    cursor: pointer;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    background: #fff;
}

.stw-cart-subscription .stw-purchase-option:hover {
    border-color: var(--bs-primary, #7f54b3) !important;
}

.stw-cart-subscription .stw-purchase-option:has(input:checked) {
    border-color: var(--bs-primary, #7f54b3) !important;
    box-shadow: 0 0 0 1px var(--bs-primary, #7f54b3);
}

/* Checkout subscription options — radio card styles */
#stw-checkout-subscription .stw-purchase-option {
    cursor: pointer;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    background: #fff;
}

#stw-checkout-subscription .stw-purchase-option:hover {
    border-color: var(--bs-primary, #7f54b3) !important;
}

#stw-checkout-subscription .stw-purchase-option:has(input:checked) {
    border-color: var(--bs-primary, #7f54b3) !important;
    box-shadow: 0 0 0 1px var(--bs-primary, #7f54b3);
}

/* Fix subscription discount alignment in cart/checkout totals */
.woocommerce-cart-form ~ .cart-collaterals .fee .woocommerce-Price-amount,
.woocommerce-checkout-review-order-table .fee td,
tr.fee td {
    text-align: right;
}

/* My Account subscription list */
.stw-subscriptions-list .badge {
    font-size: 0.75rem;
}

/* Block cart subscription options — injected via JS */
#stw-block-subscription-options {
    transition: opacity 0.2s ease;
}

#stw-block-subscription-options .stw-purchase-option {
    cursor: pointer;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    background: #fff;
}

#stw-block-subscription-options .stw-purchase-option:hover {
    border-color: var(--bs-primary, #7f54b3) !important;
}

#stw-block-subscription-options .stw-purchase-option:has(input:checked) {
    border-color: var(--bs-primary, #7f54b3) !important;
    box-shadow: 0 0 0 1px var(--bs-primary, #7f54b3);
}

.stw-block-badge {
    font-size: 12.5px;
    padding: 2.5px 7px;
}

/* View subscription page */
.stw-view-subscription .card {
    margin-bottom: 1.5rem;
}

.stw-view-subscription .card-header h5 {
    margin-bottom: 0;
}

/* Edit subscription page */
.stw-edit-subscription .nav-tabs {
    margin-bottom: 1.5rem;
}

.stw-edit-subscription .item-qty {
    width: 80px;
}

/* Mobile responsiveness */
@media (max-width: 768px) {
    .stw-view-subscription .table {
        font-size: 0.875rem;
    }

    .stw-edit-subscription .item-qty {
        width: 60px;
    }
}
