/* ========== SHINY MENU - Base Styles (Inline from shiny-menu.css) ========== */

/* Header at top of page, above all content */
.header-nav {
  background: linear-gradient(135deg, rgba(0,0,0,0.95) 0%, rgba(20,10,30,0.9) 100%) !important;
  border-bottom: 1px solid rgba(255,255,255,0.1);
  position: relative;
  z-index: 9999;
  width: 100%;
}

/* Unified menu container - all items in one row */
.unified-menu-container {
  display: flex;
  display: -webkit-flex;
  align-items: center;
  -webkit-align-items: center;
  justify-content: center;
  -webkit-justify-content: center;
  gap: 6px;
  flex-wrap: nowrap;
  padding: 8px 0;
  position: relative;
}

/* Logo link styling */
.logo-link {
  flex-shrink: 0;
  margin-right: 15px;
  display: flex;
  align-items: center;
}

.logo-link img {
  display: block;
  height: 50px;
  width: auto;
}

/* ========== HAMBURGER MENU ICON ========== */
.mobile-menu-toggle {
  display: none;
  flex-direction: column;
  justify-content: space-around;
  width: 30px;
  height: 24px;
  cursor: pointer;
  padding: 4px;
  flex-shrink: 0;
  margin-right: 10px;
  z-index: 10000;
}

.mobile-menu-toggle span {
  width: 100%;
  height: 3px;
  background: linear-gradient(135deg, #FF8C00, #9b5cf6);
  border-radius: 2px;
  transition: all 0.3s ease;
  transform-origin: center;
}

/* Hamburger animation when active */
.mobile-menu-toggle.active span:nth-child(1) {
  transform: translateY(10px) rotate(45deg);
}

.mobile-menu-toggle.active span:nth-child(2) {
  opacity: 0;
  transform: translateX(-20px);
}

.mobile-menu-toggle.active span:nth-child(3) {
  transform: translateY(-8px) rotate(-45deg);
}

/* Mobile menu items container */
.mobile-menu-items {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

/* ========== DESKTOP - Menu always visible ========== */
@media (min-width: 769px) {
  .mobile-menu-toggle {
    display: none !important;
  }
  
  .mobile-menu-items {
    display: flex !important;
    opacity: 1 !important;
    visibility: visible !important;
    max-height: none !important;
  }
}

/* ========== MOBILE - Expandable menu ========== */
@media (max-width: 768px) {
  .unified-menu-container {
    flex-wrap: nowrap;
    justify-content: flex-start;
    padding: 10px 0;
  }
  
  .mobile-menu-toggle {
    display: flex;
  }
  
  .logo-link {
    margin-right: auto;
  }
  
  .logo-link img {
    height: 35px;
  }
  
  /* Menu items - collapsed by default */
  .mobile-menu-items {
    display: flex;
    flex-direction: column;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: transparent !important;
    flex-wrap: wrap;
    gap: 8px;
    padding: 15px;
    max-height: 0;
    opacity: 0;
    visibility: hidden;
    overflow: hidden;
    align-items: stretch;
  }
  
  /* Menu expanded */
  .mobile-menu-items.expanded {
    max-height: 600px;
    opacity: 1;
    visibility: visible;
  }
  
  /* Full-width buttons on mobile */
  .shiny-menu-btn {
    width: 100%;
    justify-content: center;
    padding: 12px 16px;
    font-size: 16px;
    text-align: center;
  }
  
  /* Theme selector full width on mobile */
  .theme-selector-inline {
    width: 100%;
    justify-content: center;
    padding: 10px 16px;
  }
  
  .theme-selector-inline select {
    flex: 1;
    max-width: 150px;
  }
}

/* Shiny button base style */
.shiny-menu-btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 8px 16px;
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: #fff;
  background: linear-gradient(135deg, rgba(255,255,255,0.15) 0%, rgba(255,255,255,0.05) 50%, rgba(255,255,255,0.15) 100%);
  border: 1px solid rgba(255,255,255,0.2);
  border-radius: 6px;
  cursor: pointer;
  text-decoration: none;
  overflow: hidden;
  transition: all 0.3s ease;
  box-shadow: 0 4px 15px rgba(0,0,0,0.3), inset 0 1px 0 rgba(255,255,255,0.2), inset 0 -1px 0 rgba(0,0,0,0.2);
  flex-shrink: 0;
  white-space: nowrap;
}

/* Shiny glimmer effect on hover */
.shiny-menu-btn::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.4), transparent);
  transition: left 0.6s ease;
}

.shiny-menu-btn:hover::before {
  left: 100%;
}

/* Hover effects */
.shiny-menu-btn:hover {
  background: linear-gradient(135deg, rgba(255,255,255,0.25) 0%, rgba(255,255,255,0.1) 50%, rgba(255,255,255,0.25) 100%);
  border-color: rgba(255,255,255,0.4);
  box-shadow: 0 6px 25px rgba(0,0,0,0.4), 0 0 20px rgba(155,92,246,0.3), inset 0 1px 0 rgba(255,255,255,0.3);
  transform: translateY(-2px);
}

/* Active state */
.shiny-menu-btn.active {
  background: linear-gradient(135deg, rgba(155,92,246,0.6) 0%, rgba(251,146,60,0.5) 100%);
  border-color: rgba(155,92,246,0.6);
  box-shadow: 0 4px 20px rgba(155,92,246,0.4), inset 0 1px 0 rgba(255,255,255,0.3);
}

/* Theme selector inline - COMPACT width fix */
.theme-selector-inline {
  display: inline-flex !important;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  background: linear-gradient(135deg, rgba(255,255,255,0.12) 0%, rgba(255,255,255,0.05) 100%);
  border: 1px solid rgba(255,255,255,0.15);
  border-radius: 6px;
  flex-shrink: 0;
  width: auto !important;
  max-width: fit-content !important;
}

.theme-selector-inline select {
  background: rgba(0,0,0,0.5);
  color: #fff;
  border: 1px solid rgba(255,255,255,0.2);
  border-radius: 4px;
  padding: 4px 8px;
  font-size: 11px;
  cursor: pointer;
  transition: all 0.3s ease;
  width: auto !important;
  min-width: 80px !important;
  max-width: 120px !important;
}

.theme-selector-inline select:hover {
  border-color: rgba(155,92,246,0.5);
  box-shadow: 0 0 10px rgba(155,92,246,0.3);
}

.theme-indicator-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  border: 2px solid rgba(255,255,255,0.3);
  transition: all 0.3s ease;
  flex-shrink: 0;
}

/* Hide original elements */
.header-unified-row,
#bao-theme-floating {
  display: none !important;
}

/* Ensure content starts below header */
#content, #wrapper, .page-content {
  position: relative;
  z-index: 1;
}

