/*
 * Mini ERP V5.2.16 — thème atelier Crusco Motoculture
 *
 * Couche visuelle uniquement : fond atelier, panneaux translucides,
 * alignement des formulaires et ajustements téléphone/tablette.
 * Aucun comportement métier n'est défini dans ce fichier.
 */

:root{
  --erp-glass:rgba(255,255,255,.90);
  --erp-glass-strong:rgba(255,255,255,.96);
  --erp-glass-soft:rgba(248,250,253,.88);
  --erp-glass-line:rgba(151,167,190,.34);
  --erp-glass-shadow:0 10px 30px rgba(18,31,50,.10);
  --erp-form-label-min:34px;
}

html{
  background:#e8edf3;
}

/* Fond général : l'image reste derrière une pellicule claire afin que
   l'interface conserve un contraste confortable pendant toute la journée. */
body.erp-app{
  background-color:#edf2f6;
  background-image:
    linear-gradient(135deg,rgba(247,250,253,.76),rgba(237,243,248,.79)),
    url("../img/erp-workshop-bg.webp");
  background-position:center top;
  background-repeat:no-repeat;
  background-size:cover;
  background-attachment:fixed;
}

/* Barre et menu légèrement translucides : le décor reste perceptible sans
   réduire la lisibilité des commandes principales. */
body.erp-app .topbar{
  background:rgba(20,35,63,.95);
  border-bottom:1px solid rgba(255,255,255,.08);
  backdrop-filter:blur(14px) saturate(115%);
  -webkit-backdrop-filter:blur(14px) saturate(115%);
}

body.erp-app .sidebar{
  background:rgba(23,41,71,.96);
  backdrop-filter:blur(12px) saturate(110%);
  -webkit-backdrop-filter:blur(12px) saturate(110%);
}

/* Surfaces vitrées ------------------------------------------------------- */
body.erp-app :is(
  .shopbar,
  .card,
  .box,
  .login-card,
  .sticky-actions,
  .preview-card,
  .product-image-card,
  .modal-panel,
  .crop-modal-panel,
  .watermark-preview-card
){
  background:var(--erp-glass);
  border-color:var(--erp-glass-line);
  box-shadow:var(--erp-glass-shadow);
  backdrop-filter:blur(10px) saturate(112%);
  -webkit-backdrop-filter:blur(10px) saturate(112%);
}

body.erp-app details.shopbar-compact{
  background:var(--erp-glass);
  border-color:var(--erp-glass-line);
  backdrop-filter:blur(10px) saturate(112%);
  -webkit-backdrop-filter:blur(10px) saturate(112%);
}

body.erp-app :is(.field-static,.box-soft,.empty-state,.table-empty){
  background:var(--erp-glass-soft);
}

/* Les tableaux doivent rester faciles à lire même lorsque le fond passe
   derrière les panneaux. */
body.erp-app table{
  background:rgba(255,255,255,.92);
}

body.erp-app thead th{
  background:rgba(235,241,248,.97);
}

body.erp-app tbody td{
  background:rgba(255,255,255,.91);
}

body.erp-app tbody tr:nth-child(even) td{
  background:rgba(249,251,253,.91);
}

body.erp-app tbody tr:hover td{
  background:rgba(241,246,252,.97);
}

body.erp-app :is(.table-scroll,.erp-table-scroll,.table-responsive,.table-wrap,.table-wrapper){
  background:rgba(255,255,255,.70);
  backdrop-filter:blur(7px);
  -webkit-backdrop-filter:blur(7px);
}

/* Formulaires ----------------------------------------------------------- */
body.erp-app form{
  min-width:0;
}

body.erp-app :is(.grid2,.grid-2,.grid-3){
  align-items:start;
}

body.erp-app :is(.grid2,.grid-2,.grid-3) > :is(label,.field,.form-field,.field-group){
  min-width:0;
  align-self:start;
}

body.erp-app .field,
body.erp-app .form-field,
body.erp-app .field-group{
  min-width:0;
}

/* Deux hauteurs de ligne sont réservées aux intitulés sur ordinateur et
   tablette. Les champs d'une même rangée restent ainsi réellement alignés. */
@media (min-width:821px){
  body.erp-app :is(.grid2,.grid-2,.grid-3) > label:not(.checkbox-row),
  body.erp-app :is(.grid2,.grid-2,.grid-3) > .field > label,
  body.erp-app :is(.grid2,.grid-2,.grid-3) > .form-field > label,
  body.erp-app :is(.grid2,.grid-2,.grid-3) > .field-group > label{
    min-height:var(--erp-form-label-min);
  }

  body.erp-app :is(.grid2,.grid-2,.grid-3) > label:not(.checkbox-row){
    display:grid;
    grid-template-rows:minmax(var(--erp-form-label-min),auto) auto;
    align-content:start;
    margin:0;
  }
}

body.erp-app .field > label,
body.erp-app .form-field > label,
body.erp-app .field-group > label{
  display:flex;
  align-items:flex-end;
  margin:0 0 6px;
}

body.erp-app :is(.grid2,.grid-2,.grid-3) > label:not(.checkbox-row) > :is(input,select,textarea){
  margin-top:0;
}

body.erp-app :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),select,textarea){
  border-color:#bcc9d9;
  background:rgba(255,255,255,.96);
  box-shadow:0 1px 2px rgba(20,35,63,.035);
}

body.erp-app :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),select,textarea):hover:not(:disabled){
  border-color:#9fb0c6;
}

body.erp-app :is(input,select,textarea):focus{
  background:#fff;
}

body.erp-app :is(.field-hint,.help-text,.form-help,form small){
  margin-top:5px;
  line-height:1.4;
}

body.erp-app form :is(.form-actions,.action-row,.button-row){
  margin-top:14px;
}

/* Connexion : le fond atelier est pleinement utilisé sans sacrifier la
   lisibilité du formulaire. */
body.erp-page-login{
  min-height:100dvh;
  display:grid;
  place-items:center;
  padding:20px;
}

body.erp-page-login .login-card{
  width:min(430px,100%);
  background:rgba(255,255,255,.91);
  box-shadow:0 24px 70px rgba(13,25,48,.22);
}

/* Tablette -------------------------------------------------------------- */
@media (max-width:1180px){
  body.erp-app{
    background-attachment:scroll;
    background-position:center top;
    background-image:
      linear-gradient(135deg,rgba(247,250,253,.80),rgba(237,243,248,.83)),
      url("../img/erp-workshop-bg.webp");
  }

  body.erp-app :is(.shopbar,.card,.box,.login-card,.sticky-actions){
    background:rgba(255,255,255,.92);
  }
}

