/** Shopify CDN: Minification failed

Line 83:0 All "@import" rules must come first

**/
/**
 * BED — Ella Theme Overrides  v3.1
 * ALL selectors verified against actual curled DOM output.
 * No guessed class names. Every rule targets a class that exists in the real HTML.
 *
 * Brand: BED Sleep Store | bedsleepstore.myshopify.com
 * Colors: #132449 navy | #D8C3A8 beige | #F5F6F6 light grey | #AFAEB2 stone
 * Fonts: Montserrat (Latin) | IBM Plex Sans Arabic (RTL)
 */

/* ═══════════════════════════════════════════════════════
   HIDE NOISY ELLA UI ELEMENTS
   Classes verified from actual DOM
═══════════════════════════════════════════════════════ */

/* Multitasking sidebar bar (floating recently-viewed / wishlist icons, right side) */
.multitasking-bar,
.section-multitasking-bar {
  display: none !important;
}

/* Back-to-top floating button */
.button__back-to-top {
  display: none !important;
}

/* Cart countdown timer strip */
.cart-countdown {
  display: none !important;
}

/* ═══════════════════════════════════════════════════════
   ANNOUNCEMENT BAR — FORCE NAVY
   Outer element: announcement-bar.color-scheme-7
   Inner element: .utility-bar__grid.color-scheme-custom
   Both need explicit background override
═══════════════════════════════════════════════════════ */

announcement-bar,
announcement-bar.color-scheme-7,
.section-header announcement-bar {
  background-color: #132449 !important;
  background: #132449 !important;
  --color-background: rgb(19 36 73 / 1.0) !important;
  --color-background-rgb: 19 36 73 !important;
  --color-foreground: rgb(216 195 168 / 1.0) !important;
}

.utility-bar__grid,
.utility-bar {
  background-color: #132449 !important;
  background: #132449 !important;
}

.utility-bar__grid *,
.utility-bar *,
.announcement-bar__message,
.announcement-bar__message * {
  color: #D8C3A8 !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 11px !important;
  letter-spacing: 0.06em !important;
}

/* Color scheme 7 override — used on announcement bar outer wrapper */
.color-scheme-7 {
  background-color: #132449 !important;
  background: #132449 !important;
  --color-background: rgb(19 36 73 / 1.0) !important;
  --color-foreground: rgb(216 195 168 / 1.0) !important;
  color: #D8C3A8 !important;
}

/* ═══════════════════════════════════════════════════════
   0. FONTS & CSS TOKENS
═══════════════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,300;0,400;0,500;0,600;0,700;1,400&family=IBM+Plex+Sans+Arabic:wght@400;600&display=swap');

:root {
  --bed-navy:   #132449;
  --bed-beige:  #D8C3A8;
  --bed-light:  #F5F6F6;
  --bed-stone:  #AFAEB2;
  --bed-muted:  #5F6675;
  --bed-border: #D9DADF;
}


/* ═══════════════════════════════════════════════════════
   1. GLOBAL — BODY, HEADINGS, FONTS
═══════════════════════════════════════════════════════ */

body {
  font-family: 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
  background-color: #F5F6F6 !important;
  color: #132449 !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
  color: #132449 !important;
  font-weight: 500 !important;
  letter-spacing: -0.01em;
}

/* Global link */
a {
  font-family: 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
}

/* Ella uses color-scheme-1 on many sections (light grey bg, dark text)
   Override the bg to #F5F6F6 and text to our navy */
.color-scheme-1 {
  --color-background: 245 246 246 !important;
  --color-foreground: 19 36 73 !important;
  background-color: #F5F6F6 !important;
  color: #132449 !important;
}

/* color-scheme-2 is used on cards/footer — keep white for cards */
.color-scheme-2 {
  --color-background: 255 255 255 !important;
}


