/* STORE90 Payments V2 — scoped fix
   جميع قواعد Checkout محصورة داخل .checkout-page لمنع تعارض الأسماء العامة.
*/

/* ===== Checkout ===== */
.checkout-page{
    --co-primary:var(--s90-primary,#0d63f3);
    --co-primary-dark:var(--s90-primary-dark,#094fc4);
    --co-ink:var(--s90-ink,#132238);
    --co-muted:var(--s90-muted,#6f7c8e);
    --co-bg:var(--s90-bg,#f6f8fb);
    --co-line:var(--s90-line,#e7ebf1);
    --co-success:var(--s90-success,#14a673);

    min-height:72vh;
    padding:24px 0 44px;
    background:var(--co-bg);
    position:relative;
    isolation:isolate;
}

/* منع أي pseudo-element قديم أو متعارض من رسم طبقات فوق الصفحة */
.checkout-page::before,
.checkout-page::after,
.checkout-page .checkout-shell::before,
.checkout-page .checkout-shell::after,
.checkout-page .checkout-grid::before,
.checkout-page .checkout-grid::after,
.checkout-page .checkout-card::before,
.checkout-page .checkout-card::after,
.checkout-page .order-card::before,
.checkout-page .order-card::after{
    content:none!important;
    display:none!important;
}

.checkout-page .checkout-shell{
    width:min(1380px,calc(100% - 32px));
    margin-inline:auto;
    position:relative;
    z-index:1;
}

.checkout-page .checkout-title{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    margin-bottom:16px;
    position:relative;
    z-index:2;
}

.checkout-page .checkout-title-main{
    display:flex;
    align-items:center;
    gap:12px;
}

.checkout-page .checkout-title-icon,
.checkout-page .section-icon{
    display:grid;
    place-items:center;
    background:#eef5ff;
    color:var(--co-primary);
}

.checkout-page .checkout-title-icon{
    width:46px;
    height:46px;
    flex:0 0 46px;
    border-radius:14px;
    font-size:19px;
}

.checkout-page .checkout-title h1{
    margin:0;
    color:var(--co-ink);
    font-size:26px;
    font-weight:950;
}

.checkout-page .checkout-title p{
    margin:4px 0 0;
    color:var(--co-muted);
    font-size:12px;
}

.checkout-page .checkout-secure-pill{
    display:flex;
    align-items:center;
    gap:7px;
    min-height:40px;
    padding:8px 13px;
    background:#eefaf4;
    color:#15854b;
    border:1px solid #d7f0e2;
    border-radius:999px;
    font-size:11px;
    font-weight:850;
}

/* التخطيط */
.checkout-page .checkout-grid{
    display:grid;
    grid-template-columns:minmax(0,1.5fr) minmax(330px,.72fr);
    gap:18px;
    align-items:start;
    position:relative;
    z-index:2;
}

.checkout-page .checkout-card,
.checkout-page .order-card{
    position:relative;
    background:#fff!important;
    border:1px solid var(--co-line)!important;
    border-radius:18px!important;
    box-shadow:0 10px 30px rgba(24,42,72,.07)!important;
    overflow:hidden!important;
    transform:none!important;
    opacity:1!important;
}

.checkout-page .checkout-card{
    min-width:0;
}

.checkout-page .card-section{
    padding:18px 20px;
    background:#fff;
}

.checkout-page .card-section + .card-section{
    border-top:1px solid var(--co-line);
}

.checkout-page .section-heading{
    display:flex;
    align-items:center;
    gap:10px;
    margin-bottom:13px;
}

.checkout-page .section-icon{
    width:38px;
    height:38px;
    flex:0 0 38px;
    border-radius:11px;
    font-size:15px;
}

.checkout-page .section-heading h2{
    margin:0;
    color:var(--co-ink);
    font-size:16px;
    font-weight:950;
}

.checkout-page .section-heading p{
    margin:3px 0 0;
    color:var(--co-muted);
    font-size:11px;
}

/* الحقول */
.checkout-page .checkout-form .form-label{
    margin-bottom:6px;
    color:#4a576a;
    font-size:11px;
    font-weight:850;
}

.checkout-page .checkout-form .form-control,
.checkout-page .checkout-form input:not([type="radio"]),
.checkout-page .checkout-form select,
.checkout-page .checkout-form textarea{
    min-height:44px;
    padding:10px 12px;
    background:#fafbfd;
    color:var(--co-ink);
    border:1px solid #dfe5ec;
    border-radius:10px;
    box-shadow:none;
    transition:.18s ease;
}

.checkout-page .checkout-form textarea{
    min-height:90px;
}

.checkout-page .checkout-form .form-control:focus,
.checkout-page .checkout-form input:not([type="radio"]):focus,
.checkout-page .checkout-form select:focus,
.checkout-page .checkout-form textarea:focus{
    background:#fff;
    border-color:#9ec0fb;
    box-shadow:0 0 0 3px rgba(13,99,243,.07);
    outline:0;
}

/* طرق الدفع */
.checkout-page .payment-methods{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:9px;
}

.checkout-page .payment-card-option{
    position:relative;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    min-height:64px;
    padding:10px 12px;
    background:#fff;
    border:1px solid var(--co-line);
    border-radius:12px;
    cursor:pointer;
    transition:.18s ease;
    overflow:hidden;
}

.checkout-page .payment-card-option:hover{
    border-color:#b9cff3;
    box-shadow:0 5px 16px rgba(15,33,58,.045);
    transform:translateY(-1px);
}

.checkout-page .payment-card-option:has(.form-check-input:checked){
    background:#f4f8ff;
    border-color:var(--co-primary);
    box-shadow:0 0 0 2px rgba(13,99,243,.06);
}

.checkout-page .card-info-group{
    display:flex;
    align-items:center;
    gap:10px;
    min-width:0;
}

.checkout-page .payment-logo-box{
    width:54px!important;
    height:36px!important;
    flex:0 0 54px;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
    padding:4px;
    background:#fff;
    border:1px solid #e2e7ed;
    border-radius:8px;
}

.checkout-page .payment-logo-box img{
    width:100%!important;
    height:100%!important;
    max-width:100%!important;
    max-height:100%!important;
    object-fit:contain!important;
    display:block!important;
}

.checkout-page .payment-name{
    min-width:0;
    color:var(--co-ink);
    font-size:12px;
    font-weight:900;
    line-height:1.35;
}

.checkout-page .payment-methods .form-check-input{
    appearance:none;
    -webkit-appearance:none;
    width:19px;
    height:19px;
    flex:0 0 19px;
    margin:0;
    position:relative;
    background:#fff;
    border:2px solid #cbd4de;
    border-radius:50%;
    cursor:pointer;
}

.checkout-page .payment-methods .form-check-input:checked{
    border-color:var(--co-primary);
}

.checkout-page .payment-methods .form-check-input:checked::after{
    content:"";
    position:absolute;
    inset:3px;
    border-radius:50%;
    background:var(--co-primary);
}

/* زر التأكيد */
.checkout-page .btn-submit{
    width:100%;
    min-height:49px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    padding:11px 16px;
    border:0;
    border-radius:11px;
    background:var(--co-primary);
    color:#fff;
    font-size:14px;
    font-weight:950;
    transition:.18s ease;
}

.checkout-page .btn-submit:hover{
    background:var(--co-primary-dark);
    color:#fff;
    transform:translateY(-1px);
    box-shadow:0 9px 22px rgba(13,99,243,.20);
}

.checkout-page .submit-note{
    margin-top:8px;
    color:var(--co-muted);
    text-align:center;
    font-size:10px;
}

/* ملخص الطلب */
.checkout-page .order-card{
    position:sticky;
    top:96px;
    align-self:start;
    z-index:3;
}

.checkout-page .order-card-head{
    position:relative;
    padding:17px 18px 13px;
    background:linear-gradient(135deg,#0b55c9,#0d63f3)!important;
    border-radius:0!important;
    overflow:hidden;
}

/* إلغاء أي دوائر/أشكال قديمة في رأس البطاقة */
.checkout-page .order-card-head::before,
.checkout-page .order-card-head::after{
    content:none!important;
    display:none!important;
}

.checkout-page .order-card-head h3{
    margin:0;
    color:#fff;
    font-size:18px;
    font-weight:950;
    position:relative;
    z-index:1;
}

.checkout-page .order-card-head p{
    margin:4px 0 0;
    color:rgba(255,255,255,.72);
    font-size:11px;
    position:relative;
    z-index:1;
}

.checkout-page .order-card-body{
    padding:7px 18px 18px;
    background:#fff;
}

.checkout-page .order-item{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
    padding:10px 0;
    border-bottom:1px solid var(--co-line);
}

.checkout-page .order-item:last-child{
    border-bottom:0;
}

.checkout-page .item-name{
    color:var(--co-ink);
    font-size:12px;
    font-weight:850;
    line-height:1.5;
}

.checkout-page .item-quantity{
    margin-right:4px;
    color:var(--co-muted);
    font-size:10px;
}

.checkout-page .item-price{
    color:var(--co-ink);
    font-size:12px;
    font-weight:950;
    white-space:nowrap;
}

.checkout-page .summary-list{
    padding-top:8px;
    border-top:1px solid var(--co-line);
}

.checkout-page .summary-row{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:7px 0;
    font-size:12px;
}

.checkout-page .summary-row .label{
    color:var(--co-muted);
}

.checkout-page .summary-row .value{
    color:var(--co-ink);
    font-weight:850;
}

.checkout-page .summary-row.total{
    margin-top:5px;
    padding-top:13px;
    border-top:1px dashed #d8e0e8;
}

.checkout-page .summary-row.total .label{
    color:var(--co-ink);
    font-size:14px;
    font-weight:950;
}

.checkout-page .summary-row.total .value{
    color:var(--co-primary);
    font-size:24px;
    font-weight:950;
    line-height:1;
}

.checkout-page .security-badge{
    display:flex;
    align-items:flex-start;
    gap:8px;
    margin-top:13px;
    padding:10px 11px;
    background:#f0fbf5;
    color:#27724b;
    border:1px solid #d6f0e1;
    border-radius:10px;
    font-size:10px;
    line-height:1.5;
}

.checkout-page .security-badge i{
    margin-top:1px;
    color:var(--co-success);
    font-size:14px;
}

@media(max-width:991.98px){
    .checkout-page .checkout-grid{
        grid-template-columns:1fr;
    }
    .checkout-page .order-card{
        position:static;
    }
}

@media(max-width:640px){
    .checkout-page{
        padding-top:15px;
    }
    .checkout-page .checkout-shell{
        width:calc(100% - 18px);
    }
    .checkout-page .checkout-title{
        margin-bottom:12px;
    }
    .checkout-page .checkout-title-icon{
        width:40px;
        height:40px;
        flex-basis:40px;
        border-radius:12px;
    }
    .checkout-page .checkout-title h1{
        font-size:22px;
    }
    .checkout-page .checkout-title p,
    .checkout-page .checkout-secure-pill{
        display:none;
    }
    .checkout-page .checkout-card,
    .checkout-page .order-card{
        border-radius:15px!important;
    }
    .checkout-page .card-section{
        padding:15px 13px;
    }
    .checkout-page .section-icon{
        width:34px;
        height:34px;
        flex-basis:34px;
    }
    .checkout-page .payment-methods{
        grid-template-columns:1fr;
    }
}

/* ===== Tracking ===== */
.tracking-page{min-height:70vh;padding:24px 0 42px;background:var(--s90-bg,#f6f8fb)}
.tracking-page .tracking-shell{width:min(900px,calc(100% - 24px));margin:auto}
.tracking-page .tracking-head{display:flex;align-items:center;gap:12px;margin-bottom:16px}
.tracking-page .tracking-head-icon{width:46px;height:46px;display:grid;place-items:center;border-radius:14px;background:#eef5ff;color:var(--s90-primary,#0d63f3);font-size:18px}
.tracking-page .tracking-head h2{margin:0;font-size:24px;font-weight:950}
.tracking-page .tracking-head p{margin:3px 0 0;color:var(--s90-muted,#6f7c8e);font-size:11px}
.tracking-page .tracking-card{background:#fff;border:1px solid var(--s90-line,#e7ebf1);border-radius:18px;box-shadow:var(--s90-shadow,0 10px 30px rgba(24,42,72,.07));overflow:hidden}
.tracking-page .tracking-section{padding:18px 20px}
.tracking-page .tracking-section+.tracking-section{border-top:1px solid var(--s90-line,#e7ebf1)}
.tracking-page .order-meta,.tracking-page .flow{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.tracking-page .meta-box,.tracking-page .flow-step,.tracking-page .history-item{background:#fafbfd;border:1px solid #e9edf1;border-radius:11px}
.tracking-page .meta-box{padding:12px}
.tracking-page .meta-label{display:block;margin-bottom:4px;color:#8a96a5;font-size:9px;font-weight:800}
.tracking-page .meta-value{font-size:12px;font-weight:900}
.tracking-page .status-badge{display:inline-flex;padding:6px 10px;border-radius:999px;font-size:10px;font-weight:900}
.tracking-page .status-pending,.tracking-page .payment-pending{background:#fff7df;color:#9a6a00}
.tracking-page .status-processing{background:#eaf5ff;color:var(--s90-primary,#0d63f3)}
.tracking-page .status-completed,.tracking-page .payment-paid{background:#eefaf4;color:#15945a}
.tracking-page .status-refunded,.tracking-page .payment-refunded{background:#f3edff;color:#7a4cc2}
.tracking-page .status-cancelled,.tracking-page .status-failed,.tracking-page .payment-failed{background:#fff0f1;color:#c43c49}
.tracking-page .payment-partially_refunded{background:#fff3e6;color:#c56b00}
.tracking-page .flow-title{margin:0 0 13px;font-size:15px;font-weight:950}
.tracking-page .flow-step{padding:13px 10px;text-align:center}
.tracking-page .flow-step .icon{width:34px;height:34px;display:grid;place-items:center;margin:0 auto 7px;border-radius:50%;background:#eef1f5;color:#8b96a5}
.tracking-page .flow-step.active{background:#f4f8ff;border-color:#c9dbfb}
.tracking-page .flow-step.active .icon{background:var(--s90-primary,#0d63f3);color:#fff}
.tracking-page .flow-step.done{background:#eefaf4;border-color:#d7f0e2}
.tracking-page .flow-step.done .icon{background:#15945a;color:#fff}
.tracking-page .flow-step strong{display:block;font-size:11px}
.tracking-page .flow-step small{display:block;margin-top:3px;color:#8a96a5;font-size:9px}
.tracking-page .info-note{padding:12px 13px;border-radius:11px;font-size:10px;line-height:1.7}
.tracking-page .info-note.pending{background:#fff9eb;border:1px solid #f5e5b7;color:#7b651e}
.tracking-page .info-note.processing{background:#eef7fd;border:1px solid #d9eaf5;color:#326c91}
.tracking-page .info-note.completed{background:#eefaf4;border:1px solid #d8eee2;color:#27724b}
.tracking-page .info-note.refunded{background:#f6f1ff;border:1px solid #e5d8fb;color:#6c4c9c}
.tracking-page .history-list{display:grid;gap:8px}
.tracking-page .history-item{display:flex;justify-content:space-between;gap:12px;padding:10px 12px}
.tracking-page .history-item .left{display:flex;align-items:center;gap:8px}
.tracking-page .history-dot{width:8px;height:8px;border-radius:50%;background:var(--s90-primary,#0d63f3)}
.tracking-page .history-status{font-size:10px;font-weight:850}
.tracking-page .history-time{color:#8a96a5;font-size:9px}
.tracking-page .back-btn{display:inline-flex;gap:6px;margin-top:14px;padding:9px 14px;border-radius:9px;background:#fff;color:#536174;border:1px solid #dfe5ec;text-decoration:none;font-size:10px;font-weight:900}
@media(max-width:700px){.tracking-page .order-meta,.tracking-page .flow{grid-template-columns:1fr}.tracking-page .tracking-section{padding:15px 13px}}

/* ===== Payment failed ===== */
.payment-result-page{min-height:72vh;display:flex;align-items:center;justify-content:center;padding:34px 14px;background:var(--s90-bg,#f6f8fb)}
.payment-result-page .result-card{width:min(520px,100%);overflow:hidden;background:#fff;border:1px solid var(--s90-line,#e7ebf1);border-radius:20px;box-shadow:var(--s90-shadow,0 10px 30px rgba(24,42,72,.07))}
.payment-result-page .result-body{padding:32px 28px;text-align:center}
.payment-result-page .result-icon{width:70px;height:70px;display:grid;place-items:center;margin:0 auto 14px;border-radius:19px;background:#fff0f1;border:1px solid #f7dadd;color:#dc3545;font-size:29px}
.payment-result-page .result-body h3{margin:0 0 6px;font-size:22px;font-weight:950}
.payment-result-page .result-body>p{margin:0;color:var(--s90-muted,#6f7c8e);font-size:11px}
.payment-result-page .failure-note{display:flex;gap:9px;margin-top:18px;padding:12px 13px;text-align:right;background:#fff7f7;border:1px solid #f6dddd;border-radius:11px;color:#687587;font-size:10px}
.payment-result-page .result-actions{display:grid;gap:8px;margin-top:17px}
.payment-result-page .result-actions a{min-height:43px;display:flex;align-items:center;justify-content:center;gap:7px;padding:9px 14px;border-radius:10px;text-decoration:none;font-size:11px;font-weight:900}
.payment-result-page .retry-btn{background:var(--s90-primary,#0d63f3);color:#fff}
.payment-result-page .retry-btn:hover{background:var(--s90-primary-dark,#094fc4);color:#fff}
.payment-result-page .cart-btn{background:#fff;color:#536174;border:1px solid #dfe5ec}
.payment-result-page .support-btn{background:#eef7fd;color:var(--s90-primary,#0d63f3);border:1px solid #d9eaf5}

/* ===== Payment success ===== */
.payment-success-page{min-height:72vh;padding:28px 14px 42px;background:var(--s90-bg,#f6f8fb)}
.payment-success-page .order-card{position:static!important;width:min(660px,100%)!important;margin:auto!important;background:#fff!important;border:1px solid var(--s90-line,#e7ebf1)!important;border-radius:20px!important;box-shadow:var(--s90-shadow,0 10px 30px rgba(24,42,72,.07))!important;overflow:hidden!important}
.payment-success-page .order-card::before,.payment-success-page .order-card::after{content:none!important;display:none!important}
.payment-success-page .order-card .card-body{padding:30px!important}
.payment-success-page .success-icon{width:68px;height:68px;display:flex!important;align-items:center;justify-content:center;margin:0 auto;color:#15945a!important;background:#eefaf4;border:1px solid #d7f0e2;border-radius:18px;font-size:28px!important}
.payment-success-page .order-card h2{font-size:22px;font-weight:950!important}
.payment-success-page .text-muted{color:var(--s90-muted,#6f7c8e)!important;font-size:11px}
.payment-success-page .divider{margin:16px 0;border:0;border-top:1px solid #e9edf1}
.payment-success-page .order-number-display{text-align:center}
.payment-success-page .order-number-display:before{content:"رقم الطلب";display:block;margin-bottom:3px;color:#8b96a5;font-size:9px}
.payment-success-page .order-number-display span{font-size:16px!important;font-weight:950!important}
.payment-success-page .details-container{padding:3px 14px;background:#fafbfd;border:1px solid #e9edf1;border-radius:12px}
.payment-success-page .detail-row{display:flex;align-items:center;justify-content:space-between;padding:11px 0;border-bottom:1px solid #edf0f3}
.payment-success-page .detail-row:last-child{border-bottom:0}
.payment-success-page .detail-label{color:var(--s90-muted,#6f7c8e);font-size:10px;font-weight:800}
.payment-success-page .detail-value{font-size:11px;font-weight:900}
.payment-success-page .detail-value.text-primary{color:var(--s90-primary,#0d63f3)!important}
.payment-success-page .detail-value.text-success{color:#15945a!important}
.payment-success-page .custom-notice,.payment-success-page .custom-success-box{padding:14px!important;text-align:center;border-radius:11px!important}
.payment-success-page .custom-notice{background:#fff9eb!important;border:1px solid #f5e5b7!important}
.payment-success-page .custom-success-box{background:#eefaf4!important;border:1px solid #d8eee2!important}
.payment-success-page .action-buttons{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:16px!important}
.payment-success-page .btn-custom-primary,.payment-success-page .btn-custom-secondary{min-height:42px;display:inline-flex;align-items:center;justify-content:center;padding:9px 18px!important;border-radius:10px!important;text-decoration:none;font-size:11px;font-weight:900}
.payment-success-page .btn-custom-primary{background:var(--s90-primary,#0d63f3)!important;color:#fff!important}
.payment-success-page .btn-custom-secondary{background:#fff!important;color:#536174!important;border:1px solid #dfe5ec!important}

@media(max-width:576px){
    .payment-result-page{padding:22px 10px}
    .payment-result-page .result-body{padding:27px 18px}
    .payment-success-page{padding:18px 10px 30px}
    .payment-success-page .order-card .card-body{padding:23px 16px!important}
    .payment-success-page .action-buttons a{width:100%}
}

/* Phase 27 — order tracking mobile product cards */
@media(max-width:700px){
 .tracking-page .tracking-section>.table-responsive{padding:0;overflow:visible}
 .tracking-page .tracking-section>.table-responsive .table thead{display:none}
 .tracking-page .tracking-section>.table-responsive .table,
 .tracking-page .tracking-section>.table-responsive .table tbody,
 .tracking-page .tracking-section>.table-responsive .table tr,
 .tracking-page .tracking-section>.table-responsive .table td{display:block;width:100%}
 .tracking-page .tracking-section>.table-responsive .table tbody tr{margin-bottom:12px;padding:7px 12px;background:#fafbfd;border:1px solid #e9edf1;border-radius:13px}
 .tracking-page .tracking-section>.table-responsive .table tbody tr:last-child{margin-bottom:0}
 .tracking-page .tracking-section>.table-responsive .table tbody td{display:grid;grid-template-columns:minmax(82px,.34fr) minmax(0,1fr);gap:10px;align-items:start;padding:8px 0!important;border:0!important;text-align:right!important;white-space:normal;overflow-wrap:anywhere}
 .tracking-page .tracking-section>.table-responsive .table tbody td+td{border-top:1px dashed #e3e8ee!important}
 .tracking-page .tracking-section>.table-responsive .table tbody td::before{content:attr(data-label);color:#8a96a5;font-size:10px;font-weight:850}
 .tracking-page .tracking-section>.table-responsive .table tbody td strong{line-height:1.7}
 .tracking-page .tracking-section>.table-responsive .status-badge{white-space:normal;text-align:center;justify-content:center;max-width:100%}
 .tracking-page .tracking-section>.table-responsive code{display:block;max-width:100%;white-space:normal;overflow-wrap:anywhere}
}