/* =====================================
   Sampad PRO 1405 Wizard Styles
===================================== */



/* Step Management */


.step {

    display:none;

}


.step.active {

    display:block;

}






/* Grade Selection */


.grade-grid {


    grid-template-columns:

    repeat(1,1fr);


}



.grade-card {


    position:relative;


    border:

    2px solid transparent;


}



.grade-card:hover {


    border-color:#2563eb;


}



.grade-card:active {


    transform:scale(.98);


}








/* Course Info */


#courseInfo {


    background:#f8fafc;


    border-radius:22px;


    padding:25px;


    margin:

    20px 0;


}



#courseInfo h3 {


    color:#2563eb;


}








/* Payment Section */


#payments {


    display:flex;


    flex-direction:column;


    gap:15px;


}







.payment-card {


    position:relative;


    background:#fff;


    border:

    2px solid #e2e8f0;


}



.payment-card h3 {


    margin-top:0;


}



.payment-card div {


    font-size:22px;


    font-weight:700;


    color:#2563eb;


}






.payment-card:hover {


    border-color:#2563eb;


    transform:

    translateY(-3px);


}






.payment-card.selected {


    border-color:#2563eb;


    background:#eff6ff;


}





.payment-card.selected::after {


    content:"✓";


    position:absolute;


    left:20px;


    top:20px;


    width:30px;


    height:30px;


    border-radius:50%;


    background:#2563eb;


    color:white;


    display:flex;


    align-items:center;


    justify-content:center;


}








/* Price Highlight */


.price-box {


    background:

    linear-gradient(

    135deg,

    #eff6ff,

    #ffffff

    );


    border-radius:25px;


    padding:25px;


    text-align:center;


}



.price-box .old-price {


    text-decoration:line-through;


    color:#94a3b8;


}



.price-box .new-price {


    font-size:32px;


    font-weight:bold;


    color:#2563eb;


}







/* Installment Table */


.installments {


    margin-top:20px;


    border-radius:20px;


    overflow:hidden;


    border:

    1px solid #e2e8f0;


}



.installment-row {


    display:grid;


    grid-template-columns:max-content max-content max-content;


    justify-content:space-between;


    align-items:center;


    gap:8px;


    padding:15px;


    background:#fff;


    border-bottom:

    1px solid #e2e8f0;


}



.installment-row:last-child {


    border-bottom:none;


}








/* Gift Badge */


.gift-badge {


    display:inline-block;


    background:#fef3c7;


    color:#92400e;


    padding:

    8px 15px;


    border-radius:50px;


    font-size:14px;


    margin-bottom:15px;


}








/* Progress */


.wizard-progress {


    font-weight:bold;


    transition:.3s;


}







/* Mobile Touch */


.grade-card,


.payment-card {


    min-height:120px;


    touch-action:manipulation;


}


.installment-row span {

    white-space:nowrap;

}


.wizard-restart {

    display:block;
    margin:12px auto 8px;
    padding:10px 16px;
    border:1px solid #bfdbfe;
    border-radius:999px;
    background:#eff6ff;
    color:#1d4ed8;
    font-family:inherit;
    font-size:13px;
    font-weight:800;
    cursor:pointer;
    box-shadow:0 8px 20px rgba(37,99,235,.08);

}


.wizard-restart:hover,
.wizard-restart:focus-visible {

    border-color:#2563eb;
    outline:3px solid rgba(37,99,235,.14);

}


.selected-grade-bar {

    position:sticky;
    top:78px;
    z-index:40;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    margin:12px 0 10px;
    padding:10px 12px;
    border:1px solid #bfdbfe;
    border-radius:16px;
    background:rgba(239,246,255,.96);
    color:#1e3a8a;
    font-size:13px;
    font-weight:700;
    box-shadow:0 12px 28px rgba(15,23,42,.08);
    backdrop-filter:blur(8px);

}


.selected-grade-bar[hidden] {

    display:none !important;

}


.selected-grade-bar strong {

    color:#1d4ed8;

}


