/* ==========================================
   Vintajj 2025 Design System
   Curated Interior Studio
   ========================================== */

/* CSS Custom Properties - Design Tokens */
:root {
  /* Colors - Warm Cream/Ivory Base */
  --v25-bg: #FDF8F3;
  --v25-bg-card: #FDFCFA;
  --v25-fg: #3D3832;
  --v25-fg-muted: #8A8278;
  
  /* Primary - Warm Terracotta/Coral */
  --v25-primary: #A65A3C;
  --v25-primary-hover: #8B4A32;
  --v25-primary-fg: #FDFCFA;
  
  /* Secondary - Soft Sage Green */
  --v25-secondary: #D8E4D4;
  --v25-secondary-fg: #4A5D47;
  
  /* Accent - Dusty Rose */
  --v25-accent: #E8D4D0;
  --v25-accent-fg: #6B4D47;
  
  /* Borders & Inputs */
  --v25-border: #EBE6E0;
  --v25-input-bg: #F5F2EE;
  
  /* Status Colors */
  --v25-success: #5D8A66;
  --v25-warning: #D4A954;
  --v25-error: #C45B5B;
  --v25-info: #5B8AC4;
  
  /* Spacing */
  --v25-space-xs: 0.25rem;
  --v25-space-sm: 0.5rem;
  --v25-space-md: 1rem;
  --v25-space-lg: 1.5rem;
  --v25-space-xl: 2rem;
  --v25-space-2xl: 3rem;
  
  /* Border Radius */
  --v25-radius-sm: 0.375rem;
  --v25-radius-md: 0.5rem;
  --v25-radius-lg: 0.75rem;
  --v25-radius-xl: 1rem;
  --v25-radius-2xl: 1.5rem;
  --v25-radius-full: 9999px;
  
  /* Typography */
  --v25-font-sans: "Cormorant Garamond", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --v25-font-serif: "Inter", Georgia, serif;
  
  /* Shadows */
  --v25-shadow-sm: 0 1px 2px rgba(61, 56, 50, 0.05);
  --v25-shadow-md: 0 4px 6px -1px rgba(61, 56, 50, 0.07), 0 2px 4px -1px rgba(61, 56, 50, 0.04);
  --v25-shadow-lg: 0 10px 15px -3px rgba(61, 56, 50, 0.08), 0 4px 6px -2px rgba(61, 56, 50, 0.04);
  
  /* Transitions */
  --v25-transition-fast: 150ms ease;
  --v25-transition-normal: 300ms ease;
  --v25-transition-slow: 500ms ease;
  
  /* Z-index */
  --v25-z-dropdown: 100;
  --v25-z-sticky: 200;
  --v25-z-fixed: 300;
  --v25-z-modal-backdrop: 400;
  --v25-z-modal: 500;
  --v25-z-toast: 600;
}

/* ==========================================
   Base Styles
   ========================================== */
.v25-body {
  font-family: var(--v25-font-sans);
  background-color: var(--v25-bg);
  color: var(--v25-fg);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

/* Typography */
.v25-h1, .v25-h2, .v25-h3 {
  font-family: var(--v25-font-serif);
  font-weight: 500;
  line-height: 1.2;
}

.v25-h1 { font-size: 2rem; }
.v25-h2 { font-size: 1.5rem; }
.v25-h3 { font-size: 1.25rem; }

@media (min-width: 768px) {
  .v25-h1 { font-size: 2.5rem; }
  .v25-h2 { font-size: 1.875rem; }
  .v25-h3 { font-size: 1.5rem; }
}

.v25-text-muted {
  color: var(--v25-fg-muted);
}

/* ==========================================
   Layout Components
   ========================================== */

/* Container */
.v25-container {
  width: 100%;
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 var(--v25-space-md);
}

/* ==========================================
   Header - Sticky with Search
   ========================================== */
.v25-header {
  position: sticky;
  top: 0;
  z-index: var(--v25-z-sticky);
  background: rgba(250, 248, 245, 0.95);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border-bottom: 1px solid var(--v25-border);
}

.v25-header-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 64px;
  gap: var(--v25-space-md);
}

@media (min-width: 768px) {
  .v25-header-inner {
    height: 80px;
  }
}

