/* ==== oekv · Vergleichsliste · austriancasinos.org ==== */

/* ---- oekv:wrap ---- */
.oek .oekv-wrap{grid-column:1/-1;flex:1 1 100%;margin:22px 0 26px;padding:20px 20px 14px;background:var(--sec-tint);border-top:4px solid var(--sec-ink)}
.oek .oekv-h{font:700 26px/1.2 var(--sec-cond);margin:0 0 4px;color:var(--sec-ink);border:0;padding:0}
.oek .oekv-sub{margin:0 0 14px;font-size:14px;line-height:1.45;color:var(--sec-mute)}
.oekv-cb{position:absolute;opacity:0;width:1px;height:1px;clip-path:inset(50%);pointer-events:none}

/* ---- oekv:filter ---- */
.oek .oekv-filter{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;margin:0 0 12px;font-size:14px}
.oek .oekv-filter>span{display:inline-flex;gap:6px;align-items:center;font:700 13px/1 var(--sec-cond);text-transform:uppercase;letter-spacing:.08em;color:var(--sec-mute)}
.oek .oekv-filter label{position:relative;display:inline-flex;align-items:center;min-height:44px;padding:0 0 0 30px;cursor:pointer;color:var(--sec-ink);font-size:15px}
.oek .oekv-filter label::before{content:"";position:absolute;left:0;top:50%;width:20px;height:20px;margin-top:-10px;background:#fff;border:2px solid var(--sec-ink2);border-radius:3px}
.oek .oekv-filter label::after{content:"";position:absolute;left:6px;top:50%;width:8px;height:4px;margin-top:-4px;border:solid #fff;border-width:0 0 2px 2px;transform:rotate(-45deg);opacity:0}

/* ---- oekv:list ---- */
.oek .oekv-list{list-style:none;margin:0;padding:0;counter-reset:none}
.oek .oekv-list>li.oekv-row{position:relative;display:grid;grid-template-columns:132px minmax(0,1fr) 220px 176px;grid-template-areas:"logo main offer act" "terms terms terms terms";
  gap:10px 20px;align-items:center;margin:0 0 10px;padding:22px 18px 10px 26px;background:var(--sec-paper);border:1px solid var(--sec-line);box-shadow:0 1px 2px rgba(22,24,29,.05)}
.oek .oekv-list>li.oekv-row.oekv-hid{display:none}
.oek .oekv-list>li.oekv-row:first-child{border-color:var(--sec-gold);box-shadow:inset 4px 0 0 var(--sec-gold)}
.oek .oekv-rank{position:absolute;left:-1px;top:-1px;min-width:30px;height:28px;padding:0 8px;display:flex;align-items:center;justify-content:center;
  background:var(--sec-ink);color:#fff;font:700 16px/1 var(--sec-cond)}
.oek .oekv-list>li:first-child .oekv-rank{background:var(--sec-gold)}
.oek .oekv-logo{grid-area:logo;display:flex;align-items:center;justify-content:center;width:132px;height:76px;padding:8px;background:#fff;border:1px solid var(--sec-line)}
.oek .oekv-logo.oekv-logo-dark{background:var(--sec-ink);border-color:var(--sec-ink)}
.oek .oekv-logo.oekv-logo-mid{background:#7A828C;border-color:#7A828C}
.oek .oekv-logo img{display:block;max-width:116px;max-height:60px;width:auto;height:auto}
.oek .oekv-logo span{font:700 16px/1.1 var(--sec-cond);text-align:center}
.oek .oekv-main{grid-area:main;min-width:0}
.oek .oekv-name{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;font:700 20px/1.2 var(--sec-cond);color:var(--sec-ink);margin:0 0 6px}
.oek .oekv-tip{display:inline-flex;align-items:center;gap:4px;font:700 12px/1 var(--sec-cond);letter-spacing:.08em;text-transform:uppercase;color:#5E4710;background:var(--sec-gold-l);padding:4px 7px}
.oek .oekv-facts{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:3px}
.oek .oekv-facts li{display:flex;align-items:center;gap:7px;font-size:14px;line-height:1.35;color:var(--sec-ink2);margin:0}
.oek .oekv-facts .oek-i{color:var(--sec-green)}
.oek .oekv-offer{grid-area:offer;border-left:3px solid var(--sec-red);padding:2px 0 2px 12px}
.oek .oekv-offer-k{display:block;font:700 12px/1 var(--sec-cond);letter-spacing:.1em;text-transform:uppercase;color:var(--sec-mute);margin-bottom:5px}
.oek .oekv-offer b{display:block;font:700 19px/1.22 var(--sec-cond);color:var(--sec-ink)}
.oek .oekv-act{grid-area:act;display:flex;flex-direction:column;align-items:stretch;gap:8px;text-align:center}
.oek .oekv-cta{display:flex;align-items:center;justify-content:center;gap:6px;min-height:46px;padding:0 14px;background:var(--sec-red);color:#fff;
  font:700 16px/1 var(--sec-cond);text-transform:uppercase;letter-spacing:.04em;text-decoration:none;border-radius:4px}
.oek .oekv-cta:hover{background:var(--sec-red-d);color:#fff}
.oek .oekv-rev{font-size:14px;line-height:1.3;color:var(--sec-link)}
.oek .oekv-terms{grid-area:terms;margin:4px 0 0;padding-top:7px;border-top:1px dotted var(--sec-line);font-size:12px;line-height:1.4;color:var(--sec-mute)}
.oek .oekv-more{display:flex;align-items:center;justify-content:center;min-height:46px;margin:4px 0 8px;background:var(--sec-paper);border:1px solid var(--sec-ink);
  font:700 15px/1 var(--sec-cond);text-transform:uppercase;letter-spacing:.05em;color:var(--sec-ink);cursor:pointer}
.oek .oekv-disc{display:flex;gap:8px;align-items:flex-start;margin:8px 0 0;font-size:13px;line-height:1.45;color:var(--sec-mute)}

/* ---- oekv:states ---- */
.oek .oekv-wrap:has(.oekv-more-cb:checked) .oekv-list>li.oekv-row.oekv-hid{display:grid}
.oek .oekv-wrap:has(.oekv-more-cb:checked) .oekv-more{display:none}
.oek .oekv-wrap:has([id$="-f-fs"]:checked) .oekv-list>li.oekv-row:not(.oekv-x-fs),
.oek .oekv-wrap:has([id$="-f-big"]:checked) .oekv-list>li.oekv-row:not(.oekv-x-big),
.oek .oekv-wrap:has([id$="-f-sport"]:checked) .oekv-list>li.oekv-row:not(.oekv-x-sport),
.oek .oekv-wrap:has([id$="-f-psc"]:checked) .oekv-list>li.oekv-row:not(.oekv-x-psc){display:none}
.oek .oekv-wrap:has([id$="-f-fs"]:checked) label[for$="-f-fs"]::before,
.oek .oekv-wrap:has([id$="-f-big"]:checked) label[for$="-f-big"]::before,
.oek .oekv-wrap:has([id$="-f-sport"]:checked) label[for$="-f-sport"]::before,
.oek .oekv-wrap:has([id$="-f-psc"]:checked) label[for$="-f-psc"]::before{background:var(--sec-red);border-color:var(--sec-red)}
.oek .oekv-wrap:has([id$="-f-fs"]:checked) label[for$="-f-fs"]::after,
.oek .oekv-wrap:has([id$="-f-big"]:checked) label[for$="-f-big"]::after,
.oek .oekv-wrap:has([id$="-f-sport"]:checked) label[for$="-f-sport"]::after,
.oek .oekv-wrap:has([id$="-f-psc"]:checked) label[for$="-f-psc"]::after{opacity:1}
.oek .oekv-cb:focus-visible+*{outline:2px solid var(--sec-link)}

/* ---- oekv:container ---- */
.oek .oekv-wrap{container-type:inline-size;container-name:oekv}
@container oekv (max-width:880px){
  .oek .oekv-list>li.oekv-row{grid-template-columns:118px minmax(0,1fr) 168px;grid-template-areas:"logo main act" "logo offer act" "terms terms terms";gap:8px 18px}
  .oek .oekv-logo{width:118px;height:72px}
  .oek .oekv-logo img{max-width:102px;max-height:56px}
  .oek .oekv-facts{flex-direction:row;flex-wrap:wrap;gap:3px 14px}
}
@container oekv (max-width:600px){
  .oek .oekv-list>li.oekv-row{grid-template-columns:96px minmax(0,1fr);grid-template-areas:"logo main" "offer offer" "act act" "terms terms";gap:6px 12px;padding:22px 12px 8px 14px}
  .oek .oekv-logo{width:96px;height:58px;padding:6px}
  .oek .oekv-logo img{max-width:84px;max-height:44px}
  .oek .oekv-name{font-size:17px;margin-bottom:3px}
  .oek .oekv-facts{flex-direction:column;gap:1px}
  .oek .oekv-facts li{font-size:13px}
  .oek .oekv-facts li:nth-child(3){display:none}
  .oek .oekv-offer{padding:0 0 0 10px}
  .oek .oekv-offer-k{display:none}
  .oek .oekv-offer b{font-size:16px;line-height:1.2}
  .oek .oekv-act{flex-direction:row;align-items:center;gap:10px}
  .oek .oekv-cta{flex:1 1 auto;min-height:44px;font-size:15px}
  .oek .oekv-rev{flex:0 0 auto;max-width:42%;font-size:13px;text-align:right;padding:0}
  .oek .oekv-terms{margin-top:2px;padding-top:5px;font-size:11px}
}

/* ---- oekv:mobile ---- */
@media (max-width:900px){
  .oek .oekv-list>li.oekv-row{grid-template-columns:104px minmax(0,1fr);grid-template-areas:"logo main" "offer offer" "act act" "terms terms";padding:24px 14px 10px 16px}
  .oek .oekv-logo{width:104px;height:64px}
  .oek .oekv-logo img{max-width:90px;max-height:48px}
  .oek .oekv-act{flex-direction:row;align-items:center;justify-content:space-between}
  .oek .oekv-cta{flex:1 1 auto}
  .oek .oekv-rev{flex:0 1 auto;text-align:right}
}
@media (max-width:760px){
  .oek .oekv-wrap{padding:16px 12px 10px;margin-left:calc(-1*var(--sec-sheet) + 6px);margin-right:calc(-1*var(--sec-sheet) + 6px)}
  .oek .oekv-h{font-size:22px}
}