/* Baowatt — tipografia Kelson (mateixa que baowatt.cat) */
@font-face {
  font-family: 'Kelson';
  src: url('/fonts/kelson/KelsonSans-Light.otf') format('opentype');
  font-weight: lighter;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Kelson';
  src: url('/fonts/kelson/KelsonSans-Regular.otf') format('opentype');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Kelson';
  src: url('/fonts/kelson/KelsonSans-Bold.otf') format('opentype');
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}

/* Baowatt — paleta Pantone: 567 CP (#18453B), 165 CP (#FF6720), 2260 CP (#B8D2A3 / #DCE3D5) */

/* Baowatt — treu el drop-shadow del logo al header i el fa més petit */
body.organizer-baowatt header a img,
body.organizer-baowatt header a img[alt="Baowatt"] {
  filter: none !important;
  -webkit-filter: none !important;
  drop-shadow: none !important;
  height: 2.5rem !important;
  width: auto !important;
}

/* Baowatt — només logo al header (sense tagline) */
body.organizer-baowatt header > div > div > a:first-child::after {
  display: none !important;
  content: none !important;
}

/* Baowatt — navegació del header (Inicio + menú del tema) */
body.organizer-baowatt header nav.hidden.md\\:flex {
  gap: 2rem !important;
}

body.organizer-baowatt header nav a {
  display: inline-block !important;
  padding: 0.25rem 0 !important;
}

/* Baowatt — amaga el footer de Musticket */
body.organizer-baowatt footer#contact {
  display: none !important;
}

/* Baowatt — sense bloc Hero a la pàgina d’organitzador (.organizer-home) */
body.organizer-baowatt .organizer-home .organizer-page-hero {
  display: none !important;
}

body.organizer-baowatt {
  --color-primary: #FF6720 !important;
  --color-secondary: #18453B !important;
  --color-accent: #ffffff !important;
  --color-dark: #18453B !important;
  --color-text-muted: #5a6b62 !important;
  /* CTA / marca (Baowatt — Pantone 165 CP) */
  --brand-hover: #FF6720 !important;
  --brand-text: #ffffff !important;
  --tw-primary: 255 103 32 !important;
  --tw-secondary: 24 69 59 !important;
  --tw-accent: 255 255 255 !important;
  --tw-dark: 24 69 59 !important;
  background: #DCE3D5 !important;
  color: #18453B !important;
  font-family: 'Kelson', system-ui, sans-serif !important;
  font-size: 14px !important;
  line-height: 1.6 !important;
  letter-spacing: 0.02em !important;
}

/* Titulars — Kelson Light (com baowatt.cat: 18px / 130%) */
body.organizer-baowatt main h1,
body.organizer-baowatt main h2,
body.organizer-baowatt main h3,
body.organizer-baowatt main h4,
body.organizer-baowatt main h5,
body.organizer-baowatt main h6 {
  font: normal normal lighter 18px/130% 'Kelson', sans-serif !important;
  letter-spacing: normal !important;
  text-transform: none !important;
}

/* EventDetails: títol de l'event — mateixa família, mida adaptada al context */
body.organizer-baowatt main [class*='bg-gradient-to-t'] h1 {
  font: normal normal lighter 1.5rem/130% 'Kelson', sans-serif !important;
}
@media (min-width: 640px) {
  body.organizer-baowatt main [class*='bg-gradient-to-t'] h1 {
    font-size: 1.875rem !important;
  }
}
@media (min-width: 768px) {
  body.organizer-baowatt main [class*='bg-gradient-to-t'] h1 {
    font-size: 2.25rem !important;
  }
}

/*
 * Hero: amagat a .organizer-home (veure regles al principi del fitxer).
 * Si cal reactivar-lo, usar fons verd Pantone 567 CP amb overlay.
 */

/*
 * Secció d’esdeveniments (FeaturedEvents) i opcional custom HTML: sense espai inferior del py-16 de Tailwind.
 * organizer/[id]/page.tsx → section.py-16.px-4 dins .organizer-home
 */
