/* Fata Morgana final visual layer */

:root {
  --fata-bg: #efe4cf;
  --fata-panel: #fffaf2;
  --fata-border: rgba(84, 60, 32, 0.16);
  --fata-ink: #1f170f;
  --fata-muted: #70665a;
  --fata-black: #111;
  --fata-shadow: 0 24px 70px rgba(60, 45, 30, 0.14);
}

body {
  background:
    radial-gradient(circle at top left, rgba(214, 161, 61, 0.12), transparent 34rem),
    var(--fata-bg) !important;
  color: var(--fata-ink) !important;
}

body:has(.fata-home-layout) .site-header,
body:has(.fata-content-layout) .site-header {
  display: none !important;
}

/* Algemene oude Fata-layout: content links, sidebar rechts */
.fata-home-layout,
.fata-content-layout {
  width: min(1120px, calc(100vw - 48px)) !important;
  margin: 2.2rem auto 4rem !important;
  display: flex !important;
  align-items: flex-start !important;
  gap: 36px !important;
}

.fata-home-main,
.fata-content-main {
  flex: 0 1 740px !important;
  width: 740px !important;
  min-width: 0 !important;
  max-width: 740px !important;
}

.fata-home-sidebar,
.fata-sidebar {
  flex: 0 0 340px !important;
  width: 340px !important;
  min-width: 340px !important;
  max-width: 340px !important;
  position: sticky !important;
  top: 2rem !important;
  z-index: 2 !important;
}

.fata-home-main,
.fata-content-card,
.fata-home-sidebar,
.fata-sidebar {
  background: var(--fata-panel) !important;
  border: 1px solid var(--fata-border) !important;
  border-radius: 30px !important;
  box-shadow: var(--fata-shadow) !important;
  overflow: hidden !important;
}

/* Homepage */
.fata-home-head,
.fata-content-head {
  padding: 2rem 2.25rem 1.45rem !important;
  border-bottom: 1px solid rgba(84, 60, 32, 0.13) !important;
}

.fata-home-head h1,
.fata-content-head h1 {
  margin: 0 !important;
  font-size: clamp(2.15rem, 3.05vw, 3rem) !important;
  line-height: 1.02 !important;
  letter-spacing: -0.04em !important;
  color: var(--fata-ink) !important;
}

.fata-home-head p,
.fata-content-head p,
.fata-content-head .event-date {
  margin: 0.75rem 0 0 !important;
  font-size: 1rem !important;
  line-height: 1.5 !important;
  color: var(--fata-muted) !important;
  font-weight: 500 !important;
}

.fata-home-flyers,
.fata-content-body {
  padding: 1.55rem !important;
}

.fata-home-flyers {
  display: grid !important;
  gap: 2rem !important;
}

.fata-home-flyer,
.fata-archive-flyer,
.flyer-detail {
  margin: 0 !important;
}

.fata-home-flyer a,
.fata-archive-flyer a,
.flyer-detail {
  display: block !important;
  max-width: 100% !important;
  border-radius: 22px !important;
  overflow: hidden !important;
  background: #fff7ef !important;
  border: 1px solid rgba(84, 60, 32, 0.12) !important;
  box-shadow: 0 18px 55px rgba(60, 45, 30, 0.1) !important;
}

.fata-home-flyer img,
.fata-archive-flyer img,
.flyer-detail img {
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  display: block !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  object-fit: contain !important;
}

.fata-home-flyer a:hover img,
.fata-archive-flyer a:hover img {
  transform: scale(1.012) !important;
  filter: saturate(1.03) !important;
}

.fata-home-flyer img,
.fata-archive-flyer img {
  transition: transform 0.22s ease, filter 0.22s ease !important;
}

/* Sidebar */
.fata-sidebar-image img {
  width: 100% !important;
  display: block !important;
  aspect-ratio: 4 / 2.55 !important;
  object-fit: cover !important;
}

.fata-sidebar-nav {
  padding: 2rem 2.25rem !important;
  display: grid !important;
  gap: 1.35rem !important;
  background: var(--fata-panel) !important;
  border-bottom: 1px solid rgba(84, 60, 32, 0.13) !important;
}

