/* =============================================================================
   ALLANI NEW UI — Modern CSS Overlay for allanichild
   Parent: allanichild (inherits all Dorado templates & modules)
   This CSS targets the EXACT classes from allanichild's HTML output.
   ============================================================================= */

@import url('https://fonts.googleapis.com/css2?family=Rubik:wght@300;400;500;600;700&display=swap');

/* =============================================================================
   1. DESIGN TOKENS
   ============================================================================= */
:root {
  /* ── Charcoal / Gold Luxury Palette ── */
  --al-navy: #1e1e2e;
  --al-navy-deep: #0f0f1a;
  --al-navy-light: #2d2d44;

  /* Gold — warm, rich, never flat */
  --al-gold: #c9a84c;
  --al-gold-dark: #a07830;
  --al-gold-light: #e2bc6a;
  --al-gold-pale: #faf3e0;
  --al-gold-shimmer: linear-gradient(90deg, #c9a84c 0%, #f0d080 45%, #c9a84c 100%);

  /* Charcoal scale */
  --al-charcoal: #2c2c2c;
  --al-charcoal-deep: #1a1a1a;
  --al-charcoal-soft: #3d3d3d;

  /* Neutral Palette — warm cream base */
  --al-bg: #f8f5f0;
  --al-surface: #ffffff;
  --al-surface-soft: #f3ede0;
  --al-surface-warm: #fdf9f4;
  --al-border: #e4d8c0;
  --al-border-light: #ede7d6;
  --al-text: #1c1c1c;
  --al-text-secondary: #4a4540;
  --al-muted: #7a7068;

  /* Semantic Colors */
  --al-success: #2e7d32;
  --al-danger: #c62828;
  --al-warning: #f9a825;
  --al-info: #0277bd;

  /* Luxury Shadows — warm-tinted */
  --al-shadow-xs: 0 1px 3px rgba(44, 28, 8, 0.06);
  --al-shadow-sm: 0 2px 10px rgba(44, 28, 8, 0.08);
  --al-shadow: 0 8px 28px rgba(44, 28, 8, 0.12);
  --al-shadow-lg: 0 16px 48px rgba(44, 28, 8, 0.16);
  --al-shadow-xl: 0 28px 64px rgba(44, 28, 8, 0.22);
  --al-shadow-gold: 0 4px 20px rgba(201, 168, 76, 0.25);

  /* Border Radius */
  --al-radius-xs: 4px;
  --al-radius-sm: 8px;
  --al-radius: 12px;
  --al-radius-lg: 16px;
  --al-radius-xl: 24px;

  /* Spacing */
  --al-gap: 20px;
  --al-gap-lg: 32px;
  --al-section-gap: 56px;

  /* Easing — luxury motion */
  --al-ease: cubic-bezier(0.25, 0.46, 0.45, 0.94);
  --al-ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --al-ease-out: cubic-bezier(0.0, 0.0, 0.2, 1);
  --al-transition: 0.32s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  --al-transition-fast: 0.18s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  --al-transition-slow: 0.55s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}


/* =============================================================================
   2. BASE & RESET
   ============================================================================= */
*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  font-size: 16px;
  scroll-behavior: smooth;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  /* Prevent scrollbar appearing/disappearing from causing horizontal layout shift */
  overflow-y: scroll;
  overflow-x: hidden;
}

body {
  background: var(--al-bg) !important;
  color: var(--al-text);
  font-family: 'Rubik', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.6;
  margin: 0;
  padding: 0;
  overflow-x: hidden;
  /* Prevent any accidental horizontal scroll */
  max-width: 100vw;
}

a {
  color: var(--al-navy);
  text-decoration: none;
  transition: color var(--al-transition);
}

a:hover,
a:focus {
  color: var(--al-gold-dark);
  text-decoration: none;
  outline: none;
}

img {
  max-width: 100%;
  height: auto;
}

h1, h2, h3, h4, h5, h6 {
  font-weight: 500;
  line-height: 1.3;
  color: var(--al-text);
}


/* =============================================================================
   3. BUTTONS — scoped to avoid overriding Dorado module buttons
   ============================================================================= */
.btn-primary,
.article-bottom-action .add-to-cart,
.article-bottom-action .ajax_add_to_cart_button,
.article-bottom-action .cart-button,
.product-add-to-cart .add-to-cart,
.allani-footer-newsletter-form button,
.checkout-step .continue {
  background: linear-gradient(135deg, var(--al-gold), var(--al-gold-dark));
  color: #fff;
  border: none;
  border-radius: var(--al-radius-sm);
  cursor: pointer;
  font-family: inherit;
  font-weight: 500;
  transition: all var(--al-transition);
  text-decoration: none;
}

.btn-primary:hover,
.article-bottom-action .add-to-cart:hover,
.article-bottom-action .ajax_add_to_cart_button:hover,
.article-bottom-action .cart-button:hover,
.product-add-to-cart .add-to-cart:hover {
  background: linear-gradient(135deg, var(--al-gold-dark), #874f1c);
  box-shadow: var(--al-shadow-sm);
}

.add-to-cart.disabled,
.ajax_add_to_cart_button.disabled {
  opacity: 0.5;
  cursor: not-allowed;
}


/* =============================================================================
   4. FORM INPUTS
   ============================================================================= */
input[type="text"],
input[type="email"],
input[type="password"],
input[type="number"],
input[type="tel"],
input[type="search"],
input[type="url"],
textarea,
select,
.form-control {
  padding: 10px 14px;
  background: var(--al-surface);
  border: 1px solid var(--al-border);
  border-radius: var(--al-radius-sm);
  font-family: inherit;
  font-size: 0.95rem;
  color: var(--al-text);
  transition: border-color var(--al-transition), box-shadow var(--al-transition);
}

input:focus,
textarea:focus,
select:focus,
.form-control:focus {
  outline: none;
  border-color: var(--al-navy);
  box-shadow: 0 0 0 3px rgba(18, 58, 114, 0.08);
}


/* =============================================================================
   5. TOPBAR — targets dorado topbar skins
   ============================================================================= */
.dor-topbar-wrapper,
#topbar {
  background: linear-gradient(95deg, var(--al-navy-deep), var(--al-navy)) !important;
  color: #fff;
  font-size: 0.85rem;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.dor-topbar-wrapper a,
.dor-topbar-wrapper .line-selected,
.dor-topbar-wrapper i,
#topbar a,
#topbar .line-selected {
  color: rgba(255, 255, 255, 0.85) !important;
  transition: color var(--al-transition-fast);
}

.dor-topbar-wrapper a:hover,
#topbar a:hover {
  color: var(--al-gold-light) !important;
}


/* =============================================================================
   6. HEADER — targets allanichild header01 skin
   ============================================================================= */
#header,
.dor-header,
.allani-header {
  background: var(--al-surface) !important;
  box-shadow: var(--al-shadow-xs);
}

/* Header top section (logo, search, actions) */
.allani-header-top,
.header-top {
  padding: 16px 0;
}

.allani-header-row {
  display: flex;
  align-items: center;
  gap: var(--al-gap);
}

/* Logo */
.allani-logo-col .logo,
.dor-main-logo .logo,
.item-logo .logo {
  max-height: 55px;
  width: auto;
  transition: opacity var(--al-transition);
}

.item-logo a:hover .logo {
  opacity: 0.85;
}

.h1-logo {
  margin: 0 !important;
  padding: 0;
}

/* Search bar */
.allani-search-col .dor-search-wrapper,
.allani-search-col .search_widget,
.allani-search-col #search_widget {
  width: 100%;
}

.allani-search-col input[type="text"],
.allani-search-col input[type="search"],
.allani-search-col .ui-autocomplete-input {
  border: 2px solid var(--al-border);
  border-radius: var(--al-radius) !important;
  padding: 10px 16px;
  font-size: 0.95rem;
  width: 100%;
  transition: border-color var(--al-transition);
}

.allani-search-col input:focus {
  border-color: var(--al-navy) !important;
  box-shadow: 0 0 0 3px rgba(18, 58, 114, 0.08);
}

/* Header actions (wishlist, compare, cart) */
.allani-actions-wrap,
.head-dorsetting {
  display: flex;
  align-items: center;
  gap: 16px;
}

.allani-right-nav,
.right-nav {
  display: flex;
  align-items: center;
  gap: 14px;
}

.allani-nav-cart,
.nav-cart {
  position: relative;
}

/* Cart/Wishlist/Compare icon buttons */
.allani-actions-wrap a,
.head-dorsetting a,
.right-nav a {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--al-text);
  font-size: 0.9rem;
  transition: color var(--al-transition);
}

.allani-actions-wrap a:hover,
.head-dorsetting a:hover,
.right-nav a:hover {
  color: var(--al-gold);
}

/* Cart count badge */
.cart-products-count,
.blockcart .cart-products-count,
.dor-cart-number {
  background: var(--al-danger) !important;
  color: #fff !important;
  border-radius: 50%;
  min-width: 20px;
  height: 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.7rem;
  font-weight: 700;
  line-height: 1;
}

/* Header bottom (main menu area) */
.allani-header-bottom,
.header-bottom-pos {
  background: var(--al-navy) !important;
}

.allani-header-bottom-data,
.header-bottom-pos-data {
  padding: 0;
}


/* =============================================================================
   7. MAIN MENU — targets dor_megamenu output
   ============================================================================= */
.allani-mainmenu-wrap,
.head-dormenu {
  width: 100%;
}

/* Top level menu items — only direct children, not all nested links */
.dor-megamenu .navbar-nav > li > a,
.dor-megamenu .nav > li > a {
  color: rgba(255, 255, 255, 0.9) !important;
  padding: 12px 18px;
  font-size: 0.9rem;
  font-weight: 500;
  transition: all var(--al-transition-fast);
  border-bottom: 3px solid transparent;
}

.dor-megamenu .navbar-nav > li > a:hover,
.dor-megamenu .nav > li > a:hover,
.dor-megamenu .navbar-nav > li.active > a {
  color: var(--al-gold-light) !important;
  background: rgba(255, 255, 255, 0.05);
  border-bottom-color: var(--al-gold);
}

/* Vertical menu in header */
.dorverticalmenu-wrapper,
.dor-verticalmenu-wrapper {
  background: var(--al-navy-deep);
  border-radius: var(--al-radius-sm);
}


/* =============================================================================
   8. HOMEPAGE SECTIONS
   ============================================================================= */
#dor-homeslider,
#dor-home-surily,
#wrapper,
section#content,
.page-home {
  background: transparent;
}

/* Homepage slider */
#dor-homeslider {
  margin-bottom: var(--al-section-gap);
  border-radius: 0;
  overflow: hidden;
}

/* Homepage blocks spacing */
#dor-home-surily > .container {
  padding-top: var(--al-gap-lg);
  padding-bottom: var(--al-gap-lg);
}

/* Section titles (Dorado tab headers, advance product titles) */
.title_block,
.tab-title,
.allani-section-title,
.dor-title-box,
.dor_tab_promain .tab_title,
.dor_advanceproduct .title_block,
.block-title,
h2.products-section-title,
.featured-products h2,
h2.h2 {
  font-family: 'Rubik', sans-serif;
  font-size: 1.5rem;
  font-weight: 600;
  color: var(--al-navy);
  margin-bottom: 1.5rem;
  padding-bottom: 0.75rem;
  position: relative;
}

/* Underline accent for section titles */
.title_block::after,
.block-title::after,
h2.products-section-title::after,
.featured-products h2::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 50px;
  height: 3px;
  background: var(--al-gold);
  border-radius: 2px;
}


/* =============================================================================
   9. PRODUCT GRID SYSTEM — listing pages only (NOT homepage Dorado modules)
   allani-hotfix.css already handles carousel→grid for Dorado modules.
   We only target real listing pages (category, search, best-sales, etc.).
   ============================================================================= */
body.page-category #content-wrapper .products,
body.page-search #content-wrapper .products,
body.page-best-sales #content-wrapper .products,
body.page-new-products #content-wrapper .products,
body.page-prices-drop #content-wrapper .products,
body.page-manufacturer #content-wrapper .products,
body.page-supplier #content-wrapper .products {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--al-gap);
  list-style: none;
}

/* Left-column layout: 3 columns */
body.page-category #left-column ~ #content-wrapper .products,
body.page-search #left-column ~ #content-wrapper .products {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

/* Both-columns layout: 2 columns */
body.page-category.layout-both-columns #content-wrapper .products {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

/* Safety net — never grid when owl-carousel class is on the list itself */
.owl-carousel.products,
.owl-carousel.product_list {
  display: block !important;
  grid-template-columns: unset !important;
  gap: unset !important;
}


/* =============================================================================
   10. PRODUCT CARD (MINIATURE)
   ============================================================================= */
.product-miniature,
.ajax_block_product,
.allani-product-card {
  background: var(--al-surface);
  border: 1px solid var(--al-border-light);
  border-radius: var(--al-radius);
  overflow: hidden;
  transition: all var(--al-transition);
}

/* Grid-context cards get flex column layout — only on real listing pages */
body.page-category #content-wrapper .products > .product-miniature,
body.page-search #content-wrapper .products > .product-miniature,
body.page-best-sales #content-wrapper .products > .product-miniature {
  display: flex;
  flex-direction: column;
}

.product-miniature:hover,
.ajax_block_product:hover {
  border-color: var(--al-gold);
  box-shadow: var(--al-shadow);
  transform: translateY(-3px);
}

/* Product container — respect Dorado inline styles, just add visual polish */
.product-container,
.allani-product-container {
  height: 100%;
}

/* Image section — no forced aspect-ratio (Dorado handles image sizing) */
.left-block,
.allani-card-media {
  position: relative;
  overflow: hidden;
  background: var(--al-surface-soft);
}

.product-image-container,
.allani-image-container {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.product-image-container img,
.allani-image-container img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  transition: transform var(--al-transition);
  padding: 8px;
}

.product-miniature:hover .product-image-container img,
.product-miniature:hover .allani-image-container img {
  transform: scale(1.06);
}

.product-thumbnail,
.product_img_link {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  text-decoration: none !important;
}

/* Status badges (New, Sale) */
.box-items,
.allani-status-badges {
  position: absolute;
  top: 10px;
  left: 10px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  z-index: 10;
}

.box-status {
  display: inline-block;
  padding: 4px 10px;
  border-radius: var(--al-radius-xs);
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  text-decoration: none !important;
  line-height: 1.4;
}

.new-box,
.new-label {
  background: var(--al-navy);
  color: #fff !important;
}

.sale-box,
.sale-label {
  background: var(--al-danger);
  color: #fff !important;
}

/* Wishlist button (from dorblockwishlist) */
.dor-wishlist-btn,
.dorwishlist-add,
.addToWishlist {
  position: absolute !important;
  top: 10px;
  right: 10px;
  z-index: 10;
  background: var(--al-surface) !important;
  border: 1px solid var(--al-border) !important;
  border-radius: 50% !important;
  width: 36px !important;
  height: 36px !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all var(--al-transition-fast);
  padding: 0 !important;
  box-shadow: var(--al-shadow-xs);
}

.dor-wishlist-btn:hover,
.dorwishlist-add:hover,
.addToWishlist:hover {
  background: var(--al-danger) !important;
  border-color: var(--al-danger) !important;
  color: #fff !important;
}

/* Out of stock overlay */
.article-out-stock {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, 0.55);
  z-index: 5;
}

.out-stock-inner {
  background: var(--al-danger);
  color: #fff;
  padding: 6px 14px;
  border-radius: var(--al-radius-sm);
  font-size: 0.8rem;
  font-weight: 600;
}

/* Product features (specs list) */
.dor-features-article,
.allani-features {
  padding: 8px 12px;
  font-size: 0.8rem;
  color: var(--al-muted);
  border-top: 1px solid var(--al-border-light);
}

