/* Chai AlJalsa — Site header, footer, navigation */

/* ─── Site Header ─── */
#masthead,
.site-header {
  position: sticky !important;
  top: 0;
  z-index: 200;
  background: rgba(244,242,234,0.92) !important;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border-bottom: var(--bw-hair) solid var(--border) !important;
  box-shadow: none !important;
  padding: 0 !important;
}

.site-header-inner,
.storefront-header-widget-region,
.col-full {
  max-width: var(--container) !important;
  margin-inline: auto !important;
  padding-inline: var(--space-6) !important;
}

/* Hide default Storefront header widget region clutter */
.storefront-header-widget-region { display: none !important; }

/* Logo */
.site-branding {
  display: flex;
  align-items: center;
}
.site-branding .custom-logo-link img,
.site-branding .custom-logo {
  height: 46px !important;
  width: auto !important;
  max-width: none !important;
}
.site-branding .site-title { display: none; }
.site-branding .site-description { display: none; }

/* Main nav */
.main-navigation {
  display: flex !important;
  align-items: center;
}
.main-navigation ul {
  display: flex !important;
  gap: 4px !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}
.main-navigation ul li a {
  display: flex;
  align-items: center;
  height: 44px;
  padding: 0 12px;
  font-family: var(--font-body);
  font-size: 15px;
  font-weight: var(--fw-medium);
  color: var(--text-body) !important;
  border-radius: var(--radius-sm);
  text-decoration: none !important;
  transition: background var(--dur-fast), color var(--dur-fast);
}
.main-navigation ul li a:hover,
.main-navigation ul li.current-menu-item > a,
.main-navigation ul li.current_page_item > a {
  background: var(--surface-sunken);
  color: var(--text-brand) !important;
  font-weight: var(--fw-bold);
}

/* WooCommerce header cart — desktop only */
.site-header-cart {
  display: flex !important;
  align-items: center;
  gap: 8px;
}
.site-header-cart .cart-contents {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: var(--radius-sm);
  color: var(--text-strong) !important;
  transition: background var(--dur-fast);
  position: relative;
}
.site-header-cart .cart-contents:hover { background: var(--surface-sunken); }
.site-header-cart .cart-contents .amount { display: none; }
.site-header-cart .cart-contents .count {
  position: absolute;
  top: 4px;
  inset-inline-end: 4px;
  width: 18px;
  height: 18px;
  background: var(--accent);
  color: var(--paper);
  font-size: 11px;
  font-weight: var(--fw-bold);
  border-radius: var(--radius-pill);
  display: flex;
  align-items: center;
  justify-content: center;
}

/* ─── Kill any gap Storefront adds between header and content ─── */
#content,
.site-content,
#primary,
.site-main {
  margin-top: 0 !important;
  padding-top: 0 !important;
}
/* Storefront sometimes adds a .page-header before content */
.page-header {
  margin-top: 0 !important;
  padding-top: 0 !important;
}
/* Remove Storefront's default top margin on storefront-primary-navigation */
.storefront-primary-navigation + * { margin-top: 0 !important; }

/* ─── Site Footer ─── */
.site-footer,
#colophon {
  background: var(--surface-ink) !important;
  color: var(--sand-300) !important;
  margin-top: var(--space-9);
}
.site-footer .col-full {
  max-width: var(--container);
  margin-inline: auto;
  padding: var(--space-8) var(--space-6) var(--space-6);
}

/* Footer widget areas */
.footer-widgets,
.storefront-footer-widgets {
  display: grid !important;
  grid-template-columns: 1.4fr 1fr 1fr !important;
  gap: var(--space-6) !important;
  padding: var(--space-8) 0 var(--space-6) !important;
}
.footer-widgets .widget-title {
  color: var(--paper) !important;
  font-size: 16px !important;
  margin-bottom: 14px !important;
  font-family: var(--font-display) !important;
}
.footer-widgets a {
  color: var(--sand-400) !important;
  font-size: 14px;
  line-height: 2;
  display: block;
}
.footer-widgets a:hover { color: var(--paper) !important; text-decoration: none !important; }
.footer-widgets p { color: var(--sand-400); font-size: 14px; line-height: 1.8; }

/* Footer bottom bar */
.site-info {
  border-top: 1px solid var(--ink-700) !important;
  padding: 16px 0 !important;
  text-align: center;
  font-size: 12px;
  color: var(--sand-600) !important;
}
.site-info a { color: var(--sand-500) !important; }
.site-info .sep { display: none; }

/* ─── Breadcrumb ─── */
.woocommerce-breadcrumb {
  font-size: var(--fs-sm) !important;
  color: var(--text-muted) !important;
  padding: var(--space-4) 0 !important;
}
.woocommerce-breadcrumb a { color: var(--text-muted) !important; }
.woocommerce-breadcrumb a:hover { color: var(--text-brand) !important; }

/* ─── Page titles ─── */
.page-title,
.entry-title,
.woocommerce-products-header__title {
  font-family: var(--font-display) !important;
  color: var(--text-strong) !important;
}

/* ─── Notices ─── */
.woocommerce-message,
.woocommerce-info {
  border-top-color: var(--accent) !important;
  background: var(--red-50) !important;
  color: var(--text-strong) !important;
}
.woocommerce-error {
  border-top-color: var(--red-700) !important;
}
