@charset "UTF-8";
/*
 * Omgezet naar Sass op 1 september 2026, puur voor de build-consolidatie
 * (één `npm run build:css` voor alle CSS-bestanden i.p.v. drie apart
 * onderhouden bestanden). De inhoud hieronder is BEWUST NIET aangepast: dit
 * bestand is zelf al gedocumenteerd als "near-verbatim overgenomen van het
 * legacy css/uislagstylen.css", met een reeks pixel-nauwkeurige fixes die
 * bij specifieke, met de hand geteste regressies zijn gevonden (zie het
 * eigen docblok hieronder). Geen kleuren vervangen door variabelen, geen
 * herstructurering: dit is gewoon dezelfde CSS, nu via het .scss-bestand
 * gecompileerd in plaats van rechtstreeks bewerkt. Wie hier ooit iets aan
 * wil "opschonen" (bijv. de herhaalde #4297d7/#5c9ccc-headerkleuren of de
 * losse font-family-herhalingen bundelen): eerst opnieuw tegen de echte
 * inhoud van een bestand als UT20250628.html testen, precies zoals bij elke
 * eerdere aanpassing hier is gedaan — zie de docblokken hieronder voor de
 * volledige geschiedenis van wat er allemaal al fout ging bij ogenschijnlijk
 * onschuldige wijzigingen aan dit bestand.
 */
/*
 * Uitslagen-styling, near-verbatim overgenomen van het legacy
 * `css/uislagstylen.css` (ongewijzigde inhoud, alleen de vier
 * `../scripts/plaatjes/ui-bg_gloss-wave_55_5c9ccc_500x100.png`-verwijzingen
 * omgezet naar de nieuwe root-relatieve `/assets/img/uitslagen/...`-locatie)
 * plus, onderaan, het `#dhtmltooltip`-blok uit het legacy `css/dbc.css`
 * (was daar sitebreed gedefinieerd, hier bewust alleen op de
 * uitslagen-pagina's geladen totdat Weekspel — dat dezelfde hover-popups via
 * `app/ThirdParty/Legacy/deal.php` hergebruikt — ook gebouwd is, zie
 * stappenplan-herbouw-bigbang.md).
 *
 * Gevonden bij Pauls eerste test: zonder dit bestand (en zonder
 * `public/assets/js/tooltip.js` + de `#dhtmltooltip`-container-div, zie
 * app/Views/uitslagen/toon.php) renderen de uitslagtabellen wel, maar zonder
 * opmaak, en werken de hover-detailpopups niet (de onderliggende
 * `ddrivetip()`/`hideddrivetip()`-functies bestonden nergens op de pagina).
 *
 * `.uitslagen-legacy` (hieronder): de legacy tabellen/popups zijn gebouwd op
 * de oude sitebrede `html{font-size:80%}` (css/dbc.css) en op de kale
 * browserstandaard-regelhoogte (nergens een eigen `line-height`
 * gedefinieerd). De nieuwe site heeft geen sitebrede font-size-verkleining
 * en Bootstrap zet `line-height:1.5` op body. Zonder deze correctie rendert
 * alle legacy-content zo'n 25-50% groter/hoger dan bedoeld: de
 * popup-breedtes die tooltip.js hardcoded instelt (350-730px, zie
 * `ddrivetip()`) zijn daar niet op berekend, waardoor de popup niet meer op
 * het scherm past en (doordat hij daardoor over de aanroepende link heen
 * komt te liggen, wat een spurieuze `mouseout` triggert) bijna onmiddellijk
 * weer verdwijnt. Gevonden bij Pauls derde test. Toegepast op zowel de
 * wrapper om de getoonde uitslag (`uitslagen/toon.php`) als op
 * `#dhtmltooltip` zelf, want beide bevatten dezelfde legacy-tabellen.
 *
 * `box-sizing: content-box` in diezelfde `.uitslagen-legacy`-regel
 * (gevonden bij Pauls vierde test): Bootstrap zet sitebreed
 * `*{box-sizing:border-box}`. Bij `#dhtmltooltip` telt `tipobj.style.width`
 * (de 350-730px die `ddrivetip()` instelt) daardoor de eigen
 * `padding`+`border` (2px+2px aan elke kant) MEE, terwijl de legacy tabellen
 * binnenin nog steeds op het oude content-box-model gebouwd zijn (dus qua
 * eigen kolombreedtes precies de volle opgegeven breedte verwachten). Het
 * gevolg was tweeledig: de koptekst/tabel staken een paar pixels uit rechts
 * van het afgeronde kader (het "onderliggend frame"), én omdat de browser
 * die overstekende pixels niet meetelt in `tipobj.offsetWidth`, dacht
 * `positiontip()` in tooltip.js dat de popup smaller was dan hij werkelijk
 * rendert — waardoor hij bij de rand van het scherm soms toch (deels)
 * buiten beeld werd geplaatst. Teruggezet naar `content-box`, zoals de
 * legacy site (van vóór elke box-sizing-reset) het altijd had, lost beide
 * op. Ook op alle afstammelingen toegepast, voor het geval een volgende
 * popup/tabel-variant hetzelfde probleem zou hebben.
 */