/* Logo */
.v25-logo {
  display: flex;
  align-items: center;
  gap: var(--v25-space-sm);
  text-decoration: none;
  color: var(--v25-fg);
}

.v25-logo-text {
  font-family: var(--v25-font-serif);
  font-size: 1.25rem;
  font-weight: 600;
}

/* Search */
.v25-search {
  flex: 1;
  max-width: 400px;
  display: none;
}

@media (min-width: 768px) {
  .v25-search {
    display: block;
  }
}

.v25-search-input {
  width: 100%;
  padding: var(--v25-space-sm) var(--v25-space-md);
  padding-left: 3rem;
  background: var(--v25-input-bg);
  border: none;
  border-radius: var(--v25-radius-full);
  font-size: 0.875rem;
  transition: box-shadow var(--v25-transition-fast);
}

.v25-search-input:focus {
  outline: none;
  box-shadow: 0 0 0 2px var(--v25-primary);
}

.v25-search-wrapper {
  position: relative;
}

.v25-search-icon {
  position: absolute;
  left: var(--v25-space-md);
  top: 50%;
  transform: translateY(-50%);
  color: var(--v25-fg-muted);
  width: 18px;
  height: 18px;
}

/* Header Actions */
.v25-header-actions {
  display: flex;
  align-items: center;
  gap: var(--v25-space-xs);
}