/* Theme-specific overrides */
.theme-orange .shiny-menu-btn:hover {
  box-shadow: 0 6px 25px rgba(255,140,0,0.4), 0 0 20px rgba(255,140,0,0.3), inset 0 1px 0 rgba(255,255,255,0.3);
}

.theme-purple .shiny-menu-btn:hover {
  box-shadow: 0 6px 25px rgba(155,92,246,0.4), 0 0 20px rgba(155,92,246,0.3), inset 0 1px 0 rgba(255,255,255,0.3);
}

/* ========== END SHINY MENU BASE STYLES ========== */

/**
 * Birthday Banner Styles - Homepage Only
 * This file is only loaded on the homepage via template override
 */

.birthday-banner-wrapper {
    width: 100%;
}

.birthday-banner {
    text-align: center;
    padding: 15px 20px;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    margin-bottom: 8px;
    border-radius: 10px;
}

.birthday-banner-img {
    max-width: 100%;
    height: auto;
    max-height: 600px;
    border-radius: 15px;
    box-shadow: 0 20px 60px rgba(0,0,0,0.3);
    display: block;
    margin: 0 auto;
}

/* Mobile responsive */
@media (max-width: 768px) {
    .birthday-banner {
        padding: 12px 10px;
        margin-bottom: 6px;
    }

    .birthday-banner-img {
        max-height: 400px;
    }
}

/* Black body background - homepage only */
body {
    background-color: #000000 !important;
    background-image: none !important;
}

/* Ensure content areas are readable */
#content, #wrapper, .page-content, .container {
    background-color: transparent !important;
}

/* ========== CLASSIC THEME STYLING (White background, black text) ========== */
[data-bao-theme="classic"] body {
    background-color: #ffffff !important;
    color: #000000 !important;
}

[data-bao-theme="classic"] #header,
[data-bao-theme="classic"] .header-nav {
    background: rgba(255, 255, 255, 0.95) !important;
    border-bottom: 1px solid #e0e0e0 !important;
}

[data-bao-theme="classic"] .shiny-menu-btn {
    color: #000 !important;
    background: linear-gradient(135deg, rgba(0, 0, 0, 0.05) 0%, rgba(0, 0, 0, 0.02) 50%, rgba(0, 0, 0, 0.05) 100%) !important;
    border: 1px solid #000000 !important;
}

[data-bao-theme="classic"] .shiny-menu-btn:hover {
    background: linear-gradient(135deg, rgba(0, 0, 0, 0.1) 0%, rgba(0, 0, 0, 0.05) 50%, rgba(0, 0, 0, 0.1) 100%) !important;
    border-color: #000 !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2) !important;
    color: #000 !important;
}

[data-bao-theme="classic"] a {
    color: #000000 !important;
}

[data-bao-theme="classic"] .modern-footer {
    background: #ffffff !important;
    border-top: 1px solid #e0e0e0 !important;
}

[data-bao-theme="classic"] .modern-footer h3,
[data-bao-theme="classic"] .modern-footer .footer-links-wrapper a {
    color: #000000 !important;
}

[data-bao-theme="classic"] .modern-footer .footer-bottom .copyright {
    color: #666666 !important;
}

[data-bao-theme="classic"] #content,
[data-bao-theme="classic"] #wrapper,
[data-bao-theme="classic"] .page-content {
    background-color: #ffffff !important;
}

[data-bao-theme="classic"] h1,
[data-bao-theme="classic"] h2,
[data-bao-theme="classic"] h3,
[data-bao-theme="classic"] h4,
[data-bao-theme="classic"] h5,
[data-bao-theme="classic"] h6 {
    color: #000000 !important;
}

[data-bao-theme="classic"] p,
[data-bao-theme="classic"] span,
[data-bao-theme="classic"] div {
    color: #000000 !important;
}

[data-bao-theme="classic"] .birthday-banner {
    background: #ffffff !important;
}

/* Keep menu buttons black in classic theme */
[data-bao-theme="classic"] .shiny-menu-btn.sign-in {
    background: #000000 !important;
    color: #ffffff !important;
}

[data-bao-theme="classic"] .shiny-menu-btn.sign-in:hover {
    background: #333333 !important;
}

/* ========== CLASSIC THEME - ABOUT US PAGE (All white) ========== */
[data-bao-theme=classic] .page-cms-35,
[data-bao-theme=classic] .cms-id-35 {
    background-color: #ffffff !important;
}

[data-bao-theme=classic] .page-cms-35 body,
[data-bao-theme=classic] .cms-id-35 body {
    background-color: #ffffff !important;
    color: #000000 !important;
}

[data-bao-theme=classic] .page-cms-35 #content,
[data-bao-theme=classic] .cms-id-35 #content,
[data-bao-theme=classic] .page-cms-35 .page-content,
[data-bao-theme=classic] .cms-id-35 .page-content {
    background-color: #ffffff !important;
}

[data-bao-theme=classic] .page-cms-35 *,
[data-bao-theme=classic] .cms-id-35 * {
    background-color: #ffffff !important;
}

[data-bao-theme=classic] .page-cms-35 p,
[data-bao-theme=classic] .page-cms-35 h1,
[data-bao-theme=classic] .page-cms-35 h2,
[data-bao-theme=classic] .page-cms-35 h3,
[data-bao-theme=classic] .page-cms-35 h4,
[data-bao-theme=classic] .page-cms-35 span,
[data-bao-theme=classic] .page-cms-35 div,
[data-bao-theme=classic] .page-cms-35 a,
[data-bao-theme=classic] .cms-id-35 p,
[data-bao-theme=classic] .cms-id-35 h1,
[data-bao-theme=classic] .cms-id-35 h2,
[data-bao-theme=classic] .cms-id-35 h3,
[data-bao-theme=classic] .cms-id-35 h4,
[data-bao-theme=classic] .cms-id-35 span,
[data-bao-theme=classic] .cms-id-35 div,
[data-bao-theme=classic] .cms-id-35 a {
    color: #000000 !important;
    background-color: transparent !important;
}

[data-bao-theme=classic] .page-cms-35 img,
[data-bao-theme=classic] .cms-id-35 img {
    background-color: transparent !important;
}

/* ========== CLASSIC THEME - FOOTER GLOBAL (White everywhere) ========== */
[data-bao-theme=classic] footer,
[data-bao-theme=classic] .modern-footer,
[data-bao-theme=classic] #footer,
[data-bao-theme=classic] .page-footer,
[data-bao-theme=classic] .footer-container,
[data-bao-theme=classic] .footer-content {
    background: #ffffff !important;
    background-color: #ffffff !important;
}

[data-bao-theme=classic] footer *,
[data-bao-theme=classic] .modern-footer *,
[data-bao-theme=classic] #footer *,
[data-bao-theme=classic] .page-footer *,
[data-bao-theme=classic] .footer-container *,
[data-bao-theme=classic] .footer-content * {
    background-color: transparent !important;
}

