/**
 * Checkout flow wizard — Country selector + disabled cards + guest/login notice
 *
 * Partial extracted from theme-designer-public-checkout.css to keep the main
 * stylesheet under the 600-line architectural budget defined in AGENTS.md.
 *
 * @package KUADThemeDesigner
 */

/* I1: visually disable shipping cards whose rate cannot be computed */
.kuad-shipping-option-card.is-disabled {
    opacity: 0.65;
    cursor: not-allowed;
    background: var(--ks-block-bg-alt, #F4F4F6);
    border-color: rgba(var(--ks-primary-rgb, 45, 26, 104), 0.12);
}
.kuad-shipping-option-card.is-disabled:hover {
    border-color: rgba(var(--ks-primary-rgb, 45, 26, 104), 0.12);
}
.kuad-shipping-option-card.is-disabled input[type="radio"] {
    cursor: not-allowed;
    accent-color: var(--ks-secondary-color, #B55C80);
}
.kuad-shipping-option-card.is-disabled .shipping-desc {
    color: var(--ks-secondary-color, #B55C80);
    font-weight: 600;
}
.kuad-shipping-option-card.is-disabled .shipping-price {
    color: var(--ks-secondary-color, #B55C80);
}

/* I2: visual compensation when the 5-step bar drops step 3 */
.kuad-checkout-step-tab.kuad-step-shifted .step-num,
.kuad-checkout-steps-bar[data-has-shipping-step="0"] .kuad-checkout-step-tab[data-step="4"] .step-num,
.kuad-checkout-steps-bar[data-has-shipping-step="0"] .kuad-checkout-step-tab[data-step="5"] .step-num {
    background: var(--ks-button-bg-color, var(--ks-primary-color, #403A60));
}

/* I4: emphasis on country selector */
#kuad_billing_country.kuad-input-field {
    font-weight: 600;
    background-color: var(--ks-card-bg, #FFFFFF);
}

/* I5: notice boxes rendered below the contact form */
.kuad-checkout-notice {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 18px;
    border-radius: var(--ks-card-radius, 14px);
    margin: 18px 0 8px 0;
    line-height: 1.45;
}
.kuad-checkout-notice .dashicons {
    font-size: 24px;
    width: 24px;
    height: 24px;
    flex-shrink: 0;
}
.kuad-checkout-notice p {
    margin: 0;
    font-size: 14px;
    color: var(--ks-text-color, #333333);
    flex: 1;
}
.kuad-checkout-guest-notice {
    background: rgba(var(--ks-accent-rgb, 27, 165, 157), 0.06);
    border: 1.5px solid rgba(var(--ks-accent-rgb, 27, 165, 157), 0.35);
}
.kuad-checkout-guest-notice .dashicons {
    color: var(--ks-accent-color, #1BA59D);
}
.kuad-checkout-login-notice {
    background: rgba(var(--ks-secondary-rgb, 192, 90, 134), 0.08);
    border: 1.5px solid rgba(var(--ks-secondary-rgb, 192, 90, 134), 0.35);
    flex-wrap: wrap;
}
.kuad-checkout-login-notice .dashicons {
    color: var(--ks-secondary-color, #B55C80);
}
.kuad-checkout-login-notice a.ks-global-inputs-system-button {
    margin-left: auto;
}
.kuad-checkout-login-notice .kuad-login-help-msg {
    display: block;
    width: 100%;
    color: var(--ks-secondary-color, #B55C80);
    font-size: 13px;
    margin-top: 4px;
    flex-basis: 100%;
}
.kuad-checkout-login-notice.kuad-login-highlight {
    border-color: var(--ks-secondary-color, #B55C80) !important;
    background: rgba(var(--ks-secondary-rgb, 192, 90, 134), 0.18) !important;
}

/* Empty shipping list message */
.kuad-shipping-empty-msg {
    padding: 18px 16px;
    border-radius: var(--ks-input-radius, 12px);
    background: var(--ks-block-bg-alt, #F4F4F6);
    text-align: center;
}
.kuad-shipping-empty-msg p {
    color: var(--ks-text-color, #333333);
    font-size: 14px;
    margin: 0;
}

/* Attention pulse */
@keyframes ksAttentionPulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(var(--ks-secondary-rgb, 192, 90, 134), 0.55); }
    50% { box-shadow: 0 0 0 10px rgba(var(--ks-secondary-rgb, 192, 90, 134), 0); }
}
.ks-attention-pulse {
    animation: ksAttentionPulse 0.6s ease-out 2;
    border-color: var(--ks-secondary-color, #C05A86) !important;
}

/* Gateway nested fields */
.kuad-gateway-fields-container {
    margin: 12px 0 8px 0;
    padding: 16px 20px;
    background: var(--ks-block-bg-alt, #F6F7FA);
    border-radius: var(--ks-card-radius, 14px);
    border: 1.5px solid rgba(var(--ks-primary-rgb, 45, 26, 104), 0.12);
}
.kuad-gateway-fields-container fieldset { border: none !important; padding: 0 !important; margin: 0 !important; }
.kuad-gateway-fields-container legend { display: none !important; }
.kuad-gateway-fields-container p {
    color: var(--ks-text-muted, #4A5568);
    font-size: 14px;
    line-height: 1.5;
    margin: 0 0 8px 0;
}
.kuad-gateway-fields-container input[type="text"],
.kuad-gateway-fields-container input[type="tel"],
.kuad-gateway-fields-container input[type="number"],
.kuad-gateway-fields-container select {
    width: 100%;
    height: 48px;
    min-height: 48px;
    border-radius: var(--ks-input-radius, 12px);
    border: 1.5px solid rgba(var(--ks-primary-rgb, 45, 26, 104), 0.15);
    padding: 0 16px;
    font-size: 15px;
    color: var(--ks-text-color, #333333);
    background: var(--ks-card-bg, #ffffff);
    box-sizing: border-box;
    font-family: inherit;
}
.kuad-gateway-fields-container .wc-bacs-form { margin-top: 6px; }
.kuad-gateway-fields-container code,
.kuad-gateway-fields-container pre {
    background: var(--ks-block-bg-alt, #EDE9FE);
    padding: 2px 8px;
    border-radius: 6px;
    font-size: 13px;
    color: var(--ks-primary-color, #2D1A68);
}

/* Coupon Form Alignment & Applied Badges */
.kuad-checkout-coupon-box {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    margin: 20px 0 12px 0 !important;
}
.kuad-checkout-coupon-box #kuad-checkout-coupon-code {
    flex: 1 !important;
    height: 48px !important;
    min-height: 48px !important;
    max-height: 48px !important;
    line-height: 48px !important;
    border-radius: var(--ks-input-radius, 12px) !important;
    border: 1.5px solid rgba(var(--ks-primary-rgb, 45, 26, 104), 0.15) !important;
    background: var(--ks-card-bg, #ffffff) !important;
    color: var(--ks-text-color, #333333) !important;
    box-sizing: border-box !important;
}
.kuad-checkout-coupon-box #kuad-btn-apply-coupon,
.kuad-checkout-coupon-box .ks-global-inputs-system-button {
    height: 48px !important;
    min-height: 48px !important;
    max-height: 48px !important;
    line-height: 48px !important;
    padding: 0 22px !important;
    border-radius: var(--ks-button-radius, 12px) !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    white-space: nowrap !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    cursor: pointer !important;
    background: var(--ks-button-bg-color, var(--ks-primary-color, #403A60)) !important;
    color: var(--ks-button-text-color, #ffffff) !important;
    border: 1.5px solid var(--ks-button-border-color, var(--ks-primary-color, #403A60)) !important;
    transition: all 0.2s ease !important;
}
.kuad-checkout-coupon-box #kuad-btn-apply-coupon:hover,
.kuad-checkout-coupon-box .ks-global-inputs-system-button:hover {
    background: var(--ks-button-hover-bg-color, #ffffff) !important;
    color: var(--ks-button-hover-text-color, var(--ks-primary-color, #403A60)) !important;
    border-color: var(--ks-button-hover-border-color, var(--ks-primary-color, #403A60)) !important;
}
#kuad-checkout-coupon-msg { margin-bottom: 12px; }
#kuad-checkout-coupon-msg:empty { display: none; }
.coupon-applied-pill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: rgba(var(--ks-accent-rgb, 27, 165, 157), 0.08);
    border: 1px solid rgba(var(--ks-accent-rgb, 27, 165, 157), 0.35);
    padding: 4px 10px;
    border-radius: var(--ks-input-radius, 8px);
    color: var(--ks-accent-color, #166534);
    font-weight: 600;
}
.kuad-btn-remove-coupon {
    background: transparent;
    border: none;
    color: var(--ks-secondary-color, #C05A86);
    font-size: 18px;
    font-weight: 700;
    line-height: 1;
    cursor: pointer;
    padding: 0 2px;
    transition: color 0.2s ease;
}
.kuad-btn-remove-coupon:hover {
    color: var(--ks-button-remove-bg-color, #e53e3e);
}

/* Inline Validation Messages & Attention Shake */
.kuad-field-error-msg {
    color: #e53e3e;
    font-size: 12.5px;
    font-weight: 600;
    margin-top: 4px;
    display: flex;
    align-items: center;
    gap: 5px;
    animation: kuadFieldFadeIn 0.2s ease-out;
}
@keyframes kuadFieldFadeIn {
    from { opacity: 0; transform: translateY(-3px); }
    to   { opacity: 1; transform: translateY(0); }
}
@keyframes ksFieldShake {
    0%, 100% { transform: translateX(0); }
    20%, 60% { transform: translateX(-6px); }
    40%, 80% { transform: translateX(6px); }
}
.ks-field-shake {
    animation: ksFieldShake 0.4s ease-in-out;
}

/* In-flow notification system */
.kuad-notif-bar {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 16px 20px;
    border-radius: var(--ks-card-radius, 14px);
    margin: 18px 0 10px 0;
    font-size: 14px;
    line-height: 1.5;
    animation: kuadNotifFadeIn .25s ease-out both;
}
.kuad-notif-bar.kuad-notif-error {
    background: rgba(229, 62, 62, 0.06);
    border: 1.5px solid rgba(229, 62, 62, 0.3);
    color: #c53030;
}
.kuad-notif-bar.kuad-notif-warning {
    background: rgba(237, 137, 54, 0.06);
    border: 1.5px solid rgba(237, 137, 54, 0.3);
    color: #9c4221;
}
.kuad-notif-bar.kuad-notif-success {
    background: rgba(56, 161, 105, 0.06);
    border: 1.5px solid rgba(56, 161, 105, 0.3);
    color: #276749;
}
.kuad-notif-bar .notif-icon {
    font-size: 24px;
    width: 24px;
    height: 24px;
    flex-shrink: 0;
    margin-top: 1px;
}
.kuad-notif-bar.kuad-notif-error .notif-icon { color: #e53e3e; }
.kuad-notif-bar.kuad-notif-warning .notif-icon { color: #ed8936; }
.kuad-notif-bar.kuad-notif-success .notif-icon { color: #38a169; }
.kuad-notif-bar .notif-body { flex: 1; }
.kuad-notif-bar .notif-title { font-weight: 700; margin: 0 0 2px 0; font-size: 14px; }
.kuad-notif-bar .notif-text { margin: 0; font-size: 13px; opacity: 0.88; }
.kuad-notif-bar .notif-close {
    background: none;
    border: none;
    cursor: pointer;
    color: inherit;
    opacity: 0.5;
    font-size: 20px;
    padding: 0 4px;
    flex-shrink: 0;
    transition: opacity .15s;
}
.kuad-notif-bar .notif-close:hover { opacity: 1; }
@keyframes kuadNotifFadeIn {
    from { opacity: 0; transform: translateY(-6px); }
    to   { opacity: 1; transform: translateY(0); }
}

.kuad-step-extras-when-empty { display: none !important; }

/* Step 5: Order Confirmation & High-Contrast Typography */
.kuad-checkout-success-banner {
    text-align: center !important;
    padding: 36px 20px 24px 20px !important;
    color: var(--ks-text-color, #2D3748) !important;
}
.kuad-checkout-success-banner .success-icon {
    font-size: 76px !important;
    width: 76px !important;
    height: 76px !important;
    color: var(--ks-accent-color, #1BA59D) !important;
    margin: 0 auto 16px auto !important;
    display: inline-block !important;
}
.kuad-checkout-success-banner h3,
.kuad-checkout-success-banner .kuad-success-title {
    font-size: 26px !important;
    font-weight: 800 !important;
    color: var(--ks-heading-color, var(--ks-primary-color, #2D1A68)) !important;
    font-family: var(--ks-heading-font, inherit) !important;
    margin: 0 0 10px 0 !important;
    line-height: 1.3 !important;
}
.kuad-checkout-success-banner p,
.kuad-checkout-success-banner #kuad-success-msg-text {
    font-size: 16px !important;
    font-weight: 500 !important;
    color: var(--ks-text-muted, #4A5568) !important;
    line-height: 1.6 !important;
    max-width: 540px !important;
    margin: 0 auto 18px auto !important;
}
.kuad-order-info-badge {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    padding: 12px 28px !important;
    background: rgba(var(--ks-accent-rgb, 27, 165, 157), 0.08) !important;
    border: 1.5px solid rgba(var(--ks-accent-rgb, 27, 165, 157), 0.35) !important;
    border-radius: var(--ks-card-radius, 14px) !important;
    color: var(--ks-accent-color, #166534) !important;
    font-size: 17px !important;
    font-weight: 800 !important;
    margin: 12px 0 10px 0 !important;
    box-shadow: 0 2px 8px rgba(var(--ks-accent-rgb, 27, 165, 157), 0.1) !important;
}
.kuad-payment-status-pill {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    padding: 10px 22px !important;
    border-radius: var(--ks-input-radius, 12px) !important;
    font-size: 14.5px !important;
    font-weight: 600 !important;
    margin: 8px auto 14px auto !important;
    line-height: 1.4 !important;
}
.kuad-payment-status-pill .dashicons {
    font-size: 18px !important;
    width: 18px !important;
    height: 18px !important;
}
.kuad-payment-status-pill.kuad-status-pending {
    background: #FFFBEB !important;
    border: 1.5px solid #FDE68A !important;
    color: #92400E !important;
}
.kuad-payment-status-pill.kuad-status-approved {
    background: rgba(var(--ks-accent-rgb, 27, 165, 157), 0.08) !important;
    border: 1.5px solid rgba(var(--ks-accent-rgb, 27, 165, 157), 0.35) !important;
    color: var(--ks-accent-color, #166534) !important;
}
.kuad-checkout-success-banner .order-thanks-note {
    font-size: 15px !important;
    color: var(--ks-text-muted, #4A5568) !important;
    font-weight: 500 !important;
    max-width: 520px !important;
    margin: 8px auto 24px auto !important;
    line-height: 1.6 !important;
}

/* Mobile Sticky / Floating Order Summary Bar */
.kuad-mobile-sticky-summary { display: none !important; }
@media (max-width: 640px) {
    .kuad-mobile-sticky-summary { display: none !important; }
    .kuad-checkout-flow-wrapper[data-current-step="2"] .kuad-mobile-sticky-summary,
    .kuad-checkout-flow-wrapper[data-current-step="3"] .kuad-mobile-sticky-summary,
    .kuad-checkout-flow-wrapper[data-current-step="4"] .kuad-mobile-sticky-summary {
        display: flex !important;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        padding: 10px 14px;
        background: var(--ks-card-bg, #FFFFFF);
        border: 1px solid rgba(var(--ks-primary-rgb, 45, 26, 104), 0.12);
        border-radius: var(--ks-input-radius, 12px);
        box-shadow: var(--ks-card-shadow, 0 3px 10px rgba(var(--ks-primary-rgb, 45, 26, 104), 0.08));
        margin: 0 0 16px 0;
        font-size: 14px;
        width: 100%;
        box-sizing: border-box;
    }
    .kuad-mobile-sticky-summary .summary-label {
        font-weight: 600;
        color: var(--ks-heading-color, var(--ks-primary-color, #2D1A68));
        display: flex;
        align-items: center;
        gap: 6px;
    }
    .kuad-mobile-sticky-summary .summary-amount {
        font-weight: 800;
        color: var(--ks-accent-color, #1BA59D);
        font-size: 16px;
    }
    .kuad-mobile-sticky-summary .btn-view-cart-mini {
        background: var(--ks-block-bg-alt, #F4F1FA);
        border: 1px solid rgba(var(--ks-primary-rgb, 45, 26, 104), 0.15);
        color: var(--ks-primary-color, #2D1A68);
        font-weight: 600;
        font-size: 13px;
        cursor: pointer;
        padding: 6px 12px;
        border-radius: var(--ks-button-radius, 8px);
        min-height: 36px;
        display: inline-flex;
        align-items: center;
        transition: all 0.2s ease;
    }
    .kuad-mobile-sticky-summary .btn-view-cart-mini:hover,
    .kuad-mobile-sticky-summary .btn-view-cart-mini:active {
        background: var(--ks-primary-color, #2D1A68);
        color: var(--ks-on-primary-text, #FFFFFF);
    }
}