.uitslagen-legacy,
.uitslagen-legacy * {
  box-sizing: content-box;
}

/*
 * `.uitslagen-legacy-content` (alleen op de wrapper om de getoonde uitslag,
 * NIET op #dhtmltooltip, zie het docblok van uitslagen/toon.php): de
 * niet-responsive "De Spellen"-tabellen kunnen breder zijn dan col-md-8 op
 * smallere vensters. `overflow-x:auto` laat zo'n te brede tabel binnen
 * zijn eigen kolom horizontaal scrollen i.p.v. over de rand heen te lopen
 * tot onder de sidebar ernaast — waar hover-events op de rechterkolom van
 * spellen (verkeerd) op de sidebar terechtkwamen i.p.v. op het eronder
 * liggende plaatje. Gevonden bij Pauls zevende test.
 *
 * Bugfix-poging (gevonden bij Pauls test van Weekspel, met een frequentie-/
 * scoretabel die breder was dan de kolom): met overflow-x:auto ALLEEN op
 * deze buitenste wrapper zit de daadwerkelijke scrollbalk pas helemaal
 * onderaan de HELE getoonde content — dus vaak ver onder de brede tabel
 * zelf, buiten beeld, op het moment dat je 'm nodig hebt. Twee pogingen
 * geprobeerd om dat per te-breed-element apart op te lossen (eerst een
 * vaste CSS-regel op `table`/`.richFrequentiestaat`, daarna een generiek
 * meet-i.p.v.-gok JS-bestand, `legacy-overflow-fix.js`) — technisch werkte
 * de tweede poging, maar Paul gaf aan dat een scrollbalk per element, zelfs
 * op de juiste plek, in de praktijk toch niet prettig genoeg is (met name
 * bij een hoge tabel staat die balk dan nog steeds onderaan DIE tabel).
 * **Op Pauls uitdrukkelijk verzoek teruggedraaid** ("scollen per element
 * terugdraaien ik ga op een later tijdstip wel kijken hoe hiermee om te
 * gaan"): `legacy-overflow-fix.js` is verwijderd en niet meer geladen,
 * terug naar deze simpele éné-scrollbalk-voor-de-hele-wrapper-opzet.
 *
 * Definitieve oplossing (stappenplan sectie 5/58, opnieuw naar boven
 * gekomen bij Pauls regressietest op UT20250628.html): met alleen
 * `overflow-x:auto` hierboven zit de scrollbalk zelf onderaan deze wrapper —
 * en die kan bij een volledig kroegentocht-archiefbestand duizenden pixels
 * hoog zijn (8500+ px gemeten), dus de balk is dan in de praktijk
 * onbereikbaar zonder eerst helemaal naar beneden te scrollen. In plaats
 * van (opnieuw) een scrollbalk per te-breed-element, plaatst
 * `legacy-sticky-scrollbar.js` nu ÉÉN sticky schaduw-scrollbalk
 * (`.uitslagen-legacy-scrollbar` hieronder) per wrapper die daadwerkelijk
 * overflow heeft, die dankzij `position:sticky` altijd onderaan het
 * zichtbare venster blijft hangen zolang de wrapper zelf nog in beeld is —
 * bereikbaar ongeacht waar je in de (hoge) tabel gescrold hebt. Getest
 * tegen de echte inhoud van UT20250628.html vóór livegang; zie het
 * stappenplan voor de eerder overwogen (en verworpen) alternatieven
 * (max-height+overflow-y, of automatisch schalen).
 */