[data-bao-theme=classic] footer h3,
[data-bao-theme=classic] footer h4,
[data-bao-theme=classic] footer p,
[data-bao-theme=classic] footer a,
[data-bao-theme=classic] footer span,
[data-bao-theme=classic] footer div,
[data-bao-theme=classic] .modern-footer h3,
[data-bao-theme=classic] .modern-footer h4,
[data-bao-theme=classic] .modern-footer p,
[data-bao-theme=classic] .modern-footer a,
[data-bao-theme=classic] .modern-footer span,
[data-bao-theme=classic] .modern-footer div {
    color: #000000 !important;
}

[data-bao-theme=classic] footer input,
[data-bao-theme=classic] .modern-footer input {
    background: rgba(0, 0, 0, 0.05) !important;
    color: #000000 !important;
    border: 1px solid #000000 !important;
}

[data-bao-theme=classic] footer input::placeholder,
[data-bao-theme=classic] .modern-footer input::placeholder {
    color: #666666 !important;
}

[data-bao-theme=classic] footer .btn-primary,
[data-bao-theme=classic] .modern-footer .btn-primary {
    background: #000000 !important;
    color: #ffffff !important;
}

/* ========== NEWSLETTER EMAIL INPUT - WIDER ========== */
.block_newsletter input[type=email],
.block_newsletter .form-control,
#blockEmailSubscription_displayFooterBefore input[type=email],
#blockEmailSubscription_displayFooterBefore .form-control {
    width: 100% !important;
    min-width: 300px !important;
    max-width: 100% !important;
}

/* Make newsletter input wider on desktop */
@media (min-width: 992px) {
    .block_newsletter input[type=email],
    .block_newsletter .form-control,
    #blockEmailSubscription_displayFooterBefore input[type=email],
    #blockEmailSubscription_displayFooterBefore .form-control {
        min-width: 400px !important;
        width: 100% !important;
    }
}

/* ========== LEFT COLUMN (Artists/Brands) - Fix overflow issue ========== */
#left-column,
#search_filters_brands,
.facet,
#search_filters_suppliers {
    min-height: auto !important;
    height: auto !important;
    overflow: visible !important;
}

/* Ensure facet content is properly contained */
.facet {
    margin-bottom: 20px !important;
    background: rgba(0, 0, 0, 0.3) !important;
    border-radius: 8px !important;
    padding: 15px !important;
}

.facet > div {
    overflow: visible !important;
    height: auto !important;
}

/* Fix artist list spacing */
.facet ul {
    margin: 0 !important;
    padding: 10px 0 0 0 !important;
    overflow: visible !important;
    height: auto !important;
}

.facet ul li {
    padding: 8px 10px !important;
    overflow: visible !important;
    height: auto !important;
    line-height: 1.4 !important;
}

.facet ul li a {
    display: block !important;
    overflow: visible !important;
    white-space: normal !important;
    word-wrap: break-word !important;
}

/* Classic theme left column styling */
[data-bao-theme=classic] #left-column,
[data-bao-theme=classic] .facet {
    background: #f5f5f5 !important;
    border: 1px solid #e0e0e0 !important;
}

[data-bao-theme=classic] .facet ul li a {
    color: #000000 !important;
}

/* ========== LEFT COLUMN - Black background for Orange/Purple/Green themes ========== */
[data-bao-theme=orange] #left-column,
[data-bao-theme=orange] #search_filters_brands,
[data-bao-theme=orange] #search_filters_suppliers,
[data-bao-theme=orange] .facet,
[data-bao-theme=purple] #left-column,
[data-bao-theme=purple] #search_filters_brands,
[data-bao-theme=purple] #search_filters_suppliers,
[data-bao-theme=purple] .facet,
[data-bao-theme=green] #left-column,
[data-bao-theme=green] #search_filters_brands,
[data-bao-theme=green] #search_filters_suppliers,
[data-bao-theme=green] .facet {
    background: #000000 !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

[data-bao-theme=orange] .facet a,
[data-bao-theme=purple] .facet a,
[data-bao-theme=green] .facet a {
    color: #ffffff !important;
}

[data-bao-theme=orange] .facet ul li:hover,
[data-bao-theme=purple] .facet ul li:hover,
[data-bao-theme=green] .facet ul li:hover {
    background: rgba(255, 255, 255, 0.05) !important;
}

/* ========== HIDE UPCOMING EVENTS AND PAST EVENTS TEXT ========== */
.page-cms-37 h2.ce-display-large,
.page-cms-37 .elementor-heading-title:contains('UPCOMING EVENTS'),
.page-cms-37 .elementor-heading-title:contains('Past Events'),
.page-cms-37 .elementor-widget-container h4 {
    display: none !important;
}

/* More specific targeting */
.elementor-widget-container .ce-display-large {
    font-size: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
}

.elementor-widget-container .ce-display-large br {
    display: none !important;
}

.elementor-widget-container .ce-display-large iframe {
    display: block !important;
    margin-top: 0 !important;
}

/* ========== CLASSIC THEME - SUBSCRIBE BUTTON BLACK ========== */
[data-bao-theme=classic] input[name=submitNewsletter],
[data-bao-theme=classic] .block_newsletter .btn-primary,
[data-bao-theme=classic] #blockEmailSubscription_displayFooterBefore .btn-primary {
    background: #000000 !important;
    color: #ffffff !important;
    border: 1px solid #000000 !important;
}

[data-bao-theme=classic] input[name=submitNewsletter]:hover,
[data-bao-theme=classic] .block_newsletter .btn-primary:hover,
[data-bao-theme=classic] #blockEmailSubscription_displayFooterBefore .btn-primary:hover {
    background: #333333 !important;
    border-color: #333333 !important;
}

/* ========== HIDE UPCOMING/PAST EVENTS - Working CSS ========== */
.page-cms-37 .ce-display-large {
    font-size: 0 !important;
    line-height: 0 !important;
}

.page-cms-37 .ce-display-large br {
    display: none !important;
}

.page-cms-37 .ce-display-large iframe {
    display: block !important;
    margin: 0 !important;
}

.page-cms-37 .elementor-widget-container h4.elementor-heading-title {
    display: none !important;
}

.page-cms-37 .elementor-ribbon-inner {
    display: none !important;
}

/* ========== PRODUCT CARDS - Shiny Glimmering Design ========== */