/* Header icons - terracotta color */
.v25-header-actions .v25-btn-icon,
.v25-header-actions .v25-btn-ghost {
  color: var(--v25-primary, #A65A3C) !important;
}
.v25-header-actions .v25-btn-icon svg,
.v25-header-actions .v25-btn-ghost svg {
  color: inherit;
  fill: none !important;
  stroke: currentColor;
}

/* Header Catalog Button - in main header line */
.v25-header-catalog {
  position: relative;
  margin-left: 1rem;
}
.v25-header-catalog-btn {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  background: var(--v25-primary, #A65A3C);
  border: none;
  border-radius: var(--v25-radius-full, 9999px);
  color: white;
  font-size: 0.875rem;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s ease;
}
.v25-header-catalog-btn:hover {
  background: var(--v25-primary-hover, #8B4A32);
}
.v25-header-catalog-btn[aria-expanded="true"] {
  background: var(--v25-primary-hover, #8B4A32);
}
.v25-header-catalog-btn svg {
  color: white;
}
.v25-header-catalog-chevron {
  transition: transform 0.2s ease;
}
.v25-header-catalog-btn[aria-expanded="true"] .v25-header-catalog-chevron {
  transform: rotate(180deg);
}

/* Header Mega-menu dropdown */
.v25-header-megamenu {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  min-width: 600px;
  max-width: 900px;
  background: #FFFFFF;
  border: 1px solid var(--v25-border, #EBE6E0);
  border-radius: 12px;
  box-shadow: 0 10px 40px rgba(0,0,0,0.12);
  z-index: 1000;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.2s ease, visibility 0.2s ease;
}
.v25-header-megamenu:not([hidden]) {
  opacity: 1;
  visibility: visible;
}
.v25-header-megamenu-inner {
  padding: 24px;
}

/* Mega-menu Sections Layout */
.v25-megamenu-sections {
  display: grid;
  grid-template-columns: 1fr 1fr 2fr;
  gap: 24px;
}
.v25-megamenu-section {
  min-width: 0;
}
.v25-megamenu-section-wide {
  grid-column: span 1;
}
.v25-megamenu-section-title {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.8125rem;
  font-weight: 600;
  color: #78716C;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin: 0 0 12px 0;
  padding-bottom: 8px;
  border-bottom: 1px solid #EBE6E0;
}
.v25-megamenu-section-title svg {
  color: #A65A3C;
  flex-shrink: 0;
}
.v25-megamenu-links {
  list-style: none;
  padding: 0;
  margin: 0;
}
.v25-megamenu-links li {
  margin-bottom: 8px;
}
.v25-megamenu-links a {
  color: #44403c !important;
  text-decoration: none;
  font-size: 0.875rem;
  transition: color 0.2s ease;
}
.v25-megamenu-links a:hover {
  color: #A65A3C !important;
}
.v25-megamenu-cat-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px;
}
.v25-megamenu-cat-item {
  display: block;
  padding: 10px 12px;
  background: #F5F5F4;
  border-radius: 8px;
  color: #44403c !important;
  text-decoration: none;
  font-size: 0.8125rem;
  font-weight: 500;
  transition: all 0.2s ease;
}
.v25-megamenu-cat-item:hover {
  background: #F5EFE6;
  color: #A65A3C !important;
}
.v25-megamenu-footer {
  margin-top: 20px;
  padding-top: 16px;
  border-top: 1px solid #EBE6E0;
  text-align: center;
}
.v25-megamenu-all {
  color: #A65A3C !important;
  text-decoration: none;
  font-weight: 600;
  font-size: 0.875rem;
}
.v25-megamenu-all:hover {
  text-decoration: underline;
}

/* Header Contacts - Эталон: обе иконки терракотовые, текст тёмный, хороший gap */
.v25-header-contacts {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  margin-left: auto;
  margin-right: 2rem;
}
.v25-header-phone,
.v25-header-email {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 0.875rem;
  font-weight: 500;
  text-decoration: none;
  white-space: nowrap;
  color: #44403c;
  transition: color 0.2s ease;
}
.v25-header-phone svg,
.v25-header-email svg {
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  color: var(--v25-primary, #A65A3C);
}
.v25-header-phone:hover,
.v25-header-email:hover {
  color: var(--v25-primary, #A65A3C);
}

/* ==========================================
   Buttons
   ========================================== */
.v25-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--v25-space-sm);
  padding: var(--v25-space-sm) var(--v25-space-lg);
  font-size: 0.875rem;
  font-weight: 500;
  border-radius: var(--v25-radius-full);
  border: none;
  cursor: pointer;
  transition: all var(--v25-transition-fast);
  text-decoration: none;
}

.v25-btn-primary {
  background: var(--v25-primary);
  color: var(--v25-primary-fg);
}

.v25-btn-primary:hover {
  background: var(--v25-primary-hover);
}

.v25-btn-secondary {
  background: var(--v25-secondary);
  color: var(--v25-secondary-fg);
}

.v25-btn-ghost {
  background: transparent;
  color: var(--v25-fg);
}

.v25-btn-ghost:hover {
  background: var(--v25-input-bg);
}

.v25-btn-icon {
  width: 40px;
  height: 40px;
  padding: 0;
  border-radius: var(--v25-radius-full);
}

.v25-btn-lg {
  padding: var(--v25-space-md) var(--v25-space-xl);
  font-size: 1rem;
}

/* ==========================================
   Mobile Bottom Navigation
   ========================================== */
.v25-bottom-nav {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: var(--v25-z-fixed);
  background: rgba(250, 248, 245, 0.95);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border-top: 1px solid var(--v25-border);
  padding-bottom: env(safe-area-inset-bottom);
}

@media (min-width: 768px) {
  .v25-bottom-nav {
    display: none;
  }
}

.v25-bottom-nav-inner {
  display: flex;
  align-items: center;
  justify-content: space-around;
  height: 64px;
}

.v25-bottom-nav-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  flex: 1;
  padding: var(--v25-space-sm);
  text-decoration: none;
  color: var(--v25-fg-muted);
  font-size: 10px;
  transition: color var(--v25-transition-fast);
}

.v25-bottom-nav-item.active,
.v25-bottom-nav-item:hover {
  color: var(--v25-primary);
}

.v25-bottom-nav-item svg {
  width: 20px;
  height: 20px;
}

/* Catalog Button (Special - Balloon) */
.v25-bottom-nav-catalog {
  position: relative;
}

.v25-bottom-nav-catalog-btn {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: var(--v25-primary);
  color: var(--v25-primary-fg);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: -16px;
  box-shadow: var(--v25-shadow-lg);
}

/* ==========================================
   Hero Section
   ========================================== */
.v25-hero {
  position: relative;
  margin-bottom: var(--v25-space-xl);
}

.v25-hero-image {
  width: 100%;
  aspect-ratio: 16/9;
  object-fit: cover;
  border-radius: var(--v25-radius-xl);
}

@media (max-width: 767px) {
  .v25-hero-image {
    aspect-ratio: 4/3;
    border-radius: 0;
  }
}

.v25-hero-content {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: var(--v25-space-xl);
  background: linear-gradient(to top, rgba(0,0,0,0.6), transparent);
  color: white;
  border-radius: 0 0 var(--v25-radius-xl) var(--v25-radius-xl);
}

@media (max-width: 767px) {
  .v25-hero-content {
    padding: var(--v25-space-lg);
    border-radius: 0;
  }
}

.v25-hero-title {
  font-family: var(--v25-font-serif);
  font-size: 1.5rem;
  font-weight: 500;
  margin-bottom: var(--v25-space-sm);
}

@media (min-width: 768px) {
  .v25-hero-title {
    font-size: 2rem;
  }
}

.v25-hero-subtitle {
  opacity: 0.9;
  margin-bottom: var(--v25-space-md);
}

/* ==========================================
   Quick Access Chips
   ========================================== */
.v25-chips {
  display: flex;
  gap: var(--v25-space-sm);
  overflow-x: auto;
  padding: var(--v25-space-md) 0;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.v25-chips::-webkit-scrollbar {
  display: none;
}

.v25-chip {
  display: inline-flex;
  align-items: center;
  gap: var(--v25-space-xs);
  padding: var(--v25-space-sm) var(--v25-space-md);
  background: var(--v25-bg-card);
  border: 1px solid var(--v25-border);
  border-radius: var(--v25-radius-full);
  font-size: 0.875rem;
  white-space: nowrap;
  text-decoration: none;
  color: var(--v25-fg);
  transition: all var(--v25-transition-fast);
}

.v25-chip:hover {
  background: var(--v25-primary);
  color: var(--v25-primary-fg);
  border-color: var(--v25-primary);
}

/* ==========================================
   Curated Collections Grid
   ========================================== */
.v25-collections {
  margin-bottom: var(--v25-space-2xl);
}

.v25-section-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: var(--v25-space-lg);
}

.v25-section-title {
  font-family: var(--v25-font-serif);
  font-size: 1.5rem;
  font-weight: 500;
}

.v25-section-link {
  display: flex;
  align-items: center;
  gap: var(--v25-space-xs);
  color: var(--v25-primary);
  text-decoration: none;
  font-size: 0.875rem;
  font-weight: 500;
}

.v25-collections-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--v25-space-sm);
}

@media (min-width: 768px) {
  .v25-collections-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: var(--v25-space-md);
  }
}

