:root {
    --cbs-bg: #141414;
    --cbs-surface: #1f1f1f;
    --cbs-surface-2: #2a2a2a;
    --cbs-text: #f5f5f5;
    --cbs-muted: #9a9a9a;
    --cbs-accent: #e85d04;
    --cbs-accent-hover: #dc580a;
    --cbs-border: rgba(255, 255, 255, 0.12);
    --cbs-warm-bg: #f5f0e6;
    --cbs-warm-text: #1a1a1a;
    --k-bg: var(--cbs-bg);
    --k-surface: var(--cbs-surface);
    --k-text: var(--cbs-text);
    --k-muted: var(--cbs-muted);
    --k-primary: var(--cbs-accent);
    --k-primary-600: var(--cbs-accent-hover);
}

html, body {
    font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    background: var(--cbs-bg);
    color: var(--cbs-text);
}

a, .btn-link {
    color: var(--cbs-accent);
}

.btn-primary {
    color: #fff;
    background-color: var(--cbs-accent);
    border-color: var(--cbs-accent);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.btn-primary:hover, .btn-primary:focus {
    background-color: var(--cbs-accent-hover);
    border-color: var(--cbs-accent-hover);
    color: #fff;
}

.btn-outline-primary {
    color: var(--cbs-accent);
    border-color: var(--cbs-accent);
}

.btn-outline-primary:hover {
    background-color: var(--cbs-accent);
    border-color: var(--cbs-accent);
    color: #fff;
}

.btn-outline-secondary {
    color: var(--cbs-text);
    border-color: var(--cbs-border);
}

.btn-outline-secondary:hover {
    background: var(--cbs-surface-2);
    color: var(--cbs-text);
    border-color: var(--cbs-border);
}

.card {
    background: var(--cbs-surface);
    color: var(--cbs-text);
    border-color: var(--cbs-border);
}

.form-control, .form-select {
    background: var(--cbs-surface-2);
    border-color: var(--cbs-border);
    color: var(--cbs-text);
}

.form-control:focus, .form-select:focus {
    background: var(--cbs-surface-2);
    border-color: var(--cbs-accent);
    color: var(--cbs-text);
    box-shadow: 0 0 0 0.2rem rgba(232, 93, 4, 0.25);
}

.text-secondary {
    color: var(--cbs-muted) !important;
}

.text-muted {
    color: var(--cbs-muted) !important;
}

.alert-info {
    background: rgba(232, 93, 4, 0.12);
    border-color: rgba(232, 93, 4, 0.35);
    color: var(--cbs-text);
}

.alert-success {
    background: rgba(39, 174, 96, 0.15);
    border-color: rgba(39, 174, 96, 0.4);
    color: var(--cbs-text);
}

.alert-danger, .alert-warning {
    color: var(--cbs-text);
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
    box-shadow: 0 0 0 0.1rem var(--cbs-bg), 0 0 0 0.25rem rgba(232, 93, 4, 0.45);
}

.content {
    padding-top: 1.1rem;
}

h1:focus {
    outline: none;
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid #e50000;
}

.validation-message {
    color: #ff6b6b;
}

.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD3680NsaXAwIj48cmVjdCB4PSIyMzUiIHk9IjUxIiB3aWR0aD0iNTYiIGhlaWdodD0iNDkiLz48L2NsaXBCYXRoPjwvZGVmcz48ZyBjbGlwLXBhdGg9InVybCgjY2xpcDApIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMjM1IC01MSkiPjxwYXRoIGQ9Ik0yNjMuNTA2IDUxQzI2NC43MTcgNTEgMjY1LjgxMyA1MS40ODM3IDI2Ni42MDYgNTIuMjY1OEwyNjcuMDUyIDUyLjc5ODcgMjY3LjUzOSA1My42MjgzIDI5MC4xODUgOTIuMTgzMSAyOTAuNTQ1IDkyLjc5NSAyOTAuNjU2IDkyLjk5NkMyOTAuODc3IDkzLjUxMyAyOTEgOTQuMDgxNSAyOTEgOTQuNjc4MiAyOTEgOTcuMDY1MSAyODkuMDM4IDk5IDI4Ni42MTcgOTlMMjQwLjM4MyA5OUMyMzcuOTYzIDk5IDIzNiA5Ny4wNjUxIDIzNiA5NC42NzgyIDIzNiA5NC4zNzk5IDIzNi4wMzEgOTQuMDg4NiAyMzYuMDg5IDkzLjgwNzJMMjM2LjMzOCA5My4wMTYyIDIzNi44NTggOTIuMTMxNCAyNTkuNDczIDUzLjYyOTQgMjU5Ljk2MSA1Mi43OTg1IDI2MC40MDcgNTIuMjY1OEMyNjEuMiA1MS40ODM3IDI2Mi4yOTYgNTEgMjYzLjUwNiA1MVpNMjYzLjU4NiA2Ni4wMTgzQzI2MC43MzcgNjYuMDE4MyAyNTkuMzEzIDY3LjEyNDUgMjU5LjMxMyA2OS4zMzcgMjU5LjMxMyA2OS42MTAyIDI1OS4zMzIgNjkuODYwOCAyNTkuMzc1IDcwLjA4ODdMMjYxLjc5NSA4NC4wMTYxIDI2NS4zOCA4NC4wMTYxIDI2Ny44MjEgNjkuNzQ3NUMyNjcuODYgNjkuNzMwOSAyNjcuODc5IDY5LjU4NzcgMjY3Ljg3OSA2OS4zMTc5IDI2Ny44NzkgNjcuMTE4MiAyNjYuNDQ4IDY2LjAxODMgMjYzLjU4NiA2Ni4wMTgzWk0yNjMuNTc2IDg2LjA1NDdDMjYxLjA0OSA4Ni4wNTQ3IDI1OS43ODYgODcuMzAwNSAyNTkuNzg2IDg5Ljc5MjEgMjU5Ljc4NiA5Mi4yODM3IDI2MS4wNDkgOTMuNTI5NSAyNjMuNTc2IDkzLjUyOTUgMjY2LjExNiA5My41Mjk1IDI2Ny4zODcgOTIuMjgzNyAyNjcuMzg3IDg5Ljc5MjEgMjY3LjM4NyA4Ny4zMDA1IDI2Ni4xMTYgODYuMDU0NyAyNjMuNTc2IDg2LjA1NDdaIiBmaWxsPSIjRkZFNTAwIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiLz48L2c+PC9zdmc+) no-repeat 1rem/1.8rem, #b32121;
    padding: 1rem 1rem 1rem 3.7rem;
    color: white;
}

