/* ============================================================
   AFTERGLOW — dark premium reskin for speed-dating-in-berlin.de
   Loaded LAST in <head>; overrides three legacy codebases:
   2024 homepage (box-… / moduleListAppointment…), 2013 event pages
   (module…Bg wrappers), 2019 booking platform (main-part-box-…).
   Content and markup untouched — presentation only.
   See docs/spicy-redesign-system.md for the system.
   ============================================================ */

:root{
  --ink-950:#0B0A0F; --ink-900:#121018; --ink-800:#1A1722;
  --ink-700:#262033; --ink-600:#39314A;
  --flame-600:#C2184B; --flame-500:#E0315B;
  --blush-400:#FF5E7E; --blush-300:#FF8FA3;
  --orchid-500:#8B5CF6; --orchid-300:#C4B5FD;
  --gold-400:#E3B873; --gold-200:#F3DDB5;
  --cream-50:#FAF7F2; --cream-200:#E9E2D8; --mute-400:#A89FB3;
  --heat:linear-gradient(135deg,#E0315B 0%,#FF5E7E 55%,#8B5CF6 130%);
  --r-sm:8px; --r-md:14px; --r-lg:22px; --r-pill:999px;
  --e2:0 4px 16px rgb(0 0 0/.45),0 0 0 1px rgb(255 255 255/.04);
  --glow-flame:0 0 0 1px rgb(224 49 91/.45),0 8px 28px rgb(224 49 91/.35);
  --glow-gold:0 0 24px rgb(227 184 115/.35);
  --ease:cubic-bezier(.33,1,.68,1); --t-fast:160ms; --t-med:280ms;
}

/* ---------- 1. The dark room ---------- */
html, body{
  background:var(--ink-950) !important;
  background-image:
    radial-gradient(60% 42% at 18% 0%, rgb(224 49 91/.14), transparent 70%),
    radial-gradient(50% 36% at 100% 10%, rgb(139 92 246/.10), transparent 70%) !important;
  background-repeat:no-repeat !important;
  color:var(--cream-200) !important;
  font-family:Inter,-apple-system,"Segoe UI",system-ui,sans-serif !important;
}
::selection{background:rgb(224 49 91/.45); color:#fff;}
*::-webkit-scrollbar{width:10px;height:10px;}
*::-webkit-scrollbar-track{background:var(--ink-900);}
*::-webkit-scrollbar-thumb{background:var(--ink-600);border-radius:5px;}
*::-webkit-scrollbar-thumb:hover{background:var(--flame-600);}

/* Base text: flip every legacy dark-on-light rule */
body, body p, body li, body td, body th, body dd, body dt, body span,
body div, body label, body small, body em, body strong{
  color:inherit;
}
body p, body li, body td, body dd{color:var(--cream-200);}

h1,h2,h3,.h1,.h2,.h3{
  font-family:Fraunces,Georgia,"Times New Roman",serif !important;
  color:var(--cream-50) !important;
  letter-spacing:-0.01em;
  font-weight:600;
}
h1,.h1{line-height:1.1;}
h4,h5,h6{color:var(--cream-50) !important;}

a, a:visited, .standardLink, .invisibleLink, .link,
.moduleFooterListStaedteLink, .moduleFooterNaviEntry a{
  color:var(--blush-400) !important;
  text-decoration:none;
  transition:color var(--t-fast) var(--ease);
}
a:hover, .standardLink:hover{color:var(--blush-300) !important;
  text-decoration:underline; text-underline-offset:3px;}

hr{border:0;border-top:1px solid var(--ink-600);}

:focus-visible{outline:2px solid var(--blush-300) !important;
  outline-offset:3px; border-radius:4px;}

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation:none !important;transition:none !important;}
}

/* ---------- 2. Kill the white chrome, raise ink surfaces ----------
   Legacy wrappers paint white/gradient panels — flatten them all,
   then re-elevate the real card containers. */
