/* ════════════════════════════════════════════════════════════
   BG Cart Extras — Gift Wrap & Delivery Options
   Design system: teal #0B5A66, mid-teal #1F97A8, coral #E88F7B
   ════════════════════════════════════════════════════════════ */

/* ── Gift wrap checkbox ──────────────────────────────────────── */

.bg-giftwrap-wrap {
    margin-top: 6px;
}

.bg-giftwrap-label {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    cursor: pointer;
    font-family: 'Raleway', sans-serif;
    font-size: 12px;
    font-weight: 400;
    color: #5a6a70;
    line-height: 1.3;
    user-select: none;
}

.bg-giftwrap-checkbox {
    width: 14px;
    height: 14px;
    accent-color: #E88F7B;
    cursor: pointer;
    flex-shrink: 0;
    margin: 0;
}

.bg-giftwrap-checkbox:disabled {
    cursor: wait;
    opacity: 0.6;
}

.bg-giftwrap-message {
    display: block;
    width: 100%;
    margin-top: 6px;
    padding: 5px 8px;
    font-family: 'Raleway', sans-serif;
    font-size: 12px;
    color: #2F3E46;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
    outline: none;
    transition: border-color 0.15s;
}

.bg-giftwrap-message:focus {
    border-color: #1F97A8;
    box-shadow: 0 0 0 2px rgba(31,151,168,0.15);
}

/* ── Delivery options block ──────────────────────────────────── */

/* table row wrapper — override td text-align and suppress double border */
.bg-delivery-row td {
    text-align: left !important;
    padding-bottom: 0 !important;
}

.bg-delivery-wrap {
    padding: 8px 0 4px;
    margin-bottom: 8px;
}

.bg-delivery-heading {
    font-family: 'Raleway', sans-serif;
    font-size: 15px;
    font-weight: 700;
    color: #2F3E46;
    margin: 0 0 12px;
    padding: 0;
    border: none;
    background: none;
}

.bg-delivery-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

/* ── Individual delivery option ─────────────────────────────── */

.bg-delivery-option--disabled {
    opacity: 0.5;
}

.bg-delivery-label {
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    font-family: 'Raleway', sans-serif;
    font-size: 14px;
    color: #2F3E46;
    line-height: 1.3;
    user-select: none;
}

.bg-delivery-option--disabled .bg-delivery-label {
    cursor: not-allowed;
}

.bg-delivery-radio {
    width: 16px;
    height: 16px;
    accent-color: #0B5A66;
    cursor: pointer;
    flex-shrink: 0;
    margin: 0;
}

.bg-delivery-radio:disabled {
    cursor: not-allowed;
}

.bg-delivery-name {
    flex: 1;
}

.bg-delivery-price {
    font-family: 'Raleway', sans-serif;
    font-weight: 700;
    color: #0B5A66;
    white-space: nowrap;
}

.bg-delivery-price .woocommerce-Price-amount,
.bg-delivery-price bdi {
    color: inherit !important;
}

.bg-delivery-unavailable {
    font-size: 14px;
    color: #888;
    margin: 3px 0 0 24px;
    padding: 0;
    line-height: 1.4;
}

/* ── Mobile-only delivery feedback line ──────────────────────────
   Sits directly below the radio group. Hidden on desktop, where the
   item list and the radios are both on screen and the estimates
   changing is its own feedback. Shown below 900px — the breakpoint
   at which .bg-cart-layout collapses from two columns to one
   (astra-child/style.css:7287), which is exactly when the items
   scroll off-screen above the radios and the change becomes
   invisible.

   Hidden by default and switched on inside the query, rather than the
   other way round, so no desktop specificity fight can leave it
   showing. */

.bg-delivery-feedback {
    display: none;
}

@media (max-width: 900px) {
    .bg-delivery-feedback {
        display: block;
        font-family: 'Raleway', sans-serif;
        font-size: 13px;
        line-height: 1.4;
        color: var(--bg-grey-text);
        margin: 10px 0 0;
        padding: 0;
        transition: color 0.2s ease;
    }

    .bg-delivery-feedback.is-updated {
        color: var(--bg-teal-deep);
        font-weight: 600;
    }
}
