/* FUTURE CEMENT - colour themes for the boards.
   light (the default: nobody meets a black screen first) · dark · high contrast · soft grey.
   Status colours never change between themes and always come with a word or an icon.
   The plant drawing stays a dark control-room screen in every theme. */

/* ---------------- light ---------------- */
.afd[data-theme=light], body.fct-light{--bg:#F3F6F9;--bg2:#FFFFFF;--card:#FFFFFF;--card2:#F2F5F8;--line:#DCE3EA;--line2:#C3CFDB;
  --ink:#12202E;--mute:#4B5D6E;--mute2:#6D7E8F;--gold:#B7860B;--gold2:#8F6800}
body.fct-light{background:#F3F6F9}
.afd[data-theme=light] .afd-chip.ex,.afd[data-theme=light] .afd-editnote,.afd[data-theme=light] .afd-sharebar .res{background:#FFF6D8}
.afd[data-theme=light] .afd-banner.ex{background:#FFF9E6}
.afd[data-theme=light] .afd-banner.err,.afd[data-theme=light] .afd-issues li.error{background:#FDECEA}
.afd[data-theme=light] .afd-issues li.warning{background:#FFF4DB}
.afd[data-theme=light] .afd-kpi,.afd[data-theme=light] .afd-pan{background:var(--card);box-shadow:0 1px 3px rgba(18,32,46,.06)}
.afd[data-theme=light] .afd-kpi.grey,.afd[data-theme=light] .afd-tile{background:repeating-linear-gradient(135deg,#F7F9FB 0 10px,#EEF2F6 10px 20px)}
.afd[data-theme=light] .pill.good{background:#DDF3E7;color:#17784A}
.afd[data-theme=light] .pill.watch{background:#FFF1D6;color:#8A5A00}
.afd[data-theme=light] .pill.bad{background:#FBE3DE;color:#B23B22}
.afd[data-theme=light] .pill.na{background:#EEF2F6;color:var(--mute)}
.afd[data-theme=light] .afd-insight{background:#FFF8E6}
.afd[data-theme=light] .afd-sharebar .x i{color:#12202E}
.afd[data-theme=light] .afd-step.go{background:linear-gradient(135deg,#EEB902,#D9A700)}
.afd[data-theme=light] .afd-step i.n,.afd[data-theme=light] .afd-tool.on,.afd[data-theme=light] .afd-doc .val{background:#EEB902}
body.fct-light .afd-toast{background:#FFFFFF;color:#12202E;box-shadow:0 12px 40px rgba(18,32,46,.2)}
body.fct-light .afd-mbox{background:#FFFFFF;color:#12202E}

/* ---------------- soft grey ---------------- */
.afd[data-theme=grey], body.fct-grey{--bg:#E6E9ED;--bg2:#F4F5F7;--card:#F4F5F7;--card2:#E9ECEF;--line:#CDD3DA;--line2:#B6BFC9;
  --ink:#1F2A36;--mute:#4F5D6B;--mute2:#6C7885;--gold:#A87A06;--gold2:#83600A}
body.fct-grey{background:#E6E9ED}
.afd[data-theme=grey] .afd-chip.ex,.afd[data-theme=grey] .afd-editnote,.afd[data-theme=grey] .afd-sharebar .res,.afd[data-theme=grey] .afd-banner.ex{background:#F3EBD2}
.afd[data-theme=grey] .afd-banner.err,.afd[data-theme=grey] .afd-issues li.error{background:#F2DEDA}
.afd[data-theme=grey] .afd-issues li.warning{background:#F2E8CF}
.afd[data-theme=grey] .afd-kpi,.afd[data-theme=grey] .afd-pan{background:var(--card)}
.afd[data-theme=grey] .afd-kpi.grey,.afd[data-theme=grey] .afd-tile{background:repeating-linear-gradient(135deg,#EEF0F2 0 10px,#E6E9EC 10px 20px)}
.afd[data-theme=grey] .pill.good{background:#D5EBDD;color:#17784A}
.afd[data-theme=grey] .pill.watch{background:#F3E6C8;color:#7E5300}
.afd[data-theme=grey] .pill.bad{background:#F0D8D2;color:#A63720}
.afd[data-theme=grey] .pill.na{background:#E3E7EB;color:var(--mute)}
.afd[data-theme=grey] .afd-insight{background:#F1EAD6}
.afd[data-theme=grey] .afd-sharebar .x i{color:#1F2A36}
.afd[data-theme=grey] .afd-step i.n,.afd[data-theme=grey] .afd-tool.on,.afd[data-theme=grey] .afd-doc .val{background:#EEB902}
body.fct-grey .afd-toast,body.fct-grey .afd-mbox{background:#F4F5F7;color:#1F2A36}

/* ---------------- high contrast ---------------- */
.afd[data-theme=contrast], body.fct-contrast{--bg:#000000;--bg2:#000000;--card:#000000;--card2:#111111;--line:#FFFFFF;--line2:#FFFFFF;
  --ink:#FFFFFF;--mute:#F0F0F0;--mute2:#D8D8D8;--gold:#FFD400;--gold2:#FFE14D}
body.fct-contrast{background:#000}
.afd[data-theme=contrast] .afd-kpi,.afd[data-theme=contrast] .afd-pan,.afd[data-theme=contrast] .afd-kpi.grey,.afd[data-theme=contrast] .afd-tile{background:#000}
.afd[data-theme=contrast] .afd-chip.ex,.afd[data-theme=contrast] .afd-banner.err,.afd[data-theme=contrast] .afd-issues li,.afd[data-theme=contrast] .afd-insight,.afd[data-theme=contrast] .afd-editnote{background:#000;border-color:#fff}
.afd[data-theme=contrast] a{text-decoration:underline}

/* ---------------- the pieces that stay a dark screen in every theme ---------------- */
.afd:not([data-theme=dark]) .afd-scene{--bg:#0B132B;--bg2:#0E1925;--card:#12202E;--card2:#16293A;--line:#22364A;--line2:#2E4A63;
  --ink:#E9EFF5;--mute:#9DB0C0;--mute2:#6E8298;--gold:#EEB902;--gold2:#F3CA40;color:var(--ink)}

/* ---------------- the switch ---------------- */
.fct-switch{display:inline-flex;gap:2px;background:var(--bg2);border:1px solid var(--line);border-radius:10px;padding:2px}
.fct-switch a{width:22px;height:22px;border-radius:7px;cursor:pointer;display:grid;place-items:center;border:1px solid transparent}
.fct-switch a i{width:13px;height:13px;border-radius:50%;display:block;border:1px solid rgba(0,0,0,.25)}
.fct-switch a.on{border-color:var(--gold)}

/* printing always uses the light look: paper is white */
@media print{
  .afd:not([data-theme=dark]){--bg:#FFFFFF;--bg2:#FFFFFF;--card:#FFFFFF;--card2:#F4F6F8;--ink:#12202E;--mute:#4B5D6E}
  body.fct-light,body.fct-grey,body.fct-contrast{background:#FFFFFF!important}
}
.afd[data-theme=light] .qi,.afd[data-theme=light] b.qi{color:#1565C0}
.afd[data-theme=grey] .qi,.afd[data-theme=grey] b.qi{color:#1558A8}
.afd[data-theme=contrast] .qi,.afd[data-theme=contrast] b.qi{color:#7FD4FF}
.afd:not([data-theme=dark]) .afd-scene .qi{color:#7cc0f2}

/* ---------------- the navy title band: the brand colour on top, a light working area below ---------------- */
.afd:not([data-theme=dark]) .afd-hero{--bg:#0B132B;--bg2:#0E1925;--card:#12202E;--card2:#16293A;--line:#22364A;--line2:#2E4A63;
  --ink:#E9EFF5;--mute:#B4C3D1;--mute2:#8FA2B5;--gold:#EEB902;--gold2:#F3CA40;color:var(--ink);
  background:linear-gradient(135deg,#0B132B 0%,#12243A 70%,#16293A 100%);border-radius:0 0 22px 22px;padding:26px 28px 22px;margin:0 0 18px;
  box-shadow:0 10px 30px rgba(11,19,43,.18)}
.afd:not([data-theme=dark]) .afd-hero .afd-title{color:#FFFFFF}
.afd:not([data-theme=dark]) .afd-hero .afd-intro{color:#C9D5E1}
.afd:not([data-theme=dark]) .afd-hero .afd-chip{background:rgba(255,255,255,.06)}
.afd:not([data-theme=dark]) .afd-hero .afd-chip.ex{background:rgba(238,185,2,.12)}
.afd:not([data-theme=dark]) .afd-hero .afd-logo{background:rgba(255,255,255,.04)}
.afd[data-theme=contrast] .afd-hero{background:#000;border:1px solid #fff}
@media print{.afd .afd-hero{background:#0B132B!important;-webkit-print-color-adjust:exact;print-color-adjust:exact}}
@media screen and (max-width:620px){.afd:not([data-theme=dark]) .afd-hero{padding:20px 16px;border-radius:0 0 16px 16px}}