/* CSS Dinâmico - Gerado automaticamente pelas configurações da loja */
/* Última atualização: 2025-09-18 18:29:08 */

:root {
  /* Cores dinâmicas da loja */
  --primary: #a04ad9;
  --primary-rgb: 160, 74, 217;
  --primary-light: #c058ff;
  --primary-dark: #803bad;
  --primary-foreground: #f7f7f8;

  --secondary: #2c3e50;
  --secondary-rgb: 44, 62, 80;
  --secondary-light: #344a60;
  --secondary-dark: #233140;
  --secondary-foreground: #f7f7f8;

  --ring: #a04ad9;
  --accent: #a04ad9;
  --accent-foreground: #f7f7f8;

  /* Transparências com cores dinâmicas */
  --primary-alpha: rgba(160, 74, 217, 0.35);
  --primary-alpha-light: rgba(160, 74, 217, 0.08);
  --secondary-alpha: rgba(44, 62, 80, 0.35);
  --secondary-alpha-light: rgba(44, 62, 80, 0.08);

  /* Sombras com cores dinâmicas */
  --glow: 0 10px 28px rgba(160, 74, 217, 0.25);
  --glow-strong: 0 16px 40px rgba(160, 74, 217, 0.35);
  --shadow-light: 0 6px 16px rgba(160, 74, 217, 0.08);
  --shadow-strong: 0 12px 28px rgba(160, 74, 217, 0.25);

  /* Gradiente com cores dinâmicas */
  --bg-grad: radial-gradient(120% 120% at 0% 0%, rgba(160, 74, 217, .08), transparent 55%),
    radial-gradient(120% 120% at 100% 100%, rgba(44, 62, 80, .08), transparent 55%),
    linear-gradient(180deg, var(--background), #e8e6ef);

  /* Tema claro */
  --background: #f7f7f8;
  --foreground: #221f28;
  --card: #f7f7f8;
  --card-foreground: #221f28;
  --muted: #bdb7cd;
  --border: #bdb7cd;
}

/* Classes utilitárias com cores dinâmicas */
.btn-primary {
  background: var(--primary);
  color: var(--primary-foreground);
  border: 1px solid var(--primary);
}

.btn-primary:hover {
  background: var(--primary-dark);
  border-color: var(--primary-dark);
}

.btn-secondary {
  background: var(--secondary);
  color: var(--secondary-foreground);
  border: 1px solid var(--secondary);
}

.btn-secondary:hover {
  background: var(--secondary-dark);
  border-color: var(--secondary-dark);
}

.text-primary { color: var(--primary) !important; }
.text-secondary { color: var(--secondary) !important; }
.bg-primary { background-color: var(--primary) !important; }
.bg-secondary { background-color: var(--secondary) !important; }

/* Gradiente hero dinâmico */
.gradient-hero {
  background: linear-gradient(135deg, #803bad 0%, #a04ad9 50%, #2c3e50 100%);
}

/* Focus ring dinâmico */
.focus-ring:focus-visible {
  outline: 2px solid var(--primary);
  outline-offset: 2px;
}