/* ===========================================================
   WERK v2 — Оформление + Оплата + Kaspi + Чек (иммерсив, тёплое стекло)
   Только под флагом v2.checkout (html[data-v2-flags~="checkout"]).
   ЧИСТЫЙ CSS — разметка/JS не трогаются.

   ⚠️ ВАЖНО: старый v2-screens.css ТОЖЕ стилизует эти окна под тем же
   флагом, используя селекторы с ID модалок (#paymentTypeOverlay и т.п.)
   + !important (специфичность 1,2,1), да ещё на неопределённых
   переменных (--v2-bg-card → прозрачно). Чтобы НАДЁЖНО победить его,
   ВСЕ селекторы здесь тоже скоупим под ID модалки (равная специфичность)
   + !important на ключевых свойствах — мой файл грузится ПОЗЖЕ, поэтому
   при равной специфичности выигрывает.
   =========================================================== */

/* ============ Общий тёплый фон для модалок-шторок ============ */
html[data-v2-flags~="checkout"] #checkoutModal,
html[data-v2-flags~="checkout"] #paymentTypeOverlay {
    background: rgba(8,5,2,.6) !important;
    backdrop-filter: blur(4px);
}
html[data-v2-flags~="checkout"] #checkoutModal .modal,
html[data-v2-flags~="checkout"] #paymentTypeOverlay .payment-type-modal {
    background: linear-gradient(160deg, #241a10, #15100a) !important;
    border-top: 1px solid rgba(255,214,170,.2) !important;
    box-shadow: 0 -20px 60px rgba(0,0,0,.55) !important;
}
html[data-v2-flags~="checkout"] #checkoutModal .modal-handle,
html[data-v2-flags~="checkout"] #paymentTypeOverlay .modal-handle { background: rgba(255,255,255,.18) !important; }

/* ===================== ОФОРМЛЕНИЕ ===================== */
html[data-v2-flags~="checkout"] #checkoutModal { --bg-input: rgba(255,255,255,.04); --bg-card: rgba(255,255,255,.03); --border: rgba(255,214,170,.14); }
html[data-v2-flags~="checkout"] #checkoutModal .modal-title { color: #fff !important; font-weight: 800; }
html[data-v2-flags~="checkout"] #checkoutModal .order-type-toggle { gap: 8px; }
html[data-v2-flags~="checkout"] #checkoutModal .order-type-btn {
    border-radius: 13px !important; border: 1px solid rgba(255,214,170,.18) !important; background: rgba(255,255,255,.03) !important; color: #C9AE8E !important; font-weight: 600;
}
html[data-v2-flags~="checkout"] #checkoutModal .order-type-btn.active {
    background: rgba(249,115,22,.16) !important; border-color: #F97316 !important; color: #FFD9A8 !important;
}
html[data-v2-flags~="checkout"] #checkoutModal .input-label { color: #C9AE8E !important; }
html[data-v2-flags~="checkout"] #checkoutModal #checkoutCustomer,
html[data-v2-flags~="checkout"] #checkoutModal #checkoutWarehouse {
    background: rgba(255,255,255,.04) !important; border: 1px solid rgba(255,214,170,.14) !important; border-radius: 12px !important; color: #fff !important;
}
html[data-v2-flags~="checkout"] #checkoutModal .input {
    background: rgba(255,255,255,.04) !important; border: 1px solid rgba(255,214,170,.18) !important; color: #fff !important; border-radius: 12px !important;
}
html[data-v2-flags~="checkout"] #checkoutModal #checkoutItemsPreview {
    background: rgba(255,255,255,.03) !important; border: 1px solid rgba(255,214,170,.12) !important; border-radius: 16px !important;
}
html[data-v2-flags~="checkout"] #checkoutModal .nds-toggle-row {
    background: rgba(255,255,255,.03) !important; border: 1px solid rgba(255,214,170,.12) !important; border-radius: 14px !important;
}
html[data-v2-flags~="checkout"] #checkoutModal .nds-toggle-row.active { border-color: rgba(249,115,22,.35) !important; background: rgba(249,115,22,.08) !important; }
html[data-v2-flags~="checkout"] #checkoutModal .nds-toggle-title { color: #fff !important; }
html[data-v2-flags~="checkout"] #checkoutModal .nds-toggle-subtitle { color: #9a8f77 !important; }
html[data-v2-flags~="checkout"] #checkoutModal .nds-switch { background: rgba(255,255,255,.12) !important; }
html[data-v2-flags~="checkout"] #checkoutModal .nds-switch.on { background: #F97316 !important; }
html[data-v2-flags~="checkout"] #checkoutModal .nds-info-block { background: rgba(255,255,255,.03) !important; border: 1px solid rgba(255,214,170,.1) !important; border-radius: 12px !important; }
html[data-v2-flags~="checkout"] #checkoutModal .nds-info-label { color: #9a8f77 !important; }
html[data-v2-flags~="checkout"] #checkoutModal .nds-info-value { color: #E8D9C6 !important; font-family: 'JetBrains Mono', monospace; }
html[data-v2-flags~="checkout"] #checkoutModal .form-section-title { color: #FFD9A8 !important; font-weight: 700; }
html[data-v2-flags~="checkout"] #checkoutModal #remainingPaymentDate {
    background: rgba(255,255,255,.04) !important; border: 1px solid rgba(255,214,170,.18) !important; color: #fff !important; border-radius: 12px !important;
}
html[data-v2-flags~="checkout"] #checkoutModal .preorder-summary { background: rgba(249,115,22,.08) !important; border: 1px solid rgba(249,115,22,.2) !important; border-radius: 14px !important; }
html[data-v2-flags~="checkout"] #checkoutModal .preorder-summary-label { color: #C9AE8E !important; }
html[data-v2-flags~="checkout"] #checkoutModal .preorder-summary-value { color: #E8D9C6 !important; font-family: 'JetBrains Mono', monospace; }
html[data-v2-flags~="checkout"] #checkoutModal .preorder-summary-value.accent { color: #F97316 !important; }
html[data-v2-flags~="checkout"] #checkoutModal .cart-summary { background: rgba(255,255,255,.03) !important; border: 1px solid rgba(255,214,170,.14) !important; border-radius: 16px !important; padding: 14px 16px; }
html[data-v2-flags~="checkout"] #checkoutModal .cart-summary-label { color: #C9AE8E !important; }
html[data-v2-flags~="checkout"] #checkoutModal .cart-summary-value { color: #fff !important; font-family: 'JetBrains Mono', monospace; font-weight: 800; }
html[data-v2-flags~="checkout"] #checkoutModal .btn-primary,
html[data-v2-flags~="checkout"] #paymentTypeOverlay .btn-primary {
    background: linear-gradient(120deg, #F97316, #FF8A3D, #C2410C) !important; border: none !important; color: #fff !important;
    border-radius: 14px !important; font-weight: 800; box-shadow: 0 0 32px rgba(249,115,22,.45) !important;
}
html[data-v2-flags~="checkout"] #checkoutModal .btn-secondary,
html[data-v2-flags~="checkout"] #paymentTypeOverlay .btn-secondary {
    background: rgba(255,255,255,.04) !important; border: 1px solid rgba(255,214,170,.18) !important; color: #C9AE8E !important; border-radius: 14px !important;
}

