/* WK Pool Pro v2.1.2 — Contrast lock & unified readable app skin
   Doel: geen zwarte tekst op donkere panelen, geen witte/cream breuken, geen WK Pool Pro-logo in topbar. */

:root{
  --wkp212-bg:#050b14;
  --wkp212-bg2:#071221;
  --wkp212-panel:#0b1626;
  --wkp212-panel2:#111b2b;
  --wkp212-border:rgba(255,255,255,.14);
  --wkp212-text:#f8fbff;
  --wkp212-muted:#b8c3d5;
  --wkp212-soft:#d8e0ec;
  --wkp212-accent:#ff7a1a;
  --wkp212-accent2:#f59b2d;
  --wkp212-good:#39d969;
  --wkp212-danger:#ff4d5d;
}

html body:has(.wkp-appshell),
body.elementor-template-canvas:has(.wkp-appshell){
  background:var(--wkp212-bg)!important;
  color:var(--wkp212-text)!important;
}

body:has(.wkp-appshell) .site,
body:has(.wkp-appshell) .site-main,
body:has(.wkp-appshell) .elementor,
body:has(.wkp-appshell) .elementor-section,
body:has(.wkp-appshell) .elementor-container,
body:has(.wkp-appshell) .elementor-widget-wrap,
body:has(.wkp-appshell) .elementor-widget-container,
body:has(.wkp-appshell) .entry-content,
body:has(.wkp-appshell) main{
  background:transparent!important;
  color:var(--wkp212-text)!important;
}

