/* MITA Academy — Checkout page styles (matches the order/checkout design) */
.checkout-page{padding:48px 0 80px;min-height:70vh}
.checkout-page .container{max-width:1040px}
.checkout-logo{text-align:center;margin-bottom:24px}
.checkout-logo img{height:84px}

.co-banner{background:#FFF8E1;border:1px solid #F5C842;color:#B8860B;border-radius:12px;padding:13px 18px;margin-bottom:22px;display:flex;align-items:center;gap:10px;font-weight:600;font-size:14px}

.checkout-grid{display:grid;grid-template-columns:1fr 1.25fr;gap:28px;align-items:start;background:#fff;border:1px solid var(--border);border-radius:18px;padding:30px;box-shadow:0 10px 40px rgba(10,63,101,0.06)}

/* Left: customer */
.checkout-customer{background:#EEF0F8;border-radius:14px;padding:22px}
.co-field{margin-bottom:16px;text-align:right}
.co-field:last-child{margin-bottom:0}
.co-field label{display:block;font-size:13px;font-weight:700;color:var(--text2);margin-bottom:7px}
.co-field label span{color:#DC2626}
.co-field input,.co-field textarea{width:100%;padding:12px 14px;border:1px solid #fff;background:#fff;border-radius:8px;font-family:'Cairo',sans-serif;font-size:14px;outline:none;color:var(--text);transition:box-shadow .15s,border-color .15s}
.co-field input:focus,.co-field textarea:focus{border-color:var(--green);box-shadow:0 0 0 3px rgba(27,127,194,.12)}
.co-field textarea{resize:vertical;min-height:84px}
.co-invalid{border-color:#DC2626 !important;box-shadow:0 0 0 3px rgba(220,38,38,.12) !important}

/* Right: summary table */
.co-table{width:100%;border-collapse:collapse;border:1px solid var(--border);border-radius:10px;overflow:hidden;margin-bottom:24px}
.co-table thead th{background:var(--green-deeper);color:#fff;font-size:14px;font-weight:800;padding:14px 18px;text-align:right}
.co-table thead th:last-child{text-align:left}
.co-table tbody td,.co-table tfoot td{padding:14px 18px;border-top:1px solid var(--border);font-size:14px;color:var(--text)}
.co-table tbody td:last-child,.co-table tfoot td:last-child{text-align:left;font-weight:700}
.co-table tfoot td{font-weight:700;background:#F8FAFC}
.co-table .co-total td{font-size:16px;font-weight:900;color:var(--green-deeper)}
.co-qty{color:var(--muted);font-weight:400;font-size:13px}

/* Payment methods */
.co-pay{display:grid;gap:14px}
.co-method{display:flex;align-items:center;gap:12px;border:1.5px solid var(--border);border-radius:10px;padding:13px 16px;cursor:pointer;transition:border-color .15s,background .15s}
.co-method .co-method-name{font-weight:700;font-size:14px;color:var(--text)}
.co-method .co-cards{margin-inline-start:auto;display:flex;gap:8px;font-size:26px;line-height:1}
.co-method .co-cards .ti-brand-visa{color:#1A1F71}
.co-method .co-cards .ti-brand-mastercard{color:#EB001B}
.co-method input{accent-color:var(--green);width:17px;height:17px}
.co-method-active{border-color:var(--green);background:var(--green-pale)}
.co-method-soft{opacity:.85}

.co-hint{display:block;font-size:12px;color:var(--green-dark);margin-top:6px;font-weight:600}
.co-note{font-size:13px;color:var(--text2);background:#F8FAFC;border:1px dashed var(--border);border-radius:8px;padding:11px 14px;line-height:1.7}
.co-note[hidden],.co-hint[hidden],.co-frame-wrap[hidden]{display:none}

/* Paymob card iframe */
.co-frame-wrap{border:1.5px solid var(--border);border-radius:12px;overflow:hidden;background:#fff;min-height:420px}
.co-paymob-iframe{width:100%;height:560px;border:0;display:block}
@media(max-width:820px){.co-paymob-iframe{height:520px}}

/* Aman reference box on the result page */
.co-kiosk-ref{background:#FFF8E1;border:1px solid #F5C842;border-radius:12px;padding:16px 18px;margin-bottom:22px;text-align:center}
.co-kiosk-ref span{display:block;font-size:13px;color:#B8860B;margin-bottom:6px;font-weight:700}
.co-kiosk-ref strong{font-size:26px;letter-spacing:2px;color:var(--green-deeper);direction:ltr;display:inline-block}

.co-proceed{background:var(--green-deeper);color:#fff;justify-content:center;width:100%;font-size:16px;padding:15px;border-radius:10px;box-shadow:0 8px 20px rgba(10,63,101,.25)}
.co-proceed:hover:not(:disabled){background:var(--green-dark)}
.co-proceed:disabled{opacity:.55;cursor:not-allowed}
.co-message{font-size:14px;font-weight:600;text-align:center;min-height:18px}
.co-message-error{color:#DC2626}
.co-message-success{color:var(--accent)}
.co-message-info{color:var(--green-dark)}

/* Result page */
.checkout-result{display:flex;align-items:center}
.co-result-card{max-width:560px;margin:0 auto;background:#fff;border:1px solid var(--border);border-radius:18px;padding:44px 36px;text-align:center;box-shadow:0 12px 40px rgba(10,63,101,.08)}
.co-result-icon{font-size:64px;line-height:1;margin-bottom:14px}
.co-result-success .co-result-icon{color:var(--accent)}
.co-result-pending .co-result-icon{color:var(--gold)}
.co-result-failed .co-result-icon{color:#DC2626}
.co-result-card h1{font-size:26px;font-weight:900;margin-bottom:12px;color:var(--text)}
.co-result-card p{font-size:15px;color:var(--text2);line-height:1.9;margin-bottom:22px}
.co-result-meta{display:grid;gap:8px;background:#F8FAFC;border:1px solid var(--border);border-radius:12px;padding:16px 18px;margin-bottom:24px;text-align:right}
.co-result-meta > div{display:flex;justify-content:space-between;font-size:14px}
.co-result-meta span{color:var(--muted)}
.co-result-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}

@media(max-width:820px){
    .checkout-grid{grid-template-columns:1fr;padding:20px}
    .checkout-customer{order:2}
}