/* =====================================================================
   BOÎTES DE DIALOGUE DU DESK, VERSION 3 « BANDEAU DE MARQUE » (30/10/2026)
   Florian : « ces box sont brouillons, pas très modernes » ; la v2 (en-tête
   blanc) jugée « limite moins moderne » ; parmi trois propositions, choix B
   le 30/10 (captures : Desk-Refonte-globale/boites-3010/v3/planche-b.png).

   Portée : la boîte commune (#uiDlg : confirmations, motifs, alertes, environ
   400 appels) et les fenêtres .modal du Desk. L'en-tête marine est gardé, en
   dégradé, avec une croix ronde ; pied gris pleine largeur ; dans la boîte
   commune, une icône selon le type (#uiDlg[data-bx], posé par boites_v2.js),
   les boutons à droite (principal rouge du Desk), Échap ferme. Les fenêtres
   gardent l'ordre et la couleur de leurs boutons.

   Interrupteur : drapeau « boites_v2 » (Administration > Fonctionnalités) ;
   allumé, boites_v2.js pose html.bx2. Éteint : les boîtes d'avant, au
   rechargement. Les cases à cocher ont leur propre drapeau : cases_v2.css.
   ===================================================================== */

/* ---------- socle commun aux trois variantes ---------- */
html.bx2{
  --b3-sh:0 32px 80px -16px rgba(10,30,40,.38),0 8px 24px -8px rgba(10,30,40,.16),0 0 0 1px rgba(10,30,40,.06);
  --b3-scrim:rgba(13,31,41,.46);
  --b3-foot:#f6f8f9;
  --b3-ring:0 0 0 3px rgba(20,50,64,.16);
  --b3-q:#143240; --b3-q-bg:rgba(20,50,64,.08);
  --b3-d:#c43d47; --b3-d-bg:rgba(209,85,93,.12);
  --b3-i:#2f6fd6; --b3-i-bg:rgba(59,130,246,.12);
  --b3-pri:#143240; --b3-pri-h:#1d4356; --b3-pri-ink:#fff;
  --b3-dan:#d1555d; --b3-dan-h:#bb434b;
}
html.theme-dark.bx2{
  --b3-sh:0 32px 80px -16px rgba(0,0,0,.7),0 0 0 1px rgba(255,255,255,.06);
  --b3-scrim:rgba(0,0,0,.6);
  --b3-foot:rgba(0,0,0,.16);
  --b3-ring:0 0 0 3px rgba(143,195,223,.26);
  --b3-q:#9ccbe4; --b3-q-bg:rgba(143,195,223,.14);
  --b3-d:#ff8f96; --b3-d-bg:rgba(255,120,128,.16);
  --b3-i:#8fb8ff; --b3-i-bg:rgba(120,160,255,.16);
  --b3-pri:#8fc3df; --b3-pri-h:#a9d3ea; --b3-pri-ink:#0d1f29;
}
@keyframes b3in{from{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:none}}
html.bx2 .modal-bg{background:var(--b3-scrim);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
html.bx2 .modal-bg.on .modal{animation:b3in .18s cubic-bezier(.2,.8,.2,1)}
html.bx2 .modal{border-radius:16px;box-shadow:var(--b3-sh);border:0}
html.bx2 .modal .mh2 .x{width:32px;height:32px;border-radius:50%;display:inline-flex;align-items:center;
  justify-content:center;font-size:20px;line-height:1;flex:0 0 auto;margin-left:auto;transition:background-color .12s}
html.bx2 .modal .mbody .inp:focus,html.bx2 .modal .mbody textarea:focus,
html.bx2 .modal .mbody select:focus{outline:none;border-color:var(--b3-pri);box-shadow:var(--b3-ring)}

/* la boîte commune, centrée dans l'écran */
html.bx2 #uiDlg{align-items:center;padding:24px 16px}
html.bx2 #uiDlgMsg{font-size:14px!important;line-height:1.55!important}
html.bx2 #uiDlgInp{height:44px;border-radius:11px;border:1px solid var(--line);padding:0 14px;font-size:14px;
  background:var(--card);color:var(--ink);box-sizing:border-box;transition:border-color .12s,box-shadow .12s}