/* Product card base styles */
.product-miniature {
    position: relative !important;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.thumbnail-container {
    position: relative !important;
    overflow: hidden !important;
    border-radius: 12px !important;
    background: rgba(255, 255, 255, 0.02) !important;
}

/* Glimmering border effect - animated gradient border */
.product-miniature::before {
    content: '' !important;
    position: absolute !important;
    top: -3px !important;
    left: -3px !important;
    right: -3px !important;
    bottom: -3px !important;
    background: linear-gradient(45deg, 
        var(--theme-glow, #FF8C00),
        transparent,
        var(--theme-glow, #9b5cf6),
        transparent,
        var(--theme-glow, #FF8C00)
    ) !important;
    background-size: 400% 400% !important;
    border-radius: 14px !important;
    z-index: -1 !important;
    opacity: 0 !important;
    transition: opacity 0.4s ease !important;
    animation: borderGlow 8s ease infinite !important;
}

.product-miniature:hover::before {
    opacity: 1 !important;
}

@keyframes borderGlow {
    0% { background-position: 0% 50% !important; }
    50% { background-position: 100% 50% !important; }
    100% { background-position: 0% 50% !important; }
}

/* Inner container with slight gap */
.product-miniature .thumbnail-container {
    margin: 3px !important;
}

/* Glimmer sweep effect on hover */
.product-miniature::after {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    left: -150% !important;
    width: 100% !important;
    height: 100% !important;
    background: linear-gradient(90deg, 
        transparent,
        rgba(255, 255, 255, 0.1),
        transparent
    ) !important;
    transition: left 0.6s ease !important;
    z-index: 10 !important;
    pointer-events: none !important;
    border-radius: 12px !important;
}

.product-miniature:hover::after {
    left: 100% !important;
}

/* Product thumbnail */
.product-miniature .product-thumbnail {
    border-radius: 10px 10px 0 0 !important;
    overflow: hidden !important;
}

.product-miniature .product-thumbnail img {
    transition: transform 0.4s ease, filter 0.4s ease !important;
}

.product-miniature:hover .product-thumbnail img {
    transform: scale(1.05) !important;
    filter: brightness(1.1) !important;
}

/* Product description area */
.product-miniature .product-description {
    background: linear-gradient(135deg, 
        rgba(0, 0, 0, 0.4) 0%, 
        rgba(20, 10, 30, 0.3) 100%
    ) !important;
    border-radius: 0 0 10px 10px !important;
    padding: 15px !important;
    position: relative !important;
    border-top: 1px solid rgba(255, 255, 255, 0.1) !important;
}

/* Product name */
.product-miniature .product-title a {
    color: #fff !important;
    font-weight: 600 !important;
    transition: all 0.3s ease !important;
    text-shadow: 0 0 20px var(--theme-glow, #FF8C00) !important;
}

.product-miniature:hover .product-title a {
    color: var(--theme-glow, #FF8C00) !important;
    text-shadow: 0 0 30px var(--theme-glow, #FF8C00) !important;
}

/* Product price */
.product-miniature .price {
    color: var(--theme-glow, #FF8C00) !important;
    font-weight: 700 !important;
    font-size: 1.2em !important;
    text-shadow: 0 0 15px var(--theme-glow, #FF8C00) !important;
}

/* Quick view button */
.product-miniature .quick-view {
    background: linear-gradient(135deg, 
        rgba(255, 255, 255, 0.15) 0%, 
        rgba(255, 255, 255, 0.05) 100%
    ) !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
    backdrop-filter: blur(10px) !important;
    transition: all 0.3s ease !important;
}

.product-miniature:hover .quick-view {
    background: linear-gradient(135deg, 
        var(--theme-glow, #FF8C00) 0%, 
        var(--theme-glow-secondary, #FF6A00) 100%
    ) !important;
    border-color: var(--theme-glow, #FF8C00) !important;
    box-shadow: 0 0 30px var(--theme-glow, #FF8C00) !important;
}

/* ========== THEME-SPECIFIC PRODUCT CARD COLORS ========== */

/* Orange theme */
[data-bao-theme=orange] .product-miniature {
    --theme-glow: #FF8C00 !important;
    --theme-glow-secondary: #FF6A00 !important;
}

[data-bao-theme=orange] .product-miniature::before {
    background: linear-gradient(45deg, 
        #FF8C00,
        transparent,
        #FF6A00,
        transparent,
        #FF8C00
    ) !important;
    background-size: 400% 400% !important;
}

[data-bao-theme=orange] .product-miniature .product-description {
    background: linear-gradient(135deg, 
        rgba(255, 140, 0, 0.15) 0%, 
        rgba(20, 10, 0, 0.2) 100%
    ) !important;
    border-top-color: rgba(255, 140, 0, 0.3) !important;
}

/* Purple theme */
[data-bao-theme=purple] .product-miniature {
    --theme-glow: #9b5cf6 !important;
    --theme-glow-secondary: #fb923c !important;
}

[data-bao-theme=purple] .product-miniature::before {
    background: linear-gradient(45deg, 
        #9b5cf6,
        transparent,
        #fb923c,
        transparent,
        #9b5cf6
    ) !important;
    background-size: 400% 400% !important;
}

[data-bao-theme=purple] .product-miniature .product-description {
    background: linear-gradient(135deg, 
        rgba(155, 92, 246, 0.15) 0%, 
        rgba(5, 3, 18, 0.2) 100%
    ) !important;
    border-top-color: rgba(155, 92, 246, 0.3) !important;
}

/* Green theme */
[data-bao-theme=green] .product-miniature {
    --theme-glow: #22c55e !important;
    --theme-glow-secondary: #0b5e33 !important;
}

[data-bao-theme=green] .product-miniature::before {
    background: linear-gradient(45deg, 
        #22c55e,
        transparent,
        #0b5e33,
        transparent,
        #22c55e
    ) !important;
    background-size: 400% 400% !important;
}

[data-bao-theme=green] .product-miniature .product-description {
    background: linear-gradient(135deg, 
        rgba(34, 197, 94, 0.15) 0%, 
        rgba(6, 12, 11, 0.2) 100%
    ) !important;
    border-top-color: rgba(34, 197, 94, 0.3) !important;
}

/* Classic theme - clean white design */
[data-bao-theme=classic] .product-miniature {
    --theme-glow: #000000 !important;
    --theme-glow-secondary: #333333 !important;
}

[data-bao-theme=classic] .product-miniature::before {
    background: linear-gradient(45deg, 
        #000000,
        transparent,
        #333333,
        transparent,
        #000000
    ) !important;
    background-size: 400% 400% !important;
}

[data-bao-theme=classic] .thumbnail-container {
    background: #ffffff !important;
    border: 2px solid #e0e0e0 !important;
}

[data-bao-theme=classic] .product-miniature .product-description {
    background: #ffffff !important;
    border-top: 1px solid #e0e0e0 !important;
}

[data-bao-theme=classic] .product-title a {
    color: #000000 !important;
    text-shadow: none !important;
}

[data-bao-theme=classic] .product-miniature:hover .product-title a {
    color: #000000 !important;
}

[data-bao-theme=classic] .product-miniature .price {
    color: #000000 !important;
    text-shadow: none !important;
}

[data-bao-theme=classic] .product-miniature .quick-view {
    background: rgba(0, 0, 0, 0.05) !important;
    border: 1px solid #000000 !important;
    color: #000000 !important;
}

[data-bao-theme=classic] .product-miniature:hover .quick-view {
    background: #000000 !important;
    color: #ffffff !important;
}

/* Add to cart button styling */
.product-miniature .add-to-cart,
.product-miniature .btn-primary {
    background: linear-gradient(135deg, 
        var(--theme-glow, #FF8C00) 0%, 
        var(--theme-glow-secondary, #FF6A00) 100%
    ) !important;
    border: none !important;
    color: #fff !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    transition: all 0.3s ease !important;
    position: relative !important;
    overflow: hidden !important;
}

.product-miniature .add-to-cart:hover,
.product-miniature .btn-primary:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 30px var(--theme-glow, #FF8C00) !important;
}

/* Classic theme add to cart */
[data-bao-theme=classic] .product-miniature .add-to-cart,
[data-bao-theme=classic] .product-miniature .btn-primary {
    background: #000000 !important;
}

[data-bao-theme=classic] .product-miniature .add-to-cart:hover,
[data-bao-theme=classic] .product-miniature .btn-primary:hover {
    background: #333333 !important;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.3) !important;
}

/* Product card lift effect */
.product-miniature:hover {
    transform: translateY(-5px) !important;
}

/* ========== STORE INFORMATION - Orange theme orange text ========== */
[data-bao-theme=orange] .store-information,
[data-bao-theme=orange] .block-contact,
[data-bao-theme=orange] h3.store-information-title,
[data-bao-theme=orange] .store-information h3,
[data-bao-theme=orange] .store-information h4,
[data-bao-theme=orange] .store-information p,
[data-bao-theme=orange] .store-information span,
[data-bao-theme=orange] .store-information div {
    color: #FF8C00 !important;
}

[data-bao-theme=orange] .store-information a {
    color: #FF8C00 !important;
}

[data-bao-theme=orange] .store-information a:hover {
    color: #FF6A00 !important;
}

/* Also target by common footer selectors */
[data-bao-theme=orange] footer .store-information *,
[data-bao-theme=orange] #footer .store-information * {
    color: #FF8C00 !important;
}

/* ========== STORE INFORMATION - Purple theme purple text ========== */
[data-bao-theme=purple] .store-information,
[data-bao-theme=purple] .block-contact,
[data-bao-theme=purple] h3.store-information-title,
[data-bao-theme=purple] .store-information h3,
[data-bao-theme=purple] .store-information h4,
[data-bao-theme=purple] .store-information p,
[data-bao-theme=purple] .store-information span,
[data-bao-theme=purple] .store-information div,
[data-bao-theme=purple] footer .store-information * {
    color: #9b5cf6 !important;
}

[data-bao-theme=purple] .store-information a:hover {
    color: #fb923c !important;
}

/* ========== STORE INFORMATION - Green theme green text ========== */
[data-bao-theme=green] .store-information,
[data-bao-theme=green] .block-contact,
[data-bao-theme=green] h3.store-information-title,
[data-bao-theme=green] .store-information h3,
[data-bao-theme=green] .store-information h4,
[data-bao-theme=green] .store-information p,
[data-bao-theme=green] .store-information span,
[data-bao-theme=green] .store-information div,
[data-bao-theme=green] footer .store-information * {
    color: #22c55e !important;
}

[data-bao-theme=green] .store-information a:hover {
    color: #0b5e33 !important;
}

/* ========== STORE INFORMATION - Classic theme black text ========== */
[data-bao-theme=classic] .store-information,
[data-bao-theme=classic] .block-contact,
[data-bao-theme=classic] h3.store-information-title,
[data-bao-theme=classic] .store-information h3,
[data-bao-theme=classic] .store-information h4,
[data-bao-theme=classic] .store-information p,
[data-bao-theme=classic] .store-information span,
[data-bao-theme=classic] .store-information div,
[data-bao-theme=classic] footer .store-information * {
    color: #000000 !important;
}

/* ========== THEME SELECTOR DROPDOWN - Fix visibility on Classic theme ========== */

/* Classic theme dropdown styling */
[data-bao-theme=classic] #bao-theme-select,
[data-bao-theme=classic] select {
    background: #ffffff !important;
    color: #000000 !important;
    border: 1px solid #000000 !important;
}

/* Fix option elements visibility - CRITICAL */
[data-bao-theme=classic] #bao-theme-select option,
[data-bao-theme=classic] select option {
    background: #ffffff !important;
    color: #000000 !important;
}

/* Dropdown hover states */
[data-bao-theme=classic] #bao-theme-select option:hover,
[data-bao-theme=classic] #bao-theme-select option:focus,
[data-bao-theme=classic] select option:hover,
[data-bao-theme=classic] select option:focus {
    background: #f0f0f0 !important;
    color: #000000 !important;
}

/* Make dropdown more appealing - rounded corners, better padding */
#bao-theme-select,
.theme-selector-inline select {
    border-radius: 6px !important;
    padding: 8px 12px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    min-width: 100px !important;
}

#bao-theme-select:hover,
.theme-selector-inline select:hover {
    transform: scale(1.02) !important;
}

/* Orange theme dropdown */
[data-bao-theme=orange] #bao-theme-select option {
    background: #000000 !important;
    color: #ffffff !important;
}

[data-bao-theme=orange] #bao-theme-select option:hover {
    background: rgba(255, 140, 0, 0.2) !important;
}

/* Purple theme dropdown */
[data-bao-theme=purple] #bao-theme-select option {
    background: #050312 !important;
    color: #ffffff !important;
}

[data-bao-theme=purple] #bao-theme-select option:hover {
    background: rgba(155, 92, 246, 0.2) !important;
}

/* Green theme dropdown */
[data-bao-theme=green] #bao-theme-select option {
    background: #061013 !important;
    color: #e6f8ea !important;
}

[data-bao-theme=green] #bao-theme-select option:hover {
    background: rgba(34, 197, 94, 0.2) !important;
}

/* All dropdowns - better appearance */
#bao-theme-select {
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    background-image: url(data:image/svg+xml
/* ========== THEME DROPDOWN FIX - Classic theme visibility ========== */
[data-bao-theme=classic] #bao-theme-select option,
[data-bao-theme=classic] select option {
    background: #ffffff !important;
    color: #000000 !important;
}
[data-bao-theme=classic] #bao-theme-select {
    background: #fff !important;
    color: #000 !important;
    border: 1px solid #000 !important;
}
#bao-theme-select, .theme-selector-inline select {
    border-radius: 6px !important;
    padding: 8px 12px !important;
    min-width: 100px !important;
}

/* ========== NEWSLETTER BOX - Black background on Orange/Purple/Green ========== */

/* Orange theme - black background with orange text */
[data-bao-theme=orange] #blockEmailSubscription_displayFooterBefore,
[data-bao-theme=orange] .block_newsletter {
    background: #000000 !important;
    border: 1px solid rgba(255, 140, 0, 0.3) !important;
    border-radius: 8px !important;
    padding: 20px !important;
}

[data-bao-theme=orange] #block-newsletter-label,
[data-bao-theme=orange] .block_newsletter p,
[data-bao-theme=orange] .block_newsletter label,
[data-bao-theme=orange] .block_newsletter span {
    color: #FF8C00 !important;
}

[data-bao-theme=orange] .block_newsletter input[type=email] {
    background: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid rgba(255, 140, 0, 0.3) !important;
    color: #ffffff !important;
}

[data-bao-theme=orange] .block_newsletter input[type=email]::placeholder {
    color: rgba(255, 255, 255, 0.5) !important;
}

[data-bao-theme=orange] .block_newsletter input[type=email]:focus {
    border-color: #FF8C00 !important;
    box-shadow: 0 0 15px rgba(255, 140, 0, 0.3) !important;
}

/* Purple theme - black background with purple text */
[data-bao-theme=purple] #blockEmailSubscription_displayFooterBefore,
[data-bao-theme=purple] .block_newsletter {
    background: #000000 !important;
    border: 1px solid rgba(155, 92, 246, 0.3) !important;
    border-radius: 8px !important;
    padding: 20px !important;
}

[data-bao-theme=purple] #block-newsletter-label,
[data-bao-theme=purple] .block_newsletter p,
[data-bao-theme=purple] .block_newsletter label,
[data-bao-theme=purple] .block_newsletter span {
    color: #9b5cf6 !important;
}

[data-bao-theme=purple] .block_newsletter input[type=email] {
    background: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid rgba(155, 92, 246, 0.3) !important;
    color: #ffffff !important;
}

[data-bao-theme=purple] .block_newsletter input[type=email]::placeholder {
    color: rgba(255, 255, 255, 0.5) !important;
}

[data-bao-theme=purple] .block_newsletter input[type=email]:focus {
    border-color: #9b5cf6 !important;
    box-shadow: 0 0 15px rgba(155, 92, 246, 0.3) !important;
}

/* Green theme - black background with green text */
[data-bao-theme=green] #blockEmailSubscription_displayFooterBefore,
[data-bao-theme=green] .block_newsletter {
    background: #000000 !important;
    border: 1px solid rgba(34, 197, 94, 0.3) !important;
    border-radius: 8px !important;
    padding: 20px !important;
}

[data-bao-theme=green] #block-newsletter-label,
[data-bao-theme=green] .block_newsletter p,
[data-bao-theme=green] .block_newsletter label,
[data-bao-theme=green] .block_newsletter span {
    color: #22c55e !important;
}

[data-bao-theme=green] .block_newsletter input[type=email] {
    background: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid rgba(34, 197, 94, 0.3) !important;
    color: #ffffff !important;
}

[data-bao-theme=green] .block_newsletter input[type=email]::placeholder {
    color: rgba(255, 255, 255, 0.5) !important;
}

[data-bao-theme=green] .block_newsletter input[type=email]:focus {
    border-color: #22c55e !important;
    box-shadow: 0 0 15px rgba(34, 197, 94, 0.3) !important;
}

/* ========== REMOVE WHITE BORDER/LINE - Orange/Purple/Green themes ========== */

/* Remove white border from header nav on colored themes */
[data-bao-theme=orange] .header-nav,
[data-bao-theme=purple] .header-nav,
[data-bao-theme=green] .header-nav {
    border-bottom: 1px solid rgba(0, 0, 0, 0.5) !important;
}

/* Also target any separator lines */
[data-bao-theme=orange] header,
[data-bao-theme=purple] header,
[data-bao-theme=green] header,
[data-bao-theme=orange] #header,
[data-bao-theme=purple] #header,
[data-bao-theme=green] #header {
    border-bottom: none !important;
    border-top: none !important;
}

[data-bao-theme=orange] .header-top,
[data-bao-theme=purple] .header-top,
[data-bao-theme=green] .header-top {
    border-bottom: 1px solid rgba(0, 0, 0, 0.3) !important;
}

/* Remove any white separators */
[data-bao-theme=orange] hr,
[data-bao-theme=purple] hr,
[data-bao-theme=green] hr {
    border-color: rgba(0, 0, 0, 0.3) !important;
}

/* Fix footer top border too */
[data-bao-theme=orange] .modern-footer,
[data-bao-theme=purple] .modern-footer,
[data-bao-theme=green] .modern-footer {
    border-top: 1px solid rgba(0, 0, 0, 0.5) !important;
}

/* ========== THEME SELECTOR - Match menu button size ========== */
.theme-selector-inline {
    padding: 6px 12px !important;
    background: linear-gradient(135deg, rgba(255,255,255,0.15) 0%, rgba(255,255,255,0.05) 100%) !important;
    border: 1px solid rgba(255,255,255,0.2) !important;
    border-radius: 6px !important;
    flex-shrink: 0 !important;
}

#bao-theme-select {
    background: rgba(0,0,0,0.5) !important;
    color: #fff !important;
    border: 1px solid rgba(255,255,255,0.2) !important;
    border-radius: 4px !important;
    padding: 4px 8px !important;
    font-size: 11px !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    min-width: auto !important;
    height: auto !important;
}

#bao-theme-select:hover {
    border-color: rgba(155,92,246,0.5) !important;
    box-shadow: 0 0 10px rgba(155,92,246,0.3) !important;
}

.theme-indicator-dot {
    width: 8px !important;
    height: 8px !important;
    border-radius: 50% !important;
    border: 2px solid rgba(255,255,255,0.3) !important;
    transition: all 0.3s ease !important;
    flex-shrink: 0 !important;
}

/* Classic theme styling */
[data-bao-theme=classic] .theme-selector-inline {
    background: rgba(0,0,0,0.05) !important;
    border: 1px solid rgba(0,0,0,0.15) !important;
}

[data-bao-theme=classic] #bao-theme-select {
    background: rgba(0,0,0,0.5) !important;
    color: #000 !important;
    border-color: #000 !important;
}

[data-bao-theme=classic] #bao-theme-select option {
    background: #fff !important;
    color: #000 !important;
}

/* ========== SIGN IN BUTTON - Match regular menu buttons ========== */
.shiny-menu-btn.sign-in {
    background: linear-gradient(135deg, rgba(255,255,255,0.15) 0%, rgba(255,255,255,0.05) 50%, rgba(255,255,255,0.15) 100%) !important;
    border: 1px solid rgba(255,255,255,0.2) !important;
    box-shadow: 0 4px 15px rgba(0,0,0,0.3), inset 0 1px 0 rgba(255,255,255,0.2), inset 0 -1px 0 rgba(0,0,0,0.2) !important;
}

.shiny-menu-btn.sign-in:hover {
    background: linear-gradient(135deg, rgba(255,255,255,0.25) 0%, rgba(255,255,255,0.1) 50%, rgba(255,255,255,0.25) 100%) !important;
    border-color: rgba(255,255,255,0.4) !important;
    box-shadow: 0 6px 25px rgba(0,0,0,0.4), 0 0 20px rgba(155,92,246,0.3), inset 0 1px 0 rgba(255,255,255,0.3) !important;
    transform: translateY(-2px) !important;
}

/* Remove special gradient backgrounds from sign-in on all themes */
.shiny-menu-btn.sign-in,
[data-bao-theme=orange] .shiny-menu-btn.sign-in,
[data-bao-theme=purple] .shiny-menu-btn.sign-in,
[data-bao-theme=green] .shiny-menu-btn.sign-in {
    background: linear-gradient(135deg, rgba(255,255,255,0.15) 0%, rgba(255,255,255,0.05) 50%, rgba(255,255,255,0.15) 100%) !important;
    border: 1px solid rgba(255,255,255,0.2) !important;
}

/* ========== STORE INFORMATION IN FOOTER - Match theme colors ========== */

/* Orange theme */
[data-bao-theme=orange] footer .store-information,
[data-bao-theme=orange] footer .store-information *,
[data-bao-theme=orange] #footer .store-information,
[data-bao-theme=orange] #footer .store-information *,
[data-bao-theme=orange] .modern-footer .store-information,
[data-bao-theme=orange] .modern-footer .store-information * {
    color: #FF8C00 !important;
}

/* Purple theme */
[data-bao-theme=purple] footer .store-information,
[data-bao-theme=purple] footer .store-information *,
[data-bao-theme=purple] #footer .store-information,
[data-bao-theme=purple] #footer .store-information *,
[data-bao-theme=purple] .modern-footer .store-information,
[data-bao-theme=purple] .modern-footer .store-information * {
    color: #9b5cf6 !important;
}

/* Green theme */
[data-bao-theme=green] footer .store-information,
[data-bao-theme=green] footer .store-information *,
[data-bao-theme=green] #footer .store-information,
[data-bao-theme=green] #footer .store-information *,
[data-bao-theme=green] .modern-footer .store-information,
[data-bao-theme=green] .modern-footer .store-information * {
    color: #22c55e !important;
}

/* Classic theme */
[data-bao-theme=classic] footer .store-information,
[data-bao-theme=classic] footer .store-information *,
[data-bao-theme=classic] #footer .store-information,
[data-bao-theme=classic] #footer .store-information *,
[data-bao-theme=classic] .modern-footer .store-information,
[data-bao-theme=classic] .modern-footer .store-information * {
    color: #000000 !important;
}

/* Footer links in store information - match theme */
[data-bao-theme=orange] footer .store-information a {
    color: #FF8C00 !important;
}

[data-bao-theme=purple] footer .store-information a {
    color: #9b5cf6 !important;
}

[data-bao-theme=green] footer .store-information a {
    color: #22c55e !important;
}

[data-bao-theme=classic] footer .store-information a {
    color: #000000 !important;
}

/* ========== NEWSLETTER BOX - Move label to bottom left ========== */
#block-newsletter-label {
    order: 10 !important;
    text-align: left !important;
    width: 100% !important;
    margin-top: 15px !important;
    margin-bottom: 0 !important;
}

/* ========== NEWSLETTER EMAIL INPUT - Make wider ========== */
.block_newsletter input[name=email],
#blockEmailSubscription_displayFooterBefore input[name=email],
.block_newsletter .input-wrapper,
#blockEmailSubscription_displayFooterBefore .input-wrapper {
    width: 100% !important;
    min-width: 250px !important;
    max-width: 400px !important;
}

