/* Витрина `oacv` «Harbour Board» — onlineaucasino.com.
   ⛔ Дизайн сайта не трогаем: правила только внутри .oacv-wrap, палитра снята С САЙТА
   (тёмная синь #0e2148/#16305e, золото #f2c14e, зелёная кнопка #6fb515, красный акцент #ef0000).
   Раскладка — СТРОКИ с золотым рельсом (у соседей по AU: строки-таблицы grd/cst и плитки atc). */

.oacv-wrap{--oacv-ink:#eaf3ff;--oacv-dim:#b9c9e4;--oacv-panel:#132c56;--oacv-panel2:#0f2447;
  --oacv-line:#28477c;--oacv-gold:#f2c14e;--oacv-cta:#6fb515;--oacv-cta2:#5da00f;
  display:block;margin:26px 0 34px;max-width:100%;box-sizing:border-box;color:var(--oacv-ink);
  font:15px/1.5 Helvetica,Arial,sans-serif;text-align:left}
.oacv-wrap *{box-sizing:border-box}
.oacv-h2{margin:0 0 8px;font-size:26px;line-height:1.2;color:#fff;font-weight:700}
.oacv-lead{margin:0 0 16px;color:var(--oacv-dim);font-size:14px;max-width:70ch}

/* фильтры на чистом CSS */
.oacv-fi,.oacv-all{position:absolute;opacity:0;pointer-events:none}
.oacv-filters{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px}
.oacv-filters label{display:inline-block;padding:7px 13px;border:1px solid var(--oacv-line);
  border-radius:999px;background:var(--oacv-panel2);color:var(--oacv-ink);font-size:13px;cursor:pointer;
  user-select:none}
.oacv-filters label:hover{border-color:var(--oacv-gold);color:#fff}
.oacv-filters label b{color:var(--oacv-gold);font-weight:700}

.oacv-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}
.oacv-list>li{position:relative;display:grid;grid-template-columns:52px 200px 1fr 210px;
  grid-template-areas:"rank plate name act" "rank plate offer act" "rank chips chips act"
                      "more more more more";
  align-items:center;gap:8px 16px;padding:14px 16px 14px 8px;
  background:linear-gradient(180deg,var(--oacv-panel) 0%,var(--oacv-panel2) 100%);
  border:1px solid var(--oacv-line);border-radius:10px;overflow:hidden}
.oacv-list>li:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--oacv-line)}
.oacv-list>li.oacv-top:before{background:var(--oacv-gold)}
.oacv-list>li.oacv-top{border-color:#3c5f9d}

.oacv-rank{grid-area:rank;justify-self:center;display:inline-flex;align-items:center;justify-content:center;
  width:36px;height:36px;border-radius:50%;background:#0b1c39;border:2px solid var(--oacv-line);
  color:var(--oacv-ink);font-weight:700;font-size:16px}
.oacv-list>li.oacv-top .oacv-rank{border-color:var(--oacv-gold);color:#0b1c39;background:var(--oacv-gold)}

.oacv-plate{grid-area:plate;display:flex;align-items:center;justify-content:center;
  width:192px;height:68px;background:#fff;border-radius:8px;padding:6px}
/* полярность: светлый вордмарк читается только на тёмной плашке (Casinoly, Spinsy, Cashed) */
.oacv-plate--dark{background:#0b1c39;border:1px solid var(--oacv-line)}
.oacv-plate img{max-width:100%;max-height:100%;width:auto;height:auto;display:block}
.oacv-noplate{color:#0f2447;font-weight:700;font-size:15px;text-align:center}

.oacv-top-row{display:contents}
.oacv-name{grid-area:name;align-self:end;color:#fff;font-size:18px;font-weight:700;line-height:1.25}
.oacv-name a{color:#fff;text-decoration:none;border-bottom:1px solid rgba(242,193,78,.55)}
.oacv-name a:hover{color:var(--oacv-gold)}
.oacv-score{display:inline-block;margin-left:8px;color:var(--oacv-gold);font-size:13px;font-weight:700;
  vertical-align:middle}

.oacv-offer{grid-area:offer;align-self:start;padding:7px 12px;border-left:3px solid var(--oacv-gold);
  background:rgba(242,193,78,.08);border-radius:0 6px 6px 0}
.oacv-offer b{display:block;color:#fff;font-size:15px;font-weight:700}
.oacv-offer i{display:block;color:var(--oacv-dim);font-size:12px;font-style:normal;margin-top:2px}

.oacv-chips{grid-area:chips;display:flex;flex-wrap:wrap;gap:6px}
.oacv-chip,.oacv-chips span{display:inline-block;padding:3px 9px;border:1px solid var(--oacv-line);
  border-radius:999px;background:rgba(255,255,255,.04);color:var(--oacv-ink);font-size:12px;line-height:1.5}
.oacv-chip--aud{border-color:var(--oacv-gold);color:var(--oacv-gold)}

.oacv-act{grid-area:act;display:flex;flex-direction:column;align-items:stretch;gap:6px}
/* ⚠️ контраст: белый по зелёному сайта даёт 2.6 — текст кнопки ТЁМНЫЙ (6.4) */
.oacv-cta{display:block;padding:12px 14px;border-radius:8px;background:var(--oacv-cta);color:#0b1c39;
  font-weight:700;font-size:15px;text-align:center;text-decoration:none}
.oacv-cta:hover{background:var(--oacv-cta2);color:#0b1c39}
.oacv-rev{display:block;text-align:center;color:var(--oacv-ink);font-size:13px;text-decoration:none;
  border-bottom:1px dotted rgba(234,243,255,.5);align-self:center}
.oacv-rev:hover{color:var(--oacv-gold)}
.oacv-norev{display:block;text-align:center;color:var(--oacv-dim);font-size:12px}

.oacv-more{grid-area:more;margin-top:6px;border-top:1px solid var(--oacv-line);padding-top:8px}
.oacv-more summary{cursor:pointer;color:var(--oacv-dim);font-size:13px;list-style:none}
.oacv-more summary::-webkit-details-marker{display:none}
.oacv-more summary:before{content:"▸ ";color:var(--oacv-gold)}
.oacv-more[open] summary:before{content:"▾ "}
.oacv-dl{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:8px 18px;margin:10px 0}
.oacv-dl div{min-width:0}
.oacv-dl dt{color:var(--oacv-gold);font-size:12px;text-transform:uppercase;letter-spacing:.03em}
.oacv-dl dd{margin:2px 0 0;color:var(--oacv-ink);font-size:13px;word-break:break-word}

.oacv-morebtn{display:inline-block;margin:14px 0 0;padding:11px 20px;border:1px solid var(--oacv-gold);
  border-radius:8px;background:transparent;color:var(--oacv-gold);font-size:14px;font-weight:700;
  cursor:pointer;user-select:none}
.oacv-morebtn:hover{background:var(--oacv-gold);color:#0b1c39}

/* перенесённые ссылки из вырезанного нативного списка (правило 08.9) */
.oacv-arch{margin:10px 0 0;color:var(--oacv-dim);font-size:12px;line-height:1.7}
.oacv-arch b{color:var(--oacv-ink)}
.oacv-arch a{color:var(--oacv-ink);text-decoration:none;border-bottom:1px dotted rgba(234,243,255,.35)}
.oacv-arch a:hover{color:var(--oacv-gold);border-bottom-color:var(--oacv-gold)}

.oacv-note{margin:14px 0 0;color:var(--oacv-dim);font-size:12px;line-height:1.6;max-width:90ch}
.oacv-note a{color:var(--oacv-gold)}
.oacv-note b{color:var(--oacv-ink)}

/* скрытая часть списка и «показать все» */
.oacv-list>li.oacv-hid{display:none}
.oacv-wrap input[id^="oacall"]:checked~.oacv-list>li.oacv-hid{display:grid}
.oacv-wrap input[id^="oacall"]:checked~.oacv-morebtn{display:none}

/* фильтры режут строки: отмеченный признак прячет тех, у кого его нет.
   ⚠️ id витрины содержит номер блока (oacv-aud-7), поэтому селектор по ПРЕФИКСУ id,
   иначе правило не находит чекбокс и «фильтры не режут». */
.oacv-wrap input[id^="oacv-aud"]:checked~.oacv-list>li:not(.oacv-f-aud),
.oacv-wrap input[id^="oacv-loc"]:checked~.oacv-list>li:not(.oacv-f-loc),
.oacv-wrap input[id^="oacv-cry"]:checked~.oacv-list>li:not(.oacv-f-cry),
.oacv-wrap input[id^="oacv-big"]:checked~.oacv-list>li:not(.oacv-f-big),
.oacv-wrap input[id^="oacv-wag"]:checked~.oacv-list>li:not(.oacv-f-wag){display:none}
.oacv-wrap input[id^="oacv-aud"]:checked~.oacv-filters label[for^="oacv-aud"],
.oacv-wrap input[id^="oacv-loc"]:checked~.oacv-filters label[for^="oacv-loc"],
.oacv-wrap input[id^="oacv-cry"]:checked~.oacv-filters label[for^="oacv-cry"],
.oacv-wrap input[id^="oacv-big"]:checked~.oacv-filters label[for^="oacv-big"],
.oacv-wrap input[id^="oacv-wag"]:checked~.oacv-filters label[for^="oacv-wag"]{
  background:var(--oacv-gold);border-color:var(--oacv-gold);color:#0b1c39}
.oacv-wrap input[id^="oacv-aud"]:checked~.oacv-filters label[for^="oacv-aud"] b,
.oacv-wrap input[id^="oacv-loc"]:checked~.oacv-filters label[for^="oacv-loc"] b,
.oacv-wrap input[id^="oacv-cry"]:checked~.oacv-filters label[for^="oacv-cry"] b,
.oacv-wrap input[id^="oacv-big"]:checked~.oacv-filters label[for^="oacv-big"] b,
.oacv-wrap input[id^="oacv-wag"]:checked~.oacv-filters label[for^="oacv-wag"] b{color:#0b1c39}

@media (max-width:900px){
  /* строка на мобиле должна укладываться в 290px (R9) — режем отступы и размеры */
  .oacv-list>li{grid-template-columns:40px 1fr;
    grid-template-areas:"rank plate" "name name" "offer offer" "chips chips" "act act" "more more";
    gap:4px 10px;padding:8px 10px 8px 8px}
  .oacv-rank{width:30px;height:30px;font-size:14px;border-width:1px}
  .oacv-plate{width:100%;max-width:160px;height:40px;padding:3px}
  .oacv-name{align-self:center;font-size:16px}
  .oacv-score{font-size:12px}
  .oacv-offer{padding:4px 9px}
  .oacv-offer b{font-size:14px}
  .oacv-offer i{font-size:11px}
  .oacv-chips{gap:4px}
  .oacv-chip,.oacv-chips span{font-size:11px;padding:2px 7px}
  .oacv-act{flex-direction:row;align-items:center;gap:8px}
  .oacv-cta{flex:1 1 auto;padding:8px 12px;font-size:14px}
  .oacv-rev,.oacv-norev{font-size:12px;flex:0 0 auto}
  .oacv-more{margin-top:2px;padding-top:6px}
  .oacv-more summary{font-size:12px}
  .oacv-dl{grid-template-columns:1fr 1fr;gap:6px 12px;margin:8px 0}
  .oacv-h2{font-size:21px}
}