.selected-grade-bar button {

    flex:0 0 auto;
    border:0;
    border-radius:999px;
    padding:8px 12px;
    background:#2563eb;
    color:#fff;
    font-family:inherit;
    font-size:12px;
    font-weight:800;
    cursor:pointer;

}


.selected-grade-bar button:focus-visible {

    outline:3px solid rgba(37,99,235,.18);
    outline-offset:2px;

}


.wizard-message {

    min-height:24px;
    margin:4px 0 8px;
    color:#b91c1c;
    text-align:center;
    font-size:14px;

}




/* Student Form */


.field-label {

    display:block;

    margin:
    6px 2px 6px;

    font-weight:700;

    color:#334155;

}


#step4 input {

    margin-bottom:4px;

}


#step4 input:focus {

    border-color:#2563eb;

    outline:
    3px solid rgba(37,99,235,.13);

}


#step4 input.input-invalid {

    border-color:#dc2626;

    outline:
    3px solid rgba(220,38,38,.1);

}


.field-error {

    min-height:28px;

    margin-bottom:7px;

    color:#b91c1c;

    font-size:14px;

}


#activate {

    width:100%;

    position:relative;

}


#activate:disabled {

    cursor:wait;

    opacity:.7;

    transform:none;

    box-shadow:none;

}


.form-status {

    min-height:30px;

    margin-top:12px;

    padding:0 4px;

    text-align:center;

    font-size:14px;

}


.form-status.loading {

    color:#475569;

}


.form-status.error {

    color:#b91c1c;

}


.form-status.success {

    color:#15803d;

}


/* Payment selection clarity */

#payments {

    align-items:stretch;

}


.payment-card {

    display:flex;
    flex-direction:column;
    height:100%;
    margin-bottom:0;
    cursor:pointer;
    outline:none;

}


.payment-card:focus-visible {

    border-color:#2563eb;
    box-shadow:0 0 0 4px rgba(37,99,235,.13);

}


.payment-card .payment-price {

    margin:8px 0;
    font-size:22px;
    font-weight:700;
    color:#2563eb;

}

.payment-card-summary {

    margin:0 0 8px;
    color:#475569;
    font-size:13px;
    font-weight:600;
    line-height:1.8;

}

.cash-price-block {

    display:flex;
    flex-direction:column;
    align-items:center;
    gap:3px;
    margin:8px 0;

}

.cash-price-label,
.cash-special-label {

    color:#64748b;
    font-size:12px;
    font-weight:600;

}

.cash-original-price {

    color:#94a3b8;
    font-size:16px;
    text-decoration-color:#ef4444;
    text-decoration-thickness:2px;

}

.cash-final-price {

    margin:0 !important;
    font-size:26px !important;

}

.cash-discount-badge {

    margin-top:5px;
    padding:4px 10px;
    border-radius:99px;
    color:#166534;
    background:#dcfce7;
    font-size:12px;
    font-weight:800;

}


.payment-card .payment-count {

    font-size:16px;
    font-weight:700;
    color:#2563eb;

}


.payment-card .payment-card-action {

    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    margin-top:auto;
    padding-top:18px;
    color:#475569;
    font-size:14px;
    font-weight:700;

}


.payment-card .payment-card-check {

    width:24px;
    height:24px;
    border:2px solid #94a3b8;
    border-radius:50%;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    color:transparent;
    background:#fff;
    font-size:15px;

}


.payment-card.selected .payment-card-action {

    color:#1d4ed8;

}


.payment-card.selected .payment-card-check {

    border-color:#2563eb;
    background:#2563eb;
    color:#fff;

}


.payment-card.selected::after {

    display:none;

}


.payment-help {

    margin:16px 0 10px;
    color:#64748b;
    text-align:center;
    font-size:14px;

}


.payment-continue {

    width:100%;

}


.payment-continue:disabled {

    background:#cbd5e1;
    cursor:not-allowed;
    transform:none;
    box-shadow:none;

}


.payment-card .installment-mobile-title {

    display:none;

}