.dor-features-article ul,
.allani-features ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.dor-features-article li,
.allani-features li {
  padding: 2px 0;
  display: flex;
  gap: 4px;
}

.dor-features-article label,
.allani-features label {
  font-weight: 500;
  color: var(--al-text-secondary);
  margin: 0;
}

/* Card body (info section) */
.right-block,
.allani-card-body {
  flex: 1;
  display: flex;
  flex-direction: column;
  padding: 14px 16px;
  gap: 6px;
}

/* Category label */
.product-cate,
.allani-card-category {
  font-size: 0.72rem;
  font-weight: 600;
  color: var(--al-muted);
  text-transform: uppercase;
  letter-spacing: 0.6px;
}

/* Product title */
.product-title-item,
.allani-card-title {
  margin: 0 !important;
  font-size: 0.95rem;
  font-weight: 500;
  line-height: 1.35;
}

.product-title-item a,
.allani-card-title a,
.product-name {
  color: var(--al-text) !important;
  text-decoration: none !important;
  transition: color var(--al-transition);
}

.product-title-item a:hover,
.allani-card-title a:hover,
.product-name:hover {
  color: var(--al-gold) !important;
}

/* Price block */
.review-price-product,
.allani-review-price {
  margin-top: auto;
  padding-top: 6px;
}

.price,
.product-price,
span[itemprop="price"] {
  font-size: 1.15rem;
  font-weight: 700;
  color: var(--al-gold-dark) !important;
}

.regular-price {
  font-size: 0.85rem;
  color: var(--al-muted) !important;
  text-decoration: line-through;
}

.discount-percentage {
  display: inline-block;
  background: var(--al-danger);
  color: #fff;
  padding: 2px 6px;
  border-radius: 3px;
  font-size: 0.7rem;
  font-weight: 700;
  margin-left: 6px;
  vertical-align: middle;
}

/* Variants (color swatches etc) */
.highlighted-informations,
.allani-variants {
  margin-top: 4px;
}

.highlighted-informations.no-variants {
  display: none;
}

/* Card actions (add to cart + compare) */
.article-bottom-action,
.allani-card-actions {
  padding: 10px 14px;
  display: flex;
  align-items: center;
  gap: 8px;
  border-top: 1px solid var(--al-border-light);
  margin-top: auto;
}

.article-cart,
.allani-cart-area {
  flex: 1;
}

.article-addcart-button {
  display: flex;
  align-items: center;
  gap: 6px;
}

.article-bottom-action .add-to-cart,
.article-bottom-action .ajax_add_to_cart_button,
.article-bottom-action .cart-button {
  width: 100%;
  padding: 8px 14px;
  font-size: 0.85rem;
  border-radius: var(--al-radius-sm);
}

.article-bottom-action .add-to-cart i,
.article-bottom-action .cart-button i {
  font-size: 1.1rem;
}

/* Compare button */
.dorcompare-add,
.dor-compare-btn {
  background: var(--al-surface) !important;
  border: 1px solid var(--al-border) !important;
  border-radius: var(--al-radius-sm) !important;
  color: var(--al-text) !important;
  padding: 8px 12px !important;
  transition: all var(--al-transition-fast);
}

.dorcompare-add:hover,
.dor-compare-btn:hover {
  border-color: var(--al-navy) !important;
  color: var(--al-navy) !important;
}

/* Quantity input in card (when dor_showQuantity enabled) */
.dor-product-quantity .qty input {
  width: 50px;
  text-align: center;
  padding: 6px;
  border: 1px solid var(--al-border);
  border-radius: var(--al-radius-xs);
}


/* =============================================================================
   11. CATEGORY / LISTING PAGES
   ============================================================================= */
/* Subcategory grid */
#subcategories {
  margin-bottom: var(--al-gap-lg);
}

#subcategories ul {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
  gap: var(--al-gap);
  list-style: none;
  margin: 0;
  padding: 0;
}

#subcategories li {
  text-align: center;
}

.subcategory-image {
  background: var(--al-surface);
  border: 1px solid var(--al-border-light);
  border-radius: var(--al-radius);
  padding: 12px;
  transition: all var(--al-transition);
}

.subcategory-image:hover {
  border-color: var(--al-gold);
  box-shadow: var(--al-shadow-sm);
}

.subcategory-image img {
  border-radius: var(--al-radius-sm);
}

.subcategory-image span {
  display: block;
  margin-top: 8px;
  font-size: 0.85rem;
  font-weight: 500;
  color: var(--al-text);
}

/* Breadcrumb */
#wrapper .breadcrumb,
.breadcrumb {
  background: transparent;
  padding: 12px 0;
  margin: 0;
  font-size: 0.85rem;
}

.breadcrumb a {
  color: var(--al-muted);
}

.breadcrumb a:hover {
  color: var(--al-gold);
}

.breadcrumb .breadcrumb-item.active,
.breadcrumb li:last-child {
  color: var(--al-text);
  font-weight: 500;
}

/* Sort / Filter bar */
.products-sort-order,
.sort-by-row {
  margin-bottom: var(--al-gap);
}

.products-sort-order .select-title,
.sort-by-row select {
  border: 1px solid var(--al-border);
  border-radius: var(--al-radius-sm);
  padding: 8px 14px;
  font-size: 0.9rem;
}

/* Pagination */
.pagination {
  display: flex;
  justify-content: center;
  gap: 4px;
  margin: var(--al-gap-lg) 0;
  padding: 0;
  list-style: none;
}

.pagination a,
.pagination span,
.pagination .page-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 40px;
  height: 40px;
  padding: 4px 12px;
  border: 1px solid var(--al-border);
  border-radius: var(--al-radius-sm);
  color: var(--al-text);
  font-size: 0.9rem;
  background: var(--al-surface);
  transition: all var(--al-transition-fast);
}

.pagination .current a,
.pagination .active .page-link,
.pagination a:hover {
  background: var(--al-navy);
  color: #fff;
  border-color: var(--al-navy);
}


/* =============================================================================
   12. LEFT SIDEBAR / FILTERS
   ============================================================================= */
#left-column,
#right-column {
  padding-top: var(--al-gap);
}

#left-column .block-categories,
#left-column .facet,
#left-column .block,
.dor-filter-block,
.ps-facetedsearch .facet {
  background: var(--al-surface);
  border: 1px solid var(--al-border-light);
  border-radius: var(--al-radius);
  padding: 16px;
  margin-bottom: var(--al-gap);
}

#left-column .block-categories .h6,
#left-column .facet .h6,
.facet-title,
.block-categories .category-top-menu,
.dor-filter-block .title_block {
  font-size: 1rem;
  font-weight: 600;
  color: var(--al-navy);
  margin-bottom: 12px;
  padding-bottom: 8px;
  border-bottom: 2px solid var(--al-border-light);
}

/* Filter checkboxes */
.facet .facet-label {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 0;
  font-size: 0.9rem;
  color: var(--al-text-secondary);
  cursor: pointer;
}

.facet .facet-label:hover {
  color: var(--al-text);
}

/* Active filter pills */
.active_filters .filter-block {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: var(--al-surface-soft);
  border: 1px solid var(--al-border);
  border-radius: var(--al-radius-sm);
  padding: 4px 10px;
  font-size: 0.82rem;
  margin: 0 4px 4px 0;
}


/* =============================================================================
   13. PRODUCT DETAIL PAGE
   ============================================================================= */
#product .product-cover img {
  border-radius: var(--al-radius);
  border: 1px solid var(--al-border-light);
}

#product .product-information {
  padding: var(--al-gap);
}

#product h1.h1 {
  font-size: 1.75rem;
  font-weight: 600;
  color: var(--al-text);
  margin-bottom: 0.5rem;
}

#product .current-price .price {
  font-size: 2rem;
  font-weight: 700;
  color: var(--al-gold-dark) !important;
}

#product .regular-price {
  font-size: 1.1rem;
}

/* Product tabs */
.product-tabs,
.tabs {
  margin-top: var(--al-section-gap);
}

.nav-tabs,
.product-tabs .nav {
  border-bottom: 2px solid var(--al-border-light);
  gap: 0;
}

.nav-tabs .nav-link,
.product-tabs .nav-link {
  padding: 12px 20px;
  font-weight: 500;
  color: var(--al-muted);
  border: none;
  border-bottom: 3px solid transparent;
  margin-bottom: -2px;
  transition: all var(--al-transition-fast);
  background: transparent;
}

.nav-tabs .nav-link.active,
.nav-tabs .nav-link:hover,
.product-tabs .nav-link.active {
  color: var(--al-navy);
  border-bottom-color: var(--al-gold);
  background: transparent;
}

.tab-content {
  padding: var(--al-gap) 0;
}

/* Add to cart form on product page */
.product-add-to-cart .add-to-cart {
  padding: 14px 32px;
  font-size: 1rem;
  font-weight: 600;
  border-radius: var(--al-radius);
}

/* Quantity selector */
.product-quantity .qty .input-group {
  border: 1px solid var(--al-border);
  border-radius: var(--al-radius-sm);
  overflow: hidden;
}

.product-quantity .qty input {
  text-align: center;
  border: none;
  width: 60px;
}

.product-quantity .qty .btn {
  background: var(--al-surface-soft);
  border: none;
  padding: 8px 14px;
  color: var(--al-text);
}


/* =============================================================================
   14. FOOTER — targets allanichild footer01 skin
   ============================================================================= */
#footer {
  /* background intentionally NOT set here — allani-final.css owns the dark gradient */
  margin-top: var(--al-section-gap);
}

.dor-footer-top,
.allani-footer-top {
  /* background left to Dorado skin */
  padding: var(--al-gap) 0;
}

.dorFooterMain,
.allani-footer-main {
  /* background left to Dorado skin */
  padding: var(--al-section-gap) 0 var(--al-gap-lg);
}

.dorFooterInner,
.allani-footer-inner {
  background: transparent;
}

/* Footer columns */
.allani-footer-row-primary,
.allani-footer-row-secondary {
  margin-bottom: 1.5rem;
}

.allani-footer-fallback-box h4 {
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--al-navy);
  margin-bottom: 12px;
}

.allani-footer-fallback-box p {
  color: var(--al-muted);
  font-size: 0.9rem;
  line-height: 1.6;
}

.allani-footer-fallback-links {
  list-style: none;
  margin: 0;
  padding: 0;
}

.allani-footer-fallback-links li {
  margin-bottom: 8px;
}

.allani-footer-fallback-links a {
  color: var(--al-text-secondary);
  font-size: 0.9rem;
  transition: color var(--al-transition-fast);
}

.allani-footer-fallback-links a:hover {
  color: var(--al-gold);
  padding-left: 4px;
}

/* Footer newsletter form */
.allani-footer-newsletter-form {
  display: flex;
  gap: 8px;
  margin-top: 12px;
}

.allani-footer-newsletter-form input[type="email"] {
  flex: 1;
  padding: 10px 14px;
  border: 1px solid var(--al-border);
  border-radius: var(--al-radius-sm);
  font-size: 0.9rem;
}

.allani-footer-newsletter-form button {
  padding: 10px 20px;
  white-space: nowrap;
}

/* Footer bottom bar */
.doradoFooterAdv,
.allani-footer-adv {
  background: var(--al-navy-deep);
  padding: 16px 0;
  color: rgba(255, 255, 255, 0.7);
  font-size: 0.85rem;
}

.doradoFooterAdv a,
.allani-footer-adv a {
  color: rgba(255, 255, 255, 0.85) !important;
}

.doradoFooterAdv a:hover,
.allani-footer-adv a:hover {
  color: var(--al-gold-light) !important;
}

/* Footer link columns — colors left to allani-final.css dark theme */


/* =============================================================================
   15. CART & CHECKOUT
   ============================================================================= */
.cart-grid-body {
  background: var(--al-surface);
  border: 1px solid var(--al-border-light);
  border-radius: var(--al-radius);
  padding: var(--al-gap);
  margin-bottom: var(--al-gap);
}

.cart-grid-right {
  background: var(--al-surface);
  border: 1px solid var(--al-border-light);
  border-radius: var(--al-radius);
  padding: var(--al-gap);
}

.cart-summary-line {
  display: flex;
  justify-content: space-between;
  padding: 8px 0;
  border-bottom: 1px solid var(--al-border-light);
}

.cart-summary-line .value {
  font-weight: 600;
}

.cart-total .value {
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--al-gold-dark);
}

/* Checkout steps */
.checkout-step {
  background: var(--al-surface);
  border: 1px solid var(--al-border-light);
  border-radius: var(--al-radius);
  margin-bottom: var(--al-gap);
  overflow: hidden;
}

.checkout-step .step-title {
  padding: 16px 20px;
  font-size: 1.1rem;
  font-weight: 600;
  background: var(--al-surface-soft);
  border-bottom: 1px solid var(--al-border-light);
}

.checkout-step .step-number {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  background: var(--al-navy);
  color: #fff;
  border-radius: 50%;
  font-size: 0.9rem;
  font-weight: 700;
  margin-right: 12px;
}

.checkout-step .content {
  padding: 20px;
}

.-current .step-title {
  background: var(--al-navy);
  color: #fff;
}

.-complete .step-title {
  background: var(--al-surface);
}


/* =============================================================================
   16. CUSTOMER ACCOUNT
   ============================================================================= */
.page-my-account #content .links a {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  background: var(--al-surface);
  border: 1px solid var(--al-border-light);
  border-radius: var(--al-radius);
  padding: var(--al-gap);
  transition: all var(--al-transition);
  text-align: center;
}

.page-my-account #content .links a:hover {
  border-color: var(--al-gold);
  box-shadow: var(--al-shadow-sm);
  transform: translateY(-2px);
}

.page-my-account #content .links a i {
  font-size: 2rem;
  color: var(--al-navy);
}

/* Login / Register forms */
.page-authentication .form-group,
.page-customer-account .form-group {
  margin-bottom: 1.25rem;
}

.page-authentication label,
.page-customer-account label {
  font-weight: 500;
  color: var(--al-text);
  margin-bottom: 6px;
}


/* =============================================================================
   17. SCROLLTOP BUTTON
   ============================================================================= */
#to-top,
.to-top {
  position: fixed;
  bottom: 30px;
  right: 30px;
  width: 44px;
  height: 44px;
  background: var(--al-navy) !important;
  color: #fff !important;
  border: none;
  border-radius: 50%;
  display: none;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 999;
  box-shadow: var(--al-shadow);
  transition: all var(--al-transition);
  font-size: 1.2rem;
}

#to-top:hover,
.to-top:hover {
  background: var(--al-gold) !important;
  transform: translateY(-3px);
  box-shadow: var(--al-shadow-lg);
}


/* =============================================================================
   18. DORADO MODULE SECTIONS
   ============================================================================= */
/* Advance product / Tab product sections */
.dor_advanceproduct,
.dor_tab_promain,
.dor_tabproductcategory,
.tabproductcategory_pro,
.dor_top_product_cate {
  margin-bottom: var(--al-section-gap);
}

/* Tab navigation for Dorado modules */
.dor_tab_promain .nav-tabs,
.tabproductcategory_pro .nav-tabs {
  border-bottom: 2px solid var(--al-border-light);
  margin-bottom: var(--al-gap);
  flex-wrap: wrap;
}

.dor_tab_promain .nav-tabs li a,
.tabproductcategory_pro .nav-tabs li a {
  padding: 10px 18px;
  font-weight: 500;
  color: var(--al-muted) !important;
  border: none !important;
  border-bottom: 3px solid transparent !important;
  background: transparent !important;
  transition: all var(--al-transition-fast);
}

.dor_tab_promain .nav-tabs li.active a,
.dor_tab_promain .nav-tabs li a:hover,
.tabproductcategory_pro .nav-tabs li.active a,
.tabproductcategory_pro .nav-tabs li a:hover {
  color: var(--al-navy) !important;
  border-bottom-color: var(--al-gold) !important;
}

