/* QRius app theme. Maps the QRius color system onto Tabler 1.0 (dark by default, light via data-bs-theme). Solid colors only. */

@font-face { font-family: "Outfit"; src: url("../fonts/qrius/outfit-latin.woff2") format("woff2"); font-weight: 400 800; font-style: normal; font-display: swap; }
@font-face { font-family: "Geist"; src: url("../fonts/qrius/geist-latin.woff2") format("woff2"); font-weight: 400 700; font-style: normal; font-display: swap; }
@font-face { font-family: "Geist Mono"; src: url("../fonts/qrius/geist-mono-latin.woff2") format("woff2"); font-weight: 400 600; font-style: normal; font-display: swap; }
@font-face { font-family: "Outfit Fallback"; src: local("Arial Bold"), local("Arial-BoldMT"); size-adjust: 94.89%; ascent-override: 105.38%; descent-override: 27.40%; line-gap-override: 0%; }
@font-face { font-family: "Geist Fallback"; src: local("Arial"), local("ArialMT"); size-adjust: 103.74%; ascent-override: 96.87%; descent-override: 28.44%; line-gap-override: 0%; }

:root {
  --qr-font-display: "Outfit", "Outfit Fallback", ui-sans-serif, system-ui, sans-serif;
  --qr-font-body: "Geist", "Geist Fallback", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --qr-font-mono: "Geist Mono", ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
  --qr-logo-orange: #FF5A0A;
  --qr-paper: #FFFFFF;
  --qr-paper-ink: #0B0D10;
  --qr-sidebar-w: 16rem;
  --qr-topbar-h: 4rem;
  --qr-ease: cubic-bezier(0.2, 0.7, 0.2, 1);
}

[data-bs-theme=dark] {
  color-scheme: dark;
  --qr-bg: #0B0D10;
  --qr-surface: #14171B;
  --qr-surface-2: #1D2127;
  --qr-border: #2B3037;
  --qr-border-strong: #3A414B;
  --qr-text: #F7F8FA;
  --qr-text-2: #A9B0BA;
  --qr-primary: #FF5A0A;
  --qr-primary-hover: #FF7436;
  --qr-on-primary: #0B0D10;
  --qr-primary-muted: #332017;
  --qr-link: #FF895B;
  --qr-focus: #FF895B;
  --qr-success: #34D399;
  --qr-warning: #FBBF24;
  --qr-error: #FB7185;
  --qr-info: #38BDF8;
  --qr-chart-1: #FF5A0A;
  --qr-chart-2: #8B5CF6;
  --qr-chart-3: #38BDF8;
  --qr-chart-4: #34D399;
  --qr-chart-5: #FBBF24;
  --qr-on-status: #0B0D10;
  --qr-success-bg: rgba(52, 211, 153, 0.14);
  --qr-error-bg: rgba(251, 113, 133, 0.14);
  --qr-warning-bg: rgba(251, 191, 36, 0.14);
  --qr-info-bg: rgba(56, 189, 248, 0.14);
  --qr-header-bg: rgba(11, 13, 16, 0.84);
  --qr-shadow-pop: 0 24px 48px -24px rgba(0, 0, 0, 0.7);
  --qr-backdrop: rgba(5, 6, 8, 0.66);

  --tblr-body-bg: var(--qr-bg);
  --tblr-body-bg-rgb: 11, 13, 16;
  --tblr-body-color: var(--qr-text);
  --tblr-body-color-rgb: 247, 248, 250;
  --tblr-emphasis-color: var(--qr-text);
  --tblr-emphasis-color-rgb: 247, 248, 250;
  --tblr-secondary: var(--qr-text-2);
  --tblr-secondary-rgb: 169, 176, 186;
  --tblr-secondary-color: var(--qr-text-2);
  --tblr-muted: var(--qr-text-2);
  --tblr-tertiary-color: var(--qr-text-2);
  --tblr-bg-surface: var(--qr-surface);
  --tblr-bg-surface-secondary: var(--qr-surface-2);
  --tblr-bg-surface-tertiary: var(--qr-surface-2);
  --tblr-bg-surface-dark: var(--qr-bg);
  --tblr-bg-forms: var(--qr-bg);
  --tblr-secondary-bg: var(--qr-surface-2);
  --tblr-tertiary-bg: var(--qr-surface);
  --tblr-border-color: var(--qr-border);
  --tblr-border-color-translucent: rgba(255, 255, 255, 0.08);
  --tblr-dark-mode-border-color: var(--qr-border);
  --tblr-dark-mode-border-color-translucent: rgba(255, 255, 255, 0.08);
  --tblr-dark-mode-border-color-active: var(--qr-border-strong);
  --tblr-primary: var(--qr-primary);
  --tblr-primary-rgb: 255, 90, 10;
  --tblr-primary-fg: var(--qr-on-primary);
  --tblr-primary-darken: var(--qr-primary-hover);
  --tblr-primary-lt: var(--qr-primary-muted);
  --tblr-primary-text-emphasis: var(--qr-link);
  --tblr-primary-bg-subtle: var(--qr-primary-muted);
  --tblr-primary-border-subtle: #5C2E14;
  --tblr-link-color: var(--qr-link);
  --tblr-link-color-rgb: 255, 137, 91;
  --tblr-link-hover-color: #FFA27E;
  --tblr-link-hover-color-rgb: 255, 162, 126;
  --tblr-success: var(--qr-success);
  --tblr-success-rgb: 52, 211, 153;
  --tblr-success-fg: #0B0D10;
  --tblr-warning: var(--qr-warning);
  --tblr-warning-rgb: 251, 191, 36;
  --tblr-warning-fg: #0B0D10;
  --tblr-danger: var(--qr-error);
  --tblr-danger-rgb: 251, 113, 133;
  --tblr-danger-fg: #0B0D10;
  --tblr-info: var(--qr-info);
  --tblr-info-rgb: 56, 189, 248;
  --tblr-info-fg: #0B0D10;
  --tblr-focus-ring-color: rgba(255, 90, 10, 0.35);
}