.fata-sidebar-nav a {
  display: block !important;
  color: var(--fata-black) !important;
  text-decoration: none !important;
  font-size: 1rem !important;
  line-height: 1.25 !important;
  font-weight: 900 !important;
  padding: 0 !important;
  background: transparent !important;
  border-radius: 0 !important;
}

.fata-sidebar-nav a:hover {
  color: #8b3f50 !important;
}

.fata-sidebar-about {
  padding: 2rem 2.25rem 2.25rem !important;
  background: var(--fata-panel) !important;
}

.fata-sidebar-about h2 {
  margin: 0 0 1rem !important;
  font-size: clamp(1.65rem, 2.3vw, 2.25rem) !important;
  line-height: 1.15 !important;
  color: var(--fata-ink) !important;
}

.fata-sidebar-about p {
  font-size: 1rem !important;
  line-height: 1.65 !important;
  color: var(--fata-muted) !important;
}

/* Knoppen: geen RM-lila/groen meer */
.button,
.read-more,
.share-button,
button,
input[type="submit"] {
  background: var(--fata-black) !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 999px !important;
  font-weight: 900 !important;
  box-shadow: none !important;
}

.button:hover,
.read-more:hover,
.share-button:hover,
button:hover,
input[type="submit"]:hover {
  background: #3a2a1d !important;
  color: #fff !important;
}

.share-button.secondary {
  background: #6f675c !important;
  color: #fff !important;
}

.share-row {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 0.75rem !important;
  margin-top: 1.35rem !important;
}

.share-note {
  color: var(--fata-muted) !important;
}

/* Contentpagina’s */
.fata-content-body h2 {
  font-size: 1.55rem !important;
  margin-top: 0 !important;
  color: var(--fata-ink) !important;
}

.fata-content-body h2:not(:first-child) {
  margin-top: 2rem !important;
}

.fata-content-body p,
.fata-content-body li {
  font-size: 1.02rem !important;
  line-height: 1.7 !important;
}

.fata-content-body img {
  max-width: 100% !important;
  height: auto !important;
  border-radius: 18px !important;
}

/* Video embeds */
.video-embed {
  position: relative !important;
  width: 100% !important;
  aspect-ratio: 16 / 9 !important;
  margin: 1rem 0 2rem !important;
  overflow: hidden !important;
  border-radius: 18px !important;
  background: #111 !important;
}

.video-embed iframe {
  width: 100% !important;
  height: 100% !important;
  border: 0 !important;
}

/* Footer oude stijl */
.site-footer {
  background: #1d130b !important;
  color: rgba(255, 255, 255, 0.88) !important;
  border-top: 0 !important;
}

.site-footer a {
  color: #fff !important;
}

/* Ruim oude RM-eventcomponenten op waar ze nog meekomen */
.event-detail-grid,
.event-info,
.event-meta-list,
.event-card-body {
  all: unset;
}

/* Mobiel */
@media (max-width: 1050px) {
  .fata-home-layout,
  .fata-content-layout {
    width: min(780px, calc(100vw - 32px)) !important;
    flex-direction: column !important;
  }

  .fata-home-main,
  .fata-content-main,
  .fata-home-sidebar,
  .fata-sidebar {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    flex: 0 1 auto !important;
    position: static !important;
  }
}

@media (max-width: 720px) {
  .fata-home-layout,
  .fata-content-layout {
    width: min(100%, calc(100vw - 24px)) !important;
    margin-top: 1rem !important;
  }

  .fata-home-head,
  .fata-content-head {
    padding: 1.45rem 1.25rem 1.2rem !important;
  }

  .fata-home-head h1,
  .fata-content-head h1 {
    font-size: clamp(2rem, 10vw, 2.65rem) !important;
  }

  .fata-home-flyers,
  .fata-content-body {
    padding: 1.15rem !important;
  }
}

/* Fata Morgana: laatste layoutcorrecties */
.fata-home-layout,
.fata-content-layout {
  align-items: flex-start !important;
}

.fata-home-main,
.fata-content-main,
.fata-content-card,
.fata-home-sidebar,
.fata-sidebar {
  margin-top: 0 !important;
}

