/* ============================================================
   Olymp Deep Blue & Gold restyle — v2
   Финальный слой поверх базовой сборки
   ============================================================ */

:root,
[data-theme="blue"] {
  --cas-primary: #e1b84c;
  --cas-secondary: #f4d77a;
  --cas-button: #d7aa37;
  --cas-event-slider: #071934;
  --platform-text-1: #f8fbff;
  --platform-text-2: #d8e4f3;
  --color-border-accent: #d7aa37;
  --color-text-accent: #f4d77a;
  --focus-shadow: 0 0 0 4px rgba(225, 184, 76, .22);
  --olymp-navy-950: #020a17;
  --olymp-navy-900: #06142c;
  --olymp-navy-850: #081b39;
  --olymp-navy-800: #0c2448;
  --olymp-blue-700: #12376a;
  --olymp-gold-500: #d7aa37;
  --olymp-gold-300: #f4d77a;
  --olymp-line: rgba(244, 215, 122, .20);
}

html { background: var(--olymp-navy-950); }
body {
  background-color: var(--olymp-navy-950) !important;
  color: #edf4ff;
}
.app-content,
.app-page,
.app-main {
  background-color: transparent !important;
}
body {
  background-image:
    radial-gradient(circle at 18% 0%, rgba(24, 67, 124, .34), transparent 34rem),
    radial-gradient(circle at 92% 18%, rgba(215, 170, 55, .12), transparent 26rem),
    linear-gradient(180deg, #071a38 0%, #030b19 58%, #020711 100%);
  background-attachment: fixed;
}

/* Header */
.app-header,
.header-top,
.header-bottom {
  background: rgba(3, 13, 31, .92) !important;
  border-color: var(--olymp-line) !important;
  box-shadow: 0 10px 30px rgba(0, 0, 0, .28);
  backdrop-filter: blur(18px);
}
.header-bottom { border-bottom: 1px solid var(--olymp-line) !important; }
.header a,
.header .category-item,
.nav-lang { color: #e9f1ff !important; }
.header li:hover .category-item,
.header a:hover { color: var(--olymp-gold-300) !important; }
.header .category-item:after { background: var(--olymp-gold-500) !important; }
.logo img { filter: drop-shadow(0 3px 12px rgba(215, 170, 55, .24)); }

/* Buttons: compact beveled rectangles instead of pills */
.oln-btn,
button[class*="btn"],
a[class*="btn"]:not([class*="btn-link"]) {
  min-height: 40px;
  border-radius: 10px !important;
  border: 1px solid rgba(255, 255, 255, .10) !important;
  letter-spacing: .01em;
  font-weight: 750;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease !important;
}
.oln-btn--primary {
  color: #071326 !important;
  background: linear-gradient(145deg, #f7df8a 0%, #d7aa37 52%, #a87918 100%) !important;
  border-color: #f8df84 !important;
  box-shadow: 0 8px 20px rgba(176, 127, 24, .28), inset 0 1px 0 rgba(255, 255, 255, .55), inset 0 -2px 0 rgba(80, 50, 0, .20) !important;
}
.oln-btn--primary:hover {
  transform: translateY(-2px);
  background: linear-gradient(145deg, #fff0ad 0%, #e6bd52 52%, #bd8d25 100%) !important;
  box-shadow: 0 12px 28px rgba(215, 170, 55, .38), inset 0 1px 0 rgba(255, 255, 255, .65) !important;
}
.oln-btn--secondary,
.oln-btn--outline {
  color: #f7e5a4 !important;
  background: linear-gradient(180deg, rgba(16, 49, 91, .92), rgba(8, 27, 57, .96)) !important;
  border-color: rgba(225, 184, 76, .56) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .05), 0 7px 18px rgba(0, 0, 0, .18) !important;
}
.oln-btn--secondary:hover,
.oln-btn--outline:hover {
  transform: translateY(-2px);
  color: #fff5ce !important;
  border-color: #f4d77a !important;
  background: linear-gradient(180deg, rgba(25, 67, 120, .98), rgba(10, 34, 69, .98)) !important;
}
.oln-btn:active { transform: translateY(0) scale(.985) !important; }
.oln-btn:focus-visible,
a:focus-visible,
button:focus-visible,
input:focus-visible { outline: none !important; box-shadow: var(--focus-shadow) !important; }

/* Inputs and search */
.oln-input,
input[type="text"], input[type="search"], input[type="email"], input[type="tel"] {
  border-radius: 10px !important;
  color: #f7fbff !important;
  background: rgba(4, 20, 45, .88) !important;
  border: 1px solid rgba(144, 177, 218, .24) !important;
}
.oln-input:focus,
input:focus { border-color: var(--olymp-gold-500) !important; }

/* Navigation chips */
.chips__item,
[class*="chip"] {
  border-radius: 8px !important;
  border-color: rgba(144, 177, 218, .20) !important;
  background-color: rgba(9, 31, 66, .78) !important;
}
.chips__item:hover,
[class*="chip"]:hover {
  border-color: rgba(244, 215, 122, .50) !important;
  color: var(--olymp-gold-300) !important;
}

/* Main section surfaces */
.section-gradient-wrapper,
.competition-slider,
.games-section,
.promo-section,
.providers-section {
  background-color: transparent !important;
}
.section-head__title,
.games-list__title,
.text-header-2xl,
.text-header-3xl { color: #f5f8ff !important; }

/* Cards */
.game-item,
.promo-item,
.bonus-card,
[class*="game-card"],
[class*="promo_card"],
.competition-item {
  border-radius: 14px !important;
}
.game-card,
.promo-item,
.competition-item {
  position: relative;
  border: 1px solid rgba(147, 181, 224, .16) !important;
  background: linear-gradient(180deg, rgba(14, 43, 83, .92), rgba(5, 19, 42, .98)) !important;
  box-shadow: 0 10px 28px rgba(0, 0, 0, .22);
  overflow: hidden;
}
.game-card:after,
.promo-item:after,
.competition-item:after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06);
}
.game-card:hover,
.promo-item:hover,
.competition-item:hover {
  transform: translateY(-4px);
  border-color: rgba(244, 215, 122, .56) !important;
  box-shadow: 0 18px 38px rgba(0, 0, 0, .34), 0 0 0 1px rgba(215, 170, 55, .14) !important;
}
.game-card,
.promo-item,
.competition-item { transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease !important; }
.game-card__footer {
  background: linear-gradient(180deg, rgba(8, 28, 59, .96), rgba(4, 17, 38, .99)) !important;
  border-top: 1px solid rgba(244, 215, 122, .13);
}
.game-card__name { color: #f1f6ff !important; }
.game-card__manufacturer { color: #e5c765 !important; }
.promo-item__title { color: #fff5cf !important; }
.promo-item__text { color: rgba(235, 243, 255, .80) !important; }
.promo-item__badge,
.game-card__badge { background: linear-gradient(135deg, #f0d171, #b88722) !important; color: #071326 !important; }

/* Hero/banner */
.banner,
.banner__container,
[class*="welcome"] {
  border-color: rgba(244, 215, 122, .18) !important;
}
.banner__title {
  color: #fff !important;
  text-shadow: 0 4px 20px rgba(0, 0, 0, .42), 0 0 25px rgba(215, 170, 55, .18);
}

/* SEO/legal block */
.seo-content-card {
  position: relative;
  max-width: 1180px;
  margin: 34px auto 26px !important;
  padding: clamp(22px, 4vw, 46px) !important;
  border: 1px solid rgba(244, 215, 122, .25);
  border-radius: 22px;
  background:
    linear-gradient(135deg, rgba(16, 50, 96, .86), rgba(4, 19, 43, .96) 58%, rgba(28, 30, 32, .96)),
    radial-gradient(circle at 90% 0%, rgba(215, 170, 55, .15), transparent 30rem) !important;
  box-shadow: 0 24px 60px rgba(0, 0, 0, .34), inset 0 1px 0 rgba(255, 255, 255, .06);
  overflow: hidden;
}
.seo-content-card:before {
  content: "";
  position: absolute;
  width: 180px;
  height: 3px;
  left: clamp(22px, 4vw, 46px);
  top: 0;
  background: linear-gradient(90deg, #f4d77a, #b8861e, transparent);
}
.seo-content-card h2,
.seo-content-card h3 {
  color: #f7dc82 !important;
  letter-spacing: -.01em;
  line-height: 1.2;
}
.seo-content-card h2 { margin: 30px 0 12px; font-size: clamp(24px, 3vw, 34px); }
.seo-content-card h2:first-child { margin-top: 0; }
.seo-content-card h3 { margin: 24px 0 8px; font-size: clamp(18px, 2vw, 23px); }
.seo-content-card p,
.seo-content-card li {
  color: rgba(236, 244, 255, .84) !important;
  line-height: 1.72;
  font-size: 16px;
}
.seo-content-card p { margin: 0 0 14px; }
.seo-content-card ol {
  display: grid;
  gap: 8px;
  margin: 14px 0 18px;
  padding-left: 26px;
}
.seo-content-card ol li::marker { color: #e6bd52; font-weight: 800; }

/* Footer */
.footer {
  border-top: 1px solid var(--olymp-line);
  background: linear-gradient(180deg, rgba(3, 14, 32, .62), rgba(2, 8, 19, .96)) !important;
}
.footer a:hover { color: var(--olymp-gold-300) !important; }
.footer .menu-container__item__title { color: #f2d477 !important; }
.footer .logo__text,
.footer .menu-container__item__text { color: rgba(220, 232, 248, .70) !important; }

/* Scrollbar and selection */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: #030c1b; }
::-webkit-scrollbar-thumb { background: linear-gradient(#2a568c, #b98b27); border-radius: 6px; border: 2px solid #030c1b; }
::-webkit-scrollbar-thumb:hover { background: linear-gradient(#3c6ca7, #ddb84d); }
::selection { background: rgba(225, 184, 76, .38); color: #fff; }

@media (max-width: 767px) {
  .oln-btn,
  button[class*="btn"],
  a[class*="btn"]:not([class*="btn-link"]) { border-radius: 9px !important; }
  .game-card,
  .promo-item,
  .competition-item { border-radius: 12px !important; }
  .seo-content-card {
    margin: 22px 12px 18px !important;
    border-radius: 16px;
  }
  .seo-content-card p,
  .seo-content-card li { font-size: 15px; line-height: 1.62; }
}

@media (prefers-reduced-motion: reduce) {
  *, *:before, *:after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}