/* Dorado owl-carousel overrides */
.owl-carousel .owl-nav button,
.owl-carousel .owl-nav .owl-prev,
.owl-carousel .owl-nav .owl-next {
  background: var(--al-surface) !important;
  border: 1px solid var(--al-border) !important;
  border-radius: 50% !important;
  width: 40px !important;
  height: 40px !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  transition: all var(--al-transition-fast);
  color: var(--al-text) !important;
  font-size: 1.1rem !important;
}

.owl-carousel .owl-nav button:hover,
.owl-carousel .owl-nav .owl-prev:hover,
.owl-carousel .owl-nav .owl-next:hover {
  background: var(--al-navy) !important;
  color: #fff !important;
  border-color: var(--al-navy) !important;
}

/* Dorado daily deals */
.daily-deal-product {
  background: var(--al-surface);
  border: 1px solid var(--al-border-light);
  border-radius: var(--al-radius);
  padding: var(--al-gap);
  overflow: hidden;
}

/* Dorado banner categories */
.dor-banner-category img {
  border-radius: var(--al-radius);
  transition: transform var(--al-transition);
}

.dor-banner-category:hover img {
  transform: scale(1.03);
}


/* =============================================================================
   19. NOTIFICATIONS & ALERTS
   ============================================================================= */
.alert {
  padding: 14px 20px;
  border-radius: var(--al-radius-sm);
  margin-bottom: var(--al-gap);
  font-size: 0.9rem;
  border: 1px solid transparent;
}

.alert-success {
  background: #d4edda;
  border-color: #c3e6cb;
  color: #155724;
}

.alert-danger {
  background: #f8d7da;
  border-color: #f5c6cb;
  color: #721c24;
}

.alert-warning {
  background: #fff3cd;
  border-color: #ffeeba;
  color: #856404;
}

.alert-info {
  background: #d1ecf1;
  border-color: #bee5eb;
  color: #0c5460;
}


/* =============================================================================
   20. SMARTBLOG
   ============================================================================= */
.sdsarticle-des {
  background: var(--al-surface);
  border: 1px solid var(--al-border-light);
  border-radius: var(--al-radius);
  overflow: hidden;
  transition: all var(--al-transition);
}

.sdsarticle-des:hover {
  box-shadow: var(--al-shadow-sm);
  transform: translateY(-2px);
}

.sdsarticle-des img {
  width: 100%;
  border-radius: var(--al-radius) var(--al-radius) 0 0;
}


/* =============================================================================
   21. REASSURANCE BLOCK
   ============================================================================= */
.blockreassurance_product,
#block-reassurance {
  border-top: 1px solid var(--al-border-light);
  padding-top: var(--al-gap);
  margin-top: var(--al-gap);
}

.blockreassurance_product .block-reassurance-item,
#block-reassurance li {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 0;
  font-size: 0.9rem;
  color: var(--al-text-secondary);
}

.blockreassurance_product .block-reassurance-item img {
  width: 28px;
  height: 28px;
  flex-shrink: 0;
}


/* =============================================================================
   22. PAGE LOADING / OVERLAY
   ============================================================================= */
.dor-page-loading {
  background: var(--al-surface);
}

#loader {
  border-color: var(--al-border-light);
  border-top-color: var(--al-gold);
}


/* =============================================================================
   23. REVEAL ANIMATION (used by JS)
   ============================================================================= */
.product-miniature,
.ajax_block_product {
  opacity: 1;
  transform: translateY(0);
}

.product-miniature.allani-inview,
.ajax_block_product.allani-inview {
  opacity: 1;
  transform: translateY(0);
}

/* Subtle entrance for page loads */
@keyframes allaniFadeUp {
  from {
    opacity: 0;
    transform: translateY(12px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.page-home .product-miniature,
.page-home .ajax_block_product {
  animation: allaniFadeUp 0.4s var(--al-ease) both;
}

.page-home .product-miniature:nth-child(1) { animation-delay: 0s; }
.page-home .product-miniature:nth-child(2) { animation-delay: 0.05s; }
.page-home .product-miniature:nth-child(3) { animation-delay: 0.1s; }
.page-home .product-miniature:nth-child(4) { animation-delay: 0.15s; }
.page-home .product-miniature:nth-child(5) { animation-delay: 0.2s; }
.page-home .product-miniature:nth-child(6) { animation-delay: 0.25s; }
.page-home .product-miniature:nth-child(7) { animation-delay: 0.3s; }
.page-home .product-miniature:nth-child(8) { animation-delay: 0.35s; }


/* =============================================================================
   24. RESPONSIVE BREAKPOINTS
   ============================================================================= */

/* Large desktops */
@media (max-width: 1199px) {
  body.page-category #content-wrapper .products,
  body.page-search #content-wrapper .products,
  body.page-best-sales #content-wrapper .products,
  body.page-new-products #content-wrapper .products,
  body.page-prices-drop #content-wrapper .products {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

/* Tablets landscape */
@media (max-width: 991px) {
  body.page-category #content-wrapper .products,
  body.page-search #content-wrapper .products,
  body.page-best-sales #content-wrapper .products,
  body.page-new-products #content-wrapper .products,
  body.page-prices-drop #content-wrapper .products {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.page-category #left-column ~ #content-wrapper .products,
  body.page-search #left-column ~ #content-wrapper .products {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .allani-header-row {
    flex-wrap: wrap;
  }

  .allani-search-col {
    order: 3;
    flex-basis: 100%;
  }

  h1 { font-size: 1.6rem; }
  h2 { font-size: 1.35rem; }

  :root {
    --al-section-gap: 32px;
    --al-gap: 16px;
  }
}

/* Tablets portrait — let Dorado's own responsive handle menu toggle */
@media (max-width: 768px) {
  /* Do NOT hide .header-bottom-pos — Dorado toggles it via JS */
}

/* Mobile */
@media (max-width: 575px) {
  body.page-category #content-wrapper .products,
  body.page-search #content-wrapper .products,
  body.page-best-sales #content-wrapper .products,
  body.page-new-products #content-wrapper .products,
  body.page-prices-drop #content-wrapper .products {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  h1 { font-size: 1.35rem; }
  h2 { font-size: 1.15rem; }

  :root {
    --al-section-gap: 24px;
    --al-gap: 12px;
    --al-radius: 10px;
  }

  .allani-actions-wrap,
  .head-dorsetting {
    gap: 10px;
  }

  .product-miniature,
  .ajax_block_product {
    border-radius: var(--al-radius-sm);
  }

  .right-block,
  .allani-card-body {
    padding: 10px 12px;
  }

  .article-bottom-action,
  .allani-card-actions {
    padding: 8px 10px;
  }

  .article-bottom-action .add-to-cart,
  .article-bottom-action .cart-button {
    padding: 8px 10px;
    font-size: 0.8rem;
  }

  .allani-footer-newsletter-form {
    flex-direction: column;
  }

  .cart-grid-body,
  .cart-grid-right,
  .checkout-step {
    border-radius: var(--al-radius-sm);
    padding: 14px;
  }
}

/* Very small screens */
@media (max-width: 375px) {
  #content .products:not(.owl-stage),
  #content .product_list:not(.owl-stage) {
    grid-template-columns: 1fr;
  }
}


/* =============================================================================
   25. UTILITY / MISC
   ============================================================================= */
/* Do NOT override .container max-width — Dorado handles it */
/* Do NOT override .dor-row margins — Bootstrap gutters */

/* Wrapper spacing */
#wrapper {
  padding-top: var(--al-gap);
  padding-bottom: var(--al-gap);
}

/* Hidden utility */
.visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  border: 0 !important;
}

/* Selection highlight */
::selection {
  background: var(--al-gold);
  color: #fff;
}

/* Focus visible for accessibility */
:focus-visible {
  outline: 2px solid var(--al-navy);
  outline-offset: 2px;
}

/* Smooth image loading */
img[loading="lazy"] {
  transition: opacity 0.3s;
}

/* Print styles */
@media print {
  .dor-topbar-wrapper,
  #topbar,
  .allani-header-bottom,
  .header-bottom-pos,
  #to-top,
  .to-top,
  .article-bottom-action,
  .allani-card-actions,
  .dor-page-loading {
    display: none !important;
  }

  body {
    background: #fff !important;
    color: #000 !important;
  }
}


/* =============================================================================
   26. DORADO DEFAULT COLOR OVERRIDE
   Kill Dorado's #52afc6 teal and any red leaks — replace with brand colors.
   Source: dorado/css/theme.css, teck.css, topbar.css, header.css, responsive.css
   ============================================================================= */

/* --- Topbar 02 & 03 (teal background) --- */
#dor-topbar02,
#dor-topbar02 .dor-topbar-inner {
  background: var(--al-navy-deep) !important;
  color: #fff !important;
}

/* --- Footer social hover (teal bg) --- */
.footer-social .social a:hover {
  border-color: var(--al-gold) !important;
  background: var(--al-gold) !important;
  color: #fff !important;
}

/* --- Newsletter button (teal bg) --- */
#newsletter-footer .btn.btn-primary,
#newsletter-footer .btn-primary,
.block_newsletter button,
.block_newsletter .btn-primary {
  background: var(--al-navy) !important;
  border-color: var(--al-navy) !important;
  color: #fff !important;
}
#newsletter-footer .btn.btn-primary:hover,
.block_newsletter button:hover {
  background: var(--al-gold) !important;
  border-color: var(--al-gold) !important;
}

/* --- Footer contact icon (teal bg) --- */
.dor-footer-contact .contact .icon i {
  background-color: var(--al-navy) !important;
  color: #fff !important;
}

/* --- Footer links hover (teal text) --- */
.dor-footer-link .links a:hover,
.dor-footer-link .links a:focus,
.footer-container a:hover,
footer a:hover {
  color: var(--al-gold) !important;
}

/* --- Footer copyright link (teal) --- */
.dor-footer-copyright .copyright a,
.dor-footer-copyright a {
  color: var(--al-gold) !important;
}

/* --- Banner category shop-title hover (teal bg) --- */
.banner-category-shoptitle-wrapper a:hover {
  background-color: var(--al-navy) !important;
  color: #fff !important;
}

/* --- Banner promotion ribbon (teal) --- */
.banner-promotion-data-inner::before,
.banner-promotion-data-inner::after {
  background: var(--al-navy) !important;
}

/* --- Banner promo link hover (teal text) --- */
.dor-banner-promo-info-wrapper > a:hover {
  color: var(--al-gold) !important;
}

/* --- Footer 02 payment link hover (teal) --- */
#dor-footer-02 .footer-payment-line .payment li a:hover {
  color: var(--al-gold) !important;
}

/* --- Service box icons (teal text) --- */
.dor-service-box-item i,
.dor-service-box i,
.dor-service-list i {
  color: var(--al-navy) !important;
}

/* --- Topbar color overrides (teck.css selectors) --- */
#dor-topbar02 .dor-topbar-inner a,
#dor-topbar02 .dor-topbar-inner i {
  color: #fff !important;
}
#dor-topbar02 .dor-topbar-inner a:hover {
  color: var(--al-gold-light) !important;
}

/* --- Generic teal color leak on links (catch-all) --- */
[class*="dor-"] a[style*="#52afc6"],
[class*="dor-"] [style*="color:#52afc6"],
[class*="dor-"] [style*="color: #52afc6"] {
  color: var(--al-gold) !important;
}

/* --- Add-to-cart and action buttons (catch red Dorado buttons) --- */
.button.ajax_add_to_cart_button,
.ajax_add_to_cart_button,
.btn-add-to-cart,
.add-to-cart,
.btn-primary.add-to-cart {
  background: var(--al-navy) !important;
  border-color: var(--al-navy) !important;
  color: #fff !important;
}
.button.ajax_add_to_cart_button:hover,
.ajax_add_to_cart_button:hover,
.add-to-cart:hover,
.btn-primary.add-to-cart:hover {
  background: var(--al-gold) !important;
  border-color: var(--al-gold) !important;
}

/* --- Product flags: kill red new/sale badges --- */
.product-flag,
.product-flag.new,
.product-flag.on-sale,
.product-flag.discount,
.new-box,
.sale-box,
.price-percent-reduction,
span.new-box,
span.sale-box {
  background: var(--al-gold) !important;
  color: #fff !important;
}

/* --- Tab active indicator (teal underline/background) --- */
.dorTopProductCategory .nav-tabs li.active a,
.dorTopProductCategory2 .nav-tabs li.active a,
#dor-tab-product-category .nav-tabs li.active a,
#dor-tab-product-category .TabProductNav li.active a,
[id*="dorTopProductCategory"] .nav-tabs li.active a {
  border-bottom-color: var(--al-gold) !important;
  color: var(--al-navy) !important;
}

/* --- Megamenu active/hover (teal border-bottom) --- */
.dor-megamenu .navbar-nav > li.active > a,
.dor-megamenu .navbar-nav > li:hover > a {
  border-bottom-color: var(--al-gold) !important;
}

/* --- Pagination active (teal) --- */
.pagination .current a,
.pagination .current span,
#pagination_bottom .current a,
ul.page-list li.current > a {
  background: var(--al-navy) !important;
  border-color: var(--al-navy) !important;
  color: #fff !important;
}
.pagination a:hover,
ul.page-list li a:hover {
  color: var(--al-gold) !important;
  border-color: var(--al-gold) !important;
}

/* --- Quantity / stepper (teal buttons) --- */
.qty-holder .btn,
.qty-holder button,
.product-quantity .btn-touchspin,
.input-group-btn > .btn {
  background: var(--al-navy) !important;
  border-color: var(--al-navy) !important;
  color: #fff !important;
}

/* --- Breadcrumb active color (teal text) --- */
.breadcrumb .current a,
nav.breadcrumb ol li:last-child a {
  color: var(--al-gold) !important;
}


/* =============================================================================
   27. LAYOUT OVERRIDES — loaded last, wins over allani-hotfix.css
   ============================================================================= */

/* --- Offres Confort (dor_bizproduct):
   Real DOM: #dor-biz-product > .biz-contents > .biz-group (col-lg-4 each)
   Each group has .biz-group-content where products load via AJAX.
   The product cards come from biz_product.css which forces a side-by-side
   left-block/right-block layout. We override to vertical. --- */

.biz-group-content .product_list {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)) !important;
  gap: 16px !important;
  align-items: start !important;
}

/* Kill the side-by-side biz card layout inside biz groups */
.biz-group-content .ajax_block_product {
  width: 100% !important;
  float: none !important;
  display: flex !important;
  flex-direction: column !important;
  height: auto !important;
}
.biz-group-content .left-block {
  float: none !important;
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
}
.biz-group-content .right-block {
  float: none !important;
  width: 100% !important;
  padding-left: 0 !important;
  overflow: visible !important;
}
/* Hide empty biz-group columns to avoid blank space */
.biz-group:not(:has(.ajax_block_product)):not(:has(li)) {
  display: none !important;
}
/* Hide action buttons inside biz cards — images + name + price only */
.biz-group-content .product-buttons,
.biz-group-content .ajax_block_product .button-container,
.biz-group-content .ajax_block_product .add-to-cart,
.biz-group-content .ajax_block_product .product-actions,
.biz-group-content .ajax_block_product .quick-view,
.biz-group-content .ajax_block_product .highlighted-informations,
.biz-group-content .ajax_block_product form[action*='cart'],
.biz-group-content .wishlist-button-add,
.biz-group-content .comparison_button,
.biz-group-content .compare,
.biz-group-content .dor-btn-wishlist,
.biz-group-content .dor-btn-quickview,
.biz-group-content .dor-btn-compare,
.biz-group-content .dor-wishlist,
.biz-group-content .product-miniature .groups,
.biz-group-content .product-miniature .dor-product-buttons,
.biz-group-content .functional-buttons {
  display: none !important;
}
.biz-group-content .product-image-container,
.biz-group-content .dor-product-inner .product-image-container {
  display: block !important;
  width: 100% !important;
  height: 160px !important;
  min-height: 160px !important;
  max-height: 160px !important;
  overflow: hidden !important;
}

