/* ═══════════════════════════════════════════════════════════════
   Namaste Imports – Category page
   Theme: same as Contact – crimson, navy, gold (Nepal flag)
═══════════════════════════════════════════════════════════════ */

/* Hero: same gradient as Contact page-hero */
.category-page .category-hero {
  padding: clamp(48px, 8vw, 72px) clamp(24px, 5vw, 48px);
  background: linear-gradient(135deg, var(--deep-crimson), var(--crimson) 50%, var(--navy));
  position: relative;
  overflow: hidden;
  text-align: center;
}

.category-page .category-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background: url("data:image/svg+xml,%3Csvg width='80' height='80' viewBox='0 0 80 80' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23D4A017' fill-opacity='0.05'%3E%3Cpath d='M40 0l5 15h16l-13 9 5 15-13-9-13 9 5-15-13-9h16z'/%3E%3C/g%3E%3C/svg%3E");
  pointer-events: none;
}

.category-page .category-hero-inner {
  position: relative;
  z-index: 2;
}

/* Breadcrumb: gold/white like Contact */
.category-page .category-breadcrumb {
  font-size: 0.78rem;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: rgba(255,255,255,0.55);
  margin-bottom: 12px;
}

.category-page .category-breadcrumb a {
  color: var(--gold);
  text-decoration: none;
  transition: color 0.2s;
}

.category-page .category-breadcrumb a:hover {
  color: var(--gold-light);
}

.category-page .category-breadcrumb span {
  color: rgba(255,255,255,0.6);
  margin: 0 6px;
}

/* Title: white + gold accent like Contact hero */
.category-page .category-title {
  font-family: 'Cinzel', serif;
  font-size: clamp(1.75rem, 4vw, 2.5rem);
  font-weight: 700;
  color: var(--white);
  letter-spacing: 0.2em;
  margin-bottom: 16px;
  line-height: 1.2;
}

.category-page .category-description {
  font-size: clamp(0.95rem, 1.2vw, 1.05rem);
  color: rgba(255,255,255,0.8);
  line-height: 1.75;
}

/* ═══════════════════════════════════════════════════════════════
   All category pages (including Instruments) use Contact theme:
   crimson, navy, gold. Instruments no longer has custom hero.
═══════════════════════════════════════════════════════════════ */

/* Instruments: use same hero as other categories (no custom cinematic hero) */
.category-hero.category-hero-instruments {
  /* Same as .category-page .category-hero – gradient, no image */
  min-height: auto;
  padding: clamp(48px, 8vw, 72px) clamp(24px, 5vw, 48px);
  background: linear-gradient(135deg, var(--deep-crimson), var(--crimson) 50%, var(--navy));
  text-align: center;
}

.category-hero.category-hero-instruments::before {
  background: url("data:image/svg+xml,%3Csvg width='80' height='80' viewBox='0 0 80 80' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23D4A017' fill-opacity='0.05'%3E%3Cpath d='M40 0l5 15h16l-13 9 5 15-13-9-13 9 5-15-13-9h16z'/%3E%3C/g%3E%3C/svg%3E");
}

.category-hero-instruments .category-title {
  font-family: 'Cinzel', serif;
  color: var(--white);
  text-shadow: none;
}

.category-hero-instruments .category-description {
  color: rgba(255,255,255,0.8);
  font-family: 'Lato', sans-serif;
  text-shadow: none;
}

.category-hero-instruments .category-breadcrumb {
  display: block;
}

/* Instruments content: same theme as Contact / other categories */
.category-instruments-page .category-container {
  background: var(--cream);
  padding: clamp(32px, 5vw, 48px) clamp(24px, 5vw, 48px);
}

/* Product card visuals: css/shop.css marketplace rules (.shop-page .shop-container) */

/* Mobile (tablet / minimized laptop): keep hero comfortable; only topbar/layout tweaks */
@media (max-width: 768px) {
  /* Product count and Availability in one row; reduce space above */
  .category-container {
    padding-top: 12px;
  }
  .category-instruments-page .category-container {
    padding-top: 12px;
  }
  .category-topbar {
    flex-wrap: nowrap;
    gap: 12px;
    margin-bottom: 20px;
  }
  .category-topbar .result-count {
    font-size: 0.85rem;
  }
  /* Same row: Product count left, dropdown only on mobile (hide "Availability" label) */
  .category-page .category-filters .filter-label {
    display: none;
  }
  .category-page .category-filters {
    flex-direction: row;
    align-items: center;
    gap: 8px;
    width: auto;
    max-width: none;
    margin-left: auto;
  }
  .category-filters .sort-select {
    min-height: 38px;
    padding: 8px 10px;
    font-size: 0.85rem;
    width: auto;
    min-width: 100px;
  }
}

