/* System-controlled theme. Media queries react immediately to OS/browser changes. */
:root {
  color-scheme: light;
  --surface: #fff;
  --surface-soft: #f6f9fb;
  --field-bg: #fff;
  --field-border: #7c92a5;
  --disabled-bg: #edf2f6;
  --muted: #5d7284;
  --nav-bg: #edf8fc;
  --primary-bg: #007da8;
  --primary-ink: #fff;
  --badge-bg: #edf3f7;
  --badge-ink: #526b7e;
  --waiting-bg: #fff6e4;
  --waiting-ink: #84580e;
  --action-bg: #e9f7fc;
  --action-ink: #14688b;
  --closed-bg: #edf8f2;
  --closed-ink: #1c7356;
  --verification-bg: #f1edf8;
  --verification-ink: #6a518c;
  --warning-bg: #fffaf0;
  --warning-ink: #805313;
  --notice-bg: #e9f7f3;
  --notice-border: #a9d6c6;
  --notice-ink: #235c49;
  --danger-bg: #fff0ef;
  --danger-border: #d29ba0;
  --danger-ink: #9c2732;
  --chart-customer: #0d5675;
  --chart-neutral: #8c9eac;
  --chart-grid: #eaf0f4;
}

@media screen and (prefers-color-scheme: dark) {
  :root {
    color-scheme: dark;
    --bg: #101923;
    --surface: #182533;
    --surface-soft: #203243;
    --field-bg: #12202d;
    --field-border: #58748b;
    --disabled-bg: #233340;
    --ink: #e7eef5;
    --muted: #b0bfcd;
    --line: #34495b;
    --navy: #82d6f4;
    --blue: #49c7f2;
    --nav-bg: #20384b;
    --primary-bg: #00779e;
    --badge-bg: #293c4d;
    --badge-ink: #ccdce8;
    --waiting-bg: #40331d;
    --waiting-ink: #ffda90;
    --action-bg: #173c50;
    --action-ink: #a0e2ff;
    --closed-bg: #193e33;
    --closed-ink: #a5ebc8;
    --verification-bg: #352c4a;
    --verification-ink: #d7c3ff;
    --warning-bg: #3a3020;
    --warning-ink: #ffda91;
    --notice-bg: #183b32;
    --notice-border: #437c66;
    --notice-ink: #b6eed5;
    --danger-bg: #432831;
    --danger-border: #a45f70;
    --danger-ink: #ffc6cc;
    --chart-customer: #b5a0f0;
    --chart-neutral: #a4b5c4;
    --chart-grid: #304657;
  }
}

body .sidebar, body header, body .card, body .metric, body .button { background: var(--surface); }
.nav-link { background: var(--nav-bg); }
.claim-number { color: var(--navy); }
body input:not([type=checkbox]), body select, body textarea {
  background-color: var(--field-bg);
  border-color: var(--field-border);
  color: var(--ink);
}
body input::placeholder, body textarea::placeholder { color: var(--muted); opacity: 1; }
body input:disabled, body select:disabled, body textarea:disabled, body .field input:disabled {
  background: var(--disabled-bg);
  color: var(--muted);
  opacity: 1;
}
input[type=checkbox], input[type=radio] { accent-color: var(--primary-bg); }
input::file-selector-button {
  color: var(--ink); background: var(--surface-soft);
  border: 1px solid var(--field-border); border-radius: 4px; padding: 5px 9px;
}
body .language-switch select { background-color: transparent; }
option { background: var(--surface); color: var(--ink); }
.field small, .account-role { color: var(--muted); }
.account-role { display: block; }
body th { background: var(--surface-soft); }
.button.primary { color: var(--primary-ink); background: var(--primary-bg); border-color: var(--primary-bg); }
.button.danger { background: var(--danger-bg); border-color: var(--danger-border); color: var(--danger-ink); }
.button.danger:hover { background: var(--danger-bg); border-color: var(--danger-ink); }
.badge { background: var(--badge-bg); color: var(--badge-ink); }
.badge.waiting { background: var(--waiting-bg); color: var(--waiting-ink); }
.badge.action, .badge.investigating { background: var(--action-bg); color: var(--action-ink); }
.badge.closed { background: var(--closed-bg); color: var(--closed-ink); }
.badge.verification { background: var(--verification-bg); color: var(--verification-ink); }
.warning strong { color: var(--warning-ink); }
.notice { background: var(--notice-bg); border-color: var(--notice-border); color: var(--notice-ink); }
.notice.error { background: var(--danger-bg); border-color: var(--danger-border); color: var(--danger-ink); }
.errorlist { color: var(--danger-ink); }
.message.internal { background: var(--warning-bg); }
.article-image-placeholder { background: var(--surface-soft); color: var(--muted); }
/* Product drawings, flags and the original white-background logo retain their colours. */
.brand img { background: #fff; border-radius: 7px; padding: 6px; }
body .attachment-thumbnail { background: var(--surface-soft); border-color: var(--line); }
body .stats-track, body .stats-age>div, body .stats-delivery-metrics>div { background: var(--surface-soft); }
body .stats-month-bars { background: repeating-linear-gradient(to top,transparent 0,transparent 49px,var(--chart-grid) 49px,var(--chart-grid) 50px); }
body .stats-column.customer, body .stats-legend .customer:before { background: var(--chart-customer); }
body .stats-column.unclassified, body .stats-legend .unclassified:before { background: var(--chart-neutral); }
:focus-visible { outline: 2px solid var(--navy); outline-offset: 3px; }
@media print {
  :root { color-scheme: light; }
  body, body .card, body .metric, body header { background: #fff; color: #17354b; }
  body a, body .muted, body .help, body th, body td { color: #17354b; }
}

.claim-detail-actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; justify-content: flex-end; }
.claim-share-form { margin: 0; }
body .button.claim-share { background: #b42318; border-color: #b42318; color: #fff; }
body .button.claim-shared { background: #16703c; border-color: #16703c; color: #fff; opacity: 1; cursor: default; }

.claim-close-form #id_claim_accepted { display: flex; gap: 12px; flex-wrap: wrap; margin: 12px 0 24px; }
.claim-close-form #id_claim_accepted label { display: inline-flex; align-items: center; gap: 8px; padding: 10px 22px; border: 1px solid var(--line); border-radius: 7px; cursor: pointer; }
.claim-close-form #id_claim_accepted label:has(input:checked) { background: var(--primary-bg); color: var(--primary-ink); border-color: var(--primary-bg); }
.claim-close-form #id_claim_accepted input { width: auto; margin: 0; }
.badge.answered { background: #e0f2e8; color: #17613a; }