.wkp-appshell,
.wkp-appshell.wkp-v201-dashboard{
  min-height:100vh!important;
  width:100%!important;
  margin:0!important;
  padding:0 24px 86px!important;
  box-sizing:border-box!important;
  background:
    radial-gradient(circle at 8% 0%, rgba(255,122,26,.18), transparent 28%),
    radial-gradient(circle at 95% 0%, rgba(33,69,126,.35), transparent 35%),
    linear-gradient(180deg,#050b14 0%,#081322 42%,#050b14 100%)!important;
  color:var(--wkp212-text)!important;
  font-family:Inter,Roboto,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
}

/* Topbar: geen nep-logo of tekstbranding, alleen navigatie + live status */
.wkp-appshell .wkp-dash-topbar{
  max-width:1180px!important;
  margin:0 auto 18px!important;
  height:auto!important;
  min-height:66px!important;
  padding:10px 18px!important;
  background:rgba(4,9,17,.88)!important;
  border:1px solid rgba(255,255,255,.12)!important;
  border-top:0!important;
  border-radius:0 0 34px 34px!important;
  box-shadow:0 18px 42px rgba(0,0,0,.38)!important;
  backdrop-filter:blur(16px)!important;
  color:#fff!important;
}
.wkp-appshell .wkp-dash-brand,
.wkp-appshell .wkp-dash-brand-header,
.wkp-appshell .wkp-dash-brand::before,
.wkp-appshell .wkp-dash-brand::after{
  display:none!important;
  width:0!important;
  height:0!important;
  flex:0 0 0!important;
  overflow:hidden!important;
  opacity:0!important;
  background:none!important;
  content:none!important;
}
.wkp-appshell .wkp-dash-nav{flex:1 1 auto!important;justify-content:center!important;gap:8px!important;}
.wkp-appshell .wkp-dash-nav a,
.wkp-appshell .wkp-dash-bottomnav a{
  color:rgba(255,255,255,.86)!important;
  text-shadow:none!important;
  text-decoration:none!important;
  background:transparent!important;
}
.wkp-appshell .wkp-dash-nav a span,
.wkp-appshell .wkp-dash-bottomnav a span{color:inherit!important;}
.wkp-appshell .wkp-dash-nav a.active,
.wkp-appshell .wkp-dash-bottomnav a.active{
  background:linear-gradient(135deg,var(--wkp212-accent),var(--wkp212-accent2))!important;
  color:#fff!important;
  box-shadow:0 10px 26px rgba(255,122,26,.38)!important;
}
.wkp-appshell .wkp-dash-live{color:#fff!important;white-space:nowrap!important;}
.wkp-appshell .wkp-dash-live span{background:#42e768!important;}

/* Header/masthead: aangeleverde header is de herkenbaarheid */
.wkp-appshell .wkp-plein60-masthead,
.wkp-appshell .wkp-plein60-submasthead{
  max-width:1180px!important;
  margin:18px auto 24px!important;
  overflow:hidden!important;
  border-radius:30px!important;
  border:1px solid rgba(255,255,255,.14)!important;
  background-color:#050b14!important;
  background-image:url('https://plein60.nl/wp-content/uploads/2026/05/ChatGPT-Image-May-14-2026-01_55_59-PM.png')!important;
  background-size:cover!important;
  background-position:center!important;
  background-repeat:no-repeat!important;
  box-shadow:0 26px 70px rgba(0,0,0,.46)!important;
  color:#fff!important;
}
.wkp-appshell .wkp-plein60-masthead::before,
.wkp-appshell .wkp-plein60-submasthead::before{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  background:linear-gradient(90deg,rgba(2,6,12,.86),rgba(2,6,12,.58),rgba(2,6,12,.72))!important;
  z-index:1!important;
  pointer-events:none!important;
}
.wkp-appshell .wkp-plein60-masthead-media,
.wkp-appshell .wkp-plein60-masthead-shade{display:none!important;}
.wkp-appshell .wkp-plein60-masthead-content,
.wkp-appshell .wkp-plein60-scorecard{position:relative!important;z-index:2!important;}
.wkp-appshell .wkp-plein60-kicker,
.wkp-appshell .wkp-plein60-masthead h1,
.wkp-appshell .wkp-plein60-masthead p,
.wkp-appshell .wkp-plein60-scorecard,
.wkp-appshell .wkp-plein60-scorecard *{color:#fff!important;opacity:1!important;text-shadow:0 2px 10px rgba(0,0,0,.45)!important;}
.wkp-appshell .wkp-plein60-kicker{border-color:rgba(255,122,26,.55)!important;background:rgba(255,122,26,.16)!important;}
.wkp-appshell .wkp-plein60-scorecard{background:rgba(2,7,14,.74)!important;border:1px solid rgba(255,255,255,.18)!important;}

/* Content area nooit licht/cream */
.wkp-appshell .wkp-app-page-content,
.wkp-appshell .wkp-shortcode-page,
.wkp-appshell .wkp,
.wkp-appshell .wkp-stand-page,
.wkp-appshell .wkp-analysis-page,
.wkp-appshell .wkp-kroegen-page,
.wkp-appshell .wkp-live-page,
.wkp-appshell .wkp-rules-page{
  max-width:1180px!important;
  margin-left:auto!important;
  margin-right:auto!important;
  background:transparent!important;
  color:var(--wkp212-text)!important;
}

/* Algemene contrastregel binnen de app */
.wkp-appshell .wkp,
.wkp-appshell .wkp *,
.wkp-appshell .wkp-app-page-content,
.wkp-appshell .wkp-app-page-content *{
  text-shadow:none;
}
.wkp-appshell :is(h1,h2,h3,h4,h5,h6,strong,b,th,summary,label){color:#fff!important;opacity:1!important;}
.wkp-appshell :is(p,li,td,span,small,em,div){color:var(--wkp212-soft)!important;opacity:1!important;}
.wkp-appshell a{color:#fff!important;}
.wkp-appshell .wkp-kicker,
.wkp-appshell small:first-child,
.wkp-appshell .wkp-stat-label,
.wkp-appshell .wkp-card-kicker,
.wkp-appshell .wkp-section-kicker{color:var(--wkp212-accent)!important;letter-spacing:.06em!important;text-transform:uppercase!important;font-weight:900!important;}

/* Donkere appcards overal, zodat witte/cream blokken verdwijnen */
.wkp-appshell :is(.wkp-page-metrics article,.wkp-dash-widget,.wkp-rule-grid article,.wkp-analysis-card,.wkp-front-card,.wkp-front-section,.wkp-news-card,.wkp-pub-stat,.wkp-tavern-card,.wkp-standing-card,.wkp-rank-card,.wkp-card,.wkp-panel,.wkp-details,details,.wkp-notice,.wkp-success,.wkp-hint,.wkp-next,.wkp-table-wrap,.wkp-welcome-box,.wkp-welcome-item,.wkp-orange-banner){
  background:linear-gradient(145deg,rgba(17,27,43,.96),rgba(7,16,29,.96))!important;
  border:1px solid var(--wkp212-border)!important;
  color:var(--wkp212-text)!important;
  box-shadow:0 18px 48px rgba(0,0,0,.32)!important;
}
.wkp-appshell :is(.wkp-page-metrics article,.wkp-dash-widget,.wkp-rule-grid article,.wkp-analysis-card,.wkp-front-card,.wkp-news-card,.wkp-pub-stat,.wkp-tavern-card,.wkp-standing-card,.wkp-rank-card,.wkp-card,.wkp-panel,.wkp-details,details,.wkp-notice,.wkp-success,.wkp-hint,.wkp-next,.wkp-welcome-box,.wkp-welcome-item){
  border-radius:22px!important;
}
.wkp-appshell .wkp-page-metrics article,
.wkp-appshell .wkp-dash-widget,
.wkp-appshell .wkp-rule-grid article{position:relative!important;overflow:hidden!important;}
.wkp-appshell .wkp-page-metrics article::after,
.wkp-appshell .wkp-dash-widget::after,
.wkp-appshell .wkp-rule-grid article::after{
  content:""!important;
  position:absolute!important;
  width:130px!important;height:130px!important;right:-48px!important;top:-52px!important;
  border-radius:999px!important;background:rgba(255,122,26,.12)!important;pointer-events:none!important;
}

/* Tekst in donkere appcards altijd leesbaar */
.wkp-appshell :is(.wkp-page-metrics article,.wkp-dash-widget,.wkp-rule-grid article,.wkp-analysis-card,.wkp-front-card,.wkp-news-card,.wkp-pub-stat,.wkp-tavern-card,.wkp-standing-card,.wkp-rank-card,.wkp-card,.wkp-panel,.wkp-details,details,.wkp-notice,.wkp-success,.wkp-hint,.wkp-next,.wkp-welcome-box,.wkp-welcome-item) :is(h1,h2,h3,h4,h5,h6,strong,b,summary,label){
  color:#fff!important;
}
.wkp-appshell :is(.wkp-page-metrics article,.wkp-dash-widget,.wkp-rule-grid article,.wkp-analysis-card,.wkp-front-card,.wkp-news-card,.wkp-pub-stat,.wkp-tavern-card,.wkp-standing-card,.wkp-rank-card,.wkp-card,.wkp-panel,.wkp-details,details,.wkp-notice,.wkp-success,.wkp-hint,.wkp-next,.wkp-welcome-box,.wkp-welcome-item) :is(p,span,small,td,li,em,div){
  color:var(--wkp212-soft)!important;
}
.wkp-appshell :is(.wkp-page-metrics article,.wkp-dash-widget,.wkp-rule-grid article,.wkp-analysis-card,.wkp-front-card,.wkp-news-card,.wkp-pub-stat,.wkp-tavern-card,.wkp-standing-card,.wkp-rank-card,.wkp-card,.wkp-panel,.wkp-details,details) :is(strong,.wkp-score,.wkp-points,.wkp-value,.wkp-rank-score){
  color:#fff!important;
}
.wkp-appshell .wkp-page-metrics article strong,
.wkp-appshell .wkp-dash-widget em,
.wkp-appshell .wkp-dash-widget .ok,
.wkp-appshell .wkp-rule-grid article span:first-child,
.wkp-appshell .wkp-analysis-card strong,
.wkp-appshell .wkp-pub-stat strong{
  color:var(--wkp212-accent)!important;
}
.wkp-appshell .ok,
.wkp-appshell .wkp-success,
.wkp-appshell .wkp-success *{color:#dfffe8!important;}

/* Dashboard hero cards: oranje koppen wit, lijstdelen donker/transparant en leesbaar */
.wkp-appshell .wkp-dash-hero-card,
.wkp-appshell .wkp-popular-card,
.wkp-appshell .wkp-tavern-dash-card{
  background:linear-gradient(145deg,#ff7819 0%,#d9420c 58%,#0a1220 100%)!important;
  color:#fff!important;
  border:1px solid rgba(255,255,255,.12)!important;
  border-radius:26px!important;
  overflow:hidden!important;
}
.wkp-appshell .wkp-dash-hero-card :is(h2,h3,p,span,small,strong,b,em,div,a){color:#fff!important;}
.wkp-appshell .wkp-dash-row,
.wkp-appshell .wkp-popular-row,
.wkp-appshell .wkp-tavern-row,
.wkp-appshell .wkp-mini-ranking div{
  background:rgba(7,14,25,.72)!important;
  border:1px solid rgba(255,255,255,.12)!important;
  color:#fff!important;
}
.wkp-appshell .wkp-dash-row *,
.wkp-appshell .wkp-popular-row *,
.wkp-appshell .wkp-tavern-row *,
.wkp-appshell .wkp-mini-ranking div *{color:#fff!important;}
.wkp-appshell .wkp-dash-row em,
.wkp-appshell .wkp-popular-row em,
.wkp-appshell .wkp-tavern-row em,
.wkp-appshell .wkp-mini-ranking em{color:var(--wkp212-accent)!important;}

/* Tabellen: nooit zwart-op-donker */
.wkp-appshell table,
.wkp-appshell .wkp-table{
  width:100%!important;
  background:rgba(9,18,32,.92)!important;
  border:1px solid var(--wkp212-border)!important;
  color:#fff!important;
  border-collapse:separate!important;
  border-spacing:0!important;
  overflow:hidden!important;
  border-radius:18px!important;
}
.wkp-appshell thead,
.wkp-appshell th{
  background:rgba(255,122,26,.14)!important;
  color:#fff!important;
}
.wkp-appshell tr,
.wkp-appshell td{
  background:rgba(255,255,255,.025)!important;
  color:var(--wkp212-soft)!important;
  border-color:rgba(255,255,255,.10)!important;
}
.wkp-appshell tr:nth-child(even) td{background:rgba(255,255,255,.045)!important;}
.wkp-appshell td strong,
.wkp-appshell td b{color:#fff!important;}

/* Formulieren blijven licht in het veld zelf, met donkere tekst */
.wkp-appshell input,
.wkp-appshell select,
.wkp-appshell textarea{
  background:#fff!important;
  color:#071221!important;
  border:1px solid rgba(255,255,255,.24)!important;
  box-shadow:none!important;
  text-shadow:none!important;
}
.wkp-appshell input::placeholder,
.wkp-appshell textarea::placeholder{color:#64748b!important;}
.wkp-appshell option{color:#071221!important;background:#fff!important;}
.wkp-appshell input[type="checkbox"],
.wkp-appshell input[type="radio"]{accent-color:var(--wkp212-accent)!important;}
.wkp-appshell .wkp-checkgrid label,
.wkp-appshell .wkp-fields label{
  background:rgba(255,255,255,.055)!important;
  border:1px solid rgba(255,255,255,.12)!important;
  color:#fff!important;
}
.wkp-appshell .wkp-checkgrid label *,
.wkp-appshell .wkp-fields label *{color:inherit!important;}

/* Knoppen */
.wkp-appshell button,
.wkp-appshell .wkp-button,
.wkp-appshell .wkp-dash-link,
.wkp-appshell .wkp-plein60-primary{
  background:linear-gradient(135deg,var(--wkp212-accent),var(--wkp212-accent2))!important;
  border:0!important;
  color:#fff!important;
  font-weight:900!important;
  text-decoration:none!important;
  box-shadow:0 12px 28px rgba(255,122,26,.25)!important;
}
.wkp-appshell button *,
.wkp-appshell .wkp-button *,
.wkp-appshell .wkp-dash-link *,
.wkp-appshell .wkp-plein60-primary *{color:#fff!important;}
.wkp-appshell .wkp-plein60-secondary{background:rgba(255,255,255,.12)!important;color:#fff!important;border:1px solid rgba(255,255,255,.18)!important;}

/* Details/accordions */
.wkp-appshell details summary,
.wkp-appshell .wkp-details summary{
  background:rgba(255,255,255,.06)!important;
  color:#fff!important;
  border-radius:18px!important;
  border:1px solid rgba(255,255,255,.10)!important;
}
.wkp-appshell details summary *{color:#fff!important;}

/* Badges en tellingen */
.wkp-appshell :is(.wkp-badge,.wkp-count,.wkp-counter,.wkp-tab-count,.wkp-hot-badge,.wkp-state-badge,.wkp-points-badge){
  background:rgba(255,122,26,.18)!important;
  color:#fff!important;
  border:1px solid rgba(255,122,26,.35)!important;
}
.wkp-appshell :is(.wkp-badge,.wkp-count,.wkp-counter,.wkp-tab-count,.wkp-hot-badge,.wkp-state-badge,.wkp-points-badge) *{color:#fff!important;}

/* Mobile */
@media (max-width:760px){
  .wkp-appshell{padding:0 12px 92px!important;}
  .wkp-appshell .wkp-dash-topbar{border-radius:0 0 24px 24px!important;margin-bottom:12px!important;padding:8px 10px!important;}
  .wkp-appshell .wkp-dash-nav{justify-content:flex-start!important;overflow-x:auto!important;scrollbar-width:none!important;}
  .wkp-appshell .wkp-dash-live{display:none!important;}
  .wkp-appshell .wkp-plein60-masthead,
  .wkp-appshell .wkp-plein60-submasthead{margin:12px auto 18px!important;border-radius:22px!important;min-height:260px!important;}
  .wkp-appshell .wkp-plein60-scorecard{display:none!important;}
  .wkp-appshell .wkp-page-metrics{grid-template-columns:1fr!important;gap:12px!important;}
}
