/* games1win — тема по логотипу (2026-10-12).
   Палитра снята с файла template/1win-logo.jpg:
     фон логотипа   #181830 / #181848 (глубокий индиго)
     подсветка      #301860 (фиолетовый)
     акцент         #1890d8 (синий знак «1»)
     текст знака    #f0f0f0
   Подключается ПОСЛЕ purgecss/style.css и переопределяет светлую тему Bootstrap 5.
   Правки держать здесь, а не в style.css — тот собран purgecss и перезаписывается. */

:root {
  --g1-bg:        #121228;
  --g1-bg-soft:   #171734;
  --g1-surface:   #1b1b3c;
  --g1-surface-2: #232350;
  --g1-border:    #2d2d5c;
  --g1-accent:    #2b8ae0;
  --g1-accent-h:  #4ea3ec;
  --g1-violet:    #6d4bd6;
  --g1-text:      #e9eaf4;
  --g1-muted:     #9aa0c4;

  --bs-body-bg: var(--g1-bg);
  --bs-body-color: var(--g1-text);
  --bs-primary: var(--g1-accent);
  --bs-primary-rgb: 43, 138, 224;
  --bs-link-color: var(--g1-accent);
  --bs-link-hover-color: var(--g1-accent-h);
  --bs-border-color: var(--g1-border);
  --bs-emphasis-color: #ffffff;
  --bs-secondary-color: var(--g1-muted);
  --bs-heading-color: #ffffff;
}

body {
  background-color: var(--g1-bg) !important;
  color: var(--g1-text) !important;
  background-image:
    radial-gradient(1200px 520px at 12% -8%, rgba(109,75,214,.22), transparent 60%),
    radial-gradient(900px 420px at 92% 0%, rgba(43,138,224,.14), transparent 62%);
  background-repeat: no-repeat;
  background-attachment: fixed;
}