html.bx2 #uiDlgInp:focus{outline:none;border-color:var(--b3-pri);box-shadow:var(--b3-ring)}
html.bx2 #uiDlg .ctools .btn{height:40px;min-width:124px;border-radius:11px;font-weight:700;font-size:13.5px;
  padding:0 18px;display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;border:1px solid transparent;
  transition:background-color .12s,box-shadow .12s,transform .06s}
html.bx2 #uiDlg .ctools .btn:active{transform:translateY(1px)}
html.bx2 #uiDlg #uiDlgCancel{background:var(--card);color:var(--ink);border-color:var(--line);
  box-shadow:0 1px 2px rgba(10,30,40,.06)}
html.bx2 #uiDlg #uiDlgCancel:hover{background:var(--card2)}
html.bx2 #uiDlg #uiDlgOk:not(.ia-act){background:var(--b3-pri);color:var(--b3-pri-ink);
  box-shadow:0 1px 2px rgba(10,30,40,.18),inset 0 1px 0 rgba(255,255,255,.08)}
html.bx2 #uiDlg #uiDlgOk:not(.ia-act):hover{background:var(--b3-pri-h)}
html.bx2 #uiDlg[data-bx=danger] #uiDlgOk:not(.ia-act){background:var(--b3-dan);color:#fff}
html.bx2 #uiDlg[data-bx=danger] #uiDlgOk:not(.ia-act):hover{background:var(--b3-dan-h)}
html.bx2 #uiDlg .ctools .btn:focus-visible{outline:none;box-shadow:var(--b3-ring)}

/* icône du type de boîte : ::before = pastille, ::after = pictogramme */
html.bx2 #uiDlgTitle{position:relative}
html.bx2 #uiDlgTitle::before,html.bx2 #uiDlgTitle::after{content:"";position:absolute}
html.bx2 #uiDlgTitle::before{background:var(--b3-q-bg)}
html.bx2 #uiDlgTitle::after{background:var(--b3-q);-webkit-mask:var(--b3-ico) center/contain no-repeat;mask:var(--b3-ico) center/contain no-repeat}
html.bx2 #uiDlg{--b3-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9.5'/%3E%3Cpath d='M9.2 9.3a2.9 2.9 0 0 1 5.6 1c0 1.9-2.8 2.6-2.8 2.6'/%3E%3Cpath d='M12 16.9h.01'/%3E%3C/svg%3E")}
html.bx2 #uiDlg[data-bx=motif]{--b3-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20h9'/%3E%3Cpath d='M16.4 3.6a2.1 2.1 0 0 1 3 3L7.5 18.5 3.5 19.5l1-4z'/%3E%3C/svg%3E")}
html.bx2 #uiDlg[data-bx=danger]{--b3-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10.3 3.9 2.4 17.6a2 2 0 0 0 1.7 3h15.8a2 2 0 0 0 1.7-3L13.7 3.9a2 2 0 0 0-3.4 0z'/%3E%3Cpath d='M12 9.5v4'/%3E%3Cpath d='M12 17h.01'/%3E%3C/svg%3E")}
html.bx2 #uiDlg[data-bx=info]{--b3-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9.5'/%3E%3Cpath d='M12 16v-4.5'/%3E%3Cpath d='M12 8h.01'/%3E%3C/svg%3E")}
html.bx2 #uiDlg[data-bx=ia]{--b3-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l1.9 5.1L19 10l-5.1 1.9L12 17l-1.9-5.1L5 10l5.1-1.9z'/%3E%3Cpath d='M19 15l.8 2.2L22 18l-2.2.8L19 21l-.8-2.2L16 18l2.2-.8z'/%3E%3C/svg%3E")}
html.bx2 #uiDlg[data-bx=danger] #uiDlgTitle::before{background:var(--b3-d-bg)}
html.bx2 #uiDlg[data-bx=danger] #uiDlgTitle::after{background:var(--b3-d)}
html.bx2 #uiDlg[data-bx=info] #uiDlgTitle::before{background:var(--b3-i-bg)}
html.bx2 #uiDlg[data-bx=info] #uiDlgTitle::after{background:var(--b3-i)}
html.bx2 #uiDlg[data-bx=ia] #uiDlgTitle::before{background:var(--ia-soft2)}
html.bx2 #uiDlg[data-bx=ia] #uiDlgTitle::after{background:var(--ia)}