.biz-group-content .product-image-container img,
.biz-group-content .product-image-container a img {
  display: block !important;
  width: 100% !important;
  height: 160px !important;
  object-fit: contain !important;
  max-width: 100% !important;
  visibility: visible !important;
  opacity: 1 !important;
}

/* allani-biz-grid (from product-lists.tpl) — 4 cols is fine */
.allani-biz-grid {
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)) !important;
}
/* Make the biz-contents row flex so non-empty groups can grow */
#dor-biz-product .biz-contents,
.dor-biz-product .biz-contents {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: flex-start !important;
  gap: 16px !important;
}
#dor-biz-product .biz-group,
.dor-biz-product .biz-group {
  flex: 1 1 260px !important;
  min-width: 260px !important;
  max-width: 100% !important;
}
#dor-biz-product .biz-group-content .product_list,
.dor-biz-product .biz-group-content .product_list,
.biz-contents .biz-group-content .product_list {
  grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)) !important;
}

@media (max-width: 767px) {
  #dor-biz-product .biz-group-content .product_list,
  .dor-biz-product .biz-group-content .product_list,
  .biz-contents .biz-group-content .product_list {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

@media (max-width: 479px) {
  #dor-biz-product .biz-group-content .product_list,
  .dor-biz-product .biz-group-content .product_list,
  .biz-contents .biz-group-content .product_list {
    grid-template-columns: 1fr 1fr !important;
  }
}


/* =============================================================================
   28. LUXURY MOTION & MICRO-INTERACTIONS  — v16
   Uses actual class names from product.tpl + header01.tpl:
     .allani-product-card  .allani-image-container  .allani-card-body
     .allani-card-actions  .allani-card-title  .allani-price-box
     .allani-header  #dor-header01  .allani-header-top
   ============================================================================= */

/* ── 28.1 KEYFRAMES ─────────────────────────────────────────────── */
@keyframes al-shimmer {
  0%   { background-position: -600px 0; }
  100% { background-position: 600px 0; }
}
@keyframes al-ripple {
  0%   { transform: scale(0); opacity: 0.45; }
  100% { transform: scale(4);  opacity: 0; }
}
@keyframes al-bounce-in {
  0%   { transform: scale(1); }
  30%  { transform: scale(1.35); }
  60%  { transform: scale(0.90); }
  80%  { transform: scale(1.12); }
  100% { transform: scale(1); }
}
@keyframes al-fade-up {
  from { opacity: 0; transform: translateY(28px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes al-fade-in {
  from { opacity: 0; }
  to   { opacity: 1; }
}
@keyframes al-spin {
  to { transform: rotate(360deg); }
}
@keyframes al-page-out {
  from { opacity: 1; transform: translateY(0); }
  to   { opacity: 0; transform: translateY(-12px); }
}
@keyframes al-page-in {
  from { opacity: 0; }
  to   { opacity: 1; }
  /* NO translateY — that causes layout shift + scrollbar flicker = bouncing */
}
@keyframes al-gold-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(201, 168, 76, 0); }
  50%       { box-shadow: 0 0 0 6px rgba(201, 168, 76, 0.18); }
}
@keyframes al-header-drop {
  from { transform: translateY(-6px); opacity: 0.7; }
  to   { transform: translateY(0); opacity: 1; }
}

/* ── 28.2 SKELETON LOADING ──────────────────────────────────────── */
.al-skeleton {
  background: linear-gradient(90deg,
    var(--al-border-light) 0%,
    #fffcf5 40%,
    var(--al-border-light) 80%
  ) !important;
  background-size: 600px 100% !important;
  animation: al-shimmer 1.5s infinite linear !important;
  border-radius: var(--al-radius-sm) !important;
  color: transparent !important;
}

/* Auto-skeleton for biz cards while content is loading */
.biz-group-content:empty::before,
.biz-group-content.al-loading::before {
  content: '';
  display: block;
  height: 220px;
  border-radius: var(--al-radius);
  background: linear-gradient(90deg,
    var(--al-border-light) 0%,
    #fffcf5 40%,
    var(--al-border-light) 80%
  );
  background-size: 600px 100%;
  animation: al-shimmer 1.5s infinite linear;
  margin-bottom: 8px;
}
.biz-group-content:empty::after,
.biz-group-content.al-loading::after {
  content: '';
  display: block;
  height: 220px;
  border-radius: var(--al-radius);
  background: linear-gradient(90deg,
    var(--al-border-light) 0%,
    #fffcf5 40%,
    var(--al-border-light) 80%
  );
  background-size: 600px 100%;
  animation: al-shimmer 1.5s 0.25s infinite linear;
}

/* ── 28.3 RIPPLE BUTTON EFFECT ──────────────────────────────────── */
.al-ripple-host {
  position: relative;
  overflow: hidden;
}
.al-ripple-wave {
  position: absolute;
  border-radius: 50%;
  width: 10px;
  height: 10px;
  background: rgba(255, 255, 255, 0.6);
  pointer-events: none;
  transform: scale(0);
  animation: al-ripple 0.65s var(--al-ease) forwards;
}
.al-ripple-wave.al-ripple-gold {
  background: rgba(201, 168, 76, 0.45);
}

/* ── 28.4 BUTTON LUXURY HOVER — allani-card-actions is the real wrapper ── */
.allani-card-actions .ajax_add_to_cart_button,
.allani-card-actions .add-to-cart,
.allani-card-actions .cart-button,
.product-add-to-cart .add-to-cart,
.allani-footer-newsletter-form button,
.checkout-step .continue,
.btn-primary {
  position: relative !important;
  overflow: hidden !important;
  letter-spacing: 0.03em;
  transition: transform var(--al-transition-fast),
              box-shadow var(--al-transition),
              background var(--al-transition) !important;
}
.allani-card-actions .ajax_add_to_cart_button:active,
.allani-card-actions .add-to-cart:active,
.product-add-to-cart .add-to-cart:active {
  transform: scale(0.94) !important;
}

/* ── 28.5 PRODUCT CARD HOVER LIFT — use allani-product-card ─────── */
/* Light border + radius on all cards */
.allani-product-card {
  border: 1px solid var(--al-border-light) !important;
  border-radius: var(--al-radius) !important;
  background: var(--al-surface) !important;
  transition:
    border-color 0.28s var(--al-ease),
    box-shadow 0.28s var(--al-ease),
    transform 0.28s var(--al-ease) !important;
  will-change: transform, box-shadow;
  overflow: hidden;
}
.allani-product-card:hover {
  border-color: var(--al-gold-light) !important;
  box-shadow: 0 12px 36px rgba(44, 28, 8, 0.16), 0 2px 8px rgba(201, 168, 76, 0.18) !important;
  transform: translateY(-4px) !important;
  z-index: 2;
  position: relative;
}
/* JS adds .al-tilt to override transition to fast linear during mouse-move */
.al-tilt {
  transition: transform 0.08s linear !important;
}

/* Product image zoom — allani-image-container is the real class */
.allani-image-container img,
.allani-image-container .replace-2x {
  transition: transform 0.55s var(--al-ease) !important;
  display: block;
  width: 100%;
}
.allani-product-card:hover .allani-image-container img,
.allani-product-card:hover .allani-image-container .replace-2x {
  transform: scale(1.07) !important;
}

/* ── 28.6 PAGE FADE-IN (load only, no link interception) ─────────── */
#al-page-curtain {
  position: fixed;
  inset: 0;
  background: rgba(28, 28, 28, 0.18);
  pointer-events: none;
  opacity: 0;
  z-index: 9999;
  transition: opacity 0.3s var(--al-ease);
}
/* Page content fades in on load — opacity only, handled purely by inline JS now */
/* This class is no longer used but kept as fallback */
body.al-page-entering #main {
  animation: al-page-in 0.4s ease both;
}

/* ── 28.7 SCROLL REVEAL — staggered fade-up ─────────────────────── */
.al-reveal {
  opacity: 0;
  transform: translateY(22px);
  transition:
    opacity 0.5s var(--al-ease),
    transform 0.5s var(--al-ease);
}
.al-reveal.al-revealed {
  opacity: 1 !important;
  transform: translateY(0) !important;
}
.al-reveal[data-delay="1"]  { transition-delay: 0.06s; }
.al-reveal[data-delay="2"]  { transition-delay: 0.12s; }
.al-reveal[data-delay="3"]  { transition-delay: 0.18s; }
.al-reveal[data-delay="4"]  { transition-delay: 0.24s; }
.al-reveal[data-delay="5"]  { transition-delay: 0.30s; }
.al-reveal[data-delay="6"]  { transition-delay: 0.36s; }

/* ── 28.8 CART COUNTER BOUNCE ───────────────────────────────────── */
.al-cart-bounce {
  animation: al-bounce-in 0.55s var(--al-ease-spring) both !important;
}
/* Cart badge luxury style */
.cart-products-count,
.shopping-cart-items,
.header-cart-count,
[class*="cart"][class*="count"],
[class*="cart"][class*="badge"] {
  background: var(--al-gold) !important;
  color: #fff !important;
  border-radius: 50% !important;
  font-weight: 700 !important;
  min-width: 19px;
  height: 19px;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  font-size: 0.72rem !important;
  line-height: 1;
  transition: transform 0.2s var(--al-ease-spring), background 0.2s var(--al-ease);
}

/* ── 28.9 SMOOTH TAB / ACCORDION TRANSITIONS ────────────────────── */
.tab-pane,
.dor-tab-content,
.tab-content {
  transition: opacity 0.3s var(--al-ease), transform 0.3s var(--al-ease);
}
.tab-pane.active,
.dor-tab-content.active {
  animation: al-fade-up 0.32s var(--al-ease) both;
}

/* Accordion expand */
.collapse,
.accordion-body,
.panel-collapse {
  transition: max-height 0.38s var(--al-ease), opacity 0.3s var(--al-ease) !important;
  overflow: hidden;
}

/* ── 28.10 AJAX LOADING SPINNER ─────────────────────────────────── */
#al-ajax-spinner {
  position: fixed;
  top: 16px;
  right: 20px;
  width: 26px;
  height: 26px;
  border: 3px solid var(--al-border);
  border-top-color: var(--al-gold);
  border-radius: 50%;
  animation: al-spin 0.72s linear infinite;
  z-index: 9998;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s var(--al-ease);
}
#al-ajax-spinner.al-visible {
  opacity: 1;
}

/* ── 28.11 FOCUS / ACTIVE STATES WITH MOTION ────────────────────── */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(201, 168, 76, 0.35) !important;
  border-radius: var(--al-radius-xs);
  animation: al-gold-pulse 1.2s var(--al-ease) 1;
}

/* Nav links click feedback */
.nav-link,
.biz-tabtitle,
#header a,
.main-menu a {
  transition:
    color var(--al-transition-fast),
    transform var(--al-transition-fast) !important;
}
.nav-link:active,
.biz-tabtitle:active,
#header a:active {
  transform: scale(0.95);
}

/* ── 28.12 PARALLAX HERO HINT ───────────────────────────────────── */
#dor-homeslider,
.dor-slider-wrapper,
.allani-hero,
[class*="home-slider"],
.bannerSlide {
  overflow: hidden;
  position: relative;
}
/* JS will translate the inner image on scroll */
#dor-homeslider .owl-item img,
#dor-homeslider .slide img,
.dor-slider-wrapper img {
  will-change: transform;
  transition: transform 0.05s linear;
}

/* ── 28.13 — removed (merged into 28.5 .allani-product-card) ─────── */

/* ── 28.14 HEADER SCROLL SHRINK ─────────────────────────────────── */
#header.al-header-scrolled {
  box-shadow: var(--al-shadow) !important;
  transition: box-shadow 0.3s var(--al-ease), padding 0.3s var(--al-ease);
}
#header.al-header-scrolled .allani-header-top,
#header.al-header-scrolled .header-top {
  padding-top: 8px !important;
  padding-bottom: 8px !important;
}
#header.al-header-scrolled .item-logo .logo,
#header.al-header-scrolled .dor-main-logo .logo {
  max-height: 42px !important;
}

/* ── 28.15 SECTION TITLE GOLD ACCENT ───────────────────────────── */
.dor-section-title,
.allani-section-title,
.block-title,
.biz-tabtitle h2,
h2.biz-tabtitle span,
#dor-biz-product h2 span {
  position: relative;
  display: inline-block;
}
.dor-section-title::after,
.allani-section-title::after {
  content: '';
  position: absolute;
  bottom: -4px;
  left: 0;
  height: 2px;
  width: 0;
  background: var(--al-gold-shimmer);
  background-size: 200% 100%;
  transition: width 0.5s var(--al-ease), background-position 0.8s linear;
}
.dor-section-title:hover::after,
.allani-section-title:hover::after {
  width: 100%;
}

/* ── 28.16 PRICE TAG LUXURY ─────────────────────────────────────── */
.price,
.product-price,
.current-price span,
.price.product-price {
  color: var(--al-charcoal) !important;
  font-weight: 600 !important;
  letter-spacing: 0.01em;
  transition: color var(--al-transition-fast);
}
.product-miniature:hover .price,
.ajax_block_product:hover .price {
  color: var(--al-gold-dark) !important;
}

/* ── 28.17 ADD-TO-CART AREA REVEAL — real classes ──────────────── */
.allani-card-body,
.allani-card-actions {
  transition: transform 0.28s var(--al-ease), opacity 0.28s var(--al-ease);
}

/* ── 28.18 SEARCH RESULT HIGHLIGHT ─────────────────────────────── */
mark,
.ui-autocomplete .ui-menu-item em {
  background: var(--al-gold-pale);
  color: var(--al-gold-dark);
  border-radius: 2px;
  padding: 0 2px;
}

/* ── 28.19 SCROLL TO TOP LUXURY ─────────────────────────────────── */
#to-top {
  background: linear-gradient(135deg, var(--al-charcoal), var(--al-charcoal-soft)) !important;
  border: 1px solid var(--al-gold) !important;
  box-shadow: var(--al-shadow-gold) !important;
  transition: transform var(--al-transition), box-shadow var(--al-transition) !important;
}
#to-top:hover {
  transform: translateY(-3px) scale(1.08) !important;
  box-shadow: 0 8px 28px rgba(201, 168, 76, 0.4) !important;
}

/* ── 28.20 NOTIFICATION / ALERT LUXURY ─────────────────────────── */
.alert,
.notification,
.growl-message {
  border-left: 3px solid var(--al-gold) !important;
  border-radius: var(--al-radius-sm) !important;
  animation: al-fade-up 0.3s var(--al-ease) both;
}

/* =============================================================================
   29. REBIRTH — SECTION HEADING SYSTEM (global gold divider)
   ============================================================================= */

/* Every section gets the same luxury heading treatment */
.allani-section-heading {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  margin-bottom: 28px;
  gap: 10px;
}

.allani-section-title,
.allani-section-heading .allani-section-title,
.allani-section-heading p.productscategory_h2,
.allani-section-heading h2 {
  font-family: 'Rubik', sans-serif !important;
  font-size: clamp(1.25rem, 2.5vw, 1.65rem) !important;
  font-weight: 600 !important;
  color: var(--al-charcoal-deep) !important;
  letter-spacing: 0.01em !important;
  margin: 0 !important;
  line-height: 1.2 !important;
  text-transform: none !important;
  position: relative;
}

/* Span inside Dorado's p.productscategory_h2 */
.allani-section-title span,
.allani-section-heading p.productscategory_h2 span {
  color: inherit !important;
  font: inherit !important;
}

/* Gold accent line beneath title */
.allani-section-line {
  display: block;
  width: 52px;
  height: 3px;
  background: var(--al-gold-shimmer);
  border-radius: 2px;
  transition: width 0.4s var(--al-ease);
}

