/* je-casinos.css — UX/визуал раздела /casinos/
   Только подача. Палитра — токены темы (light+dark, teal-акцент, НЕ синий). */

/* ---------- HUB: поиск + карточная сетка ---------- */
.je-casinos-hub .je-hub-lead { color: var(--je-text-secondary); max-width: none; }
.je-casinos-hub .je-hub-search {
  position: sticky; top: 64px; z-index: 20;
  background: var(--je-bg);
  padding: 12px 0 14px; margin: 6px 0 18px;
  border-bottom: 1px solid var(--je-border);
}
.je-hub-search__input {
  width: 100%; box-sizing: border-box;
  padding: 14px 44px 14px 16px; font-size: 16px;
  border-radius: 12px; border: 1px solid var(--je-border);
  background: var(--je-input-bg); color: var(--je-text);
}
.je-hub-search__input:focus {
  outline: 2px solid var(--je-accent); border-color: var(--je-accent);
}
.je-hub-search__meta { margin: 8px 2px 0; font-size: 13px; color: var(--je-text-muted); }
.je-hub-filters { display:flex; flex-wrap:wrap; gap:8px; margin:12px 0 4px; }
.je-chip {
  cursor:pointer; user-select:none; font-size:13px; color: var(--je-text-secondary);
  padding:6px 14px; border-radius:999px;
  border:1px solid var(--je-border); background:var(--je-card-bg);
  transition:.12s ease;
}
.je-chip[aria-pressed="true"] {
  background:var(--je-accent); border-color:var(--je-accent); color:#fff;
}

.je-brand-grid__list {
  list-style:none; margin:18px 0 0; padding:0;
  display:grid; gap:14px;
  grid-template-columns:repeat(auto-fill,minmax(220px,1fr));
}
.je-brand-card {
  display:flex; flex-direction:column; gap:8px;
  padding:16px; border-radius:14px;
  background:var(--je-card-bg);
  border:1px solid var(--je-border);
  box-shadow:var(--je-shadow);
  transition:transform .12s ease, border-color .12s ease, box-shadow .12s ease;
}
.je-brand-card:hover {
  transform:translateY(-3px); border-color:var(--je-accent);
  box-shadow:var(--je-shadow-hover);
}
.je-brand-card a { text-decoration:none; color:inherit; }
.je-brand-card__name { font-weight:700; font-size:17px; line-height:1.25; color:var(--je-text); }
.je-brand-card__badges { display:flex; flex-wrap:wrap; gap:6px; margin-top:2px; }
.je-badge {
  font-size:11px; font-weight:600; letter-spacing:.02em;
  padding:3px 9px; border-radius:999px; text-transform:uppercase;
}
.je-badge--dgoj { background:var(--je-accent-glow); color:var(--je-accent); }
.je-badge--intl { background:rgba(180,140,0,.14); color:#b08a00; }
.je-badge--type { background:var(--je-input-bg); color:var(--je-text-secondary); }
/* CTA «Ver reseña» в сетке листинга = ПРОСТАЯ текст-ссылка.
   je-casinos-mega.css грузится позже и навязывает .je-brand-card__cta кнопочный вид
   (padding/radius/font-weight:700/color:#fff !important). Скоупим на грид листинга
   (.je-brand-grid__list) — выше специфичность mega → сбрасываем в чистый текст. */
.je-brand-grid__list .je-brand-card__cta {
  display:block; align-self:flex-start;
  margin:10px 0 0;                /* отступ сверху больше, снизу 0 */
  padding:0; border:0; border-radius:0; background:none;
  min-height:0; height:auto; line-height:1.3;   /* схлопнуть кнопочный 48px-бокс в текст */
  font-size:13px; font-weight:600;
  color:var(--je-accent) !important;
}
.je-brand-grid__list .je-brand-card__cta:hover {
  color:var(--je-accent) !important;
  filter:none; transform:none; box-shadow:none; text-decoration:underline;
}
.je-hub-empty { padding:30px; text-align:center; color:var(--je-text-muted); display:none; }

.je-hub-fullguide {
  margin:40px 0 0; border-top:1px solid var(--je-border); padding-top:26px;
}
.je-hub-fullguide__title { font-size:24px; margin:0 0 14px; color:var(--je-text); }
.je-hub-fullguide .je-article__body { color:var(--je-text-secondary); }

/* breadcrumbs (свои, не RankMath) */
.je-breadcrumbs { margin:4px 0 14px; }
.je-bc { display:flex; flex-wrap:wrap; gap:6px; list-style:none; margin:0; padding:0; font-size:13px; }
.je-bc__item { display:flex; align-items:center; color:var(--je-text-muted); }
.je-bc__item + .je-bc__item::before { content:"›"; margin:0 8px 0 2px; color:var(--je-text-muted); }
.je-bc__item a { color:var(--je-accent); text-decoration:none; }
.je-bc__item a:hover { text-decoration:underline; }
.je-bc__item [aria-current="page"] { color:var(--je-text-secondary); }

/* ---------- BRAND PAGE ---------- */
.je-subnav { display:flex; flex-wrap:wrap; gap:8px; margin:10px 0 22px; }
.je-casinos .je-subnav__pill,
.je-article__body .je-subnav__pill {
  display:inline-block; font-size:13px; font-weight:600;
  text-decoration:none !important;
  padding:7px 14px; border-radius:999px;
  background:var(--je-accent-glow); color:var(--je-accent) !important;
  border:1px solid var(--je-accent);
}
.je-casinos .je-subnav__pill:hover,
.je-casinos .je-subnav__pill:focus,
.je-article__body .je-subnav__pill:hover,
.je-article__body .je-subnav__pill:focus {
  background:var(--je-accent);
  color:#fff !important;
}

.je-fichabox {
  margin:0 0 26px; border-radius:14px; overflow:hidden;
  border:1px solid var(--je-border); background:var(--je-card-bg);
  box-shadow:var(--je-shadow);
}
.je-fichabox__head {
  padding:12px 18px; font-weight:700; font-size:15px; color:#fff;
  background:var(--je-accent);
}
.je-fichabox__grid {
  display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr));
  gap:1px; background:var(--je-border);
}
.je-fichabox__cell { background:var(--je-card-bg); padding:14px 18px; }
.je-fichabox__k { font-size:12px; text-transform:uppercase; color:var(--je-text-muted); letter-spacing:.03em; }
.je-fichabox__v { font-size:16px; font-weight:600; margin-top:4px; color:var(--je-text); }
.je-fichabox__hl { padding:14px 18px; border-top:1px solid var(--je-border); }
.je-fichabox__hl ul { margin:6px 0 0; padding-left:18px; }
.je-fichabox__hl li { margin:4px 0; }
.je-fichabox__hl li::marker { color:var(--je-accent); }