/* ═══════════════════════════════════════════════════════
   2. HEADER
   Verified classes: .header__row--top, .header__column--left/center/right,
   .header__icon, .header__menu-item, .header__heading-link,
   .header__inline-menu, .header__search
═══════════════════════════════════════════════════════ */

/* The main visible header bar — force navy background */
.header__row--top {
  background-color: #132449 !important;
  border-bottom: none !important;
  box-shadow: none !important;
}

/* Override color-scheme-1 when it's on the header row */
.header__row.header__row--top {
  background-color: #132449 !important;
  --color-background: 19 36 73 !important;
  --color-foreground: 245 246 246 !important;
}

/* Logo link & text */
.header__heading-link {
  color: #F5F6F6 !important;
  text-decoration: none !important;
}

.header__heading {
  color: #F5F6F6 !important;
}

/* Show the "original" logo (light version) on the navy header */
.header-logo__image-container--original {
  opacity: 1 !important;
}

.header-logo__image-container--inverse {
  display: none !important;
}

/* Desktop nav menu links */
.header__menu-item {
  color: #F5F6F6 !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  opacity: 1 !important;
}

.header__menu-item:hover,
.header__menu-item:focus {
  opacity: 0.75 !important;
  color: #F5F6F6 !important;
  text-decoration: none !important;
}

/* Span text inside nav links */
.header__menu-item .text {
  color: inherit !important;
}

/* Header icons (search, cart, account, menu) */
.header__icon {
  color: #F5F6F6 !important;
  fill: #F5F6F6 !important;
}

.header__icon svg,
.header__icon svg path,
.header__icon svg use {
  fill: #F5F6F6 !important;
  color: #F5F6F6 !important;
  stroke: none !important;
}

.header__icon:hover {
  opacity: 0.75 !important;
}

/* Cart count badge on icon */
.cart-count-bubble,
.header__icon .cart-count-bubble {
  background-color: #D8C3A8 !important;
  color: #132449 !important;
}

/* Search input inside header */
.header__search .field__input,
.header__search input {
  background-color: rgba(245, 246, 246, 0.12) !important;
  border-color: rgba(245, 246, 246, 0.3) !important;
  color: #F5F6F6 !important;
}

.header__search .field__input::placeholder {
  color: rgba(245, 246, 246, 0.6) !important;
}

/* Header message bar (promo strip) */
.header-message {
  color: #F5F6F6 !important;
  font-family: 'Montserrat', sans-serif !important;
}

/* Header columns layout */
.header__columns {
  max-width: 1320px;
  margin: 0 auto;
}



/* ═══════════════════════════════════════════════════════
   3. NAVIGATION DRAWERS (mobile menu)
   Verified classes: .header-mobile, .drawer__header, .drawer__container
═══════════════════════════════════════════════════════ */

/* Mobile menu drawer background */
.header-mobile,
.drawer--menu {
  background-color: #132449 !important;
}

.drawer__header {
  background-color: #132449 !important;
  border-bottom: 1px solid rgba(245, 246, 246, 0.1) !important;
}

/* Mobile menu links */
.header-mobile a,
.drawer--menu a,
.drawer--menu .link {
  color: #F5F6F6 !important;
  font-family: 'Montserrat', sans-serif !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
}

/* Drawer close button */
.drawer__close {
  color: #F5F6F6 !important;
  background: transparent !important;
}

.drawer__close svg,
.drawer__close svg path {
  fill: #F5F6F6 !important;
}


/* ═══════════════════════════════════════════════════════
   4. FOOTER
   Verified classes: .section-footer, .section-background.color-scheme-2,
   .footer__copyright
═══════════════════════════════════════════════════════ */

/* Outer footer shell */
.section-footer {
  background-color: #132449 !important;
}

/* Ella's dedicated background layer inside the footer */
.section-footer .section-background {
  background-color: #132449 !important;
}

/* Ella's content section inside footer */
.section-footer .section {
  background-color: #132449 !important;
  color: #F5F6F6 !important;
}