body.organizer-baowatt .organizer-home > section.py-16.px-4 {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

/*
 * FeaturedEvents: arrel <section class="py-20 bg-muted/30"> (dins page organizer → max-w-7xl).
 */
body.organizer-baowatt .organizer-home > section.py-16.px-4 > .max-w-7xl > section.py-20 {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* Layout organitzador: <main class="min-h-screen"> (organizer/[id]/layout.tsx) */
body.organizer-baowatt main.min-h-screen {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
  background-color: #DCE3D5 !important;
}

/*
 * Franja vermella — paritat amb Elementor post 6309 (635e3022): padding 12px 35px, margin-bottom 10px,
 * enllaços btn-naked (Work Sans, blanc, hover #000), botó Contacto blanc pill (#8A9394 text, ombra).
 * Al web original: elementor-hidden-tablet / -mobile (amagada ≤1024px).
 */
body.organizer-baowatt .organizer-baowatt-top-bar {
  background: var(--color-primary) !important;
  color: #ffffff !important;
  width: 100% !important;
  box-sizing: border-box !important;
  position: relative !important;
  z-index: 99980 !important;
  margin-bottom: 10px !important;
}

@media (max-width: 1024px) {
  body.organizer-baowatt .organizer-baowatt-top-bar {
    display: none !important;
  }
}

body.organizer-baowatt .organizer-baowatt-top-bar__inner {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px 0 !important;
  max-width: 1170px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding: 20px 40px !important;
  min-height: 72px !important;
  box-sizing: border-box !important;
}

body.organizer-baowatt .organizer-baowatt-top-bar__left {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 0 !important;
}

/* Espai entre telèfon i adreça (margin widget 30px a Elementor) */
body.organizer-baowatt .organizer-baowatt-top-bar__item {
  display: inline-flex !important;
  flex-direction: row !important;
  align-items: center !important;
  color: #ffffff !important;
  fill: #ffffff !important;
  text-decoration: none !important;
  font-family: 'Kelson', sans-serif !important;
  font-size: 15px !important;
  font-weight: 400 !important;
  line-height: 1.45 !important;
  margin: 0 30px 0 0 !important;
}

body.organizer-baowatt .organizer-baowatt-top-bar__item:last-child {
  margin-right: 0 !important;
}

body.organizer-baowatt .organizer-baowatt-top-bar__item:hover,
body.organizer-baowatt .organizer-baowatt-top-bar__item:focus {
  color: #000000 !important;
  fill: #000000 !important;
}

body.organizer-baowatt .organizer-baowatt-top-bar__item-icon {
  display: inline-flex !important;
  flex-shrink: 0 !important;
  width: 1.15em !important;
  height: 1.15em !important;
  margin-inline-end: 10px !important;
}

body.organizer-baowatt .organizer-baowatt-top-bar__item-icon svg {
  width: 100% !important;
  height: 100% !important;
  display: block !important;
  fill: currentColor !important;
}

body.organizer-baowatt .organizer-baowatt-top-bar__item-txt {
  white-space: normal !important;
}

body.organizer-baowatt .organizer-baowatt-top-bar__right {
  display: flex !important;
  align-items: center !important;
  flex-shrink: 0 !important;
}

/* Botó solid Contacto (47fbf82): fons blanc, text gris, pill, ombra */
body.organizer-baowatt .organizer-baowatt-top-bar__contact {
  display: inline-block !important;
  box-sizing: border-box !important;
  background-color: #ffffff !important;
  color: var(--color-text-muted) !important;
  font-family: 'Kelson', sans-serif !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 1.3 !important;
  text-decoration: none !important;
  padding: 10px 24px !important;
  border-radius: 5em !important;
  box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16) !important;
  border: none !important;
  transition:
    background-color 0.2s ease,
    color 0.2s ease !important;
}

body.organizer-baowatt .organizer-baowatt-top-bar__contact:hover,
body.organizer-baowatt .organizer-baowatt-top-bar__contact:focus {
  background-color: var(--color-text-muted) !important;
  color: #ffffff !important;
}

/*
 * HTML tipus WordPress + Elementor + Liquid (p.ex. incrustat a custom_content).
 * Contenidor: .elementor-element-6e85c17 / data-id="6e85c17" (e-flex, e-con-boxed, e-parent).
 */
body.organizer-baowatt .elementor-element-6e85c17,
body.organizer-baowatt .elementor-element[data-id='6e85c17'][data-element_type='container'] {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  width: 100% !important;
  max-width: 100% !important;
  min-height: 119px;
  box-sizing: border-box !important;
}

body.organizer-baowatt .elementor-element-6e85c17.e-con-boxed,
body.organizer-baowatt .elementor-element[data-id='6e85c17'].e-con-boxed {
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Mateix criteri que Elementor: amaga a tauleta / mòbil quan porten aquestes classes */
@media (max-width: 1024px) {
  body.organizer-baowatt .elementor-element-6e85c17.elementor-hidden-tablet,
  body.organizer-baowatt .elementor-element[data-id='6e85c17'].elementor-hidden-tablet {
    display: none !important;
  }
}

@media (max-width: 767px) {
  body.organizer-baowatt .elementor-element-6e85c17.elementor-hidden-mobile,
  body.organizer-baowatt .elementor-element[data-id='6e85c17'].elementor-hidden-mobile {
    display: none !important;
  }
}

/*
 * Franja superior WordPress/Elementor (telèfon, adreça, botó Contacte) — #wrap > header#header,
 * plantilla elementor-6309, contenidor 635e3022. Colors alineats amb --color-primary.
 * Només aplica si incrustes aquest HTML (p.ex. custom_content); z-index per sota del header Musticket.
 */
body.organizer-baowatt #wrap {
  width: 100% !important;
  box-sizing: border-box !important;
}

body.organizer-baowatt #wrap > header#header,
body.organizer-baowatt #wrap header#header {
  background: var(--color-primary) !important;
  color: #ffffff !important;
  width: 100% !important;
  box-sizing: border-box !important;
  position: relative !important;
  z-index: 99980 !important;
  margin-bottom: 10px !important;
}

