/* heyspin-in.com: SITE-045, exact registered palette. */
/* Shared palette adapter for the first Mostbet template.
   The --mb-* values are supplied by each site's site-config.json or palette CSS. */
:root {
  --palette-chrome: var(--mb-chrome, var(--mb-dark));
  --palette-chrome-text: var(--mb-chrome-text, var(--mb-chrome_text, var(--mb-text)));
  --palette-chrome-muted: var(--mb-chrome-muted, var(--mb-chrome_muted, var(--mb-muted)));
  --palette-chrome-accent: var(--mb-chrome-accent, var(--mb-chrome_accent, var(--palette-chrome-text)));
  --palette-button-text: var(--mb-button-text, var(--mb-dark));
  color-scheme: var(--mb-color-scheme, dark);
}
body { background-color: var(--mb-bg); color: var(--mb-text); }
::selection { background: var(--mb-accent); color: var(--palette-button-text); }
.skip-link,
.button-primary,
.finder-filters button[aria-pressed=true],
.game-feature:hover .circle-link {
  background: var(--mb-accent);
  border-color: var(--mb-accent);
  color: var(--palette-button-text);
}
.button-primary:hover {
  background: var(--mb-text);
  border-color: var(--mb-text);
  color: var(--mb-bg);
}
.site-header,
.site-footer,
.mobile-nav nav {
  background: var(--palette-chrome);
  color: var(--palette-chrome-text);
  border-color: var(--mb-line);
}
.desktop-nav a,
.mobile-nav summary,
.mobile-nav nav a,
.site-header .button-quiet,
.site-header .button-outline,
.footer-columns h2,
.footer-bottom nav a { color: var(--palette-chrome-text); }
.footer-brand p,
.footer-columns a,
.footer-bottom p,
.footer-account button { color: var(--palette-chrome-muted); }
.desktop-nav a:hover,
.desktop-nav a[aria-current=page],
.mobile-nav nav a:hover,
.mobile-nav nav a[aria-current=page],
.footer-columns a:hover,
.footer-bottom nav a:hover,
.footer-account button:hover { color: var(--palette-chrome-accent); }
.desktop-nav a[aria-current=page]:after { background: var(--palette-chrome-accent); }
.site-header .button-quiet:hover,
.site-header .button-outline:hover {
  background: var(--palette-chrome-text);
  border-color: var(--palette-chrome-text);
  color: var(--palette-chrome);
}
.site-header .button-primary { color: var(--palette-button-text); }
.site-header .button-primary:hover { color: var(--mb-bg); }
.account-dialog {
  background: var(--mb-surface);
  color: var(--mb-text);
  border-color: var(--mb-line);
}
.account-dialog::backdrop {
  background: color-mix(in srgb, var(--palette-chrome) 82%, transparent);
}
.account-dialog .dialog-close { background: var(--mb-surface); color: var(--mb-text); }
.account-dialog .dialog-close:hover { background: var(--mb-raised); }
.account-dialog .account-tabs button { color: var(--mb-muted); }
.account-dialog .account-tabs button[aria-pressed=true] {
  color: var(--mb-accent);
  border-bottom-color: var(--mb-accent);
}
.account-dialog .account-note,
.account-dialog .dialog-foot { color: var(--mb-muted); }
.account-dialog .form-status { color: var(--mb-accent); }
input[type=text], input[type=password], input[type=search],
input[type=email], input[type=tel], select, textarea {
  background: var(--mb-bg);
  border-color: var(--mb-line);
  color: var(--mb-text);
}
input::placeholder, textarea::placeholder { color: var(--mb-muted); opacity: 1; }
input[type=checkbox], input[type=radio] { accent-color: var(--mb-accent); }
/* Preserve local article text and hierarchy while adapting legacy inline colours. */
:is(.article-content,.fallback-article) [style*="color"] { color: var(--mb-muted) !important; }
:is(.article-content,.fallback-article) :is(p,li,ul,ol,td,figcaption,small,cite) {
  color: var(--mb-muted) !important;
}
:is(.article-content,.fallback-article) :is(h1,h2,h3,h4,h5,h6,strong,b,th,caption,.faq-question) {
  color: var(--mb-text) !important;
}
:is(.article-content,.fallback-article) a:not(.button):not(.actual-game-card) {
  color: var(--mb-link) !important;
}
:is(.article-content,.fallback-article) a:not(.button):not(.actual-game-card) * { color: inherit !important; }
:is(.article-content,.fallback-article) :is(blockquote,pre,code,.faq-item),
:is(.article-content,.fallback-article) [style*="background"] {
  background-color: var(--mb-raised) !important;
  border-color: var(--mb-line) !important;
}
:is(.article-content,.fallback-article) blockquote { border-left-color: var(--mb-accent) !important; }
:is(.article-content,.fallback-article) thead,
:is(.article-content,.fallback-article) th,
:is(.article-content,.fallback-article) tbody tr:nth-child(even) {
  background-color: var(--mb-raised) !important;
}
:is(.article-content,.fallback-article) tbody { background-color: var(--mb-surface) !important; }
:is(.article-content,.fallback-article) :is(th,td,tr,.faq-item) { border-color: var(--mb-line) !important; }
:is(.article-content,.fallback-article) :is(div,figure):has(>table) {
  max-width: 100%; overflow-x: auto; overscroll-behavior-x: contain;
}
:is(.article-content,.fallback-article) a.button-primary { color: var(--palette-button-text) !important; }
:is(.article-content,.fallback-article) a.button-primary:hover { color: var(--mb-bg) !important; }
:is(a,button,input,select,textarea,summary):focus-visible {
  outline-color: var(--mb-accent);
}
.site-header :is(a,button,summary):focus-visible,
.site-footer :is(a,button):focus-visible { outline-color: var(--palette-chrome-accent); }

:root{--mb-bg:#152a50;--mb-surface:#1c3568;--mb-raised:#203767;--mb-line:#506a9b;--mb-text:#e9eef8;--mb-muted:#bdc9df;--mb-accent:#E3ADD9;--mb-link:#BAC9E8;--mb-dark:#03050a;--mb-chrome:#122444;--mb-chrome-text:#fff8ed;--mb-chrome-muted:#e4ded4;--mb-button-text:#000000;--mb-chrome-accent:#E3ADD9;--mb-color-scheme:dark;--mb-chrome_text:#fff8ed;--mb-chrome_muted:#e4ded4;--mb-chrome_accent:#E3ADD9;color-scheme:dark}