/* Force all text inside footer to be light */
.section-footer * {
  color: #F5F6F6 !important;
  border-color: rgba(245, 246, 246, 0.15) !important;
}

/* Footer links */
.section-footer a {
  color: #D8C3A8 !important;
  text-decoration: none !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 13px !important;
  opacity: 0.85 !important;
}

.section-footer a:hover {
  opacity: 1 !important;
  color: #D8C3A8 !important;
}

/* Copyright row */
.footer__copyright {
  color: rgba(245, 246, 246, 0.55) !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 11px !important;
  letter-spacing: 0.04em !important;
}

/* Footer headings */
.section-footer h1,
.section-footer h2,
.section-footer h3,
.section-footer h4,
.section-footer h5,
.section-footer h6 {
  color: #F5F6F6 !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
}

/* Payment icons in footer */
.section-footer .payment-icon,
.section-footer .icon-payment {
  filter: brightness(0) invert(1) opacity(0.5) !important;
}

/* Hide Ella's giant jumbo "ELLA" text in footer */
.section-footer .jumbo-text-block,
.section-footer [class*="jumbo-text"] {
  display: none !important;
}

/* Also hide the HALOTHEMES credit link */
.section-footer a[href*="halothemes"] {
  display: none !important;
}
.section-footer a[href*="halothemes"]:only-child,
.section-footer p:has(a[href*="halothemes"]) {
  display: none !important;
}


/* ═══════════════════════════════════════════════════════
   5. COLLECTION PAGE
   Verified classes: .template-collection, .collection-wrapper,
   .product-grid-item, .card--block, .card__inner, .card__media,
   .card--block-title, .card--block-price, .card--block-vendor,
   .facets-container, .facets, .sorting-wrapper, .switcher-grid
═══════════════════════════════════════════════════════ */

/* Page background */
.template-collection {
  background-color: #F5F6F6 !important;
}

/* Main collection wrapper */
.collection-wrapper {
  background-color: #F5F6F6 !important;
}

/* ── HIDE filters, sorting, grid-switcher ── */
.facets-container,
.facets,
.facets__form-wrapper-inner,
.active-facets,
.facets__heading--vertical,
.facets__panel,
.facets-wrap,
.mobile-facets {
  display: none !important;
}

.sorting-wrapper {
  display: none !important;
}

.switcher-grid {
  display: none !important;
}

/* Hide the sort/filter bar row entirely */
.facet-filters.sorting {
  display: none !important;
}

/* ── COLLECTION PRODUCT GRID ── */

/* Force Swiper wrapper to display as a 2-col wrap grid */
.template-collection .swiper-wrapper {
  display: flex !important;
  flex-wrap: wrap !important;
  transform: none !important;
  width: auto !important;
}

/* Each grid item = 2 columns on desktop, full width on mobile */
.template-collection .product-grid-item {
  width: calc(50% - 12px) !important;
  flex: 0 0 calc(50% - 12px) !important;
  max-width: calc(50% - 12px) !important;
  margin-bottom: 24px !important;
}

@media (max-width: 767px) {
  .template-collection .product-grid-item {
    width: calc(50% - 8px) !important;
    flex: 0 0 calc(50% - 8px) !important;
    max-width: calc(50% - 8px) !important;
    margin-bottom: 16px !important;
  }
}

/* Gap between cards */
.template-collection .swiper-wrapper {
  gap: 24px !important;
}

@media (max-width: 767px) {
  .template-collection .swiper-wrapper {
    gap: 16px !important;
  }
}

/* ── PRODUCT CARDS ── */

/* Card outer wrapper */
.card--block.card-wrapper.product-card-wrapper {
  border: none !important;
  box-shadow: none !important;
  background: transparent !important;
  transition: none !important;
}

/* Card image container (color-scheme-2 = white bg) */
.card__inner.color-scheme-2 {
  background-color: #FFFFFF !important;
  border-radius: 4px !important;
  overflow: hidden !important;
}