[class*="Bg"], [class*="bg"], .box-background, .loading-bg,
.headerContent, .naviContent, .footerContent, .footerWrapper,
.moduleHeadRow, [class*="moduleEventContent"], [class*="modulePreview"],
[class*="moduleLocation"], [class*="moduleGruppenanmeldung"],
[class*="moduleFooter"], [class*="main-part-box"], .box-action,
.overlay-container, .white-bg, .width-full{
  background-color:transparent !important;
  background-image:none !important;
  border-color:var(--ink-600) !important;
  color:var(--cream-200);
}
/* real cards / panels back on ink */
.box-round-corner-all, .box-main, .box-form,
.moduleEventContentIn, .moduleEventProduktLargePreviewIn,
.moduleLocationPreviewIn, .moduleGruppenanmeldungIn,
[class*="main-part-box-middle"], .box-main-wrapper .box-background{
  background-color:var(--ink-800) !important;
  border:1px solid var(--ink-600) !important;
  border-radius:var(--r-md) !important;
  box-shadow:var(--e2);
}
/* generic bootstrap-ish panels on the 2019 platform */
.box-border-all{border:1px solid var(--ink-600) !important;
  border-radius:var(--r-md) !important;}

/* ---------- 3. Navigation ---------- */
.header-wrapper, .header, .header-inner,
.moduleMainNaviWrapper, .moduleMainNavi, .moduleMainNaviIn,
.moduleMainNaviBg, .moduleMainNaviBgIn, .naviContent{
  background:rgb(18 16 24/.92) !important;
  background-image:none !important;
  border:0 !important;
  box-shadow:0 1px 0 rgb(255 255 255/.06);
}
.header-wrapper, .moduleMainNaviWrapper{
  position:sticky; top:0; z-index:900;
  backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
}
.moduleMainNaviEntry, .moduleMainNaviEntry a, .header a, .menu a{
  color:var(--cream-200) !important;
  font-weight:500;
}
.moduleMainNaviEntry a:hover, .header a:hover{
  color:var(--blush-400) !important; text-decoration:none;
}
.naviLogo{filter:brightness(1.6) saturate(1.2);}

/* ---------- 4. CTAs — the heat ---------- */
.submitButton, .submitButtonLink, .submitButtonMini,
a.submitButton, a.submitButtonLink,
input[type="submit"], button[type="submit"], .btn-primary,
[class*="buttonAnmelden"], .bookingButton{
  display:inline-flex !important; align-items:center; justify-content:center;
  gap:.45rem;
  background:var(--heat) !important; background-size:150% 150% !important;
  color:#fff !important;
  border:0 !important; border-radius:var(--r-pill) !important;
  padding:.72em 1.6em !important;
  font-family:Inter,system-ui,sans-serif !important;
  font-weight:650 !important; font-size:1rem !important;
  line-height:1.2 !important; text-decoration:none !important;
  text-shadow:none !important; box-shadow:none;
  cursor:pointer;
  transition:background-position var(--t-med) var(--ease),
             box-shadow var(--t-fast) var(--ease),
             transform var(--t-fast) var(--ease);
}
.submitButton:hover, .submitButtonLink:hover, .submitButtonMini:hover,
input[type="submit"]:hover, button[type="submit"]:hover{
  background-position:100% 50% !important;
  box-shadow:var(--glow-flame);
  transform:translateY(-1px);
  color:#fff !important; text-decoration:none !important;
}
.submitButton:active, .submitButtonLink:active{transform:translateY(0) scale(.98);}
.submitButtonMini{font-size:.875rem !important; padding:.55em 1.2em !important;}
.raquo{color:rgb(255 255 255/.85) !important;}

/* secondary / back links as ghost pills */
.historyBackLink{
  display:inline-block; padding:.5em 1.2em;
  border:1px solid var(--ink-600) !important;
  border-radius:var(--r-pill);
  color:var(--cream-200) !important;
  transition:border-color var(--t-fast) var(--ease);
}
.historyBackLink:hover{border-color:var(--blush-400) !important;
  text-decoration:none !important;}