.v25-collection-card {
  position: relative;
  overflow: hidden;
  border-radius: var(--v25-radius-xl);
  aspect-ratio: 4/3;
  text-decoration: none;
}

.v25-collection-card:first-child {
  grid-column: span 2;
  aspect-ratio: 2/1;
}

@media (min-width: 768px) {
  .v25-collection-card:first-child {
    grid-column: span 1;
    aspect-ratio: 4/3;
  }
}

.v25-collection-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--v25-transition-slow);
}

.v25-collection-card:hover .v25-collection-image {
  transform: scale(1.05);
}

.v25-collection-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(0,0,0,0.6) 0%, rgba(0,0,0,0.2) 50%, transparent 100%);
}

.v25-collection-content {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: var(--v25-space-md);
  color: white;
}

.v25-collection-title {
  font-family: var(--v25-font-serif);
  font-size: 1rem;
  font-weight: 500;
  margin-bottom: 2px;
}

@media (min-width: 768px) {
  .v25-collection-title {
    font-size: 1.125rem;
  }
}

.v25-collection-count {
  font-size: 0.75rem;
  opacity: 0.8;
}

/* ==========================================
   Product Card
   ========================================== */
.v25-products-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--v25-space-sm);
}

@media (min-width: 768px) {
  .v25-products-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: var(--v25-space-md);
  }
}

@media (min-width: 1024px) {
  .v25-products-grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

.v25-product-card {
  position: relative;
  text-decoration: none;
  color: var(--v25-fg);
}

.v25-product-image-wrapper {
  position: relative;
  aspect-ratio: 3/4;
  border-radius: var(--v25-radius-xl);
  overflow: hidden;
  background: var(--v25-input-bg);
  margin-bottom: var(--v25-space-sm);
}

.v25-product-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--v25-transition-slow);
}