.block_newsletter .input-wrapper input,
#blockEmailSubscription_displayFooterBefore .input-wrapper input {
    width: 100% !important;
    min-width: 200px !important;
}

/* Mobile responsive */
@media (max-width: 768px) {
    .block_newsletter input[name=email],
    #blockEmailSubscription_displayFooterBefore input[name=email] {
        min-width: 180px !important;
        width: 100% !important;
    }
}

/* ========== EVENTS PAGE - Add birthday banner at top ========== */
.page-cms-37 #content:before {
  content: '' !important;
  display: block !important;
  background: url('/img/2140bday.jpeg') no-repeat center !important;
  background-size: contain !important;
  background-color: #000000 !important;
  height: 600px !important;
  width: 100% !important;
  margin-bottom: 30px !important;
  border-radius: 15px !important;
}

/* ========== FOOTER - Make narrower/shorter horizontally ========== */
.modern-footer .footer-container,
.modern-footer .container {
  max-width: 1200px !important;
  margin: 0 auto !important;
}

/* ========== FOOTER WIDTH - Shrink horizontal spacing ========== */
.modern-footer {
  padding: 40px 20px !important;
}

.modern-footer .footer-content {
  max-width: 1200px !important;
  margin: 0 auto !important;
}

.modern-footer .footer-newsletter {
  max-width: 400px !important;
}