h1, h2, h3, h4, h5, h6, .card-title { color: #fff; }
p, li, span, td, th, dd, dt, label, figcaption { color: var(--g1-text); }
small, .text-muted, .text-body-secondary { color: var(--g1-muted) !important; }
a { color: var(--g1-accent); text-decoration: none; }
a:hover { color: var(--g1-accent-h); }

/* карточки и поверхности */
.card, .dropdown-menu, .accordion-item, .list-group-item, .modal-content, .offcanvas {
  background-color: var(--g1-surface) !important;
  border: 1px solid var(--g1-border) !important;
  color: var(--g1-text);
}
.card { border-radius: 14px; box-shadow: 0 1px 0 rgba(255,255,255,.03) inset, 0 8px 24px rgba(0,0,0,.28); }
.card-header, .card-footer { background-color: transparent !important; border-color: var(--g1-border) !important; }
.bg-light, .bg-white, .bg-body, .bg-body-tertiary { background-color: var(--g1-surface) !important; }
.bg-mode { background-color: var(--g1-bg-soft) !important; }
.border, .border-top, .border-bottom, .border-start, .border-end { border-color: var(--g1-border) !important; }
hr { border-color: var(--g1-border); opacity: 1; }

/* шапка и меню */
.navbar, header.navbar, .fixed-top { background-color: rgba(18,18,40,.92) !important; backdrop-filter: blur(10px); border-bottom: 1px solid var(--g1-border); }
.navbar .nav-link, .navbar .dropdown-item { color: var(--g1-text) !important; }
.navbar .nav-link:hover, .dropdown-item:hover, .dropdown-item:focus { color: #fff !important; background-color: var(--g1-surface-2) !important; }
.dropdown-menu { box-shadow: 0 16px 40px rgba(0,0,0,.45); }

/* кнопки */
.btn-primary { background-color: var(--g1-accent); border-color: var(--g1-accent); color: #fff; }
.btn-primary:hover, .btn-primary:focus { background-color: var(--g1-accent-h); border-color: var(--g1-accent-h); color: #fff; }
.btn-outline-primary { color: var(--g1-accent); border-color: var(--g1-accent); }
.btn-outline-primary:hover { background-color: var(--g1-accent); color: #fff; }
.btn-light, .btn-secondary { background-color: var(--g1-surface-2); border-color: var(--g1-border); color: var(--g1-text); }
.btn-light:hover, .btn-secondary:hover { background-color: var(--g1-border); color: #fff; }

/* формы */
.form-control, .form-select, input, textarea, select {
  background-color: var(--g1-bg-soft) !important;
  border-color: var(--g1-border) !important;
  color: var(--g1-text) !important;
}
.form-control::placeholder { color: var(--g1-muted) !important; }
.form-control:focus, .form-select:focus {
  border-color: var(--g1-accent) !important;
  box-shadow: 0 0 0 .2rem rgba(43,138,224,.25) !important;
}

/* таблицы, бейджи, подвал */
.table { --bs-table-bg: transparent; --bs-table-color: var(--g1-text); --bs-table-border-color: var(--g1-border); }
.badge.bg-primary { background-color: var(--g1-accent) !important; }
footer { background-color: var(--g1-bg-soft) !important; border-top: 1px solid var(--g1-border); color: var(--g1-muted); }
footer a { color: var(--g1-muted); }
footer a:hover { color: var(--g1-accent-h); }

/* картинки игр: мягкая подложка вместо «белого листа» */
.card img, .rounded-top { background-color: var(--g1-bg-soft); }


/* В style.css есть правила, красящие ссылки ВНУТРИ заголовков в почти чёрный
   (.card-title a давал rgb(20,25,30)) — на тёмном фоне текст пропадал.
   Перебиваем явно и с запасом по специфичности. */
.card-title a, .card-title, h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { color: #fff; }
.card-title a:hover, h1 a:hover, h2 a:hover, h3 a:hover,
.h4 a:hover, h4 a:hover, h5 a:hover, h6 a:hover { color: var(--g1-accent-h); }
.g1-crumb, .g1-crumb span, .breadcrumb, .breadcrumb a, .breadcrumb-item, .breadcrumb-item a { color: var(--g1-muted); }
.breadcrumb a:hover, .g1-crumb:hover, .g1-crumb:hover span { color: var(--g1-accent-h); }
.nav-tabs .nav-link, .nav-pills .nav-link { color: var(--g1-text); }
.nav-tabs .nav-link.active, .nav-pills .nav-link.active { color: #fff; background: var(--g1-surface-2); border-color: var(--g1-border); }
.text-dark, .text-black, .text-body { color: var(--g1-text) !important; }

/* ─── портал: главная ─────────────────────────────────────────────── */
.g1-hero {
  background: linear-gradient(135deg, #241a4f 0%, #181840 45%, #141430 100%);
  border: 1px solid var(--g1-border);
  border-radius: 18px;
  padding: 2.4rem 1.6rem;
}
.g1-hero h1 { font-size: clamp(1.5rem, 3.4vw, 2.3rem); margin-bottom: .6rem; }
.g1-hero p { color: var(--g1-muted); max-width: 62ch; }
.g1-stat {
  background: var(--g1-surface); border: 1px solid var(--g1-border);
  border-radius: 12px; padding: .9rem 1rem; text-align: center;
}
.g1-stat b { display: block; font-size: 1.45rem; color: #fff; line-height: 1.1; }
.g1-stat span { font-size: .82rem; color: var(--g1-muted); }
.g1-chip {
  display: inline-flex; align-items: center; gap: .4rem;
  background: var(--g1-surface-2); border: 1px solid var(--g1-border);
  color: var(--g1-text); border-radius: 999px; padding: .34rem .8rem;
  font-size: .88rem; margin: 0 .35rem .5rem 0;
}
.g1-chip:hover { background: var(--g1-accent); border-color: var(--g1-accent); color: #fff; }
.g1-chip i { color: var(--g1-muted); font-style: normal; font-size: .78rem; }
.g1-chip:hover i { color: rgba(255,255,255,.85); }
.g1-search { max-width: 560px; }
.g1-chip-on { background: var(--g1-accent); border-color: var(--g1-accent); color: #fff; }
.g1-chip-on i { color: rgba(255,255,255,.85); }
.g1-pager { display: flex; align-items: center; gap: .9rem; flex-wrap: wrap; }
.g1-pager-pos { color: var(--g1-muted); font-size: .9rem; }
.g1-sec-head { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; margin-bottom: .9rem; }
.g1-sec-head h2 { font-size: 1.22rem; margin: 0; }
.g1-sec-head a { font-size: .88rem; }
.g1-tile { position: relative; overflow: hidden; border-radius: 12px; display: block; }
.g1-tile { aspect-ratio: 16 / 10; background: var(--g1-bg-soft); }
.g1-tile img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .25s ease; }
.g1-tile:hover img { transform: scale(1.04); }
.g1-tile-name { display: block; margin-top: .5rem; color: var(--g1-text); font-size: .93rem; line-height: 1.3; }
.g1-tile-prov { color: var(--g1-muted); font-size: .78rem; }
/* FAQ на нативном <details>: purgecss вырезал классы .accordion-*, поэтому
   компонент Bootstrap тут отрисовывался как набор голых рамок и зависел бы от JS. */
.g1-qa { background: var(--g1-surface); border: 1px solid var(--g1-border); border-radius: 12px; margin-bottom: .6rem; }
.g1-qa > summary {
  cursor: pointer; list-style: none; padding: .95rem 2.6rem .95rem 1.1rem;
  font-weight: 600; color: #fff; position: relative;
}
.g1-qa > summary::-webkit-details-marker { display: none; }
.g1-qa > summary::after {
  content: ''; position: absolute; right: 1.1rem; top: 50%;
  width: .55rem; height: .55rem; margin-top: -.35rem;
  border-right: 2px solid var(--g1-muted); border-bottom: 2px solid var(--g1-muted);
  transform: rotate(45deg); transition: transform .2s ease;
}
.g1-qa[open] > summary::after { transform: rotate(-135deg); margin-top: -.1rem; }
.g1-qa > summary:hover { color: var(--g1-accent-h); }
.g1-qa > div { padding: 0 1.1rem 1.05rem; }
.g1-qa p { margin: 0; color: var(--g1-text); }

@media (max-width: 575.98px) {
  .g1-hero { padding: 1.6rem 1.1rem; border-radius: 14px; }
  .g1-stat b { font-size: 1.2rem; }
}