/* Custom Styling - Paula Amidani (Paulinha Coach Pink) Site */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Montserrat:wght@600;700;800;900&family=Outfit:wght@600;700;800;900&display=swap');

:root {
  --bg-dark: #0D0D0E;
  --bg-card: #141416;
  --bg-card-hover: #1A1A1E;
  --pink-primary: #D81B60;
  --pink-hover: #C2185B;
  --pink-glow: rgba(216, 27, 96, 0.35);
  --text-main: #FAFAFA;
  --text-muted: #D4D4D8;
  --gold-accent: #E5B880;
}

/* Light Theme Variables */
body.light-theme {
  --bg-dark: #FAFAFA;
  --bg-card: #FFFFFF;
  --bg-card-hover: #F4F4F5;
  --text-main: #09090B;
  --text-muted: #3F3F46;
  background-color: var(--bg-dark) !important;
  color: var(--text-main) !important;
}

body.light-theme .bg-zinc-950,
body.light-theme .bg-zinc-950\/90,
body.light-theme .bg-zinc-950\/80,
body.light-theme .bg-zinc-950\/40,
body.light-theme section {
  background-color: #FAFAFA !important;
}

body.light-theme .bg-zinc-900,
body.light-theme .bg-zinc-900\/40,
body.light-theme .bg-zinc-900\/80,
body.light-theme .bg-zinc-900\/90,
body.light-theme #mobile-menu {
  background-color: #FFFFFF !important;
  border-color: #E4E4E7 !important;
}

body.light-theme .text-white {
  color: #09090B !important;
}

/* Manter fonte branca cristalina em botões com fundo rosa e escuros no modo claro */
body.light-theme a.bg-pink-600,
body.light-theme button.bg-pink-600,
body.light-theme a.bg-pink-700,
body.light-theme button.bg-pink-700,
body.light-theme .bg-pink-600,
body.light-theme .bg-pink-600 * {
  background-color: #D81B60 !important;
  color: #FFFFFF !important;
}

body.light-theme a[class*="bg-zinc-800"],
body.light-theme button[class*="bg-zinc-800"],
body.light-theme a[class*="bg-zinc-900"],
body.light-theme button[class*="bg-zinc-900"],
body.light-theme a[class*="bg-zinc-800"] *,
body.light-theme button[class*="bg-zinc-800"] *,
body.light-theme a[class*="bg-zinc-900"] *,
body.light-theme button[class*="bg-zinc-900"] * {
  background-color: #18181B !important;
  color: #FFFFFF !important;
}

/* Logomarca no modo claro / escuro */
body.light-theme .header-logo,
body.light-theme .site-logo {
  filter: none !important;
}

body.light-theme .text-zinc-100,
body.light-theme .text-zinc-200,
body.light-theme .text-zinc-300,
body.light-theme .text-zinc-400 {
  color: #3F3F46 !important;
}

body.light-theme .text-zinc-500 {
  color: #71717A !important;
}

body.light-theme .border-zinc-800,
body.light-theme .border-zinc-800\/80,
body.light-theme .border-zinc-800\/50,
body.light-theme .border-zinc-800\/40 {
  border-color: #E4E4E7 !important;
}

body.light-theme #navbar {
  background-color: rgba(255, 255, 255, 0.95) !important;
  border-bottom-color: #E4E4E7 !important;
}

body.light-theme .theme-toggle-btn {
  background-color: #F4F4F5 !important;
  border-color: #E4E4E7 !important;
  color: #18181B !important;
}

html {
  scroll-behavior: smooth;
  font-family: 'Inter', sans-serif;
  background-color: var(--bg-dark);
  color: var(--text-main);
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, .font-heading {
  font-family: 'Outfit', 'Montserrat', sans-serif;
  text-wrap: balance;
}

h1 *, h2 *, h3 *, h4 *, h5 *, h6 *, .font-heading * {
  line-height: inherit;
}

p, li {
  line-height: 1.65;
}

/* High Contrast Readability Classes */
.prose-readable p {
  color: #E4E4E7;
  font-size: 1.05rem;
  line-height: 1.75;
}

body.light-theme .prose-readable p {
  color: #27272A;
}

.text-high-contrast {
  color: #FAFAFA !important;
}

body.light-theme .text-high-contrast {
  color: #09090B !important;
}

.text-subtle-contrast {
  color: #D4D4D8 !important;
}

body.light-theme .text-subtle-contrast {
  color: #3F3F46 !important;
}

/* Grayscale Sponsor Marquee Animation */
@keyframes marquee {
  0% { transform: translateX(0%); }
  100% { transform: translateX(-50%); }
}

.animate-marquee {
  display: flex;
  width: 200%;
  animation: marquee 25s linear infinite;
}

.animate-marquee:hover {
  animation-play-state: paused;
}

.sponsor-logo {
  filter: grayscale(100%) opacity(0.75);
  transition: all 0.35s ease;
}

.sponsor-logo:hover {
  filter: grayscale(0%) opacity(1.0);
  transform: scale(1.08);
}

/* Photo Cards & Image Effects */
.image-card-glow {
  position: relative;
  overflow: hidden;
  border-radius: 1.25rem;
  border: 1px solid rgba(255, 255, 255, 0.12);
  transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

.image-card-glow:hover {
  border-color: rgba(216, 27, 96, 0.7);
  box-shadow: 0 12px 35px rgba(216, 27, 96, 0.25);
  transform: translateY(-4px);
}

.image-card-glow img {
  transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

.image-card-glow:hover img {
  transform: scale(1.06);
}

/* Glow & Custom Effects */
.pink-glow-box {
  box-shadow: 0 0 35px var(--pink-glow);
}

.gradient-text-pink {
  background: linear-gradient(135deg, #FFFFFF 20%, #E91E63 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

body.light-theme .gradient-text-pink {
  background: linear-gradient(135deg, #09090B 20%, #D81B60 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.gradient-text-gold {
  background: linear-gradient(135deg, #FFF 30%, #E5B880 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

body.light-theme .gradient-text-gold {
  background: linear-gradient(135deg, #18181B 30%, #B8860B 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.pink-border-glow {
  border: 1px solid rgba(216, 27, 96, 0.35);
  transition: border-color 0.3s ease, box-shadow 0.3s ease;
}

.pink-border-glow:hover {
  border-color: rgba(216, 27, 96, 0.85);
  box-shadow: 0 0 25px rgba(216, 27, 96, 0.3);
}

/* Custom Scrollbar */
::-webkit-scrollbar {
  width: 8px;
}
::-webkit-scrollbar-track {
  background: #0D0D0E;
}
::-webkit-scrollbar-thumb {
  background: #3F3F46;
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
  background: #D81B60;
}

/* Espaçamento do Navbar em Monitores Verticais / Modo Retrato */
@media (orientation: portrait) {
  #navbar {
    column-gap: 2rem !important;
  }
  #navbar > a {
    margin-right: 2.5rem !important;
    flex-shrink: 0 !important;
  }
  #navbar div.hidden.md\:flex {
    column-gap: 1.25rem !important;
  }
}