/* Téléphone et tablette portrait --------------------------------------- */
@media (max-width:820px){
  :root{
    --erp-form-label-min:0px;
  }

  body.erp-app{
    background-position:56% top;
    background-image:
      linear-gradient(180deg,rgba(248,250,252,.84),rgba(238,244,248,.88)),
      url("../img/erp-workshop-bg.webp");
  }

  body.erp-app .content{
    padding-inline:max(10px,env(safe-area-inset-left)) max(10px,env(safe-area-inset-right));
  }

  body.erp-app :is(.grid2,.grid-2,.grid-3) > label:not(.checkbox-row){
    display:block;
    min-height:0;
    margin:0;
  }

  body.erp-app :is(.grid2,.grid-2,.grid-3) > label:not(.checkbox-row) > :is(input,select,textarea){
    margin-top:6px;
  }

  body.erp-app .field > label,
  body.erp-app .form-field > label,
  body.erp-app .field-group > label{
    min-height:0;
    align-items:flex-start;
  }

  body.erp-app :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),select,textarea){
    min-height:46px;
    font-size:16px;
  }

  body.erp-app textarea{
    min-height:110px;
  }

  body.erp-app :is(.shopbar,.card,.box,.login-card,.sticky-actions){
    background:rgba(255,255,255,.94);
    backdrop-filter:blur(7px) saturate(108%);
    -webkit-backdrop-filter:blur(7px) saturate(108%);
  }

  body.erp-app .toolbar-actions,
  body.erp-app .form-actions,
  body.erp-app .action-row,
  body.erp-app .button-row{
    width:100%;
  }
}

@media (max-width:620px){
  body.erp-app{
    background-position:58% top;
  }

  body.erp-app .content{
    padding-top:10px;
  }

  body.erp-app :is(.box,.card,.shopbar){
    box-shadow:0 7px 22px rgba(18,31,50,.09);
  }

  body.erp-app .responsive-card-table tr{
    background:rgba(255,255,255,.94);
    backdrop-filter:blur(7px);
    -webkit-backdrop-filter:blur(7px);
  }

  body.erp-app .toolbar-actions > :is(.button,button),
  body.erp-app .form-actions > :is(.button,button),
  body.erp-app .action-row > :is(.button,button),
  body.erp-app .button-row > :is(.button,button){
    flex:1 1 100%;
  }
}

/* Les navigateurs qui désactivent le flou conservent quand même des
   panneaux suffisamment opaques. */
@supports not ((backdrop-filter:blur(2px)) or (-webkit-backdrop-filter:blur(2px))){
  body.erp-app :is(.shopbar,.card,.box,.login-card,.sticky-actions,.modal-panel){
    background:rgba(255,255,255,.96);
  }
}

@media print{
  body.erp-app{
    background:#fff !important;
  }

  body.erp-app :is(.shopbar,.card,.box,.login-card,.sticky-actions,table){
    background:#fff !important;
    box-shadow:none !important;
    backdrop-filter:none !important;
  }
}

/* -------------------------------------------------------------------------
   V5.2.19 — navigation atelier épurée

   #102BEA reste la couleur d'accent. Les grandes surfaces utilisent un bleu
   nuit translucide : l'image de fond reste visible, sans transformer toute
   l'interface en aplat bleu électrique.
   ------------------------------------------------------------------------- */
:root{
  --erp-topbar-height:64px;
  --erp-nav-accent:#102BEA;
  --erp-nav-accent-rgb:16,43,234;
  --erp-nav-ink:#0d2038;
  --erp-nav-ink-rgb:13,32,56;
  --erp-nav-top:rgba(var(--erp-nav-ink-rgb),.88);
  --erp-nav-side:rgba(var(--erp-nav-ink-rgb),.79);
  --erp-nav-line:rgba(255,255,255,.14);
  --erp-glass:rgba(255,255,255,.86);
  --erp-glass-soft:rgba(248,250,253,.82);
}

/* Fond moins délavé sur ordinateur. */
body.erp-app{
  background-image:
    linear-gradient(135deg,rgba(247,250,253,.67),rgba(237,243,248,.72)),
    url("../img/erp-workshop-bg.webp");
}

/* Barre du haut : bleu nuit vitré + accent Crusco. */
body.erp-app .topbar{
  min-height:64px;
  padding:7px clamp(12px,1.4vw,20px);
  gap:10px;
  background:
    linear-gradient(105deg,rgba(8,24,45,.94) 0%,rgba(13,32,56,.88) 64%,rgba(var(--erp-nav-accent-rgb),.20) 100%);
  border-bottom:1px solid rgba(255,255,255,.12);
  box-shadow:0 10px 28px rgba(5,16,35,.18),inset 0 -2px 0 rgba(var(--erp-nav-accent-rgb),.38);
  backdrop-filter:blur(16px) saturate(118%);
  -webkit-backdrop-filter:blur(16px) saturate(118%);
}

body.erp-app .brand-logo img{
  width:174px;
  height:48px;
}

body.erp-app .topbar-middle{
  gap:8px;
  justify-content:flex-end;
}

/* Navigation documents déplacée dans la barre globale. */
body.erp-app .topbar-document-nav{
  flex:0 1 auto;
  min-width:0;
  display:flex;
  align-items:center;
  gap:3px;
  padding:4px;
  border:1px solid rgba(255,255,255,.11);
  border-radius:15px;
  background:rgba(255,255,255,.055);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05);
  white-space:nowrap;
}

body.erp-app .topbar-document-link{
  min-height:32px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin:0 !important;
  padding:6px 9px !important;
  border-radius:10px !important;
  color:#dfeaff !important;
  font-size:12px;
  font-weight:800;
  line-height:1;
  text-decoration:none;
  transition:background .12s ease,color .12s ease,transform .12s ease;
}

body.erp-app .topbar-document-link:hover{
  background:rgba(255,255,255,.10) !important;
  color:#fff !important;
  transform:translateY(-1px);
}