/* ===================== СПОСОБ ОПЛАТЫ ===================== */
html[data-v2-flags~="checkout"] #paymentTypeOverlay .payment-type-title { color: #fff !important; font-weight: 800; }
html[data-v2-flags~="checkout"] #paymentTypeOverlay .payment-type-subtitle { color: #9a8f77 !important; }
html[data-v2-flags~="checkout"] #paymentTypeOverlay .payment-type-amount { background: rgba(249,115,22,.1) !important; border: 1px solid rgba(249,115,22,.25) !important; border-radius: 16px !important; }
html[data-v2-flags~="checkout"] #paymentTypeOverlay .payment-type-amount-label { color: #C9AE8E !important; }
html[data-v2-flags~="checkout"] #paymentTypeOverlay .payment-type-amount-value {
    font-family: 'JetBrains Mono', monospace; font-weight: 800;
    background: linear-gradient(180deg, #fff, #FFE0B8) !important;
    -webkit-background-clip: text !important; background-clip: text !important;
    -webkit-text-fill-color: transparent !important; color: transparent !important;
}
html[data-v2-flags~="checkout"] #paymentTypeOverlay .payment-type-option {
    background: rgba(255,255,255,.03) !important; border: 1.5px solid rgba(255,214,170,.14) !important; border-radius: 15px !important;
}
html[data-v2-flags~="checkout"] #paymentTypeOverlay .payment-type-option.selected {
    border-color: #F97316 !important; background: rgba(249,115,22,.12) !important;
}
html[data-v2-flags~="checkout"] #paymentTypeOverlay .payment-type-icon { background: rgba(255,255,255,.06) !important; border-radius: 13px !important; }
html[data-v2-flags~="checkout"] #paymentTypeOverlay .payment-type-label { color: #fff !important; font-weight: 700; }
html[data-v2-flags~="checkout"] #paymentTypeOverlay .payment-type-desc { color: #9a8f77 !important; }
html[data-v2-flags~="checkout"] #paymentTypeOverlay #mixedPaymentBlock {
    background: rgba(255,255,255,.04) !important; border: 1px solid rgba(255,214,170,.16) !important; border-radius: 14px !important;
}
html[data-v2-flags~="checkout"] #paymentTypeOverlay #mixedCashAmount,
html[data-v2-flags~="checkout"] #paymentTypeOverlay #mixedCardAmount {
    background: rgba(0,0,0,.25) !important; border: 1px solid rgba(255,214,170,.2) !important; color: #fff !important; border-radius: 9px !important;
}
html[data-v2-flags~="checkout"] #paymentTypeOverlay #mixedSumStatus { border-top-color: rgba(255,214,170,.12) !important; }