body.organizer-baowatt #wrap > header#header .elementor-6309,
body.organizer-baowatt #wrap header#header .elementor-6309 {
  width: 100% !important;
}

body.organizer-baowatt .elementor-element-635e3022,
body.organizer-baowatt .elementor-element[data-id='635e3022'] {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 0 !important;
  min-height: 0 !important;
  padding: 12px 35px !important;
  box-sizing: border-box !important;
  font-family: 'Kelson', sans-serif !important;
  font-size: 14px !important;
  font-weight: 400 !important;
}

body.organizer-baowatt .elementor-element-635e3022 .e-con-inner,
body.organizer-baowatt .elementor-element[data-id='635e3022'] .e-con-inner {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  width: 100% !important;
  max-width: 1170px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  gap: 0 !important;
}

body.organizer-baowatt .elementor-element-635e3022 .btn-txt,
body.organizer-baowatt .elementor-element[data-id='635e3022'] .btn-txt,
body.organizer-baowatt #wrap header#header .btn-txt {
  color: #ffffff !important;
  font-weight: 600 !important;
}

body.organizer-baowatt #wrap header#header a.elementor-button,
body.organizer-baowatt #wrap header#header .elementor-button {
  color: #ffffff !important;
  text-decoration: none !important;
}

body.organizer-baowatt #wrap header#header a.elementor-button.btn-solid,
body.organizer-baowatt #wrap header#header .elementor-button.btn-solid {
  background-color: #ffffff !important;
  color: var(--color-text-muted) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  border: none !important;
  border-radius: 5em !important;
  padding: 8px 22px !important;
  box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16) !important;
}

body.organizer-baowatt #wrap header#header a.elementor-button.btn-solid:hover,
body.organizer-baowatt #wrap header#header .elementor-button.btn-solid:hover {
  background-color: var(--color-text-muted) !important;
  color: #ffffff !important;
}

body.organizer-baowatt #wrap header#header a.elementor-button.btn-naked:hover,
body.organizer-baowatt #wrap header#header .elementor-button.btn-naked:hover {
  color: #000000 !important;
}