.v25-product-card:hover .v25-product-image {
  transform: scale(1.05);
}

/* Product Badges */
.v25-badge {
  display: inline-flex;
  padding: 2px var(--v25-space-sm);
  font-size: 0.75rem;
  font-weight: 500;
  border-radius: var(--v25-radius-sm);
}

.v25-badge-sale {
  background: var(--v25-primary);
  color: var(--v25-primary-fg);
}

.v25-badge-new {
  background: var(--v25-secondary);
  color: var(--v25-secondary-fg);
}

.v25-badge-hit {
  background: var(--v25-accent);
  color: var(--v25-accent-fg);
}

.v25-product-badge {
  position: absolute;
  top: var(--v25-space-sm);
  left: var(--v25-space-sm);
}

/* Favorite Button */
.v25-product-favorite {
  position: absolute;
  top: var(--v25-space-sm);
  right: var(--v25-space-sm);
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: rgba(255,255,255,0.9);
  backdrop-filter: blur(4px);
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transition: opacity var(--v25-transition-fast);
  border: none;
  cursor: pointer;
}

.v25-product-card:hover .v25-product-favorite {
  opacity: 1;
}

.v25-product-favorite.active {
  opacity: 1;
}

.v25-product-favorite svg {
  width: 16px;
  height: 16px;
  color: var(--v25-fg);
}

.v25-product-favorite.active svg {
  color: var(--v25-primary);
  fill: var(--v25-primary);
}

/* Quick Add Button (Desktop) */
.v25-product-quick-add {
  position: absolute;
  bottom: var(--v25-space-sm);
  left: var(--v25-space-sm);
  right: var(--v25-space-sm);
  padding: var(--v25-space-sm);
  background: var(--v25-primary);
  color: var(--v25-primary-fg);
  border: none;
  border-radius: var(--v25-radius-lg);
  font-size: 0.875rem;
  font-weight: 500;
  cursor: pointer;
  opacity: 0;
  transform: translateY(8px);
  transition: all var(--v25-transition-fast);
}

@media (min-width: 768px) {
  .v25-product-card:hover .v25-product-quick-add {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Product Info */
.v25-product-name {
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.3;
  margin-bottom: var(--v25-space-xs);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.v25-product-price {
  display: flex;
  align-items: center;
  gap: var(--v25-space-sm);
}

.v25-product-price-current {
  font-weight: 600;
}

.v25-product-price-old {
  font-size: 0.875rem;
  color: var(--v25-fg-muted);
  text-decoration: line-through;
}

/* Stock Status */
.v25-stock-low {
  font-size: 0.75rem;
  color: var(--v25-warning);
}

.v25-stock-out {
  font-size: 0.75rem;
  color: var(--v25-fg-muted);
}

.v25-stock-preorder {
  font-size: 0.75rem;
  color: var(--v25-info);
}

/* Out of Stock Overlay */
.v25-product-unavailable .v25-product-image-wrapper::after {
  content: "Нет в наличии";
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(250, 248, 245, 0.7);
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--v25-fg-muted);
}

/* ==========================================
   Skeleton Loader
   ========================================== */
.v25-skeleton {
  background: linear-gradient(90deg, var(--v25-input-bg) 25%, var(--v25-bg-card) 50%, var(--v25-input-bg) 75%);
  background-size: 200% 100%;
  animation: v25-skeleton-loading 1.5s infinite;
  border-radius: var(--v25-radius-md);
}

@keyframes v25-skeleton-loading {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* ==========================================
   Trust Badges
   ========================================== */
.v25-trust-badges {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--v25-space-md);
  padding: var(--v25-space-lg);
  background: var(--v25-input-bg);
  border-radius: var(--v25-radius-xl);
  margin: var(--v25-space-2xl) 0;
}

.v25-trust-badge {
  text-align: center;
}

.v25-trust-badge svg {
  width: 24px;
  height: 24px;
  color: var(--v25-primary);
  margin-bottom: var(--v25-space-xs);
}

.v25-trust-badge-text {
  font-size: 0.75rem;
  color: var(--v25-fg-muted);
}

/* ==========================================
   Sticky CTA (Mobile Product Page)
   ========================================== */
.v25-sticky-cta {
  position: fixed;
  bottom: 64px; /* Above bottom nav */
  left: 0;
  right: 0;
  z-index: var(--v25-z-sticky);
  background: rgba(250, 248, 245, 0.95);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border-top: 1px solid var(--v25-border);
  padding: var(--v25-space-md);
}

@media (min-width: 768px) {
  .v25-sticky-cta {
    display: none;
  }
}

.v25-sticky-cta-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: var(--v25-space-sm);
}

.v25-sticky-cta-price {
  font-size: 1.125rem;
  font-weight: 600;
}

.v25-sticky-cta-status {
  font-size: 0.875rem;
  color: var(--v25-success);
}

/* ==========================================
   Bottom Sheet (Filters)
   ========================================== */
.v25-sheet-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.5);
  z-index: var(--v25-z-modal-backdrop);
  opacity: 0;
  visibility: hidden;
  transition: all var(--v25-transition-normal);
}

