/* ==========================================
   BLENTREE HEADER CART
   Live header (Elementor): bag icon + count badge + total price
   ========================================== */

/* Sticky header — stays at top of viewport while scrolling */
body header[data-elementor-type="header"] {
    position: sticky !important;
    top: 0 !important;
    left: 0;
    right: 0;
    z-index: 999 !important;
    background-color: #CF1D2C !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
    transition: box-shadow 0.25s ease;
}
/* When admin bar is showing */
body.admin-bar header[data-elementor-type="header"] {
    top: 32px !important;
}
@media (max-width: 782px) {
    body.admin-bar header[data-elementor-type="header"] {
        top: 46px !important;
    }
}

/* Header background — brand red on ALL pages (matches home) */
body header[data-elementor-type="header"] > .e-con,
body header[data-elementor-type="header"] > .e-con-full,
body header[data-elementor-type="header"] .elementor-element > .e-con-inner {
    background-color: #CF1D2C !important;
}

/* Constrain header CONTENT to align with the site's other Elementor
   sections. Main sections use 10% padding on wide desktop, but the
   header has extra items (logo + 6 nav + 2 icons) so it needs more
   room on mid-range desktops (1200-1600px) — we scale padding down
   through several breakpoints and force nowrap so nothing breaks
   onto a new line. */
body header[data-elementor-type="header"] > .e-con,
body header[data-elementor-type="header"] > .e-con-full {
    flex-wrap: nowrap !important;
    box-sizing: border-box !important;
}
/* Very wide screens: match sections exactly at 10% */
@media (min-width: 1600px) {
    body header[data-elementor-type="header"] > .e-con,
    body header[data-elementor-type="header"] > .e-con-full {
        padding-left: 10% !important;
        padding-right: 10% !important;
    }
}
/* Mid-range desktop (1200 - 1599px): fixed 60px so header items fit */
@media (min-width: 1200px) and (max-width: 1599px) {
    body header[data-elementor-type="header"] > .e-con,
    body header[data-elementor-type="header"] > .e-con-full {
        padding-left: 60px !important;
        padding-right: 60px !important;
    }
}
/* Small desktop / large tablet (992 - 1199px) */
@media (min-width: 992px) and (max-width: 1199px) {
    body header[data-elementor-type="header"] > .e-con,
    body header[data-elementor-type="header"] > .e-con-full {
        padding-left: 40px !important;
        padding-right: 40px !important;
    }
}
/* Tablet — Elementor's own mobile-nav breakpoint kicks in around here */
@media (max-width: 991px) {
    body header[data-elementor-type="header"] > .e-con,
    body header[data-elementor-type="header"] > .e-con-full {
        padding-left: 24px !important;
        padding-right: 24px !important;
    }
}
@media (max-width: 480px) {
    body header[data-elementor-type="header"] > .e-con,
    body header[data-elementor-type="header"] > .e-con-full {
        padding-left: 16px !important;
        padding-right: 16px !important;
    }
}
/* If Elementor wrapped children in .e-con-inner, remove any max-width
   it may have set so the padding above defines the actual width. */
body header[data-elementor-type="header"] > .e-con > .e-con-inner,
body header[data-elementor-type="header"] > .e-con-full > .e-con-inner {
    max-width: 100% !important;
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    box-sizing: border-box !important;
}

/* Cart link — flex row: icon | price */
.blentree-cart-link {
    display: inline-flex !important;
    align-items: center;
    gap: 14px;
    padding: 6px 10px;
    text-decoration: none;
    white-space: nowrap;
    line-height: 1;
    color: #ffffff !important;
}
.blentree-cart-link:hover { color: #F5A623 !important; }

/* Icon wrapper — anchors the count badge */
.blentree-cart-icon {
    position: relative;
    display: inline-block;
    width: 22px;
    height: 22px;
    font-size: 20px;
    line-height: 1;
    flex: 0 0 22px;
    color: #ffffff;
}
.blentree-cart-icon i {
    display: block;
    line-height: 22px;
    text-align: center;
    color: inherit;
}

/* Count badge — floats on icon's top-right corner (yellow on red bg) */
.blentree-cart-count {
    position: absolute;
    top: -8px;
    right: -10px;
    background: #F5A623;
    color: #CF1D2C;
    font-size: 10px;
    font-weight: 700;
    min-width: 16px;
    height: 16px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 4px;
    line-height: 1;
    box-shadow: 0 0 0 2px #fff;
    z-index: 2;
}

/* Total price */
.blentree-cart-total {
    font-family: 'Poppins', sans-serif;
    font-size: 15px;
    font-weight: 700;
    color: #ffffff;
    line-height: 1;
    white-space: nowrap;
}
.blentree-cart-link:hover .blentree-cart-total { color: #F5A623; }

@media (max-width: 1024px) {
    .blentree-cart-total { font-size: 14px; }
}
@media (max-width: 600px) {
    .blentree-cart-total { display: none; }
    .blentree-cart-link { gap: 0; padding: 6px; }
}