/* Homepage titel compacter */
.fata-home-head {
  padding: 1.45rem 1.9rem 1.2rem !important;
}

.fata-home-head h1 {
  max-width: none !important;
  font-size: clamp(1.85rem, 2.45vw, 2.45rem) !important;
  line-height: 1.04 !important;
  letter-spacing: -0.035em !important;
}

.fata-home-head p {
  margin-top: 0.55rem !important;
  font-size: 0.98rem !important;
}

/* Sidebar image is nu een link */
.fata-sidebar-image {
  display: block !important;
  text-decoration: none !important;
  background: transparent !important;
  border: 0 !important;
}

.fata-sidebar-image:hover img {
  filter: saturate(1.04) contrast(1.02) !important;
}

/* Geen lila hover meer in het zijmenu */
.fata-sidebar-nav a:hover,
.fata-sidebar-nav a:focus {
  color: var(--fata-ink) !important;
  text-decoration: underline !important;
  text-decoration-thickness: 2px !important;
  text-underline-offset: 0.25em !important;
  text-decoration-color: rgba(84, 60, 32, 0.45) !important;
  background: transparent !important;
}

/* Contactknop in sidebar blijft zwart/bruin, geen groen/lila */
.fata-sidebar-about .button {
  background: #111 !important;
  color: #fff !important;
}

.fata-sidebar-about .button:hover {
  background: #3a2a1d !important;
  color: #fff !important;
}

/* Fata Morgana: laatste uitlijning en compacte homepage */
.fata-home-layout,
.fata-content-layout {
  margin-top: 1.65rem !important;
  align-items: flex-start !important;
}

.fata-home-main,
.fata-content-main,
.fata-content-card,
.fata-home-sidebar,
.fata-sidebar {
  margin-top: 0 !important;
  padding-top: 0 !important;
  transform: none !important;
}

.fata-content-layout > .fata-content-main,
.fata-content-layout > .fata-sidebar,
.fata-home-layout > .fata-home-main,
.fata-home-layout > .fata-sidebar {
  align-self: flex-start !important;
}

/* Minder wit boven de homepage-titel */
.fata-home-head {
  padding-top: 1.15rem !important;
  padding-bottom: 1rem !important;
}

.fata-home-head h1 {
  font-size: clamp(1.75rem, 2.25vw, 2.25rem) !important;
}

.fata-home-head p {
  margin-top: 0.45rem !important;
}

/* Fata Morgana: contactformulier module */
.contact-list {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 0 1.5rem !important;
}

.contact-list li {
  margin: 0 0 0.8rem !important;
}

.contact-form-section {
  margin-top: 2rem !important;
  padding-top: 1.5rem !important;
  border-top: 1px solid rgba(84, 60, 32, 0.16) !important;
}

.contact-form-section h2 {
  margin-top: 0 !important;
}

.contact-form {
  display: grid !important;
  gap: 1rem !important;
  margin-top: 1.25rem !important;
  max-width: 620px !important;
}

.contact-form label {
  display: grid !important;
  gap: 0.4rem !important;
  font-weight: 800 !important;
  color: var(--fata-ink) !important;
}

.contact-form input,
.contact-form select,
.contact-form textarea {
  width: 100% !important;
  box-sizing: border-box !important;
  border: 1px solid rgba(84, 60, 32, 0.24) !important;
  border-radius: 14px !important;
  padding: 0.85rem 1rem !important;
  background: #fff !important;
  color: var(--fata-ink) !important;
  font: inherit !important;
}

.contact-form textarea {
  resize: vertical !important;
}

.contact-form input:focus,
.contact-form select:focus,
.contact-form textarea:focus {
  outline: 3px solid rgba(84, 60, 32, 0.16) !important;
  border-color: rgba(84, 60, 32, 0.48) !important;
}

.form-honeypot {
  position: absolute !important;
  left: -9999px !important;
}

.form-message {
  padding: 1rem !important;
  border-radius: 16px !important;
  margin: 1rem 0 !important;
  font-weight: 700 !important;
}

.form-success {
  background: rgba(34, 120, 70, 0.12) !important;
}

.form-error {
  background: rgba(170, 40, 40, 0.12) !important;
}