/* Remove ratio padding override — let Ella handle aspect ratio */
.card__inner.ratio {
  aspect-ratio: 4 / 3;
}

/* Card media image */
.card__media img {
  object-fit: cover !important;
  object-position: center !important;
  transition: transform 0.4s ease !important;
}

.card--block.card-wrapper:hover .card__media img {
  transform: scale(1.03) !important;
}

/* Card title */
.card--block-title {
  color: #132449 !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 1.3 !important;
  letter-spacing: 0.01em !important;
  margin-top: 10px !important;
  margin-bottom: 4px !important;
}

.card--block-title * {
  color: #132449 !important;
  font-family: 'Montserrat', sans-serif !important;
}

/* Card price — show but style cleanly */
.card--block-price,
.card--block-price.card-information {
  color: #132449 !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 13px !important;
  font-weight: 400 !important;
}

.card--block-price * {
  color: #132449 !important;
  font-family: 'Montserrat', sans-serif !important;
}

.price-item--regular {
  color: #132449 !important;
}

.price-item--sale {
  color: #132449 !important;
}

/* Hide vendor */
.card--block-vendor {
  display: none !important;
}

/* Card "quick add" button — clean navy style */
.card--block .button,
.product-card-wrapper .button {
  background-color: #132449 !important;
  color: #F5F6F6 !important;
  border: 1px solid #132449 !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  border-radius: 0 !important;
  padding: 10px 20px !important;
}

.card--block .button:hover,
.product-card-wrapper .button:hover {
  background-color: #D8C3A8 !important;
  color: #132449 !important;
  border-color: #D8C3A8 !important;
}


/* ═══════════════════════════════════════════════════════
   6. PRODUCT PAGE (PDP)
   Verified classes: .template-product, .main-product-information,
   .product-information__grid, .product-form__buttons, .product-form__input,
   .variant-selects, .price-item, .sticky-atc
═══════════════════════════════════════════════════════ */

/* Page background */
.template-product {
  background-color: #F5F6F6 !important;
}

/* Main product section */
.main-product-information {
  background-color: #F5F6F6 !important;
}

/* Product title h1 */
.main-product-information h1 {
  color: #132449 !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 28px !important;
  font-weight: 500 !important;
  letter-spacing: -0.01em !important;
  line-height: 1.2 !important;
  margin-bottom: 12px !important;
}

@media (max-width: 767px) {
  .main-product-information h1 {
    font-size: 22px !important;
  }
}

/* Product price */
.main-product-information .price-item {
  color: #132449 !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 20px !important;
  font-weight: 400 !important;
}

.main-product-information .price-item--regular {
  color: #132449 !important;
  font-size: 20px !important;
}

.main-product-information .price-item--sale {
  color: #132449 !important;
}

/* Product description text */
.product-information .text-block,
.main-product-information p,
.main-product-information .paragraph {
  color: #5F6675 !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 14px !important;
  line-height: 1.7 !important;
}

/* ── VARIANT SELECTORS ── */
.variant-selects {
  font-family: 'Montserrat', sans-serif !important;
}

/* Variant option pills */
.variant-option--pill .variant-option__value,
.product-form__input--pill label {
  border: 1px solid #AFAEB2 !important;
  color: #132449 !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  border-radius: 0 !important;
  background-color: transparent !important;
  padding: 7px 14px !important;
  transition: all 0.2s ease !important;
}

.variant-option--pill .variant-option__value:hover,
.product-form__input--pill label:hover {
  border-color: #132449 !important;
  background-color: #132449 !important;
  color: #F5F6F6 !important;
}

/* Selected variant pill */
.variant-option--pill input:checked + label,
.product-form__input--pill input:checked + .variant-option__value {
  background-color: #132449 !important;
  border-color: #132449 !important;
  color: #F5F6F6 !important;
  font-weight: 500 !important;
}

