/* Dreamspell NL v2.1.5 — Widget + Kalender + Kalibratie */
/* Base tokens */
.dsc, .dreamspell-combined{
  --cell: 46px; --leftcol: 138px;
  --red:#ef4444; --blue:#60a5fa; --yellow:#fde047;
  --core:#2563eb; --today:#059669; --wave:#eab308;
  --dot: 4.6px; --barh: 3.6px; --h-gap: 4px; --v-gap: 6px; --barw: calc(4 * var(--dot) + 3 * var(--h-gap));
}

/* ---- Card widget ---- */
.dsc-card-widget{border:1px solid #e5e7eb; background:#fff; border-radius:16px; padding:18px 18px 14px; box-shadow:0 1px 0 rgba(0,0,0,.02)}
.dsc-card-widget--combined{margin-bottom:14px; width:calc(var(--leftcol) + 13 * var(--cell)); max-width:100%; margin-left:auto; margin-right:auto; box-sizing:border-box;}
.dsc-card-head{font-size:28px; line-height:1.1; font-weight:700; color:#2b170f; margin-bottom:14px}
.dsc-kin-summary{ margin-bottom:4px; }
.dsc-golf-toggle{ display:inline-flex; align-items:center; gap:8px; border:1px solid #e5e7eb; background:#fff; padding:8px 12px; border-radius:8px; cursor:pointer; font-weight:600; color:#1f2937; margin-top:3px; }
.dsc-golf-icon{ display:inline-block; width:18px; text-align:center; font-weight:900; }
.dsc-golf-body{ margin-top:8px; border-left:3px solid #e5e7eb; padding:8px 12px; color:#374151; background:#f9fafb; border-radius:6px; font-size:16px; }
.dsc-castle-info{ margin:10px 0 6px; text-align:center; }
.dsc-castle-toggle{ display:inline-flex; align-items:center; gap:8px; border:1px solid #e5e7eb; background:#fff; padding:8px 12px; border-radius:8px; cursor:pointer; font-weight:700; color:#47352c; font-size:15px; text-align:left; }
.dsc-castle-icon{ display:inline-block; width:18px; text-align:center; font-weight:900; flex-shrink:0; }
.dsc-castle-body{ margin-top:8px; border-left:3px solid #e5e7eb; padding:8px 12px; color:#374151; background:#f9fafb; border-radius:6px; font-size:15px; line-height:1.6; text-align:center; }
.dsc-wave-intro{ margin-bottom:6px; font-style:italic; color:#374151; }
.dsc-wave-vraag{ color:#374151; }
.dsc-wave-vraag strong{ font-style:normal; }
.dsc-card-row{display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:10px}
.dsc-kies{font-weight:600; color:#47352c}
.dsc-date{padding:10px 12px; border-radius:10px; border:1px solid #e5e7eb; background:#f1f5f9; font-size:15px}
.dsc-date--hidden{display:none !important}
.dsc-date-seg-wrap{display:flex; gap:6px; align-items:center}
.dsc-sel{padding:10px 8px; border-radius:10px; border:1px solid #e5e7eb; background:#f1f5f9; font-size:15px; cursor:pointer}
.dsc-sel-day{width:58px}
.dsc-sel-month{width:70px}
.dsc-sel-year{width:88px}
.dsc-today-btn{padding:8px 12px; border-radius:8px; border:1px solid #cbd5e1; background:#fff; cursor:pointer; color:#1f2937 !important; font-size:15px !important;}
.dsc-today-btn:hover,.dsc-today-btn:active{color:#fff !important;}
.dsc-card-title-line{margin:10px 0 6px}
.dsc-big{font-size:22px; font-weight:800; color:#2b170f}
.dsc-card-desc{color:#6b7280; margin-bottom:10px; font-size:18px}
.dsc-card-tone{margin:6px 0 8px; color:#2b170f}
.dsc-card-tone strong{font-size:20px}
.dsc-tone-head{display:flex; align-items:center; gap:10px;}
.dsc-joint{font-size:16px; font-weight:600; color:#6b7280;}
.dsc-tone-desc{ margin-top:4px; font-size:14px; color:#6b7280; }
.chip{display:inline-block; padding:8px 14px; border-radius:12px; border:2px solid #e5e7eb; background:#f8fafc; margin-right:10px; font-size:18px; color:#1f2937}
/* Uitklapper (uitgebreide beschrijving + affirmatie) */
.dsc-more{ margin:6px 0 10px; }
.dsc-more-toggle{ display:inline-flex; align-items:center; gap:8px; border:1px solid #e5e7eb; background:#fff; padding:8px 12px; border-radius:8px; cursor:pointer; font-weight:600; color:#1f2937; }
.dsc-more-icon{ display:inline-block; width:18px; text-align:center; font-weight:900; }
.dsc-more-body{ margin-top:8px; border-left:3px solid #e5e7eb; padding:8px 12px; color:#374151; background:#f9fafb; border-radius:6px; font-size:16px; }
.dsc-affirm{ margin-top:10px; font-weight:700; font-size:16px; color:#111; font-style:italic; }

/* ---- Grid ---- */
.dsc-grid-wrap{overflow-x:hidden}
.dsc-grid{border-collapse:collapse; margin:12px auto; width:max-content}
.dsc-grid th,.dsc-grid td{border:1px solid #000; padding:0; text-align:center; vertical-align:middle}
.dsc-grid .col-head{width:var(--cell); font-weight:700; font-size:calc(var(--cell)*0.30); height:calc(var(--cell)*0.9)}
.dsc-grid .leftcol-head{width:var(--leftcol); height:calc(var(--cell)*0.9); font-weight:700; background:#fff}
.dsc-grid .leftcol{width:var(--leftcol); height:var(--cell); background:#fff; text-align:left; padding:0 6px; display:flex; align-items:center; gap:6px; overflow:hidden; box-sizing:border-box;}
.dsc-grid .color-dot{display:inline-block; width:10px; height:10px; border-radius:2px; border:1px solid #000; margin-right:0; vertical-align:middle}
.dsc-grid .seal-text{display:flex; flex-direction:column; line-height:1.15; min-width:0; flex:1; overflow:hidden;}
.dsc-grid .seal-color-word{font-size:calc(var(--cell)*0.22); font-weight:600; color:#777; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.dsc-grid .seal-name{font-size:calc(var(--cell)*0.26); font-weight:700; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}

.dsc .leftcol .seal-icon{
  width: 44px; height: 44px; object-fit: cover;
  border: 2px solid #000; border-radius: 6px; background:#fff;
}

.dsc-cell{width:var(--cell); height:var(--cell); position:relative; background:#fff; overflow:hidden;}
.dsc-cell.color-red{background:var(--red)} .dsc-cell.color-blue{background:var(--blue)} .dsc-cell.color-yellow{background:var(--yellow)}
.dsc-cell.is-gap{background:#000; color:#fff}
.dsc-cell .kin-num{position:absolute; left:0; right:0; bottom:calc(var(--cell) * 0.1); top:auto; transform:none; font-size:calc(var(--cell)*0.26); font-weight:700; line-height:1; z-index:5}

/* glyph: dots always above bars; centered */
.dsc-glyph{position:absolute; left:0; right:0; top:2px; bottom:calc(var(--cell) * 0.45); height:auto; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:2px; z-index:1; pointer-events:none}
.dsc-glyph .bars{width:var(--barw); display:flex; flex-direction:column; gap:2px}
.dsc-glyph .bar{width:var(--barw); height:var(--barh); background:#111; border-radius:2px; margin:0 auto}
.dsc-glyph .dots{width:var(--barw); display:flex; justify-content:center; gap:var(--h-gap); margin:0}
.dsc-glyph .dot{width:var(--dot); height:var(--dot); border-radius:50%; background:#111}
.dsc-glyph.on-dark .bar,.dsc-glyph.on-dark .dot{background:#fff}

/* Kerndag = blauw hoekvlag (links-boven) */
.dsc-cell.is-core::before{
  content:''; position:absolute; top:3px; left:3px; width:0; height:0;
  border-top: 16px solid var(--core);
  border-right: 16px solid transparent;
  pointer-events:none;
}

/* Gekozen datum = groen hoekvlag (rechts-boven) */
.dsc-cell.is-selected::after{
  content:''; position:absolute; top:3px; right:3px; width:0; height:0;
  border-top: 16px solid var(--today);
  border-left: 16px solid transparent;
  pointer-events:none;
}
.dsc-cell.is-selected .kin-num{ color: var(--today); font-weight:900; }

/* Selected wave outline (green) – volledig via box-shadow, geen conflict met ::before/::after */
.dsc-cell.selwave{ box-shadow: inset 3px 0 0 var(--today), inset -3px 0 0 var(--today); position:relative; z-index:4 }
.dsc-cell.selwave.sel-top{ box-shadow: inset 3px 0 0 var(--today), inset -3px 0 0 var(--today), inset 0 3px 0 var(--today); }
.dsc-cell.selwave.sel-bottom{ box-shadow: inset 3px 0 0 var(--today), inset -3px 0 0 var(--today), inset 0 -3px 0 var(--today); }
.dsc-cell.selwave.sel-top.sel-bottom{ box-shadow: inset 3px 0 0 var(--today), inset -3px 0 0 var(--today), inset 0 3px 0 var(--today), inset 0 -3px 0 var(--today); }

/* Legend */
.dsc-legend-spacer{height:calc(var(--cell) * 3); display:flex; align-items:center; justify-content:center; background:#fff}
.dsc-legend{display:flex; gap:48px; align-items:flex-start; justify-content:center}
.dsc-legend-col{display:flex; flex-direction:column; align-items:center; gap:8px}
.dsc-legend-label{font-size:12px; line-height:1.1; text-align:center}
.dsc-icon{width:16px; height:16px; display:block; box-sizing:border-box; border-radius:2px}
.dsc-icon--gap{background:#000; border:0}
.dsc-icon--core{background:transparent; border:0; position:relative}
.dsc-icon--core::after{content:''; position:absolute; top:0; left:0; width:0; height:0; border-top: 12px solid var(--core); border-right: 12px solid transparent;}
.dsc-icon--selected{background:transparent; border:0; position:relative}
.dsc-icon--selected::after{content:''; position:absolute; top:0; right:0; width:0; height:0; border-top: 12px solid var(--today); border-left: 12px solid transparent;}

/* Responsive */
@media (max-width:1024px){
  .dsc, .dreamspell-combined{ --cell:38px; --leftcol:118px; }
  .dsc{ --dot:4.2px; --barh:3.2px; --h-gap:3.4px; --v-gap:6px; }
}
@media (max-width:768px){
  .dsc, .dreamspell-combined{
    --leftcol: clamp(80px, 22vw, 118px);
    --cell: clamp(14px, calc((100vw - var(--leftcol) - 32px) / 13), 46px); }
  .dsc{ --dot:3.9px; --barh:3.0px; --h-gap:3px; --v-gap:5.5px; --leftcol:clamp(92px, 28vw, 132px); }
  .chip{font-size:16px}
  .dsc-card-head{font-size:24px}
  .dsc-big{font-size:20px}
  .dsc-card-desc{font-size:16px}
  .dsc-cell.is-core::before{ border-top-width:8px; border-right-width:8px; }
  .dsc-cell.is-selected::after{ border-top-width:8px; border-left-width:8px; }
  .dsc .leftcol{ white-space:normal; padding:0 3px; gap:3px; }
  .dsc .leftcol .seal-icon{ width:24px; height:24px; max-width:calc(var(--cell) - 2px); max-height:calc(var(--cell) - 2px); }
  .dsc-grid .seal-text{ line-height:1; }
  .dsc .leftcol .seal-name{ line-height:1; }
}

/* --- Compact modus --- */
.dsc.dsc-compact .dsc-grid{ width:100%; }
@media (max-width:1024px){ .dsc.dsc-compact{ --cell: calc((100% - var(--leftcol) - 12px)/13) !important; } }
@media (max-width:768px){ .dsc.dsc-compact{ --leftcol: clamp(86px,24vw,118px); } }
@media (max-width:420px){ .dsc.dsc-compact{ --leftcol: clamp(80px,28vw,110px); } }

/* --- Mobiele vereenvoudiging --- */
@media (max-width: 768px){
  .dsc.dsc-mobile-slim .dsc-glyph{ display:none !important; }                     /* verberg tonen */
  .dsc.dsc-mobile-slim .dsc-wave-badge{ display:none !important; }                /* verberg golfnummers */
}


@media (max-width:420px){
  .dsc{ --leftcol: clamp(96px, 30vw, 140px); }
}

/* v2.1.5-custom: golfnummer in rechterbovenhoek van eerste kin per golf */
.dsc .dsc-wave-badge{
  position:absolute; top:1px; right:2px;
  font-size:calc(var(--cell)*0.20); font-weight:700; line-height:1;
  z-index:6; color:#111; pointer-events:none;
}
.dsc .dsc-wave-badge.on-dark{ color:#fff; }

/* Intro-tekst boven de 5 Swastika's */
.dsc-swastika-intro{
  padding:12px 20px 4px; text-align:center;
  font-size:14px; color:#374151; line-height:1.6;
  background:#fff;
}
.dsc-swastika-intro-title{
  font-weight:700; font-size:16px; margin:0 0 8px;
}
.dsc-swastika-intro p{
  margin:0 0 10px;
}
.dsc-swastika-intro p:last-child{ margin-bottom:0; }

/* --- 5 Swastika's (Kastelen) --- */
.dsc-swastikas{
  display:flex; justify-content:center; align-items:flex-start;
  gap:12px; padding:18px 8px 10px; flex-wrap:wrap; background:#fff;
}
.dsc-swastika-item{
  display:flex; flex-direction:column; align-items:center; gap:5px;
  opacity:0.28; transition:opacity 0.25s, transform 0.2s;
  cursor:pointer;
}
.dsc-swastika-item:not(.dsc-swastika-active):hover{
  opacity:0.65; transform:scale(1.04);
}
.dsc-swastika-item.dsc-swastika-active{
  opacity:1; transform:scale(1.08);
}
.dsc-swastika-img-wrap{
  position:relative; display:block;
}
.dsc-swastika-item.dsc-swastika-active .dsc-swastika-img-wrap::after{
  content:''; position:absolute; top:3px; right:3px; width:0; height:0;
  border-top: 14px solid var(--today);
  border-left: 14px solid transparent;
  pointer-events:none; z-index:10;
}
.dsc-swastika-item img{
  width:90px; height:90px; object-fit:contain;
  border:2px solid #d1d5db; border-radius:8px; background:#f8fafc;
  display:block;
}
.dsc-swastika-item.dsc-swastika-active img{
  border-color:#059669; box-shadow:0 0 0 3px #05966933;
}
.dsc-swastika-placeholder{
  width:90px; height:90px; border-radius:8px; border:2px dashed #d1d5db;
  display:flex; align-items:center; justify-content:center;
  background:#f1f5f9;
}
.dsc-castle-red   .dsc-swastika-placeholder,.dsc-swastika-placeholder.dsc-castle-red  { background:#fecaca; border-color:#ef4444; }
.dsc-swastika-placeholder.dsc-castle-white { background:#f8fafc; border-color:#94a3b8; }
.dsc-swastika-placeholder.dsc-castle-blue  { background:#bfdbfe; border-color:#60a5fa; }
.dsc-swastika-placeholder.dsc-castle-yellow{ background:#fef9c3; border-color:#fde047; }
.dsc-swastika-placeholder.dsc-castle-green { background:#bbf7d0; border-color:#22c55e; }
.dsc-swastika-num{
  font-size:11px; font-weight:700; color:#6b7280;
}
.dsc-swastika-label{
  font-size:10px; font-weight:600; color:#374151;
  text-align:center; max-width:90px; line-height:1.2;
}
.dsc-swastika-item.dsc-swastika-active .dsc-swastika-num,
.dsc-swastika-item.dsc-swastika-active .dsc-swastika-label{
  color:#059669;
}
@media (max-width:600px){
  .dsc-swastika-item img,.dsc-swastika-placeholder{ width:56px; height:56px; }
  .dsc-swastikas{ gap:8px; padding:12px 4px 8px; }
  .dsc-swastika-label{ font-size:9px; max-width:56px; }
}

/* HTML Kasteel Swastika Grid */
.dsc-swastikas-grid-wrap{
  overflow-x:auto; padding:10px 0 18px; background:#fff;
}
.dsc-castle-wrap{
  display:flex; flex-direction:column; align-items:center;
}
.dsc-sw-year-bar{
  width:100%; text-align:center; padding:10px 0 16px;
}
.dsc-sw-year{
  font-size:16px; font-weight:700; color:#374151;
  letter-spacing:0.06em;
}
.dsc-castle-grid{
  --sw-cell:54px;
  display:grid;
  grid-template-rows:repeat(11,var(--sw-cell));
  grid-template-columns:repeat(11,var(--sw-cell));
  gap:2px;
  width:max-content;
  margin:0 auto;
}
.dsc-sw-cell{
  position:relative; display:flex; flex-direction:column;
  align-items:center; justify-content:center;
  border-radius:4px; overflow:hidden; cursor:default;
  user-select:none; padding:1px;
}
.dsc-sw-red   { background:#ef4444; color:#fff; }
.dsc-sw-white { background:#fff; color:#111; border:1px solid #cbd5e1; }
.dsc-sw-blue  { background:#3b82f6; color:#fff; }
.dsc-sw-yellow{ background:#fde047; color:#111; }

.dsc-sw-core  { box-shadow:inset 0 0 0 2px #374151; }
/* Actieve kin: groene rand + driehoekje rechtsboven */
.dsc-sw-sel{
  box-shadow:inset 0 0 0 3px #059669 !important; z-index:1;
}
.dsc-sw-sel::after{
  content:''; position:absolute; top:2px; right:2px; width:0; height:0;
  border-top:calc(var(--sw-cell)*0.28) solid var(--today,#059669);
  border-left:calc(var(--sw-cell)*0.28) solid transparent;
  pointer-events:none; z-index:10;
}
.dsc-sw-num{
  font-size:calc(var(--sw-cell)*0.17); font-weight:700; line-height:1;
  opacity:0.88;
}
.dsc-sw-abbr{
  font-size:calc(var(--sw-cell)*0.2); font-weight:800;
  line-height:1.1; text-align:center;
}
.dsc-sw-tag{
  font-size:calc(var(--sw-cell)*0.155); line-height:1; opacity:0.85;
}
.dsc-sw-date{
  font-size:calc(var(--sw-cell)*0.135); line-height:1; opacity:0.9;
  letter-spacing:-0.02em; font-weight:600;
}
.dsc-sw-wave-label{
  display:flex; align-items:center; justify-content:center;
  font-size:calc(var(--sw-cell)*0.22); font-style:italic; font-weight:700;
  color:#374151; text-align:center; line-height:1.2;
  white-space:normal; overflow:hidden; padding:2px;
}
.dsc-sw-wave-active{
  color:#059669; font-weight:900; font-size:calc(var(--sw-cell)*0.27);
  text-decoration:underline; text-decoration-color:#059669;
}
.dsc-sw-center{
  display:flex; align-items:center; justify-content:center;
  font-size:calc(var(--sw-cell)*0.3); font-weight:800; color:#9ca3af;
  border:2px dashed #e5e7eb; border-radius:4px;
}
@media(max-width:600px){
  .dsc-castle-grid{ --sw-cell:42px; }
  .dsc-sw-date{ display:none; }
}
@media(max-width:460px){
  .dsc-castle-grid{ --sw-cell:30px; }
  .dsc-sw-num{ font-size:7px; }
  .dsc-sw-tag{ font-size:6px; }
  .dsc-sw-abbr{ font-size:7px; }
}
@media(max-width:360px){
  .dsc-castle-grid{ --sw-cell:24px; }
  .dsc-sw-num{ font-size:6px; }
  .dsc-sw-tag{ display:none; }
  .dsc-sw-abbr{ font-size:6px; }
}

/* Touch tooltip (mobile) */
.dsc-touch-tooltip{
  position:fixed; background:rgba(0,0,0,0.82); color:#fff;
  padding:6px 10px; border-radius:6px; font-size:13px; line-height:1.4;
  max-width:220px; text-align:center; z-index:9999; pointer-events:none;
  white-space:normal;
}

/* Grote actieve swastika onder de 5 kleine */
.dsc-swastika-large{
  display:flex; flex-direction:column; align-items:flex-start; gap:10px;
  padding:12px 0 18px; background:#fff;
  width: calc(var(--leftcol) + 13 * var(--cell));
  max-width: 100%;
}
.dsc-swastika-large-img-wrap{
  position:relative; width:100%;
}
.dsc-swastika-large img{
  width:100%; height:auto; aspect-ratio:1/1; object-fit:contain;
  border:3px solid #059669; border-radius:12px;
  box-shadow:0 0 0 4px #05966922;
  display:block;
}
.dsc-swastika-large-placeholder{
  width:100%; aspect-ratio:1/1; border-radius:12px;
  border:3px dashed #d1d5db; background:#f1f5f9;
}
.dsc-swastika-large-placeholder.dsc-castle-red   { background:#fecaca; border-color:#ef4444; }
.dsc-swastika-large-placeholder.dsc-castle-white { background:#f8fafc; border-color:#94a3b8; }
.dsc-swastika-large-placeholder.dsc-castle-blue  { background:#bfdbfe; border-color:#60a5fa; }
.dsc-swastika-large-placeholder.dsc-castle-yellow{ background:#fef9c3; border-color:#fde047; }
.dsc-swastika-large-placeholder.dsc-castle-green { background:#bbf7d0; border-color:#22c55e; }
/* Groene kin-badge overlay rechts-boven — zelfde stijl als is-selected in de kalender */
.dsc-swastika-kin-overlay{
  position:absolute; top:10px; right:10px;
  background:#059669; color:#fff;
  font-size:15px; font-weight:800;
  padding:5px 12px; border-radius:8px;
  box-shadow:0 2px 8px #05966966;
  pointer-events:none; line-height:1.2;
}
.dsc-swastika-large-label{
  font-size:15px; font-weight:700; color:#059669; text-align:left;
  padding-left:4px;
}