/* IFD BuyCred Checkout Override - Custom Theme */

#buycred-checkout-wrapper { 
    display: none; 
}
#buycred-checkout-wrapper.open { 
    display: table; 
    position: fixed; 
    top: 0; 
    left: 0; 
    z-index: 999999; 
    width: 100%; 
    height: 100%; 
    overflow: hidden; 
    background-color: rgba(6, 11, 26, 0.75); /* Dark overlay (slightly bluish) */
    border: none; 
    padding: 0; 
    margin: 0; 
    text-align: center; 
}
#buycred-checkout-wrapper.open .checkout-inside { 
    display: table-cell; 
    vertical-align: middle; 
    text-align: center; 
    margin: 0 auto; 
}
#buycred-checkout-wrapper.open .checkout-inside .checkout-wrapper { 
    display: block; 
    margin: 0 auto; 
    text-align: left; 
    width: calc(100% - 52px); 
    max-width: 420px; 
    border: 0; 
    border-radius: 14px; 
    padding: 0; 
    background: linear-gradient(180deg, #ffffff 0%, #f7f9fc 100%); /* soft white card */
    box-shadow: 0 12px 40px rgba(3, 10, 30, 0.5); 
}
#buycred-checkout-wrapper.open .checkout-inside .checkout-wrapper #checkout-box { 
    border-radius: 12px; 
    overflow: hidden;
}
#buycred-checkout-wrapper.open .checkout-inside .checkout-wrapper #checkout-box .padded { 
    background-color: #ffffff; /* Inner content white */
    padding: 18px; 
    border-radius: 0; 
}
#buycred-checkout-wrapper.open .checkout-inside .checkout-wrapper #checkout-box .warning { 
    background-color: #ff7a59; /* warm orange */
    color: white; 
    padding: 12px; 
    text-align: center; 
    text-transform: uppercase; 
}

/* Tables and text */
#buycred-checkout-wrapper.open #checkout-box table, #buycred-checkout-page table { 
    border: none; 
    width: 100%; 
    font-size: 13px; 
    line-height: 18px; 
    text-align: left; 
    margin: 0 0 12px 0; 
    color: #162239;
}
#buycred-checkout-wrapper.open #checkout-box table tr th, #buycred-checkout-page table tr th { 
    font-weight: 700; 
    text-align: left; 
    font-size: 13px; 
    line-height: 17px; 
}
#buycred-checkout-wrapper.open #checkout-box table tr td, #buycred-checkout-page table tr td { 
    font-weight: 400; 
    font-size: 13px; 
    line-height: 18px; 
    text-align: left; 
}

/* Button - Primary */
#buycred-checkout-wrapper.open .checkout-inside .checkout-wrapper #checkout-box .checkout-footer button { 
    width: 100%; 
    border: none; 
    border-radius: 10px !important; 
    background: linear-gradient(135deg, #0ea5e9, #2563eb); /* vibrant blue gradient */
    color: #fff !important; 
    font-size: 15px; 
    font-weight: 700; 
    padding: 14px; 
    cursor: pointer; 
    transition: transform .18s ease, box-shadow .18s ease, opacity .18s ease; 
    box-shadow: 0 8px 22px rgba(37,99,235,0.18); 
}
#buycred-checkout-wrapper.open .checkout-inside .checkout-wrapper #checkout-box .checkout-footer button:hover { 
    transform: translateY(-3px); 
    box-shadow: 0 12px 28px rgba(37,99,235,0.22); 
    opacity: 0.98;
}
#buycred-checkout-wrapper.open .checkout-inside .checkout-wrapper #checkout-box .checkout-footer button:active { 
    transform: translateY(0); 
    box-shadow: 0 6px 14px rgba(37,99,235,0.16); 
}

/* Secondary small buttons (cancel) */
#buycred-checkout-wrapper.open .checkout-inside .checkout-wrapper #checkout-box .checkout-footer .cancel { 
    background: transparent; 
    color: #334155; 
    padding: 10px 12px; 
    border-radius: 8px; 
    border: 1px solid rgba(51,65,85,0.08); 
}

/* Loading indicator color */
.loading-indicator { 
    height: 5px; 
    width: 100%; 
    position: relative; 
    overflow: hidden; 
    background-color: #e6eefb; 
}
.loading-indicator:before { 
    display: block; 
    position: absolute; 
    content: ""; 
    left: -200px; 
    width: 200px; 
    height: 5px; 
    background-color: #60a5fa; 
    animation: loading 2s linear infinite; 
}
@keyframes loading { 
    from { left: -200px; width: 30%; } 
    25% { width: 50%; } 
    50% { width: 50%; } 
    70% { width: 50%; } 
    80% { left: 75%; } 
    95% { left: 100%; } 
    to { left: 100%; } 
}

@media only screen and (max-width: 480px) {
    #buycred-checkout-wrapper.open .checkout-inside .checkout-wrapper { max-width: 92%; width: calc(100% - 40px); }
    #buycred-checkout-wrapper.open .checkout-inside .checkout-wrapper #checkout-box .padded { padding: 14px; }
}