/* ========== QUICK VIEW BUTTON - Black background on Orange theme ========== */
[data-bao-theme=orange] .quick-view,
[data-bao-theme=orange] .product-miniature .quick-view {
    background: #000000 !important;
    color: #ffffff !important;
    border: 1px solid #000000 !important;
}

[data-bao-theme=orange] .quick-view:hover,
[data-bao-theme=orange] .product-miniature .quick-view:hover {
    background: #333333 !important;
    border-color: #333333 !important;
    color: #ffffff !important;
}

/* Purple theme - black background too */
[data-bao-theme=purple] .quick-view,
[data-bao-theme=purple] .product-miniature .quick-view {
    background: #000000 !important;
    color: #ffffff !important;
    border: 1px solid #000000 !important;
}

/* Green theme - black background */
[data-bao-theme=green] .quick-view,
[data-bao-theme=green] .product-miniature .quick-view {
    background: #000000 !important;
    color: #e6f8ea !important;
    border: 1px solid #000000 !important;
}

/* Classic theme - black background */
[data-bao-theme=classic] .quick-view,
[data-bao-theme=classic] .product-miniature .quick-view {
    background: #000000 !important;
    color: #ffffff !important;
    border: 1px solid #000000 !important;
}

/* ========== EVENTS PAGE - Birthday banner at top (Working fix) ========== */
.page-cms-37 #content {
    position: relative !important;
}

