/* ============================================================
   OLIMP CASINO — GOLD ACCENT THEME
   Распределение цветов в духе Olimp Official:
   - Глубокий синий — фон и второстепенные элементы (уже есть)
   - Королевское золото — главные CTA, заголовки, акценты
   - Светлый синий — линки и hover
   ============================================================ */

/* ----- Цветовые переменные ----- */
:root {
  --olimp-gold: #f5c518;
  --olimp-gold-dark: #d49d0a;
  --olimp-gold-light: #ffe27a;
  --olimp-blue-deep: #0a1421;
  --olimp-blue: #0d1b2a;
  --olimp-blue-light: #1e90ff;
  --olimp-blue-glow: #5cb8ff;
}

/* ----- Главные CTA-кнопки в золоте (red-button-* был синим — становится золотым) ----- */
.red-button-bg-color {
  background: linear-gradient(135deg, var(--olimp-gold-light) 0%, var(--olimp-gold) 50%, var(--olimp-gold-dark) 100%) !important;
  color: #0a1421 !important;
  font-weight: 700 !important;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
  transition: all 0.25s ease;
  box-shadow:
    0 4px 14px rgba(245, 197, 24, 0.35),
    inset 0 1px 0 rgba(255, 255, 255, 0.4) !important;
}

.red-button-bg-color:hover {
  background: linear-gradient(135deg, #ffd84d 0%, #ffc01f 50%, #e6ad0b 100%) !important;
  transform: translateY(-1px);
  box-shadow:
    0 6px 20px rgba(245, 197, 24, 0.5),
    inset 0 1px 0 rgba(255, 255, 255, 0.5) !important;
}

.red-button-border {
  border: 1px solid var(--olimp-gold) !important;
}

/* ----- H1 — золотой градиентный текст с тонким подчёркиванием ----- */
h1 {
  background: linear-gradient(135deg, #ffe27a 0%, #f5c518 50%, #d49d0a 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
  font-weight: 800;
  letter-spacing: -0.01em;
  position: relative;
  padding-bottom: 16px;
  margin-bottom: 18px;
}

h1::after {
  content: '';
  position: absolute;
  left: 0;
  bottom: 0;
  width: 80px;
  height: 3px;
  background: linear-gradient(90deg, var(--olimp-gold) 0%, transparent 100%);
  border-radius: 2px;
}

/* ----- H2 — золотая иконка-маркер слева ----- */
h2 {
  position: relative;
  padding-left: 18px;
  color: #ffffff;
  font-weight: 700;
  margin-top: 32px;
}

h2::before {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 4px;
  height: 70%;
  background: linear-gradient(180deg, var(--olimp-gold-light) 0%, var(--olimp-gold) 50%, var(--olimp-gold-dark) 100%);
  border-radius: 2px;
  box-shadow: 0 0 8px rgba(245, 197, 24, 0.4);
}

/* ----- H3 — золотой подчёркивающий штрих ----- */
h3 {
  color: var(--olimp-gold-light);
  font-weight: 600;
  margin-top: 24px;
}

/* ----- Strong внутри параграфов — мягкий золотой ----- */
.olimp-mirror-info p strong,
.olimp-mirror-info ul strong,
.olimp-mirror-info ol strong,
.olimp-mirror-info td strong {
  color: var(--olimp-gold-light);
  font-weight: 600;
}

/* ----- Таблицы — золотая рамка заголовка ----- */
.olimp-mirror-info table {
  border-collapse: collapse;
  width: 100%;
  margin: 18px 0;
  background: rgba(13, 27, 42, 0.4);
  border-radius: 8px;
  overflow: hidden;
}

.olimp-mirror-info table th {
  background: linear-gradient(180deg, rgba(245, 197, 24, 0.18) 0%, rgba(245, 197, 24, 0.08) 100%);
  color: var(--olimp-gold-light);
  font-weight: 700;
  text-transform: uppercase;
  font-size: 12px;
  letter-spacing: 0.06em;
  padding: 12px 14px;
  border-bottom: 1px solid rgba(245, 197, 24, 0.3);
}

.olimp-mirror-info table td {
  padding: 10px 14px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
  color: #d6e4f5;
}

.olimp-mirror-info table tr:last-child td {
  border-bottom: none;
}

.olimp-mirror-info table tr:hover td {
  background: rgba(245, 197, 24, 0.04);
}

/* ----- TOC items — золотой hover ----- */
.articles-item:hover {
  background: linear-gradient(135deg, rgba(245, 197, 24, 0.08) 0%, rgba(245, 197, 24, 0.02) 100%);
  border-color: rgba(245, 197, 24, 0.3) !important;
}

.articles-item:hover .articles-item-title {
  color: var(--olimp-gold-light);
}

.articles-item-title {
  transition: color 0.2s ease;
}

/* ----- FAQ accordion — золотая граница при hover ----- */
.olimp-acc summary:hover h3 {
  color: var(--olimp-gold);
}

.olimp-acc[open] summary h3 {
  color: var(--olimp-gold-light);
}

/* ----- Reviews stars — золотой блеск ----- */
.olimp-reviews__item-stars img {
  filter: drop-shadow(0 0 3px rgba(245, 197, 24, 0.6));
}

/* ----- Декоративный значок «лавровый венок» возле H1 ----- */
.olimp-mirror-info-container > h1 {
  display: inline-block;
  position: relative;
}

/* ----- Контейнеры — добавим тонкий золотой акцент сверху ----- */
.olimp-mirror-info .container.grey-border {
  position: relative;
  border-top: 1px solid rgba(245, 197, 24, 0.25) !important;
}

.olimp-mirror-info .container.grey-border::before {
  content: '';
  position: absolute;
  top: -1px;
  left: 50%;
  transform: translateX(-50%);
  width: 120px;
  height: 1px;
  background: linear-gradient(90deg, transparent 0%, var(--olimp-gold) 50%, transparent 100%);
}

/* ----- Список UL — золотые маркеры ----- */
.olimp-mirror-info ul {
  list-style: none;
  padding-left: 0;
}

.olimp-mirror-info ul li {
  position: relative;
  padding-left: 24px;
  margin-bottom: 6px;
}

.olimp-mirror-info ul li::before {
  content: '◆';
  position: absolute;
  left: 0;
  top: 2px;
  color: var(--olimp-gold);
  font-size: 10px;
  text-shadow: 0 0 6px rgba(245, 197, 24, 0.5);
}

/* ----- Numbered list — золотые цифры ----- */
.olimp-mirror-info ol {
  list-style: none;
  counter-reset: olimp-counter;
  padding-left: 0;
}

.olimp-mirror-info ol li {
  position: relative;
  padding-left: 36px;
  margin-bottom: 8px;
  counter-increment: olimp-counter;
}

.olimp-mirror-info ol li::before {
  content: counter(olimp-counter);
  position: absolute;
  left: 0;
  top: 2px;
  width: 24px;
  height: 24px;
  line-height: 24px;
  text-align: center;
  background: linear-gradient(135deg, var(--olimp-gold-light) 0%, var(--olimp-gold-dark) 100%);
  color: var(--olimp-blue-deep);
  font-weight: 800;
  font-size: 12px;
  border-radius: 50%;
  box-shadow: 0 2px 6px rgba(245, 197, 24, 0.4);
}

/* ----- CTA-link block (внутри статьи) — premium стиль ----- */
.olimp-mirror-info__link {
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-size: 13px;
}

/* ----- Mobile — подгонка по размерам ----- */
@media (max-width: 768px) {
  h1 { font-size: 26px; }
  h2 { font-size: 20px; padding-left: 14px; }
  h3 { font-size: 16px; }
  .olimp-mirror-info ol li { padding-left: 32px; }
  .olimp-mirror-info ol li::before { width: 22px; height: 22px; line-height: 22px; }
}