.allani-section-related:hover .allani-section-line,
.allani-same-category:hover .allani-section-line,
.allani-same-brand:hover .allani-section-line {
  width: 88px;
}

/* =============================================================================
   30. REBIRTH — RELATED PRODUCTS SECTIONS
   ============================================================================= */

/* ── 30.1 Parent container ── */
.allani-section-related,
.allani-same-category,
.allani-same-brand,
.allani-hook-related-products,
.allani-hook-related-brand,
.allani-related-products {
  background: var(--al-surface-warm) !important;
  border-top: 1px solid var(--al-border-light) !important;
  border-radius: var(--al-radius-lg) !important;
  padding: 36px 28px !important;
  margin: 32px 0 !important;
  box-shadow: var(--al-shadow-xs) !important;
}

/* ── 30.2 Product grid inside related ── */
.allani-section-related .product_list_related,
.allani-section-related .products.allani-related-grid,
.allani-same-category .product_list_related,
.allani-same-brand    .product_list_related {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)) !important;
  gap: 20px !important;
  margin-top: 0 !important;
}

/* ── 30.3 OWL carousel inside related: de-float, flex ── */
.allani-hook-related-products .owl-stage,
.allani-hook-related-brand .owl-stage,
.productscategory_list .owl-stage {
  display: flex !important;
  align-items: stretch !important;
}

.allani-hook-related-products .owl-item,
.allani-hook-related-brand .owl-item,
.productscategory_list .owl-item {
  display: flex !important;
}

/* ── 30.4 Related arrow nav: gold ── */
.allani-hook-related-products .owl-prev,
.allani-hook-related-products .owl-next,
.allani-hook-related-brand   .owl-prev,
.allani-hook-related-brand   .owl-next,
.blockproductscategory .owl-prev,
.blockproductscategory .owl-next {
  background: var(--al-surface) !important;
  border: 1px solid var(--al-gold) !important;
  color: var(--al-gold) !important;
  border-radius: 50% !important;
  width: 38px !important;
  height: 38px !important;
  line-height: 36px !important;
  text-align: center !important;
  transition: background 0.22s, color 0.22s !important;
}

.allani-hook-related-products .owl-prev:hover,
.allani-hook-related-products .owl-next:hover,
.allani-hook-related-brand   .owl-prev:hover,
.allani-hook-related-brand   .owl-next:hover,
.blockproductscategory .owl-prev:hover,
.blockproductscategory .owl-next:hover {
  background: var(--al-gold) !important;
  color: #fff !important;
}

/* ── 30.5 Dorado same-category IDs ── */
#productscategory_same,
#productssamebrand {
  overflow: visible !important;
}

/* =============================================================================
   31. REBIRTH — PRODUCT DETAIL PAGE
   ============================================================================= */

/* ── 31.1 Page wrapper ── */
#main.allani-product-page {
  background: var(--al-surface) !important;
  border-radius: var(--al-radius-lg) !important;
  box-shadow: var(--al-shadow-sm) !important;
  overflow: hidden;
  margin-bottom: 32px;
}

/* ── 31.2 Product name ── */
#main.allani-product-page h1,
#main.allani-product-page .product-name-detail {
  font-size: clamp(1.4rem, 3.5vw, 2rem) !important;
  font-weight: 700 !important;
  color: var(--al-charcoal-deep) !important;
  letter-spacing: -0.01em !important;
  line-height: 1.2 !important;
  margin-bottom: 12px !important;
}

/* ── 31.3 Price block ── */
#main.allani-product-page .product-prices,
#main.allani-product-page .allani-price-box {
  background: var(--al-gold-pale) !important;
  border-left: 4px solid var(--al-gold) !important;
  border-radius: var(--al-radius-sm) !important;
  padding: 14px 18px !important;
  margin: 16px 0 !important;
}

#main.allani-product-page .current-price .price,
#main.allani-product-page span.price {
  font-size: 1.75rem !important;
  font-weight: 700 !important;
  color: var(--al-charcoal-deep) !important;
  letter-spacing: -0.02em !important;
}

#main.allani-product-page .regular-price {
  color: var(--al-muted) !important;
  font-size: 1rem !important;
  text-decoration: line-through !important;
}

#main.allani-product-page .discount-percentage,
#main.allani-product-page .discount-amount {
  background: var(--al-gold) !important;
  color: #fff !important;
  border-radius: var(--al-radius-xs) !important;
  padding: 2px 7px !important;
  font-size: 0.8rem !important;
  font-weight: 600 !important;
}

/* ── 31.4 Add-to-cart area ── */
#main.allani-product-page .product-add-to-cart,
#main.allani-product-page #add-to-cart-or-refresh {
  border-top: 1px solid var(--al-border-light) !important;
  padding-top: 20px !important;
  margin-top: 20px !important;
}

#main.allani-product-page .btn-primary,
#main.allani-product-page button.add-to-cart {
  background: var(--al-charcoal-deep) !important;
  border: 2px solid var(--al-gold) !important;
  color: #fff !important;
  font-family: 'Rubik', sans-serif !important;
  font-weight: 500 !important;
  font-size: 1rem !important;
  letter-spacing: 0.03em !important;
  text-transform: uppercase !important;
  border-radius: var(--al-radius-sm) !important;
  padding: 13px 30px !important;
  transition: background 0.25s, transform 0.2s, box-shadow 0.25s !important;
  box-shadow: var(--al-shadow-sm);
}

#main.allani-product-page .btn-primary:hover,
#main.allani-product-page button.add-to-cart:hover {
  background: var(--al-gold) !important;
  color: var(--al-charcoal-deep) !important;
  transform: translateY(-2px) !important;
  box-shadow: var(--al-shadow-gold) !important;
}

/* ── 31.5 Quantity input ── */
#main.allani-product-page .input-group,
#main.allani-product-page .qty {
  border: 1px solid var(--al-border) !important;
  border-radius: var(--al-radius-sm) !important;
  overflow: hidden !important;
}

#main.allani-product-page input[name="qty"] {
  border: none !important;
  text-align: center !important;
  font-size: 1.05rem !important;
  font-weight: 500 !important;
}

/* ── 31.6 Product tabs (description, details, etc.) ── */
#main.allani-product-page .nav-tabs {
  border-bottom: 2px solid var(--al-border-light) !important;
  gap: 4px !important;
  flex-wrap: nowrap !important;
  overflow-x: auto !important;
}

#main.allani-product-page .nav-tabs .nav-link,
#main.allani-product-page .nav-tabs a {
  border: none !important;
  border-bottom: 3px solid transparent !important;
  color: var(--al-muted) !important;
  font-weight: 500 !important;
  padding: 10px 18px !important;
  border-radius: 0 !important;
  transition: color 0.22s, border-color 0.22s !important;
  white-space: nowrap !important;
}

#main.allani-product-page .nav-tabs .nav-link.active,
#main.allani-product-page .nav-tabs .active a,
#main.allani-product-page .nav-tabs a:hover {
  color: var(--al-charcoal-deep) !important;
  border-bottom-color: var(--al-gold) !important;
  background: transparent !important;
}

/* ── 31.7 Product image area ── */
#main.allani-product-page .product-cover img,
#main.allani-product-page .product-image img {
  border-radius: var(--al-radius) !important;
  box-shadow: var(--al-shadow-sm) !important;
  transition: transform 0.4s var(--al-ease) !important;
}

#main.allani-product-page .product-cover:hover img {
  transform: scale(1.03) !important;
}

#main.allani-product-page .product-images-grid img,
#main.allani-product-page .product-thumb img {
  border-radius: var(--al-radius-sm) !important;
  border: 2px solid transparent !important;
  cursor: pointer !important;
  transition: border-color 0.2s, transform 0.2s !important;
}

#main.allani-product-page .product-images-grid img:hover,
#main.allani-product-page .product-thumb:hover img {
  border-color: var(--al-gold) !important;
  transform: scale(1.04) !important;
}

/* ── 31.8 SKU / Category meta ── */
#main.allani-product-page .product-more-opt {
  background: var(--al-surface-soft) !important;
  border-radius: var(--al-radius-sm) !important;
  padding: 12px 16px !important;
  font-size: 0.88rem !important;
}

#main.allani-product-page .product-more-opt label {
  font-weight: 600 !important;
  color: var(--al-muted) !important;
  margin-right: 5px !important;
  text-transform: uppercase !important;
  font-size: 0.76rem !important;
  letter-spacing: 0.06em !important;
}

#main.allani-product-page .product-more-opt a {
  color: var(--al-gold-dark) !important;
  text-decoration: none !important;
  font-weight: 500 !important;
}

#main.allani-product-page .product-more-opt a:hover {
  color: var(--al-gold) !important;
  text-decoration: underline !important;
}

/* ── 31.9 Reassurance icons ── */
#main.allani-product-page .blockreassurance_product,
#main.allani-product-page .blockreassurance {
  background: var(--al-surface-warm) !important;
  border-top: 1px solid var(--al-border-light) !important;
  padding: 16px !important;
  border-radius: 0 0 var(--al-radius) var(--al-radius) !important;
  display: flex !important;
  gap: 16px !important;
  flex-wrap: wrap !important;
}

/* ── 31.10 Product status badges ── */
#main.allani-product-page .allani-status-badges .box-items-label,
.allani-status-badges .discount-label,
.allani-status-badges .new-label {
  border-radius: var(--al-radius-xs) !important;
  font-size: 0.72rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  padding: 3px 9px !important;
}

/* =============================================================================
   32. REBIRTH — CATEGORY / LISTING PAGE
   ============================================================================= */

/* ── 32.1 Page wrapper ── */
.allani-listing-page {
  padding: 8px 0 !important;
}

/* ── 32.2 Category title ── */
.allani-listing-title {
  font-size: clamp(1.3rem, 3vw, 1.9rem) !important;
  font-weight: 700 !important;
  color: var(--al-charcoal-deep) !important;
  border-bottom: 3px solid var(--al-gold) !important;
  padding-bottom: 12px !important;
  margin-bottom: 24px !important;
  letter-spacing: -0.01em !important;
  display: inline-block !important;
}

.allani-listing-title span {
  color: inherit !important;
}

/* ── 32.3 Listing controls top ── */
.allani-listing-top .products-selection {
  background: var(--al-surface) !important;
  border: 1px solid var(--al-border-light) !important;
  border-radius: var(--al-radius-sm) !important;
  padding: 10px 16px !important;
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  flex-wrap: wrap !important;
  margin-bottom: 16px !important;
}

.allani-listing-top .sort-select-wrapper select,
.allani-listing-top #js-product-list-top select {
  border: 1px solid var(--al-border) !important;
  border-radius: var(--al-radius-sm) !important;
  padding: 7px 12px !important;
  font-family: 'Rubik', sans-serif !important;
  color: var(--al-charcoal) !important;
  background: var(--al-surface) !important;
  cursor: pointer !important;
  transition: border-color 0.2s !important;
}

.allani-listing-top .sort-select-wrapper select:focus {
  border-color: var(--al-gold) !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(201,168,76,.12) !important;
}

/* ── 32.4 Pagination ── */
.allani-listing-bottom .pagination,
#js-product-list-bottom .pagination {
  display: flex !important;
  gap: 6px !important;
  justify-content: center !important;
  padding: 24px 0 !important;
}

.allani-listing-bottom .page-item .page-link,
#js-product-list-bottom .page-link {
  border: 1px solid var(--al-border) !important;
  border-radius: var(--al-radius-sm) !important;
  color: var(--al-charcoal) !important;
  font-weight: 500 !important;
  padding: 8px 14px !important;
  transition: background 0.2s, border-color 0.2s, color 0.2s !important;
  min-width: 40px !important;
  text-align: center !important;
  background: var(--al-surface) !important;
}

.allani-listing-bottom .page-item.active .page-link,
.allani-listing-bottom .page-item .page-link:hover,
#js-product-list-bottom .page-link:hover {
  background: var(--al-gold) !important;
  border-color: var(--al-gold) !important;
  color: #fff !important;
}

/* ── 32.5 Active filters ── */
.allani-active-filters .active-filter-title {
  font-weight: 600 !important;
  font-size: 0.85rem !important;
  color: var(--al-muted) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
}

.allani-active-filters .filter-block {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  background: var(--al-gold-pale) !important;
  border: 1px solid var(--al-gold-light) !important;
  border-radius: 20px !important;
  padding: 4px 12px !important;
  font-size: 0.85rem !important;
  color: var(--al-gold-dark) !important;
  font-weight: 500 !important;
  margin: 4px !important;
  cursor: pointer !important;
  transition: background 0.2s !important;
}

.allani-active-filters .filter-block:hover  {
  background: var(--al-gold) !important;
  color: #fff !important;
  border-color: var(--al-gold) !important;
}

/* ── 32.6 Faceted search sidebar ── */
.allani-listing-page .facets-sidebar,
.allani-listing-page #search_filters_wrapper {
  background: var(--al-surface) !important;
  border-radius: var(--al-radius) !important;
  border: 1px solid var(--al-border-light) !important;
  padding: 20px 16px !important;
  box-shadow: var(--al-shadow-xs) !important;
}

.allani-listing-page .facet-title,
.allani-listing-page .facets-sidebar h4,
.allani-listing-page #search_filters_wrapper h4 {
  font-weight: 600 !important;
  font-size: 0.9rem !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  color: var(--al-charcoal-deep) !important;
  border-bottom: 1px solid var(--al-border-light) !important;
  padding-bottom: 8px !important;
  margin-bottom: 12px !important;
}

/* ── 32.7 Facet checkboxes ── */
.allani-listing-page .facet-label,
.allani-listing-page .custom-checkbox {
  cursor: pointer !important;
  transition: color 0.18s !important;
}

.allani-listing-page .facet-label:hover input[type="checkbox"] ~ span,
.allani-listing-page .custom-checkbox:hover span {
  color: var(--al-gold-dark) !important;
}

.allani-listing-page input[type="checkbox"]:checked + span {
  color: var(--al-gold-dark) !important;
  font-weight: 500 !important;
}

/* =============================================================================
   33. REBIRTH — HEADER DEEP OVERRIDES
   ============================================================================= */

/* ── 33.1 Logo ── */
.allani-header .allani-logo img,
#header .logo {
  max-height: 56px !important;
  width: auto !important;
  transition: transform 0.28s var(--al-ease), opacity 0.28s !important;
  filter: none !important;
}

.allani-header .allani-logo img:hover,
#header .logo:hover {
  transform: scale(1.04) !important;
  opacity: 0.92 !important;
}

/* ── 33.2 Search bar ── */
.allani-header .allani-search-wrap input[type="text"],
#header .search-widget input[type="text"],
#header .search_query {
  border: 1px solid var(--al-border) !important;
  border-radius: var(--al-radius-sm) !important;
  padding: 9px 16px !important;
  font-family: 'Rubik', sans-serif !important;
  font-size: 0.95rem !important;
  color: var(--al-charcoal) !important;
  background: var(--al-surface) !important;
  transition: border-color 0.22s, box-shadow 0.22s !important;
  width: 100% !important;
}

.allani-header .allani-search-wrap input[type="text"]:focus,
#header .search_query:focus {
  border-color: var(--al-gold) !important;
  box-shadow: 0 0 0 3px rgba(201,168,76,.12) !important;
  outline: none !important;
}

/* ── 33.3 Cart icon in header ── */
.allani-header .allani-actions-wrap .blockcart,
#header .blockcart {
  position: relative !important;
}

.allani-header .cart-products-count,
#header .cart-products-count {
  background: var(--al-gold) !important;
  color: #fff !important;
  font-weight: 700 !important;
  font-size: 0.7rem !important;
  min-width: 18px !important;
  height: 18px !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: absolute !important;
  top: -6px !important;
  right: -6px !important;
  line-height: 1 !important;
  padding: 0 3px !important;
}

