/* ═══════════════════════════════════════════
   SAHAR PARTS - CART PAGE STYLES
   Fully standalone - every value uses --sc-* variable.
   All --sc-* map to --sp-cart-* from database settings.
   ═══════════════════════════════════════════ */

@keyframes scFadeInUp {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes scPulse {
    0%, 100% { transform: scale(1); opacity: 1; }
    50% { transform: scale(1.05); opacity: 0.8; }
}
@keyframes scSpin {
    to { transform: rotate(360deg); }
}
@keyframes scModalSlideIn {
    from { transform: translateY(-30px); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
}

.cart-page {
    --sc-bg: var(--sp-cart-page_bg, #f8f9fa);
    --sc-text: var(--sp-cart-page_text_color, #333333);
    --sc-font: var(--sp-cart-page_font_family, inherit);
    --sc-primary: #0d0d0d;
    --sc-secondary: var(--sp-cart-item_price_color, #D4A017);
    --sc-primary-hover: #b8890f;
    --sc-text-light: #666666;
    --sc-text-muted: #999999;
    --sc-border: var(--sp-cart-item_border_color, #e0e0e0);
    --sc-success: #28a745;
    --sc-danger: #dc3545;
    --sc-radius: var(--sp-cart-btn_radius, 16px);
    --sc-dark-bg: #1a1a2e;
    --sc-dark-card: #2d3748;
    --sc-dark-border: #4a5568;
    --sc-dark-text: #e2e8f0;

    /* Header */
    --sc-hdr-bg: var(--sp-cart-header_bg, linear-gradient(135deg, #1a202c, #2c3949));
    --sc-hdr-color: var(--sp-cart-header_title_color, #ffffff);
    --sc-hdr-shadow: var(--sp-cart-header_shadow, 0 4px 20px rgba(0,0,0,0.12));
    --sc-hdr-py: var(--sp-cart-header_padding_y, 24px);
    --sc-hdr-px: var(--sp-cart-header_padding_x, 20px);
    --sc-hdr-title-size: var(--sp-cart-header_title_size, 1.5rem);
    --sc-hdr-title-weight: var(--sp-cart-header_title_weight, 700);
    --sc-hdr-title-gap: var(--sp-cart-header_title_gap, 12px);
    --sc-hdr-icon-size: var(--sp-cart-header_icon_size, 1.3rem);
    --sc-hdr-icon-bg: var(--sp-cart-header_icon_bg, rgba(255,255,255,0.2));
    --sc-hdr-icon-padding: var(--sp-cart-header_icon_padding, 10px);

    /* Container */
    --sc-ctr-w: var(--sp-cart-container_width, 90%);
    --sc-ctr-maxw: var(--sp-cart-container_max_width, 1140px);
    --sc-ctr-bg: var(--sp-cart-container_bg, #ffffff);
    --sc-ctr-shadow: var(--sp-cart-container_shadow, 0 2px 12px rgba(0,0,0,0.08));
    --sc-ctr-radius: var(--sp-cart-container_radius, 16px);

    /* Alerts */
    --sc-alert-py: var(--sp-cart-alert_padding_y, 16px);
    --sc-alert-px: var(--sp-cart-alert_padding_x, 20px);
    --sc-alert-my: var(--sp-cart-alert_margin_y, 20px);
    --sc-alert-mx: var(--sp-cart-alert_margin_x, 16px);
    --sc-alert-radius: var(--sp-cart-alert_radius, 12px);
    --sc-alert-gap: var(--sp-cart-alert_gap, 12px);
    --sc-alert-success-color: var(--sp-cart-alert_success_color, #28a745);
    --sc-alert-success-border: var(--sp-cart-alert_success_border_color, #28a745);
    --sc-alert-error-color: var(--sp-cart-alert_error_color, #dc3545);
    --sc-alert-error-border: var(--sp-cart-alert_error_border_color, #dc3545);

    /* Empty */
    --sc-empty-py: var(--sp-cart-empty_padding_y, 60px);
    --sc-empty-px: var(--sp-cart-empty_padding_x, 24px);
    --sc-empty-icon-size: var(--sp-cart-empty_icon_size, 4rem);
    --sc-empty-icon-color: var(--sp-cart-empty_icon_color, #cccccc);
    --sc-empty-icon-mb: var(--sp-cart-empty_icon_margin, 24px);
    --sc-empty-title-size: var(--sp-cart-empty_title_size, 1.5rem);
    --sc-empty-title-color: var(--sp-cart-empty_title_color, #333333);
    --sc-empty-title-mb: var(--sp-cart-empty_title_margin, 16px);
    --sc-empty-text-size: var(--sp-cart-empty_text_size, 1rem);
    --sc-empty-text-color: var(--sp-cart-empty_text_color, #666666);
    --sc-empty-text-mb: var(--sp-cart-empty_text_margin, 32px);
    --sc-empty-text-lh: var(--sp-cart-empty_text_line_height, 1.8);

    /* Buttons */
    --sc-btn-py: var(--sp-cart-btn_padding_y, 16px);
    --sc-btn-px: var(--sp-cart-btn_padding_x, 28px);
    --sc-btn-gap: var(--sp-cart-btn_gap, 10px);
    --sc-btn-min-w: var(--sp-cart-btn_min_width, 140px);
    --sc-btn-size: var(--sp-cart-btn_size, 1rem);
    --sc-btn-weight: var(--sp-cart-btn_weight, 600);
    --sc-btn-primary-bg: var(--sp-cart-btn_primary_bg, linear-gradient(135deg,#D4A017,#b8890f));
    --sc-btn-primary-color: var(--sp-cart-btn_primary_color, #ffffff);
    --sc-btn-primary-shadow: var(--sp-cart-btn_primary_shadow, 0 4px 15px rgba(254,80,0,0.3));
    --sc-btn-secondary-bg: var(--sp-cart-btn_secondary_bg, #ffffff);
    --sc-btn-secondary-color: var(--sp-cart-btn_secondary_color, #333333);
    --sc-btn-secondary-border: var(--sp-cart-btn_secondary_border, #e0e0e0);

    /* Send order */
    --sc-send-bg: var(--sp-cart-send_order_btn_bg, linear-gradient(135deg,#D4A017,#b8890f));
    --sc-send-color: var(--sp-cart-send_order_btn_color, #ffffff);
    --sc-send-py: var(--sp-cart-send_order_padding_y, 18px);
    --sc-send-size: var(--sp-cart-send_order_size, 1.1rem);
    --sc-send-mt: var(--sp-cart-send_order_margin_top, 24px);
    --sc-send-weight: var(--sp-cart-send_order_weight, 700);
    --sc-send-shadow: var(--sp-cart-send_order_shadow, 0 6px 20px rgba(254,80,0,0.4));
    --sc-send-gap: var(--sp-cart-send_order_gap, 10px);

    /* Content */
    --sc-content-py: var(--sp-cart-content_padding_y, 20px);
    --sc-content-px: var(--sp-cart-content_padding_x, 16px);
    --sc-items-gap: var(--sp-cart-items_gap, 16px);

    /* Item */
    --sc-item-bg: var(--sp-cart-item_bg, #ffffff);
    --sc-item-radius: var(--sp-cart-item_radius, 16px);
    --sc-item-shadow: var(--sp-cart-item_shadow, 0 2px 12px rgba(0,0,0,0.08));
    --sc-item-padding: var(--sp-cart-item_padding, 20px);
    --sc-item-name-size: var(--sp-cart-item_name_size, 1rem);
    --sc-item-name-color: var(--sp-cart-item_name_color, #333333);
    --sc-item-name-weight: var(--sp-cart-item_name_weight, 700);
    --sc-item-name-mb: var(--sp-cart-item_name_margin, 8px);
    --sc-item-name-lh: var(--sp-cart-item_name_line_height, 1.4);
    --sc-item-price-size: var(--sp-cart-item_price_size, 1.1rem);
    --sc-item-price-color: var(--sp-cart-item_price_color, #D4A017);
    --sc-item-price-weight: var(--sp-cart-item_price_weight, 800);
    --sc-item-price-mb: var(--sp-cart-item_price_margin, 4px);
    --sc-item-oprice-size: var(--sp-cart-item_original_price_size, 0.85rem);
    --sc-item-oprice-color: var(--sp-cart-item_original_price_color, #666666);
    --sc-item-header-gap: var(--sp-cart-item_header_gap, 16px);
    --sc-item-header-mb: var(--sp-cart-item_header_margin, 16px);
    --sc-item-body-pt: var(--sp-cart-item_body_padding_top, 16px);
    --sc-item-footer-pt: var(--sp-cart-item_footer_padding_top, 16px);

    /* Thumb */
    --sc-thumb-size: var(--sp-cart-thumb_size, 80px);
    --sc-thumb-radius: var(--sp-cart-thumb_radius, 12px);
    --sc-thumb-bg: var(--sp-cart-thumb_bg, #f8f9fa);
    --sc-noimg-bg: var(--sp-cart-noimage_bg, #e9ecef);
    --sc-noimg-color: var(--sp-cart-noimage_color, #6c757d);
    --sc-noimg-size: var(--sp-cart-noimage_size, 1.5rem);

    /* Qty */
    --sc-qty-label-size: var(--sp-cart-qty_label_size, 0.9rem);
    --sc-qty-section-mb: var(--sp-cart-qty_section_margin, 16px);
    --sc-qty-ctrl-bg: var(--sp-cart-qty_control_bg, #f8f9fa);
    --sc-qty-ctrl-radius: var(--sp-cart-qty_control_radius, 16px);
    --sc-qty-ctrl-padding: var(--sp-cart-qty_control_padding, 4px);
    --sc-qty-btn-bg: var(--sp-cart-qty_btn_bg, #ffffff);
    --sc-qty-btn-radius: var(--sp-cart-qty_btn_radius, 10px);
    --sc-qty-btn-size: var(--sp-cart-qty_btn_size, 36px);
    --sc-qty-btn-color: var(--sp-cart-qty_btn_color, #333333);
    --sc-qty-plus-color: var(--sp-cart-qty_plus_color, #28a745);
    --sc-qty-plus-bg: var(--sp-cart-qty_plus_bg, rgba(40,167,69,0.1));
    --sc-qty-minus-color: var(--sp-cart-qty_minus_color, #dc3545);
    --sc-qty-minus-bg: var(--sp-cart-qty_minus_bg, rgba(220,53,69,0.1));
    --sc-qty-input-w: var(--sp-cart-qty_input_width, 50px);
    --sc-qty-input-h: var(--sp-cart-qty_input_height, 36px);
    --sc-qty-input-size: var(--sp-cart-qty_input_size, 1rem);

    /* Totals */
    --sc-total-size: var(--sp-cart-total_size, 1.1rem);
    --sc-total-weight: var(--sp-cart-total_weight, 800);
    --sc-total-color: var(--sp-cart-total_color, #0d0d0d);
    --sc-disc-badge-bg: var(--sp-cart-discount_badge_bg, rgba(40,167,69,0.1));
    --sc-disc-badge-color: var(--sp-cart-discount_badge_color, #28a745);
    --sc-disc-badge-radius: var(--sp-cart-discount_badge_radius, 20px);
    --sc-disc-badge-py: var(--sp-cart-discount_badge_padding_y, 6px);
    --sc-disc-badge-px: var(--sp-cart-discount_badge_padding_x, 12px);
    --sc-disc-badge-size: var(--sp-cart-discount_badge_size, 0.8rem);
    --sc-no-disc-size: var(--sp-cart-no_discount_size, 0.85rem);

    /* Remove btn */
    --sc-rm-size: var(--sp-cart-remove_btn_size, 36px);
    --sc-rm-bg: var(--sp-cart-remove_btn_bg, rgba(220,53,69,0.1));
    --sc-rm-color: var(--sp-cart-remove_btn_color, #dc3545);
    --sc-rm-active-bg: var(--sp-cart-remove_btn_active_bg, rgba(220,53,69,0.2));

    /* Discount section */
    --sc-disc-sec-bg: var(--sp-cart-discount_section_bg, #ffffff);
    --sc-disc-sec-mb: var(--sp-cart-discount_section_margin, 20px);
    --sc-disc-sec-radius: var(--sp-cart-discount_section_radius, 14px);
    --sc-disc-header-bg: var(--sp-cart-discount_header_bg, #f7f8fa);
    --sc-disc-header-color: var(--sp-cart-discount_header_color, #333);
    --sc-disc-input-border: var(--sp-cart-discount_input_border, #e2e5ec);
    --sc-disc-input-radius: var(--sp-cart-discount_input_radius, 10px);
    --sc-disc-input-icon-color: var(--sp-cart-discount_input_icon_color, #c0c4cc);
    --sc-disc-input-placeholder: var(--sp-cart-discount_input_placeholder, #c0c4cc);
    --sc-disc-input-size: var(--sp-cart-discount_input_size, 0.9rem);
    --sc-disc-input-focus-border: var(--sp-cart-discount_input_focus_border, #D4A017);
    --sc-code-row-bg: var(--sp-cart-code_discount_row_bg, rgba(40,167,69,0.08));
    --sc-code-row-color: var(--sp-cart-code_discount_row_color, #28a745);

    /* Summary */
    --sc-summary-bg: var(--sp-cart-summary_bg, #ffffff);
    --sc-summary-radius: var(--sp-cart-summary_radius, 16px);
    --sc-summary-shadow: var(--sp-cart-summary_shadow, 0 4px 20px rgba(0,0,0,0.12));
    --sc-summary-py: var(--sp-cart-summary_padding_y, 24px);
    --sc-summary-px: var(--sp-cart-summary_padding_x, 20px);
    --sc-summary-my: var(--sp-cart-summary_margin, 24px);
    --sc-summary-grid-w: var(--sp-cart-summary_grid_width, 350px);
    --sc-summary-border: var(--sp-cart-summary_border_color, #e0e0e0);
    --sc-summary-title-size: var(--sp-cart-summary_title_size, 1.3rem);
    --sc-summary-title-color: var(--sp-cart-summary_title_color, #0d0d0d);
    --sc-summary-title-mb: var(--sp-cart-summary_title_margin, 20px);
    --sc-summary-title-gap: var(--sp-cart-summary_title_gap, 10px);
    --sc-summary-item-py: var(--sp-cart-summary_item_padding_y, 12px);
    --sc-summary-label-size: var(--sp-cart-summary_label_size, 0.95rem);
    --sc-summary-label-color: var(--sp-cart-summary_label_color, #333333);
    --sc-summary-val-size: var(--sp-cart-summary_value_size, 1rem);
    --sc-summary-val-color: var(--sp-cart-summary_value_color, #0d0d0d);
    --sc-summary-total-size: var(--sp-cart-summary_total_size, 1.1rem);
    --sc-summary-total-val-size: var(--sp-cart-summary_total_value_size, 1.3rem);
    --sc-summary-total-val-color: var(--sp-cart-summary_total_value_color, #D4A017);

    /* Scrollbar */
    --sc-scroll-w: var(--sp-cart-scrollbar_width, 6px);
    --sc-scroll-track-bg: var(--sp-cart-scrollbar_track_bg, #f8f9fa);
    --sc-scroll-thumb-bg: var(--sp-cart-scrollbar_thumb_bg, #D4A017);
    --sc-scroll-thumb-hover: var(--sp-cart-scrollbar_thumb_hover, #b8890f);

    /* Modal */
    --sc-modal-overlay-bg: var(--sp-cart-modal_overlay_bg, rgba(0,0,0,0.6));
    --sc-modal-overlay-blur: var(--sp-cart-modal_overlay_blur, 4px);
    --sc-modal-box-bg: var(--sp-cart-modal_box_bg, #ffffff);
    --sc-modal-box-radius: var(--sp-cart-modal_box_radius, 16px);
    --sc-modal-box-pt: var(--sp-cart-modal_box_padding_top, 35px);
    --sc-modal-box-px: var(--sp-cart-modal_box_padding_x, 30px);
    --sc-modal-box-pb: var(--sp-cart-modal_box_padding_bottom, 25px);
    --sc-modal-box-maxw: var(--sp-cart-modal_box_max_width, 420px);
    --sc-modal-box-shadow: var(--sp-cart-modal_box_shadow, 0 20px 60px rgba(0,0,0,0.3));
    --sc-modal-close-size: var(--sp-cart-modal_close_size, 28px);
    --sc-modal-close-color: var(--sp-cart-modal_close_color, #999999);
    --sc-modal-close-hover: var(--sp-cart-modal_close_hover_color, #333333);
    --sc-modal-hdr-mb: var(--sp-cart-modal_header_margin, 25px);
    --sc-modal-icon-size: var(--sp-cart-modal_icon_size, 40px);
    --sc-modal-icon-color: var(--sp-cart-modal_icon_color, #0d0d0d);
    --sc-modal-icon-mb: var(--sp-cart-modal_icon_margin, 10px);
    --sc-modal-title-size: var(--sp-cart-modal_title_size, 20px);
    --sc-modal-title-color: var(--sp-cart-modal_title_color, #333333);
    --sc-modal-title-mb: var(--sp-cart-modal_title_margin, 6px);
    --sc-modal-text-size: var(--sp-cart-modal_text_size, 13px);
    --sc-modal-text-color: var(--sp-cart-modal_text_color, #666666);
    --sc-modal-label-size: var(--sp-cart-modal_label_size, 13px);
    --sc-modal-label-color: var(--sp-cart-modal_label_color, #333333);
    --sc-modal-label-mb: var(--sp-cart-modal_label_margin, 6px);
    --sc-modal-input-border: var(--sp-cart-modal_input_border, #e0e0e0);
    --sc-modal-input-radius: var(--sp-cart-modal_input_radius, 10px);
    --sc-modal-input-px: var(--sp-cart-modal_input_padding_x, 14px);
    --sc-modal-input-py: var(--sp-cart-modal_input_padding_y, 14px);
    --sc-modal-input-size: var(--sp-cart-modal_input_size, 16px);
    --sc-modal-input-bg: var(--sp-cart-modal_input_bg, #ffffff);
    --sc-modal-input-focus-border: var(--sp-cart-modal_input_focus_border, #0d0d0d);
    --sc-modal-icon-input-size: var(--sp-cart-modal_input_icon_size, 18px);
    --sc-modal-btn-radius: var(--sp-cart-modal_btn_radius, 10px);
    --sc-modal-btn-size: var(--sp-cart-modal_btn_size, 16px);
    --sc-modal-btn-bg: var(--sp-cart-modal_btn_bg, linear-gradient(135deg,#D4A017,#b8890f));
    --sc-modal-btn-color: var(--sp-cart-modal_btn_color, #ffffff);
    --sc-modal-btn-shadow: var(--sp-cart-modal_btn_shadow, 0 6px 18px rgba(212,160,23,0.25));
    --sc-modal-btn-hover-shadow: var(--sp-cart-modal_btn_hover_shadow, 0 8px 25px rgba(212,160,23,0.35));
    --sc-modal-code-size: var(--sp-cart-modal_code_size, 44px);
    --sc-modal-code-h: var(--sp-cart-modal_code_height, 52px);
    --sc-modal-code-radius: var(--sp-cart-modal_code_radius, 10px);
    --sc-modal-code-border: var(--sp-cart-modal_code_border, #e0e0e0);
    --sc-modal-code-focus-border: var(--sp-cart-modal_code_focus_border, #0d0d0d);
    --sc-modal-code-focus-shadow: var(--sp-cart-modal_code_focus_shadow, 0 0 0 3px rgba(212,160,23,0.15));
    --sc-modal-info-bg: var(--sp-cart-modal_info_bg, #f8f9fa);
    --sc-modal-info-radius: var(--sp-cart-modal_info_radius, 10px);
    --sc-modal-info-text-size: var(--sp-cart-modal_info_text_size, 13px);
    --sc-modal-info-strong-size: var(--sp-cart-modal_info_strong_size, 18px);
    --sc-modal-resend-size: var(--sp-cart-modal_resend_size, 13px);
    --sc-modal-resend-color: var(--sp-cart-modal_resend_color, #999999);
    --sc-modal-resend-btn-color: var(--sp-cart-modal_resend_btn_color, #0d0d0d);
    --sc-modal-resend-disabled: var(--sp-cart-modal_resend_disabled_color, #999999);
    --sc-modal-loading-bg: var(--sp-cart-modal_loading_bg, rgba(255,255,255,0.9));
    --sc-modal-loading-radius: var(--sp-cart-modal_loading_radius, 16px);
    --sc-modal-loading-size: var(--sp-cart-modal_loading_size, 16px);
    --sc-modal-loading-color: var(--sp-cart-modal_loading_color, #333333);
    --sc-modal-loading-icon-size: var(--sp-cart-modal_loading_icon_size, 24px);
    --sc-modal-step-maxh: var(--sp-cart-modal_step_max_height, 60vh);
    --sc-modal-form-gap: var(--sp-cart-modal_form_group_margin, 18px);

    font-family: var(--sc-font);
    background: var(--sc-bg);
    color: var(--sc-text);
    min-height: 60vh;
}

.cart-page * { -webkit-tap-highlight-color: transparent; }

.cart-page.container { width: var(--sc-ctr-w, 90%) !important; max-width: var(--sc-ctr-maxw, 1400px) !important; }

/* ===== Header ===== */
.cart-header {
    background: var(--sc-hdr-bg); color: var(--sc-hdr-color);
    padding: var(--sc-hdr-py) var(--sc-hdr-px);
    margin: 0 -16px 0 -16px;
    position: sticky; top: 0; z-index: 100;
    box-shadow: var(--sc-hdr-shadow);
}
.cart-header h1 {
    font-size: var(--sc-hdr-title-size); font-weight: var(--sc-hdr-title-weight);
    display: flex; align-items: center; gap: var(--sc-hdr-title-gap); justify-content: center;
}
.cart-header h1 i {
    font-size: var(--sc-hdr-icon-size);
    background: var(--sc-hdr-icon-bg);
    padding: var(--sc-hdr-icon-padding);
    border-radius: 50%;
}

/* ===== Container ===== */
.cart-container {
    background: var(--sc-ctr-bg);
    border-radius: var(--sc-ctr-radius) var(--sc-ctr-radius) 0 0;
    overflow: hidden; box-shadow: var(--sc-ctr-shadow);
    margin: -20px 0 40px 0; position: relative; z-index: 10;
}

/* ===== Alerts ===== */
.cart-page .alert {
    padding: var(--sc-alert-py) var(--sc-alert-px);
    margin: var(--sc-alert-my) var(--sc-alert-mx);
    border-radius: var(--sc-alert-radius);
    font-weight: 500; display: flex; align-items: center; gap: var(--sc-alert-gap); border: none;
}
.cart-page .alert-success {
    background: linear-gradient(135deg, rgba(40,167,69,0.15), rgba(32,201,151,0.15));
    color: var(--sc-alert-success-color);
    border-right: 4px solid var(--sc-alert-success-border);
}
.cart-page .alert-error {
    background: linear-gradient(135deg, rgba(220,53,69,0.15), rgba(245,198,203,0.15));
    color: var(--sc-alert-error-color);
    border-right: 4px solid var(--sc-alert-error-border);
}

/* ===== Empty Cart ===== */
.empty-cart { text-align: center; padding: var(--sc-empty-py) var(--sc-empty-px); color: var(--sc-text-light); }
.empty-cart-icon {
    font-size: var(--sc-empty-icon-size); color: var(--sc-empty-icon-color);
    margin-bottom: var(--sc-empty-icon-mb); animation: scPulse 2s ease-in-out infinite;
}
.empty-cart h2 {
    font-size: var(--sc-empty-title-size); margin-bottom: var(--sc-empty-title-mb);
    color: var(--sc-empty-title-color); font-weight: 700;
}
.empty-cart p {
    font-size: var(--sc-empty-text-size); margin-bottom: var(--sc-empty-text-mb);
    line-height: var(--sc-empty-text-lh); color: var(--sc-empty-text-color);
}

/* ===== Base Buttons ===== */
.cart-page .btn {
    display: inline-flex; align-items: center; justify-content: center;
    gap: var(--sc-btn-gap); padding: var(--sc-btn-py) var(--sc-btn-px);
    border-radius: var(--sc-radius); font-weight: var(--sc-btn-weight);
    text-decoration: none; transition: all 0.3s cubic-bezier(0.4,0,0.2,1);
    border: none; cursor: pointer; font-size: var(--sc-btn-size);
    position: relative; overflow: hidden; min-width: var(--sc-btn-min-w);
}
.cart-page .btn-primary {
    background: var(--sc-btn-primary-bg); color: var(--sc-btn-primary-color);
    box-shadow: var(--sc-btn-primary-shadow);
}
.cart-page .btn-primary:active { transform: scale(0.98); }
.cart-page .btn-secondary {
    background: var(--sc-btn-secondary-bg); color: var(--sc-btn-secondary-color);
    border: 2px solid var(--sc-btn-secondary-border);
}
.cart-page .btn-secondary:active { transform: scale(0.98); }

/* ===== Send Order Button ===== */
.send-order-btn {
    background: var(--sc-send-bg); color: var(--sc-send-color); width: 100%;
    padding: var(--sc-send-py); font-size: var(--sc-send-size);
    margin-top: var(--sc-send-mt); border-radius: var(--sc-radius);
    font-weight: var(--sc-send-weight); border: none; cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4,0,0.2,1);
    display: inline-flex; align-items: center; justify-content: center;
    gap: var(--sc-send-gap); text-decoration: none;
}
.send-order-btn:hover {
    transform: translateY(-2px); box-shadow: var(--sc-send-shadow);
    color: var(--sc-send-color);
}
.send-order-btn:active { transform: scale(0.98); }

/* ===== Cart Content ===== */
.cart-content { padding: var(--sc-content-py) var(--sc-content-px); }
.cart-items { display: flex; flex-direction: column; gap: var(--sc-items-gap); }

/* ===== Cart Item ===== */
.cart-item {
    background: var(--sc-item-bg); border-radius: var(--sc-item-radius);
    padding: var(--sc-item-padding); box-shadow: var(--sc-item-shadow);
    border: 1px solid var(--sc-border);
    position: relative; overflow: hidden; transition: all 0.3s cubic-bezier(0.4,0,0.2,1);
    animation: scFadeInUp 0.6s cubic-bezier(0.4,0,0.2,1) both;
}
.cart-item:nth-child(1) { animation-delay: 0.1s; }
.cart-item:nth-child(2) { animation-delay: 0.2s; }
.cart-item:nth-child(3) { animation-delay: 0.3s; }
.cart-item:nth-child(4) { animation-delay: 0.4s; }
.cart-item:active { transform: translateY(2px); }

.cart-item-header { display: flex; align-items: flex-start; gap: var(--sc-item-header-gap); margin-bottom: var(--sc-item-header-mb); }
.cart-thumb {
    width: var(--sc-thumb-size); height: var(--sc-thumb-size);
    border-radius: var(--sc-thumb-radius); overflow: hidden;
    background: var(--sc-thumb-bg); flex-shrink: 0; position: relative;
}
.cart-thumb img { width: 100%; height: 100%; object-fit: cover; transition: all 0.3s cubic-bezier(0.4,0,0.2,1); }
.cart-thumb .no-image {
    width: 100%; height: 100%; display: flex; align-items: center; justify-content: center;
    background: var(--sc-noimg-bg); color: var(--sc-noimg-color); font-size: var(--sc-noimg-size);
}
.cart-item-info { flex: 1; }
.cart-item-name {
    font-size: var(--sc-item-name-size); font-weight: var(--sc-item-name-weight);
    color: var(--sc-item-name-color); margin-bottom: var(--sc-item-name-mb);
    line-height: var(--sc-item-name-lh); display: block; text-decoration: none;
    transition: all 0.3s cubic-bezier(0.4,0,0.2,1);
}
.cart-item-name:hover { color: var(--sc-secondary); }
.cart-item-price {
    font-size: var(--sc-item-price-size); font-weight: var(--sc-item-price-weight);
    color: var(--sc-item-price-color); margin-bottom: var(--sc-item-price-mb);
}
.cart-item-original-price {
    font-size: var(--sc-item-oprice-size); color: var(--sc-item-oprice-color);
    text-decoration: line-through; margin-left: 8px;
}
.cart-item-body { border-top: 1px solid var(--sc-border); padding-top: var(--sc-item-body-pt); }
.quantity-section { display: flex; align-items: center; justify-content: space-between; margin-bottom: var(--sc-qty-section-mb); }
.quantity-label { font-size: var(--sc-qty-label-size); color: var(--sc-text-light); font-weight: 500; }

.cart-page .quantity-control {
    display: flex; align-items: center; gap: 8px;
    background: var(--sc-qty-ctrl-bg); border-radius: var(--sc-qty-ctrl-radius); padding: var(--sc-qty-ctrl-padding);
}
.cart-page .qty-btn {
    width: var(--sc-qty-btn-size); height: var(--sc-qty-btn-size);
    border-radius: var(--sc-qty-btn-radius); border: none;
    background: var(--sc-qty-btn-bg); display: flex; align-items: center; justify-content: center;
    cursor: pointer; transition: all 0.3s cubic-bezier(0.4,0,0.2,1);
    font-weight: bold; color: var(--sc-qty-btn-color);
}
.cart-page .qty-btn:active { transform: scale(0.95); }
.cart-page .qty-btn.plus { color: var(--sc-qty-plus-color); background: var(--sc-qty-plus-bg); }
.cart-page .qty-btn.minus { color: var(--sc-qty-minus-color); background: var(--sc-qty-minus-bg); }
.cart-page .quantity-input {
    width: var(--sc-qty-input-w); height: var(--sc-qty-input-h);
    text-align: center; border: none; background: transparent;
    font-weight: 700; font-size: var(--sc-qty-input-size); color: var(--sc-text);
}
.cart-page .quantity-input::-webkit-outer-spin-button,
.cart-page .quantity-input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

.cart-item-footer { display: flex; align-items: center; justify-content: space-between; padding-top: var(--sc-item-footer-pt); border-top: 1px solid var(--sc-border); }
.item-total { font-size: var(--sc-total-size); font-weight: var(--sc-total-weight); color: var(--sc-total-color); }
.cart-discount-badge {
    background: var(--sc-disc-badge-bg); color: var(--sc-disc-badge-color);
    padding: var(--sc-disc-badge-py) var(--sc-disc-badge-px);
    border-radius: var(--sc-disc-badge-radius); font-size: var(--sc-disc-badge-size);
    font-weight: 600; display: flex; align-items: center; gap: 4px;
}
.no-discount { color: var(--sc-text-light); font-size: var(--sc-no-disc-size); }
.remove-btn {
    position: absolute; top: 16px; left: 16px;
    width: var(--sc-rm-size); height: var(--sc-rm-size); border-radius: 50%;
    background: var(--sc-rm-bg); color: var(--sc-rm-color);
    border: none; display: flex; align-items: center; justify-content: center;
    cursor: pointer; transition: all 0.3s cubic-bezier(0.4,0,0.2,1); z-index: 2;
}
.remove-btn:active { transform: scale(0.9); background: var(--sc-rm-active-bg); }

/* ===== Discount Section ===== */
.discount-section {
    margin-bottom: var(--sc-disc-sec-mb, 20px);
    background: var(--sc-disc-sec-bg);
    border-radius: var(--sc-disc-sec-radius, 14px);
    overflow: hidden;
    border: 1px solid var(--sc-border);
}

.discount-header {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 13px 18px;
    background: var(--sc-disc-header-bg);
    font-size: 0.88rem;
    font-weight: 700;
    color: var(--sc-disc-header-color);
}

.discount-header i {
    font-size: 0.9rem;
    opacity: 0.7;
}

.discount-body {
    padding: 16px 18px;
}

.discount-input-wrap {
    display: flex;
    align-items: center;
    background: var(--sc-ctr-bg);
    border: 1.5px solid var(--sc-disc-input-border);
    border-radius: var(--sc-disc-input-radius, 10px);
    overflow: hidden;
    transition: border-color 0.25s ease, box-shadow 0.25s ease;
}

.discount-input-wrap:focus-within {
    border-color: var(--sc-disc-input-focus-border, #D4A017);
    box-shadow: 0 0 0 3px rgba(212, 160, 23, 0.1);
}

.discount-input-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    flex-shrink: 0;
    color: var(--sc-disc-input-icon-color, #bbb);
    font-size: 0.9rem;
    transition: color 0.25s ease;
}

.discount-input-wrap:focus-within .discount-input-icon {
    color: var(--sc-disc-input-focus-border, #D4A017);
}

.discount-input {
    flex: 1;
    border: none;
    padding: 11px 0;
    font-size: var(--sc-disc-input-size, 0.9rem);
    font-family: inherit;
    background: transparent;
    color: var(--sc-text);
    outline: none;
    direction: ltr;
    text-align: center;
    letter-spacing: 2px;
    font-weight: 600;
}

.discount-input::placeholder {
    letter-spacing: 0;
    direction: rtl;
    font-weight: 400;
    color: var(--sc-disc-input-placeholder, #bbb);
}

.discount-status-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    flex-shrink: 0;
    font-size: 0.85rem;
    color: var(--sc-disc-input-icon-color, #bbb);
    transition: color 0.25s ease;
}

.discount-status-icon.status-valid {
    color: #28a745;
}

.discount-status-icon.status-invalid {
    color: #dc3545;
}

.discount-status-icon.status-loading i {
    animation: scSpin 0.7s linear infinite;
}



.discount-remove-btn {
    display: block;
    width: 100%;
    margin-top: 10px;
    padding: 8px;
    border: 1px dashed var(--sc-disc-input-border, #e2e5ec);
    border-radius: 8px;
    background: transparent;
    color: var(--sc-danger, #dc3545);
    font-size: 0.8rem;
    font-weight: 600;
    font-family: inherit;
    cursor: pointer;
    transition: all 0.2s ease;
}

.discount-remove-btn:hover {
    background: rgba(220, 53, 69, 0.05);
    border-color: var(--sc-danger, #dc3545);
}

.discount-message {
    display: none;
    padding: 8px 14px;
    border-radius: 8px;
    font-size: 0.82rem;
    text-align: center;
    margin-top: 10px;
    font-weight: 500;
    line-height: 1.5;
}

.discount-message.success {
    background: rgba(40, 167, 69, 0.08);
    color: #28a745;
}

.discount-message.error {
    background: rgba(220, 53, 69, 0.08);
    color: #dc3545;
}

.code-discount-row {
    color: var(--sc-code-row-color, #28a745);
    font-weight: 700;
    background: var(--sc-code-row-bg, rgba(40, 167, 69, 0.08));
    border-radius: 8px;
    padding: 8px 12px;
    margin: 8px 0;
}

.code-discount-row .summary-value {
    color: var(--sc-code-row-color, #28a745);
    font-weight: 800;
}

/* ===== Summary ===== */
.summary {
    background: var(--sc-summary-bg); padding: var(--sc-summary-py) var(--sc-summary-px);
    border-radius: var(--sc-summary-radius); box-shadow: var(--sc-summary-shadow);
    margin: var(--sc-summary-my) 0;
    position: sticky; bottom: 20px; z-index: 50;
    border: 1px solid var(--sc-summary-border);
}
.summary h3 {
    font-size: var(--sc-summary-title-size); margin-bottom: var(--sc-summary-title-mb);
    color: var(--sc-summary-title-color); display: flex; align-items: center;
    gap: var(--sc-summary-title-gap); font-weight: 700;
}
.summary-item { display: flex; justify-content: space-between; align-items: center; padding: var(--sc-summary-item-py) 0; border-bottom: 1px solid var(--sc-summary-border); }
.summary-item:last-child { border-bottom: none; }
.summary-label { font-weight: 500; color: var(--sc-summary-label-color); font-size: var(--sc-summary-label-size); }
.summary-value { font-weight: 700; color: var(--sc-summary-val-color); font-size: var(--sc-summary-val-size); }
.discount-value { color: var(--sc-success); }
.total-row { font-size: var(--sc-summary-total-size); margin-top: 8px; padding-top: 16px; border-top: 2px solid var(--sc-summary-border); }
.total-row .summary-value { color: var(--sc-summary-total-val-color); font-size: var(--sc-summary-total-val-size); }
.cart-actions { display: flex; justify-content: center; margin: 24px 0; }

/* ===== Scrollbar ===== */
.cart-page ::-webkit-scrollbar { width: var(--sc-scroll-w); }
.cart-page ::-webkit-scrollbar-track { background: var(--sc-scroll-track-bg); border-radius: 3px; }
.cart-page ::-webkit-scrollbar-thumb { background: var(--sc-scroll-thumb-bg); border-radius: 3px; }
.cart-page ::-webkit-scrollbar-thumb:hover { background: var(--sc-scroll-thumb-hover); }

/* ===== Modals ===== */
.cart-page .request-modal-overlay {
    display: none; position: fixed; top: 0; left: 0; right: 0; bottom: 0;
    background: var(--sc-modal-overlay-bg); z-index: 99999;
    align-items: center; justify-content: center; direction: rtl;
    backdrop-filter: blur(var(--sc-modal-overlay-blur));
}
.cart-page .request-modal-overlay.active { display: flex; }
.cart-page .request-modal-box {
    background: var(--sc-modal-box-bg);
    border-radius: var(--sc-modal-box-radius);
    padding: var(--sc-modal-box-pt) var(--sc-modal-box-px) var(--sc-modal-box-pb);
    max-width: var(--sc-modal-box-maxw); width: 90%; position: relative;
    box-shadow: var(--sc-modal-box-shadow); animation: scModalSlideIn 0.3s ease;
}
.cart-page .request-modal-close {
    position: absolute; top: 12px; left: 16px;
    background: none; border: none; font-size: var(--sc-modal-close-size);
    color: var(--sc-modal-close-color); cursor: pointer; line-height: 1; padding: 0;
    transition: color 0.2s;
}
.cart-page .request-modal-close:hover { color: var(--sc-modal-close-hover); }
.cart-page .request-modal-header { text-align: center; margin-bottom: var(--sc-modal-hdr-mb); }
.cart-page .request-modal-header i {
    font-size: var(--sc-modal-icon-size); color: var(--sc-modal-icon-color);
    margin-bottom: var(--sc-modal-icon-mb);
}
.cart-page .request-modal-header h3 {
    font-size: var(--sc-modal-title-size); font-weight: 700;
    margin: 0 0 var(--sc-modal-title-mb); color: var(--sc-modal-title-color);
}
.cart-page .request-modal-header p { font-size: var(--sc-modal-text-size); color: var(--sc-modal-text-color); margin: 0; }
.cart-page .request-modal-form-group { margin-bottom: var(--sc-modal-form-gap); }
.cart-page .request-modal-form-group label {
    display: block; font-size: var(--sc-modal-label-size); font-weight: 600;
    margin-bottom: var(--sc-modal-label-mb); color: var(--sc-modal-label-color);
}
.cart-page .request-modal-input-wrap {
    display: flex; align-items: center;
    border: 2px solid var(--sc-modal-input-border);
    border-radius: var(--sc-modal-input-radius);
    padding: 0 var(--sc-modal-input-px);
    transition: border-color 0.2s; background: var(--sc-modal-input-bg);
}
.cart-page .request-modal-input-wrap:focus-within { border-color: var(--sc-modal-input-focus-border); background: var(--sc-modal-input-bg); }
.cart-page .request-modal-input-wrap i { color: var(--sc-text-light); font-size: var(--sc-modal-icon-input-size); margin-left: 10px; }
.cart-page .request-modal-input-wrap input {
    flex: 1; border: none; outline: none; padding: var(--sc-modal-input-py) 0;
    font-size: var(--sc-modal-input-size); direction: ltr; text-align: left;
    background: transparent; color: var(--sc-text); font-family: inherit;
}
.cart-page .request-modal-input-wrap textarea {
    resize: none; border: none; flex: 1; outline: none; font-family: inherit;
    padding: 10px 0; background: transparent; color: var(--sc-text);
    min-height: 44px; line-height: 1.5;
}
.cart-page .request-modal-btn {
    width: 100%; padding: 14px; border: none;
    border-radius: var(--sc-modal-btn-radius);
    background: var(--sc-modal-btn-bg); color: var(--sc-modal-btn-color);
    font-size: var(--sc-modal-btn-size); font-weight: 600; cursor: pointer;
    transition: all 0.3s ease; box-shadow: var(--sc-modal-btn-shadow); font-family: inherit;
}
.cart-page .request-modal-btn:hover { transform: translateY(-2px); box-shadow: var(--sc-modal-btn-hover-shadow); }
.cart-page .request-modal-btn:disabled { opacity: 0.7; cursor: not-allowed; transform: none; }
.cart-page .request-modal-error { font-size: 12px; color: var(--sc-danger); margin-top: 6px; min-height: 18px; }
.cart-page .request-modal-info {
    text-align: center; margin-bottom: 20px; padding: 12px;
    background: var(--sc-modal-info-bg); border-radius: var(--sc-modal-info-radius);
}
.cart-page .request-modal-info p { margin: 0 0 4px; font-size: var(--sc-modal-info-text-size); color: var(--sc-text-light); }
.cart-page .request-modal-info strong {
    font-size: var(--sc-modal-info-strong-size); color: var(--sc-text);
    direction: ltr; display: inline-block;
}
.cart-page .request-modal-code-wrap { display: flex; gap: 8px; justify-content: center; direction: ltr; }
.cart-page .phone-code-input {
    width: var(--sc-modal-code-size); height: var(--sc-modal-code-h);
    text-align: center; font-weight: 700;
    border: 2px solid var(--sc-modal-code-border); border-radius: var(--sc-modal-code-radius);
    outline: none; transition: border-color 0.2s; color: var(--sc-text); font-family: inherit;
}
.cart-page .phone-code-input:focus { border-color: var(--sc-modal-code-focus-border); box-shadow: var(--sc-modal-code-focus-shadow); }
.cart-page .request-modal-resend { text-align: center; margin-top: 16px; font-size: var(--sc-modal-resend-size); color: var(--sc-modal-resend-color); }
.cart-page .request-modal-resend button {
    background: none; border: none; color: var(--sc-modal-resend-btn-color);
    font-weight: 600; cursor: pointer; font-size: var(--sc-modal-resend-size); font-family: inherit;
}
.cart-page .request-modal-resend button:disabled { color: var(--sc-modal-resend-disabled); cursor: not-allowed; }
.cart-page .request-modal-loading {
    position: absolute; top: 0; left: 0; right: 0; bottom: 0;
    background: var(--sc-modal-loading-bg); border-radius: var(--sc-modal-loading-radius);
    display: flex; align-items: center; justify-content: center; gap: 10px;
    font-size: var(--sc-modal-loading-size); color: var(--sc-modal-loading-color);
}
.cart-page .request-modal-loading i { font-size: var(--sc-modal-loading-icon-size); color: var(--sc-primary); }
.cart-page .request-modal-step { max-height: var(--sc-modal-step-maxh); overflow-y: auto; padding-left: 4px; }

/* ===== Responsive ===== */
@media (max-width: 480px) {
    .discount-body { padding: 12px 14px; }
    .discount-input-icon { width: 36px; }
    .discount-input { min-width: 100px; }
}
@media (min-width: 768px) {
    .cart-header { border-radius: 0 0 var(--sc-radius) var(--sc-radius); margin: 0 -24px 20px -24px; }
    .cart-container { border-radius: var(--sc-ctr-radius); margin: 0 0 40px 0; }
    .cart-items { gap: 20px; }
    .cart-item { padding: 24px; }
    .summary { padding: 28px 24px; }
}
@media (min-width: 992px) {
    .cart-content { display: grid; grid-template-columns: 1fr var(--sc-summary-grid-w, 350px); gap: 30px; align-items: start; }
    .summary { position: static; margin: 0; }
}

/* ===== Dark Mode ===== */
@media (prefers-color-scheme: dark) {
    .cart-page {
        --sc-bg: var(--sc-dark-bg);
        --sc-text: var(--sc-dark-text);
        --sc-text-light: #999999;
        --sc-border: var(--sc-dark-border);
        --sc-hdr-bg: linear-gradient(135deg, var(--sc-dark-bg), var(--sc-dark-card));
        --sc-ctr-bg: var(--sc-dark-card);
        --sc-item-bg: var(--sc-dark-card);
        --sc-disc-sec-bg: var(--sc-dark-card);
        --sc-disc-header-bg: var(--sc-dark-bg);
        --sc-disc-header-color: #ccc;
        --sc-disc-input-border: var(--sc-dark-border);
        --sc-disc-input-icon-color: #555;
        --sc-disc-input-placeholder: #555;
        --sc-summary-bg: var(--sc-dark-card);
        --sc-summary-border: var(--sc-dark-border);
        --sc-btn-secondary-bg: var(--sc-dark-bg);
        --sc-btn-secondary-border: var(--sc-dark-border);
        --sc-qty-ctrl-bg: var(--sc-dark-bg);
        --sc-qty-btn-bg: var(--sc-dark-bg);
        --sc-empty-icon-color: #555555;
        --sc-thumb-bg: var(--sc-dark-bg);
        --sc-noimg-bg: #333333;
        --sc-noimg-color: #666666;
        --sc-modal-box-bg: var(--sc-dark-card);
        --sc-modal-input-bg: var(--sc-dark-bg);
        --sc-modal-input-border: var(--sc-dark-border);
        --sc-modal-input-focus-border: var(--sc-secondary);
        --sc-modal-code-border: var(--sc-dark-border);
        --sc-modal-code-focus-border: var(--sc-secondary);
        --sc-modal-info-bg: var(--sc-dark-bg);
        --sc-modal-loading-bg: rgba(0,0,0,0.8);
        --sc-modal-loading-color: var(--sc-dark-text);
        --sc-modal-close-hover: var(--sc-dark-text);
        --sc-modal-title-color: var(--sc-dark-text);
        --sc-modal-label-color: var(--sc-dark-text);
        --sc-modal-icon-color: var(--sc-secondary);
        --sc-modal-resend-btn-color: var(--sc-secondary);
        --sc-modal-code-focus-shadow: 0 0 0 3px rgba(212,160,23,0.15);
        --sc-scroll-track-bg: var(--sc-dark-bg);
        --sc-info-bg: var(--sc-dark-bg);
    }
}

/* ===== Print ===== */
@media print {
    .cart-page .btn, .cart-page .send-order-btn, .cart-page .remove-btn,
    .cart-page .quantity-control, .cart-page .discount-section,
    .cart-page .request-modal-overlay { display: none !important; }
    .cart-page { background: white; color: black; font-size: 12pt; width: 100% !important; max-width: none !important; }
    .cart-page .container { margin: 0; padding: 0; box-shadow: none; }
    .cart-header { position: static; box-shadow: none; }
    .cart-container { box-shadow: none; margin: 0; }
    .cart-item { break-inside: avoid; border-bottom: 1px solid #ccc; }
    .summary { box-shadow: none; position: static; }
}