/*
 * AANVULLING (13 september 2026, sectie 65.48): bij een KORTE wrapper
 * (zoals een gewoon weekspel, i.t.t. een heel kroegentocht-archief) staan
 * de eigen browser-scrollbar van deze wrapper (hierboven bedoeld, zit
 * standaard onderaan DEZE box) en de sticky schaduwbalk hieronder vlak na
 * elkaar, dus zie je per ongeluk 2 scrollbalken i.p.v. de bedoelde ÉÉN.
 * Kwam pas aan het licht nadat `.col-md-8` een `min-width:0`-fix kreeg
 * (site-theme.css/.scss) waardoor deze wrapper voor het eerst ook echt
 * zelf overloopt i.p.v. dat de kolom eromheen meegroeide. Oplossing: de
 * eigen browser-scrollbar blijft functioneel gewoon werken (scrollen met
 * de sticky balk hieronder, met touchpad/muiswiel, of met toetsenbord
 * blijft allemaal werken), 'm alleen visueel verbergen, zodat alleen de
 * sticky schaduwbalk zichtbaar is — precies zoals de opzet hierboven
 * altijd al bedoeld was.
 */
.uitslagen-legacy-content {
  overflow-x: auto;
  scrollbar-width: none;
}

.uitslagen-legacy-content::-webkit-scrollbar {
  display: none;
}

.uitslagen-legacy-wrap {
  position: relative;
}

.uitslagen-legacy-scrollbar {
  position: sticky;
  bottom: 0;
  overflow-x: auto;
  overflow-y: hidden;
  height: 14px;
  background: rgba(0, 0, 0, 0.06);
  z-index: 5;
}

.uitslagen-legacy-scrollbar-track {
  height: 1px;
}

.uitslagen-legacy {
  font-size: 80%;
  line-height: normal;
}

.uitslagMaintable {
  border: 1px solid;
}

.uitslagTable {
  border-collapse: collapse;
  padding: 0;
  font-size: 13px;
  font-family: Lucida Grande, Lucida Sans, Arial, sans-serif;
}

.uitslagThNamen {
  text-align: left;
  width: 300px;
}

.uitslagThPerc {
  text-align: center;
  width: 45px;
}

.uitslagThPoint {
  text-align: right;
  width: 45px;
}

.VTStandSpace {
  width: 30px;
}

.TDLeft {
  text-align: left;
  padding-left: 4px;
}

.TDRight {
  text-align: right;
  padding-left: 4px;
}

.TDCenter {
  text-align: center;
}

.TDCenterRed {
  text-align: center;
  color: Red;
}

.uitslagThRonden {
  text-align: right;
  width: 40px;
  font-size: 9px;
  font-family: Lucida Grande, Lucida Sans, Arial, sans-serif;
}

.paarUitslag {
  text-align: center;
}

.PaarUitslagHeader {
  text-align: left;
  border: 1px solid #4297d7;
  background: #5c9ccc url(/assets/img/uitslagen/ui-bg_gloss-wave_55_5c9ccc_500x100.png) 50% 50% repeat-x;
  color: #ffffff;
  font-weight: bold;
}

.PaarUitslagThScore {
  width: 60px;
}

.PaarUitslagThPerc {
  width: 60px;
}

.PaarUitslagSubHeader {
  text-align: left;
  font-size: 11px;
  font-family: Lucida Grande, Lucida Sans, Arial, sans-serif;
}

.PaarUitslagDetail {
  display: inline-block;
  color: #222222;
  padding-bottom: 10px;
}

.PaarDetailsTable {
  border: 1px solid #111111;
  border-collapse: collapse;
  border-spacing: 0;
  background-color: white;
  padding: 0;
}

.VTUitslagThScore {
  width: 60px;
  text-align: center;
}

.VTUitslagThIMP {
  width: 45px;
  text-align: center;
}

.VTUitslagIMPTot {
  text-align: center;
  width: 45px;
  border-top: 1px solid #111111;
}

.VTUitslagTeamFiller {
  text-align: center;
  width: 40px;
}

.VTDetailHeaderTD {
  font-style: italic;
  text-align: center;
}

.VTTotalLine {
  border-top: 2px solid;
  text-align: center;
}

.VTContract {
  width: 30px;
  text-align: left;
}

.VTLead {
  width: 35px;
  text-align: left;
}

.TREven {
  background-color: #e0e0e0;
}

.TROdd {
  background-color: transparent;
}

.PaarUitslagFooter {
  text-align: right;
}

.PaarUitslagResult {
  text-align: right;
  font-weight: bold;
}

.frequentieStaatTable {
  border: 0px;
  padding: 0;
  width: 170px;
  font-size: 13px;
  font-family: Lucida Grande, Lucida Sans, Arial, sans-serif;
}