/* визуальный ритм длинного контента */
.je-brand .je-article__body > h2 {
  margin-top:2.2em; padding-bottom:.3em;
  border-bottom:2px solid var(--je-accent);
}
.je-brand .je-article__body > h3 { color:var(--je-accent); margin-top:1.6em; }
/* pros/cons — 2 колонки, чёткое разделение Ventajas / Desventajas */
.je-proscons {
  display:grid; grid-template-columns:1fr 1fr; gap:16px; margin:8px 0 26px;
}
@media (max-width:680px){ .je-proscons { grid-template-columns:1fr; } }
/* Igual que je-pros-cons__col de artículos: tarjeta GRIS única (no blanca con
   caja gris anidada), radio 8px, padding 20px. */
.je-proscons__col {
  border:1px solid var(--je-border); border-radius:var(--je-radius-sm,8px);
  background:var(--je-input-bg); padding:1.25rem;
}
/* El <ul class="je-pros"> heredaba la caja gris de .je-pros (je-content.css),
   creando una caja anidada dentro de la tarjeta. Anularla. */
.je-article__body .je-proscons ul {
  background:none; border:none; padding:0 0 0 20px; border-radius:0;
}
/* Alineado al estilo de pros/cons de los artículos (je-pros-cons, je-content.css):
   sin borde superior de color, título neutro sin icono, viñeta «−» en contras. */
.je-proscons__h {
  margin:2px 0 10px; font-size:16px; font-weight:700; color:var(--je-text);
  display:flex; align-items:center; gap:8px;
}
.je-proscons ul { margin:0; padding-left:20px; list-style:none; }
.je-proscons li { margin:7px 0; position:relative; }
/* .je-article__body prefix para ganar especificidad sobre la viñeta global
   .je-article__body ul>li::before (punto verde) y mostrar ✓ / − como en artículos. */
.je-article__body .je-proscons li::before {
  position:absolute; left:-20px; top:0; font-weight:800;
  width:auto; height:auto; background:none; border-radius:0;
}
.je-article__body .je-proscons__col--pros li::before { content:"✓"; color:var(--je-green); }
.je-article__body .je-proscons__col--cons li::before { content:"−"; color:#e0556b; }
/* TOC styling moved to je-content.css (global — loads on all pages). */

/* markdown-таблицы в контенте */
.je-table-wrap { overflow-x: auto; margin: 18px 0 24px; }
.je-table {
  width: 100%; border-collapse: collapse; font-size: 14px;
  background: var(--je-card-bg); border: 1px solid var(--je-border);
  border-radius: 10px; overflow: hidden;
}
.je-table th, .je-table td {
  padding: 10px 14px; text-align: left;
  border-bottom: 1px solid var(--je-border);
}
.je-table thead th {
  background: var(--je-accent); color: #fff; font-weight: 700;
  white-space: nowrap;
}
.je-table tbody tr:nth-child(even) { background: var(--je-input-bg); }
.je-table tbody tr:hover { background: var(--je-accent-glow); }
.je-table td:first-child { font-weight: 600; color: var(--je-text); }

/* CTA-обёртка (наполняется banner-системой) */
.je-cta-box {
  margin:24px 0; padding:20px 22px; border-radius:14px;
  background:linear-gradient(135deg,var(--je-accent),var(--je-accent-hover)); color:#fff;
  display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap;
}
.je-cta-box__txt { font-weight:700; font-size:18px; }
.je-cta-box__btn {
  background:#fff; color:var(--je-text); font-weight:800; text-decoration:none;
  padding:12px 22px; border-radius:10px; white-space:nowrap;
}