/* Spacer sota la capçalera Elementor (256873d / .elementor-spacer-inner) */
body.organizer-baowatt .elementor-element-256873d .elementor-spacer-inner,
body.organizer-baowatt .elementor-element[data-id='256873d'] .elementor-spacer-inner {
  display: block !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

@media (max-width: 1024px) {
  body.organizer-baowatt .elementor-element-635e3022.elementor-hidden-tablet,
  body.organizer-baowatt .elementor-element[data-id='635e3022'].elementor-hidden-tablet {
    display: none !important;
  }
}

@media (max-width: 767px) {
  body.organizer-baowatt .elementor-element-635e3022.elementor-hidden-mobile,
  body.organizer-baowatt .elementor-element[data-id='635e3022'].elementor-hidden-mobile {
    display: none !important;
  }
}

body.organizer-baowatt button,
body.organizer-baowatt .btn-primary,
body.organizer-baowatt a.bg-primary,
body.organizer-baowatt button.bg-primary {
  transition: all 0.3s ease !important;
}

body.organizer-baowatt button:hover,
body.organizer-baowatt .btn-primary:hover,
body.organizer-baowatt a.bg-primary:hover,
body.organizer-baowatt button.bg-primary:hover {
  transform: translateY(-3px) !important;
}

/*
 * Header Musticket per sobre de contingut incrustat (Elementor / barres fixed amb z-index alt).
 * El component porta sticky z-50; si no es veu “a dalt”, normalment és un overlay que el tapa.
 */
body.organizer-baowatt header {
  background: #18453B !important;
  color: #ffffff !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.12) !important;
  position: sticky !important;
  top: 0 !important;
  z-index: 100000 !important;
  visibility: visible !important;
  opacity: 1 !important;
}

/* Treu el drop-shadow de Tailwind al logo (es mostra tal qual el PNG) */
body.organizer-baowatt header a img,
body.organizer-baowatt footer img {
  filter: none !important;
  -webkit-filter: none !important;
}

body.organizer-baowatt header a.text-foreground,
body.organizer-baowatt header nav a.text-foreground,
body.organizer-baowatt header a,
body.organizer-baowatt header span,
body.organizer-baowatt header nav a {
  color: #ffffff !important;
  font-family: 'Kelson', system-ui, sans-serif !important;
  font-weight: 600 !important;
  text-shadow: none !important;
  text-decoration: none !important;
}

body.organizer-baowatt header a.text-foreground:hover,
body.organizer-baowatt header nav a.text-foreground:hover,
body.organizer-baowatt header a:hover,
body.organizer-baowatt header nav a:hover {
  color: rgba(255, 255, 255, 0.7) !important;
}

body.organizer-baowatt header .text-foreground {
  color: #ffffff !important;
}

body.organizer-baowatt header .text-foreground:hover {
  color: rgba(255, 255, 255, 0.7) !important;
}

body.organizer-baowatt header .hover\\:text-primary:hover {
  color: var(--color-primary) !important;
}

/* Selector d’idioma (ES / CA / …): contrast sobre header blanc */
body.organizer-baowatt header select {
  color: #ffffff !important;
  background-color: #18453B !important;
  border-color: rgba(255, 255, 255, 0.3) !important;
  font-family: 'Kelson', system-ui, sans-serif !important;
  font-size: 14px !important;
}

/* Focus/hover del selector d’idioma: negre (no vermell) */
body.organizer-baowatt header select:focus {
  border-color: #ffffff !important;
  box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.35) !important;
}

body.organizer-baowatt header select:hover {
  border-color: rgba(255, 255, 255, 0.7) !important;
}

/* Fletxa del select en negre (sobreescriu el data-uri de Tailwind) */
body.organizer-baowatt header select#language-selector {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%23ffffff' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e") !important;
}

/* Icones (SVG) del header en negre */
body.organizer-baowatt header svg,
body.organizer-baowatt header [data-icon],
body.organizer-baowatt header .text-muted-foreground {
  color: #ffffff !important;
  /* NO forcem fill aquí: molts SVG del header són d'stroke i s'han de veure "outline" */
}

/* Botó del carret (icona) en negre sobre fons blanc */
body.organizer-baowatt header button[aria-label='Carret de compra'] {
  background-color: transparent !important;
  color: #ffffff !important;
  border: 0 !important;
  box-shadow: none !important;
  outline: none !important;
  border-radius: 0.75rem !important;
}

body.organizer-baowatt header button[aria-label='Carret de compra']:hover,
body.organizer-baowatt header button[aria-label='Carret de compra']:focus,
body.organizer-baowatt header button[aria-label='Carret de compra']:focus-visible {
  background-color: rgba(255, 255, 255, 0.12) !important;
  color: #ffffff !important;
  box-shadow: none !important;
}

body.organizer-baowatt header button[aria-label='Carret de compra'] svg {
  color: #ffffff !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2 !important;
}

/* Secció Events destacats */
body.organizer-baowatt .bg-muted\/30,
body.organizer-baowatt section.bg-muted\/30 {
  background-color: #000000 !important;
  color: #ffffff !important;
}