.blazor-error-boundary::after {
    content: "An error has occurred."
}

.darker-border-checkbox.form-check-input {
    border-color: #929292;
}

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
    color: var(--bs-secondary-color);
    text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
    text-align: start;
}

.k-hero {
    background: radial-gradient(900px 420px at 10% 0%, rgba(232, 93, 4, 0.25), transparent 55%),
        linear-gradient(135deg, #1a1a1a, #2d2d2d);
    border: 1px solid var(--cbs-border);
}

.k-product {
    border: 1px solid var(--cbs-border);
    background: var(--cbs-surface);
}

.k-qr {
    max-width: 320px;
    border-radius: 1rem;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.35);
}

.nav-pills .nav-link {
    border-radius: 999px;
    color: var(--cbs-muted);
}

.nav-pills .nav-link.active {
    background: var(--cbs-accent);
    color: #fff;
}

.cbs-heading {
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    line-height: 1.15;
}

.cbs-subtle {
    color: var(--cbs-muted);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: 0.75rem;
}

.cbs-page {
    min-height: 100%;
}

.cbs-page .alert-warning {
    color: #000;
}

.cbs-surface-card {
    background: var(--cbs-surface);
    border: 1px solid var(--cbs-border);
    border-radius: 0.5rem;
}

.badge.text-bg-light {
    background: var(--cbs-surface-2) !important;
    color: var(--cbs-text) !important;
}

.badge.text-bg-success {
    background: rgba(39, 174, 96, 0.25) !important;
    color: #7bed9f !important;
    border: 1px solid rgba(39, 174, 96, 0.45);
}

hr {
    border-color: var(--cbs-border);
    opacity: 1;
}