/* Shipping Chooser cards — "How do you want it?" */

.jupiter-shipping-chooser {
    margin: 24px 0;
}

.jupiter-shipping-chooser__title {
    font-size: 1.15rem;
    font-weight: 700;
    color: #fff;
    margin: 0 0 12px;
    letter-spacing: 0.01em;
}

.jupiter-shipping-chooser__cards {
    display: grid;
    gap: 12px;
    grid-template-columns: 1fr 1fr;
}

@media (max-width: 640px) {
    .jupiter-shipping-chooser {
        margin: 16px 0;
    }
    .jupiter-shipping-chooser__cards {
        grid-template-columns: 1fr;
        gap: 10px;
    }
    .jupiter-shipping-chooser__prompt {
        margin-top: 12px;
    }
}

.jupiter-ship-card {
    border: 2px solid #28253A;
    background: #1C1A26;
    border-radius: 10px;
    padding: 16px;
    cursor: pointer;
    transition: border-color 120ms ease, background-color 120ms ease;
    position: relative;
    display: flex;
    align-items: flex-start;
    gap: 12px;
    color: #e4e1ef;
}

.jupiter-ship-card:hover:not(.is-disabled) {
    border-color: #7473A9;
}

.jupiter-ship-card:focus-visible {
    outline: 2px solid #9695C4;
    outline-offset: 2px;
}

.jupiter-ship-card.is-selected {
    border-color: #7473A9;
    background: #251F3B;
}

.jupiter-ship-card.is-disabled {
    opacity: 0.4;
    cursor: not-allowed;
}

.jupiter-ship-card__radio {
    width: 18px;
    height: 18px;
    border: 2px solid #4A4658;
    border-radius: 50%;
    flex-shrink: 0;
    margin-top: 2px;
    position: relative;
    background: transparent;
}

.jupiter-ship-card.is-selected .jupiter-ship-card__radio {
    border-color: #5C8727;
}

.jupiter-ship-card.is-selected .jupiter-ship-card__radio::after {
    content: '';
    position: absolute;
    top: 2px;
    left: 2px;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #5C8727;
}

.jupiter-ship-card__body {
    flex: 1;
    min-width: 0;
}

.jupiter-ship-card__title {
    font-weight: 700;
    color: #fff;
    font-size: 1rem;
    line-height: 1.3;
}

.jupiter-ship-card__line {
    color: #a09cb2;
    font-size: 0.875rem;
    margin-top: 4px;
    line-height: 1.3;
}

.jupiter-ship-card__price {
    color: #fff;
    font-weight: 700;
    margin-top: 10px;
    font-size: 1.05rem;
}

.jupiter-shipping-chooser__prompt {
    margin: 10px 0 0;
    font-size: 0.875rem;
    color: #6b7280;
}

/*
 * Hide the default WooCommerce shipping row on /cart/ and /checkout/.
 * The hidden inputs stay in the DOM so WC's update_checkout flow still
 * finds them — we just suppress the visual radio list. Our cards trigger
 * the same radio inputs via JS.
 */
body.jupiter-has-shipping-chooser tr.woocommerce-shipping-totals,
body.jupiter-has-shipping-chooser tr.shipping {
    display: none;
}

/*
 * Disable the Proceed to Checkout / Place Order buttons until a card is picked.
 * !important needed on opacity because WC's default .button + a higher-specificity
 * theme button rule both override the unprefixed opacity declaration. Without
 * !important the pointer-events:none works but the button still looks active.
 */
body.jupiter-has-shipping-chooser .jupiter-shipping-chooser.is-pending ~ .wc-proceed-to-checkout .checkout-button,
body.jupiter-has-shipping-chooser .jupiter-shipping-chooser.is-pending ~ * .checkout-button,
body.jupiter-has-shipping-chooser .jupiter-shipping-chooser.is-pending ~ * #place_order,
.jupiter-disabled-pending-shipping {
    pointer-events: none !important;
    opacity: 0.45 !important;
    cursor: not-allowed !important;
    filter: grayscale( 30% );
}