/* ==========================================================
   TEMA 04 — OFF-WHITE + ROSÉ
   Apenas cores, fundos, bordas, sombras e contrastes.
   NÃO altera layout, dimensões, posicionamento ou ordem.

   IMPORTANTE: carregar ESTE arquivo DEPOIS dos dois CSS atuais.
   ========================================================== */

:root {
  /* Base da interface */
  --background: #F8F3F3;
  --foreground: #302B2B;
  --card: #FFFDFD;
  --card-foreground: #302B2B;
  --popover: #FFFDFD;
  --popover-foreground: #302B2B;
  --primary: #B88982;
  --primary-foreground: #FFFFFF;
  --secondary: #F1E6E5;
  --secondary-foreground: #5E4C4A;
  --muted: #F2EAEA;
  --muted-foreground: #746A68;
  --accent: #B88982;
  --accent-foreground: #FFFFFF;
  --border: #E5D5D3;
  --input: #DDC9C6;
  --ring: #B88982;

  /* Variáveis do CSS personalizado existente */
  --gold: #B88982;
  --gold-light: #D9B7B1;
  --gold-dark: #8F625D;
  --noir: #302B2B;
  --noir-soft: #F1E8E7;

  --black: #302B2B;
  --white: #FFFDFD;
  --text: #5F5553;
  --muted: #746A68;

  /* Cores auxiliares */
  --rose: #B88982;
  --rose-light: #D9B7B1;
  --rose-dark: #8F625D;
  --offwhite: #F8F3F3;
  --surface: #FFFDFD;
  --surface-soft: #F4EBEA;
}

/* Base */
html,
body {
  background: #F8F3F3 !important;
  color: #302B2B !important;
}

body {
  background-color: #F8F3F3 !important;
  color: #302B2B !important;
}

/* Utilitários Tailwind que atualmente puxam o tema escuro
.bg-background,
.bg-background\/80 {
  background-color: #F8F3F3 !important;
} */

.bg-card,
.bg-popover {
  background-color: #FFFDFD !important;
}

.bg-muted,
.bg-muted\/50,
.bg-secondary {
  background-color: #F1E6E5 !important;
}

.bg-noir-soft {
  background-color: #F1E8E7 !important;
}

.bg-foreground {
  background-color: #302B2B !important;
}

.text-foreground,
.text-noir,
.text-noir\/70,
.text-card-foreground,
.text-popover-foreground {
  color: #302B2B !important;
}

.text-muted-foreground {
    color: #000000 !important;
}

.text-primary-foreground {
  color: #FFFFFF !important;
}

.border,
.border-border,
.border-border\/30,
.border-border\/50,
.border-input {
  border-color: #E5D5D3 !important;
}

.border-primary,
.border-primary\/20,
.border-primary\/30,
.border-primary\/50 {
  border-color: #B88982 !important;
  margin-top: 20px;
}

a.inline-flex.items-center.justify-center.rounded-full.border.border-input.bg-transparent.px-6.py-3.text-sm.font-medium.text-foreground.transition-colors.hover\:bg-accent{
    width: 35%;
    border: 2px solid;
    font-weight: bold;
    text-transform: uppercase;
}

/* Gradientes do tema anterior */
.from-primary {
  --tw-gradient-from: #B88982 !important;
}

.to-gold-light {
  --tw-gradient-to: #D9B7B1 !important;
}

.from-card {
  --tw-gradient-from: #FFFDFD !important;
}

.to-background {
  --tw-gradient-to: #F8F3F3 !important;
}

.from-\[\#f5f0e0\] {
  --tw-gradient-from: #F8F3F3 !important;
}

.via-\[\#f0e8d0\] {
  --tw-gradient-via: #F1E6E5 !important;
}

.to-\[\#e8d8b0\] {
  --tw-gradient-to: #E6D1CF !important;
}

/* Botões e elementos principais */
a.bg-primary,
button.bg-primary,
.bg-primary {
  background-color: #f8d67a!important;
  color: #FFFFFF !important;
}

button:hover,
a:hover {
  --tw-ring-color: #B88982;
}

/* Scrollbar */
::-webkit-scrollbar-track {
  background: #F3EAEA !important;
}

::-webkit-scrollbar-thumb {
  background: #B88982 !important;
  border-color: #F3EAEA !important;
}

::-webkit-scrollbar-thumb:hover {
  background: #8F625D !important;
}

html {
  scrollbar-color: #B88982 #F3EAEA !important;
}

.app::-webkit-scrollbar-track {
  background: #F3EAEA !important;
}

.app::-webkit-scrollbar-thumb {
  background: #B88982 !important;
  border-color: #F3EAEA !important;
}

/* Bordas e interações já existentes no CSS personalizado */
.border:hover,
.gold-border:hover,
#palestrantes .border:hover,
#palestrantes .gold-border:hover {
  border-color: #B88982 !important;
}

#palestrantes .rounded-2xl:hover {
  background: #B88982 !important;
}

#palestrantes .rounded-2xl:hover p,
#palestrantes .rounded-2xl:hover h2 {
  color: #FFFFFF !important;
}

/* ==========================================================
   PAINEL DO PALESTRANTE ESPECIAL
   Mantém todas as dimensões e posicionamentos originais.
   ========================================================== */