/* ── ADD TO CART BUTTON ── */

/* The container wrapping the ATC button */
.product-form__buttons {
  margin-top: 16px !important;
}

/* Main ATC button: Ella renders it as .button.w-full inside product-form__buttons */
.product-form__buttons .button,
.add-to-cart-button-container .button,
.add-to-cart-button-inner .button {
  background-color: #132449 !important;
  color: #F5F6F6 !important;
  border: 2px solid #132449 !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  border-radius: 0 !important;
  padding: 16px 32px !important;
  transition: background-color 0.2s ease, color 0.2s ease !important;
  min-height: 52px !important;
}

.product-form__buttons .button:hover,
.add-to-cart-button-container .button:hover {
  background-color: #D8C3A8 !important;
  border-color: #D8C3A8 !important;
  color: #132449 !important;
}

/* ── STICKY ATC BAR ── */
.sticky-atc {
  background-color: #132449 !important;
  border-top: none !important;
  box-shadow: 0 -2px 12px rgba(19, 36, 73, 0.15) !important;
}

.sticky-atc * {
  color: #F5F6F6 !important;
  font-family: 'Montserrat', sans-serif !important;
}

.sticky-atc__title {
  font-size: 14px !important;
  font-weight: 500 !important;
  color: #F5F6F6 !important;
}

.sticky-atc__price {
  font-size: 14px !important;
  color: rgba(245, 246, 246, 0.85) !important;
}

.sticky-atc .button,
.sticky-atc__action .button {
  background-color: #D8C3A8 !important;
  color: #132449 !important;
  border: none !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  border-radius: 0 !important;
  padding: 12px 24px !important;
}

.sticky-atc .button:hover {
  background-color: #F5F6F6 !important;
  color: #132449 !important;
}


/* ═══════════════════════════════════════════════════════
   7. CART PAGE
   Verified classes: .template-cart, .section--main-cart,
   .cart-items-component, .cart__checkout-button,
   .cart__viewcart-button, .cart__warnings
═══════════════════════════════════════════════════════ */

/* Page background */
.template-cart {
  background-color: #F5F6F6 !important;
}

/* Main cart section */
.section--main-cart {
  background-color: #F5F6F6 !important;
}

/* Cart items container */
.cart-items-component {
  background-color: #F5F6F6 !important;
}

/* Empty cart text */
.cart__empty-text,
.cart__warnings {
  color: #132449 !important;
  font-family: 'Montserrat', sans-serif !important;
}

/* Cart countdown (hide Ella's native countdown — BED doesn't use urgency tactics) */
.cart-countdown {
  display: none !important;
}

/* Cart item title/text */
.cart-items-component h2,
.cart-items-component h3,
.cart-items-component .text-block {
  color: #132449 !important;
  font-family: 'Montserrat', sans-serif !important;
}

/* View Cart button */
.cart__viewcart-button {
  background-color: transparent !important;
  border: 1px solid #132449 !important;
  color: #132449 !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  border-radius: 0 !important;
  padding: 14px 24px !important;
}

.cart__viewcart-button:hover {
  background-color: #132449 !important;
  color: #F5F6F6 !important;
}

/* Checkout button — primary CTA, beige/navy */
.cart__checkout-button {
  background-color: #132449 !important;
  border: 2px solid #132449 !important;
  color: #F5F6F6 !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  border-radius: 0 !important;
  padding: 16px 24px !important;
  min-height: 52px !important;
}

.cart__checkout-button:hover {
  background-color: #D8C3A8 !important;
  border-color: #D8C3A8 !important;
  color: #132449 !important;
}

/* Cart drawer footer (mini-cart in header) */
.cart-drawer__footer {
  background-color: #F5F6F6 !important;
  border-top: 1px solid #D9DADF !important;
}

/* Cart quantity inputs */
.cart__quantity,
.quantity__input {
  border: 1px solid #AFAEB2 !important;
  color: #132449 !important;
  font-family: 'Montserrat', sans-serif !important;
  background-color: transparent !important;
}