/* ── 33.4 Navigation main menu ── */
#dor-header01 .allani-nav,
#header nav,
#top-menu {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  flex-wrap: wrap !important;
}

#top-menu > li > a,
#dor-header01 .allani-nav .nav-link {
  font-family: 'Rubik', sans-serif !important;
  font-size: 0.88rem !important;
  font-weight: 500 !important;
  color: var(--al-charcoal) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  padding: 10px 14px !important;
  border-radius: var(--al-radius-sm) !important;
  position: relative !important;
  transition: color 0.22s, background 0.22s !important;
}

#top-menu > li > a::after {
  content: '';
  position: absolute;
  left: 14px;
  right: 14px;
  bottom: 4px;
  height: 2px;
  background: var(--al-gold);
  border-radius: 2px;
  transform: scaleX(0);
  transition: transform 0.25s var(--al-ease);
  transform-origin: left;
}

#top-menu > li > a:hover::after,
#top-menu > li.sfHover > a::after,
#top-menu > li.current > a::after {
  transform: scaleX(1) !important;
}

#top-menu > li > a:hover {
  color: var(--al-gold-dark) !important;
  background: var(--al-gold-pale) !important;
}

/* ── 33.5 Dropdown sub-menu ── */
#top-menu .sub-menu {
  background: var(--al-surface) !important;
  border: 1px solid var(--al-border-light) !important;
  border-radius: var(--al-radius) !important;
  box-shadow: var(--al-shadow-lg) !important;
  padding: 8px 0 !important;
  min-width: 200px !important;
}

#top-menu .sub-menu a {
  padding: 9px 20px !important;
  color: var(--al-charcoal) !important;
  font-size: 0.9rem !important;
  font-weight: 400 !important;
  transition: background 0.18s, color 0.18s, padding-left 0.18s !important;
  display: block !important;
}

#top-menu .sub-menu a:hover {
  background: var(--al-gold-pale) !important;
  color: var(--al-gold-dark) !important;
  padding-left: 26px !important;
}

/* =============================================================================
   34. REBIRTH — FOOTER DEEP OVERRIDES
   ============================================================================= */

/* ── 34.1 Footer columns ── */
#footer .allani-footer-col h4,
#footer .footer-block h4,
#footer .footer-block .h4 {
  font-family: 'Rubik', sans-serif !important;
  font-size: 0.82rem !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.1em !important;
  color: var(--al-gold) !important;
  margin-bottom: 16px !important;
  padding-bottom: 8px !important;
  border-bottom: 1px solid rgba(201,168,76,.2) !important;
}

/* ── 34.2 Footer links ── */
#footer ul li a,
#footer .footer-block a {
  color: rgba(255,255,255,0.72) !important;
  font-size: 0.88rem !important;
  font-weight: 400 !important;
  transition: color 0.2s, padding-left 0.2s !important;
  display: inline-block !important;
  padding: 2px 0 !important;
  line-height: 1.6 !important;
}

#footer ul li a:hover,
#footer .footer-block a:hover {
  color: var(--al-gold) !important;
  padding-left: 6px !important;
}

/* ── 34.3 Newsletter form ── */
.allani-footer-newsletter-form input[type="email"],
#footer .block_newsletter input[type="email"] {
  border: 1px solid rgba(255,255,255,0.2) !important;
  border-radius: var(--al-radius-sm) !important;
  background: rgba(255,255,255,0.08) !important;
  color: #fff !important;
  padding: 10px 16px !important;
  font-family: 'Rubik', sans-serif !important;
  width: 100% !important;
  transition: border-color 0.22s, background 0.22s !important;
}

.allani-footer-newsletter-form input[type="email"]:focus,
#footer .block_newsletter input[type="email"]:focus {
  border-color: var(--al-gold) !important;
  background: rgba(255,255,255,0.14) !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(201,168,76,.15) !important;
}

.allani-footer-newsletter-form button,
#footer .block_newsletter button {
  background: var(--al-gold) !important;
  border: none !important;
  color: var(--al-charcoal-deep) !important;
  font-weight: 700 !important;
  font-size: 0.85rem !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  padding: 10px 20px !important;
  border-radius: var(--al-radius-sm) !important;
  width: 100% !important;
  margin-top: 8px !important;
  cursor: pointer !important;
  transition: background 0.22s, transform 0.18s !important;
}

.allani-footer-newsletter-form button:hover,
#footer .block_newsletter button:hover {
  background: var(--al-gold-light) !important;
  transform: translateY(-1px) !important;
}

/* ── 34.4 Footer bottom bar ── */
#footer .footer-bottom,
#footer #block-cdc-footer-bottom {
  border-top: 1px solid rgba(201,168,76,.2) !important;
  margin-top: 24px !important;
  padding-top: 16px !important;
  font-size: 0.8rem !important;
  color: rgba(255,255,255,0.4) !important;
}

/* =============================================================================
   35. REBIRTH — BREADCRUMB
   ============================================================================= */

nav.breadcrumb,
.breadcrumb {
  background: transparent !important;
  padding: 8px 0 !important;
  margin-bottom: 16px !important;
}

.breadcrumb ol {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  flex-wrap: wrap !important;
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

.breadcrumb li a,
.breadcrumb .breadcrumb-item a {
  color: var(--al-muted) !important;
  font-size: 0.83rem !important;
  font-weight: 400 !important;
  text-decoration: none !important;
  transition: color 0.18s !important;
}

.breadcrumb li a:hover {
  color: var(--al-gold-dark) !important;
}

.breadcrumb li::after {
  content: '/';
  color: var(--al-border) !important;
  margin: 0 2px !important;
  font-size: 0.75rem !important;
}

.breadcrumb li:last-child::after { display: none !important; }

.breadcrumb li:last-child a,
.breadcrumb li:last-child span {
  color: var(--al-charcoal) !important;
  font-weight: 500 !important;
}

/* =============================================================================
   36. REBIRTH — CHECKOUT PAGE
   ============================================================================= */

/* ── 36.1 Step headers ── */
.checkout-process .checkout-step {
  border: 1px solid var(--al-border-light) !important;
  border-radius: var(--al-radius) !important;
  margin-bottom: 16px !important;
  overflow: hidden !important;
  background: var(--al-surface) !important;
  box-shadow: var(--al-shadow-xs) !important;
}

.checkout-process .checkout-step .step-title {
  background: var(--al-charcoal-deep) !important;
  color: #fff !important;
  padding: 14px 20px !important;
  font-weight: 600 !important;
  font-size: 0.95rem !important;
  letter-spacing: 0.02em !important;
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
}

.checkout-process .checkout-step .step-title .step-number {
  background: var(--al-gold) !important;
  color: var(--al-charcoal-deep) !important;
  width: 26px !important;
  height: 26px !important;
  border-radius: 50% !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 0.8rem !important;
  font-weight: 700 !important;
  flex-shrink: 0 !important;
}

/* ── 36.2 Form inputs in checkout ── */
.checkout-process input[type="text"],
.checkout-process input[type="email"],
.checkout-process input[type="tel"],
.checkout-process input[type="password"],
.checkout-process select,
.checkout-process textarea {
  border: 1px solid var(--al-border) !important;
  border-radius: var(--al-radius-sm) !important;
  padding: 10px 14px !important;
  font-family: 'Rubik', sans-serif !important;
  color: var(--al-charcoal) !important;
  transition: border-color 0.22s, box-shadow 0.22s !important;
  width: 100% !important;
}

.checkout-process input:focus,
.checkout-process select:focus,
.checkout-process textarea:focus {
  border-color: var(--al-gold) !important;
  box-shadow: 0 0 0 3px rgba(201,168,76,.12) !important;
  outline: none !important;
}

/* ── 36.3 Order summary panel ── */
#order-summary-content {
  background: var(--al-surface-warm) !important;
  border: 1px solid var(--al-border-light) !important;
  border-radius: var(--al-radius) !important;
  padding: 20px !important;
}

#order-summary-content .cart-summary-line {
  display: flex !important;
  justify-content: space-between !important;
  padding: 7px 0 !important;
  border-bottom: 1px solid var(--al-border-light) !important;
  font-size: 0.92rem !important;
}

#order-summary-content .cart-total {
  font-weight: 700 !important;
  font-size: 1.1rem !important;
  color: var(--al-charcoal-deep) !important;
  border-bottom: none !important;
  padding-top: 12px !important;
}

/* =============================================================================
   37. REBIRTH — PRODUCT MINIATURE LUXURY UPGRADE
   ============================================================================= */

/* ── 37.1 Price in card ── */
.allani-product-card .allani-price-box .price,
.allani-product-card .content_price .price {
  font-size: 1.05rem !important;
  font-weight: 700 !important;
  color: var(--al-charcoal-deep) !important;
  letter-spacing: -0.01em !important;
}

.allani-product-card .old-price,
.allani-product-card .regular-price {
  font-size: 0.82rem !important;
  color: var(--al-muted) !important;
  text-decoration: line-through !important;
}

/* ── 37.2 Product name in card ── */
.allani-product-card .product-title a,
.allani-product-card .dor_product_title a,
.allani-product-card h3 a,
.allani-product-card h2 a {
  font-family: 'Rubik', sans-serif !important;
  font-size: 0.92rem !important;
  font-weight: 500 !important;
  color: var(--al-charcoal) !important;
  text-decoration: none !important;
  line-height: 1.35 !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  transition: color 0.2s !important;
}

.allani-product-card:hover .product-title a,
.allani-product-card:hover .dor_product_title a {
  color: var(--al-gold-dark) !important;
}

/* ── 37.3 Add-to-cart in card ── */
.allani-card-actions .ajax_add_to_cart_button,
.allani-card-actions .cart-button {
  background: var(--al-charcoal-deep) !important;
  color: #fff !important;
  border: 1px solid var(--al-gold) !important;
  border-radius: var(--al-radius-sm) !important;
  font-family: 'Rubik', sans-serif !important;
  font-size: 0.82rem !important;
  font-weight: 500 !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
  padding: 8px 14px !important;
  transition: background 0.22s, color 0.22s, transform 0.18s !important;
  cursor: pointer !important;
  width: 100% !important;
  text-align: center !important;
}

.allani-card-actions .ajax_add_to_cart_button:hover,
.allani-card-actions .cart-button:hover {
  background: var(--al-gold) !important;
  color: var(--al-charcoal-deep) !important;
  transform: translateY(-1px) !important;
}

/* ── 37.4 Card overlay on hover ── */
.allani-product-card::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(to bottom, transparent 60%, rgba(44,28,8,.06) 100%);
  border-radius: var(--al-radius);
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.28s;
}

.allani-product-card:hover::after {
  opacity: 1;
}

/* ── 37.5 Badge discount ── */
.allani-product-card .box-items.allani-status-badges .on-sale,
.allani-product-card .discount-badge {
  background: var(--al-gold) !important;
  color: var(--al-charcoal-deep) !important;
  font-weight: 700 !important;
  font-size: 0.7rem !important;
  border-radius: var(--al-radius-xs) !important;
  padding: 2px 7px !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
}

.allani-product-card .box-items.allani-status-badges .new {
  background: var(--al-charcoal-deep) !important;
  color: #fff !important;
  font-weight: 700 !important;
  font-size: 0.7rem !important;
  border-radius: var(--al-radius-xs) !important;
  padding: 2px 7px !important;
}

/* =============================================================================
   38. REBIRTH — MOBILE RESPONSIVE
   ============================================================================= */

@media (max-width: 768px) {
  .allani-section-related,
  .allani-same-category,
  .allani-same-brand {
    padding: 20px 14px !important;
    border-radius: var(--al-radius) !important;
  }

  .allani-section-title,
  .allani-listing-title {
    font-size: 1.1rem !important;
  }

  #main.allani-product-page h1 {
    font-size: 1.3rem !important;
  }

  #main.allani-product-page .btn-primary,
  #main.allani-product-page button.add-to-cart {
    width: 100% !important;
    padding: 14px !important;
  }

  .allani-section-related .product_list_related,
  .allani-section-related .products.allani-related-grid,
  .allani-same-category .product_list_related,
  .allani-same-brand    .product_list_related {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 12px !important;
  }

  #top-menu > li > a {
    font-size: 0.82rem !important;
    padding: 8px 10px !important;
  }

  .allani-listing-top .products-selection {
    flex-direction: column !important;
    align-items: flex-start !important;
  }
}



@media (max-width: 480px) {
  .allani-section-related .product_list_related,
  .allani-same-category .product_list_related {
    grid-template-columns: 1fr !important;
  }

  .allani-listing-bottom .pagination {
    gap: 3px !important;
    flex-wrap: wrap !important;
  }
}

/* =============================================================================
   39. REBIRTH — PRODUCTS BAR (view toggles + count + sort)
   ============================================================================= */

#js-product-list-top.allani-products-bar,
.allani-products-bar {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  background: var(--al-surface) !important;
  border: 1px solid var(--al-border-light) !important;
  border-radius: var(--al-radius) !important;
  padding: 10px 18px !important;
  margin-bottom: 20px !important;
  box-shadow: var(--al-shadow-xs) !important;
  flex-wrap: wrap !important;
}

/* ── Left ─────────────────────────── */
.allani-bar-left {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  flex-shrink: 0 !important;
}

/* ── View toggle buttons ── */
.allani-view-toggles {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  background: var(--al-surface-soft) !important;
  border-radius: var(--al-radius-sm) !important;
  padding: 4px !important;
}

.allani-view-btn {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 32px !important;
  height: 32px !important;
  border-radius: 6px !important;
  color: var(--al-muted) !important;
  text-decoration: none !important;
  transition: background 0.18s, color 0.18s !important;
  border: none !important;
  background: transparent !important;
}

.allani-view-btn svg {
  width: 16px !important;
  height: 16px !important;
  display: block !important;
  flex-shrink: 0 !important;
}

.allani-view-btn:hover {
  background: var(--al-surface) !important;
  color: var(--al-charcoal) !important;
}

.allani-view-btn.active {
  background: var(--al-charcoal-deep) !important;
  color: var(--al-gold) !important;
  box-shadow: var(--al-shadow-xs) !important;
}

/* ── Product count ── */
.allani-products-count {
  font-size: 0.83rem !important;
  color: var(--al-muted) !important;
  white-space: nowrap !important;
}

.allani-products-count strong {
  font-weight: 700 !important;
  color: var(--al-charcoal) !important;
}

/* ── Right ─────────────────────────── */
.allani-bar-right {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}