body.erp-app .topbar-document-link.is-active{
  background:linear-gradient(135deg,var(--erp-nav-accent),#3157ff) !important;
  color:#fff !important;
  box-shadow:0 6px 14px rgba(var(--erp-nav-accent-rgb),.30);
}

body.erp-app .topbar-searches{
  flex:1 1 390px;
  gap:7px;
}

body.erp-app .topbar-quick-search{
  width:clamp(175px,17vw,270px);
  min-width:150px;
}

body.erp-app .topbar-quick-search input{
  min-height:38px;
  border-radius:12px;
  background:rgba(255,255,255,.94);
  box-shadow:none;
}

body.erp-app :is(.topbar-cash-button,.menu-toggle){
  background:rgba(255,255,255,.075) !important;
  border-color:rgba(255,255,255,.16) !important;
  box-shadow:none !important;
}

body.erp-app .topbar-cash-button:hover,
body.erp-app .menu-toggle:hover{
  background:rgba(255,255,255,.13) !important;
}

body.erp-app .topbar-user{
  padding:4px 5px 4px 10px;
  border:1px solid rgba(255,255,255,.13);
  border-radius:14px;
  background:rgba(255,255,255,.055);
}

body.erp-app .topbar-user a{
  padding:6px 8px;
  border-radius:10px;
  background:rgba(255,255,255,.08);
}

body.erp-app .topbar-user .topbar-shop-browser{
  display:inline-flex;
  align-items:center;
  gap:7px;
  color:#fff;
  background:rgba(16,43,234,.72);
  white-space:nowrap;
}

body.erp-app .topbar-user .topbar-shop-browser:hover{
  background:#102bea;
}

/* Menu gauche : davantage de décor visible, l'accent n'apparaît que pour
   l'élément actif et les petits repères. */
body.erp-app .sidebar{
  background:
    linear-gradient(180deg,rgba(8,25,47,.86),rgba(13,32,56,.76) 72%,rgba(var(--erp-nav-accent-rgb),.10));
  border-right:1px solid var(--erp-nav-line);
  box-shadow:10px 0 30px rgba(5,16,35,.13);
  backdrop-filter:blur(15px) saturate(112%);
  -webkit-backdrop-filter:blur(15px) saturate(112%);
}

body.erp-app .sidebar-title{
  color:rgba(226,236,255,.60);
  letter-spacing:.09em;
}

body.erp-app .sidebar-group,
body.erp-app .sidebar-subgroup{
  background:rgba(255,255,255,.035);
  border-color:rgba(255,255,255,.095);
  box-shadow:none;
}

body.erp-app .sidebar a{
  color:#eaf2ff;
}

body.erp-app .sidebar a:hover{
  background:rgba(255,255,255,.09);
}

body.erp-app .sidebar a.is-active{
  background:rgba(255,255,255,.93);
  color:#13213a;
  box-shadow:0 8px 18px rgba(4,15,32,.17);
}

body.erp-app .sidebar a.is-active:before{
  background:var(--erp-nav-accent);
}

/* Verre léger pour les panneaux de travail. */
body.erp-app :is(.shopbar,.card,.box,.sticky-actions,.preview-card,.product-image-card){
  background:rgba(255,255,255,.86);
  border-color:rgba(190,204,222,.50);
  box-shadow:0 9px 26px rgba(18,31,50,.085);
  backdrop-filter:blur(9px) saturate(108%);
  -webkit-backdrop-filter:blur(9px) saturate(108%);
}

/* Bureau : aucun gros bandeau de titre, quatre indicateurs compacts sur une
   seule ligne et quatre cartes parfaitement alignées. */
body.erp-page-dashboard .content{
  padding-top:12px;
}

body.erp-page-dashboard .document-kpis{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
  margin:0 0 12px;
}

body.erp-page-dashboard .document-kpi{
  --kpi-accent:#3157ff;
  position:relative;
  min-height:58px;
  display:flex;
  align-items:center;
  gap:11px;
  padding:9px 13px 9px 16px;
  overflow:hidden;
  border:1px solid rgba(190,204,222,.52);
  border-radius:16px;
  background:rgba(255,255,255,.84) !important;
  color:#17243a;
  box-shadow:0 8px 22px rgba(18,31,50,.075);
  backdrop-filter:blur(9px) saturate(108%);
  -webkit-backdrop-filter:blur(9px) saturate(108%);
}

body.erp-page-dashboard .document-kpi::before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:4px;
  background:var(--kpi-accent);
}

body.erp-page-dashboard .document-kpi strong{
  flex:0 0 auto;
  min-width:28px;
  color:var(--kpi-accent);
  font-size:1.55rem;
  line-height:1;
}

body.erp-page-dashboard .document-kpi span{
  color:#45546d;
  font-size:.82rem;
  font-weight:800;
}

