﻿body{
    color: var(--sbs-text, #FFF);
    background-color: var(--sbs-surface, #000);
}

header {
    /* This sheet loads AFTER cartview.css, so a flat colour here defeated the brand bar
       entirely in dark mode - the header went pure black, identical to the page, and the
       store name floated with no bar at all. Honour --header-bg (the store's own primary)
       and keep #000 only as the fallback for stores without a palette. */
    background-color: var(--header-bg, #000);
    border-bottom: 1px solid var(--sbs-border, #2f2f2f);
}
/* ========================== */
/* ======== Borders ========= */
/* ========================== */
#basket_title{
    border-top: 1px solid var(--sbs-border, #2f2f2f);
}
#basket_title, .basket_item{
    border-bottom: 1px solid var(--sbs-border, #2f2f2f);
}
.basket_item_quantity input, #basket_coupon input{
    border: 1px solid var(--sbs-border, #2f2f2f);
}
@media only screen and (min-width:600px){
    .basket_content_header_item, #basket_information{
        border-bottom: 1px solid var(--sbs-border, #2f2f2f);
    }
}

.secure_image{
    -webkit-filter: brightness(0) invert(1);
    filter: brightness(0) invert(1);
}

.basket_coupon_container label{
    color: var(--sbs-text-muted, #999);
}

/* ========================== */
/* === Popups & Gift Cards == */
/* ========================== */
.popup, #fws-giftcard-busywait {
    background: var(--sbs-surface-alt, #1a1a1a);
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.6);
}
.popup input, #fws-giftcard-busywait input {
    background-color: #2f2f2f;
    color: #fff;
    border-color: #444;
}
.popup input::placeholder {
    color: #888;
}
.popup svg, .popup svg path {
    fill: #fff;
}
.close-btn {
    color: #fff;
}
#giftcard_feedback, #giftcardConfirm {
    color: #fff;
}
#active_giftcards span {
    color: #fff;
}
button.remove-giftcard {
    background-color: #333;
    color: #fff;
    border: 1px solid #555;
}

/* ========================== */
/* ====== Coupon Input ====== */
/* ========================== */
#basket_coupon input {
    background-color: var(--sbs-surface-alt, #1a1a1a);
    color: var(--sbs-text, #fff);
}

/* ========================== */
/* ======= Error Text ======= */
/* ========================== */
#basket_error * {
    color: #ff6b6b;
}

/* ========================== */
/* === Loyalty Points Panel = */
/* ========================== */
#fws-info-bar-container #fws-info-bar2 {
    background: #1a1a1a !important;
    color: #e0e0e0 !important;
}
#fws-info-bar-container #fws-info-bar2 .fws-info-bar2-list-item {
    background-color: #2f2f2f !important;
    border-color: #444 !important;
}
.earn_action, .redeem_action {
    background-color: #2f2f2f;
    color: #e0e0e0;
}
.fws-info-bar2-list-features-item a {
    color: #e0e0e0 !important;
}
.redeem_icon {
    color: #e0e0e0 !important;
}
#fws-info-bar-container i {
    color: #e0e0e0;
}
span.points {
    color: #fff;
}
.fws-info-bar2-list-features-item::before {
    border-color: #666 !important;
}
.locked a {
    background: #444 !important;
}