[data-bs-theme=light] {
  color-scheme: light;
  --qr-bg: #F7F8FA;
  --qr-surface: #FFFFFF;
  --qr-surface-2: #F0F2F5;
  --qr-border: #E1E5EA;
  --qr-border-strong: #C8CDD4;
  --qr-text: #12151A;
  --qr-text-2: #626A76;
  --qr-primary: #C2410C;
  --qr-primary-hover: #A93207;
  --qr-on-primary: #FFFFFF;
  --qr-primary-muted: #FFF0E7;
  --qr-link: #B53B08;
  --qr-focus: #B53B08;
  --qr-success: #047857;
  --qr-warning: #B45309;
  --qr-error: #BE123C;
  --qr-info: #1D4ED8;
  --qr-chart-1: #FF5A0A;
  --qr-chart-2: #8B5CF6;
  --qr-chart-3: #0284C7;
  --qr-chart-4: #059669;
  --qr-chart-5: #D97706;
  --qr-on-status: #FFFFFF;
  --qr-success-bg: #ECFDF5;
  --qr-error-bg: #FFF1F2;
  --qr-warning-bg: #FFFBEB;
  --qr-info-bg: #EFF6FF;
  --qr-header-bg: rgba(247, 248, 250, 0.86);
  --qr-shadow-pop: 0 24px 48px -28px rgba(18, 21, 26, 0.22), 0 2px 6px rgba(18, 21, 26, 0.05);
  --qr-backdrop: rgba(18, 21, 26, 0.4);

  --tblr-body-bg: var(--qr-bg);
  --tblr-body-bg-rgb: 247, 248, 250;
  --tblr-body-color: var(--qr-text);
  --tblr-body-color-rgb: 18, 21, 26;
  --tblr-emphasis-color: var(--qr-text);
  --tblr-emphasis-color-rgb: 18, 21, 26;
  --tblr-secondary: var(--qr-text-2);
  --tblr-secondary-rgb: 98, 106, 118;
  --tblr-secondary-color: var(--qr-text-2);
  --tblr-muted: var(--qr-text-2);
  --tblr-tertiary-color: var(--qr-text-2);
  --tblr-bg-surface: var(--qr-surface);
  --tblr-bg-surface-secondary: var(--qr-surface-2);
  --tblr-bg-surface-tertiary: var(--qr-surface-2);
  --tblr-bg-surface-dark: #12151A;
  --tblr-bg-forms: var(--qr-surface);
  --tblr-secondary-bg: var(--qr-surface-2);
  --tblr-tertiary-bg: var(--qr-bg);
  --tblr-border-color: var(--qr-border);
  --tblr-border-color-translucent: rgba(18, 21, 26, 0.08);
  --tblr-primary: var(--qr-primary);
  --tblr-primary-rgb: 194, 65, 12;
  --tblr-primary-fg: var(--qr-on-primary);
  --tblr-primary-darken: var(--qr-primary-hover);
  --tblr-primary-lt: var(--qr-primary-muted);
  --tblr-primary-text-emphasis: var(--qr-primary-hover);
  --tblr-primary-bg-subtle: var(--qr-primary-muted);
  --tblr-primary-border-subtle: #F6C9AE;
  --tblr-link-color: var(--qr-link);
  --tblr-link-color-rgb: 181, 59, 8;
  --tblr-link-hover-color: var(--qr-primary-hover);
  --tblr-link-hover-color-rgb: 169, 50, 7;
  --tblr-success: var(--qr-success);
  --tblr-success-rgb: 4, 120, 87;
  --tblr-success-fg: #FFFFFF;
  --tblr-warning: var(--qr-warning);
  --tblr-warning-rgb: 180, 83, 9;
  --tblr-warning-fg: #FFFFFF;
  --tblr-danger: var(--qr-error);
  --tblr-danger-rgb: 190, 18, 60;
  --tblr-danger-fg: #FFFFFF;
  --tblr-info: var(--qr-info);
  --tblr-info-rgb: 29, 78, 216;
  --tblr-info-fg: #FFFFFF;
  --tblr-focus-ring-color: rgba(194, 65, 12, 0.3);
}

[data-bs-theme] {
  --tblr-font-sans-serif: var(--qr-font-body);
  --tblr-body-font-family: var(--qr-font-body);
  --tblr-font-monospace: var(--qr-font-mono);
  --tblr-body-font-size: 0.9375rem;
  --tblr-border-radius: 8px;
  --tblr-border-radius-sm: 6px;
  --tblr-border-radius-lg: 14px;
  --tblr-border-radius-xl: 20px;
  --tblr-box-shadow: none;
  --tblr-box-shadow-card: none;
  --tblr-shadow-card: none;
}

