/* =============================================================
   AUTOMATISERINGER - se forloeb.js. Bygger på skallens klasser (app.css)
   og kundernes (kontakter.css: kt-kort, kt-grid, kt-seg-række, kt-blad);
   her står kun det, de ikke dækker. Al farve kommer fra skallens
   variabler, så lys og mørk følger med. Alt ligger under .fl-rum -
   undtagen mærkerne, som kontaktkortet også bruger.
   ============================================================= */
.fl-maerke{ display:inline-block; font-size:.75rem; font-weight:600; padding:.05rem .55rem; margin:0 .25rem .15rem 0; border-radius:1rem; border:1px solid var(--kant); color:var(--daempet); white-space:nowrap; }
.fl-live, .fl-faerdig{ border-color:var(--god); color:var(--god); }
.fl-venter, .fl-koerer{ border-color:var(--farve); color:var(--farve); }
.fl-fejlet{ border-color:var(--fejl); color:var(--fejl); }
.fl-stoppet, .fl-arkiveret{ border-style:dashed; }
.kt-navn .fl-maerke{ margin-left:.6rem; }

.fl-rum .felt > label{ font-weight:600; }
.fl-rum .knap.lille{ padding:.25rem .6rem; font-size:.85rem; }
.fl-rum button.link{ text-decoration:none; }
.fl-forklaring{ max-width:52rem; margin:0 0 1rem; }
.fl-arkiv{ margin:0; }
.fl-faner{ margin-bottom:1rem; }
.fl-tabel td small{ overflow-wrap:anywhere; }
.fl-fejltal{ color:var(--fejl); }
.fl-grund{ max-width:18rem; }

/* Trinnene */
.fl-trin-liste{ display:flex; flex-direction:column; gap:.8rem; margin:0 0 .8rem; }
.fl-trin{ border:1px solid var(--kant); border-radius:.5rem; background:var(--bund); }
.fl-trin-hoved{ display:flex; flex-wrap:wrap; align-items:center; gap:.6rem; padding:.5rem .8rem; border-bottom:1px solid var(--kant); }
.fl-nr{ display:inline-flex; align-items:center; justify-content:center; width:1.6rem; height:1.6rem; border-radius:50%; background:var(--farve); color:var(--farve-tekst); font-size:.8rem; font-weight:700; flex:none; }
.fl-trin-knapper{ margin-left:auto; display:flex; flex-wrap:wrap; gap:.3rem; }
.fl-trin-krop{ padding:.8rem; display:grid; gap:.8rem; }
.fl-trin-krop > p{ margin:0; }
.fl-trin-krop .kt-grid, .fl-trin-krop .kt-handlinger, .fl-trin-krop .kt-seg-rækker{ margin:0; }
.fl-vent input{ width:6rem; }
.fl-tilfoej{ display:flex; flex-wrap:wrap; align-items:center; gap:.4rem; }
.fl-flet{ display:flex; flex-wrap:wrap; align-items:center; gap:.4rem; }
.fl-flet .fl-eget{ width:auto; flex:0 1 13rem; min-width:8rem; padding:.25rem .5rem; font-size:.85rem; }
.fl-vis{ border:1px solid var(--kant); border-radius:.5rem; background:var(--flade); overflow:hidden; }
.fl-vis-emne{ margin:0; padding:.5rem .8rem; border-bottom:1px solid var(--kant); overflow-wrap:anywhere; }
/* Mailen har sine egne farver - rammen er hvid i både lys og mørk. */
.fl-ramme{ display:block; width:100%; height:32rem; border:0; background:#fff; }
.fl-statuskort h3{ display:flex; align-items:center; gap:.4rem; flex-wrap:wrap; }

/* Kørsler */
.fl-valg select{ flex:0 1 auto; width:auto; max-width:100%; }
.fl-koersler td:first-child{ min-width:13rem; }
.fl-handl{ white-space:nowrap; }
.fl-handl .knap{ margin:0 .25rem .25rem 0; }
.fl-log-række > td{ background:var(--bund); }
.fl-log, .fl-sendt{ margin:0; padding-left:1.2rem; font-size:.9rem; overflow-wrap:anywhere; }
.fl-sendt{ margin-top:.5rem; color:var(--daempet); }
.fl-log li{ margin:0 0 .35rem; }
.fl-l-fejl strong{ color:var(--fejl); } .fl-l-ok strong{ color:var(--god); } .fl-l-udskudt strong, .fl-l-sprunget strong{ color:var(--advarsel); }

@media (max-width:760px){
  .fl-trin-knapper{ margin-left:0; }
  .fl-handl{ white-space:normal; }
  .fl-koersler td:first-child{ min-width:0; }
  .fl-ramme{ height:26rem; }
  .fl-rum .listetabel .fl-log-række{ padding:0; border-bottom:0; }
  .fl-rum .listetabel .fl-log-række[hidden]{ display:none; }
}
