/*
Theme Name: Aloha Decor Flatsome Child
Template: flatsome
Version: 1.0.1
*/

/* ============================================
   BRAND COLORS - BLACK & GOLD
   ============================================ */
:root {
  --gold: #D4AF37;
  --gold-light: #e8cc6a;
  --black: #0a0a0a;
  --black-soft: #111111;
  --cream: #f5f0e8;
}

/* ============================================
   HEADER & NAVIGATION
   ============================================ */
#header,
#header .header-main,
.header-wrapper {
  background: #0a0a0a !important;
  border-bottom: 1px solid #222 !important;
}

/* Force single-row nav - fix flex-wrap on the nav list itself */
.header-inner .nav,
.header-main .nav {
  flex-wrap: nowrap !important;
  display: flex !important;
  align-items: center !important;
}

/* Desktop nav links - compact for single row */
.nav > li > a,
.nav > li > span {
  color: #ffffff !important;
  font-size: 11.5px !important;
  font-weight: 600 !important;
  letter-spacing: 0.07em !important;
  text-transform: uppercase !important;
  padding: 0 10px !important;
  white-space: nowrap !important;
}

.nav > li > a:hover,
.nav > li > a:focus,
.nav > li.active > a {
  color: #D4AF37 !important;
  background: transparent !important;
}

/* Dropdown submenu */
.nav .sub-menu {
  background: #111111 !important;
  border-top: 2px solid #D4AF37 !important;
}

.nav .sub-menu li a {
  color: #cccccc !important;
  font-size: 12px !important;
  letter-spacing: 0.04em !important;
  white-space: nowrap;
}

.nav .sub-menu li a:hover {
  color: #D4AF37 !important;
  background: #1a1a1a !important;
}

/* Ensure the nav container expands */
.header-inner .flex-col.flex-grow {
  flex-grow: 1 !important;
  min-width: 0 !important;
  overflow: visible !important;
}

@media (min-width: 851px) {
  .header-inner.flex-row {
    flex-wrap: nowrap !important;
    align-items: center !important;
  }
  #header .header-main .flex-row {
    flex-wrap: nowrap !important;
  }
}

/* ============================================
   BUTTONS
   ============================================ */
.button,
.btn,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.add_to_cart_button {
  background: #D4AF37 !important;
  color: #0a0a0a !important;
  border: none !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  transition: background 0.3s ease !important;
}

.button:hover,
.btn:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover {
  background: #e8cc6a !important;
  color: #0a0a0a !important;
}

.button.outline,
.button.secondary {
  background: transparent !important;
  border: 2px solid #D4AF37 !important;
  color: #D4AF37 !important;
}

/* ============================================
   FOOTER
   ============================================ */
#footer,
.footer-wrapper,
.absolute-footer {
  background: #0a0a0a !important;
  color: #aaaaaa !important;
  border-top: 1px solid #222 !important;
}

#footer a,
.footer-wrapper a {
  color: #D4AF37 !important;
}

#footer a:hover,
.footer-wrapper a:hover {
  color: #e8cc6a !important;
}

#footer .widget-title,
.footer-wrapper .widget-title {
  color: #ffffff !important;
  border-bottom: 1px solid #D4AF37 !important;
  padding-bottom: 8px !important;
  margin-bottom: 12px !important;
}

/* ============================================
   WOOCOMMERCE PRODUCT CARDS
   ============================================ */
.product-inner:hover,
.box:hover {
  box-shadow: 0 8px 30px rgba(212, 175, 55, 0.18) !important;
  transition: box-shadow 0.3s ease !important;
}

.price,
.woocommerce .price {
  color: #D4AF37 !important;
  font-weight: 700 !important;
}

.onsale,
.badge {
  background: #D4AF37 !important;
  color: #0a0a0a !important;
}

/* ============================================
   MOBILE MENU
   ============================================ */
@media (max-width: 850px) {
  #mobile-menu,
  .mobile-sidebar,
  .nav-mobile {
    background: #0a0a0a !important;
  }

  .mobile-sidebar .nav > li > a,
  .nav-mobile li a,
  .mobile-sidebar ul li a {
    color: #ffffff !important;
    border-bottom: 1px solid #1e1e1e !important;
    padding: 14px 20px !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    letter-spacing: 0.05em !important;
  }

  .mobile-sidebar .nav > li > a:hover,
  .mobile-sidebar ul li a:hover {
    color: #D4AF37 !important;
    background: #1a1a1a !important;
  }

  .mobile-sidebar .nav > li.active > a {
    color: #D4AF37 !important;
  }

  .mobile-toggle i,
  .mobile-toggle svg,
  button.mobile-toggle {
    color: #ffffff !important;
    fill: #ffffff !important;
  }
}

/* ============================================
   TOP BAR
   ============================================ */
#top-bar,
.top-bar {
  background: #111111 !important;
  color: #999999 !important;
  font-size: 11.5px !important;
}

#top-bar a,
.top-bar a {
  color: #D4AF37 !important;
}

/* ============================================
   BREADCRUMBS & PAGINATION
   ============================================ */
.breadcrumbs a,
.woocommerce-breadcrumb a {
  color: #D4AF37 !important;
}

.pagination a,
.woocommerce-pagination a {
  border: 1px solid #D4AF37 !important;
  color: #D4AF37 !important;
}

.pagination .current,
.woocommerce-pagination .current {
  background: #D4AF37 !important;
  color: #0a0a0a !important;
}

/* ============================================
   HEADER ICONS
   ============================================ */
.header-button a,
.header-button i,
.header-button svg,
.icon-button i,
.icon-button svg {
  color: #ffffff !important;
  fill: #ffffff !important;
}

.header-button a:hover i,
.icon-button:hover i {
  color: #D4AF37 !important;
}

.cart-count,
.header-cart-count {
  background: #D4AF37 !important;
  color: #0a0a0a !important;
}