/* ── Sort wrapper ── */
.allani-sort-wrap {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.allani-sort-label {
  font-size: 0.8rem !important;
  font-weight: 500 !important;
  color: var(--al-muted) !important;
  white-space: nowrap !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  margin: 0 !important;
}

/* ── Sort dropdown button ── */
.allani-sort-dropdown {
  position: relative !important;
}

.allani-sort-btn {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  background: var(--al-surface) !important;
  border: 1px solid var(--al-border) !important;
  border-radius: var(--al-radius-sm) !important;
  padding: 8px 14px !important;
  font-family: 'Rubik', sans-serif !important;
  font-size: 0.88rem !important;
  font-weight: 500 !important;
  color: var(--al-charcoal) !important;
  cursor: pointer !important;
  white-space: nowrap !important;
  transition: border-color 0.2s, box-shadow 0.2s !important;
  min-width: 140px !important;
}

.allani-sort-btn:hover,
.allani-sort-btn[aria-expanded="true"] {
  border-color: var(--al-gold) !important;
  box-shadow: 0 0 0 3px rgba(201,168,76,.1) !important;
}

.allani-sort-current {
  flex: 1 !important;
}

.allani-sort-caret {
  color: var(--al-muted) !important;
  flex-shrink: 0 !important;
  transition: transform 0.22s !important;
}

.allani-sort-btn[aria-expanded="true"] .allani-sort-caret {
  transform: rotate(180deg) !important;
}

/* ── Sort dropdown menu ── */
.allani-sort-menu.dropdown-menu {
  background: var(--al-surface) !important;
  border: 1px solid var(--al-border-light) !important;
  border-radius: var(--al-radius) !important;
  box-shadow: var(--al-shadow-lg) !important;
  padding: 6px !important;
  min-width: 180px !important;
  margin-top: 4px !important;
}

.allani-sort-item {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 9px 12px !important;
  border-radius: var(--al-radius-sm) !important;
  font-size: 0.88rem !important;
  color: var(--al-charcoal) !important;
  text-decoration: none !important;
  transition: background 0.15s, color 0.15s !important;
}

.allani-sort-item:hover {
  background: var(--al-gold-pale) !important;
  color: var(--al-gold-dark) !important;
}

.allani-sort-item.current {
  color: var(--al-gold-dark) !important;
  font-weight: 600 !important;
}

.allani-sort-check {
  color: var(--al-gold) !important;
  flex-shrink: 0 !important;
}

/* ── Mobile filter toggle button ── */
.allani-filter-toggle-btn {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  background: var(--al-charcoal-deep) !important;
  color: #fff !important;
  border: 1px solid var(--al-gold) !important;
  border-radius: var(--al-radius-sm) !important;
  padding: 8px 14px !important;
  font-family: 'Rubik', sans-serif !important;
  font-size: 0.85rem !important;
  font-weight: 500 !important;
  cursor: pointer !important;
  transition: background 0.2s !important;
}

.allani-filter-toggle-btn:hover {
  background: var(--al-gold) !important;
  color: var(--al-charcoal-deep) !important;
}

.allani-filter-toggle-btn svg {
  flex-shrink: 0 !important;
}

/* =============================================================================
   40. REBIRTH — FILTER SIDEBAR (facet cards)
   ============================================================================= */

#search_filters_wrapper {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
}

#search_filters {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
}

/* ── Sidebar title row ── */
.allani-facets-header {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 0 0 4px 0 !important;
  margin-bottom: 2px !important;
}

.allani-facets-icon {
  color: var(--al-gold) !important;
  display: flex !important;
  align-items: center !important;
}

.allani-facets-title {
  font-family: 'Rubik', sans-serif !important;
  font-size: 0.75rem !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.1em !important;
  color: var(--al-charcoal-deep) !important;
  margin: 0 !important;
}

/* ── Clear all button ── */
.allani-facets-clear-wrap {
  margin-bottom: 0 !important;
}

.allani-facets-clear-btn {
  display: flex !important;
  align-items: center !important;
  gap: 5px !important;
  background: transparent !important;
  border: 1px solid var(--al-border) !important;
  border-radius: 20px !important;
  padding: 4px 12px !important;
  font-size: 0.78rem !important;
  font-weight: 500 !important;
  color: var(--al-muted) !important;
  cursor: pointer !important;
  font-family: 'Rubik', sans-serif !important;
  transition: border-color 0.2s, color 0.2s, background 0.2s !important;
}

.allani-facets-clear-btn:hover {
  border-color: var(--al-danger) !important;
  color: var(--al-danger) !important;
  background: rgba(198, 40, 40, 0.04) !important;
}

/* ── Individual facet card ── */
.allani-facet-card {
  background: var(--al-surface) !important;
  border: 1px solid var(--al-border-light) !important;
  border-radius: var(--al-radius) !important;
  overflow: hidden !important;
  transition: border-color 0.22s, box-shadow 0.22s !important;
}

.allani-facet-card:hover {
  border-color: var(--al-gold-light) !important;
  box-shadow: var(--al-shadow-xs) !important;
}

/* ── Facet card header ── */
.allani-facet-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 13px 16px !important;
  cursor: pointer !important;
  user-select: none !important;
  border-bottom: 1px solid var(--al-border-light) !important;
  background: var(--al-surface-warm) !important;
  transition: background 0.18s !important;
}

.allani-facet-header:hover {
  background: var(--al-gold-pale) !important;
}

.allani-facet-name {
  font-family: 'Rubik', sans-serif !important;
  font-size: 0.85rem !important;
  font-weight: 600 !important;
  color: var(--al-charcoal-deep) !important;
  letter-spacing: 0.01em !important;
}

.allani-facet-chevron {
  color: var(--al-muted) !important;
  transition: transform 0.25s var(--al-ease) !important;
  flex-shrink: 0 !important;
}

.allani-facet-header.is-open .allani-facet-chevron {
  transform: rotate(180deg) !important;
  color: var(--al-gold) !important;
}

/* Accent bar: gold left border when expanded */
.allani-facet-header.is-open {
  border-left: 3px solid var(--al-gold) !important;
  padding-left: 13px !important;
  background: var(--al-gold-pale) !important;
}

/* ── Facet list ── */
.allani-facet-list {
  list-style: none !important;
  margin: 0 !important;
  padding: 8px 0 !important;
}

.allani-facet-item {
  padding: 0 !important;
}

.allani-facet-label {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 8px 16px !important;
  cursor: pointer !important;
  width: 100% !important;
  transition: background 0.15s !important;
  border-radius: 0 !important;
}

.allani-facet-label:hover {
  background: var(--al-surface-soft) !important;
}

.allani-facet-label.is-active {
  background: var(--al-gold-pale) !important;
}

/* ── Custom checkbox ── */
.allani-checkbox {
  display: flex !important;
  align-items: center !important;
  flex-shrink: 0 !important;
}

.allani-checkbox input[type="checkbox"] {
  position: absolute !important;
  opacity: 0 !important;
  width: 0 !important;
  height: 0 !important;
  pointer-events: none !important;
}

.allani-checkbox-box {
  width: 16px !important;
  height: 16px !important;
  border: 1.5px solid var(--al-border) !important;
  border-radius: 4px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: var(--al-surface) !important;
  transition: border-color 0.18s, background 0.18s !important;
  flex-shrink: 0 !important;
}

.allani-check-svg {
  display: none !important;
  color: var(--al-surface) !important;
  width: 10px !important;
  height: 10px !important;
}

input[type="checkbox"]:checked ~ .allani-checkbox-box,
.allani-facet-label.is-active .allani-checkbox-box,
input[type="checkbox"]:checked + .allani-checkbox-box {
  background: var(--al-gold) !important;
  border-color: var(--al-gold) !important;
}

input[type="checkbox"]:checked ~ .allani-checkbox-box .allani-check-svg,
.allani-facet-label.is-active .allani-check-svg {
  display: block !important;
}

/* ── Custom radio ── */
.allani-radio {
  display: flex !important;
  align-items: center !important;
  flex-shrink: 0 !important;
  position: relative !important;
}

.allani-radio input[type="radio"] {
  position: absolute !important;
  opacity: 0 !important;
  width: 0 !important;
  height: 0 !important;
}

.allani-radio-dot {
  width: 16px !important;
  height: 16px !important;
  border: 1.5px solid var(--al-border) !important;
  border-radius: 50% !important;
  background: var(--al-surface) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: border-color 0.18s !important;
  flex-shrink: 0 !important;
}

.allani-radio-dot::after {
  content: '' !important;
  width: 7px !important;
  height: 7px !important;
  background: var(--al-gold) !important;
  border-radius: 50% !important;
  opacity: 0 !important;
  transition: opacity 0.18s !important;
}

input[type="radio"]:checked ~ .allani-radio-dot {
  border-color: var(--al-gold) !important;
}

input[type="radio"]:checked ~ .allani-radio-dot::after {
  opacity: 1 !important;
}

/* ── Facet link ── */
.allani-facet-link {
  font-size: 0.88rem !important;
  color: var(--al-charcoal) !important;
  text-decoration: none !important;
  flex: 1 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  transition: color 0.15s !important;
}

.allani-facet-label.is-active .allani-facet-link,
.allani-facet-label:hover .allani-facet-link {
  color: var(--al-gold-dark) !important;
}

/* ── Count badge ── */
.allani-facet-count {
  font-style: normal !important;
  font-size: 0.75rem !important;
  color: var(--al-muted) !important;
  background: var(--al-surface-soft) !important;
  border-radius: 10px !important;
  padding: 1px 7px !important;
  font-weight: 500 !important;
  min-width: 22px !important;
  text-align: center !important;
}

.allani-facet-label.is-active .allani-facet-count {
  background: rgba(201,168,76,.18) !important;
  color: var(--al-gold-dark) !important;
}

/* ── Color swatch ── */
.allani-swatch {
  width: 18px !important;
  height: 18px !important;
  border-radius: 50% !important;
  border: 2px solid var(--al-border) !important;
  display: inline-block !important;
  flex-shrink: 0 !important;
  background-size: cover !important;
  transition: transform 0.18s, border-color 0.18s !important;
}

.allani-facet-label.is-active .allani-swatch,
.allani-facet-label:hover .allani-swatch {
  border-color: var(--al-gold) !important;
  transform: scale(1.12) !important;
}

/* ── Facet dropdown (alternative widget) ── */
.allani-facet-select-wrap {
  padding: 12px 14px !important;
}

.allani-facet-select-btn {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  width: 100% !important;
  background: var(--al-surface) !important;
  border: 1px solid var(--al-border) !important;
  border-radius: var(--al-radius-sm) !important;
  padding: 8px 12px !important;
  font-size: 0.88rem !important;
  color: var(--al-charcoal) !important;
  text-decoration: none !important;
  cursor: pointer !important;
  transition: border-color 0.2s !important;
}

.allani-facet-select-btn:hover {
  border-color: var(--al-gold) !important;
}

.allani-facet-menu.dropdown-menu {
  background: var(--al-surface) !important;
  border: 1px solid var(--al-border-light) !important;
  border-radius: var(--al-radius) !important;
  box-shadow: var(--al-shadow-lg) !important;
  padding: 6px !important;
  min-width: 100% !important;
}

.allani-facet-menu-item {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 8px 12px !important;
  border-radius: var(--al-radius-sm) !important;
  font-size: 0.88rem !important;
  color: var(--al-charcoal) !important;
  text-decoration: none !important;
  transition: background 0.15s !important;
}

.allani-facet-menu-item:hover {
  background: var(--al-gold-pale) !important;
  color: var(--al-gold-dark) !important;
}

.allani-facet-menu-item em {
  font-style: normal !important;
  color: var(--al-muted) !important;
  font-size: 0.78rem !important;
}

/* =============================================================================
   41. REBIRTH — MOBILE LAYOUT (bar + filter)
   ============================================================================= */

@media (max-width: 991px) {
  .allani-products-bar {
    padding: 8px 12px !important;
    gap: 8px !important;
  }

  .allani-sort-label {
    display: none !important;
  }

  .allani-sort-btn {
    min-width: 120px !important;
    padding: 7px 11px !important;
    font-size: 0.83rem !important;
  }
}

@media (max-width: 767px) {
  .allani-products-bar {
    flex-wrap: wrap !important;
  }

  .allani-bar-left,
  .allani-bar-right {
    width: 100% !important;
    justify-content: space-between !important;
  }

  #search_filters_wrapper {
    display: none !important;
    position: fixed !important;
    inset: 0 !important;
    z-index: 1050 !important;
    background: var(--al-surface) !important;
    overflow-y: auto !important;
    padding: 24px 20px !important;
  }

  #search_filters_wrapper.shown {
    display: block !important;
  }
}

/* =============================================================================
   42. LAYOUT STABILITY — safe rules only (no Bootstrap grid breakage)
   ============================================================================= */

/* Scrollbar always present = no width shift on page transitions */
html {
  overflow-y: scroll;
}

/* Prevent body horizontal scroll only */
body {
  overflow-x: hidden;
}

/* Ensure #main and #wrapper are always visible (JS fade-in removed) */
#main,
#wrapper {
  opacity: 1 !important;
  visibility: visible !important;
}

/* Kill any leftover page-entering animations */
body.al-page-entering #main,
body.al-page-entering #wrapper,
body.al-page-entering .page-home {
  animation: none !important;
  transform: none !important;
  opacity: 1 !important;
}

/* ── 42.1 Layout-full-width content fix ──
   In Dorado's layout-both-columns.tpl, .teck-main-content has .row (display:flex).
   In layout-full-width.tpl, #content-wrapper has NO column classes, so in a flex
   context it collapses to content width. Dorado only fixes this for #category and
   #best-sales pages. This rule fixes ALL full-width pages (cart, account, etc.). */
body.layout-full-width .teck-main-content {
  width: 100% !important;
  max-width: 100% !important;
}
body.layout-full-width #content-wrapper {
  width: 100% !important;
  max-width: 100% !important;
  flex: 1 1 100% !important;
}

/* =============================================================================
   43. CART PAGE — Full Luxury Rebuild
   ============================================================================= */

/* ── 43.1 Page wrapper ── */
.allani-cart-page {
  padding: 24px 0 48px !important;
}

/* ── 43.2 Cart title ── */
.allani-cart-title,
.allani-cart-page .h1-newstyle {
  font-family: 'Rubik', sans-serif !important;
  font-size: clamp(1.4rem, 3vw, 2rem) !important;
  font-weight: 700 !important;
  color: var(--al-charcoal-deep) !important;
  margin-bottom: 6px !important;
  padding: 0 !important;
  line-height: 1.2 !important;
}

.allani-cart-title span,
.allani-cart-page .h1-newstyle span {
  display: inline-block !important;
  border-bottom: 3px solid var(--al-gold) !important;
  padding-bottom: 4px !important;
}

/* ── 43.3 "X produits dans votre panier" count line ── */
.allani-cart-page .cart-title h2,
.allani-cart-page .cart-title .h2 {
  font-size: 0.95rem !important;
  font-weight: 400 !important;
  color: var(--al-muted) !important;
  margin: 0 0 20px !important;
  padding: 0 !important;
  line-height: 1.5 !important;
  border: none !important;
  background: none !important;
}

.allani-cart-page .cart-title strong {
  color: var(--al-charcoal-deep) !important;
  font-weight: 700 !important;
}

