/*
 * Spinrise UI layer: buttons, tables, cards, backdrop.
 * 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 Spinrise-specific shapes.
 */
:root {
    --spin-bg: #0e0d1b;
    --spin-card: #18172c;
    --spin-inner: #23213f;
    --spin-violet: #5a42f5;
    --spin-violet-2: #7360f7;
    --spin-azure: #3293f7;
    --spin-azure-2: #56a8fa;
    --spin-muted: #8c89b4;
    --spin-gold: #ffc94d;
    --spin-border: #2e2b55;
    --spin-glow-violet: 0 0 15px rgba(90, 66, 245, 0.4);
    --spin-glow-azure: 0 0 15px rgba(50, 147, 247, 0.4);
}

/* Primary buttons: violet, 10px corners (Registration and generic buttons) */
body .wp-block-button__link,
body .vox-header__btn .wp-block-button__link,
body .nt-button--primary {
    background: linear-gradient(180deg, var(--spin-violet-2) 0%, var(--spin-violet) 100%);
    border: 0;
    border-radius: 10px;
    box-shadow: none;
    color: #ffffff;
    transition: box-shadow .2s, filter .2s;
}

body .wp-block-button__link:hover,
body .wp-block-button__link:focus-visible,
body .vox-header__btn .wp-block-button__link:hover,
body .vox-header__btn .wp-block-button__link:focus-visible,
body .nt-button--primary:hover {
    background: linear-gradient(180deg, var(--spin-violet-2) 0%, var(--spin-violet) 100%);
    box-shadow: var(--spin-glow-violet);
    color: #ffffff;
    filter: brightness(1.12);
}

/* Header "Registration" pulse recoloured to violet */
body .vox-header__btn--register .wp-block-button__link {
    box-shadow: 0 4px 14px rgba(90, 66, 245, 0.35);
}

/* Header "Log In" (second button in the header): dark secondary */
body .vox-header__actions .wp-block-button + .wp-block-button .wp-block-button__link {
    animation: none;
    background: var(--spin-inner);
    border: 1px solid var(--spin-border);
    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(--spin-border);
    box-shadow: none;
    color: #ffffff;
    filter: none;
}

/* Bonus CTAs (hero + sticky bar): azure, like "GET BONUS" */
body .wp-block-new-theme-hero .wp-block-button:not(.is-style-outline) .wp-block-button__link,
body .wp-block-new-theme-hero .page-hero__cta,
body .nt-sticky-cta .nt-sticky-cta__link {
    background: linear-gradient(180deg, var(--spin-azure-2) 0%, var(--spin-azure) 100%);
    border: 0;
    border-radius: 10px;
    box-shadow: none;
    color: #ffffff;
}

body .wp-block-new-theme-hero .wp-block-button:not(.is-style-outline) .wp-block-button__link:hover,
body .wp-block-new-theme-hero .wp-block-button:not(.is-style-outline) .wp-block-button__link:focus-visible,
body .wp-block-new-theme-hero .page-hero__cta:hover,
body .nt-sticky-cta .nt-sticky-cta__link:hover {
    background: linear-gradient(180deg, var(--spin-azure-2) 0%, var(--spin-azure) 100%);
    box-shadow: var(--spin-glow-azure);
    color: #ffffff;
    filter: brightness(1.1);
}

/* 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(--spin-inner);
    border: 1px solid var(--spin-border);
    border-radius: 10px;
    box-shadow: none;
    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(--spin-border);
    border-color: var(--spin-violet);
    box-shadow: var(--spin-glow-violet);
    color: #ffffff;
    filter: none;
}

/* Tables: no divider lines, every row is a rounded plate */
body .wp-block-table table {
    background: transparent;
    border: 0;
    border-collapse: separate;
    border-radius: 0;
    border-spacing: 0 6px;
    overflow: visible;
}

body .wp-block-table thead {
    border: 0;
}

body .wp-block-table th,
body .wp-block-table td,
body .wp-block-table:not(.is-style-stripes) tbody tr:nth-child(even) td,
body .wp-block-table.is-style-stripes tbody tr:nth-child(odd) td {
    background: var(--spin-card);
    border: 0;
    transition: background .15s;
}

body .wp-block-table th {
    background: var(--spin-inner);
    color: #ffffff;
    font-weight: 700;
}

body .wp-block-table tr > :first-child {
    border-radius: 12px 0 0 12px;
}

body .wp-block-table tr > :last-child {
    border-radius: 0 12px 12px 0;
}

body .wp-block-table tr > :only-child {
    border-radius: 12px;
}

body .wp-block-table tbody td:first-child {
    color: var(--spin-muted);
}

body .wp-block-table tbody td:not(:first-child) {
    color: #ffffff;
    font-weight: 600;
}

body .wp-block-table td strong,
body .wp-block-table td b {
    color: var(--spin-gold);
}

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

/* Tables here have 2-3 columns: fit the phone width instead of scrolling sideways */
@media (max-width: 767px) {
    body .wp-block-table table {
        min-width: 0;
    }

    body .wp-block-table th,
    body .wp-block-table td {
        font-size: 14px;
        padding: 10px 12px;
        word-break: break-word;
    }
}

/* Cards */
body .nt-link-card,
body .nt-faq-item,
body .nt-icon-card {
    background: var(--spin-card);
    border: 1px solid var(--spin-inner);
    border-radius: 16px;
    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(--spin-glow-violet);
}

/* Pastel icon tiles and callouts from the light theme -> dark */
body .nt-icon-card .nt-icon-card__icon {
    background: var(--spin-inner);
    color: var(--spin-violet-2);
}

body .nt-icon-card--tone-orange .nt-icon-card__icon {
    color: var(--spin-gold);
}

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: var(--spin-azure);
}

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(90, 66, 245, 0.1);
    border-color: rgba(90, 66, 245, 0.4);
    color: #ffffff;
}

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

body .nt-warning-callout__icon,
body .nt-warning-callout__title,
body .nt-icon-card__note svg {
    color: var(--spin-violet-2);
}

/* Backdrop: flat indigo with a soft violet glow at the very top, not pinned to the viewport */
body {
    background-attachment: scroll;
    background-color: var(--spin-bg);
    background-repeat: no-repeat;
}
