/* accessUSA night palette. Layout, live screen pixels and input geometry stay unchanged. */
:root,
.dashboard-theme {
  color-scheme: dark;
  --bg: #071224;
  --panel: #101d33;
  --panel-2: #14243d;
  --line: #263a58;
  --text: #eef4ff;
  --muted: #a2b4cf;
  --accent: #8bb5ff;
  --accent-dark: #172e52;
  --accent-action: #2864ea;
  --navy: #081329;
  --red: #ee6682;
  --danger: #ff9aab;
  --warning: #f1cd83;
  --success: #75ddaf;
}

body,
.dashboard-theme {
  background: radial-gradient(ellipse at 53% 0, #11233d 0, #0b192d 36%, #071224 78%);
  background-color: #071224;
  color: var(--text);
}

::selection { background: #365fa3; color: #fff; }
.muted, .legend, .local-note { color: var(--muted); }
.eyebrow { color: #86b0ff; }
code, .link-button, .workspace-label a, .muted a { color: #9fc2ff; }
.link-button:hover, .muted a:hover { color: #c8ddff; }
.status-dot, .dashboard-theme .status-dot { background: #58d79b; box-shadow: 0 0 0 3px rgba(65,194,130,.09); }

/* Shared form controls and account surfaces, including sign-in and error pages. */
.button,
.dashboard-theme .button {
  border-color: #344b6e;
  background: #172944;
  color: #e1ebfc;
  box-shadow: 0 3px 10px rgba(0,0,0,.10);
}
.button:hover,
.dashboard-theme .button:hover {
  border-color: #5978a6;
  background: #213858;
  color: #fff;
}
.button.primary,
.dashboard-theme .button.primary {
  border-color: #3e7cff;
  background: linear-gradient(110deg, #2c69ed, #225ad8);
  background-color: #2864ea;
  color: #fff;
  box-shadow: inset 0 1px rgba(255,255,255,.1), 0 5px 15px rgba(8,47,132,.24);
}
.button.primary:hover,
.dashboard-theme .button.primary:hover {
  border-color: #6697ff;
  background: linear-gradient(110deg, #316aec, #2965e7);
  background-color: #2965e7;
  color: #fff;
}
.button.ghost { background: transparent; }
button:focus-visible, a:focus-visible,
.dashboard-theme .button:focus-visible,
.dashboard-theme a:focus-visible {
  outline-color: #a0c4ff;
}
input, select {
  border-color: #344966;
  background: #0b182c;
  color: #eff5ff;
}
input::placeholder { color: #94a8c7; }
input:focus, select:focus {
  border-color: #84b3ff;
  box-shadow: 0 0 0 3px rgba(77,137,244,.21);
}
input[type="checkbox"] { accent-color: #3d7afb; }
input:autofill {
  background: #132640;
  color: #eff5ff;
}
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus {
  -webkit-text-fill-color: #eff5ff;
  caret-color: #eff5ff;
  box-shadow: 0 0 0 1000px #132640 inset;
}
input:-webkit-autofill:focus { outline: 2px solid #84b3ff; outline-offset: -2px; }
.panel,
.dashboard-theme .panel {
  border-color: #263a57;
  background: linear-gradient(125deg, #122039, #0f1c31);
  background-color: #101d33;
  box-shadow: 0 7px 24px rgba(0,0,0,.12), inset 0 1px rgba(183,209,255,.035);
}
.user-list > div { background: #162640; }
.avatar { border-color: #304b72; background: #1a3458; color: #9cc3ff; }
.audit-list > div { border-color: #263851; }
.audit-list time, .credential-note { color: #a2b4cf; }
.role-pill { border-color: #36527c; background: #1a3051; color: #bbd5ff; }
.security-banner { border-color: #665538; background: #2b281f; color: #f1cf8b; }
.flash.success { border-color: #295c4b; background: #142f2a; color: #98e5bf; }
.flash.error { border-color: #704154; background: #342332; color: #ffc0cb; }

/* Navigation keeps the supplied logo artwork and its existing blend untouched. */
.topbar,
.dashboard-theme .topbar {
  border-bottom-color: #293c5b;
  background: linear-gradient(113deg, #102b50 0, #08162e 39%, #0e1b35 76%, #291a34 100%);
  background-color: #081329;
  color: #f5f8ff;
}
.topbar .role-pill,
.dashboard-theme .topbar .role-pill {
  border-color: #365178;
  background: linear-gradient(130deg, #193456, #132741);
  background-color: #132741;
  color: #e5efff;
}
.topbar .button.ghost,
.dashboard-theme .topbar .button.ghost {
  border-color: #586f92;
  background: rgba(12,28,50,.86);
  color: #eef4ff;
}
.topbar .button.ghost:hover,
.dashboard-theme .topbar .button.ghost:hover {
  border-color: #8ba8d3;
  background: #203857;
}

/* The public URL is removed from the template; keep useful USB/refresh controls. */
.dashboard-theme .workspace-strip {
  border-color: #2b4161;
  background: linear-gradient(110deg, rgba(21,39,65,.92), rgba(16,31,53,.92));
  background-color: #101d33;
  box-shadow: 0 6px 20px rgba(0,0,0,.09), inset 0 1px rgba(175,204,255,.045);
}
.dashboard-theme .workspace-actions {
  width: 100%;
  justify-content: space-between;
}
.dashboard-theme .workspace-actions .legend {
  display: flex;
  color: #bdcee8;
}
.dashboard-theme .refresh-button {
  border-color: #3a5378;
  background: #1b3152;
  color: #c5dcff;
  box-shadow: 0 3px 10px rgba(0,0,0,.1);
}
.dashboard-theme .refresh-button:hover { background: #254165; border-color: #6689bd; }
.dashboard-theme .board-hero::before {
  background-image: url("../images/accessusa-liberty-night-v1.png");
  background-size: contain;
  background-position: right center;
  opacity: .9;
}
.dashboard-theme .board-hero .eyebrow { color: #8ab4ff; }
.dashboard-theme .board-hero h1 { color: #f3f7ff; }
.dashboard-theme .board-hero .muted { color: #b3c6e3; }
.dashboard-theme .hero-slogan { color: #a7bfdf; }
.dashboard-theme .hero-slogan::after { background: linear-gradient(90deg, #5b96ff, #d7e5ff 49%, #e66986 72%); }

/* Desktop panorama spans the whole workspace, not a 450px right-hand thumbnail.
   The new artwork places its complete skyline in a crop-safe central band.
   Uniform width scaling crops only spare sky/water, never stretches the statue. */
@media (min-width: 961px) {
  .dashboard-theme .board-hero { min-height: clamp(180px, 14.6vw, 232px); }
  .dashboard-theme .board-hero::before {
    z-index: -2;
    inset: 0;
    width: auto;
    background-image: url("../images/accessusa-liberty-panorama-v1.png");
    background-size: 100% auto;
    background-position: center 55%;
    opacity: .95;
    -webkit-mask-image: none;
    mask-image: none;
  }
  .dashboard-theme .board-hero::after {
    position: absolute;
    z-index: -1;
    inset: 0;
    content: "";
    background: linear-gradient(90deg, rgba(7,18,36,.78), rgba(7,18,36,.6) 28%, rgba(7,18,36,.12) 57%, transparent 72%, rgba(7,18,36,.5));
    pointer-events: none;
  }
  .dashboard-theme .hero-copy { text-shadow: 0 2px 6px rgba(7,18,36,.7); }
}

/* Device cards: clearly separated dark surfaces with readable status colors. */
.dashboard-theme .assignment-card,
.dashboard-theme .device-info-card,
.dashboard-theme .remote-panel,
.dashboard-theme .controls {
  border-color: #2a3d5c;
  background: linear-gradient(125deg, #13223b, #101d32);
  background-color: #101d33;
  box-shadow: 0 7px 24px rgba(0,0,0,.13), inset 0 1px rgba(178,206,255,.04);
}
.dashboard-theme .card-heading,
.dashboard-theme .card-heading h2,
.dashboard-theme .card-heading h3,
.dashboard-theme .access-members legend,
.dashboard-theme .device-heading h2 { color: #f0f5ff; }
.dashboard-theme .heading-icon {
  color: #8bb9ff;
  background: linear-gradient(135deg, #1d3b66, #172e50);
  background-color: #172e50;
}
.dashboard-theme .access-members label {
  background: linear-gradient(135deg, #1c3150, #182b47);
  background-color: #182b47;
  color: #dce8fb;
}
.dashboard-theme .access-members label:has(input:checked) {
  background: linear-gradient(135deg, #203d66, #1c3355);
  background-color: #1c3355;
}
.dashboard-theme .device-heading p,
.dashboard-theme .recovery-info,
.dashboard-theme .status-line,
.dashboard-theme .remote-description,
.dashboard-theme .remote-panel .gesture-help,
.dashboard-theme .text-options label { color: #aec1de; }
.dashboard-theme .recovery-info,
.dashboard-theme .remote-panel .gesture-help { border-color: #30425f; }
.dashboard-theme .recovery-info [data-profile-warning]:not(:empty) { color: #f1cd83; }
.dashboard-theme .status-line > .icon { color: #93add4; }
.dashboard-theme .profile-line > .icon { color: #8bb9ff; }
.dashboard-theme .control-status > .icon { color: #ef87a0; }
.device-status { background: #393020; color: #f5d398; }
.status-ready,
.dashboard-theme .status-ready { background: #143c30; color: #8aebba; }
.status-offline, .status-error,
.dashboard-theme .status-offline,
.dashboard-theme .status-error { background: #3d2333; color: #ffadbd; }
.status-maintenance { background: #393020; color: #f5d398; }
.dashboard-theme .device-footer { border-color: #293c58; background: transparent; color: #a0b7d8; }
.dashboard-theme .info-layout h3 { color: #d0e0f8; }
.dashboard-theme [data-cancel-queue] {
  border-color: #3d5475;
  background: linear-gradient(135deg, #1a2d49, #15263f);
  background-color: #15263f;
  color: #c2d2ea;
  box-shadow: 0 4px 13px rgba(0,0,0,.09);
}
.dashboard-theme [data-cancel-queue]:hover { border-color: #6786b4; background: #223a5b; }

/* Only the surroundings change. Never tint, filter, resize or overlay the live image. */
.dashboard-theme .phone-stage {
  border-color: #304867;
  background: radial-gradient(ellipse at 26% 22%, #18345a, transparent 67%), linear-gradient(133deg, #122641, #0d1d34 58%, #18243f);
  background-color: #12233c;
  box-shadow: inset 0 1px rgba(147,184,234,.1), 0 9px 28px rgba(0,0,0,.18);
}
.dashboard-theme .phone-stage::before {
  background: linear-gradient(153deg, transparent 0 43%, rgba(91,137,203,.06) 43% 52%, transparent 52% 68%, rgba(153,181,223,.055) 68% 71%, rgba(195,79,119,.065) 71% 75%, transparent 75%);
}
.phone-placeholder,
.dashboard-theme .phone-placeholder { border-color: #496080; color: #b6c9e5; }
.phone-placeholder small { color: #a6bad8; }
.phone-glyph, .empty-icon { color: #8eafdc; }
.empty-state { border-color: #3b506f; background: #112038; color: #b2c4dd; }
.empty-state h2 { color: #f0f5ff; }
.video-status { border-color: #65769a; background: rgba(12,24,46,.97); color: #fbe0a3; }

/* Quick actions, text entry and auxiliary keyboard controls. */
.button.control,
.dashboard-theme .button.control {
  border-color: #354d70;
  background: linear-gradient(135deg, #1b304e, #152941);
  background-color: #152941;
  color: #e0ebfb;
  box-shadow: 0 4px 12px rgba(0,0,0,.09);
}
.button.control:hover,
.dashboard-theme .button.control:hover { border-color: #5d7ea9; background: #243e60; color: #fff; }
.dashboard-theme .button.control .icon { color: #8fbdff; }
.dashboard-theme .text-input-wrap { border-color: #304767; background: #12233a; }
.dashboard-theme .text-input-wrap > .icon { color: #92bdff; }
.dashboard-theme .text-control input { border-color: #354d6e; background: #0b192d; color: #eff5ff; }
.dashboard-theme .text-control input::placeholder { color: #9bb1d1; }
.dashboard-theme .text-control input:focus { border-color: #8ab6ff; }
.input-help,
.dashboard-theme .input-help { color: #a2b7d5; }

/* A consistent night sign-in, recovery/error card and footer. */
.login-layout {
  border-color: #2c3e5b;
  background: #101d33;
  box-shadow: 0 22px 64px rgba(0,0,0,.24), inset 0 1px rgba(186,209,244,.045);
}
.login-card { border-color: #304461; background: #101d33; box-shadow: 0 12px 38px rgba(0,0,0,.17); }
.login-layout > .login-card { background: transparent; }
.login-story { background: #070c20; color: #f3f7ff; }
.login-card h1, .login-tagline { color: #f4f7ff; }
.login-card > .muted, .login-story-note { color: #b4c5df; }
.login-kicker { color: #a8c5ee; }
.stack-form label { color: #d2e0f5; }
.login-caption { border-color: #2b3c56; color: #a6bad8; }
.site-footer,
.dashboard-theme .site-footer { border-top-color: #253753; background: #081427; color: #91a8c8; }
.footer-brand { color: #d2e1f8; }
.footer-brand .brand-usa { color: #91bbff; }
.footer-note { color: #a2b4cf; }
.toast { border-color: #59749c; background: #1b304e; color: #f1f6ff; box-shadow: 0 12px 35px rgba(0,0,0,.28); }

@media (max-width: 700px) {
  .dashboard-theme .board-hero::before { opacity: .4; }
}

@media (forced-colors: active) {
  .dashboard-theme .board-hero::before,
  .dashboard-theme .phone-stage::before { background: none; }
  .button, .dashboard-theme .button,
  input, select { border-color: ButtonText; }
}