/* ============================================================
   fg-kleuren.css  --  GEGENEREERD uit public.tegels door
   public.merkkleuren_css() op 10/10/2026 15:44
   NIET MET DE HAND WIJZIGEN. Verander de kleur in de tabel; de
   volgende build maakt dit bestand opnieuw.

   Tot 10/10/2026 stond hier een kopie van 24/09 die met de hand
   bijgehouden moest worden. De functie die dat deed bestond niet
   meer, dus bleef hij stilstaan: wise11, wisegroup en softgroup
   ontbraken, en er stond nog een merk in dat niet meer actief is.
   Een wise11-scherm viel daardoor stil terug op het oranje van
   FastHelp. Daarom wordt dit bestand nu gemaakt, niet onderhouden.

   Dit bestand wordt door ELKE pagina geladen, ook de losse pagina's
   die fg-theme.css niet kennen. Zo wijst var(--brand) nergens naar
   niets.
   ============================================================ */
:root{
  --brand:#ff8a1e;
  --brand-strong:#c76c17;
  --brand-2:#ff8a1e;
  --brand-soft:color-mix(in srgb,var(--brand) 14%,transparent);
  --brand-grad:linear-gradient(180deg,var(--brand),var(--brand-strong));
}
/* ============================================================
   BUILD 1020 - 11/10/2026 - DE AFDELINGSBALK.
   Patrick: "ergens in de header een schakelaar om de afdeling op ON / OFF te zetten",
   "maak daar iets mooi van met de huisstijl kleuren en glas en 3d, iphone achtig".
   De kleur komt uit het register (--fgl-merk, gezet door fg-lijst uit huisstijl x
   kleur), dus elke afdeling krijgt vanzelf de hare. Staat de afdeling uit, dan is de
   schakelaar grijs en leesbaar; staat hij aan, dan licht hij op in de huiskleur.
   Deze regels staan in fg-kleuren.css en niet in een module, omdat dit blad altijd
   geladen is - ook op schermen waar de lijst niet getekend wordt.
   ============================================================ */
.fg-afdbalk{display:inline-flex;align-items:center;gap:8px;flex-wrap:wrap}
.fg-schakel{display:inline-flex;align-items:center;gap:9px;cursor:pointer;
  font-size:12.5px;font-weight:700;letter-spacing:.01em;white-space:nowrap;
  padding:7px 14px 7px 9px;border-radius:999px;color:var(--ink);
  border:1px solid color-mix(in srgb,var(--ink) 16%,transparent);
  background:linear-gradient(180deg,
    color-mix(in srgb,var(--ink) 7%,var(--card)),
    color-mix(in srgb,var(--ink) 12%,var(--card)));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35),inset 0 -1px 0 rgba(0,0,0,.18),
    0 4px 12px -8px rgba(0,0,0,.6);
  transition:all .16s ease}
.fg-schakelbol{width:16px;height:16px;border-radius:50%;flex:0 0 16px;
  background:color-mix(in srgb,var(--ink) 28%,transparent);
  box-shadow:inset 0 1px 1px rgba(255,255,255,.5);transition:all .16s ease}
