/*
 * Surge Casino UI layer: buttons, tables, cards.
 * Loaded last (after sticky-cta.css); the "body" prefix beats global.css,
 * core-blocks-v2.css and the inlined block styles.
 * Colours live in global.css :root; this file only adds the Surge-specific shapes.
 */
:root {
    --surge-orange: #ff9d00;
    --surge-orange-2: #f08b00;
    --surge-orange-hover: #e08000;
    --surge-secondary: #324473;
    --surge-secondary-2: #475e96;
    --surge-secondary-bg: #1f2d4d;
    --surge-secondary-border: #2b3d63;
    --surge-violet: #412d8a;
    --surge-violet-2: #5634b3;
    --surge-row-border: #1a2640;
    --surge-row-hover: #182540;
    --surge-card-shadow: 0 4px 20px rgba(0, 0, 0, 0.4);
}

/* Primary buttons: solid orange, 8px corners */
body .wp-block-button__link,
body .wp-block-new-theme-hero .wp-block-button__link,
body .wp-block-new-theme-hero .page-hero__cta,
body .vox-header__btn .wp-block-button__link,
body .nt-sticky-cta .nt-sticky-cta__link,
body .nt-button--primary {
    background: linear-gradient(180deg, var(--surge-orange) 0%, var(--surge-orange-2) 100%);
    border: 0;
    border-radius: 8px;
    box-shadow: none;
    color: #0e1628;
}

body .wp-block-button__link:hover,
body .wp-block-button__link:focus-visible,
body .wp-block-new-theme-hero .wp-block-button__link:hover,
body .wp-block-new-theme-hero .page-hero__cta:hover,
body .vox-header__btn .wp-block-button__link:hover,
body .vox-header__btn .wp-block-button__link:focus-visible,
body .nt-sticky-cta .nt-sticky-cta__link:hover,
body .nt-button--primary:hover {
    background: var(--surge-orange-hover);
    color: #0e1628;
}

/* Header "Registration" keeps the pulse, recoloured to orange */
body .vox-header__btn--register .wp-block-button__link {
    box-shadow: 0 4px 14px rgba(255, 157, 0, 0.35);
}

/* Header "Log In" (second button in the header): violet */
body .vox-header__actions .wp-block-button + .wp-block-button .wp-block-button__link {
    animation: none;
    background: linear-gradient(180deg, var(--surge-violet-2) 0%, var(--surge-violet) 100%);
    box-shadow: none;
    color: #ffffff;
}

body .vox-header__actions .wp-block-button + .wp-block-button .wp-block-button__link:hover,
body .vox-header__actions .wp-block-button + .wp-block-button .wp-block-button__link:focus-visible {
    background: var(--surge-violet-2);
    color: #ffffff;
}

/* Secondary / outlined buttons */
body .wp-block-button.is-style-outline > .wp-block-button__link,
body .wp-block-button__link.is-style-outline,
body .nt-button--secondary {
    background: var(--surge-secondary-bg);
    border: 1px solid var(--surge-secondary-border);
    border-radius: 8px;
    color: #ffffff;
}

body .wp-block-button.is-style-outline > .wp-block-button__link:hover,
body .wp-block-button__link.is-style-outline:hover,
body .nt-button--secondary:hover {
    background: var(--surge-secondary);
    border-color: var(--surge-secondary-2);
    color: #ffffff;
}

/* Tables */
body .wp-block-table table {
    background: var(--new-theme-color-bg-card);
    border: 1px solid var(--new-theme-color-border);
    border-radius: 12px;
}

body .wp-block-table th,
body .wp-block-table td {
    border: 0;
    border-bottom: 1px solid var(--surge-row-border);
}

body .wp-block-table tr:last-child td {
    border-bottom: 0;
}

body .wp-block-table th {
    background: #1a2640;
    color: #ffffff;
}

body .wp-block-table tbody tr td {
    background: transparent;
    transition: background .15s;
}

body .wp-block-table.is-style-stripes tbody tr:nth-child(odd) td {
    background: var(--surge-row-hover);
}

body .wp-block-table tbody tr:hover td {
    background: var(--surge-row-hover);
}

/* Cards */
body .nt-link-card,
body .nt-faq-item,
body .nt-icon-card {
    background: var(--new-theme-color-bg-card);
    border: 1px solid var(--new-theme-color-border);
    border-radius: 14px;
    box-shadow: none;
    transition: box-shadow .2s, transform .2s;
}

body .nt-link-card:hover,
body .nt-faq-item:hover,
body .nt-icon-card:hover {
    box-shadow: var(--surge-card-shadow);
}

/* Pastel icon tiles and callouts from the light theme -> dark */
body .nt-icon-card .nt-icon-card__icon {
    background: var(--surge-secondary-bg);
    color: var(--surge-orange);
}

body .nt-icon-card--tone-violet .nt-icon-card__icon {
    color: #a48bff;
}

body .nt-icon-card--tone-blue .nt-icon-card__icon,
body .nt-icon-card--tone-sky .nt-icon-card__icon {
    color: #7fa8ff;
}

body .nt-icon-card--tone-pink .nt-icon-card__icon {
    color: #ff7eb6;
}

body .nt-icon-card--tone-green .nt-icon-card__icon {
    color: #4fd18b;
}

body .nt-icon-card__note,
body .wp-block-new-theme-warning-callout.nt-warning-callout {
    background: rgba(255, 157, 0, 0.08);
    border-color: rgba(255, 157, 0, 0.35);
    color: #ffffff;
}

body .wp-block-new-theme-warning-callout.nt-warning-callout {
    border-left-color: var(--surge-orange);
}

body .nt-warning-callout__icon {
    color: var(--surge-orange);
}

body .nt-warning-callout__title {
    color: var(--surge-orange);
}

body .nt-icon-card__note svg {
    color: var(--surge-orange);
}

/* Backdrop: radial glow only at the top of the page, not pinned to the viewport */
body {
    background-attachment: scroll;
    background-color: var(--new-theme-color-bg-base);
    background-repeat: no-repeat;
}