/* ---------- 5. Event list (homepage match feed) ---------- */
[class*="moduleListAppointmentStadtDatumRow"]{
  background:var(--ink-800) !important;
  border:1px solid var(--ink-600) !important;
  border-radius:var(--r-md);
  box-shadow:var(--e2);
  margin-bottom:10px;
  transition:transform var(--t-fast) var(--ease),
             border-color var(--t-fast) var(--ease);
}
[class*="moduleListAppointmentStadtDatumRow"]:hover{
  transform:translateY(-2px);
  border-color:rgb(224 49 91/.35) !important;
}
[class*="moduleListAppointmentStadtDatumCol"]{
  background:transparent !important; border:0 !important;
  color:var(--cream-200) !important;
}
/* date header rows (Sonntag, 2. Juni …) */
.box-main-wrapper h2, .box-main-wrapper h3{
  color:var(--cream-50) !important;
}
/* age-band text becomes a blush tag */
[class*="moduleListAppointmentStadtDatumCol1"]{
  color:var(--blush-300) !important; font-weight:600;
}
/* prices in gold */
[class*="moduleListAppointmentStadtDatumCol4"], .price, .eventPrice{
  color:var(--gold-200) !important;
  font-variant-numeric:tabular-nums;
  font-weight:650;
}

/* tables on legacy pages (termine, details) */
table{border-collapse:collapse;}
table, table td, table th{
  background-color:transparent !important;
  border-color:var(--ink-600) !important;
  color:var(--cream-200) !important;
}
table th{color:var(--cream-50) !important;}
tr:hover td{background-color:rgb(255 94 126/.05) !important;}

/* ---------- 6. Imagery — one warm grade ---------- */
.moduleEventContent img, .box-main-wrapper img,
.eventLargePreviewImg, img.lazy, img[class*="lazySlide"],
.photo250x190, [class*="photo250"], .supportPhoto,
img[src*="/images/"], img[src*="/assets/dateyork/"],
img[src*="gruende-fuer-speed-dating"]{
  filter:brightness(.88) contrast(1.08) saturate(1.12)
         sepia(.10) hue-rotate(-10deg);
  border-radius:var(--r-sm);
}
/* never grade UI chrome */
.naviLogo, .logo img, img[src*="logo"], img[src*="icon"],
img[src*="Sprite"], img[src*="Auszeichnungen"]{
  filter:none; border-radius:0;
}
/* photo frames lose their white mats */
[class*="photo250x200Shadow"], .photo250x190Wrapper,
[class*="eventLargePreview"]{
  background:transparent !important; border:0 !important;
  box-shadow:none !important;
}

/* stars / ratings in gold */
.stars, .starsNeutral, [class*="rating"]{
  filter:sepia(1) saturate(2.4) hue-rotate(-12deg) brightness(1.1);
}

/* ---------- 7. Forms (Anmeldung flow) ---------- */
input[type="text"], input[type="email"], input[type="tel"],
input[type="password"], input[type="number"], select, textarea{
  background:var(--ink-800) !important;
  color:var(--cream-50) !important;
  border:1px solid var(--ink-600) !important;
  border-radius:var(--r-sm) !important;
  padding:.6em .9em !important;
  font-family:Inter,system-ui,sans-serif !important;
  transition:border-color var(--t-fast) var(--ease),
             box-shadow var(--t-fast) var(--ease);
}
input:focus, select:focus, textarea:focus{
  border-color:var(--blush-400) !important;
  box-shadow:0 0 0 3px rgb(255 94 126/.18) !important;
  outline:none !important;
}
input::placeholder, textarea::placeholder{color:var(--mute-400);}
label{color:var(--cream-200) !important;}

/* ---------- 8. Trust & support furniture, quieter ---------- */
.supportPhoto{border-radius:var(--r-md);}
[class*="checkIcon"], [class*="checkRow"]{opacity:.85;}
/* the green checkmark rows: keep, soften */
.box-legende, [class*="legende"]{opacity:.8;}