body.organizer-baowatt .bg-gradient-to-r.from-primary.via-secondary.to-accent {
  background: #ffffff !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}

body.organizer-baowatt .bg-card {
  color: #ffffff !important;
}

body.organizer-baowatt .text-foreground {
  color: #ffffff !important;
}

body.organizer-baowatt .text-muted-foreground {
  color: rgba(255, 255, 255, 0.7) !important;
}

/* Cerca */
body.organizer-baowatt input.bg-card {
  background: rgba(42, 42, 42, 0.9) !important;
  border: 2px solid var(--color-primary) !important;
  color: #ffffff !important;
}

body.organizer-baowatt input.bg-card::placeholder {
  color: rgba(255, 255, 255, 0.5) !important;
}

body.organizer-baowatt input.bg-card:focus {
  border-color: #18453B !important;
  box-shadow: 0 0 0 2px rgba(24, 69, 59, 0.3) !important;
}

/* Botó “Ver todos” */
body.organizer-baowatt .bg-gradient-to-r.from-primary.to-secondary {
  background: linear-gradient(to right, var(--color-primary), var(--color-primary)) !important;
  color: #ffffff !important;
  border: none !important;
}

body.organizer-baowatt .bg-gradient-to-r.from-primary.to-secondary:hover {
  background: linear-gradient(to right, #18453B, var(--color-primary)) !important;
  transform: scale(1.05) !important;
}

body.organizer-baowatt .bg-yellow-500 {
  background: var(--color-primary) !important;
  color: #ffffff !important;
}

/* Footer */
body.organizer-baowatt footer {
  background: var(--color-primary) !important;
  color: #000000 !important;
  padding: 3rem 0 !important;
  margin-top: 5rem !important;
}

body.organizer-baowatt footer a {
  color: #000000 !important;
}

body.organizer-baowatt footer a:hover {
  color: #ff0080 !important;
}

/*
 * Amaga tota la fila superior del footer (logo + descripció + columna contacte).
 * Footer.tsx: primer fill de .max-w-7xl és el grid de 2 columnes; el segon és la franja legal (border-t).
 */
body.organizer-baowatt footer#contact .max-w-7xl > div:first-child {
  display: none !important;
}

body.organizer-baowatt footer#contact .max-w-7xl {
  padding-top: 0 !important;
  padding-bottom: 4rem !important;
}

/* Franja legal: sense mt-12 / pt-8 de Tailwind (marge i padding superior) */
body.organizer-baowatt footer#contact .max-w-7xl > div:nth-child(2),
body.organizer-baowatt footer#contact .max-w-7xl > div.border-t.border-border {
  margin-top: 0 !important;
  margin-block-start: 0 !important;
  padding-top: 0 !important;
  border-top: none !important;
  border-top-width: 0 !important;
}

/* Targetes */
body.organizer-baowatt .bg-card,
body.organizer-baowatt .event-card {
  background: var(--color-primary);
  color: #000000 !important;
}

/* Inputs generals */
body.organizer-baowatt input,
body.organizer-baowatt select,
body.organizer-baowatt textarea {
  color: #000000 !important;
}

body.organizer-baowatt input:focus,
body.organizer-baowatt select:focus,
body.organizer-baowatt textarea:focus {
  outline: none !important;
}

body.organizer-baowatt input::placeholder {
  color: rgba(0, 0, 0, 0.5) !important;
}

body.organizer-baowatt .text-muted-foreground {
  color: rgba(0, 0, 0, 0.7) !important;
}

body.organizer-baowatt .text-foreground {
  color: #000000 !important;
}

body.organizer-baowatt .text-primary {
  color: #FF6720 !important;
}

body.organizer-baowatt .text-secondary {
  color: #18453B !important;
}

body.organizer-baowatt .text-accent {
  color: #FF6720 !important;
}

@layer utilities {
  .text-card {
    color: white;
  }
  .text-white {
    color: white;
  }
  .text-gray-800 {
    color: white;
  }
  .bg-primary {
    background-color: white;
    color: black;
  }
  .bg-muted {
    background-color: var(--color-primary);
  }
  .bg-blue-600 {
    background-color: var(--color-primary);
  }
  .bg-red-600 {
    background-color: var(--color-primary);
  }
}

/* ===== Baowatt: tema clar (Pantone 2260 CP) ===== */
body.organizer-baowatt {
  background: #DCE3D5 !important;
  color: #18453B !important;
}

/* Seccions i superfícies */
body.organizer-baowatt .bg-muted\/30,
body.organizer-baowatt section.bg-muted\/30 {
  background-color: #DCE3D5 !important;
  color: #18453B !important;
}

