/* CheCasinos — общие токены и классы (страницы второй волны). Существующие 6 страниц держат стили инлайн. */
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{background:#E7EEF6;color:#0B2A47;font-family:system-ui,Roboto,"Segoe UI",Arial,sans-serif;-webkit-font-smoothing:antialiased;line-height:1.45}
a{color:inherit}
button{font-family:inherit}
h1,h2,h3{margin:0}
.app{max-width:680px;margin:0 auto;background:#E7EEF6;min-height:100vh;padding-bottom:78px}
.chip{background:#12395C;border:1px solid #1E4E77;border-radius:3px;padding:7px 11px;font-size:13px;font-weight:600;white-space:nowrap}
.h2{font-size:20px;font-weight:800}
.card{background:#fff;border:1px solid #CBD7E5;border-radius:6px;box-shadow:0 1px 2px rgba(11,42,71,.06)}
.cta{background:#F5B301;color:#0B2A47;font-weight:800;text-decoration:none;text-align:center;border:none;border-radius:4px;display:flex;align-items:center;justify-content:center;cursor:pointer}
.logo{background:#fff;border:1px solid #CBD7E5;border-radius:8px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.logo img{max-width:78%;max-height:78%;object-fit:contain;display:block}
/* Логотипы провайдеров очищены до прозрачного PNG, поэтому тёмная карточка просто
   просвечивает сквозь них — фон ставим только для светлых лого (белый/жёлтый текст). */
.logo.dark{background:#0B2A47;border-color:#0B2A47}
/* Лого провайдеров обрезаны по контенту и имеют очень разные пропорции (2:1 у Pragmatic
   против 3.7:1 у Push). Ограничиваем в первую очередь по ширине, высоту отпускаем —
   тогда широкие упираются в ширину, а квадратные не выглядят мелкими. Отдельный класс,
   чтобы не задеть .logo у карточек казино и платёжек. */
.logo.plogo img{max-width:74%;max-height:92%}
.mono{color:#fff;font-weight:800;display:flex;align-items:center;justify-content:center}
.glass{position:relative;background:radial-gradient(120% 140% at 12% 0%,rgba(74,163,219,.55),transparent 55%),radial-gradient(120% 140% at 100% 100%,rgba(245,179,1,.32),transparent 50%),linear-gradient(160deg,#12406B 0%,#0B2A47 55%,#081D33 100%);overflow:hidden}
.glass::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(255,255,255,.24) 0%,rgba(255,255,255,0) 42%);pointer-events:none}
.glass::after{content:'';position:absolute;inset:0;border:1px solid rgba(255,255,255,.16);border-radius:inherit;pointer-events:none}
.tapcard{transition:transform .12s ease}
.tapcard:active{transform:scale(.97)}
/* Артикль-текст для юридических/гайдовых страниц */
.article{padding:0 16px 20px}
.article .card{padding:16px;margin-bottom:12px}
.article h2{font-size:17px;font-weight:800;margin-bottom:10px}
.article h3{font-size:15px;font-weight:800;margin:14px 0 6px}
.article p{margin:0 0 10px;font-size:14px;color:#33475B;line-height:1.6}
.article ul,.article ol{margin:0 0 10px;padding-left:20px;font-size:14px;color:#33475B;line-height:1.6}
.article li{margin-bottom:5px}
/* таблица: скролл на узких экранах */
.article figure{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:0 0 12px}
.article .card,
.article .card > *{max-width:100%}
.article .table-wrap{
  width:100%;
  max-width:100%;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  margin:12px 0;
}
.article table{width:100%;border-collapse:collapse;font-size:13px;min-width:520px}
.article th{text-align:left;color:#6B7F94;font-weight:700;padding:8px;border-bottom:1px solid #E1E8F0;vertical-align:top}
.article td{padding:8px;border-bottom:1px solid #EEF2F7;color:#33475B;vertical-align:top;word-break:break-word}
/* платёжки: grid вместо одной колонки */
/* ---- Легаси-блоки родительской темы внутри the_content() ----
   Родительский CSS на новых шаблонах не подключается, поэтому эти блоки (bonos, guías)
   рендерились голым HTML. Классы у них общие (.item/.text/.title), поэтому строго скоупим
   под обёртку блока, чтобы не задеть остальную вёрстку. */
.article .multi-list .multi-groop{display:flex;flex-direction:column;gap:10px;margin:12px 0}
.article .multi-list .box{display:flex;gap:11px;align-items:flex-start}
.article .multi-list .num{flex:none;width:26px;height:26px;border-radius:50%;background:#EAF3FB;color:#1D6FA8;font-weight:800;font-size:13px;display:flex;align-items:center;justify-content:center}
.article .multi-list .item{display:flex;gap:11px;align-items:flex-start;background:#F5F8FC;border:1px solid #E1E8F0;border-radius:6px;padding:11px 13px}
.article .multi-list .item .text{font-size:14px;color:#33475B;line-height:1.55}
.article .multi-list .item.final{background:#FFF7E0;border-color:#F5DE9B}

.article .boxes{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:12px 0}
.article .boxes .item{background:#F5F8FC;border:1px solid #E1E8F0;border-radius:6px;padding:12px}
.article .boxes .image img{max-width:100%;height:auto;display:block;margin-bottom:8px}
.article .boxes .text{font-size:13.5px;color:#33475B;line-height:1.55}

.article .pros-cons{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:12px 0}
.article .pros-cons .block{background:#F5F8FC;border:1px solid #E1E8F0;border-radius:6px;padding:13px}
.article .pros-cons .block .title{font-weight:800;font-size:14px;margin-bottom:8px}
.article .pros-cons .item{display:flex;gap:7px;font-size:13px;color:#33475B;line-height:1.5;margin-bottom:6px}
.article .pros-cons .svg{flex:none;width:15px}
.article .pros-cons .svg svg{width:15px;height:15px;display:block}

.article .note,.article .example{display:flex;gap:12px;background:#EAF3FB;border:1px solid #CBD7E5;border-radius:6px;padding:13px;margin:12px 0}
.article .note .widget-title,.article .example .widget-title{font-weight:800;font-size:14px;margin-bottom:4px}
.article .note .svg,.article .example .svg{flex:none;width:22px}
.article .note .svg svg,.article .example .svg svg{width:22px;height:22px;display:block}
.article .note .widget-casino-img img,.article .example .widget-casino-img img{max-width:100%;height:auto}

/* FAQ-аккордеон блока родительской темы (класс обёртки questions) */
.article .questions .accordion{border:1px solid #E1E8F0;border-radius:6px;margin-bottom:8px;overflow:hidden;background:#fff}
.article .questions .accordion-title-box{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 14px;cursor:pointer;background:#F5F8FC}
.article .questions .accordion-title{font-size:14.5px;font-weight:700;color:#0B2A47;margin:0}
.article .questions .accordion-arrow{flex:none;width:0;height:0;border-left:5px solid transparent;border-right:5px solid transparent;border-top:6px solid #4AA3DB;transition:transform .15s ease}
.article .questions .accordion.open .accordion-arrow{transform:rotate(180deg)}
.article .questions .accordion-text{display:none;padding:12px 14px;font-size:14px;color:#33475B;line-height:1.6}
.article .questions .accordion.open .accordion-text{display:block}

@media(max-width:520px){
  .article .boxes,.article .pros-cons{grid-template-columns:1fr}
}

/* Единый бокс логотипа казино. Логотипы очищены до прозрачного PNG и обрезаны по контенту,
   поэтому здесь только подложка + отступ. Тёмная подложка ставится тем брендам, у которых
   светлая графика нечитаема на белом (флаг casino_dark_logo, посчитан по контрасту пикселей). */
.clogo{background:#F5F8FC;overflow:hidden;display:flex;align-items:center;justify-content:center;flex:none}
.clogo.dark{background:#0B2A47}
.clogo img{width:100%;height:100%;object-fit:contain;display:block}

/* Сетка карточек игр: /slots/{tipo}/, блок acf/grid-games, блок game-single.
   Классы приходят из родительской темы — в site.css их не было, из-за чего карточки
   рендерились нестилизованными. */
.game-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:0 16px 20px}
.game-item{display:block;background:#fff;border:1px solid #CBD7E5;border-radius:6px;overflow:hidden;text-decoration:none;color:inherit;box-shadow:0 1px 2px rgba(11,42,71,.06)}
.game-item__thumb{position:relative;display:block;aspect-ratio:1/1}
.game-item__thumb img{width:100%;height:100%;object-fit:cover;display:block}
.game-item__rtp{position:absolute;bottom:5px;left:5px;background:rgba(0,0,0,.55);color:#fff;font-size:9px;font-weight:700;padding:2px 5px;border-radius:3px}
.game-item__title{display:block;padding:7px 7px 0;font-weight:700;font-size:11.5px;line-height:1.15;color:#0B2A47}
.game-item__desc{display:block;padding:2px 7px 7px;font-size:10px;color:#8397AC}
@media(max-width:520px){.game-grid{grid-template-columns:repeat(2,1fr)}}

.payments-grid{display:flex;gap:10px;padding:0 16px 20px}
.payment-item{background:#fff;border:1px solid #CBD7E5;border-radius:8px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:12px 8px;text-decoration:none;color:#33475B;font-size:12px;font-weight:700;text-align:center;gap:6px}
/* Логотипы платёжек обрезаны по контенту, пропорции очень разные (5.4:1 у Neteller против
   1:1 у Tron). Бокс во всю ширину карточки + фиксированная высота: широкие упираются в ширину,
   квадратные — в высоту, и оптически все выглядят одинаково. */
.payment-item .image{width:100%;height:38px;display:flex;align-items:center;justify-content:center}
.payment-item .image img{max-width:100%;max-height:100%;object-fit:contain}
.article th{text-align:left;color:#6B7F94;font-weight:700;padding:8px 8px;border-bottom:1px solid #E1E8F0}
.article td{padding:8px 8px;border-bottom:1px solid #EEF2F7;color:#33475B}
.crumbs{padding:12px 16px 0;font-size:12.5px;color:#48627A;display:flex;gap:6px;flex-wrap:wrap}
.crumbs a{color:#1D6FA8;text-decoration:none;font-weight:600}
.badge-ok{display:inline-block;background:#E6F5EC;color:#1FA85A;font-size:11px;font-weight:700;padding:2px 7px;border-radius:3px}
.badge-warn{display:inline-block;background:#FDEBD2;color:#B3441E;font-size:11px;font-weight:700;padding:2px 7px;border-radius:3px}
.badge-info{display:inline-block;background:#EAF3FB;color:#1D6FA8;font-size:11px;font-weight:700;padding:2px 7px;border-radius:3px}

/* Пагинация архивов (WP) */
.cc-pagination{display:flex;gap:6px;flex-wrap:wrap;justify-content:center;padding:4px 16px 24px}
.cc-pagination .page-numbers{background:#fff;border:1px solid #CBD7E5;border-radius:4px;padding:9px 13px;font-size:13.5px;font-weight:700;color:#33475B;text-decoration:none;min-height:40px;display:inline-flex;align-items:center}
.cc-pagination .page-numbers.current{background:#0B2A47;border-color:#0B2A47;color:#fff}
.cc-pagination .page-numbers.dots{border:none;background:transparent}

/* ==========================================================================
   Адаптив медиа и таблиц в контенте (2026-10-05)
   Блок одинаковый в style.css и checasinos/site.css: страница может прийти
   через любой из двух каркасов, а поведение должно быть одним.
   ========================================================================== */

/* Картинки и видео не шире своего контейнера, пропорции сохраняются.
   Классы с явной высотой (логотипы, обложки игр) специфичнее и не затрагиваются,
   инлайн-стили шаблонов тоже имеют приоритет. */
img,
video {
    max-width: 100%;
    height: auto;
}
iframe,
embed,
object,
figure,
.wp-caption {
    max-width: 100%;
}

/* Таблицы в обёртке: .table-wrap ставит фильтр the_content (functions.php),
   .wp-block-table — блочный редактор, div с overflow — ручная вёрстка шаблонов.
   Скроллится обёртка, сама таблица остаётся таблицей на всю ширину.
   min-width: 0 снимает старые жёсткие 924px / 520px. */
.table-wrap,
.wp-block-table {
    display: block;
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}
.table-wrap {
    margin: 12px 0;
}
.table-wrap > table,
.wp-block-table > table,
[style*="overflow"] > table {
    display: table;
    width: 100%;
    min-width: 0;
    margin: 0;
    white-space: normal;
}

@media (max-width: 1024px) {
    /* Телефон и планшет: ячейки не сжимаются в столбик из букв.
       Пока колонки помещаются, таблица на всю ширину; когда нет, появляется скролл. */
    .table-wrap > table th,
    .table-wrap > table td,
    .wp-block-table > table th,
    .wp-block-table > table td {
        min-width: 7.5rem;
    }

    /* Таблицы без обёртки (описания разделов, поля ACF) скроллятся сами. */
    table:not(.table-wrap > table):not(.wp-block-table > table):not([style*="overflow"] > table) {
        display: block;
        max-width: 100%;
        min-width: 0;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        white-space: normal;
    }
    table:not(.table-wrap > table):not(.wp-block-table > table):not([style*="overflow"] > table) th,
    table:not(.table-wrap > table):not(.wp-block-table > table):not([style*="overflow"] > table) td {
        min-width: 7.5rem;
    }
}

@media (max-width: 600px) {
    /* На телефоне картинки с обтеканием встают во всю ширину: колонка 340px
       не вмещает и картинку, и текст рядом. */
    .alignleft,
    .alignright,
    img.alignleft,
    img.alignright,
    article figure.alignleft,
    article figure.alignright,
    article .wp-block-image.alignleft,
    article .wp-block-image.alignright {
        float: none;
        display: block;
        margin: 0 auto 1rem;
    }
}