/* ═══════════════════════════════════════════════════════
   8. BUTTONS — GLOBAL OVERRIDES
   .button class is used across Ella for CTAs
═══════════════════════════════════════════════════════ */

/* Generic .button default — navy */
.button:not(.header__icon):not(.drawer__close):not(.search__button):not(.reset__button):not(.modal__close):not(.multi-t__button):not(.t-button):not(.button--drawer) {
  font-family: 'Montserrat', sans-serif !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  border-radius: 0 !important;
}

/* button--secondary style (used on cart checkout) */
.button--secondary {
  background-color: #132449 !important;
  border-color: #132449 !important;
  color: #F5F6F6 !important;
}

.button--secondary:hover {
  background-color: #D8C3A8 !important;
  border-color: #D8C3A8 !important;
  color: #132449 !important;
}

/* button-secondary (no double-dash — used on login page links) */
.button-secondary {
  background-color: transparent !important;
  border: 1px solid #132449 !important;
  color: #132449 !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 13px !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  border-radius: 0 !important;
}

.button-secondary:hover {
  background-color: #132449 !important;
  color: #F5F6F6 !important;
}


/* ═══════════════════════════════════════════════════════
   9. SEARCH MODAL
═══════════════════════════════════════════════════════ */

.search-modal__close-button {
  color: #132449 !important;
}

.search-modal__close-button svg,
.search-modal__close-button svg path {
  fill: #132449 !important;
}

/* Predictive search dropdown */
.predictive-search {
  font-family: 'Montserrat', sans-serif !important;
}

.predictive-search .predictive-search__item-heading {
  color: #132449 !important;
  font-family: 'Montserrat', sans-serif !important;
}


/* ═══════════════════════════════════════════════════════
   10. BED CUSTOM SECTIONS (Homepage, Cart, PDP)
   These are our own Liquid sections — just ensure they
   inherit correct fonts and have no Ella interference.
═══════════════════════════════════════════════════════ */