/* Phone only: smaller category-hero so it doesn’t dominate small screens */
@media (max-width: 480px) {
  .category-page .category-hero,
  .category-hero.category-hero-instruments {
    padding: 28px 20px 24px;
  }
  .category-page .category-title,
  .category-hero-instruments .category-title {
    font-size: clamp(1.35rem, 5vw, 1.75rem);
    margin-bottom: 10px;
    letter-spacing: 0.12em;
  }
  .category-page .category-description,
  .category-hero-instruments .category-description {
    font-size: 0.9rem;
    line-height: 1.6;
  }
  .category-page .category-breadcrumb {
    font-size: 0.7rem;
    margin-bottom: 8px;
  }
  /* Same row: dropdown only, touch-friendly */
  .category-page .category-filters {
    max-width: none;
    margin-left: auto;
  }
  .category-filters .sort-select {
    min-height: 40px;
    padding: 8px 10px;
    font-size: 0.9rem;
    min-width: 95px;
  }
  /* Out of Stock badge: readable on mobile */
  .category-page .product-badge-out,
  .shop-page .product-badge-out {
    font-size: 0.7rem;
    padding: 6px 12px;
    top: 10px;
    right: 10px;
    min-height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
}

/* Tablet: hero padding only (product grid columns: shop.css) */
@media (min-width: 769px) and (max-width: 1024px) {
  .category-page .category-hero {
    padding: 56px 32px 48px;
  }
}

/* Topbar: theme like Contact */
.category-instruments-page .category-topbar {
  margin-bottom: 28px;
}

.category-instruments-page .filter-label,
.category-instruments-page .result-count {
  color: var(--navy);
  font-family: 'Cinzel', serif;
  font-weight: 600;
}

.category-instruments-page .result-count {
  color: var(--gray);
  font-family: 'Lato', sans-serif;
  font-weight: 400;
}

.category-instruments-page .sort-select {
  border-color: #e0e0e0;
  color: var(--dark);
}

.category-instruments-page .sort-select:hover,
.category-instruments-page .sort-select:focus {
  border-color: var(--crimson);
}

.category-hero-inner {
  max-width: 800px;
  margin: 0 auto;
}

/* Default (non-instruments) breadcrumb/title/description – theme fallbacks */
.category-breadcrumb a {
  color: var(--gold);
  text-decoration: none;
  transition: color 0.2s;
}

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

.category-breadcrumb span {
  color: rgba(255,255,255,0.6);
  margin: 0 6px;
}

.category-title {
  font-family: 'Cinzel', serif;
  font-size: clamp(1.75rem, 4vw, 2.5rem);
  font-weight: 700;
  color: var(--dark);
  letter-spacing: 0.2em;
  margin-bottom: 16px;
  line-height: 1.2;
}

.category-description {
  font-size: clamp(0.95rem, 1.2vw, 1.05rem);
  color: var(--gray);
  line-height: 1.75;
  opacity: 0.95;
}

.category-container {
  padding-top: clamp(32px, 5vw, 48px);
  background: var(--cream);
}

/* Product grid + card metrics: css/shop.css (.shop-page .shop-container) */

/* Category page: use same product layout as shop (shop.css .shop-container rules apply) */
.category-topbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 16px;
  margin-bottom: 28px;
}

.category-filters {
  display: flex;
  align-items: center;
  gap: 12px;
}

/* One row: Product (count) left, Availability right, aligned */
.category-page .category-topbar {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
}

.category-page .category-topbar .category-products-label {
  order: -1;
  flex-shrink: 0;
}

.category-page .category-topbar .category-filters {
  margin-left: auto;
  flex-shrink: 0;
}

.category-page .result-count {
  display: none; /* do not show product number */
}

/* Theme: navy/crimson/gold like Contact */
.filter-label {
  font-family: 'Cinzel', serif;
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--navy);
  letter-spacing: 0.06em;
}

/* "Products" label near availability dropdown */
.category-products-label {
  font-family: 'Cinzel', serif;
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--navy);
  letter-spacing: 0.06em;
}

/* Category page: show "Availability" label next to In Stock dropdown */
.category-page .category-filters .filter-label {
  margin: 0 8px 0 0;
}

.category-page .sort-select {
  border-color: #e0e0e0;
  color: var(--dark);
}

.category-page .sort-select:hover,
.category-page .sort-select:focus {
  border-color: var(--crimson);
}

.category-empty {
  text-align: center;
  padding: 48px 24px;
  color: var(--gray);
  font-size: 1rem;
}

/* Sale badge: uses global .product-badge.sale; ensure positioning context */
.category-page .product-img-wrap { position: relative; }

/* Out of Stock badge – theme (navy) */
.category-page .product-badge-out {
  background: var(--navy);
  color: var(--white);
  font-family: 'Cinzel', serif;
  font-size: 0.65rem;
  padding: 5px 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  font-weight: 600;
}

/* Disabled Add to Cart */
.add-btn-disabled,
.add-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
  pointer-events: none;
}

.shop-page .product-card.out-of-stock .product-img {
  opacity: 0.85;
}

.shop-page .product-card.out-of-stock .product-price {
  opacity: 0.8;
}

/* Fill viewport while the grid is empty/loading so the footer sits at the bottom (no cream band below it) */
body.shop-page.category-page {
  min-height: 100dvh;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

body.shop-page.category-page > .category-hero,
body.shop-page.category-page > .nepali-border,
body.shop-page.category-page > .shop-container.category-container,
body.shop-page.category-page > footer {
  flex-shrink: 0;
}

body.shop-page.category-page > .shop-container.category-container {
  flex: 1 1 auto;
  min-height: 0;
  width: 100%;
}