/* footer */
.footerWrapper, .footerContent,
.moduleFooterNaviBg, .moduleFooterNaviBgIn,
.moduleFooterListStaedteBg, .moduleFooterListStaedteBgIn{
  background:var(--ink-950) !important;
  border-top:1px solid var(--ink-600) !important;
}
.footerContent, .footerContent *,
.moduleFooterNaviEntry, .moduleFooterNaviEntry a{
  color:var(--mute-400) !important;
  font-size:.875rem;
}
.footerContent a:hover, .moduleFooterNaviEntry a:hover{
  color:var(--blush-300) !important;
}

/* ---------- 9. Slider / hero polish (2024 homepage) ---------- */
.slider-wrapper, #slider, .slide{
  background:transparent !important;
}
.sliderBar, .sliderBarInner{
  background:var(--ink-900) !important;
  border:0 !important; border-radius:var(--r-md);
}
.sliderThumb, .sliderThumbA{
  border-radius:var(--r-sm); overflow:hidden;
  transition:transform var(--t-fast) var(--ease);
  border:1px solid transparent !important;
}
.sliderThumb:hover{transform:scale(1.05);}
.sliderThumbA{border:1px solid var(--blush-400) !important;
  box-shadow:0 0 12px rgb(224 49 91/.4);}
.sliderThumbInner{
  background:linear-gradient(transparent 30%, rgb(11 10 15/.88)) !important;
  color:var(--cream-50) !important; font-weight:600;
  text-shadow:0 1px 3px rgb(0 0 0/.8);
}
#sliderStatusBar, #smallSliderStatusBar{
  background:var(--heat) !important; height:3px !important;
  border-radius:2px;
}
#slide3 h2{color:var(--cream-50) !important;}

/* "Wähle deine Stadt" dropdown bar */
select{cursor:pointer;}

/* the WhatsApp / phone support block */
[class*="whatsapp"], [class*="Whatsapp"]{border-radius:var(--r-md);}

/* ---------- 9b. 2019 booking platform (anmeldung/…) ---------- */
#header{
  background:rgb(18 16 24/.92) !important;
  background-image:none !important;
  border-bottom:1px solid var(--ink-600) !important;
}
#header-bg{
  background-image:none !important;
}
#header h1, #header .h1, .h1-mobile{color:var(--cream-50) !important;}
.phonenumber, .mobilenumber{
  background:var(--ink-800) !important;
  background-image:none !important;
  border:1px solid var(--ink-600) !important;
  border-radius:var(--r-md) !important;
  color:var(--cream-50) !important;
  box-shadow:var(--e2);
}
.phonenumber *, .mobilenumber *{color:var(--cream-50) !important;}
.phonenumber{border-left:3px solid #25D366 !important;}  /* WhatsApp accent */
.mobilenumber{border-left:3px solid var(--gold-400) !important;}
.footer, .footer.clearfix, .footer-row{
  background:var(--ink-950) !important;
  background-image:none !important;
  border-top:1px solid var(--ink-600) !important;
}
.footer a, .footer .sub, .footer .link, .footer h3, .footer h4{
  color:var(--mute-400) !important; font-size:.875rem;
}
.footer a:hover{color:var(--blush-300) !important;}
.footer h3, .footer h4, .footer b{color:var(--gold-200) !important;}
.logo, .logo *{color:var(--cream-50) !important;}
/* platform selects / step dropdowns */
.click-focus-obj, .main-part-box-middle-left, .main-part-box-middle-bg{
  background:var(--ink-800) !important;
  border-radius:var(--r-md) !important;
}
/* cookie banner, dark to match */
.wpcc-container, .wpcc-banner{
  background:var(--ink-800) !important;
  color:var(--cream-200) !important;
  border-top:1px solid var(--ink-600) !important;
}
.wpcc-container a{color:var(--blush-400) !important;}
.wpcc-btn{
  background:var(--heat) !important; color:#fff !important;
  border:0 !important; border-radius:var(--r-pill) !important;
}

/* ---------- 10. Mobile ---------- */
@media (max-width:768px){
  .submitButton, .submitButtonLink{width:100%; min-height:48px;}
  [class*="moduleListAppointmentStadtDatumRow"]{border-radius:var(--r-sm);}
  h1,.h1{font-size:1.9rem !important;}
}