body.erp-page-dashboard .document-kpi.is-orange{--kpi-accent:#e45b0b}
body.erp-page-dashboard .document-kpi.is-blue{--kpi-accent:#2557d6}
body.erp-page-dashboard .document-kpi.is-red{--kpi-accent:#d62f35}
body.erp-page-dashboard .document-kpi.is-violet{--kpi-accent:#7a42dc}

body.erp-page-dashboard .document-kpi[href]:hover{
  transform:translateY(-1px);
  box-shadow:0 11px 24px rgba(18,31,50,.10);
}

body.erp-page-dashboard .desk-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
  align-items:start;
  margin-top:0;
}

body.erp-page-dashboard .desk-grid .box{
  width:100%;
  margin:0;
  align-self:start;
  padding:14px;
  background:rgba(255,255,255,.82);
}

body.erp-page-dashboard .desk-grid .box-head{
  min-height:48px;
  margin:0 0 6px;
  align-items:flex-start;
}

body.erp-page-dashboard .desk-grid .box h2{
  font-size:1.04rem;
}

body.erp-page-dashboard .desk-grid .help-text{
  font-size:.78rem;
}

body.erp-page-dashboard .desk-item{
  padding:8px 8px;
}

/* Page Documents : les types sont maintenant en haut. Il ne reste dans la
   page qu'un contexte discret et les actions de création/synchronisation. */
body.erp-page-documents .document-unified-toolbar--actions{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  min-height:50px;
  margin:0 0 12px;
  padding:7px 10px 7px 14px;
  border:1px solid rgba(190,204,222,.50);
  border-radius:16px;
  background:rgba(255,255,255,.84);
  box-shadow:0 8px 22px rgba(18,31,50,.07);
  backdrop-filter:blur(9px);
  -webkit-backdrop-filter:blur(9px);
}

body.erp-page-documents .document-context-summary{
  min-width:0;
  display:flex;
  align-items:baseline;
  gap:8px;
}

body.erp-page-documents .document-context-summary strong{
  color:#14213a;
  font-size:.93rem;
}

body.erp-page-documents .document-context-summary span{
  color:#6b7890;
  font-size:.76rem;
  white-space:nowrap;
}

body.erp-page-documents .document-unified-toolbar--actions .document-unified-actions{
  margin-left:auto;
}

/* Le bouton d'installation PWA ne doit jamais être rendu visible par une
   règle de bouton générique tant que le navigateur n'a pas fourni de prompt. */
body.erp-app [data-pwa-install][hidden]{
  display:none !important;
}

/* Tablette paysage : deux colonnes pour le bureau, navigation documents
   masquée dès que l'espace devient trop serré. */
@media (max-width:1450px){
  body.erp-app .topbar-document-link{
    padding-inline:7px !important;
    font-size:11px;
  }
  body.erp-app .topbar-document-link:first-child{display:none}
  body.erp-app .topbar-quick-search{width:clamp(155px,16vw,225px)}
  body.erp-app .topbar-user span{display:none}
}

@media (max-width:1180px){
  body.erp-app .topbar-document-nav{display:none}
  body.erp-page-dashboard .desk-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media (max-width:820px){
  :root{--erp-topbar-height:62px}

  body.erp-app{
    background-image:
      linear-gradient(180deg,rgba(248,250,252,.79),rgba(238,244,248,.84)),
      url("../img/erp-workshop-bg.webp");
  }

  body.erp-app .topbar{
    background:
      linear-gradient(105deg,rgba(8,24,45,.95),rgba(13,32,56,.92) 72%,rgba(var(--erp-nav-accent-rgb),.22));
  }

  body.erp-app .sidebar{
    background:rgba(10,28,51,.92);
  }

  body.erp-page-dashboard .document-kpis{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
  }

  body.erp-page-dashboard .desk-grid{
    grid-template-columns:1fr;
    gap:10px;
  }

  body.erp-page-documents .document-unified-toolbar--actions{
    align-items:stretch;
    flex-direction:column;
  }

  body.erp-page-documents .document-unified-toolbar--actions .document-unified-actions{
    width:100%;
    margin:0;
  }

  body.erp-page-mobile .mobile-workspace-hero{
    padding:14px 16px;
    border:1px solid rgba(255,255,255,.14);
    background:linear-gradient(135deg,rgba(8,27,49,.93),rgba(12,65,76,.88));
  }

  body.erp-page-mobile .mobile-workspace-hero h1{
    margin:4px 0 7px;
    font-size:1.45rem;
  }

  body.erp-page-mobile .mobile-workspace-hero p{
    font-size:.86rem;
    line-height:1.4;
  }

  body.erp-page-mobile .mobile-app-state{
    gap:7px;
  }

  body.erp-page-mobile.erp-pwa-standalone .mobile-workspace-hero{
    display:none;
  }

  body.erp-app .mobile-bottom-nav{
    background:rgba(8,27,49,.90);
    border:1px solid rgba(255,255,255,.13);
    box-shadow:0 12px 30px rgba(5,16,35,.25);
    backdrop-filter:blur(15px) saturate(115%);
    -webkit-backdrop-filter:blur(15px) saturate(115%);
  }

  body.erp-app .mobile-bottom-nav a.is-active{
    background:linear-gradient(135deg,var(--erp-nav-accent),#3157ff);
  }
}

@media (max-width:620px){
  body.erp-page-dashboard .document-kpi{
    min-height:54px;
    padding:8px 10px 8px 14px;
  }

  body.erp-page-dashboard .document-kpi strong{font-size:1.35rem}
  body.erp-page-dashboard .document-kpi span{font-size:.74rem}

  body.erp-page-mobile .mobile-workspace-hero p{
    display:none;
  }

  body.erp-page-mobile .mobile-kicker{
    font-size:.68rem;
  }
}

@media (max-width:420px){
  body.erp-page-dashboard .document-kpis{grid-template-columns:1fr 1fr}
  body.erp-page-dashboard .document-kpi{gap:7px}
}

/* -------------------------------------------------------------------------
   V5.2.20 — finition atelier / caisse rapide

   Direction : grandes surfaces bleu nuit transparentes, #102BEA uniquement
   comme accent, blanc cassé vitré pour les zones de travail. Le décor reste
   perceptible mais n'entre jamais en concurrence avec les données.
   ------------------------------------------------------------------------- */
:root{
  --erp-nav-accent:#102BEA;
  --erp-shell-900:#091b31;
  --erp-shell-800:#102a49;
  --erp-shell-rgb:9,27,49;
  --erp-surface:rgba(255,255,255,.81);
  --erp-surface-strong:rgba(255,255,255,.91);
  --erp-surface-soft:rgba(246,249,253,.76);
  --erp-border:rgba(158,178,204,.38);
  --erp-shadow-soft:0 10px 30px rgba(12,27,48,.075);
}

body.erp-app{
  background-color:#e8eef4;
  background-image:
    linear-gradient(135deg,rgba(247,250,253,.58),rgba(235,242,248,.66)),
    url("../img/erp-workshop-bg.webp");
}

/* Navigation : sobre, légèrement transparente, accent très limité. */
body.erp-app .topbar{
  min-height:62px;
  padding-block:6px;
  background:
    linear-gradient(110deg,rgba(6,22,42,.94),rgba(13,38,66,.88) 72%,rgba(16,43,234,.12));
  border-bottom:1px solid rgba(255,255,255,.11);
  box-shadow:0 9px 28px rgba(5,17,32,.16);
}

body.erp-app .topbar::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:2px;
  pointer-events:none;
  background:linear-gradient(90deg,rgba(16,43,234,.05),rgba(16,43,234,.85) 38%,rgba(73,161,230,.55) 68%,rgba(16,43,234,.04));
}

body.erp-app .brand-logo img{
  width:166px;
  height:46px;
}

body.erp-app .topbar-document-nav{
  padding:3px;
  gap:2px;
  border-radius:13px;
  background:rgba(255,255,255,.045);
  border-color:rgba(255,255,255,.10);
}

body.erp-app .topbar-document-link{
  min-height:31px;
  padding:6px 8px !important;
  border-radius:9px !important;
  color:rgba(236,244,255,.86) !important;
}

body.erp-app .topbar-document-link.is-active{
  background:#102BEA !important;
  box-shadow:0 5px 14px rgba(16,43,234,.22);
}

body.erp-app .sidebar{
  background:
    linear-gradient(180deg,rgba(7,25,46,.84),rgba(12,36,63,.73) 70%,rgba(16,43,234,.08));
  border-right:1px solid rgba(255,255,255,.10);
  box-shadow:8px 0 28px rgba(4,17,32,.11);
  backdrop-filter:blur(16px) saturate(112%);
  -webkit-backdrop-filter:blur(16px) saturate(112%);
}

body.erp-app .sidebar-group{
  margin-bottom:8px;
  border-color:rgba(255,255,255,.085);
  background:rgba(255,255,255,.025);
}

body.erp-app .sidebar-group summary{
  padding:10px 12px;
  font-size:13px;
}

body.erp-app .sidebar a{
  min-height:38px;
  padding:8px 11px;
  font-size:13px;
}

body.erp-app .sidebar a.is-active{
  background:rgba(248,251,255,.94);
  box-shadow:0 7px 18px rgba(3,15,30,.14);
}

/* Le fond doit se voir entre les panneaux, pas à travers les textes. */
body.erp-app :is(.box,.card,.shopbar,.preview-card,.product-image-card,.sticky-actions),
body.erp-app details.shopbar-compact{
  background:var(--erp-surface);
  border-color:var(--erp-border);
  box-shadow:var(--erp-shadow-soft);
  backdrop-filter:blur(11px) saturate(108%);
  -webkit-backdrop-filter:blur(11px) saturate(108%);
}

body.erp-app :is(.box,.card):hover{
  border-color:rgba(135,159,192,.46);
}

body.erp-app table{
  background:rgba(255,255,255,.84);
}
body.erp-app thead th{
  background:rgba(235,242,249,.93);
}
body.erp-app tbody td{
  background:rgba(255,255,255,.84);
}
body.erp-app tbody tr:nth-child(even) td{
  background:rgba(248,251,253,.84);
}

/* Pages et formulaires : moins de grands aplats, rythme plus régulier. */
body.erp-app .page-title{
  margin-bottom:12px;
}
body.erp-app .page-title h1{
  margin-bottom:2px;
  font-size:clamp(1.45rem,1.8vw,1.85rem);
  letter-spacing:-.025em;
}
body.erp-app .page-title .help-text{
  margin-top:2px;
}

body.erp-app details.shopbar-compact{
  margin-bottom:12px;
  border-radius:14px;
}
body.erp-app details.shopbar-compact > summary{
  min-height:42px;
  padding:8px 12px;
}

body.erp-app :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),select,textarea){
  border-color:rgba(157,177,202,.62);
  background:rgba(251,253,255,.93);
  border-radius:11px;
}
body.erp-app :is(input,select,textarea):focus{
  border-color:rgba(16,43,234,.54);
  box-shadow:0 0 0 3px rgba(16,43,234,.08);
}

body.erp-app .product-panel,
body.erp-app .product-subpanel,
body.erp-page-native-shop .native-shop-editor-card,
body.erp-page-native-shop .native-shop-create-panel,
body.erp-page-native-shop .native-shop-section{
  border-color:var(--erp-border);
  background:rgba(255,255,255,.79);
  box-shadow:0 8px 24px rgba(13,31,54,.065);
  backdrop-filter:blur(9px);
  -webkit-backdrop-filter:blur(9px);
}

/* Bureau : une vraie ligne d'indicateurs et quatre colonnes sans décalage. */
body.erp-page-dashboard .content{
  padding-top:10px;
}
body.erp-page-dashboard .document-kpis{
  gap:9px;
  margin-bottom:10px;
}
body.erp-page-dashboard .document-kpi{
  min-height:50px;
  padding:7px 12px 7px 14px;
  border-radius:14px;
  background:rgba(255,255,255,.78) !important;
  box-shadow:0 7px 20px rgba(18,31,50,.065);
}
body.erp-page-dashboard .document-kpi::before{
  width:3px;
}
body.erp-page-dashboard .document-kpi strong{
  min-width:25px;
  font-size:1.38rem;
}
body.erp-page-dashboard .document-kpi span{
  font-size:.77rem;
}
body.erp-page-dashboard .desk-grid{
  gap:10px;
  align-items:start;
}
body.erp-page-dashboard .desk-grid > .box{
  align-self:start;
  margin:0 !important;
  padding:13px;
  border-radius:16px;
  background:rgba(255,255,255,.77);
}
body.erp-page-dashboard .desk-grid .box-head{
  min-height:52px;
  margin:0 0 4px;
}
body.erp-page-dashboard .desk-grid .desk-list{
  margin-top:0;
}

/* ----------------------------------------------------------------------
   Caisse : ouverture immédiate, loader visible, iframe sans grand blanc.
   ---------------------------------------------------------------------- */
body.erp-app .cash-modal-panel{
  width:min(1420px,calc(100vw - 32px));
  height:min(92dvh,940px);
  max-height:calc(100dvh - 24px);
  margin:12px auto;
  padding:0 !important;
  overflow:hidden;
  display:grid;
  grid-template-rows:auto minmax(0,1fr);
  border:1px solid rgba(151,172,202,.45);
  border-radius:22px;
  background:rgba(238,244,249,.94);
  box-shadow:0 32px 90px rgba(5,18,35,.31);
}

body.erp-app .cash-modal-header{
  position:relative;
  top:auto;
  z-index:4;
  min-height:66px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin:0 !important;
  padding:10px 14px 10px 16px !important;
  background:
    linear-gradient(110deg,rgba(7,26,49,.98),rgba(14,43,75,.95) 76%,rgba(16,43,234,.24));
  border-bottom:1px solid rgba(255,255,255,.12);
}
body.erp-app .cash-modal-heading{
  gap:1px;
}
body.erp-app .cash-modal-title-row{
  display:flex;
  align-items:center;
  gap:9px;
}
body.erp-app .cash-modal-title-row h2{
  margin:0;
  color:#fff !important;
  font-size:1.25rem;
}
body.erp-app .cash-modal-heading p{
  margin:0;
  color:rgba(232,241,252,.75);
  font-size:11.5px;
}
body.erp-app .cash-modal-eyebrow{
  min-height:18px;
  padding:0;
  background:transparent;
  color:#8eb6ff;
  font-size:9px;
  letter-spacing:.11em;
}
body.erp-app .cash-modal-ready{
  display:inline-flex;
  align-items:center;
  min-height:22px;
  padding:0 8px;
  border-radius:999px;
  background:rgba(84,211,151,.13);
  color:#bdf4d8;
  font-size:10px;
  font-weight:800;
}
body.erp-app .cash-modal-ready.is-loading{
  background:rgba(255,255,255,.09);
  color:#dce9fb;
}
body.erp-app .cash-modal-header-actions{
  display:flex;
  align-items:center;
  gap:7px;
}
body.erp-app .cash-modal-full-link{
  display:inline-flex;
  align-items:center;
  min-height:36px;
  margin:0 !important;
  padding:0 11px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:10px;
  background:rgba(255,255,255,.07);
  color:#eef5ff !important;
  font-size:11px;
  font-weight:800;
  text-decoration:none;
}
body.erp-app .cash-modal-close{
  position:static;
  flex:0 0 38px;
  width:38px;
  height:38px;
  min-height:38px;
  padding:0;
  border-radius:11px;
}

body.erp-app .cash-modal-stage{
  position:relative;
  min-width:0;
  min-height:0;
  overflow:hidden;
  background:
    linear-gradient(135deg,rgba(247,250,253,.91),rgba(233,241,248,.92)),
    url("../img/erp-workshop-bg.webp") center 38%/cover no-repeat;
}
body.erp-app .cash-modal-frame{
  position:relative;
  z-index:2;
  width:100%;
  height:100%;
  min-height:0 !important;
  border:0;
  border-radius:0;
  background:transparent;
  opacity:1;
  transition:opacity .18s ease;
}
body.erp-app .cash-modal.is-loading .cash-modal-frame{
  opacity:0;
  pointer-events:none;
}
body.erp-app .cash-modal-loading{
  position:absolute;
  z-index:3;
  inset:0;
  display:grid;
  place-content:center;
  justify-items:center;
  gap:8px;
  padding:24px;
  text-align:center;
  background:rgba(239,245,250,.69);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}
body.erp-app .cash-modal-loading[hidden]{display:none !important}
body.erp-app .cash-modal-loading strong{
  color:#132746;
  font-size:1rem;
}
body.erp-app .cash-modal-loading small{
  max-width:360px;
  color:#62728b;
}
body.erp-app .cash-modal-loader-mark{
  width:56px;
  height:42px;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  gap:5px;
}
body.erp-app .cash-modal-loader-mark span{
  width:7px;
  border-radius:999px;
  background:#102BEA;
  animation:cashLoaderBar .78s ease-in-out infinite alternate;
}
body.erp-app .cash-modal-loader-mark span:nth-child(1){height:18px;animation-delay:-.25s}
body.erp-app .cash-modal-loader-mark span:nth-child(2){height:34px;animation-delay:-.08s}
body.erp-app .cash-modal-loader-mark span:nth-child(3){height:25px;animation-delay:-.16s}
@keyframes cashLoaderBar{to{height:10px;opacity:.45}}

/* Iframe caisse : surfaces plus denses, pas de second décor concurrent. */
body.cash-embed-body{
  background:#edf3f8 !important;
}
body.cash-embed-body .cash-embed-shell{
  padding:12px;
  background:transparent;
}
body.cash-embed-body .cash-register-view.is-embed{
  gap:10px;
  padding:0;
}
body.cash-embed-body .cash-register-view.is-embed .cash-register-grid{
  gap:10px;
  grid-template-columns:minmax(0,.96fr) minmax(0,1.04fr);
}
body.cash-embed-body .cash-panel{
  padding:14px;
  border:1px solid rgba(169,188,211,.46);
  border-radius:15px;
  background:rgba(255,255,255,.91);
  box-shadow:0 8px 22px rgba(12,29,49,.06);
}
body.cash-embed-body .cash-panel-header{
  gap:6px;
  margin-bottom:2px;
}
body.cash-embed-body .cash-panel-header h2{
  font-size:17px !important;
}
body.cash-embed-body .cash-panel-header .help-text{
  font-size:11px;
}
body.cash-embed-body .cash-form{
  gap:9px !important;
}

.cash-document-search-field{
  position:relative;
}
.cash-document-search-control{
  position:relative;
}
.cash-document-search-control input{
  padding-right:42px !important;
}
.cash-document-search-spinner{
  position:absolute;
  right:13px;
  top:50%;
  width:17px;
  height:17px;
  margin-top:-8.5px;
  border:2px solid rgba(16,43,234,.16);
  border-top-color:#102BEA;
  border-radius:50%;
  opacity:0;
  animation:cashSearchSpin .72s linear infinite;
  pointer-events:none;
}
.cash-document-search-spinner.is-active{opacity:1}
@keyframes cashSearchSpin{to{transform:rotate(360deg)}}
.cash-document-search-status{
  display:block;
  margin-top:5px;
  color:#6c7b91;
  font-size:11px;
}
.cash-document-results{
  position:absolute;
  z-index:30;
  top:calc(100% - 18px);
  left:0;
  right:0;
  max-height:330px;
  overflow:auto;
  padding:5px;
  border:1px solid rgba(151,174,205,.55);
  border-radius:12px;
  background:rgba(255,255,255,.98);
  box-shadow:0 18px 42px rgba(15,32,57,.18);
}
.cash-document-results[hidden]{display:none !important}
.cash-document-results button{
  width:100%;
  min-height:48px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:8px 10px;
  border:0;
  border-radius:9px;
  background:transparent;
  color:#17263e;
  text-align:left;
  cursor:pointer;
}
.cash-document-results button:hover{
  background:#eef4ff;
}
.cash-document-results button > span{
  min-width:0;
  display:grid;
  gap:2px;
}
.cash-document-results button strong{
  color:#1254b6;
  font-size:12px;
}
.cash-document-results button small{
  overflow:hidden;
  color:#6c7890;
  font-size:10.5px;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.cash-document-results button b{
  flex:0 0 auto;
  color:#17263e;
  font-size:11.5px;
}
.cash-form.is-resolving-document button[type="submit"]{
  opacity:.62;
  pointer-events:none;
}

/* Téléphone/tablette : la caisse popup devient une vraie vue plein écran. */
@media (max-width:820px){
  body.erp-app{
    background-image:
      linear-gradient(180deg,rgba(247,250,252,.73),rgba(236,243,248,.80)),
      url("../img/erp-workshop-bg.webp");
  }

  body.erp-app .topbar{
    background:linear-gradient(105deg,rgba(7,24,45,.96),rgba(12,39,68,.93));
  }
  body.erp-app .sidebar{
    background:rgba(8,29,52,.91);
  }

  body.erp-app .cash-modal-panel{
    width:100vw;
    height:100dvh;
    max-height:100dvh;
    margin:0;
    border:0;
    border-radius:0;
  }
  body.erp-app .cash-modal-header{
    min-height:58px;
    padding:8px 10px 8px 12px !important;
  }
  body.erp-app .cash-modal-heading p,
  body.erp-app .cash-modal-eyebrow,
  body.erp-app .cash-modal-full-link{
    display:none;
  }
  body.erp-app .cash-modal-title-row h2{
    font-size:1.1rem;
  }
  body.erp-app .cash-modal-close{
    flex-basis:42px;
    width:42px;
    height:42px;
  }

  body.cash-embed-body .cash-embed-shell{
    padding:8px;
  }
  body.cash-embed-body .cash-register-view.is-embed .cash-register-grid{
    grid-template-columns:1fr;
  }
  body.cash-embed-body .cash-panel{
    padding:12px;
  }

  body.erp-page-dashboard .document-kpis{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media (max-width:620px){
  body.erp-app :is(.box,.card,.shopbar){
    background:rgba(255,255,255,.88);
  }
  body.erp-page-dashboard .document-kpi{
    min-height:48px;
  }
  .cash-document-results{
    position:fixed;
    z-index:100;
    left:10px;
    right:10px;
    top:118px;
    max-height:46dvh;
  }
}

@media (prefers-reduced-motion:reduce){
  body.erp-app .cash-modal-loader-mark span,
  .cash-document-search-spinner{
    animation:none;
  }
  body.erp-app .cash-modal-frame{
    transition:none;
  }
}

/* -------------------------------------------------------------------------
   V5.2.21 — profondeur des menus + transparence des cadres

   - Le menu « Nouveau » des documents doit toujours passer au-dessus des
     panneaux qui suivent, même si ces panneaux utilisent backdrop-filter.
   - Les grands cadres de travail deviennent un peu plus translucides afin
     de laisser respirer l'image atelier, tandis que champs et tableaux
     conservent une opacité plus forte pour la lisibilité.
   ------------------------------------------------------------------------- */
:root{
  --erp-surface:rgba(255,255,255,.73);
  --erp-surface-strong:rgba(255,255,255,.90);
  --erp-surface-soft:rgba(246,249,253,.70);
}

/* Cadres principaux : davantage de décor visible, sans rendre les textes
   ou les champs transparents. */
body.erp-app :is(.box,.card,.shopbar,.preview-card,.product-image-card,.sticky-actions),
body.erp-app details.shopbar-compact{
  background:var(--erp-surface);
  border-color:rgba(154,177,207,.42);
  box-shadow:0 10px 28px rgba(12,27,48,.07), inset 0 1px 0 rgba(255,255,255,.45);
  backdrop-filter:blur(10px) saturate(106%);
  -webkit-backdrop-filter:blur(10px) saturate(106%);
}

/* Documents : ce sont précisément les grands cadres visibles sur la page
   de liste. */
body.erp-page-documents .document-unified-toolbar--actions,
body.erp-page-documents .document-search-box,
body.erp-page-documents .document-list-box,
body.erp-page-documents .quote-followup-settings{
  background:rgba(255,255,255,.70) !important;
  border-color:rgba(151,176,208,.43) !important;
  box-shadow:0 9px 26px rgba(12,27,48,.065), inset 0 1px 0 rgba(255,255,255,.48) !important;
  backdrop-filter:blur(10px) saturate(106%);
  -webkit-backdrop-filter:blur(10px) saturate(106%);
}

/* Les zones réellement manipulées restent plus opaques. */
body.erp-page-documents .document-search-box :is(input,select),
body.erp-page-documents .document-create-menu-panel,
body.erp-app :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),select,textarea){
  background:rgba(252,253,255,.94);
}

body.erp-page-documents table{
  background:rgba(255,255,255,.80);
}
body.erp-page-documents thead th{
  background:rgba(234,242,250,.91);
}
body.erp-page-documents tbody td{
  background:rgba(255,255,255,.81);
}
body.erp-page-documents tbody tr:nth-child(even) td{
  background:rgba(247,250,253,.81);
}

/* Correctif de profondeur du menu « + Nouveau ».
   backdrop-filter crée son propre contexte d'empilement : on élève donc
   toute la barre d'actions, pas uniquement le panneau du menu. */
body.erp-page-documents .document-unified-toolbar--actions{
  position:relative;
  z-index:40;
  overflow:visible !important;
}
body.erp-page-documents .document-unified-toolbar--actions:has(.document-create-menu[open]){
  z-index:900;
}
body.erp-page-documents .document-create-menu{
  position:relative;
  z-index:910;
}
body.erp-page-documents .document-create-menu[open]{
  z-index:920;
}
body.erp-page-documents .document-create-menu-panel{
  z-index:930;
  overflow:auto;
  max-height:min(70vh,520px);
  background:rgba(250,252,255,.97) !important;
  border-color:rgba(139,164,198,.52);
  box-shadow:0 22px 54px rgba(8,24,45,.24);
  backdrop-filter:blur(14px) saturate(112%);
  -webkit-backdrop-filter:blur(14px) saturate(112%);
}
body.erp-page-documents .document-search-box,
body.erp-page-documents .document-list-box,
body.erp-page-documents .quote-followup-settings{
  position:relative;
  z-index:1;
}

/* Le bureau profite de la même transparence, mais garde les informations
   prioritaires suffisamment contrastées. */
body.erp-page-dashboard .document-kpi{
  background:rgba(255,255,255,.71) !important;
}
body.erp-page-dashboard .desk-grid > .box{
  background:rgba(255,255,255,.69);
}

/* Sur téléphone, on remonte légèrement l'opacité : la petite surface et les
   reflets rendent la transparence forte moins confortable. */
@media (max-width:820px){
  body.erp-app :is(.box,.card,.shopbar),
  body.erp-app details.shopbar-compact,
  body.erp-page-documents .document-unified-toolbar--actions,
  body.erp-page-documents .document-search-box,
  body.erp-page-documents .document-list-box,
  body.erp-page-documents .quote-followup-settings{
    background:rgba(255,255,255,.84) !important;
  }

  body.erp-page-documents .document-create-menu-panel{
    background:rgba(250,252,255,.985) !important;
  }
}

/* -------------------------------------------------------------------------
   V5.2.22 — listes épurées + aperçu d'entités sans perdre le contexte

   Les pages utilisées toute la journée (clients, articles, agenda) n'ont plus
   besoin d'un second bandeau de titre sous la navigation. Les actions sont
   ramenées dans le premier vrai cadre métier. Les aperçus client/article
   s'ouvrent au-dessus de la page courante : une facture reste donc visible en
   arrière-plan et une recherche AJAX n'est plus perdue en fermant l'aperçu.
   ------------------------------------------------------------------------- */

body.erp-page-customers .content,
body.erp-page-products .content,
body.erp-page-schedule .content{
  padding-top:14px;
}

body.erp-page-customers .box:first-of-type,
body.erp-page-products .box:first-of-type,
body.erp-page-schedule .schedule-toolbar-box{
  margin-top:0;
}

.customer-list-head-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  flex-wrap:wrap;
  gap:8px 12px;
}
.customer-list-toolbar{
  flex-wrap:nowrap;
}

body.erp-page-products .toolbar-row{
  align-items:center;
  gap:10px;
}
body.erp-page-products .toolbar-row #product-search{
  min-width:280px;
  flex:1 1 520px;
}
body.erp-page-products .catalog-toolbar-actions{
  flex:0 0 auto;
}

body.erp-page-schedule .schedule-toolbar-head{
  align-items:flex-start;
  gap:14px;
}
body.erp-page-schedule .schedule-toolbar-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  flex-wrap:wrap;
  gap:8px;
}
body.erp-page-schedule .schedule-primary-actions{
  order:3;
}
body.erp-page-schedule .schedule-toolbar-head > div:first-child p.help-text{
  max-width:620px;
  margin-bottom:0;
}