/* ── 43.4 Cart grid layout ── */
.allani-cart-grid {
  display: flex !important;
  gap: 24px !important;
  align-items: flex-start !important;
  flex-wrap: wrap !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.allani-cart-grid > .cart-title {
  flex: 0 0 100% !important;
  max-width: 100% !important;
  width: 100% !important;
}

.allani-cart-body {
  flex: 1 1 0% !important;
  min-width: 0 !important;
  max-width: none !important;
}

.allani-cart-sidebar {
  width: 340px !important;
  max-width: 340px !important;
  flex: 0 0 340px !important;
}

/* ── 43.5 Cart items container ── */
.allani-cart-page .cart-container,
.allani-cart-page .card.cart-container {
  background: var(--al-surface) !important;
  border: 1px solid var(--al-border-light) !important;
  border-radius: var(--al-radius-lg) !important;
  box-shadow: var(--al-shadow-xs) !important;
  overflow: hidden !important;
  padding: 0 !important;
}

/* ── 43.6 Individual cart item row ── */
.allani-cart-page .cart-item {
  display: flex !important;
  gap: 16px !important;
  padding: 20px !important;
  border-bottom: 1px solid var(--al-border-light) !important;
  align-items: flex-start !important;
  transition: background 0.18s !important;
}

.allani-cart-page .cart-item:last-child {
  border-bottom: none !important;
}

.allani-cart-page .cart-item:hover {
  background: var(--al-surface-warm) !important;
}

/* ── 43.7 Cart item image ── */
.allani-cart-page .cart-item .media-body img,
.allani-cart-page .product-image img,
.allani-cart-page .cart-item img {
  border-radius: var(--al-radius-sm) !important;
  object-fit: cover !important;
  border: 1px solid var(--al-border-light) !important;
  width: 90px !important;
  height: 90px !important;
  flex-shrink: 0 !important;
}

/* ── 43.8 Cart item name ── */
.allani-cart-page .product-name,
.allani-cart-page .cart-item .product-title a {
  font-family: 'Rubik', sans-serif !important;
  font-size: 0.95rem !important;
  font-weight: 600 !important;
  color: var(--al-charcoal-deep) !important;
  text-decoration: none !important;
  line-height: 1.35 !important;
  transition: color 0.18s !important;
}

.allani-cart-page .product-name:hover,
.allani-cart-page .cart-item .product-title a:hover {
  color: var(--al-gold-dark) !important;
}

/* ── 43.9 Cart item attributes ── */
.allani-cart-page .product-attribute,
.allani-cart-page .unit-price-cart {
  font-size: 0.8rem !important;
  color: var(--al-muted) !important;
  margin-top: 3px !important;
}

/* ── 43.10 Quantity input ── */
.allani-cart-page .input-group.bootstrap-touchspin,
.allani-cart-page .js-cart-line-product-quantity {
  border: 1px solid var(--al-border) !important;
  border-radius: var(--al-radius-sm) !important;
  overflow: hidden !important;
  display: inline-flex !important;
  align-items: center !important;
  background: var(--al-surface) !important;
}

.allani-cart-page .input-group-btn-vertical button,
.allani-cart-page .bootstrap-touchspin-up,
.allani-cart-page .bootstrap-touchspin-down {
  background: var(--al-surface-soft) !important;
  border: none !important;
  border-radius: 0 !important;
  color: var(--al-charcoal) !important;
  width: 32px !important;
  height: 32px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  font-size: 1rem !important;
  transition: background 0.18s, color 0.18s !important;
}

.allani-cart-page .bootstrap-touchspin-up:hover,
.allani-cart-page .bootstrap-touchspin-down:hover {
  background: var(--al-gold) !important;
  color: #fff !important;
}

.allani-cart-page .js-cart-line-product-quantity,
.allani-cart-page input[name="product-quantity-spin"] {
  border: none !important;
  border-left: 1px solid var(--al-border-light) !important;
  border-right: 1px solid var(--al-border-light) !important;
  border-radius: 0 !important;
  text-align: center !important;
  width: 44px !important;
  height: 32px !important;
  font-weight: 600 !important;
  font-size: 0.9rem !important;
  color: var(--al-charcoal-deep) !important;
  background: var(--al-surface) !important;
  box-shadow: none !important;
  outline: none !important;
}

/* ── 43.11 Cart item price ── */
.allani-cart-page .product-price,
.allani-cart-page .price {
  font-size: 1rem !important;
  font-weight: 700 !important;
  color: var(--al-charcoal-deep) !important;
  letter-spacing: -0.01em !important;
  white-space: nowrap !important;
}

/* ── 43.12 Remove item button ── */
.allani-cart-page .remove-from-cart,
.allani-cart-page .cart-item .remove {
  color: var(--al-muted) !important;
  background: transparent !important;
  border: 1px solid transparent !important;
  border-radius: var(--al-radius-sm) !important;
  padding: 5px 8px !important;
  cursor: pointer !important;
  font-size: 0.78rem !important;
  transition: color 0.18s, border-color 0.18s, background 0.18s !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
}

.allani-cart-page .remove-from-cart:hover,
.allani-cart-page .cart-item .remove:hover {
  color: var(--al-danger) !important;
  border-color: rgba(198,40,40,.3) !important;
  background: rgba(198,40,40,.04) !important;
}

/* ── 43.13 Cart summary sidebar card ── */
.allani-cart-page .cart-summary,
.allani-cart-page .card.cart-summary {
  background: var(--al-surface) !important;
  border: 1px solid var(--al-border-light) !important;
  border-radius: var(--al-radius-lg) !important;
  box-shadow: var(--al-shadow-sm) !important;
  overflow: hidden !important;
  padding: 0 !important;
  position: sticky !important;
  top: 80px !important;
}

/* Summary header (if any) */
.allani-cart-page .cart-summary-line {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  padding: 10px 20px !important;
  border-bottom: 1px solid var(--al-border-light) !important;
  font-size: 0.9rem !important;
  color: var(--al-charcoal) !important;
}

.allani-cart-page .cart-summary-line:last-child {
  border-bottom: none !important;
}

.allani-cart-page .cart-summary-line.cart-total {
  background: var(--al-gold-pale) !important;
  border-top: 2px solid var(--al-gold) !important;
  padding: 14px 20px !important;
  font-weight: 700 !important;
  font-size: 1.05rem !important;
  color: var(--al-charcoal-deep) !important;
}

.allani-cart-page .cart-summary-line .label,
.allani-cart-page .cart-summary-line span:first-child {
  color: var(--al-muted) !important;
  font-weight: 400 !important;
  font-size: 0.88rem !important;
}

.allani-cart-page .cart-summary-line.cart-total .label,
.allani-cart-page .cart-summary-line.cart-total span:first-child {
  color: var(--al-charcoal-deep) !important;
  font-weight: 700 !important;
  font-size: 1rem !important;
}

/* ── 43.14 Checkout button ── */
.allani-cart-page .cart-detailed-actions,
.allani-cart-page #cart-detailed-actions {
  padding: 16px 20px !important;
  background: var(--al-surface-warm) !important;
  border-top: 1px solid var(--al-border-light) !important;
}

.allani-cart-page .cart-detailed-actions .btn-primary,
.allani-cart-page a.btn-primary {
  display: block !important;
  width: 100% !important;
  background: var(--al-charcoal-deep) !important;
  border: 2px solid var(--al-gold) !important;
  color: #fff !important;
  font-family: 'Rubik', sans-serif !important;
  font-size: 1rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
  border-radius: var(--al-radius-sm) !important;
  padding: 14px 24px !important;
  text-align: center !important;
  transition: background 0.25s, transform 0.2s, box-shadow 0.25s !important;
  text-decoration: none !important;
}

.allani-cart-page .cart-detailed-actions .btn-primary:hover,
.allani-cart-page a.btn-primary:hover {
  background: var(--al-gold) !important;
  color: var(--al-charcoal-deep) !important;
  transform: translateY(-2px) !important;
  box-shadow: var(--al-shadow-gold) !important;
}

/* ── 43.15 Continue shopping link ── */
.allani-continue-shopping {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  color: var(--al-muted) !important;
  font-size: 0.88rem !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  margin-top: 14px !important;
  padding: 8px 14px !important;
  border: 1px solid var(--al-border) !important;
  border-radius: var(--al-radius-sm) !important;
  transition: color 0.2s, border-color 0.2s, background 0.2s !important;
}

.allani-continue-shopping:hover {
  color: var(--al-charcoal-deep) !important;
  border-color: var(--al-gold) !important;
  background: var(--al-gold-pale) !important;
}

/* ── 43.16 Cart separator ── */
.allani-cart-page hr.separator {
  border: none !important;
  border-top: 1px solid var(--al-border-light) !important;
  margin: 0 !important;
}

/* ── 43.17 Empty cart state ── */
.allani-cart-page .no-product-incart .allani-cart-body {
  text-align: center !important;
  padding: 60px 20px !important;
}

/* ── 43.18 Cart mobile ── */
@media (max-width: 991px) {
  .allani-cart-sidebar {
    width: 100% !important;
  }

  .allani-cart-grid {
    flex-direction: column !important;
  }
}

/* =============================================================================
   44. ACCOUNT / MY ACCOUNT PAGE — Luxury
   ============================================================================= */

/* ── 44.1 Account page wrapper ── */
#authentication,
.page-customer-account,
.page-my-account {
  padding: 24px 0 48px !important;
}

/* ── 44.2 Account nav tiles ── */
.page-my-account .links {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)) !important;
  gap: 16px !important;
  list-style: none !important;
  padding: 0 !important;
  margin: 24px 0 !important;
}

.page-my-account .links a {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  background: var(--al-surface) !important;
  border: 1px solid var(--al-border-light) !important;
  border-radius: var(--al-radius) !important;
  padding: 24px 16px !important;
  text-decoration: none !important;
  text-align: center !important;
  color: var(--al-charcoal) !important;
  font-size: 0.88rem !important;
  font-weight: 500 !important;
  transition: border-color 0.22s, box-shadow 0.22s, transform 0.22s, background 0.22s !important;
  box-shadow: var(--al-shadow-xs) !important;
}

.page-my-account .links a:hover {
  border-color: var(--al-gold) !important;
  box-shadow: var(--al-shadow-gold) !important;
  transform: translateY(-3px) !important;
  background: var(--al-gold-pale) !important;
  color: var(--al-gold-dark) !important;
}

.page-my-account .links i,
.page-my-account .links .material-icons {
  font-size: 1.8rem !important;
  color: var(--al-gold) !important;
}

.page-my-account .links span {
  color: inherit !important;
  font: inherit !important;
}

/* ── 44.3 Login / Register forms ── */
#authentication .login-form,
#authentication .register-form {
  background: var(--al-surface) !important;
  border: 1px solid var(--al-border-light) !important;
  border-radius: var(--al-radius-lg) !important;
  padding: 32px !important;
  box-shadow: var(--al-shadow-sm) !important;
}

#authentication .login-form-title,
#authentication .register-form-title,
#authentication .h2 {
  font-family: 'Rubik', sans-serif !important;
  font-size: 1.25rem !important;
  font-weight: 700 !important;
  color: var(--al-charcoal-deep) !important;
  margin-bottom: 20px !important;
  padding-bottom: 12px !important;
  border-bottom: 2px solid var(--al-gold) !important;
}

/* ── 44.4 Auth input fields ── */
#authentication input[type="text"],
#authentication input[type="email"],
#authentication input[type="password"],
.page-customer-account input[type="text"],
.page-customer-account input[type="email"],
.page-customer-account input[type="password"],
.page-customer-account input[type="date"],
.page-customer-account select,
.page-customer-account textarea {
  border: 1px solid var(--al-border) !important;
  border-radius: var(--al-radius-sm) !important;
  padding: 10px 14px !important;
  font-family: 'Rubik', sans-serif !important;
  font-size: 0.92rem !important;
  color: var(--al-charcoal) !important;
  background: var(--al-surface) !important;
  width: 100% !important;
  transition: border-color 0.22s, box-shadow 0.22s !important;
}

#authentication input:focus,
.page-customer-account input:focus,
.page-customer-account select:focus,
.page-customer-account textarea:focus {
  border-color: var(--al-gold) !important;
  box-shadow: 0 0 0 3px rgba(201,168,76,.12) !important;
  outline: none !important;
}

/* ── 44.5 Auth form labels ── */
#authentication label,
.page-customer-account label {
  font-size: 0.82rem !important;
  font-weight: 600 !important;
  color: var(--al-charcoal) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
  margin-bottom: 5px !important;
  display: block !important;
}

/* ── 44.6 Auth submit buttons ── */
#authentication .btn-primary,
.page-customer-account .btn-primary {
  background: var(--al-charcoal-deep) !important;
  border: 2px solid var(--al-gold) !important;
  color: #fff !important;
  font-family: 'Rubik', sans-serif !important;
  font-weight: 600 !important;
  font-size: 0.92rem !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
  border-radius: var(--al-radius-sm) !important;
  padding: 12px 28px !important;
  transition: background 0.22s, transform 0.18s, box-shadow 0.22s !important;
  cursor: pointer !important;
}

#authentication .btn-primary:hover,
.page-customer-account .btn-primary:hover {
  background: var(--al-gold) !important;
  color: var(--al-charcoal-deep) !important;
  transform: translateY(-1px) !important;
  box-shadow: var(--al-shadow-gold) !important;
}

/* ── 44.7 Forgot password link ── */
#authentication .forgot-password a {
  color: var(--al-gold-dark) !important;
  font-size: 0.85rem !important;
  text-decoration: underline !important;
}

/* ── 44.8 Form sections (orders, addresses, etc.) ── */
.page-customer-account .page-header h1,
.page-customer-account .page-header .h1 {
  font-size: clamp(1.2rem, 2.5vw, 1.7rem) !important;
  font-weight: 700 !important;
  color: var(--al-charcoal-deep) !important;
  border-bottom: 3px solid var(--al-gold) !important;
  padding-bottom: 10px !important;
  margin-bottom: 24px !important;
}

/* ── 44.9 Orders table ── */
.page-customer-account table,
.allani-cart-page table {
  width: 100% !important;
  border-collapse: collapse !important;
  background: var(--al-surface) !important;
  border-radius: var(--al-radius) !important;
  overflow: hidden !important;
  box-shadow: var(--al-shadow-xs) !important;
}

.page-customer-account thead th,
.allani-cart-page thead th {
  background: var(--al-charcoal-deep) !important;
  color: #fff !important;
  font-size: 0.78rem !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  padding: 12px 16px !important;
  text-align: left !important;
  white-space: nowrap !important;
}

.page-customer-account tbody tr,
.allani-cart-page tbody tr {
  border-bottom: 1px solid var(--al-border-light) !important;
  transition: background 0.15s !important;
}

.page-customer-account tbody tr:hover,
.allani-cart-page tbody tr:hover {
  background: var(--al-surface-warm) !important;
}

.page-customer-account tbody td,
.allani-cart-page tbody td {
  padding: 12px 16px !important;
  font-size: 0.9rem !important;
  color: var(--al-charcoal) !important;
  vertical-align: middle !important;
}

/* ── 44.10 Address cards ── */
.page-customer-account .address {
  background: var(--al-surface) !important;
  border: 1px solid var(--al-border-light) !important;
  border-radius: var(--al-radius) !important;
  padding: 20px !important;
  box-shadow: var(--al-shadow-xs) !important;
  transition: border-color 0.22s, box-shadow 0.22s !important;
}

.page-customer-account .address:hover {
  border-color: var(--al-gold-light) !important;
  box-shadow: var(--al-shadow-gold) !important;
}

.page-customer-account .address-alias {
  font-weight: 700 !important;
  font-size: 0.9rem !important;
  color: var(--al-charcoal-deep) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  border-bottom: 1px solid var(--al-border-light) !important;
  padding-bottom: 8px !important;
  margin-bottom: 10px !important;
}

/* =============================================================================
   45. GENERAL PAGE HEADER — applies to every inner page h1
   ============================================================================= */

.page-header h1,
.page-header .h1,
.page-not-found h1 {
  font-family: 'Rubik', sans-serif !important;
  font-size: clamp(1.3rem, 3vw, 2rem) !important;
  font-weight: 700 !important;
  color: var(--al-charcoal-deep) !important;
  letter-spacing: -0.01em !important;
  line-height: 1.2 !important;
}

/* =============================================================================
   46. GLOBAL — disable ALL box-shadow fighting between Dorado & allaninewui
   ============================================================================= */

/* Normalize Dorado's card overrides */
.card {
  background: var(--al-surface) !important;
  border: 1px solid var(--al-border-light) !important;
  border-radius: var(--al-radius) !important;
  box-shadow: var(--al-shadow-xs) !important;
}

.card-block {
  padding: 20px !important;
}

/* =============================================================================
   47. SCROLLBAR STYLING (Chrome/Edge) — luxury gold thumb
   ============================================================================= */

::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

::-webkit-scrollbar-track {
  background: var(--al-surface-soft);
}

::-webkit-scrollbar-thumb {
  background: var(--al-border);
  border-radius: 4px;
  transition: background 0.2s;
}

::-webkit-scrollbar-thumb:hover {
  background: var(--al-gold);
}

/* =============================================================================
   48. SELECTION HIGHLIGHT
   ============================================================================= */

::selection {
  background: rgba(201, 168, 76, 0.22);
  color: var(--al-charcoal-deep);
}

/* =============================================================================
   49. FOCUS OUTLINES — accessible gold ring everywhere
   ============================================================================= */

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 2px solid var(--al-gold) !important;
  outline-offset: 2px !important;
  border-radius: 4px !important;
}