.fg-schakel.on{color:#fff;
  border-color:color-mix(in srgb,var(--fgl-merk,var(--brand)) 60%,transparent);
  background:linear-gradient(180deg,
    color-mix(in srgb,var(--fgl-merk,var(--brand)) 92%,#ffffff),
    color-mix(in srgb,var(--fgl-merk,var(--brand)) 76%,#000000));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.5),inset 0 -1px 0 rgba(0,0,0,.3),
    0 8px 20px -10px color-mix(in srgb,var(--fgl-merk,var(--brand)) 90%,transparent)}
.fg-schakel.on .fg-schakelbol{background:#fff;
  box-shadow:0 0 0 3px rgba(255,255,255,.25),0 0 12px rgba(255,255,255,.7)}
.fg-schakel:hover{filter:brightness(1.06)}
.fg-schakel:active{transform:translateY(1px)}
.fg-afdopen{font-size:11.5px;line-height:1.3;max-width:46ch}
.fg-afdopen.wacht{color:color-mix(in srgb,var(--warn) 78%,var(--ink))}
.fg-afdopen.klaar{color:color-mix(in srgb,var(--ok) 72%,var(--ink))}
.fg-knop3d-ic{padding:7px 11px;font-size:13px}
/* het envelopvenster: de e-mails die deze afdeling verstuurt */
.fg-mailvenster{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;
  background:rgba(0,0,0,.45);backdrop-filter:blur(3px)}
.fg-mailblad{width:min(820px,92vw);max-height:84vh;overflow:auto;border-radius:18px;
  background:var(--card);border:1px solid var(--line);
  box-shadow:0 30px 80px -30px rgba(0,0,0,.8)}
.fg-mailkop{display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:14px 18px;border-bottom:1px solid var(--line);position:sticky;top:0;
  background:var(--card);font-size:14px}
.fg-maillijst{padding:14px 18px;display:flex;flex-direction:column;gap:12px}
.fg-mailkaart{border:1px solid var(--line);border-radius:14px;padding:12px 14px;
  background:color-mix(in srgb,var(--ink) 3%,var(--card))}
.fg-mailrij{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin-bottom:6px}
.fg-mailtaal{font-size:10px;letter-spacing:.08em;padding:1px 6px;border-radius:5px;
  border:1px solid var(--line);color:var(--muted)}
.fg-mailstaat{font-size:11px;padding:2px 9px;border-radius:999px}
.fg-mailstaat.ok{color:color-mix(in srgb,var(--ok) 72%,var(--ink));
  background:color-mix(in srgb,var(--ok) 13%,transparent)}
.fg-mailstaat.wacht{color:color-mix(in srgb,var(--warn) 76%,var(--ink));
  background:color-mix(in srgb,var(--warn) 14%,transparent)}
.fg-mailonderwerp{font-weight:600;font-size:13px;margin-bottom:5px}
.fg-mailtekst{font-size:12px;color:var(--muted);white-space:pre-wrap;line-height:1.45;
  max-height:230px;overflow:auto}
.fg-mailleeg{color:var(--muted);font-size:13px;padding:18px 2px}
.fg-weg{

  /* ---- de merken, één regel per tegel ---- */
  --fasthelp:#ff8a1e; --fasthelp-2:#ff8a1e; --fasthelp-donker:#0f172a; --fasthelp-licht:#ffffff;
  --fastmovers:#1E71D9; --fastmovers-2:#3a7fd5; --fastmovers-donker:#0f172a; --fastmovers-licht:#ffffff;
  --softsun:#21856B; --softsun-2:#D4AF37; --softsun-donker:#0d2a22; --softsun-licht:#ffffff;
  --wise11:#1677FF; --wise11-2:#5B4BFF; --wise11-donker:#111827; --wise11-licht:#F8FAFC;
  --gpconsultancy:#D4AF37; --gpconsultancy-2:#111111; --gpconsultancy-donker:#14110a; --gpconsultancy-licht:#ffffff;
  --fastgroup:#ff8a1e; --fastgroup-2:#D4AF37; --fastgroup-donker:#1b0c00; --fastgroup-licht:#ffffff;
  --softgroup:#21856B; --softgroup-2:#D4AF37; --softgroup-donker:#0d2a22; --softgroup-licht:#ffffff;
  --wisegroup:#5B4BFF; --wisegroup-2:#1677FF; --wisegroup-donker:#111827; --wisegroup-licht:#F8FAFC;

  /* ---- het verloop van elk merk: eerste kleur naar tweede ---- */
  --fasthelp-grad:linear-gradient(135deg,#ff8a1e 0%,#ff8a1e 100%);
  --fastmovers-grad:linear-gradient(135deg,#1E71D9 0%,#3a7fd5 100%);
  --softsun-grad:linear-gradient(135deg,#21856B 0%,#D4AF37 100%);
  --wise11-grad:linear-gradient(135deg,#1677FF 0%,#5B4BFF 100%);
  --gpconsultancy-grad:linear-gradient(135deg,#D4AF37 0%,#111111 100%);
  --fastgroup-grad:linear-gradient(135deg,#ff8a1e 0%,#D4AF37 100%);
  --softgroup-grad:linear-gradient(135deg,#21856B 0%,#D4AF37 100%);
  --wisegroup-grad:linear-gradient(135deg,#5B4BFF 0%,#1677FF 100%);

  /* ---- korte namen die in oudere code gebruikt worden ---- */
  --move:var(--fastmovers); --gp:var(--gpconsultancy);
  --sun:var(--softsun); --sales:#0e7490;
}