.v25-sheet-backdrop.active {
  opacity: 1;
  visibility: visible;
}

.v25-sheet {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: var(--v25-z-modal);
  background: var(--v25-bg);
  border-radius: var(--v25-radius-2xl) var(--v25-radius-2xl) 0 0;
  max-height: 85vh;
  transform: translateY(100%);
  transition: transform var(--v25-transition-normal);
}

.v25-sheet.active {
  transform: translateY(0);
}

.v25-sheet-handle {
  width: 40px;
  height: 4px;
  background: var(--v25-border);
  border-radius: var(--v25-radius-full);
  margin: var(--v25-space-sm) auto var(--v25-space-md);
}

.v25-sheet-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 var(--v25-space-md) var(--v25-space-md);
  border-bottom: 1px solid var(--v25-border);
}

.v25-sheet-title {
  font-family: var(--v25-font-serif);
  font-size: 1.25rem;
  font-weight: 500;
}

.v25-sheet-content {
  padding: var(--v25-space-md);
  overflow-y: auto;
  max-height: calc(85vh - 120px);
}

.v25-sheet-footer {
  padding: var(--v25-space-md);
  border-top: 1px solid var(--v25-border);
  padding-bottom: calc(var(--v25-space-md) + env(safe-area-inset-bottom));
}

/* ==========================================
   Active Filter Chips
   ========================================== */
.v25-active-filters {
  display: flex;
  flex-wrap: wrap;
  gap: var(--v25-space-xs);
  padding: var(--v25-space-sm) 0;
}

.v25-active-filter {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px var(--v25-space-sm);
  background: var(--v25-secondary);
  color: var(--v25-secondary-fg);
  border-radius: var(--v25-radius-full);
  font-size: 0.75rem;
}

.v25-active-filter-remove {
  width: 14px;
  height: 14px;
  cursor: pointer;
}

/* ==========================================
   Accordion
   ========================================== */
.v25-accordion {
  border: 1px solid var(--v25-border);
  border-radius: var(--v25-radius-xl);
  overflow: hidden;
}

.v25-accordion-item {
  border-bottom: 1px solid var(--v25-border);
}

.v25-accordion-item:last-child {
  border-bottom: none;
}

.v25-accordion-trigger {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: var(--v25-space-md);
  background: none;
  border: none;
  font-size: 1rem;
  font-weight: 500;
  text-align: left;
  cursor: pointer;
}

.v25-accordion-trigger svg {
  width: 20px;
  height: 20px;
  transition: transform var(--v25-transition-fast);
}

.v25-accordion-item.open .v25-accordion-trigger svg {
  transform: rotate(180deg);
}

.v25-accordion-content {
  display: none;
  padding: 0 var(--v25-space-md) var(--v25-space-md);
  color: var(--v25-fg-muted);
  font-size: 0.875rem;
}

.v25-accordion-item.open .v25-accordion-content {
  display: block;
}

/* ==========================================
   AI Assistant Button
   ========================================== */