.special-guest-card {
  border-color: rgba(184, 137, 130, 0.55) !important;
  background-color: #FFFDFD !important;
  background-blend-mode: multiply;
  box-shadow:
    0 25px 70px rgba(93, 65, 62, 0.12),
    0 0 55px rgba(184, 137, 130, 0.08) !important;
}

.inner-border {
  border-color: rgba(184, 137, 130, 0.20) !important;
}

.ambient-glow,
.card-glow {
  background: rgba(184, 137, 130, 0.10) !important;
}

.guest-halo-large {
  border-color: rgba(184, 137, 130, 0.60) !important;
  background:
    radial-gradient(
      circle,
      rgba(184, 137, 130, 0.13),
      rgba(184, 137, 130, 0.035) 55%,
      transparent 72%
    ) !important;
  box-shadow:
    0 0 38px rgba(184, 137, 130, 0.20),
    inset 0 0 50px rgba(184, 137, 130, 0.08) !important;
}

.guest-halo-small {
  border-color: rgba(184, 137, 130, 0.22) !important;
}

/* Gradiente inferior da foto: claro e suave, sem alterar a imagem */
.photo-gradient {
  background:
    linear-gradient(
      to top,
      rgba(48, 43, 43, 0.42) 0%,
      rgba(48, 43, 43, 0.16) 35%,
      rgba(48, 43, 43, 0) 100%
    ) !important;
}

.photo-gold-line {
  background:
    linear-gradient(
      90deg,
      transparent,
      #B88982,
      #D9B7B1,
      #B88982,
      transparent
    ) !important;
  box-shadow: 0 0 15px rgba(184, 137, 130, 0.30) !important;
}

.guest-label,
.guest-profession,
.guest-highlight p {
  color: #8F625D !important;
}

.guest-name {
  color: #302B2B !important;
}

.guest-name span {
  color: #B88982 !important;
}

.guest-profession {
  border-color: rgba(184, 137, 130, 0.70) !important;
  background: rgba(184, 137, 130, 0.05) !important;
}

.guest-description {
  color: #4F4745 !important;
}

.guest-highlight {
  border-color: rgba(184, 137, 130, 0.55) !important;
  background: #F4E9E8 !important;
}

.highlight-icon {
  border-color: #B88982 !important;
  box-shadow: 0 0 20px rgba(184, 137, 130, 0.14) !important;
}

.guest-footer span {
  background: rgba(184, 137, 130, 0.40) !important;
}

.guest-footer p {
  color: #746A68 !important;
}

.label-line-left {
  background: linear-gradient(90deg, transparent, #B88982) !important;
}

.label-line-right {
  background: linear-gradient(90deg, #B88982, transparent) !important;
}

/* Partículas decorativas */
.particle {
  background: #D9B7B1 !important;
  box-shadow: 0 0 14px rgba(184, 137, 130, 0.55) !important;
}

/* ==========================================================
   CRONÔMETRO / LOTES
   ========================================================== */

.lote1-countdown-title {
  color: #8F625D !important;
}

.lote1-time-box span {
  color: #302B2B !important;
}

.lote1-time-box small {
  color: #746A68 !important;
}

.lote1-countdown-warning {
  color: #746A68 !important;
}

.lote1-countdown.expired {
  border-color: rgba(184, 137, 130, 0.16) !important;
}

.lote1-countdown.expired .lote1-countdown-title {
  color: #8F625D !important;
}

/* Segundo lote */
.lote2,
.lote2:hover {
  border-color: #D8C4C1 !important;
  color: #746A68 !important;
}

.lote2 .text-foreground {
  color: #302B2B !important;
}

.lote2 .border,
.lote2 .border:hover {
  border-color: #D8C4C1 !important;
}

/* Mantém o gradiente dourado existente, mas transforma em rosé */
.text-gradient-gold {
  background: linear-gradient(135deg, #D9B7B1 0%, #B88982 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}

/* Sombras mais leves, mantendo exatamente o mesmo layout */
.shadow,
.shadow-md,
.shadow-lg,
.shadow-2xl {
  --tw-shadow-color: rgba(93, 65, 62, 0.12) !important;
}

/* Transparência preta usada pelo Tailwind em overlays comuns */
.bg-black\/80 {
  background-color: rgba(48, 43, 43, 0.78) !important;
}

/* Branco translúcido: fica levemente rosado no novo tema */
.bg-white\/80 {
  background-color: rgba(255, 253, 253, 0.82) !important;
}


.mt-8.flex.flex-wrap.items-center.gap-4 {
    flex-direction: column;
}

dt.font-medium.uppercase.tracking-wider.text-primary {
    font-weight: bold;
}



#sobre h3.font-display.text-2xl.font-bold.text-foreground {
    text-align: center;
}

dl dd{
  font-size: 18px;
  font-weight: bold;
}

.mb-4.flex.h-10.w-10.items-center.justify-center.rounded-full.bg-primary\/10.text-primary{
 background: rgb(214 211 211 / 28%);
}

.text-gradient-gold{
  -webkit-text-fill-color: #000000 !important;
}

#cronometro span.font-display.text-3xl.font-bold.text-gradient-gold.sm\:text-3xl.mb\:text-2xl {
    font-size: 22px;
}

#sobre p.dif{
    text-align: center;
    font-weight: bold;
    font-size: 12px;
    text-transform: uppercase;
}

.p-8 {
    padding: calc(var(--spacing) * 2);
}



.guest-profession {
    width: 100%;
  }