/* ---------------------------------------------------------------------------
   Discovery design system — shared by WhatToPlay and WhatToWatch.
   Dark "evening" theme; tokens here, component styles in scoped .razor.css.
--------------------------------------------------------------------------- */

*,
*::before,
*::after {
    box-sizing: border-box;
}

:root {
    /* surfaces */
    --bg: #0c0f16;
    --surface: #151a24;
    --surface-2: #1a2130;
    --border: #242d40;
    --border-bright: #35415c;

    /* text */
    --fg: #eceff7;
    --muted: #97a1b7;
    --faint: #626d85;

    /* brand */
    --accent-1: #7c5cff;
    --accent-2: #38b6ff;
    --accent-gradient: linear-gradient(135deg, var(--accent-1), var(--accent-2));

    /* signals */
    --live: #4ade80;
    --up: #4ade80;
    --down: #f87171;
    --deal: #a4d007;

    /* shape & type */
    --radius: 14px;
    --radius-sm: 8px;
    --font: "Avenir Next", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}

html {
    color-scheme: dark;
}

html,
body {
    margin: 0;
    min-height: 100dvh;
    font-family: var(--font);
    background-color: var(--bg);
    color: var(--fg);
    -webkit-font-smoothing: antialiased;
}

/* one soft violet glow bleeding from the top of the page */
body {
    background-image:
        radial-gradient(900px 480px at 50% -120px, rgba(124, 92, 255, 0.22), transparent 70%),
        radial-gradient(700px 380px at 85% -60px, rgba(56, 182, 255, 0.10), transparent 70%);
    background-repeat: no-repeat;
}

a {
    color: inherit;
    text-decoration: none;
}

h1,
h2,
h3,
p {
    margin: 0;
}

img {
    max-width: 100%;
    display: block;
}

h1:focus {
    outline: none;
}

.container {
    width: min(1200px, 100% - 2.5rem);
    margin-inline: auto;
}

#blazor-error-ui {
    color-scheme: light only;
    background: lightyellow;
    color: #111;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

#blazor-error-ui .dismiss {
    cursor: pointer;
    position: absolute;
    right: 0.75rem;
    top: 0.5rem;
}