/* Aperçu universel client / article. */
.erp-modal__body > .entity-preview{
  margin:-2px -2px 0;
}
.entity-preview{
  display:grid;
  gap:18px;
  color:#15263e;
}
.entity-preview__hero{
  display:flex;
  align-items:center;
  gap:14px;
  padding:14px;
  border:1px solid rgba(145,170,204,.34);
  border-radius:16px;
  background:linear-gradient(135deg,rgba(238,245,255,.86),rgba(255,255,255,.74));
}
.entity-preview__avatar{
  flex:0 0 56px;
  width:56px;
  height:56px;
  display:grid;
  place-items:center;
  border-radius:16px;
  background:rgba(16,43,234,.10);
  color:#102bea;
  font-size:27px;
  box-shadow:inset 0 0 0 1px rgba(16,43,234,.10);
}
.entity-preview__identity{
  min-width:0;
}
.entity-preview__eyebrow{
  display:block;
  margin-bottom:3px;
  color:#66758c;
  font-size:11px;
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
}
.entity-preview__identity h3{
  margin:0;
  color:#10213b;
  font-size:1.25rem;
  line-height:1.2;
}
.entity-preview__badges{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin-top:8px;
}
.entity-preview__grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
}
.entity-preview__grid--product{
  grid-template-columns:repeat(3,minmax(0,1fr));
}
.entity-preview__field{
  min-width:0;
  padding:11px 12px;
  border:1px solid rgba(158,180,209,.32);
  border-radius:13px;
  background:rgba(249,251,254,.78);
}
.entity-preview__field span{
  display:block;
  margin-bottom:4px;
  color:#77859a;
  font-size:10.5px;
  font-weight:700;
  text-transform:uppercase;
}
.entity-preview__field strong{
  display:block;
  overflow-wrap:anywhere;
  color:#172840;
  font-size:13px;
}
.entity-preview__actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  flex-wrap:wrap;
  gap:8px;
  padding-top:2px;
}