.page-cms-37 #content > *:first-child {
    margin-top: 30px !important;
}

/* Add banner via CSS content */
.page-cms-37 .page-content::before {
    content: '' !important;
    display: block !important;
    width: 100% !important;
    height: 0 !important;
    visibility: hidden !important;
}

/* ========== MOBILE OPTIMIZATION - Top Menu ========== */
@media (max-width: 768px) {
    /* Header nav container */
    .header-nav {
        padding: 10px 0 !important;
    }
    
    /* Unified menu container - wrap on mobile */
    .unified-menu-container {
        flex-wrap: wrap !important;
        gap: 4px !important;
        padding: 5px 0 !important;
        justify-content: center !important;
    }
    
    /* Logo on mobile */
    .logo-link img {
        height: 35px !important;
        width: auto !important;
    }
    
    /* Shiny menu buttons on mobile */
    .shiny-menu-btn {
        padding: 6px 10px !important;
        font-size: 10px !important;
        flex: 0 0 auto !important;
        min-width: 60px !important;
        text-align: center !important;
    }
    
    /* Theme selector on mobile */
    .theme-selector-inline {
        padding: 4px 8px !important;
        flex-basis: 100% !important;
        order: 10 !important;
        margin-top: 5px !important;
    }
    
    #bao-theme-select {
        font-size: 10px !important;
        padding: 4px 6px !important;
    }
    
    .theme-indicator-dot {
        width: 6px !important;
        height: 6px !important;
    }
    
    /* Hide original mobile menu icon since we have shiny buttons */
    #menu-icon {
        display: none !important;
    }
    
    /* Adjust cart and user info positioning */
    #_mobile_cart,
    #_mobile_user_info {
        margin: 5px !important;
    }
}

