/*
  Tema Claro - Clean White
  Identidade: limpa, arejada, moderna
  Paleta: fundo branco | texto escuro | detalhe marrom/acobreado
  Fontes: Cormorant Garamond (títulos) + Inter (corpo) + Script (marca)
*/

@import url("https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;0,600;0,700;1,400&family=Inter:wght@300;400;500;600;700&display=swap");

:root {
  color-scheme: light;

  /* ═══ Background & Superfície ═════════════════ */
  --background: hsl(0 0% 100%);
  --foreground: hsl(220 10% 10%);

  --card: hsl(0 0% 100%);
  --card-foreground: hsl(220 10% 10%);

  --popover: hsl(0 0% 100%);
  --popover-foreground: hsl(220 10% 10%);

  --primary: hsl(6 28% 35%);
  --primary-foreground: hsl(0 0% 100%);

  --secondary: hsl(220 10% 96%);
  --secondary-foreground: hsl(220 10% 10%);

  --muted: hsl(220 10% 96%);
  --muted-foreground: hsl(220 10% 45%);

  --accent: hsl(220 10% 96%);
  --accent-foreground: hsl(220 10% 10%);

  --destructive: hsl(0 72% 51%);
  --destructive-foreground: hsl(0 0% 100%);

  --border: hsl(220 10% 90%);
  --input: hsl(220 10% 90%);
  --ring: hsl(6 28% 35%);

  --radius: 0.5rem;

  /* ═══ Font Families ═══════════════════════════ */
  --font-heading: "Cormorant Garamond", Georgia, serif;
  --font-body:
    "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-brand:
    "Great Vibes", "Bickham Script Pro", "Edwardian Script ITC", cursive;

  /* ═══ Tipografia - Tamanhos ════════════════════ */
  --section-title-font-size: 2rem;
  --product-name-font-size: 1.125rem;
  --product-name-font-size-compact: 0.875rem;
  --product-price-font-size: 1.375rem;
  --product-price-font-size-compact: 1rem;
  --product-old-price-font-size: 0.875rem;
  --product-badge-font-size: 0.75rem;
  --header-logo-font-size: 1.5rem;
  --hero-title-font-size: 2.5rem;
  --hero-title-font-size-md: 4rem;
  --hero-subtitle-font-size: 1.125rem;
  --hero-subtitle-font-size-md: 1.25rem;
  --cart-badge-font-size: 0.625rem;
  --button-font-size: 0.875rem;
  --category-nav-font-size: 0.875rem;

  /* ═══ Layout - Espaçamento ═══════════════════ */
  --section-padding-y: 0.625rem;
  --section-padding-x: 1rem;
  --card-padding: 0.75rem;
  --card-padding-compact: 0.5rem;
  --product-grid-gap: 1rem;
  --product-grid-gap-compact: 0.75rem;
  --hero-padding-y: 3rem;
  --header-topbar-height: 4rem;
  --header-catnav-height: 3rem;

  /* ═══ Border Radius ══════════════════════════ */
  --badge-border-radius: 9999px;
  --search-border-radius: 9999px;
  --toggle-border-radius: 0.375rem;

  /* ═══ Logo ═══════════════════════════════════ */
  --header-logo-max-height: 5rem;
  --header-logo-max-width: 260px;

  /* ═══ Categorias ═════════════════════════════ */
  --category-image-display: inline-block;

  /* ═══ Preços ══════════════════════════════════ */
  --price-promo: hsl(6 28% 35%);
  --price-original: hsl(220 10% 45%);

  /* ═══ Badges ══════════════════════════════════ */
  --badge-discount-bg: hsl(6 28% 35%);
  --badge-discount-text: hsl(0 0% 100%);
  --badge-oos-bg: hsl(0 72% 51%);
  --badge-oos-text: hsl(0 0% 100%);

  /* ═══ Ratings ═════════════════════════════════ */
  --rating-star: hsl(40 60% 55%);
  --rating-star-empty: hsl(220 10% 85%);

  /* ═══ Footer ══════════════════════════════════ */
  --footer-bg: hsl(220 10% 8%);
  --footer-text: hsl(0 0% 96%);
  --footer-link: hsl(220 10% 60%);
  --footer-link-hover: hsl(6 28% 65%);

  /* ═══ Status de Pedido ════════════════════════ */
  --order-shipped-bg: hsl(217 91% 60%);
  --order-preparing-text: hsl(25 95% 53%);
  --order-preparing-border: hsl(25 95% 53%);

  /* ═══ Estados ═════════════════════════════════ */
  --success-text: hsl(161 94% 30%);
  --success-bg: hsl(156 72% 96%);
  --success-border: hsl(152 76% 80%);
  --error-bg: hsl(0 72% 51% / 0.1);

  /* ═══ Produto - Fora de Estoque ═══════════════ */
  --product-oos-bg: hsl(220 10% 96%);
  --product-oos-text: hsl(220 10% 45%);

  /* ═══ Reviews ═════════════════════════════════ */
  --section-reviews-bg: hsl(220 10% 96%);
  --section-reviews-card-bg: hsl(0 0% 100%);
  --section-reviews-text: hsl(220 10% 10%);

  /* ═══ Variação - Botão não selecionado ═══════ */
  --variation-btn-bg: hsl(0 0% 95%);
  --variation-btn-border: hsl(220 10% 80%);
  --variation-btn-text: hsl(220 10% 10%);
}

/* ═══ Aplicação das fontes ════════════════════ */

body {
  font-family: var(--font-body);
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

h1,
h2,
h3,
h4,
h5,
h6,
.section-title,
.hero-title {
  font-family: var(--font-heading);
  font-weight: 600;
  letter-spacing: 0.02em;
}

.brand-logo,
.header-logo-text {
  font-family: var(--font-brand);
  font-weight: 400;
  letter-spacing: 0.05em;
}

/* ═══ Ajustes pontuais de refinamento ════════ */

a {
  transition: color 0.2s ease;
}

button.bg-primary,
a.bg-primary {
  font-weight: 600;
  letter-spacing: 0.02em;
}

/* ═══ Botão Adicionar ao Carrinho ════════════ */
.product-card-container button {
  font-size: 0.75rem !important;
  line-height: 1.2;
  overflow: hidden;
  text-overflow: ellipsis;
  gap: 0.25rem;
}

.product-card-container button svg {
  width: 0.875rem;
  height: 0.875rem;
  flex-shrink: 0;
}

.product-card-container {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}