/* L'aperçu peut être empilé au-dessus d'une facture/OR déjà ouvert. */
body.erp-app .erp-modal{
  z-index:5200;
}
body.erp-app .erp-modal__backdrop{
  background:rgba(5,20,39,.38);
  backdrop-filter:blur(4px);
  -webkit-backdrop-filter:blur(4px);
}
body.erp-app .erp-modal__panel{
  background:rgba(251,253,255,.94);
  backdrop-filter:blur(16px) saturate(108%);
  -webkit-backdrop-filter:blur(16px) saturate(108%);
}

@media (max-width:980px){
  .customer-list-head-actions{
    width:100%;
    justify-content:space-between;
  }
  body.erp-page-schedule .schedule-toolbar-head{
    flex-direction:column;
  }
  body.erp-page-schedule .schedule-toolbar-actions{
    width:100%;
    justify-content:flex-start;
  }
}

@media (max-width:820px){
  body.erp-page-customers .content,
  body.erp-page-products .content,
  body.erp-page-schedule .content{
    padding-top:10px;
  }
  .customer-list-head-actions{
    align-items:stretch;
  }
  .customer-list-head-actions .compact-kpi-strip{
    width:100%;
  }
  .customer-list-toolbar{
    width:100%;
  }
  .customer-list-toolbar > *{
    flex:1 1 auto;
  }
  body.erp-page-products .toolbar-row{
    display:grid;
    grid-template-columns:1fr 1fr;
  }
  body.erp-page-products .toolbar-row #product-search{
    grid-column:1/-1;
    min-width:0;
    width:100%;
  }
  body.erp-page-products .toolbar-row #create-product-link{
    grid-column:1/2;
  }
  body.erp-page-products .catalog-toolbar-actions{
    grid-column:2/3;
  }
  .entity-preview__grid,
  .entity-preview__grid--product{
    grid-template-columns:1fr 1fr;
  }
  .entity-preview__actions{
    justify-content:stretch;
  }
  .entity-preview__actions .button{
    flex:1 1 180px;
  }
}