body.organizer-baowatt .bg-card {
  background-color: #ffffff !important;
  color: #000000 !important;
}

body.organizer-baowatt .text-foreground {
  color: #000000 !important;
}

body.organizer-baowatt .text-muted-foreground {
  color: rgba(0, 0, 0, 0.65) !important;
}

/* Cercador (FeaturedEvents) en clar */
body.organizer-baowatt input.bg-card {
  background: rgba(255, 255, 255, 0.95) !important;
  border: 1px solid rgba(0, 0, 0, 0.2) !important;
  color: #000000 !important;
}

body.organizer-baowatt input.bg-card::placeholder {
  color: rgba(0, 0, 0, 0.45) !important;
}

/* Evita que el @layer utilities (copiat) torni a enfosquir textos */
body.organizer-baowatt .text-card,
body.organizer-baowatt .text-white,
body.organizer-baowatt .text-gray-800,
body.organizer-baowatt .text-white\/80 {
  color: #000000 !important;
}

/* EventDetails: a la capçalera amb gradient fosc, el títol ha de ser blanc */
body.organizer-baowatt main [class*='bg-gradient-to-t'] h1.text-white,
body.organizer-baowatt main [class*='bg-gradient-to-t'] h1.text-white\/80 {
  color: #ffffff !important;
}

/* Pàgina d'entrades / checkout: mateix fons que el main (Pantone 2260 CP) */
body.organizer-baowatt .bg-background,
body.organizer-baowatt main.min-h-screen > .bg-background {
  background-color: #DCE3D5 !important;
}

/* Checkout: envoltori principal (CheckoutPage) */
body.organizer-baowatt div.flex.flex-col.bg-gray-50 {
  background-color: #DCE3D5 !important;
}

/* Footer: amaga la franja legal (copyright + links) */
body.organizer-baowatt footer#contact .max-w-7xl {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

body.organizer-baowatt footer#contact .max-w-7xl > div.border-t.border-border,
body.organizer-baowatt footer#contact .max-w-7xl > div:nth-child(2),
body.organizer-baowatt footer#contact .max-w-7xl > div.py-16 {
  display: none !important;
}

/* Footer wrapper: treu la línia superior (border-t de Tailwind) */
body.organizer-baowatt footer#contact {
  border-top: none !important;
  border-top-width: 0 !important;
}

/* Botons de compra (cards d'esdeveniments) */
body.organizer-baowatt .organizer-home button.bg-primary-dark {
  background-color: #FF6720 !important;
}
body.organizer-baowatt .organizer-home button.bg-primary-dark:hover {
  background-color: #E55A15 !important;
  filter: none !important;
}

/*
 * Pàgina d'entrades (PurchaseSummary): botó "Comprar ara" com enllaç "Comprar entrades" (EventDetails).
 * El component només usa aquest wrapper: .bg-white.rounded-lg.shadow-md.p-6.sticky.top-6
 */
body.organizer-baowatt div.bg-white.rounded-lg.shadow-md.p-6.sticky.top-6 > button.w-full {
  background-color: var(--brand-hover) !important;
  color: var(--brand-text) !important;
  transition:
    opacity 0.15s ease,
    background-color 0.15s ease !important;
}
body.organizer-baowatt div.bg-white.rounded-lg.shadow-md.p-6.sticky.top-6 > button.w-full:hover:not(:disabled) {
  opacity: 0.9 !important;
  background-color: var(--brand-hover) !important;
}
body.organizer-baowatt div.bg-white.rounded-lg.shadow-md.p-6.sticky.top-6 > button.w-full:disabled:hover {
  background-color: var(--brand-hover) !important;
  opacity: 0.5 !important;
}

/*
 * Carret (drawer lateral): botó "Procedir al pagament" amb els colors de Baowatt.
 * El botó ve amb style inline background-color: var(--brand-text); aquí el sobreescrivim.
 */
body.organizer-baowatt
  div.fixed.right-0.top-0.h-full.w-full.max-w-md.bg-white
  > div.border-t.border-gray-200.p-4.bg-gray-50
  > button.w-full.py-3 {
  background-color: var(--brand-hover) !important;
  color: var(--brand-text) !important;
}

/*
 * Pàgina d'entrades (TicketSelector): capçalera de zona (bg-gray-200) — mateix fons i text
 * que el botó "Comprar ara" (var(--brand-hover) / var(--brand-text)). No afecta zona esgotada (bg-red-100).
 */