/* Extra small mobile */
@media (max-width: 480px) {
    .unified-menu-container {
        display: flex !important;
        flex-wrap: wrap !important;
        justify-content: center !important;
    }
    
    .shiny-menu-btn {
        padding: 5px 8px !important;
        font-size: 9px !important;
        min-width: 50px !important;
    }
    
    .logo-link {
        order: -1 !important;
        margin-bottom: 5px !important;
    }
    
    .logo-link img {
        height: 30px !important;
    }
}

/* ========== EVENTS PAGE - Birthday banner via CSS background ========== */
.page-cms-37 #content,
body.page-cms-37 #content {
    position: relative !important;
}

.page-cms-37 #content::before {
    content: '' !important;
    display: block !important;
    background-image: url('/img/2140bday.jpeg') !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: contain !important;
    background-color: #000000 !important;
    width: 100% !important;
    height: 600px !important;
    margin-bottom: 30px !important;
    border-radius: 15px !important;
}

.page-cms-37 #content > *:first-child {
    margin-top: 30px !important;
}

/* ========== EVENTS PAGE BANNER - Working solution ========== */
.page-cms-37 > section::after {
    content: '' !important;
    display: block !important;
    background-image: url('/img/2140bday.jpeg') !important;
    background-repeat: no-repeat !important;
    background-position: center top !important;
    background-size: contain !important;
    background-color: #000000 !important;
    width: 100% !important;
    height: 600px !important;
    margin: 0 auto 30px auto !important;
    border-radius: 15px !important;
    order: -1 !important;
}

/* ========== MOBILE FIX - White Page Issue (Jan 2026) ========== */

/* CRITICAL: Ensure body is never permanently hidden on mobile */
@media (max-width: 768px) {
    /* Force body to be visible and scrollable */
    body {
        overflow-y: auto !important;
        overflow-x: hidden !important;
        min-height: 100vh !important;
        position: relative !important;
    }
    
    html {
        overflow-x: hidden !important;
    }
    
    /* Ensure main content is visible */
    main, #wrapper, section, #content, .page-content, .page-home {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        overflow: visible !important;
        min-height: auto !important;
    }
    
    /* Fix geyser wrapper width on mobile */
    .ao2140-geyser-wrapper {
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 10px !important;
        box-sizing: border-box !important;
    }
    
    .ao2140-geyser-widget {
        width: 100% !important;
        max-width: 100% !important;
        flex: 1 1 100% !important;
    }
    
    /* Prevent horizontal overflow from any elements */
    .ao2140-birthday-banner,
    .ao2140-birthday-container,
    .ao2140-terminal-wrapper,
    .ao2140-terminal,
    .ao2140-homepage-wrapper {
        max-width: 100vw !important;
        overflow-x: hidden !important;
        box-sizing: border-box !important;
    }
    
    /* Ensure birthday image doesn't overflow */
    .ao2140-birthday-image {
        max-width: 100% !important;
        width: auto !important;
        height: auto !important;
    }
    
    /* Terminal fixes for mobile */
    .ao2140-terminal-wrapper {
        margin: 20px 10px !important;
        max-width: calc(100vw - 20px) !important;
    }
    
    /* Fix container overflow */
    .container {
        overflow-x: hidden !important;
        max-width: 100% !important;
        padding-left: 10px !important;
        padding-right: 10px !important;
    }
}

/* Extra small screens */
@media (max-width: 480px) {
    .ao2140-birthday-banner {
        padding: 15px 8px !important;
    }
    
    .ao2140-geyser-widget {
        min-height: 400px !important;
        height: auto !important;
    }
    
    .ao2140-terminal-body {
        padding: 10px !important;
        font-size: 11px !important;
    }
    
    .ao2140-terminal-wrapper {
        margin: 15px 5px !important;
    }
}

/* Force black background on mobile for all colored themes */
@media (max-width: 768px) {
    body:not([data-bao-theme="classic"]) {
        background-color: #000000 !important;
        color: #ffffff !important;
    }
    
    [data-bao-theme="orange"] body,
    [data-bao-theme="purple"] body,
    [data-bao-theme="green"] body {
        background-color: #000000 !important;
    }
}

/* ========== HIDE OLD FOOTER ELEMENTS ON MOBILE ========== */
@media (max-width: 768px) {
    /* Hide the old PrestaShop footer blocks with collapse icons */
    .block-contact.links.wrapper,
    .footer-container .links .wrapper,
    .footer-container .block-contact,
    #contact-infos,
    .links .title[data-toggle="collapse"],
    .footer-container .collapse-icons,
    .footer-container .navbar-toggler {
        display: none !important;
    }
    
    /* Hide material icons in footer */
    #footer .material-icons,
    .page-footer .material-icons {
        display: none !important;
    }
    
    /* Clean up footer on mobile */
    #footer .links,
    .page-footer .links {
        display: none !important;
    }
    
    /* Keep only the modern footer visible */
    .modern-footer {
        display: block !important;
    }
}

/* ========== THEME SELECTOR BUTTON - Compact Width Fix (Jan 2026) ========== */
/* Override any styles making theme selector full-width */
.theme-selector-inline {
    display: inline-flex !important;
    width: auto !important;
    max-width: fit-content !important;
    flex-basis: auto !important;
    flex-grow: 0 !important;
}

/* Desktop: Ensure compact */
@media (min-width: 769px) {
    .theme-selector-inline {
        width: auto !important;
        max-width: 180px !important;
        flex-basis: auto !important;
    }
}

/* Mobile: Also keep compact, not full width */
@media (max-width: 768px) {
    .theme-selector-inline {
        width: auto !important;
        max-width: none !important;
        flex-basis: auto !important;
        order: 5 !important;
        margin-top: 0 !important;
    }
}