@media (max-width:520px){
  .entity-preview__hero{
    align-items:flex-start;
    padding:12px;
  }
  .entity-preview__avatar{
    flex-basis:46px;
    width:46px;
    height:46px;
    border-radius:13px;
    font-size:22px;
  }
  .entity-preview__grid,
  .entity-preview__grid--product{
    grid-template-columns:1fr;
  }
  .entity-preview__actions{
    display:grid;
    grid-template-columns:1fr;
  }
  .entity-preview__actions .button{
    width:100%;
  }
}

/* ========================================================================== */
/* V5.2.32 — BL terminés : file manuelle des matériels à retirer             */
/* ========================================================================== */
body.erp-page-delivery-pickups .content{
  display:flex;
  flex-direction:column;
  gap:14px;
}
.pickup-hero{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  padding:20px 22px;
}
.pickup-hero h1{
  margin:2px 0 5px;
  font-size:clamp(1.45rem,2vw,2rem);
}
.pickup-hero p{
  max-width:850px;
  margin:0;
  color:#5f7087;
}
.pickup-eyebrow{
  color:#0e5ac7;
  font-size:11px;
  font-weight:900;
  letter-spacing:.11em;
  text-transform:uppercase;
}
.pickup-kpis{
  display:grid;
  grid-template-columns:repeat(3,minmax(110px,1fr));
  gap:8px;
  min-width:min(460px,42vw);
}
.pickup-kpis article{
  padding:12px 13px;
  border:1px solid rgba(139,165,199,.36);
  border-radius:14px;
  background:rgba(245,249,255,.72);
}
.pickup-kpis strong,
.pickup-kpis span{display:block}
.pickup-kpis strong{font-size:1.3rem;color:#112a4e}
.pickup-kpis span{margin-top:2px;color:#6c7b8f;font-size:11px;font-weight:700}
.pickup-toolbar{padding:12px 14px}
.pickup-filter-form{
  display:grid;
  grid-template-columns:minmax(280px,1fr) 150px 160px auto;
  gap:10px;
  align-items:end;
}
.pickup-filter-form label span{
  display:block;
  margin:0 0 4px 2px;
  color:#66758a;
  font-size:10px;
  font-weight:800;
  text-transform:uppercase;
}
.pickup-list{display:flex;flex-direction:column;gap:10px}
.pickup-card{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(180px,.28fr) auto;
  gap:18px;
  align-items:center;
  padding:15px 16px;
  border:1px solid rgba(143,164,193,.36);
  border-left:5px solid #2e7bf3;
  border-radius:17px;
  background:rgba(250,252,255,.86);
  box-shadow:0 12px 34px rgba(31,52,82,.07);
  backdrop-filter:blur(10px) saturate(108%);
  -webkit-backdrop-filter:blur(10px) saturate(108%);
  transition:opacity .2s ease,transform .2s ease;
}
.pickup-card.is-warning{border-left-color:#e4a11b}
.pickup-card.is-late{border-left-color:#dc3545}
.pickup-card.is-picked{opacity:.72;border-left-color:#41a777}
.pickup-card.is-removing{opacity:0;transform:translateX(16px)}
.pickup-card-main{display:flex;align-items:center;gap:14px;min-width:0}
.pickup-age{
  flex:0 0 68px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  min-height:64px;
  border-radius:15px;
  background:rgba(230,239,253,.9);
  color:#174a91;
}
.pickup-card.is-warning .pickup-age{background:#fff4d7;color:#8b5a00}
.pickup-card.is-late .pickup-age{background:#ffeaec;color:#a92331}
.pickup-age strong{font-size:1.35rem;line-height:1}
.pickup-age span{margin-top:4px;font-size:10px;font-weight:800;text-transform:uppercase}
.pickup-identity{min-width:0}
.pickup-line-title{display:flex;align-items:center;flex-wrap:wrap;gap:8px}
.pickup-line-title a{font-weight:900;color:#075dbd}
.pickup-identity h2{
  overflow:hidden;
  margin:5px 0 3px;
  color:#14263f;
  font-size:1rem;
  line-height:1.2;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.pickup-identity p{margin:0;color:#617189;font-size:12px}
.pickup-contact-strip{display:flex;flex-wrap:wrap;gap:10px;margin-top:7px;color:#485d79;font-size:11px}
.pickup-followup{
  display:grid;
  grid-template-columns:minmax(120px,1fr) 70px;
  gap:8px;
}
.pickup-followup > div{
  padding:9px 10px;
  border-radius:12px;
  background:rgba(241,246,252,.82);
}
.pickup-followup span,.pickup-followup strong,.pickup-followup small{display:block}
.pickup-followup span{color:#7a8799;font-size:9px;font-weight:800;text-transform:uppercase}
.pickup-followup strong{margin-top:3px;color:#1a314e;font-size:12px}
.pickup-followup small{margin-top:2px;color:#697a91;font-size:10px}
.pickup-actions{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:7px;max-width:520px}
.pickup-actions form{margin:0}
.pickup-done{background:#16885e;border-color:#16885e}
.pickup-message-preview{position:relative}
.pickup-message-preview summary{
  cursor:pointer;
  padding:8px 10px;
  border:1px solid rgba(133,158,191,.42);
  border-radius:10px;
  color:#334d6f;
  background:rgba(247,250,254,.85);
  font-size:11px;
  font-weight:800;
  list-style:none;
}
.pickup-message-preview summary::-webkit-details-marker{display:none}
.pickup-message-preview[open]{width:100%}
.pickup-message-preview textarea{
  width:100%;
  min-height:170px;
  margin-top:7px;
  resize:vertical;
  line-height:1.45;
}
.pickup-empty{display:flex;flex-direction:column;gap:4px;padding:24px;text-align:center;color:#617189}
.pickup-empty strong{color:#17304f;font-size:1.05rem}
.pickup-toast{
  position:fixed;
  right:24px;
  bottom:24px;
  z-index:8000;
  max-width:min(430px,calc(100vw - 32px));
  padding:12px 15px;
  border-radius:13px;
  background:#153451;
  color:#fff;
  box-shadow:0 16px 42px rgba(8,28,52,.25);
  opacity:0;
  transform:translateY(12px);
  pointer-events:none;
  transition:.2s ease;
}
.pickup-toast.is-visible{opacity:1;transform:translateY(0)}
.pickup-toast.is-error{background:#a82f3b}

@media (max-width:1200px){
  .pickup-card{grid-template-columns:minmax(0,1fr) minmax(180px,.38fr)}
  .pickup-actions{grid-column:1/-1;justify-content:flex-start;max-width:none;padding-left:82px}
}
@media (max-width:900px){
  .pickup-hero{align-items:stretch;flex-direction:column}
  .pickup-kpis{min-width:0;width:100%}
  .pickup-filter-form{grid-template-columns:1fr 1fr}
  .pickup-filter-form input[type="search"]{grid-column:1/-1}
  .pickup-card{grid-template-columns:1fr}
  .pickup-followup{grid-template-columns:1fr 90px}
  .pickup-actions{grid-column:auto;padding-left:0;justify-content:flex-start}
}
@media (max-width:560px){
  .pickup-hero{padding:16px}
  .pickup-kpis{grid-template-columns:1fr 1fr}
  .pickup-kpis article:last-child{grid-column:1/-1}
  .pickup-filter-form{grid-template-columns:1fr}
  .pickup-filter-form input[type="search"]{grid-column:auto}
  .pickup-card{padding:12px}
  .pickup-card-main{align-items:flex-start}
  .pickup-age{flex-basis:56px;min-height:56px}
  .pickup-identity h2{white-space:normal}
  .pickup-followup{grid-template-columns:1fr 76px}
  .pickup-actions{display:grid;grid-template-columns:1fr 1fr}
  .pickup-actions form,.pickup-actions .button,.pickup-message-preview{width:100%}
  .pickup-actions form .button{width:100%}
  .pickup-message-preview{grid-column:1/-1}
  .pickup-toast{right:16px;bottom:92px}
}