.frequentieStaatScoreHeader {
  text-align: left;
  width: 35%;
}

.frequentieStaatAantHeader {
  text-align: center;
  width: 15%;
}

.frequentieStaatPointsHeader {
  text-align: left;
  width: 25%;
}

.frequentieStaatBijzonder {
  font-size: 0.8em;
}

.myLine td {
  border-bottom: 1px solid #5c9ccc;
}

.standMaintable {
  border: 1px solid;
}

.standTable {
  border-collapse: collapse;
  padding: 0;
  font-size: 13px;
  font-family: Lucida Grande, Lucida Sans, Arial, sans-serif;
}

.standThLijn {
  text-align: right;
  width: 60px;
}

.standThNaamSmal {
  text-align: left;
  width: 240px;
}

.standThNaamBreed {
  text-align: left;
  width: 300px;
}

.standThCenter {
  text-align: center;
  width: 50px;
}

.standThGem {
  text-align: center;
  width: 50px;
}

.standThTot {
  text-align: center;
  width: 80px;
}

.standThZitting {
  text-align: center;
  width: 50px;
}

.popupHover {
  color: blue;
  text-decoration: underline;
}

.richFrequentiestaat {
  text-align: center;
  min-width: 728px;
  /* width: 100%; */
  display: inline-block;
}

.richFrequentiestaatHeader {
  text-align: left;
  border: 1px solid #4297d7;
  background: #5c9ccc url(/assets/img/uitslagen/ui-bg_gloss-wave_55_5c9ccc_500x100.png) 50% 50% repeat-x;
  color: #ffffff;
  font-weight: bold;
  /* display: inline-block; */
}

.richFrequentiestaatSubHeader {
  text-align: right;
  color: #000000;
  font-weight: bold;
  padding: 0px;
  margin: 0px;
}

.richFrequentiestaatDetail {
  padding-top: 10px;
  width: 100%;
  display: inline-block;
  color: #222222;
}

.richFrequentiestaatTable {
  border: 1px solid #111111;
  background-color: white;
  padding: 0;
  border-spacing: 0;
  width: 100%;
}

.richFrequentiestaatPaarHeader {
  text-align: left;
  width: 35%;
}

.scoreKaart {
  text-align: center;
}

.scoreKaartHeader {
  text-align: left;
  border: 1px solid #4297d7;
  background: #5c9ccc url(/assets/img/uitslagen/ui-bg_gloss-wave_55_5c9ccc_500x100.png) 50% 50% repeat-x;
  color: #ffffff;
  font-weight: bold;
}

.scoreKaartDetail {
  padding-top: 10px;
  display: inline-block;
  color: #222222;
}

.scoreKaarTable {
  border: 1px solid #111111;
  background-color: white;
  padding: 0;
  border-spacing: 0;
}

.scoreKaartThP {
  font-size: 10px;
}

.scoreKaartThContract {
  font-size: 10px;
  text-align: center;
}

.scoreKaartThR {
  font-size: 10px;
  width: 25px;
}

.scoreKaartThScore {
  font-size: 10px;
  text-align: center;
}

.scoreKaartThPoints {
  font-size: 10px;
  text-align: center;
}

.scoreKaartThNZ {
  font-size: 10px;
}

.scoreKaartThOW {
  font-size: 10px;
}

.spelHandContainer {
  height: 100%;
  vertical-align: top;
  text-align: left;
  font-size: 0.8em;
  font-family: Verdana;
}

.spelContainer {
  border: 1px solid;
  vertical-align: top;
  padding-left: 3px;
}

.spellenTable {
  border: 1px solid;
  border-collapse: collapse;
}

.spelTable {
  text-align: left;
  font-size: 12px;
  font-family: Lucida Grande, Lucida Sans, Arial, sans-serif;
}

.spelTD1 {
  text-align: left;
  vertical-align: middle;
  width: 33%;
  height: 100%;
  font-size: 0.8em;
  font-family: Verdana;
}

.spelTD2 {
  text-align: left;
  vertical-align: middle;
}

.drrTDlink {
  text-align: right;
  vertical-align: top;
}

.ddr {
  text-align: center;
}

.ddrHeader {
  text-align: left;
  border: 1px solid #4297d7;
  background: #5c9ccc url(/assets/img/uitslagen/ui-bg_gloss-wave_55_5c9ccc_500x100.png) 50% 50% repeat-x;
  color: #ffffff;
  font-weight: bold;
}