/* la case « Proposer aussi au Codex d'ORIAN » : un encart, l'étoile d'ORIAN à droite */
html.bx2 #uiDlg .cpx-chk{margin-top:12px;padding:11px 14px;border:1px solid var(--line);border-radius:12px;
  background:var(--card);color:var(--ink);font-size:13px;gap:11px;align-items:center;line-height:1.35;transition:border-color .12s,background-color .12s}
html.bx2 #uiDlg .cpx-chk:hover{border-color:var(--ia-soft2)}
html.bx2 #uiDlg .cpx-chk:has(input:checked){border-color:var(--ia-soft2);background:var(--ia-soft)}
html.bx2 #uiDlg .cpx-chk input{margin-top:0}
html.bx2 #uiDlg .cpx-chk::after{content:"";width:16px;height:16px;flex:0 0 16px;margin-left:auto;background:var(--ia);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l1.9 5.1L19 10l-5.1 1.9L12 17l-1.9-5.1L5 10l5.1-1.9z'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l1.9 5.1L19 10l-5.1 1.9L12 17l-1.9-5.1L5 10l5.1-1.9z'/%3E%3C/svg%3E") center/contain no-repeat}

/* ---------- Bandeau de marque ---------- */
html.bx2{--b3-pri:var(--reply);--b3-pri-h:#bb434b;--b3-pri-ink:#fff}
html.theme-dark.bx2{--b3-pri:#d9646b;--b3-pri-h:#e57a80;--b3-pri-ink:#fff}
html.bx2 .modal .mh2{background:linear-gradient(120deg,#102a36 0%,#143240 45%,#1f4c62 100%);color:#fff;padding:16px 14px 16px 22px;
  font-size:16px;font-weight:700;letter-spacing:-.005em;gap:10px;line-height:1.3;border-bottom:0;
  box-shadow:inset 0 -1px 0 rgba(255,255,255,.06)}
html.theme-dark.bx2 .modal .mh2{background:linear-gradient(120deg,#0a1d26 0%,#0e2731 45%,#173a49 100%)}
html.bx2 .modal .mh2 .x{color:rgba(255,255,255,.75);background:rgba(255,255,255,.08)}
html.bx2 .modal .mh2 .x:hover{background:rgba(255,255,255,.18);color:#fff}
html.bx2 .modal .mbody{padding:20px 22px}
html.bx2 .modal .mbody>.ctools:last-child{margin:20px -22px -20px!important;padding:14px 22px;background:var(--b3-foot);border-top:1px solid var(--line)}
html.bx2 .modal .mbody>.ctools:last-child .btn{min-height:38px;border-radius:11px;padding-left:18px;padding-right:18px}
html.bx2 #uiDlg .modal{width:520px!important}
html.bx2 #uiDlgTitle{padding:18px 14px 18px 66px;min-height:34px}
html.bx2 #uiDlgTitle::before{left:20px;top:50%;margin-top:-17px;width:34px;height:34px;border-radius:10px;background:rgba(255,255,255,.12)!important}
html.bx2 #uiDlgTitle::after{left:28px;top:50%;margin-top:-9px;width:18px;height:18px;background:#fff!important}
html.bx2 #uiDlg[data-bx=danger] #uiDlgTitle::before{background:#d1555d!important}
html.bx2 #uiDlg[data-bx=ia] #uiDlgTitle::before{background:linear-gradient(135deg,var(--ia),var(--ia2))!important}
html.bx2 #uiDlg .mbody{padding:20px 22px 0}
html.bx2 #uiDlgMsg{color:var(--ink)!important}
html.bx2 #uiDlgInpWrap{margin-top:14px!important}
html.bx2 #uiDlg .ctools{margin:22px -22px 0!important;padding:14px 22px;background:var(--b3-foot);border-top:1px solid var(--line);
  justify-content:flex-end;gap:10px}
html.bx2 #uiDlg #uiDlgCancel{order:1}
html.bx2 #uiDlg #uiDlgOk{order:2}