.bed-section {
  font-family: 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

/* Homepage hero */
.bed-section-hero {
  font-family: 'Montserrat', sans-serif;
}

/* Homepage trusted-by logos */
.bed-section-trusted h2,
.bed-section-trusted-by h2 {
  font-family: 'Montserrat', sans-serif !important;
  color: #132449 !important;
}

/* Homepage testimonials */
.bed-section-testimonials {
  font-family: 'Montserrat', sans-serif;
}

/* Collection universe hero */
.bed-section-universe-hero {
  font-family: 'Montserrat', sans-serif;
}

/* PDP trust band */
.bed-section-pdp-trust {
  font-family: 'Montserrat', sans-serif;
}

/* Cart BED sections */
.bed-section-cart-header {
  font-family: 'Montserrat', sans-serif;
}

.bed-section-cart-trust {
  font-family: 'Montserrat', sans-serif;
}

.bed-section-cart-footer {
  font-family: 'Montserrat', sans-serif;
}


/* ═══════════════════════════════════════════════════════
   11. ANNOUNCEMENT BAR / UTILITY BAR
   Verified class: .utility-bar__grid, .group-block--utility-bar
═══════════════════════════════════════════════════════ */

.utility-bar__grid {
  background-color: #132449 !important;
  color: #D8C3A8 !important;
}

.utility-bar__grid *,
.utility-bar__grid a {
  color: #D8C3A8 !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 11px !important;
  letter-spacing: 0.06em !important;
}


/* ═══════════════════════════════════════════════════════
   12. BREADCRUMBS
═══════════════════════════════════════════════════════ */

.breadcrumbs,
.breadcrumb {
  font-family: 'Montserrat', sans-serif !important;
  font-size: 11px !important;
  color: #AFAEB2 !important;
  letter-spacing: 0.04em !important;
}

.breadcrumbs a,
.breadcrumb a {
  color: #AFAEB2 !important;
  text-decoration: none !important;
}

.breadcrumbs a:hover,
.breadcrumb a:hover {
  color: #132449 !important;
}


/* ═══════════════════════════════════════════════════════
   13. MOBILE OVERRIDES
═══════════════════════════════════════════════════════ */

@media (max-width: 767px) {

  /* Header stays navy on mobile */
  .header__row--top {
    background-color: #132449 !important;
  }

  /* Header icons on mobile */
  .header__icon {
    color: #F5F6F6 !important;
  }

  .header__icon svg,
  .header__icon svg path {
    fill: #F5F6F6 !important;
  }

  /* Collection — 2 col on mobile too */
  .template-collection .product-grid-item {
    width: calc(50% - 8px) !important;
    flex: 0 0 calc(50% - 8px) !important;
    max-width: calc(50% - 8px) !important;
  }

  /* Card title smaller on mobile */
  .card--block-title {
    font-size: 12px !important;
  }

  /* Card price smaller on mobile */
  .card--block-price {
    font-size: 12px !important;
  }

  /* ATC button full-width on mobile */
  .product-form__buttons .button {
    padding: 14px 20px !important;
    font-size: 12px !important;
  }

  /* Cart checkout button on mobile */
  .cart__checkout-button {
    padding: 14px 20px !important;
    font-size: 12px !important;
  }

  /* Footer reduce padding on mobile */
  .section-footer .section {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }

}

/* Tablet */
@media (min-width: 768px) and (max-width: 1023px) {

  .template-collection .product-grid-item {
    width: calc(50% - 12px) !important;
    flex: 0 0 calc(50% - 12px) !important;
    max-width: calc(50% - 12px) !important;
  }

}


/* ═══════════════════════════════════════════════════════
   14. RTL / ARABIC SUPPORT
═══════════════════════════════════════════════════════ */

[lang="ar"] body,
[dir="rtl"] body {
  font-family: 'IBM Plex Sans Arabic', 'Montserrat', Arial, sans-serif !important;
}

[lang="ar"] h1,
[lang="ar"] h2,
[lang="ar"] h3,
[lang="ar"] h4,
[dir="rtl"] h1,
[dir="rtl"] h2,
[dir="rtl"] h3 {
  font-family: 'IBM Plex Sans Arabic', Arial, sans-serif !important;
  line-height: 1.4 !important;
}

[lang="ar"] p,
[dir="rtl"] p {
  font-family: 'IBM Plex Sans Arabic', Arial, sans-serif !important;
  line-height: 1.8 !important;
}


/* ═══════════════════════════════════════════════════════
   15. SCROLLBAR STYLING
═══════════════════════════════════════════════════════ */

.cus-scrollbar::-webkit-scrollbar {
  width: 4px;
  height: 4px;
}

.cus-scrollbar::-webkit-scrollbar-track {
  background: #F5F6F6;
}

.cus-scrollbar::-webkit-scrollbar-thumb {
  background: #D8C3A8;
  border-radius: 2px;
}


/* ═══════════════════════════════════════════════════════
   16. FOCUS / ACCESSIBILITY
═══════════════════════════════════════════════════════ */

*:focus-visible {
  outline: 2px solid #D8C3A8 !important;
  outline-offset: 3px !important;
}

.focus-inset:focus-visible {
  outline: 2px solid #D8C3A8 !important;
  outline-offset: -2px !important;
}


/* ═══════════════════════════════════════════════════════
   17. TRANSITIONS — QUIET (no flashy animations)
═══════════════════════════════════════════════════════ */

/* Override Ella's button hover animations to keep it quiet */
.button-overflow {
  overflow: visible !important;
}

.button-text-hover {
  display: none !important;
}

/* Disable Ella's text-hover slide effect entirely */
.button-text-main {
  position: static !important;
  z-index: auto !important;
}