.v25-ai-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--v25-space-sm);
  width: 100%;
  padding: var(--v25-space-md);
  background: var(--v25-secondary);
  color: var(--v25-secondary-fg);
  border: none;
  border-radius: var(--v25-radius-full);
  font-size: 0.875rem;
  font-weight: 500;
  cursor: pointer;
  transition: all var(--v25-transition-fast);
}

.v25-ai-btn:hover {
  background: var(--v25-primary);
  color: var(--v25-primary-fg);
}

.v25-ai-btn svg {
  width: 18px;
  height: 18px;
}

/* ==========================================
   Utilities
   ========================================== */
.v25-pb-bottom-nav {
  padding-bottom: 80px;
}

@media (min-width: 768px) {
  .v25-pb-bottom-nav {
    padding-bottom: 0;
  }
}

.v25-hide-mobile {
  display: none;
}

@media (min-width: 768px) {
  .v25-hide-mobile {
    display: block;
  }
}

.v25-hide-desktop {
  display: block;
}

@media (min-width: 768px) {
  .v25-hide-desktop {
    display: none;
  }
}

/* Smooth scroll */
html {
  scroll-behavior: smooth;
}

/* Hide scrollbar */
.v25-hide-scrollbar::-webkit-scrollbar {
  display: none;
}

