/* ============================================================
 *  mission.aflandz.fr — complements a AdminLTE 4.
 *
 *  AdminLTE garde son apparence : cartes, small-box, barre laterale,
 *  boutons et formulaires sont ceux du gabarit, non repeints.
 *  Ce fichier n ajoute que ce qu AdminLTE ne fournit pas :
 *  l ecran de code, les blocs d objectif et la zone de code YAML.
 * ============================================================ */

/* ---- Ecran de code ------------------------------------------------------- */
#gate{
  position:fixed; inset:0; display:flex; align-items:center; justify-content:center;
  padding:16px; background:var(--bs-body-bg); z-index:2000;
}
#gate .boite{width:100%; max-width:360px}
#gate h1{font-size:28px; font-weight:700; margin:0 0 2px}
#gate .sous{font-size:13px; opacity:.6; margin-bottom:22px; text-transform:uppercase; letter-spacing:.08em}
#code{text-align:center; font-size:28px; letter-spacing:.5em; text-indent:.5em; padding:12px}
#gate .err{color:var(--bs-danger); font-size:13px; min-height:22px; margin:8px 0}

/* ---- Etat du flux -------------------------------------------------------- */
.pastille{
  font-size:12px; padding:3px 9px; display:inline-block; border-radius:var(--bs-border-radius);
  background:var(--bs-secondary-bg); border:1px solid var(--bs-border-color); opacity:.85;
}
.pastille.vivant{color:var(--bs-success); border-color:rgba(25,135,84,.4)}
.pastille.mort{color:var(--bs-danger); border-color:rgba(220,53,69,.4)}

/* ---- Vues ---------------------------------------------------------------- */
.vue{display:none}
.vue.actif{display:block}

/* ---- Entete de donneur --------------------------------------------------- */
.donneur{margin-bottom:28px}
.donneur-tete{
  display:flex; align-items:baseline; gap:10px; flex-wrap:wrap;
  padding-bottom:8px; border-bottom:1px solid var(--bs-border-color); margin-bottom:14px;
}
.donneur-tete h2{font-size:20px; margin:0; font-weight:600}
.donneur-tete .titre{font-size:13px; opacity:.6; font-style:italic}

/* ---- Carte de mission ---------------------------------------------------- */
.mission{height:100%}
.mission.staff{border-left:3px solid var(--bs-warning)}
.m-tete{padding:12px 14px 8px; display:flex; align-items:flex-start; gap:10px}
.m-nom{font-size:16px; font-weight:600; line-height:1.25}
.m-cle{font-size:11px; opacity:.55; font-family:var(--bs-font-monospace); margin-top:2px; word-break:break-all}
.m-desc{padding:0 14px 10px; font-size:13.5px; font-style:italic; opacity:.75}
.m-desc p{margin:0 0 5px}
.m-bloc{padding:10px 14px; border-top:1px solid var(--bs-border-color)}
.m-bloc h4{font-size:11px; opacity:.55; text-transform:uppercase; letter-spacing:.06em; margin:0 0 8px; font-weight:600}

/* ---- Objectifs ----------------------------------------------------------- */
.obj{display:flex; align-items:flex-start; gap:8px; margin-bottom:7px; font-size:13.5px}
.obj:last-child{margin-bottom:0}
.obj .qte{font-family:var(--bs-font-monospace); color:var(--bs-success)}
.obj .filtre{font-family:var(--bs-font-monospace); font-size:12.5px; word-break:break-all}
.obj .zone{font-size:12px; color:var(--bs-warning)}
.obj .cond{font-size:12px; opacity:.6}

.chaine{font-size:12px; opacity:.6; padding:8px 14px; border-top:1px solid var(--bs-border-color)}

/* ---- Blocs d objectif de l editeur --------------------------------------- */
.bloc-obj{
  background:var(--bs-tertiary-bg); border:1px solid var(--bs-border-color);
  border-radius:var(--bs-border-radius); padding:12px; margin-bottom:10px;
}
.bloc-obj.survol{border-color:var(--bs-primary); box-shadow:0 0 0 .2rem rgba(var(--bs-primary-rgb),.2)}
.bloc-obj.porte{opacity:.4}
.bloc-tete{display:flex; align-items:center; gap:8px; margin-bottom:10px}
.poignee{cursor:grab; opacity:.5; font-size:16px; padding:2px 4px; touch-action:none; user-select:none}
.poignee:active{cursor:grabbing}
.bloc-tete .num{font-size:12px; font-weight:600; opacity:.7}

/* ---- Zone de code YAML --------------------------------------------------- */
#yaml{
  width:100%; min-height:320px;
  font-family:var(--bs-font-monospace); font-size:13px; line-height:1.45;
  background:var(--bs-tertiary-bg); color:var(--bs-body-color);
  border:1px solid var(--bs-border-color); border-radius:var(--bs-border-radius);
  padding:12px; outline:none; resize:vertical;
  white-space:pre; overflow-wrap:normal; overflow-x:auto;
}
#yaml:focus{border-color:var(--bs-primary)}

/* ---- Divers -------------------------------------------------------------- */
.mono, .form-control.mono{font-family:var(--bs-font-monospace)}
.vide{text-align:center; padding:44px 20px; opacity:.55}
.brouillon .t{font-size:16px; font-weight:600; margin-bottom:2px}
.brouillon .d{font-size:12px; opacity:.55; font-family:var(--bs-font-monospace); margin-bottom:10px}

@media(max-width:640px){
  #yaml{min-height:240px; font-size:12px}
  .m-nom{font-size:15px}
}

/* ---- Rien ne doit elargir la page ---------------------------------------
 * Un identifiant brut (tacz:ammo{AmmoId:"tacz:9mm"}*60) n a aucun point de
 * cesure : sans ces regles il impose sa largeur a toute la page, et un
 * telephone repond en dezoomant l ensemble. C est ce qui est arrive.
 * ------------------------------------------------------------------------ */
.badge{
  white-space:normal;
  overflow-wrap:anywhere;
  word-break:break-word;
  text-align:left;
}
.m-cle, .obj .filtre{overflow-wrap:anywhere}
.app-wrapper, .app-main, .app-content, .container-fluid{max-width:100%; min-width:0}
.card, .card-body, .row{min-width:0}
/* Le diagramme, lui, a le droit d etre large : il defile dans sa propre boite. */
#diagramme{overflow-x:auto}