.ddrDetail {
  display: inline-block;
  color: #222222;
}

.ddrTable {
  border: 1px solid #111111;
  border-collapse: collapse;
  border-spacing: 0;
  background-color: white;
  padding: 0;
}

.ddrNHeader {
  text-align: center;
}

.ddrOHeader {
  text-align: center;
}

.ddrZHeader {
  text-align: center;
}

.ddrWHeader {
  text-align: center;
}

.ddrSAHeader {
  font-size: 10px;
}

.ddrSpadeHeader {
  font-size: 10px;
}

.ddrHeartHeader {
  font-size: 10px;
}

.ddrDiamondHeader {
  font-size: 10px;
}

.ddrClubHeader {
  font-size: 10px;
}

.ddrPar {
  font-size: 0.8em;
}

#legendaHeader {
  text-align: left;
  border: 1px solid #4297d7;
  background: #5c9ccc url(/assets/img/uitslagen/ui-bg_gloss-wave_55_5c9ccc_500x100.png) 50% 50% repeat-x;
  color: #ffffff;
  font-weight: bold;
}

#legendaDetail {
  padding: 5px;
}

/* Uit legacy css/dbc.css (was daar sitebreed gedefinieerd, zie klasse- */
/* docblok bovenaan dit bestand voor waarom dat hier is losgeknipt).    */
#dhtmltooltip {
  position: absolute;
  width: 150px;
  border: 2px solid #a6c9e2;
  padding: 2px;
  background-color: #FCFDFD;
  visibility: hidden;
  z-index: 100;
  webkit-border-radius: 5px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  -webkit-box-shadow: 0 0 5px #aaa;
  box-shadow: 0 0 5px #aaa;
  /*
   * DBC-toevoeging (niet in het legacy dbc.css): de popup mag zelf nooit
   * muisgebeurtenissen opvangen. `ddrivetip()`/`positiontip()` in
   * tooltip.js proberen de popup altijd een stukje (offsetxpoint/
   * offsetypoint) naast de cursor te plaatsen, maar wanneer daar simpelweg
   * geen ruimte voor is (venster te klein, popup te groot, of vlak bij een
   * rand waar zowel de "boven/onder"- als de "links/rechts"-uitwijking
   * krap zit) kan de uiteindelijke, teruggeklemde positie alsnog
   * (gedeeltelijk) onder de cursor uitkomen. Omdat #dhtmltooltip dan
   * bovenop de aanroepende link komt te liggen, telt de browser de cursor
   * niet langer als "over" die link, en vuurt er meteen een `mouseout` die
   * `hideddrivetip()` aanroept — de popup verscheen en verdween dan binnen
   * dezelfde muisbeweging, wat leek als "verschijnt helemaal niet".
   * Gevonden bij Pauls achtste test ("gebeurt als de popup net niet past
   * naast of boven/onder de muispointer"). `pointer-events:none` maakt de
   * popup voor de muis onzichtbaar (klikken/hoveren gaat er dwars
   * doorheen, naar wat eronder ligt), dus kan hij nooit meer zijn eigen
   * `mouseout` veroorzaken, ongeacht waar hij precies terechtkomt. Het
   * enige interactieve gebruik van de popup zelf (`drivetipclick()`) hangt
   * toch al aan een document-brede click-handler, niet aan de popup-div
   * zelf, dus dat blijft ongewijzigd werken.
   */
  pointer-events: none;
}

/*
 * DBC-toevoeging: visuele markering voor externe links in een weekspel-
 * artikel waarvan `content:markeer-dode-externe-links` (op basis van
 * `content:check-weekspel-externe-links`) heeft vastgesteld dat ze niet
 * meer werken. Klikken navigeert niet meer rechtstreeks naar de kapotte
 * pagina (zie dode-links.js, die de klik onderschept en in plaats daarvan
 * een Bootstrap-popover toont met de oorspronkelijke link en een "toch
 * proberen"-link erin) — de gestippelde onderstreping + cursor:help geven
 * hier al een hint van vooraf, zonder dat de bezoeker eerst hoeft te
 * klikken. Zie stappenplan-herbouw-bigbang.md.
 */
.dbc-dode-link {
  color: #6c757d;
  text-decoration: underline dotted;
  cursor: help;
}

.dbc-dode-link:hover,
.dbc-dode-link:focus {
  color: #495057;
}

/*# sourceMappingURL=uitslagen.css.map */