:root:has(body[data-bs-theme=dark]) { color-scheme: dark; background: #0B0D10; }
:root:has(body[data-bs-theme=light]) { color-scheme: light; background: #F7F8FA; }

/* Base */
body { font-family: var(--qr-font-body); font-size: 0.9375rem; line-height: 1.55; letter-spacing: 0; background: var(--qr-bg); color: var(--qr-text); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
[hidden] { display: none !important; }
::selection { background: var(--qr-primary); color: var(--qr-on-primary); }
:focus-visible { outline: 2px solid var(--qr-focus); outline-offset: 2px; }
a { color: var(--qr-link); font-weight: 500; text-underline-offset: 3px; }
.btn, .btn:hover, .dropdown-item, .dropdown-item:hover, .nav-link, .nav-link:hover, .page-link, .page-link:hover, .badge, a.badge:hover { text-decoration: none; }
h1, h2, h3, h4, .h1, .h2, .h3, .h4, .page-title, .card-title, .modal-title { font-family: var(--qr-font-display); font-weight: 600; letter-spacing: -0.02em; color: var(--qr-text); }
.text-muted, .text-secondary, .form-hint, .small.text-muted { color: var(--qr-text-2) !important; }
code, kbd, pre, .font-monospace { font-family: var(--qr-font-mono); }
hr { border-color: var(--qr-border); opacity: 1; }
.icon { stroke-width: 1.75; }

/* Page scaffold (Tabler pages render .page-wrapper > .container-fluid > .page-header, then .page-body) */
.qr-main .page-wrapper { padding-bottom: 3rem; }
.qr-main .page-wrapper > .container-fluid,
.qr-main .page-wrapper > .container-xl,
.qr-main .page-body > .container-fluid,
.qr-main .page-body > .container-xl { max-width: 1360px; margin-inline: auto; padding-inline: clamp(1rem, 3vw, 2rem); }
.page-header { margin: 1.75rem 0 1.25rem; min-height: 0; }
.page-pretitle { color: var(--qr-primary); font: 500 0.6875rem/1 var(--qr-font-mono); letter-spacing: 0.08em; text-transform: uppercase; }
.page-title { margin-top: 0.375rem; font-size: clamp(1.375rem, 1.2rem + 0.6vw, 1.75rem); line-height: 1.15; }
.page-body { margin-top: 0; }

/* Cards */
.card { --tblr-card-bg: var(--qr-surface); --tblr-card-border-color: var(--qr-border); --tblr-card-border-radius: 14px; --tblr-card-inner-border-radius: 13px; --tblr-card-cap-bg: transparent; --tblr-card-spacer-y: 1.25rem; --tblr-card-spacer-x: 1.25rem; border: 1px solid var(--qr-border); box-shadow: none; }
.card-header { border-bottom: 1px solid var(--qr-border); }
.card-footer { border-top: 1px solid var(--qr-border); background: transparent; }
.card-title { font-size: 1rem; }
.card-stamp { display: none; }
.card-sm > .card-body { padding: 1rem 1.125rem; }

/* Buttons */
.btn { --tblr-btn-border-radius: 10px; --tblr-btn-font-weight: 600; --tblr-btn-padding-y: 0.5rem; --tblr-btn-padding-x: 0.875rem; --tblr-btn-font-size: 0.875rem; min-height: 2.5rem; gap: 0.375rem; box-shadow: none; letter-spacing: -0.005em; }
.btn-sm { min-height: 2rem; --tblr-btn-padding-y: 0.25rem; --tblr-btn-padding-x: 0.625rem; --tblr-btn-font-size: 0.8125rem; --tblr-btn-border-radius: 8px; }
.btn-lg { min-height: 3rem; --tblr-btn-border-radius: 12px; }
.btn-primary { --tblr-btn-color: var(--qr-on-primary); --tblr-btn-bg: var(--qr-primary); --tblr-btn-border-color: var(--qr-primary); --tblr-btn-hover-color: var(--qr-on-primary); --tblr-btn-hover-bg: var(--qr-primary-hover); --tblr-btn-hover-border-color: var(--qr-primary-hover); --tblr-btn-active-color: var(--qr-on-primary); --tblr-btn-active-bg: var(--qr-primary-hover); --tblr-btn-active-border-color: var(--qr-primary-hover); --tblr-btn-disabled-color: var(--qr-on-primary); --tblr-btn-disabled-bg: var(--qr-primary); --tblr-btn-disabled-border-color: var(--qr-primary); }
.btn-primary:focus-visible { outline-color: var(--qr-text); }
.btn-outline-primary { --tblr-btn-color: var(--qr-link); --tblr-btn-border-color: var(--qr-border-strong); --tblr-btn-hover-color: var(--qr-on-primary); --tblr-btn-hover-bg: var(--qr-primary); --tblr-btn-hover-border-color: var(--qr-primary); --tblr-btn-active-bg: var(--qr-primary-hover); }
.btn:not([class*="btn-"]), .btn-secondary, .btn-outline-secondary, .btn-white, .btn-light, .btn-default { --tblr-btn-color: var(--qr-text); --tblr-btn-bg: var(--qr-surface-2); --tblr-btn-border-color: var(--qr-border); --tblr-btn-hover-color: var(--qr-text); --tblr-btn-hover-bg: var(--qr-surface-2); --tblr-btn-hover-border-color: var(--qr-border-strong); --tblr-btn-active-bg: var(--qr-surface-2); --tblr-btn-active-color: var(--qr-text); }
.btn-dark { --tblr-btn-color: var(--qr-bg); --tblr-btn-bg: var(--qr-text); --tblr-btn-border-color: var(--qr-text); --tblr-btn-hover-bg: var(--qr-text-2); --tblr-btn-hover-color: var(--qr-bg); }
.btn-ghost-primary, .btn-link { --tblr-btn-color: var(--qr-link); }
.btn-icon { min-width: 2.5rem; }
.btn-list { gap: 0.5rem; }

/* Forms */
.form-control, .form-select, .form-imagecheck-figure, .input-group-text, .ts-control, .dataTables_wrapper .dataTables_filter input, .dataTables_wrapper .dataTables_length select {
  border-color: var(--qr-border); border-radius: 10px; background-color: var(--tblr-bg-forms); color: var(--qr-text); min-height: 2.5rem; font-size: 0.9375rem;
}
.form-control::placeholder { color: var(--qr-text-2); opacity: 1; }
.form-control:hover, .form-select:hover { border-color: var(--qr-border-strong); }
.form-control:focus, .form-select:focus, .ts-control.focus { border-color: var(--qr-primary); box-shadow: 0 0 0 3px var(--qr-primary-muted); }
.form-control.is-invalid, .form-select.is-invalid { border-color: var(--qr-error); }
.invalid-feedback { color: var(--qr-error); }
.form-label { margin-bottom: 0.375rem; color: var(--qr-text); font-size: 0.8125rem; font-weight: 600; }
.form-label.required::after { color: var(--qr-error); }
.input-group > .form-control:not(:last-child), .input-group > .form-select:not(:last-child) { border-top-right-radius: 0; border-bottom-right-radius: 0; }
.input-group > :not(:first-child) { border-top-left-radius: 0; border-bottom-left-radius: 0; }
.input-group-text { background: var(--qr-surface-2); color: var(--qr-text-2); }
.form-check-input { border-color: var(--qr-border-strong); background-color: var(--tblr-bg-forms); }
.form-check-input:checked { background-color: var(--qr-primary); border-color: var(--qr-primary); }
.form-switch .form-check-input:checked { background-color: var(--qr-primary); }
.form-colorinput-color { border-radius: 8px; }
.form-selectgroup-label { border-color: var(--qr-border); border-radius: 10px; background: var(--qr-surface); color: var(--qr-text-2); }
.form-selectgroup-input:checked + .form-selectgroup-label { border-color: var(--qr-primary); background: var(--qr-primary-muted); color: var(--qr-text); }

/* Tables */
.table { --tblr-table-bg: transparent; --tblr-table-color: var(--qr-text); --tblr-table-border-color: var(--qr-border); --tblr-table-striped-bg: var(--qr-surface-2); --tblr-table-hover-bg: var(--qr-surface-2); --tblr-table-hover-color: var(--qr-text); }
.table thead th, .table > thead > tr > th, .markdown > table thead th { background: transparent; color: var(--qr-text-2); font: 500 0.6875rem/1.2 var(--qr-font-mono); letter-spacing: 0.06em; text-transform: uppercase; border-bottom-color: var(--qr-border); padding-top: 0.875rem; padding-bottom: 0.875rem; }
.table > :not(caption) > * > * { border-bottom-color: var(--qr-border); }
.table-responsive { border-radius: inherit; }
.dataTables_wrapper { color: var(--qr-text-2); font-size: 0.875rem; }
.dataTables_wrapper .row { --tblr-gutter-x: 1rem; }
.dataTables_wrapper .dataTables_length, .dataTables_wrapper .dataTables_filter, .dataTables_wrapper .dataTables_info, .dataTables_wrapper .dataTables_paginate { padding: 0.75rem 1.25rem; }
.dataTables_wrapper .dataTables_filter input { margin-left: 0.5rem; min-height: 2.25rem; padding: 0.25rem 0.75rem; }
.dataTables_wrapper .dataTables_length select { min-height: 2.25rem; padding: 0.25rem 2rem 0.25rem 0.625rem; }
table.dataTable { border-collapse: collapse !important; margin: 0 !important; }

/* Pagination */
.pagination { gap: 0.25rem; }
.page-link { border-radius: 8px !important; border-color: transparent; background: transparent; color: var(--qr-text-2); min-width: 2rem; text-align: center; }
.page-link:hover { background: var(--qr-surface-2); color: var(--qr-text); }
.page-item.active .page-link { background: var(--qr-primary); border-color: var(--qr-primary); color: var(--qr-on-primary); }
.page-item.disabled .page-link { background: transparent; color: var(--qr-text-2); opacity: 1; pointer-events: none; }

/* Badges, alerts, dropdowns, modals, tabs */
.badge { border-radius: 6px; font: 600 0.6875rem/1 var(--qr-font-mono); letter-spacing: 0.02em; padding: 0.375rem 0.5rem; }
.badge.bg-primary, .badge.bg-orange { background: var(--qr-primary) !important; color: var(--qr-on-primary) !important; }
.badge.bg-success, .badge.bg-green { background: var(--qr-success) !important; color: var(--qr-on-status) !important; }
.badge.bg-danger, .badge.bg-red { background: var(--qr-error) !important; color: var(--qr-on-status) !important; }
.badge.bg-warning, .badge.bg-yellow { background: var(--qr-warning) !important; color: var(--qr-on-status) !important; }
.badge.bg-info, .badge.bg-azure, .badge.bg-blue { background: var(--qr-info) !important; color: var(--qr-on-status) !important; }
.alert { border: 1px solid var(--qr-border); border-radius: 12px; background: var(--qr-surface); color: var(--qr-text); box-shadow: none; }
.alert-dismissible { padding-right: 3rem; }
.alert-important.alert-success { background: #0E3B2C; border-color: #155E45; color: #D1FAE5; }
.alert-important.alert-danger { background: #3D1520; border-color: #6B2234; color: #FFE4E8; }
.alert-important.alert-warning { background: #3A2B0B; border-color: #6B4F12; color: #FEF3C7; }
.alert-important.alert-info { background: #0C2E40; border-color: #144B66; color: #E0F2FE; }
[data-bs-theme=light] .alert-important.alert-success { background: #ECFDF5; border-color: #A7F3D0; color: #065F46; }
[data-bs-theme=light] .alert-important.alert-danger { background: #FFF1F2; border-color: #FECDD3; color: #9F1239; }
[data-bs-theme=light] .alert-important.alert-warning { background: #FFFBEB; border-color: #FDE68A; color: #92400E; }
[data-bs-theme=light] .alert-important.alert-info { background: #EFF6FF; border-color: #BFDBFE; color: #1E40AF; }
[data-bs-theme=light] .alert-important .btn-close-white { filter: none; }
.dropdown-menu { --tblr-dropdown-bg: var(--qr-surface); --tblr-dropdown-border-color: var(--qr-border); --tblr-dropdown-link-color: var(--qr-text); --tblr-dropdown-link-hover-bg: var(--qr-surface-2); --tblr-dropdown-link-hover-color: var(--qr-text); --tblr-dropdown-link-active-bg: var(--qr-primary-muted); --tblr-dropdown-link-active-color: var(--qr-text); border-radius: 12px; box-shadow: var(--qr-shadow-pop); padding: 0.375rem; }
.dropdown-item { border-radius: 8px; padding: 0.5rem 0.75rem; font-size: 0.875rem; }
.modal { --tblr-modal-bg: var(--qr-surface); --tblr-modal-border-color: var(--qr-border); --tblr-modal-border-radius: 18px; --tblr-modal-header-border-color: var(--qr-border); --tblr-modal-footer-border-color: var(--qr-border); }
.modal-backdrop { --tblr-backdrop-bg: #05060A; --tblr-backdrop-opacity: 0.66; }
.nav-tabs { --tblr-nav-tabs-border-color: var(--qr-border); --tblr-nav-tabs-link-active-color: var(--qr-text); --tblr-nav-tabs-link-active-bg: transparent; --tblr-nav-tabs-link-active-border-color: var(--qr-primary); }
.nav-tabs .nav-link.active { border-bottom-color: var(--qr-primary); box-shadow: inset 0 -2px 0 var(--qr-primary); }
.nav-pills .nav-link.active { background: var(--qr-primary); color: var(--qr-on-primary); }
.progress { background: var(--qr-surface-2); border-radius: 999px; }
.progress-bar { background: var(--qr-primary); }
.avatar { border-radius: 10px; background-color: var(--qr-surface-2); color: var(--qr-text); }
.list-group-item { background: transparent; border-color: var(--qr-border); color: var(--qr-text); }
.empty { padding: 3rem 1rem; }
.empty-title { font-family: var(--qr-font-display); }
.swal-modal, .swal2-popup { background: var(--qr-surface) !important; border: 1px solid var(--qr-border); border-radius: 18px !important; color: var(--qr-text) !important; }
.swal-title, .swal2-title, .swal-text, .swal2-html-container { color: var(--qr-text) !important; }
.swal-button, .swal2-confirm { border-radius: 10px !important; background: var(--qr-primary) !important; color: var(--qr-on-primary) !important; }

/* App shell */
.qr-app { min-height: 100vh; }
.qr-sidebar {
  position: fixed; inset: 0 auto 0 0; z-index: 1040; width: var(--qr-sidebar-w);
  display: flex; flex-direction: column; background: var(--qr-bg); border-right: 1px solid var(--qr-border);
}
.qr-sidebar__brand { display: flex; align-items: center; justify-content: space-between; flex: none; height: var(--qr-topbar-h); padding: 0 1rem 0 1.25rem; border-bottom: 1px solid var(--qr-border); }
.qr-sidebar__brand a { display: inline-flex; align-items: center; padding: 0.25rem 0; border-radius: 6px; color: var(--qr-text); }
.qr-wordmark { display: block; height: 1.625rem; width: auto; aspect-ratio: 175.2 / 52.3; color: var(--qr-text); }
.qr-nav { flex: 1; overflow-y: auto; padding: 0.5rem 0.75rem 1rem; scrollbar-width: thin; }
.qr-nav__label { margin: 1.25rem 0.75rem 0.5rem; color: var(--qr-text-2); font: 500 0.6875rem/1 var(--qr-font-mono); letter-spacing: 0.08em; text-transform: uppercase; }
.qr-nav__list { margin: 0; padding: 0; list-style: none; display: grid; gap: 0.125rem; }
.qr-nav__link { display: flex; align-items: center; gap: 0.625rem; min-height: 2.25rem; padding: 0.375rem 0.75rem; border-radius: 8px; color: var(--qr-text-2); font-size: 0.875rem; font-weight: 500; text-decoration: none; transition: background-color 140ms, color 140ms; }
.qr-nav__link:hover { background: var(--qr-surface); color: var(--qr-text); text-decoration: none; }
.qr-nav__link.is-active { background: var(--qr-surface-2); color: var(--qr-text); }
.qr-nav__link.is-active .qr-i { color: var(--qr-primary); }
.qr-nav__link .qr-badge { margin-left: auto; }
.qr-i { display: block; flex: none; width: 1.125rem; height: 1.125rem; fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }
.qr-plan { margin: 0 0.75rem 0.75rem; padding: 0.875rem 1rem; border: 1px solid var(--qr-border); border-radius: 12px; background: var(--qr-surface); }
.qr-plan__row { display: flex; align-items: center; justify-content: space-between; gap: 0.5rem; }
.qr-plan__name { color: var(--qr-text); font: 600 0.9375rem/1.2 var(--qr-font-display); }
.qr-plan__meta { margin-top: 0.25rem; color: var(--qr-text-2); font-size: 0.75rem; }
.qr-plan a { display: inline-flex; margin-top: 0.625rem; font-size: 0.8125rem; font-weight: 600; text-decoration: none; }
.qr-badge { display: inline-flex; align-items: center; height: 1.375rem; padding: 0 0.4375rem; border-radius: 6px; background: var(--qr-primary-muted); color: var(--qr-primary); font: 600 0.625rem/1 var(--qr-font-mono); letter-spacing: 0.06em; text-transform: uppercase; }
.qr-user { display: flex; align-items: center; gap: 0.625rem; flex: none; padding: 0.75rem 0.75rem 0.75rem 1rem; border-top: 1px solid var(--qr-border); }
.qr-avatar { display: grid; place-items: center; flex: none; width: 2.25rem; height: 2.25rem; overflow: hidden; border-radius: 10px; background: var(--qr-primary); color: var(--qr-on-primary); font: 600 0.8125rem/1 var(--qr-font-mono); }
.qr-avatar img { width: 100%; height: 100%; object-fit: cover; }
.qr-user__text { min-width: 0; flex: 1; }
.qr-user__name, .qr-user__email { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.qr-user__name { color: var(--qr-text); font-size: 0.875rem; font-weight: 600; }
.qr-user__email { color: var(--qr-text-2); font-size: 0.75rem; }
.qr-icon-btn { display: inline-grid; place-items: center; flex: none; width: 2.25rem; height: 2.25rem; padding: 0; border: 1px solid var(--qr-border); border-radius: 10px; background: transparent; color: var(--qr-text); cursor: pointer; transition: background-color 140ms, border-color 140ms; }
.qr-icon-btn:hover { background: var(--qr-surface-2); border-color: var(--qr-border-strong); color: var(--qr-text); }
.qr-icon-btn--quiet { border-color: transparent; color: var(--qr-text-2); }
.qr-main { min-height: 100vh; margin-left: var(--qr-sidebar-w); display: flex; flex-direction: column; }
.qr-topbar { position: sticky; top: 0; z-index: 1030; display: flex; align-items: center; gap: 0.625rem; height: var(--qr-topbar-h); padding: 0 clamp(1rem, 3vw, 2rem); background: var(--qr-header-bg); border-bottom: 1px solid var(--qr-border); }
@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) { .qr-topbar { -webkit-backdrop-filter: saturate(1.4) blur(12px); backdrop-filter: saturate(1.4) blur(12px); } }
.qr-topbar__brand { display: none; }
.qr-topbar__spacer { flex: 1; }
.qr-topbar__crumb { color: var(--qr-text-2); font: 500 0.75rem/1 var(--qr-font-mono); letter-spacing: 0.04em; }
.qr-topbar .form-select { width: auto; min-height: 2.25rem; padding-top: 0.25rem; padding-bottom: 0.25rem; font-size: 0.8125rem; }
.qr-menu-btn { display: none; }
.qr-backdrop { position: fixed; inset: 0; z-index: 1035; background: var(--qr-backdrop); }
.qr-verify { max-width: 1360px; margin: 1rem auto 0; padding-inline: clamp(1rem, 3vw, 2rem); width: 100%; }
.qr-locked { overflow: hidden; }
@media (max-width: 991.98px) {
  .qr-sidebar { visibility: hidden; transform: translateX(-100%); transition: transform 240ms var(--qr-ease), visibility 0s linear 240ms; box-shadow: none; }
  .qr-sidebar.is-open { visibility: visible; transform: none; transition: transform 240ms var(--qr-ease); box-shadow: var(--qr-shadow-pop); }
  .qr-main { margin-left: 0; }
  .qr-menu-btn { display: inline-grid; }
  .qr-topbar__brand { display: inline-flex; }
  .qr-topbar__crumb { display: none; }
}
@media (max-width: 575.98px) {
  .qr-topbar .qr-hide-xs { display: none !important; }
}

/* Dashboard pieces */
.qr-hello { margin: 1.75rem 0 1.25rem; display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 1rem; }
.qr-hello h1 { margin: 0.375rem 0 0; font-size: clamp(1.5rem, 1.2rem + 1vw, 2rem); }
.qr-hello p { margin: 0.375rem 0 0; color: var(--qr-text-2); }
.qr-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; overflow: hidden; border: 1px solid var(--qr-border); border-radius: 14px; background: var(--qr-border); }
.qr-kpi { min-width: 0; padding: 1.125rem 1.25rem; background: var(--qr-surface); }
.qr-kpi__label { color: var(--qr-text-2); font-size: 0.8125rem; }
.qr-kpi__value { margin-top: 0.5rem; color: var(--qr-text); font: 600 1.75rem/1 var(--qr-font-display); letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
.qr-kpi__value small { margin-left: 0.25rem; color: var(--qr-text-2); font: 500 0.75rem/1 var(--qr-font-mono); letter-spacing: 0; }
.qr-kpi__foot { margin-top: 0.625rem; font-size: 0.8125rem; }
.qr-kpi__foot a { font-weight: 600; text-decoration: none; }
.qr-kpi--accent { background: var(--qr-primary); color: var(--qr-on-primary); }
.qr-kpi--accent .qr-kpi__label, .qr-kpi--accent .qr-kpi__value, .qr-kpi--accent .qr-kpi__value small, .qr-kpi--accent a { color: var(--qr-on-primary); }
.qr-split { display: grid; grid-template-columns: minmax(0, 1fr) 20rem; gap: 1.25rem; margin-top: 1.25rem; align-items: start; }
.qr-actions { display: grid; gap: 0.5rem; }
.qr-action { display: flex; align-items: center; gap: 0.75rem; padding: 0.75rem; border: 1px solid var(--qr-border); border-radius: 12px; background: var(--qr-bg); color: var(--qr-text); text-decoration: none; transition: border-color 140ms, transform 200ms var(--qr-ease); }
.qr-action:hover { border-color: var(--qr-border-strong); color: var(--qr-text); text-decoration: none; transform: translateY(-1px); }
.qr-action .qr-i { width: 2.25rem; height: 2.25rem; padding: 0.5rem; border-radius: 10px; background: var(--qr-surface-2); color: var(--qr-primary); }
.qr-action b { display: block; font-size: 0.875rem; }
.qr-action span { display: block; color: var(--qr-text-2); font-size: 0.75rem; }
.qr-beta { padding: 1.25rem; border-radius: 14px; background: var(--qr-primary); color: var(--qr-on-primary); }
.qr-beta h3 { margin: 0.625rem 0 0.375rem; color: var(--qr-on-primary); font-size: 1.25rem; }
.qr-beta p { margin: 0; font-size: 0.875rem; }
.qr-beta .qr-badge { background: var(--qr-on-primary); color: var(--qr-primary); }
.qr-beta a { display: inline-flex; margin-top: 0.875rem; color: var(--qr-on-primary); font-weight: 600; text-decoration: underline; }
.qr-thumb { display: block; width: 2.5rem; height: 2.5rem; padding: 2px; border-radius: 8px; background: var(--qr-paper); }
.qr-thumb img, .qr-thumb svg { display: block; width: 100%; height: 100%; object-fit: contain; }
.qr-empty { display: grid; justify-items: center; gap: 0.5rem; padding: 2.5rem 1rem; text-align: center; }
.qr-empty p { max-width: 24rem; margin: 0; color: var(--qr-text-2); }
.qr-empty__icon { width: 2.5rem; height: 2.5rem; color: var(--qr-primary); }
@media (max-width: 1199.98px) { .qr-split { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 767.98px) { .qr-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* Scan analytics (same dashboard the landing page shows) */
.qr-stats-head { align-items: center; }
.qr-stats-head__id { display: flex; align-items: center; gap: 1rem; min-width: 0; flex: 1 1 28rem; }
.qr-stats-head__thumb { display: block; flex: none; width: 4.5rem; height: 4.5rem; padding: 4px; border-radius: 12px; background: var(--qr-paper); }
.qr-stats-head__thumb img { display: block; width: 100%; height: 100%; object-fit: contain; }
.qr-stats-head h1 { margin: 0; overflow-wrap: anywhere; }
.qr-stats-head__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem; }
.qr-back { display: inline-flex; align-items: center; gap: 0.375rem; margin-bottom: 0.375rem; color: var(--qr-text-2); font-size: 0.8125rem; text-decoration: none; }
.qr-back:hover { color: var(--qr-text); text-decoration: none; }
.qr-back .qr-i { width: 1rem; height: 1rem; transform: scaleX(-1); }
.qr-stats-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 0.75rem; margin-top: 0.625rem; color: var(--qr-text-2); font-size: 0.8125rem; }
.qr-stats-meta__dest { display: inline-flex; align-items: center; gap: 0.25rem; min-width: 0; max-width: 100%; color: var(--qr-text-2); font-family: var(--qr-font-mono); font-size: 0.75rem; }
.qr-stats-meta__dest > span:first-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.qr-stats-meta__dest .qr-i { width: 0.875rem; height: 0.875rem; }
.qr-stats-meta__dest:hover { color: var(--qr-link); }
.qr-seg { display: inline-flex; gap: 0.25rem; padding: 0.1875rem; border: 1px solid var(--qr-border); border-radius: 8px; background: var(--qr-bg); }
.qr-seg a { display: inline-flex; align-items: center; min-height: 1.875rem; padding: 0 0.75rem; border-radius: 6px; color: var(--qr-text-2); font-size: 0.8125rem; font-weight: 500; white-space: nowrap; text-decoration: none; transition: color 140ms, background-color 140ms; }
.qr-seg a:hover { color: var(--qr-text); text-decoration: none; }
.qr-seg a[aria-current="page"] { background: var(--qr-surface-2); color: var(--qr-text); box-shadow: 0 0 0 1px var(--qr-border); }
.qr-shortlink { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; margin-bottom: 1rem; color: var(--qr-text-2); font-size: 0.8125rem; }
.qr-shortlink code { padding: 0.25rem 0.5rem; border: 1px solid var(--qr-border); border-radius: 6px; background: var(--qr-surface); color: var(--qr-text); font: 500 0.75rem/1.2 var(--qr-font-mono); overflow-wrap: anywhere; }
.qr-copy { display: inline-flex; align-items: center; justify-content: center; width: 1.75rem; height: 1.75rem; padding: 0; border: 1px solid var(--qr-border); border-radius: 6px; background: var(--qr-surface); color: var(--qr-text-2); cursor: pointer; transition: color 140ms, border-color 140ms; }
.qr-copy:hover { border-color: var(--qr-border-strong); color: var(--qr-text); }
.qr-copy:focus-visible { outline: 2px solid var(--qr-focus); outline-offset: 2px; }
.qr-copy.is-copied { border-color: var(--qr-success); color: var(--qr-success); }
.qr-copy .qr-i { width: 0.9375rem; height: 0.9375rem; }

.qr-dash { display: grid; gap: 1px; overflow: hidden; border: 1px solid var(--qr-border); border-radius: 14px; background: var(--qr-border); }
.qr-dash__kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; margin: 0; }
.qr-dash__kpi { min-width: 0; padding: 1.125rem 1.25rem; background: var(--qr-surface); }
.qr-dash__kpi dt { color: var(--qr-text-2); font-size: 0.8125rem; font-weight: 400; }
.qr-dash__kpi .qr-dash__value { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.25rem 0.5rem; margin: 0.5rem 0 0; color: var(--qr-text); font: 600 1.625rem/1.1 var(--qr-font-display); letter-spacing: -0.02em; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.qr-dash__note { color: var(--qr-text-2); font: 500 0.75rem/1 var(--qr-font-mono); letter-spacing: 0; }
.qr-dash__hint { margin: 0.5rem 0 0; color: var(--qr-text-2); font-size: 0.75rem; }
.qr-delta { font: 600 0.75rem/1 var(--qr-font-mono); letter-spacing: 0; }
.qr-delta--up { color: var(--qr-success); }
.qr-delta--down { color: var(--qr-error); }
.qr-delta--flat { color: var(--qr-text-2); }
.qr-dash__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; }
.qr-dash__panel { min-width: 0; margin: 0; padding: 1.25rem; background: var(--qr-surface); }
.qr-dash__panel--chart { grid-column: span 2; grid-row: span 2; }
.qr-dash__panel--wide { grid-column: span 2; }
.qr-dash__panel--feed { grid-column: 1 / -1; }
.qr-dash__label { display: flex; align-items: center; gap: 0.5rem; margin: 0 0 1rem; color: var(--qr-text-2); font: 500 0.6875rem/1.2 var(--qr-font-mono); letter-spacing: 0.08em; text-transform: uppercase; }
.qr-dash__label > span:not(.qr-live-dot) { margin-left: auto; letter-spacing: 0.02em; text-transform: none; }
.qr-dash__empty { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 1.75rem; padding: 2rem; background: var(--qr-surface); }
.qr-dash__empty p { max-width: 34rem; margin: 0; color: var(--qr-text-2); }
.qr-dash__empty--range { grid-template-columns: minmax(0, 1fr); text-align: center; justify-items: center; }
.qr-dash__empty--range p { margin-inline: auto; }
.qr-dash__empty-qr { display: block; width: 9rem; height: 9rem; padding: 6px; border-radius: 12px; background: var(--qr-paper); }
.qr-dash__empty-qr img { display: block; width: 100%; height: 100%; object-fit: contain; }

.qr-chart { position: relative; padding-left: 2.5rem; }
.qr-chart__grid { position: absolute; inset: 0 0 1.625rem 0; display: flex; flex-direction: column; justify-content: space-between; pointer-events: none; }
.qr-chart__grid span { position: relative; height: 0; color: var(--qr-text-2); font: 500 0.625rem/0 var(--qr-font-mono); }
.qr-chart__grid span::after { content: ""; position: absolute; left: 2.5rem; right: 0; top: 0; border-top: 1px dashed var(--qr-border); }
.qr-chart__svg { display: block; width: 100%; height: clamp(12rem, 9rem + 8vw, 17rem); overflow: visible; }
.qr-chart__area { fill: var(--qr-primary-muted); }
.qr-chart__line { fill: none; stroke: var(--qr-chart-1); stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.qr-chart__hit { fill: var(--qr-text); fill-opacity: 0; }
.qr-chart__hit:hover { fill-opacity: 0.06; }
.qr-chart__x { position: relative; height: 0.625rem; margin-top: 0.75rem; color: var(--qr-text-2); font: 500 0.625rem/1 var(--qr-font-mono); }
.qr-chart__x span { position: absolute; top: 0; transform: translateX(-50%); white-space: nowrap; }
.qr-chart__x span.is-start { transform: none; }
.qr-chart__x span.is-end { transform: translateX(-100%); }

.qr-c1 { background: var(--qr-chart-1); }
.qr-c2 { background: var(--qr-chart-2); }
.qr-c3 { background: var(--qr-chart-3); }
.qr-c4 { background: var(--qr-chart-4); }
.qr-c5 { background: var(--qr-chart-5); }
.qr-stack { display: flex; gap: 2px; height: 0.75rem; overflow: hidden; border-radius: 4px; }
.qr-stack span { flex: 0 1 0; height: 100%; }
.qr-legend { display: grid; gap: 0.625rem; margin: 1.125rem 0 0; padding: 0; list-style: none; font-size: 0.8125rem; }
.qr-legend li { display: flex; align-items: center; gap: 0.5rem; }
.qr-legend small { margin-left: auto; color: var(--qr-text-2); font: 500 0.6875rem/1 var(--qr-font-mono); }
.qr-legend b { min-width: 2.75rem; font: 600 0.8125rem/1 var(--qr-font-mono); text-align: right; }
.qr-key { flex: none; width: 0.625rem; height: 0.625rem; border-radius: 2px; }

.qr-bars { display: grid; gap: 0.625rem; margin: 0; padding: 0; list-style: none; }
.qr-bars li { display: grid; grid-template-columns: minmax(0, 9.5rem) minmax(0, 1fr) 2.75rem; align-items: center; gap: 0.625rem; font-size: 0.8125rem; }
.qr-bars__name { display: flex; align-items: center; gap: 0.5rem; min-width: 0; }
.qr-bars__name > span:last-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.qr-bars__track { height: 0.5rem; overflow: hidden; border-radius: 3px; background: var(--qr-surface-2); }
.qr-bars__fill { display: block; height: 100%; border-radius: 3px; background: var(--qr-chart-2); }
.qr-bars--orange .qr-bars__fill { background: var(--qr-chart-1); }
.qr-bars b { font: 600 0.75rem/1 var(--qr-font-mono); text-align: right; }
.qr-bars__other { color: var(--qr-text-2); }
.qr-bars li.qr-bars__other .qr-bars__fill { background: var(--qr-border-strong); }
.qr-dash .flag { flex: none; border-radius: 2px; box-shadow: 0 0 0 1px var(--qr-border); }

.qr-hours { display: grid; grid-template-columns: repeat(24, minmax(0, 1fr)); align-items: end; gap: 3px; height: 7.5rem; margin: 0; padding: 0; list-style: none; }
.qr-hours li { display: flex; align-items: flex-end; height: 100%; }
.qr-hours__bar { display: block; width: 100%; border-radius: 2px 2px 0 0; background: var(--qr-surface-2); }
.qr-hours__bar.has-scans { background: var(--qr-chart-2); }
.qr-hours__bar.is-peak { background: var(--qr-chart-1); }
.qr-hours__axis { display: flex; justify-content: space-between; margin-top: 0.625rem; color: var(--qr-text-2); font: 500 0.625rem/1 var(--qr-font-mono); }
.qr-hours__note { margin: 1rem 0 0; color: var(--qr-text-2); font-size: 0.8125rem; }
.qr-hours__note b { color: var(--qr-text); font-weight: 600; }

.qr-live-dot { display: inline-block; flex: none; width: 0.5rem; height: 0.5rem; border-radius: 2px; background: var(--qr-success); }
.qr-feed { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.75rem; margin: 0; padding: 0; list-style: none; }
.qr-feed li { display: grid; gap: 0.3125rem; min-width: 0; padding: 0.75rem 0.875rem; border: 1px solid var(--qr-border); border-radius: 10px; background: var(--qr-bg); font-size: 0.8125rem; }
.qr-feed li:first-child { border-color: var(--qr-primary); }
.qr-feed__where { display: flex; align-items: center; gap: 0.5rem; min-width: 0; font-weight: 600; }
.qr-feed__where > span:last-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.qr-feed__what { overflow: hidden; color: var(--qr-text-2); font-size: 0.75rem; text-overflow: ellipsis; white-space: nowrap; }
.qr-feed__when { color: var(--qr-text-2); font: 500 0.6875rem/1 var(--qr-font-mono); }
.qr-feed li:first-child .qr-feed__when { color: var(--qr-primary); }

@media (max-width: 1199.98px) {
  .qr-dash__kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .qr-feed { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 991.98px) {
  .qr-dash__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .qr-dash__panel--chart, .qr-dash__panel--wide { grid-column: 1 / -1; grid-row: auto; }
}
@media (max-width: 575.98px) {
  .qr-dash__grid, .qr-dash__kpis, .qr-feed { grid-template-columns: minmax(0, 1fr); }
  .qr-dash__empty { grid-template-columns: minmax(0, 1fr); padding: 1.5rem; }
  .qr-stats-head__thumb { width: 3.5rem; height: 3.5rem; }
  .qr-hours { gap: 2px; }
}

/* Download-format buttons in the QR, EPC and barcode editors: one primary (PNG), the rest neutral */
.btn[onclick^="downloadQR"], .btn[onclick^="downloadBarCode"] {
  --tblr-btn-color: var(--qr-text); --tblr-btn-bg: var(--qr-surface-2); --tblr-btn-border-color: var(--qr-border);
  --tblr-btn-hover-color: var(--qr-text); --tblr-btn-hover-bg: var(--qr-surface-2); --tblr-btn-hover-border-color: var(--qr-border-strong);
  --tblr-btn-active-bg: var(--qr-surface-2); --tblr-btn-active-color: var(--qr-text);
  font-family: var(--qr-font-mono); font-size: 0.8125rem; letter-spacing: 0.02em;
}
.btn[onclick="downloadQR('png')"], .btn[onclick="downloadBarCode('png')"] {
  --tblr-btn-color: var(--qr-on-primary); --tblr-btn-bg: var(--qr-primary); --tblr-btn-border-color: var(--qr-primary);
  --tblr-btn-hover-color: var(--qr-on-primary); --tblr-btn-hover-bg: var(--qr-primary-hover); --tblr-btn-hover-border-color: var(--qr-primary-hover);
  --tblr-btn-active-bg: var(--qr-primary-hover); --tblr-btn-active-color: var(--qr-on-primary);
}

.row:has(.btn[onclick^="downloadQR"]) > .col-xl-2.font-weight-semibold,
.row:has(.btn[onclick^="downloadBarCode"]) > .col-xl-2.font-weight-semibold {
  flex: 0 0 100%; width: 100%; max-width: 100%; margin-bottom: 0 !important;
  color: var(--qr-text-2); font: 500 0.6875rem/1.2 var(--qr-font-mono); letter-spacing: 0.08em; text-transform: uppercase;
}

/* QR previews always sit on paper so they stay scannable in dark mode */
.qr-code-preview, #qrcode, #qr-preview, .qrcode-preview, .qr-preview, .card .qrcode img { background: var(--qr-paper); border-radius: 12px; }

/* Guest pages (auth, contact, legal, generator) */
.qr-guest { min-height: 100vh; display: flex; flex-direction: column; background: var(--qr-bg); color: var(--qr-text); }
.qr-guest__pattern { position: fixed; inset: 0; width: 100%; height: 100%; color: var(--qr-surface); pointer-events: none; }
.qr-guest__head { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1.25rem clamp(1rem, 4vw, 2rem); }
.qr-guest__head a { color: var(--qr-text); }
.qr-guest__main { position: relative; flex: 1; display: grid; place-items: center; padding: 1rem clamp(1rem, 4vw, 2rem) 3rem; }
.qr-guest__foot { position: relative; display: flex; flex-wrap: wrap; justify-content: center; gap: 0.5rem 1.25rem; padding: 1.5rem 1rem 2rem; color: var(--qr-text-2); font-size: 0.8125rem; }
.qr-guest__foot a { color: var(--qr-text-2); text-decoration: none; }
.qr-guest__foot a:hover { color: var(--qr-text); text-decoration: underline; }
.qr-auth { width: 100%; max-width: 26rem; }
.qr-auth__card { padding: clamp(1.5rem, 1rem + 2vw, 2.25rem); border: 1px solid var(--qr-border); border-radius: 20px; background: var(--qr-surface); box-shadow: var(--qr-shadow-pop); }
.qr-auth__eyebrow { display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.375rem 0.75rem 0.375rem 0.625rem; border: 1px solid var(--qr-border); border-radius: 999px; background: var(--qr-bg); color: var(--qr-text-2); font: 500 0.75rem/1.2 var(--qr-font-mono); }
.qr-auth__eyebrow i { width: 0.5rem; height: 0.5rem; border-radius: 2px; background: var(--qr-primary); }
.qr-auth h1 { margin: 1rem 0 0.375rem; font-size: 1.75rem; line-height: 1.1; }
.qr-auth__lead { margin: 0 0 1.5rem; color: var(--qr-text-2); }
.qr-auth .form-label { display: flex; justify-content: space-between; align-items: baseline; gap: 0.5rem; }
.qr-auth .form-label a { font-weight: 500; font-size: 0.8125rem; text-decoration: none; }
.qr-auth .mb-3 { margin-bottom: 1rem !important; }
.qr-auth .btn-primary { width: 100%; min-height: 2.875rem; font-size: 0.9375rem; }
.qr-auth__alt { margin-top: 1.25rem; color: var(--qr-text-2); font-size: 0.875rem; text-align: center; }
.qr-auth__alt a { font-weight: 600; text-decoration: none; }
.qr-auth__divider { display: flex; align-items: center; gap: 0.75rem; margin: 1.25rem 0; color: var(--qr-text-2); font: 500 0.6875rem/1 var(--qr-font-mono); letter-spacing: 0.08em; text-transform: uppercase; }
.qr-auth__divider::before, .qr-auth__divider::after { content: ""; flex: 1; border-top: 1px solid var(--qr-border); }
.qr-auth__google { display: flex; align-items: center; justify-content: center; gap: 0.625rem; width: 100%; min-height: 2.75rem; border: 1px solid var(--qr-border); border-radius: 10px; background: var(--qr-bg); color: var(--qr-text); font-weight: 600; text-decoration: none; }
.qr-auth__google:hover { border-color: var(--qr-border-strong); color: var(--qr-text); text-decoration: none; }
.qr-auth__terms { margin-top: 1rem; color: var(--qr-text-2); font-size: 0.75rem; text-align: center; }
.qr-pw { position: relative; }
.qr-pw .form-control { padding-right: 4.25rem; }
.qr-pw button { position: absolute; top: 50%; right: 0.375rem; transform: translateY(-50%); min-height: 2rem; padding: 0 0.625rem; border: 0; border-radius: 8px; background: transparent; color: var(--qr-text-2); font-size: 0.75rem; font-weight: 600; cursor: pointer; }
.qr-pw button:hover { background: var(--qr-surface-2); color: var(--qr-text); }
.qr-doc { width: 100%; max-width: 48rem; padding: clamp(1.5rem, 1rem + 2vw, 2.5rem); border: 1px solid var(--qr-border); border-radius: 20px; background: var(--qr-surface); }
.qr-doc h1 { margin: 0.75rem 0 1rem; font-size: clamp(1.75rem, 1.4rem + 1.2vw, 2.5rem); }
.qr-doc h2, .qr-doc h3 { margin-top: 1.75rem; }
.qr-doc p, .qr-doc li { color: var(--qr-text-2); }
.qr-doc p, .qr-doc ol, .qr-doc ul { margin: 0 0 1rem; line-height: 1.7; }
.qr-doc ol, .qr-doc ul { padding-left: 1.25rem; }
.qr-doc li + li { margin-top: 0.375rem; }
.qr-doc__lead { color: var(--qr-text) !important; font-size: 1.0625rem; }
.qr-doc__meta { padding-top: 1rem; border-top: 1px solid var(--qr-border); font: 500 0.75rem/1.5 var(--qr-font-mono); }
.qr-doc__meta + p { margin-top: 1.25rem; }
.qr-doc > p:last-child.qr-doc__meta { margin: 1.5rem 0 0; }
.qr-doc--html img { max-width: 100%; height: auto; border-radius: 12px; }
.qr-doc--html a { text-decoration: underline; }
.qr-doc--html :is(h2, h3, h4) { margin: 1.75rem 0 0.75rem; }

.qr-contact { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 27rem); gap: clamp(1.5rem, 5vw, 4.5rem); align-items: start; width: 100%; max-width: 66rem; }
.qr-contact__intro h1 { margin: 0.75rem 0 1rem; font-size: clamp(2rem, 1.5rem + 2vw, 3rem); line-height: 1.05; }
.qr-contact__lead { max-width: 32rem; margin: 0; color: var(--qr-text-2); font-size: 1.0625rem; }
.qr-contact__list { display: grid; gap: 1px; margin: 2rem 0 0; overflow: hidden; border: 1px solid var(--qr-border); border-radius: 14px; background: var(--qr-border); }
.qr-contact__list > div { display: grid; grid-template-columns: 7rem minmax(0, 1fr); gap: 1rem; padding: 0.875rem 1.125rem; background: var(--qr-surface); }
.qr-contact__list dt { color: var(--qr-text-2); font: 500 0.6875rem/1.6 var(--qr-font-mono); letter-spacing: 0.08em; text-transform: uppercase; }
.qr-contact__list dd { margin: 0; overflow-wrap: anywhere; }
.qr-contact__socials { display: flex; flex-wrap: wrap; gap: 0.25rem 1rem; }
.qr-contact__card { border-radius: 20px; box-shadow: var(--qr-shadow-pop); }
.qr-contact__card .card-body { padding: clamp(1.25rem, 1rem + 1.5vw, 2rem); }
.qr-contact__card h2 { margin: 0 0 1.25rem; }
.qr-hp { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
@media (max-width: 899.98px) {
  .qr-contact { grid-template-columns: minmax(0, 1fr); max-width: 34rem; }
}
.cookie-consent, .js-cookie-consent { position: fixed; left: 1rem; right: 1rem; bottom: 1rem; z-index: 1060; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.75rem; max-width: 40rem; margin-inline: auto; padding: 0.875rem 1rem; border: 1px solid var(--qr-border); border-radius: 14px; background: var(--qr-surface); color: var(--qr-text); box-shadow: var(--qr-shadow-pop); font-size: 0.875rem; }
.cookie-consent button, .js-cookie-consent-agree { min-height: 2.25rem; padding: 0 0.875rem; border: 0; border-radius: 10px; background: var(--qr-primary); color: var(--qr-on-primary); font-weight: 600; cursor: pointer; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
}
.qr-error__actions { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.qr-error__actions .btn-primary { width: auto; flex: 1 1 auto; }

/* Plans (mirrors the landing's pricing cards) */
.qr-badge--quiet { background: var(--qr-surface-2); color: var(--qr-text-2); }
.qr-plans-note { display: flex; align-items: center; gap: 0.75rem; margin-bottom: 1.25rem; padding: 0.875rem 1rem; border: 1px solid var(--qr-border); border-radius: 12px; background: var(--qr-surface); }
.qr-plans-note p { margin: 0; color: var(--qr-text-2); font-size: 0.875rem; }
.qr-plans { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 17rem), 1fr)); gap: 1rem; align-items: start; }
.qr-plan-card { display: grid; gap: 1rem; padding: 1.5rem; border: 1px solid var(--qr-border); border-radius: 16px; background: var(--qr-surface); }
.qr-plan-card.is-featured { border-color: var(--qr-border-strong); }
.qr-plan-card.is-current { border-color: var(--qr-primary); box-shadow: 0 0 0 1px var(--qr-primary); }
.qr-plan-card__head { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; }
.qr-plan-card__head h2 { margin: 0; font-size: 1.25rem; }
.qr-plan-card__desc { margin: -0.5rem 0 0; color: var(--qr-text-2); font-size: 0.875rem; }
.qr-plan-card__price { display: flex; align-items: baseline; gap: 0.375rem; }
.qr-plan-card__price b { font: 600 2.5rem/1 var(--qr-font-display); letter-spacing: -0.03em; }
.qr-plan-card__price span { color: var(--qr-text-2); font-size: 0.875rem; }
.qr-plan-card__then { margin: -0.625rem 0 0; color: var(--qr-text-2); font: 500 0.75rem/1.4 var(--qr-font-mono); }
.qr-plan-card__features { display: grid; gap: 0.625rem; margin: 0.25rem 0 0; padding: 1rem 0 0; border-top: 1px solid var(--qr-border); list-style: none; font-size: 0.875rem; }
.qr-plan-card__features li { display: flex; align-items: center; gap: 0.625rem; }
.qr-plan-card__features .qr-i { width: 1rem; height: 1rem; color: var(--qr-success); }
.qr-plan-card__features li.is-off { color: var(--qr-text-2); text-decoration: line-through; text-decoration-color: var(--qr-border-strong); }
.qr-plan-card__features li.is-off .qr-i { color: var(--qr-text-2); }
.qr-plan-card__note { margin: 0; padding: 0.625rem 0.75rem; border-radius: 10px; background: var(--qr-surface-2); color: var(--qr-text-2); font-size: 0.8125rem; }
.qr-plans-foot { margin: 1.25rem 0 0; color: var(--qr-text-2); font-size: 0.8125rem; }

/* Legal documents */
.qr-legal { max-width: 52rem; }
.qr-legal h2 { margin: 2.25rem 0 0.75rem; font-size: 1.25rem; scroll-margin-top: 1.5rem; }
.qr-legal h3 { margin: 1.5rem 0 0.5rem; font-size: 1rem; }
.qr-legal__toc { margin: 1.5rem 0 0.5rem; padding: 1rem 1.25rem; border: 1px solid var(--qr-border); border-radius: 12px; background: var(--qr-bg); }
.qr-legal__toc p { margin: 0 0 0.625rem; color: var(--qr-text-2); font: 500 0.6875rem/1.2 var(--qr-font-mono); letter-spacing: 0.08em; text-transform: uppercase; }
.qr-legal__toc ol { columns: 2 14rem; column-gap: 2rem; margin: 0; padding-left: 1.25rem; font-size: 0.875rem; }
.qr-legal__toc li { break-inside: avoid; margin: 0 0 0.375rem; color: var(--qr-text-2); }
.qr-legal__toc a { text-decoration: none; }
.qr-legal__toc a:hover { text-decoration: underline; }
.qr-doc p a, .qr-doc li a, .qr-contact__lead a { text-decoration: underline; text-decoration-thickness: 1px; }
.qr-legal__toc li a { text-decoration: none; }

/* Tinted status badges and the upload drop zone, readable in both themes */
.bg-success-lt, .bg-green-lt { background: var(--qr-success-bg) !important; color: var(--qr-success) !important; }
.bg-danger-lt, .bg-red-lt { background: var(--qr-error-bg) !important; color: var(--qr-error) !important; }
.bg-warning-lt, .bg-yellow-lt, .bg-orange-lt { background: var(--qr-warning-bg) !important; color: var(--qr-warning) !important; }
.bg-info-lt, .bg-azure-lt, .bg-blue-lt { background: var(--qr-info-bg) !important; color: var(--qr-info) !important; }
.bg-secondary-lt { background: var(--qr-surface-2) !important; color: var(--qr-text-2) !important; }
.qr-app .dropzone { border: 2px dashed var(--qr-border-strong) !important; border-radius: 14px !important; background: var(--qr-surface-2) !important; color: var(--qr-text); }
.dropzone .dz-message, .dropzone .dz-message * { color: var(--qr-text) !important; }