body.organizer-baowatt
  div.bg-background
  .lg\\:col-span-2
  > div.max-w-4xl.mx-auto
  > div.space-y-6
  > div.bg-white.rounded-lg.shadow-md.overflow-hidden
  > div.px-6.py-4.border-b.border-gray-300.bg-gray-200 {
  background-color: var(--brand-hover) !important;
  border-bottom-color: rgba(0, 0, 0, 0.15) !important;
}
body.organizer-baowatt
  div.bg-background
  .lg\\:col-span-2
  > div.max-w-4xl.mx-auto
  > div.space-y-6
  > div.bg-white.rounded-lg.shadow-md.overflow-hidden
  > div.px-6.py-4.border-b.border-gray-300.bg-gray-200
  h3.text-gray-900,
body.organizer-baowatt
  div.bg-background
  .lg\\:col-span-2
  > div.max-w-4xl.mx-auto
  > div.space-y-6
  > div.bg-white.rounded-lg.shadow-md.overflow-hidden
  > div.px-6.py-4.border-b.border-gray-300.bg-gray-200
  .text-gray-500 {
  color: var(--brand-text) !important;
}

/* Fallback robust: mateixa capçalera de zona, però amb selector menys estricte */
body.organizer-baowatt .bg-background .bg-white.rounded-lg.shadow-md.overflow-hidden > .bg-gray-200 {
  background-color: var(--brand-hover) !important;
  border-bottom-color: rgba(0, 0, 0, 0.15) !important;
}
body.organizer-baowatt .bg-background .bg-white.rounded-lg.shadow-md.overflow-hidden > .bg-gray-200 h3,
body.organizer-baowatt .bg-background .bg-white.rounded-lg.shadow-md.overflow-hidden > .bg-gray-200 .text-gray-500 {
  color: var(--brand-text) !important;
}

/* EventDetails: barra sticky (INFORMACIÓN / SESIONES / Comprar entradas) */
body.organizer-baowatt div.bg-muted.border-b.border-border.sticky.top-16 {
  background-color: #FF6720 !important;
  border-bottom-color: rgba(0, 0, 0, 0.12) !important;
  color: #ffffff !important;
}

body.organizer-baowatt div.bg-muted.border-b.border-border.sticky.top-16 a,
body.organizer-baowatt div.bg-muted.border-b.border-border.sticky.top-16 button {
  color: #ffffff !important;
}

/* EventDetails: targetes de sessions (tot el text en negre) */
body.organizer-baowatt #sessions-section .bg-card {
  color: #000000 !important;
}
body.organizer-baowatt #sessions-section .bg-card * {
  color: #000000 !important;
}
body.organizer-baowatt #sessions-section .bg-card a,
body.organizer-baowatt #sessions-section .bg-card button,
body.organizer-baowatt #sessions-section .bg-card .text-foreground,
body.organizer-baowatt #sessions-section .bg-card .text-muted-foreground {
  color: #000000 !important;
}

/* EventDetails: badge data de sessió (mateix fons que a les cards de la home) */
body.organizer-baowatt #sessions-section .bg-white\/20.rounded-lg.p-4.text-center {
  background-color: #B8D2A3 !important;
}

/* Cards d'esdeveniments: badge data (Vie 24 ABR 2026) */
body.organizer-baowatt .organizer-home .bg-white\/20.rounded-lg.p-4.text-center {
  background-color: #B8D2A3 !important;
}

/* EventDetails: etiquetes (tags) amb el mateix fons que el badge de data */
body.organizer-baowatt #information-section .bg-muted.text-foreground.rounded-full {
  background-color: #B8D2A3 !important;
  color: #000000 !important;
}

/* EventDetails: email de l'organitzador amb el color del botó (només text) */
body.organizer-baowatt #information-section a[href^='mailto:'] {
  background: transparent !important;
  padding: 0 !important;
  border-radius: 0 !important;
  color: #000000 !important;
  text-decoration-line: underline !important;
  text-decoration-color: #000000 !important;
  font-weight: 600 !important;
  transition: opacity 0.15s ease, color 0.15s ease, text-decoration-color 0.15s ease !important;
}

body.organizer-baowatt #information-section a[href^='mailto:']:hover {
  opacity: 0.9 !important;
  color: #000000 !important;
  text-decoration-color: #000000 !important;
}