/* ===================== KASPI QR ===================== */
html[data-v2-flags~="checkout"] #kaspiQrOverlay {
    background:
        radial-gradient(70% 45% at 22% 10%, rgba(249,140,60,.16), transparent 60%),
        linear-gradient(160deg, #1d1510, #0c0805) !important;
}
html[data-v2-flags~="checkout"] #kaspiQrOverlay .kaspi-qr-back { background: rgba(255,255,255,.05) !important; border: 1px solid rgba(255,214,170,.16) !important; color: #E8D9C6 !important; border-radius: 13px !important; }
html[data-v2-flags~="checkout"] #kaspiQrOverlay .kaspi-qr-badge { background: rgba(251,191,36,.14) !important; border: 1px solid rgba(251,191,36,.3) !important; color: #FBBF24 !important; }
html[data-v2-flags~="checkout"] #kaspiQrOverlay .kaspi-qr-amount-label { color: #C9AE8E !important; }
html[data-v2-flags~="checkout"] #kaspiQrOverlay .kaspi-qr-amount { color: #fff !important; font-family: 'JetBrains Mono', monospace; }
html[data-v2-flags~="checkout"] #kaspiQrOverlay .kaspi-qr-amount span { color: #9a8f77 !important; }
html[data-v2-flags~="checkout"] #kaspiQrOverlay .kaspi-qr-card { border-radius: 22px !important; box-shadow: 0 20px 50px rgba(0,0,0,.5) !important; }
html[data-v2-flags~="checkout"] #kaspiQrOverlay .kaspi-qr-steps { background: rgba(255,255,255,.03) !important; border: 1px solid rgba(255,214,170,.12) !important; border-radius: 16px !important; }
html[data-v2-flags~="checkout"] #kaspiQrOverlay .kaspi-qr-steps-title { color: #C9AE8E !important; }
html[data-v2-flags~="checkout"] #kaspiQrOverlay .kaspi-qr-step-text { color: #E8D9C6 !important; }
html[data-v2-flags~="checkout"] #kaspiQrOverlay .kaspi-qr-step-num { background: rgba(249,115,22,.18) !important; color: #FFD9A8 !important; }
html[data-v2-flags~="checkout"] #kaspiQrOverlay .kaspi-qr-confirm { background: linear-gradient(120deg, #22C55E, #15803D) !important; color: #fff !important; border-radius: 14px !important; font-weight: 800; box-shadow: 0 0 28px rgba(34,197,94,.35) !important; }
html[data-v2-flags~="checkout"] #kaspiQrOverlay .kaspi-qr-other { color: #9a8f77 !important; }

/* ===================== ЧЕК (светлый бумажный) ===================== */
html[data-v2-flags~="checkout"] #receiptOverlay {
    background:
        radial-gradient(70% 45% at 22% 10%, rgba(249,140,60,.16), transparent 60%),
        linear-gradient(160deg, #1d1510, #0c0805) !important;
}
html[data-v2-flags~="checkout"] #receiptOverlay .receipt { background: #FFFDF8 !important; color: #1a1a2e !important; box-shadow: 0 25px 80px rgba(0,0,0,.55) !important; }
html[data-v2-flags~="checkout"] #receiptOverlay .receipt-close { background: rgba(255,255,255,.12) !important; border: 1px solid rgba(255,214,170,.22) !important; }
html[data-v2-flags~="checkout"] #receiptOverlay .receipt-customer,
html[data-v2-flags~="checkout"] #receiptOverlay .receipt-summary { background: #FBF6EE !important; }
html[data-v2-flags~="checkout"] #receiptOverlay .receipt-order-number,
html[data-v2-flags~="checkout"] #receiptOverlay .receipt-item-price,
html[data-v2-flags~="checkout"] #receiptOverlay .receipt-item-total,
html[data-v2-flags~="checkout"] #receiptOverlay .receipt-summary-value,
html[data-v2-flags~="checkout"] #receiptOverlay .receipt-summary-total { font-family: 'JetBrains Mono', monospace; }
