/* Binotto PDR — tema escuro (preto + amarelo), no estilo do app */

:root {
  --primary: oklch(82% .18 85);
  --primary-foreground: oklch(8% 0 0);
  --sidebar-primary: oklch(82% .18 85);
  --sidebar-primary-foreground: oklch(8% 0 0);
  --background: oklch(8% 0 0);
  --foreground: oklch(100% 0 0);
  --card: oklch(12% 0 0);
  --card-foreground: oklch(100% 0 0);
  --popover: oklch(12% 0 0);
  --popover-foreground: oklch(100% 0 0);
  --secondary: oklch(20% 0 0);
  --secondary-foreground: oklch(80% 0 0);
  --muted: oklch(25% 0 0);
  --muted-foreground: oklch(70% 0 0);
  --accent: oklch(82% .18 85);
  --accent-foreground: oklch(8% 0 0);
  --destructive: oklch(70.4% .191 22.216);
  --destructive-foreground: oklch(100% 0 0);
  --border: oklch(20% 0 0);
  --input: oklch(15% 0 0);
  --ring: oklch(82% .18 85);
  --chart-1: oklch(82% .18 85);
  --chart-2: oklch(70% .15 85);
  --chart-3: oklch(60% .12 85);
  --chart-4: oklch(50% .1 85);
  --chart-5: oklch(40% .08 85);
  --sidebar: oklch(12% 0 0);
  --sidebar-foreground: oklch(100% 0 0);
  --sidebar-accent: oklch(82% .18 85);
  --sidebar-accent-foreground: oklch(8% 0 0);
  --sidebar-border: oklch(20% 0 0);
  --sidebar-ring: oklch(82% .18 85);
}

/* Full-bleed light sections blend into the black page */
[data-loc^="client/src/components/AboutSection.tsx"].bg-white,
[data-loc^="client/src/components/TestimonialsSection.tsx"].bg-white,
[data-loc^="client/src/App.tsx"].bg-white,
[data-loc^="client/src/pages/Maintenance.tsx"].bg-white {
  background-color: var(--background) !important;
}

/* Cards float above the black background with a subtle border for definition */
[data-loc^="client/src/components/ServicesSection.tsx"].bg-white,
[data-loc^="client/src/components/CoursesSection.tsx"].bg-white,
[data-loc^="client/src/components/GroupFormModal.tsx"].bg-white {
  background-color: var(--card) !important;
  border: 1px solid var(--border);
}

/* Contact form box: white, sitting on the black section */
[data-loc^="client/src/components/ContactFormSection.tsx"].bg-white {
  background-color: #fff !important;
  border: 1px solid oklch(85% 0 0);
  --foreground: oklch(8% 0 0);
  --muted-foreground: oklch(40% 0 0);
  --border: oklch(85% 0 0);
  --input: oklch(96% 0 0);
}

select.bg-white {
  background-color: var(--input) !important;
  color: var(--foreground) !important;
}

/* Testimonial quote card: white, sitting on the black section */
[data-loc^="client/src/components/TestimonialsSection.tsx"][class*="bg-[#FFFBEA]"] {
  background-color: #fff !important;
  border-color: oklch(85% 0 0) !important;
  --foreground: oklch(8% 0 0);
  --muted-foreground: oklch(40% 0 0);
  --border: oklch(85% 0 0);
}

/* Header becomes the app's yellow top bar; text flips to dark for contrast */
header[data-loc^="client/src/components/Header.tsx"] {
  --foreground: var(--accent-foreground);
  --border: oklch(70% .12 85);
}
header[data-loc^="client/src/components/Header.tsx"].bg-white {
  background-color: var(--accent) !important;
}
header[data-loc^="client/src/components/Header.tsx"] .hover\:bg-muted:hover {
  background-color: oklch(70% .12 85) !important;
}

/* Bigger logo, like the app */
header img[alt="Binotto PDR"] {
  height: 71px !important;
  width: auto !important;
}
[data-loc="client/src/components/Header.tsx:30"] {
  height: auto !important;
  min-height: 71px !important;
  padding-top: .5rem;
  padding-bottom: .5rem;
}
@media (min-width: 1024px) {
  header img[alt="Binotto PDR"] {
    height: 109px !important;
  }
  [data-loc="client/src/components/Header.tsx:30"] {
    min-height: 109px !important;
  }

  /* Desktop nav links were too small next to the bigger logo */
  nav[data-loc="client/src/components/Header.tsx:41"] a {
    font-size: 1.125rem !important;
  }
}

/* Bold menu links, desktop and mobile */
header nav a {
  font-weight: 700 !important;
}

/* Hero photo: tone down the greenish globe graphic and warm it toward gold */
[data-loc="client/src/components/HeroSection.tsx:29"] {
  filter: saturate(.55) sepia(.35) hue-rotate(-14deg) brightness(.95);
}
[data-loc="client/src/components/HeroSection.tsx:37"] {
  background-color: rgba(56, 40, 4, 0.4) !important;
}