/* ====================================================================
   TIERED BUNDLE UI CSS (v3 - Scoped to avoid Teleporter conflicts)
   ==================================================================== */

/* 1. Container Setup */
.enable-tiered-bundles .wcpa_field_wrap:not(.teleport-upsell):not(.teleport-bag) .wcpa_group_field {
    display: flex !important;
    flex-direction: column !important;
    gap: 28px !important; 
    width: 100% !important;
}

.enable-tiered-bundles .wcpa_field_wrap:not(.teleport-upsell):not(.teleport-bag) .wcpa_radio {
    position: relative !important;
    margin: 0 !important;
    width: 100% !important; 
    display: block !important;
}

/* 2. Hide Native Radio Button */
.enable-tiered-bundles .wcpa_field_wrap:not(.teleport-upsell):not(.teleport-bag) .wcpa_radio input[type="radio"] {
    display: none !important; 
}

/* 3. The Main Card Layout (The Label) */
.enable-tiered-bundles .wcpa_field_wrap:not(.teleport-upsell):not(.teleport-bag) .wcpa_radio label {
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    box-sizing: border-box !important;
    padding: 16px 20px !important;
    border: 2px solid #27ae60 !important; 
    border-radius: 8px !important;
    cursor: pointer !important;
    transition: all 0.2s ease-in-out !important;
    background: #ffffff !important;
    margin: 0 !important; 
    min-height: 85px !important; 
    height: 85px !important; 
}

/* 4. Active/Selected State */
.enable-tiered-bundles .wcpa_field_wrap:not(.teleport-upsell):not(.teleport-bag) .wcpa_radio.wcpa_selected label {
    background-color: #ccebd6 !important; 
    border-color: #27ae60 !important; 
}

/* 5. Custom Radio Circle */
.enable-tiered-bundles .wcpa_field_wrap:not(.teleport-upsell):not(.teleport-bag) .wcpa_check,
.enable-tiered-bundles .wcpa_field_wrap:not(.teleport-upsell):not(.teleport-bag) .wcpa_radio_custom {
    width: 22px !important;
    height: 22px !important;
    min-width: 22px !important;
    min-height: 22px !important;
    border: 2px solid #27ae60 !important; 
    border-radius: 50% !important; 
    margin-right: 15px !important;
    position: relative !important;
    flex-shrink: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.enable-tiered-bundles .wcpa_field_wrap:not(.teleport-upsell):not(.teleport-bag) .wcpa_check::before,
.enable-tiered-bundles .wcpa_field_wrap:not(.teleport-upsell):not(.teleport-bag) .wcpa_radio_custom::before {
    display: none !important;
}

.enable-tiered-bundles .wcpa_field_wrap:not(.teleport-upsell):not(.teleport-bag) .wcpa_radio.wcpa_selected .wcpa_check::after,
.enable-tiered-bundles .wcpa_field_wrap:not(.teleport-upsell):not(.teleport-bag) .wcpa_radio.wcpa_selected .wcpa_radio_custom::after {
    content: '' !important;
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 12px !important;
    height: 12px !important;
    background-color: #27ae60 !important; 
    border-radius: 50% !important;
}

/* 6. Typography & Layout */
.enable-tiered-bundles .wcpa_field_wrap:not(.teleport-upsell):not(.teleport-bag) .wcpa_radio span.card-title {
    font-weight: 700 !important;
    font-size: 16px !important;
    color: #000000 !important;
    flex: none !important; 
    margin-right: 12px !important; 
    text-transform: uppercase !important;
}

.enable-tiered-bundles .wcpa_field_wrap:not(.teleport-upsell):not(.teleport-bag) .per-unit-text {
    font-weight: 600 !important;
    font-size: 14px !important;
    color: #27ae60 !important;
    margin-right: auto !important; 
}

/* 7. Price Block */
.enable-tiered-bundles .wcpa_field_wrap:not(.teleport-upsell):not(.teleport-bag) .price-block {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-end !important;
    line-height: 1.2 !important;
    flex-shrink: 0 !important;
    margin-top: 6px !important; 
}

.enable-tiered-bundles .wcpa_field_wrap:not(.teleport-upsell):not(.teleport-bag) .price-block .final-price {
    font-weight: 700 !important;
    font-size: 18px !important;
    color: #000000 !important;
}

.enable-tiered-bundles .wcpa_field_wrap:not(.teleport-upsell):not(.teleport-bag) .price-block .strike-price {
    font-size: 14px !important;
    color: #777777 !important; 
    text-decoration: line-through !important;
    margin-top: 2px !important;
}

/* 8. The Badges */
.enable-tiered-bundles .wcpa_field_wrap:not(.teleport-upsell):not(.teleport-bag) .tier-badge {
    position: absolute !important;
    top: -12px !important; 
    right: 20px !important;
    padding: 4px 10px !important;
    border-radius: 4px !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    color: #ffffff !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    z-index: 10 !important;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1) !important; 
}

.enable-tiered-bundles .wcpa_field_wrap:not(.teleport-upsell):not(.teleport-bag) .tier-badge.badge-pop {
    background-color: #FF5B4A !important; 
}

.enable-tiered-bundles .wcpa_field_wrap:not(.teleport-upsell):not(.teleport-bag) .tier-badge.badge-val {
    background-color: #27ae60 !important; 
}