/**
 * Wallet Gateway — Checkout styles.
 * Uses high specificity to prevent theme/page-builder overrides.
 *
 * @package Wallet_Gateway
 */

/* ─── Main container ─── */
.woocommerce .wallet-checkout-box,
.woocommerce-checkout .wallet-checkout-box,
.wallet-checkout-box {
    background: #f0faf5 !important;
    border: 1px solid #1a8c5b !important;
    border-radius: 12px !important;
    margin: 10px 0 !important;
    overflow: hidden !important;
    padding: 0 !important;
    box-sizing: border-box !important;
}

/* ─── Supported wallets strip ─── */
.wallet-checkout-box .wallet-providers {
    padding: 16px 20px 12px !important;
    text-align: center !important;
}

.wallet-checkout-box .wallet-providers-label {
    margin: 0 0 10px !important;
    font-weight: 600 !important;
    color: #1a8c5b !important;
    font-size: 14px !important;
}

.wallet-checkout-box .wallet-logos {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: 6px !important;
}

/* ─── Wallet brand badges ─── */
.wallet-checkout-box .wallet-badge {
    display: inline-block !important;
    padding: 4px 10px !important;
    border-radius: 20px !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    color: #fff !important;
    line-height: 1.4 !important;
    white-space: nowrap !important;
}

.wallet-checkout-box .wallet-vodafone  { background: #e60000 !important; }
.wallet-checkout-box .wallet-etisalat  { background: #009639 !important; }
.wallet-checkout-box .wallet-orange    { background: #ff6600 !important; }
.wallet-checkout-box .wallet-wepay     { background: #6f2c91 !important; }
.wallet-checkout-box .wallet-cib       { background: #003da5 !important; }
.wallet-checkout-box .wallet-bm        { background: #1a3668 !important; }
.wallet-checkout-box .wallet-nbe       { background: #006838 !important; }
.wallet-checkout-box .wallet-fawry     { background: #f5a623 !important; color: #333 !important; }
.wallet-checkout-box .wallet-alexbank  { background: #0072bc !important; }
.wallet-checkout-box .wallet-meeza     { background: #00a651 !important; }

/* ─── Payment details ─── */
.woocommerce .wallet-checkout-box .wallet-details,
.wallet-checkout-box .wallet-details {
    padding: 0 20px 10px !important;
    text-align: center !important;
}

/* ─── Account details card ─── */
.wallet-checkout-box .wallet-account-card {
    background: #fff !important;
    border-radius: 8px !important;
    padding: 14px !important;
    text-align: left !important;
    font-size: 14px !important;
    line-height: 1.8 !important;
    border: 1px solid #c8e6d8 !important;
    color: #333 !important;
}

.wallet-checkout-box .wallet-number-row,
.wallet-checkout-box .wallet-name-row,
.wallet-checkout-box .wallet-amount-row {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    flex-wrap: wrap !important;
}

.wallet-checkout-box .wallet-account-card .wallet-number {
    color: #1a8c5b !important;
    font-weight: 700 !important;
    font-size: 18px !important;
    letter-spacing: 1px !important;
    font-family: 'Courier New', Courier, monospace !important;
}

.wallet-checkout-box .wallet-account-card .wallet-amount {
    color: #e8612d !important;
    font-weight: 700 !important;
}

/* ─── Fields area ─── */
.wallet-checkout-box .wallet-fields {
    padding: 0 20px 20px !important;
    text-align: left !important;
}

.wallet-checkout-box .wallet-field-group {
    margin-top: 14px !important;
}

.wallet-checkout-box .wallet-field-group:first-child {
    margin-top: 0 !important;
}

.wallet-checkout-box .wallet-field-group label,
.woocommerce .wallet-checkout-box .wallet-field-group label,
.elementor-widget-woocommerce-checkout-page .wallet-checkout-box label {
    font-size: 13px !important;
    font-weight: 600 !important;
    color: #333 !important;
    display: block !important;
    margin-bottom: 4px !important;
}

.wallet-checkout-box .wallet-field-group input[type="text"],
.woocommerce .wallet-checkout-box input[type="text"] {
    width: 100% !important;
    padding: 10px !important;
    border: 1px solid #ccc !important;
    border-radius: 6px !important;
    font-size: 14px !important;
    background: #fff !important;
    color: #333 !important;
    box-sizing: border-box !important;
    height: auto !important;
}

.wallet-checkout-box .wallet-field-group input[type="file"],
.woocommerce .wallet-checkout-box input[type="file"] {
    width: 100% !important;
    padding: 8px !important;
    border: 1px solid #ccc !important;
    border-radius: 6px !important;
    font-size: 14px !important;
    background: #fff !important;
    color: #333 !important;
    box-sizing: border-box !important;
    height: auto !important;
}

.wallet-checkout-box .wallet-upload-status {
    margin-top: 6px !important;
    font-size: 12px !important;
}

.wallet-checkout-box .wallet-upload-status .uploading {
    color: #1a8c5b !important;
}

.wallet-checkout-box .wallet-upload-status .success {
    color: #27ae60 !important;
    font-weight: 600 !important;
}

.wallet-checkout-box .wallet-upload-status .error {
    color: #c00 !important;
}

.wallet-checkout-box .wallet-field-hint {
    font-size: 11px !important;
    color: #888 !important;
    margin: 4px 0 0 !important;
}

/* ─── Thank-you page ─── */
.woocommerce .wallet-thankyou,
.wallet-thankyou {
    background: #f0faf5 !important;
    border: 1px solid #1a8c5b !important;
    border-radius: 12px !important;
    padding: 20px !important;
    margin: 20px 0 !important;
}

.wallet-thankyou h3 {
    color: #1a8c5b !important;
    margin-top: 0 !important;
}