.v25-hide-scrollbar {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

/* ================================ */
/* ROOMS HORIZONTAL SCROLL (v25)   */
/* ================================ */

/* Desktop: Grid layout */
.v25-rooms-scroll {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 16px;
}

/* Room card count badge */
.v25-room-count {
    position: absolute;
    bottom: 8px;
    right: 8px;
    background: rgba(255,255,255,0.9);
    color: #1c1917;
    font-size: 11px;
    padding: 2px 8px;
    border-radius: 12px;
    font-weight: 500;
}

/* Mobile: Horizontal scroll with snap */
@media (max-width: 768px) {
    .v25-rooms-scroll {
        display: flex;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        scroll-behavior: smooth;
        -webkit-overflow-scrolling: touch;
        gap: 12px;
        padding-bottom: 8px;
        margin: 0 -16px;
        padding-left: 16px;
        padding-right: 16px;
    }
    
    .v25-rooms-scroll::-webkit-scrollbar {
        display: none;
    }
    
    .v25-rooms-scroll {
        -ms-overflow-style: none;
        scrollbar-width: none;
    }
    
    .v25-rooms-scroll .v25-room-card {
        flex: 0 0 auto;
        width: 160px;
        min-width: 160px;
        scroll-snap-align: start;
    }
    
    .v25-rooms-scroll .v25-room-card img {
        height: 200px;
    }
}

/* Tablet: 3 columns with scroll */
@media (min-width: 769px) and (max-width: 1024px) {
    .v25-rooms-scroll {
        grid-template-columns: repeat(3, 1fr);
    }
}

/* Large desktop: up to 6 columns */
@media (min-width: 1200px) {
    .v25-rooms-scroll {
        grid-template-columns: repeat(6, 1fr);
    }
}

/* ================================ */
/* PRODUCTS HORIZONTAL SCROLL (v25) */
/* ================================ */

.v25-products-scroll {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
    gap: 16px;
    padding-bottom: 16px;
    margin: 0 -16px;
    padding-left: 16px;
    padding-right: 16px;
}

.v25-products-scroll::-webkit-scrollbar {
    display: none;
}

.v25-products-scroll {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

.v25-products-scroll .v25-product-card {
    flex: 0 0 auto !important;
    width: 180px !important;
    min-width: 180px !important;
    max-width: 180px !important;
    scroll-snap-align: start;
}

/* Tablet: wider cards */
@media (min-width: 768px) {
    .v25-products-scroll .v25-product-card {
        width: 220px !important;
        min-width: 220px !important;
        max-width: 220px !important;
    }
}

/* Desktop: even wider, but still scroll */
@media (min-width: 1024px) {
    .v25-products-scroll {
        gap: 20px;
    }

    .v25-products-scroll .v25-product-card {
        width: 260px !important;
        min-width: 260px !important;
        max-width: 260px !important;
    }
}

/* Product image inside scroll container */
.v25-products-scroll .v25-product-image {
    position: relative;
    aspect-ratio: 1/1;
    border-radius: 12px;
    overflow: hidden;
    background: #f5f5f5;
}

.v25-products-scroll .v25-product-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.v25-products-scroll .v25-product-name {
    font-size: 0.875rem;
    line-height: 1.3;
    margin-top: 8px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.v25-products-scroll .v25-product-price {
    margin-top: 4px;
    font-size: 0.9375rem;
    font-weight: 600;
}

/* Hide old desktop-nav - catalog moved to header */
.v25-desktop-nav {
    display: none !important;
}

/* ===========================================
   Combined Catalog + Search Group (Ozon-style)
   =========================================== */
.v25-catalog-search-group {
    display: flex;
    align-items: stretch;
    flex: 1;
    max-width: 520px;
    margin-left: 1rem;
    border-radius: 8px;
    overflow: visible; /* For mega-menu dropdown */
    gap: 0; /* No gap between elements */
}

/* Remove margin from catalog when inside group */
.v25-catalog-search-group .v25-header-catalog {
    margin-left: 0;
    margin-right: 0;
    position: relative !important;
    z-index: 3 !important; /* Above search - so chevron stays visible */
}

/* Catalog button - rounded only on left, no right margin */
.v25-catalog-search-group .v25-header-catalog-btn {
    border-radius: 8px 0 0 8px;
    height: 100%;
    margin: 0;
    border-right: none;
}

/* Search container - goes UNDER catalog button for seamless look */
.v25-catalog-search-group .v25-search {
    flex: 1;
    max-width: none;
    margin: 0 !important;
    padding: 0 !important;
    margin-left: -20px !important; /* Overlap - bracket goes under catalog */
    position: relative !important;
    z-index: 1 !important; /* Below catalog button */
}

/* Search form as flex container */
.v25-catalog-search-group .v25-search-wrapper {
    display: flex;
    align-items: stretch;
    height: 100%;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    background: transparent !important;
}

/* Dark bracket for search icon - goes under catalog button */
.v25-catalog-search-group .v25-search-icon-bracket {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: var(--v25-primary, #A65A3C) !important;
    padding: 0 14px 0 30px !important; /* Extra left padding fills area under catalog */
    flex-shrink: 0 !important;
    border-radius: 0 !important;
    margin: 0 !important;
    border: none !important;
    box-shadow: none !important;
}

/* Search icon inside bracket - white, static position */
.v25-catalog-search-group .v25-search-icon-bracket .v25-search-icon {
    position: static !important;
    transform: none !important;
    color: #fff !important;
    stroke: #fff !important;
    width: 18px !important;
    height: 18px !important;
    left: auto !important;
    top: auto !important;
}

/* Search input - light background, rounded only on right */
.v25-catalog-search-group .v25-search-input {
    flex: 1 !important;
    border: none !important;
    border-radius: 0 8px 8px 0 !important;
    background: #f5f5f4 !important;
    padding: 10px 16px !important;
    margin: 0 !important;
    box-shadow: none !important;
}

.v25-catalog-search-group .v25-search-input:focus {
    outline: none !important;
    box-shadow: none !important;
    background: #f0efee !important;
}

/* Bottom Nav Catalog Button as Button Element */
button.v25-bottom-nav-item {
  background: none;
  border: none;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
}

/* Mobile Product Cards Improvements */
@media (max-width: 480px) {
    .v25-product-card { border-radius: 8px !important; }
    .v25-badge, .v25-badge-sale { font-size: 10px !important; padding: 3px 8px !important; }
    .v25-badges { top: 8px !important; left: 8px !important; }
    .v25-wishlist-btn { top: 8px !important; right: 8px !important; width: 32px !important; height: 32px !important; }
    .v25-cart-btn { bottom: 8px !important; right: 8px !important; width: 32px !important; height: 32px !important; }
    .v25-card-content { padding: 10px !important; }
    .v25-product-name { font-size: 13px !important; line-height: 1.3 !important; }
    .v25-price { font-size: 15px !important; }
    .v25-old-price { font-size: 12px !important; }
}

/* Outline icons - heart, etc */
.v25-icon-outline {
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2 !important;
}
