@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap');

:root{
   /* Elysium — Palette: bleu-vert / gris clair / accent framboise */
   --navy:#0f4c5c;
   --navy-2:#1c6a78;
   --cta:#1a7f73;
   --cta-2:#16685f;
   --cta-rgb:26, 127, 115;

   --red:#d94b63;
   --red-2:#be3f55;
   --red-rgb:217, 75, 99;

   --bg:#eef1f4;
   --card:#ffffff;

   --text:#123840;
   --muted:rgba(18, 56, 64, .72);
   --line:rgba(18, 56, 64, .12);

   --shadow:0 10px 22px rgba(8, 31, 37, .09);
   --radius:12px;
   --sidebar-width:208px;
   --sidebar-collapsed-width:84px;
   --topbar-height:108px;
   --underline-white:rgba(255,255,255,.62);
   --underline-white-soft:rgba(255,255,255,.52);
   --font-ui:"Manrope","Avenir Next","Segoe UI","Helvetica Neue",Arial,sans-serif;
 }

 *{box-sizing:border-box;}
 html,body{height:100%;}
body{
  margin:0;
  font-family:var(--font-ui);
  font-size:16.2px;
  color:var(--text);
  background:var(--bg);
}

button,
input,
select,
textarea{
  font-family:inherit;
}
a{color:inherit;text-decoration:none;}

/* Avoid visual flash on protected pages before auth/permissions are applied */
body[data-require-auth="1"]:not(.app-ready) .app{
  visibility:hidden;
  opacity:0;
}

 /* Topbar */
 .topbar{
   position:sticky;
   top:0;
   z-index:20;
   height:108px;
   background:linear-gradient(90deg, var(--navy), var(--navy-2));
   color:white;
   display:flex;
   align-items:center;
   padding:0 18px;
   border-bottom:0;
   box-shadow:0 6px 14px rgba(0,0,0,.10);
 }

.topbar::after{display:none;}

.topbar__left{
  display:flex;
  align-items:flex-end;
  justify-content:flex-start;
  min-width:0;
  flex:0 0 var(--sidebar-width);
  max-width:var(--sidebar-width);
  padding-left:8px;
  padding-bottom:4px;
}
.topbar__right{display:flex;align-items:center;gap:12px;flex:1;justify-content:flex-end;}
.topbar__left .brand{
  transform:translate(-8px, -3px);
  transform-origin:left bottom;
}

/* Center logo (Elysiom) */
.topbar__center-logo{
  height:66px;
  width:auto;
  display:block;
  object-fit:contain;
}

@media (max-width:980px){
  .topbar__center-logo{height:56px;}
  .brand__logo-v2{
    width:min(239px, calc(var(--sidebar-width) + 87px));
    height:66px;
  }
}

@media (max-width:520px){
  .topbar__center-logo{height:48px;}
  .brand__logo-v2{
    width:min(212px, calc(var(--sidebar-width) + 69px));
    height:59px;
  }
}

 .icon-btn{
   height:38px;width:38px;
   border:1px solid rgba(255,255,255,.18);
   background:rgba(255,255,255,.08);
   color:white;
   border-radius:10px;
   cursor:pointer;
 }

 .brand{display:flex;align-items:center;gap:10px;min-width:0;}
.brand__logo{
  width:44px;height:44px;
  border-radius:14px;
  display:grid;place-items:center;
  background:transparent;
  border:none;
  padding:0;
  flex:0 0 auto;
}
.brand__logo .a2z-mark{width:44px;height:44px;display:block;}
.brand__logo-full{
  display:block;
  width:min(240px, calc(var(--sidebar-width) + 48px));
  height:58px;
  max-width:100%;
  object-fit:contain;
  object-position:left center;
  pointer-events:none;
}
.brand__logo-split{
  position:relative;
  display:block;
  width:min(258px, calc(var(--sidebar-width) + 68px));
  height:118px;
  pointer-events:none;
}
.brand__logo-layer{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  display:block;
  max-width:none;
  max-height:none;
  object-fit:contain;
}
.brand__logo-layer--symbol{
  object-position:center top;
  clip-path:inset(0 0 40% 0);
  transform:translate(-6px, 8px) scale(.84);
  transform-origin:center 30%;
}
.brand__logo-layer--wordmark{
  object-position:center bottom;
  clip-path:inset(56% 0 0 0);
  transform:translate(-6px, 16px) scale(1.10);
  transform-origin:center bottom;
}
.brand__logo-v2{
  display:none;
  width:min(279px, calc(var(--sidebar-width) + 126px));
  height:74px;
  max-width:none;
  max-height:none;
  object-fit:contain;
  object-position:center;
  pointer-events:none;
}
.topbar.topbar--brand-v2 .topbar__left .brand{
  transform:translate(7px, 3px);
  transform-origin:left bottom;
}
.topbar.topbar--brand-v2 .brand__logo-split{
  display:none;
}
.topbar.topbar--brand-v2 .brand__logo-v2{
  display:block;
}
.brand.brand--image.brand--fallback .brand__logo-split{display:none;}
.brand.brand--image.brand--fallback .brand__logo-v2{display:none;}
 .brand__text{display:flex;flex-direction:column;min-width:0;}
 .brand__name{font-weight:900;letter-spacing:.2px;}
.brand__tagline{font-size:12px;opacity:.9;white-space:normal;line-height:1.15;}
.brand.brand--image:not(.brand--fallback) .brand__text{display:none;}
.brand.brand--image.brand--fallback .brand__text{display:flex;}
 .signature{font-weight:700;opacity:.95;white-space:nowrap;}

 /* Layout */
 .layout{
   display:grid;
   grid-template-columns: var(--sidebar-width) 1fr;
   min-height:calc(100vh - 108px);
 }

 .sidebar{
   background:linear-gradient(180deg, var(--navy), var(--navy-2));
   color:white;
   padding:14px;
   border-right:1px solid rgba(255,255,255,.10);
   display:flex;
   flex-direction:column;
 }
 .sidebar__header{
   padding:4px 6px 6px;
   border-bottom:0;
   margin-bottom:0;
   box-shadow:none;
 }
.sidebar__brand{position:relative;}
.sidebar__logo{
  width:100%;
  height:96px;
  overflow:hidden;
  opacity:.95;
}
.sidebar__logo-img{
  width:100%;
  height:100%;
  display:block;
  object-fit:contain;
  object-position:center;
  transform:scale(1.39);
}
 .sidebar__suite-name{font-weight:900;letter-spacing:.2px;}
 .sidebar__suite-tagline{font-size:12px;opacity:.9;margin-top:2px;}
.sidebar__suite-sign{font-size:12px;opacity:.9;margin-top:6px;font-weight:700;}

/* Sidebar top line: toggle on an independent row */
.snav__topline{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
  margin:2px 0 12px;
  padding:0;
}

.snav__home-row{
  border-top:1px solid var(--underline-white);
  border-bottom:1px solid var(--underline-white);
  margin:0 0 10px;
  padding:8px 0;
}

.snav__item--home{
  display:inline-flex;
  flex:0 0 auto;
  align-self:flex-start;
  min-width:auto;
  margin:0;
  border-bottom:0;
}

.snav__toggle-inline{
  flex:0 0 auto;
  min-width:34px;
  width:34px;
  height:34px;
  border:1px solid rgba(255,255,255,.24);
  background:rgba(255,255,255,.08);
  color:#fff;
  border-radius:10px;
  font-weight:800;
}
.snav__toggle-inline:hover{
  background:rgba(255,255,255,.14);
  border-color:rgba(255,255,255,.34);
}

#sidebarToggle{position:static;}

/* Icons in sidebar nav */
.snav__icon{width:20px;height:20px;display:inline-flex;align-items:center;justify-content:center;flex:0 0 20px;}
.snav__icon svg{width:20px;height:20px;display:block;}

/* Tooltip for collapsed sidebar */
.snav__tip{position:relative;}
.snav__tip::after{
  content:attr(data-tip);
  position:absolute;
  left:62px;
  top:50%;
  transform:translateY(-50%);
  background:rgba(0,0,0,.78);
  color:#fff;
  font-size:12px;
  font-weight:800;
  padding:6px 8px;
  border-radius:10px;
  white-space:nowrap;
  opacity:0;
  pointer-events:none;
  transition:opacity .15s ease;
}
body.sidebar-collapsed .snav__tip:hover::after{opacity:1;}
 .sidebar__footer{
   margin-top:18px;
   padding:10px;
   border-top:1px solid rgba(255,255,255,.12);
   display:flex;
   justify-content:space-between;
 }
 .muted-on-navy{opacity:.85;font-size:12px;}

 /* Breadcrumb */
 .breadcrumb{margin-left:10px;min-width:0;}
 .breadcrumb ol{list-style:none;display:flex;align-items:center;gap:8px;margin:0;padding:0;}
 .breadcrumb li{display:flex;align-items:center;gap:8px;white-space:nowrap;}
 .breadcrumb li+li::before{content:"›";opacity:.9;}
 .breadcrumb a{color:rgba(255,255,255,.92);text-decoration:none;}
 .breadcrumb a[aria-current="page"]{font-weight:900;color:white;}

 /* Side nav */
 .snav{display:flex;flex-direction:column;gap:6px;}
 .snav{
  flex:1;
  justify-content:flex-start;
  padding-top:14px;
 }
.snav__item,
.snav__summaryLink{
   display:flex;
   align-items:center;
   gap:8px;
   padding:8px 8px;
   border-radius:12px;
   text-decoration:none;
   color:rgba(255,255,255,.92);
   font-size:12.5px;
   line-height:1.15;
 }

.snav__sub{
  display:flex;
  align-items:center;
  gap:8px;
  padding:8px 8px;
  border-radius:10px;
  text-decoration:none;
  color:rgba(255,255,255,.92);
  font-size:12px;
  line-height:1.2;
  position:relative;
}
 .snav__item > span:last-child,
 .snav__summaryLink > span:last-child{
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  letter-spacing:.1px;
 }
 .snav__item:hover,
.snav__sub:hover,
.snav__summaryLink:hover{background:rgba(var(--red-rgb), .12);}

/* Top-level sidebar links keep the same white separators as grouped sections */
.snav > .snav__item:not(.snav__item--home){
  border-bottom:1px solid var(--underline-white);
  border-radius:0;
  margin-bottom:6px;
  padding-bottom:8px;
}

 .snav__group{border-radius:12px;}
 .snav__group > summary{
   list-style:none;
   cursor:pointer;
   padding:0;

   /* Séparateur blanc entre section (summary) et fonctionnalités (sous-liens) */
   border-bottom:1px solid var(--underline-white);
   padding-bottom:8px;
   margin-bottom:6px;
 }

.snav__sub{
  padding-left:34px;
}

.snav__sub:not(.snav__sub--heading):not(.snav__sub--level2){
  margin-left:6px;
  padding-left:14px;
  border-left:2px solid rgba(255,255,255,.22);
  background:rgba(255,255,255,.03);
}
.snav__sub--heading{
  color:rgba(255,255,255,.78);
  font-weight:800;
  font-size:10.5px;
  letter-spacing:.35px;
  text-transform:uppercase;
  pointer-events:none;
  cursor:default;
  margin:2px 0 2px 6px;
  padding:2px 0 2px 12px;
  border-left:2px solid rgba(255,255,255,.30);
}
.snav__sub--level2{
  margin-left:20px;
  padding-left:18px;
  border-left:1px dashed rgba(255,255,255,.32);
  color:rgba(255,255,255,.88);
}
.snav__sub--level2::before{
  content:"";
  position:absolute;
  left:7px;
  top:50%;
  width:7px;
  height:1px;
  background:rgba(255,255,255,.48);
  transform:translateY(-50%);
}

.snav__group[open] > summary .snav__summaryLink,
.snav__group.is-active-branch > summary .snav__summaryLink{
  background:rgba(255,255,255,.10);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.22);
}
.snav__sub.is-active,
.snav__item.is-active,
.snav__summaryLink.is-active{
  background:rgba(255,255,255,.14);
  color:#fff;
  font-weight:800;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.28);
}

.snav__sub.is-active{
  background:rgba(var(--red-rgb), .22);
  color:#fff;
  font-weight:800;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.22);
}

 /* Main */
 .main{padding:22px; min-width:0;}
 .page-head h1{margin:0 0 6px 0;}
 .muted{color:var(--muted);margin:0;}
 .a2z-stack{display:grid; gap:16px; align-content:start;}

 .grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:16px;}
 .card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:16px;}

 /* Cards “chapitres” */
.card--chapter{
  padding:0;
  overflow:hidden;
  border:1px solid rgba(18, 56, 64, .12);
  box-shadow:0 14px 28px rgba(9,20,41,.08);
}
.card--chapter > .card__body{
  padding:14px 16px 16px;
  background:
    radial-gradient(circle at right top, rgba(var(--red-rgb), .06), transparent 58%),
    linear-gradient(180deg, #f8fbff 0%, #f2f6fd 100%);
}
.card__head{
  background:linear-gradient(90deg, var(--navy), var(--navy-2));
  color:#fff;
  padding:14px 16px;
  border-bottom:1px solid rgba(255,255,255,.12);
  box-shadow: inset 0 -2px 0 var(--underline-white-soft);
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  flex-wrap:wrap;
 }
.card__head .card__actions{margin-left:auto;}
.card__head .btn{color:var(--navy);}
.card__head .btn--primary,
.card__head .btn--danger{color:#fff;}
.card__head .btn--ghost{
  background:rgba(255,255,255,.10);
  color:#fff;
  border-color:rgba(255,255,255,.24);
}
.card__head .btn--ghost:hover{
  background:rgba(255,255,255,.16);
  border-color:rgba(255,255,255,.36);
}
.card__title{font-weight:900;margin:0; letter-spacing:.2px;}
.card__subtitle{
  margin:6px 0 0;
  color:rgba(255,255,255,.88);
  font-size:12px;
  font-weight:700;
}

/* Form controls inside chapter cards */
.card--chapter input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
.card--chapter select,
.card--chapter textarea{
  border-radius:12px;
  border:1px solid var(--line);
  background:#fff;
  color:var(--navy);
}
.card--chapter input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):focus,
.card--chapter select:focus,
.card--chapter textarea:focus{
  outline:none;
  border-color:rgba(var(--red-rgb), .58);
  box-shadow:0 0 0 3px rgba(var(--red-rgb), .12);
}

.stack{display:flex;flex-direction:column;gap:10px;}

/* =========================================================
   Home dashboard (index.html)
   ========================================================= */

/* Ensure the dashboard chapter card takes full available width */
.home-dashboard{width:100%;}

/* KPI grid */
.dash-grid{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:12px;
}

.dash-kpi{
  background:#fff;
  border:1px solid var(--line);
  border-radius:14px;
  padding:12px 14px;
  box-shadow:var(--shadow);
}

.dash-kpi__label{color:var(--muted); font-weight:900; font-size:12px;}
.dash-kpi__value{font-weight:950; font-size:24px; margin-top:6px; line-height:1.1;}
.dash-kpi__hint{color:var(--muted); font-size:12px; margin-top:4px;}

/* Panels */
.dash-panels{
  display:grid;
  grid-template-columns:1.25fr .75fr;
  gap:12px;
  margin-top:12px;
  align-items:start;
}

.dash-panel{
  background:#fff;
  border:1px solid var(--line);
  border-radius:14px;
  padding:12px 14px;
  box-shadow:var(--shadow);
}

.dash-panel__head{display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:10px;}
.dash-panel__title{margin:0; font-weight:950; font-size:14px;}
.dash-panel__meta{color:var(--muted); font-size:12px; font-weight:800; white-space:nowrap;}

/* Bars */
.dash-bars{display:grid; gap:10px;}
.dash-bar{
  display:grid;
  grid-template-columns:160px 1fr 56px;
  gap:10px;
  align-items:center;
}
.dash-bar__label{font-weight:900; color:var(--navy); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.dash-bar__track{height:10px; border-radius:999px; background:rgba(18, 56, 64, .08); overflow:hidden;}
.dash-bar__fill{height:100%; border-radius:999px; background:var(--red); width:0%;}
.dash-bar__val{text-align:right; color:var(--muted); font-weight:900; font-size:12px;}

/* Actions */
.dash-actions{display:flex; flex-direction:column; gap:10px;}

@media (max-width:1100px){
  .dash-grid{grid-template-columns:repeat(2, minmax(0, 1fr));}
  .dash-panels{grid-template-columns:1fr;}
  .dash-bar{grid-template-columns:140px 1fr 56px;}
}

@media (max-width:520px){
  .dash-grid{grid-template-columns:1fr;}
  .dash-bar{grid-template-columns:120px 1fr 48px;}
}
.btn{display:inline-flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 12px;border-radius:12px;border:1px solid var(--line);background:#fff;text-decoration:none;font-weight:800;}
.btn:hover{border-color:var(--cta);}
.btn--primary{background:var(--cta);color:#fff;border-color:var(--cta);}
.btn--primary:hover{background:var(--cta-2);border-color:var(--cta-2);}
.btn--ghost{
  background:transparent;
  color:var(--navy);
  border-color:var(--line);
}
.btn--ghost:hover{border-color:var(--cta);}

.btn--danger{
  background:var(--red);
  color:#fff;
  border-color:var(--red);
}
.btn--danger:hover{background:var(--red-2);border-color:var(--red-2);}

 .page-footer{margin-top:22px;color:var(--muted);font-size:12px;}

@media (max-width:980px){
  .topbar::after{display:none;}
  .topbar__left{
    flex:1 1 auto;
    max-width:none;
    justify-content:flex-start;
  }
   .topbar__left .brand{
     transform:translate(-2px, 7px);
     transform-origin:left bottom;
   }
   .layout{grid-template-columns:1fr;}
   .grid{grid-template-columns:1fr;}
   .signature{display:none;}
   .brand__logo-split{
     width:min(200px, 54vw);
     height:92px;
   }
 }

 /* Volets */
 .a2z-volet{border:1px solid var(--line);border-radius:14px;overflow:hidden;background:#fff;}
 .a2z-volet__head{background:rgba(18, 56, 64, .06);border-bottom:1px solid var(--line);padding:10px 12px;display:flex;align-items:center;justify-content:space-between;gap:10px;}
 .a2z-volet__title{margin:0;font-weight:900;font-size:15px;line-height:1.1;}
 .a2z-volet__meta{font-size:12px;color:var(--muted);}
 .a2z-volet__body{padding:12px 14px;}

 /* Logo fix */
 .navbar-brand{display:flex;align-items:center;gap:10px}
 .navbar-brand .regular-logo{height:28px;width:auto;display:block}
 .topbar__left{display:flex;align-items:flex-end;justify-content:flex-start;gap:0}
 .brand__text{display:flex;flex-direction:column;line-height:1.1}

 /* =========================================================
    Compat — pages du nouveau projet (sans changer le look A2Zen)
    ========================================================= */

 .app{min-height:100vh;}
 .sidebar--navy{ /* no-op */ }

@media (min-width:981px){
  .app{
    min-height:100vh;
    height:100vh;
    height:100dvh;
    display:grid;
    grid-template-rows:var(--topbar-height) minmax(0, 1fr);
    overflow:hidden;
  }

  .layout{
    min-height:0;
    height:100%;
    overflow:hidden;
  }

  .sidebar{
    min-height:0;
    height:100%;
    overflow:auto;
  }

  .main{
    min-height:0;
    height:100%;
    overflow:auto;
    overscroll-behavior:contain;
  }
}

 .topbar__login{
   height:40px;
   padding:0 14px;
   border-radius:12px;
   border:1px solid rgba(255,255,255,.18);
   background:rgba(255,255,255,.10);
   color:#fff;
   cursor:pointer;
   font-weight:900;
 }
 .topbar__login:hover{background:rgba(255,255,255,.16); border-color:rgba(255,255,255,.28);}

 .a2z-dialog{border:none; padding:0; background:transparent;}

.a2z-dialog[open]{
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px; /* gives space to drag without touching viewport edges */
}

/* =========================================================
   Dialog positioning — Exploitant create modal
   Keep it centered like other creation modals.
   ========================================================= */
#exploitantCreateDialog[open]{
  position:fixed;
  inset:0;
  width:100vw;
  height:100vh;
  height:100dvh;
  max-width:none;
  max-height:none;
  margin:0;
  border:0;
  display:flex;
  align-items:center;
  justify-content:center;
  /*
    Center relative to the main content area (right of sidebar),
    so this modal aligns visually with other creation modals.
  */
  padding:24px 24px 24px calc(var(--sidebar-width) + 24px);
  overflow:auto;
}

#exploitantCreateDialog[open] .a2z-dialog__card{
  /* Neutralize all horizontal/drag offsets for this modal */
  margin:0 !important;
  transform:none !important;
  left:auto !important;
  top:auto !important;
  position:relative !important;
}

@media (max-width: 980px){
  #exploitantCreateDialog[open]{
    padding:16px;
  }
}

.a2z-dialog__card{
  width:min(460px, calc(100vw - 24px));
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:#fff;
  box-shadow:var(--shadow);
  padding:14px;
  position:relative; /* helps drag scripts that rely on offsets */
  overflow:hidden;
}

/* =========================================================
   Form controls used by exploitant-list modal (class .input)
   ========================================================= */

.input{
  width:100%;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid var(--line);
  background:#fff;
  color:var(--text);
  font:inherit;
}

.input:disabled{
  background:rgba(18, 56, 64, .03);
  color:rgba(18, 56, 64, .85);
}

/* Compact inputs inside dialogs */
.a2z-dialog__card .input{
  padding:8px 10px;
  border-radius:10px;
  font-size:14px;
}

/* =========================================================
   Dynamic cards (Représentant légal / Bénéficiaire / Contact)
   ========================================================= */

.a2z-dyncard{
  border:1px solid var(--line);
  border-radius:16px;
  background:#fff;
  padding:14px;
  box-shadow:0 8px 18px rgba(9,20,41,.06);
}

.a2z-dyncard + .a2z-dyncard{ margin-top:12px; }

/* Title row inside cards */
.a2z-dyncard__head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  margin-bottom:12px;
}

/* Grid responsiveness */
.a2z-dyncard__grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:12px;
}

@media (max-width: 920px){
  .a2z-dyncard__grid{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 560px){
  .a2z-dyncard__grid{ grid-template-columns:1fr; }
}

/* =========================================================
   Volets: more compact headers (DIALOGS ONLY)
   ========================================================= */

.a2z-dialog__card .a2z-volet__head{
  padding:8px 12px;
}

.a2z-dialog__card .a2z-volet__title{
  font-size:14px;
}

.a2z-dialog__card .a2z-volet__body{
  padding:10px 12px;
}

/* =========================================================
   Dialog modifiers (wide + shifted + draggable)
   ========================================================= */

.a2z-dialog__card--wide{
  width:min(980px, calc(100vw - 32px));
}

/* Initial offset to the right (≈ 3 cm on typical screens)
   NOTE: kept as a transform so JS drag can still override with translate(x,y). */
/* Slight right offset like the reference screenshot */
.a2z-dialog__card--shifted{
  /* Use margin instead of transform so the dialog layout can clamp properly */
  transform:none;
  margin-left:180px;
}

/* When wide + shifted, reduce width so we never overflow the viewport */
.a2z-dialog__card--wide.a2z-dialog__card--shifted{
  width:min(980px, calc(100vw - 32px - 180px));
}

/* On small screens, don't shift dialogs off-center */
@media (max-width: 720px){
  .a2z-dialog__card--shifted{
    margin-left:0;
    width:min(980px, calc(100vw - 32px));
  }
}

/* Cursor hint for draggable headers */
.a2z-dialog__drag-handle{
  cursor:move;
  user-select:none;
}

/* During drag, prevent text selection */
.a2z-dialog__dragging *{
  user-select:none !important;
}
.a2z-dialog__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  background:linear-gradient(90deg, var(--navy), var(--navy-2));
  color:#fff;
  padding:22px 16px; /* bandeau plus haut */
  border-bottom:1px solid rgba(255,255,255,.12);
  box-shadow: inset 0 -2px 0 var(--underline-white-soft);
  position:relative; /* permet de centrer le titre même avec des boutons */
  border-top-left-radius:var(--radius);
  border-top-right-radius:var(--radius);
}
.a2z-dialog__title{
  margin:0;
  font-weight:900;
  text-transform:uppercase;
  font-size:18px; /* titre légèrement plus grand */
  letter-spacing:.3px;
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  width:calc(100% - 40px);
  text-align:center;
  pointer-events:none; /* évite de gêner le clic sur les boutons */
}

/* Operation create modal: same layout spirit as exploitant create modal */
#operationModal[open]{
  position:fixed;
  top:0;
  right:0;
  bottom:0;
  left:var(--sidebar-width);
  width:auto;
  height:auto;
  max-width:none;
  max-height:none;
  margin:0;
  border:0;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px;
  overflow:auto;
}

@media (max-width: 980px){
  #operationModal[open]{
    left:0;
    padding:16px;
  }
}

body.sidebar-collapsed #operationModal[open]{
  left:84px;
}

@media (max-width: 980px){
  body.sidebar-collapsed #operationModal[open]{
    left:0;
  }
}

#operationModal .a2z-dialog__card{
  width:min(980px, calc(100vw - var(--sidebar-width) - 32px));
  max-height:calc(100vh - 48px);
  margin:0 !important;
  transform:none !important;
  display:flex;
  flex-direction:column;
  padding:0;
  overflow:hidden;
}

body.sidebar-collapsed #operationModal .a2z-dialog__card{
  width:min(980px, calc(100vw - 84px - 32px));
}

@media (max-width: 980px){
  #operationModal .a2z-dialog__card{
    width:min(980px, calc(100vw - 32px));
  }
}

#operationModal .a2z-dialog__head{
  flex:0 0 auto;
}

#operationModal .a2z-dialog__close{
  background:var(--red);
  color:#fff;
  border:1px solid rgba(255,255,255,.75);
  border-radius:12px;
  width:auto;
  height:auto;
  padding:8px 12px;
  line-height:1;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  position:absolute;
  right:14px;
  top:50%;
  transform:translateY(-50%);
  font-weight:900;
  margin-left:0;
}

#operationModal .a2z-dialog__form{
  display:flex;
  flex-direction:column;
  min-height:0;
  flex:1 1 auto;
}

#operationModal .a2z-dialog__body{
  flex:1 1 auto;
  min-height:0;
  overflow:auto;
  max-height:70vh;
  padding:14px 16px 16px;
}

#operationModal .a2z-dialog__actions{
  flex:0 0 auto;
  padding:10px 16px 14px;
  border-top:1px solid var(--line);
  background:#fff;
}

/* Liste exploitants : le titre est un <div id="exploitantDetailTitle"> (pas une classe) */
#exploitantDetailTitle{
  font-weight:900;
  text-transform:uppercase;
  font-size:24px;
  letter-spacing:.3px;
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  width:calc(100% - 140px);
  text-align:center;
  pointer-events:none;
}
.a2z-dialog__close{
  appearance:none;
  border:2px solid rgba(var(--red-rgb), .95);
  background:#fff; /* blanc avec contour rouge */
  color:var(--red);
  height:38px;
  min-width:38px;
  padding:0 10px;
  border-radius:999px;
  font-size:18px;
  line-height:1;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.a2z-dialog__head .a2z-dialog__close{
  display:none !important;
}
.a2z-dialog__close:hover{
  background:rgba(var(--red-rgb), .08);
}
/* Bouton Fermer dans le bandeau des modales : blanc + contour rouge + à droite */
.a2z-dialog__head .btn--danger{
  background:#fff;
  color:var(--red);
  border-color:rgba(var(--red-rgb), .95);
}
.a2z-dialog__head .btn--danger:hover{
  background:rgba(var(--red-rgb), .08);
  border-color:rgba(var(--red-rgb), .95);
}
/* Exploitant create : bandeau bleu jusqu’aux arrondis + contenu avec padding */
#exploitantCreateDialog[open] .a2z-dialog__card{
  padding:0; /* enlève le padding du card pour que le bandeau colle aux bords */
  overflow:hidden; /* assure le clipping sur les arrondis */
}

#exploitantCreateDialog[open] .a2z-dialog__body{
  padding:14px 16px 16px;
}

 .a2z-dialog__body{display:grid; gap:10px; padding:10px 0;}
 .a2z-field{display:grid; gap:6px;}
 .a2z-input{padding:10px 12px; border-radius:12px; border:1px solid var(--line); font:inherit;}

 /* =========================================================
   Operation create — form grid + native controls styling
   (inputs/select/textarea in .a2z-field, even without .a2z-input)
   ========================================================= */

.a2z-form__grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:12px;
  align-items:start;
}

@media (max-width: 860px){
  .a2z-form__grid{ grid-template-columns:1fr; }
}

/* Reusable compact-width helpers for dense create/edit forms. */
.a2z-form__grid .a2z-field[class*="a2z-field--fit-"]{
  justify-self:start;
}
.a2z-form__grid .a2z-field--fit-id{
  width:min(100%, 12ch);
  max-width:12ch;
}
.a2z-form__grid .a2z-field--fit-rate{
  width:min(100%, 13ch);
  max-width:13ch;
}
.a2z-form__grid .a2z-field--fit-money{
  width:min(100%, 18ch);
  max-width:18ch;
}
.a2z-form__grid .a2z-field--fit-short{
  width:min(100%, 20ch);
  max-width:20ch;
}
.a2z-form__grid .a2z-field--fit-select{
  width:min(100%, 24ch);
  max-width:24ch;
}
.a2z-form__grid .a2z-field--fit-default{
  width:min(100%, 22ch);
  max-width:22ch;
}
.a2z-form__grid .a2z-field--fit-wide{
  grid-column:span 2;
  width:100%;
  max-width:none;
}
.a2z-form__grid .a2z-field--fit-full{
  grid-column:1 / -1;
  width:100%;
  max-width:none;
}

.a2z-field label{
  font-weight:900;
  font-size:13px;
  letter-spacing:.1px;
}

/* Style native form controls used in operation-create.php */
.a2z-field input,
.a2z-field select,
.a2z-field textarea{
  width:100%;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid var(--line);
  background:#fff;
  color:var(--text);
  font:inherit;
}

.a2z-dialog__card .a2z-field input,
.a2z-dialog__card .a2z-field select,
.a2z-dialog__card .a2z-field textarea{
  padding:8px 10px;
  border-radius:10px;
  font-size:14px;
}

.a2z-field textarea{ resize:vertical; min-height:84px; }

.a2z-field input[readonly]{
  background:rgba(18, 56, 64, .03);
  color:rgba(18, 56, 64, .88);
}

.a2z-field select{
  appearance:none;
  background-image:
    linear-gradient(45deg, transparent 50%, rgba(18, 56, 64, .65) 50%),
    linear-gradient(135deg, rgba(18, 56, 64, .65) 50%, transparent 50%);
  background-position:
    calc(100% - 18px) calc(1em + 2px),
    calc(100% - 13px) calc(1em + 2px);
  background-size:5px 5px, 5px 5px;
  background-repeat:no-repeat;
  padding-right:34px;
}

/* =========================================================
   Accordions — toggle + panel
   ========================================================= */

.a2z-accordion__toggle{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:10px 12px;
  border-radius:14px;
  border:1px solid var(--line);
  background:rgba(18, 56, 64, .04);
  color:var(--navy);
  font-weight:950;
  cursor:pointer;
}

.a2z-accordion__toggle::after{
  content:"▾";
  font-size:14px;
  opacity:.85;
  transform:translateY(-1px);
}

.a2z-accordion__toggle.is-open{
  background:rgba(var(--red-rgb), .08);
  border-color:rgba(var(--red-rgb), .45);
}

.a2z-accordion__toggle.is-open::after{
  content:"▴";
}

.a2z-accordion__panel{
  display:none;
  border:1px solid var(--line);
  border-radius:14px;
  padding:12px;
  background:#fff;
}

.a2z-accordion__panel.is-open{ display:block; }

/* Give breathing space between accordion blocks */
.a2z-dialog__body > .a2z-accordion__toggle{ margin-top:6px; }
.a2z-dialog__body > .a2z-accordion__toggle:first-of-type{ margin-top:0; }

 /* Compact form controls inside dialogs */
 .a2z-dialog__card .a2z-input{
   padding:8px 10px;
   border-radius:10px;
   font-size:14px;
 }
 .a2z-dialog__card label > div{ /* label title blocks inside the form */
   margin-bottom:5px !important;
   font-size:13px;
 }
 .a2z-dialog__body{display:grid; gap:10px; padding:10px 0;}
 .a2z-dialog__card .grid{gap:12px !important; margin-top:12px !important;}
 .a2z-dialog__card .muted{font-size:12px;}
 .a2z-hint{margin:0; color:var(--muted); font-size:12px;}
 .a2z-dialog__actions{display:flex; justify-content:flex-end; gap:10px; padding-top:6px;}
 .a2z-btn{appearance:none; border:1px solid var(--line); background:#fff; padding:10px 12px; border-radius:12px; cursor:pointer; font-weight:900;}
.a2z-btn:hover{border-color:var(--cta);}
 .a2z-btn--primary{background:var(--cta); color:#fff; border-color:var(--cta);}
 .a2z-btn--primary:hover{background:var(--cta-2); border-color:var(--cta-2);}

:focus-visible{outline:3px solid rgba(var(--cta-rgb), .45); outline-offset:2px;}

/* Unified file-input action button (charte globale) */
input[type="file"]::file-selector-button{
  appearance:none;
  border:1px solid var(--cta);
  background:var(--cta);
  color:#fff;
  border-radius:10px;
  padding:7px 11px;
  font:inherit;
  font-weight:700;
  cursor:pointer;
}
input[type="file"]::-webkit-file-upload-button{
  appearance:none;
  border:1px solid var(--cta);
  background:var(--cta);
  color:#fff;
  border-radius:10px;
  padding:7px 11px;
  font:inherit;
  font-weight:700;
  cursor:pointer;
}
input[type="file"]::file-selector-button:hover,
input[type="file"]::-webkit-file-upload-button:hover{
  border-color:var(--cta-2);
  background:var(--cta-2);
}

/* =========================================================
   Auth (Login)
   ========================================================= */

.auth-wrap{
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px;
  background:linear-gradient(180deg, rgba(18, 56, 64, .06), rgba(18, 56, 64, 0));
}

.auth-card{
  width:100%;
  max-width:420px;
  border:1px solid var(--line);
  border-radius:16px;
  padding:18px;
  background:var(--card);
  box-shadow:var(--shadow);
}

.auth-title{
  font-weight:900;
  font-size:20px;
  margin:0 0 6px;
}

.auth-sub{
  margin:0 0 14px;
  color:var(--muted);
}

.auth-field{
  display:flex;
  flex-direction:column;
  gap:6px;
  margin:12px 0;
}

.auth-field input{
  padding:12px 12px;
  border-radius:12px;
  border:1px solid var(--line);
  background:transparent;
  font:inherit;
}

.auth-actions{
  display:flex;
  gap:10px;
  align-items:center;
  margin-top:14px;
}

.auth-error{
  margin-top:10px;
  color:#b00020;
  font-size:14px;
}

/* =========================================================
   Icon buttons (liste exploitants : corbeille + export)
   ========================================================= */

.btn--icon{
  width:40px;
  height:40px;
  padding:0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:0;
  border-radius:12px;
  line-height:1;
  position:relative;
}

.btn--icon > span[aria-hidden="true"]{
  font-size:18px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  line-height:1;
}

/* small counter badge inside icon buttons */
.btn--icon .a2z-badge-count{
  position:absolute;
  top:-6px;
  right:-6px;
  min-width:18px;
  height:18px;
  padding:0 6px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:11px;
  font-weight:900;
  background:var(--red);
  color:#fff;
  border:2px solid #fff;
  pointer-events:none;
}

.btn--danger.btn--icon{
  background:var(--red);
  color:#fff;
  border-color:var(--red);
}
.btn--danger.btn--icon:hover{background:var(--red-2); border-color:var(--red-2);}

.btn--ghost.btn--icon{
  background:#fff;
  color:var(--navy);
}

.btn--ghost.btn--icon:hover{
  border-color:var(--red);
}

/* Accessibilité : texte visible uniquement pour lecteurs d’écran */
.sr-only{
  position:absolute !important;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}

/* Make table header checkbox align nicely */
.a2z-table thead input[type="checkbox"]{
  width:16px;
  height:16px;
  accent-color:var(--red);
}

.a2z-table tbody input[type="checkbox"]{
  width:16px;
  height:16px;
  accent-color:var(--red);
}

/* Selection column must stay compact across all lists */
.a2z-table thead th[class$="-col-check"],
.a2z-table tbody td[class$="-col-check"]{
  width:26px !important;
  min-width:26px !important;
  max-width:26px !important;
  padding-left:4px !important;
  padding-right:4px !important;
  text-align:center !important;
}

.a2z-table thead th[class$="-col-check"] input[type="checkbox"],
.a2z-table tbody td[class$="-col-check"] input[type="checkbox"]{
  display:block;
  margin:0 auto !important;
}

/* =========================================================
   Global Alerts / Confirms (A2Zen UI)
   ========================================================= */

.a2z-pop{
  border:none;
  padding:0;
  background:transparent;
}

.a2z-pop::backdrop{
  background:rgba(9,20,41,.55);
}

.a2z-pop[open]{
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0;
}

.a2z-pop__card{
  width:min(520px, calc(100vw - 24px));
  border:1px solid var(--line);
  border-radius:16px;
  background:#fff;
  box-shadow:var(--shadow);
  overflow:hidden;
}

.a2z-pop__head{
  background:linear-gradient(90deg, var(--navy), var(--navy-2));
  color:#fff;
  padding:14px 16px;
  border-bottom:1px solid rgba(255,255,255,.12);
  box-shadow: inset 0 -2px 0 var(--underline-white-soft);
}

.a2z-pop__title{
  margin:0;
  font-weight:950;
  letter-spacing:.2px;
  font-size:15px;
}

.a2z-pop__body{
  padding:14px 16px;
  color:var(--text);
}

.a2z-pop__msg{
  margin:0;
  white-space:pre-wrap;
  line-height:1.45;
}

.a2z-pop__actions{
  padding:12px 16px 16px;
  display:flex;
  justify-content:flex-end;
  gap:10px;
  flex-wrap:wrap;
  border-top:1px solid var(--line);
}

.a2z-pop__btn{
  appearance:none;
  border:1px solid var(--line);
  background:#fff;
  color:var(--navy);
  padding:10px 12px;
  border-radius:12px;
  cursor:pointer;
  font-weight:900;
}

.a2z-pop__btn--tail{
  margin-left:auto;
}

.a2z-pop__btn:hover{
  border-color:var(--red);
}

.a2z-pop__btn--danger{
  background:var(--red);
  color:#fff;
  border-color:var(--red);
}

.a2z-pop__btn--danger:hover{
  background:var(--red-2);
  border-color:var(--red-2);
}

.a2z-pop__btn--primary{
  background:var(--navy);
  color:#fff;
  border-color:rgba(255,255,255,.18);
}

.a2z-pop__btn--primary:hover{
  background:var(--navy-2);
}

/* Collapsed sidebar (toggle in assets/js/components/navbar.js) */
body.sidebar-collapsed{ --sidebar-width:84px; }
body.sidebar-collapsed .sidebar{width:84px;min-width:84px;padding-left:10px;padding-right:10px;}
body.sidebar-collapsed .sidebar__suite{display:none;}
body.sidebar-collapsed .sidebar__footer{display:none;}
body.sidebar-collapsed .sidebar__logo{width:100%;height:62px;flex-basis:auto;}
body.sidebar-collapsed .snav__topline{
  justify-content:center;
  margin-bottom:10px;
}
body.sidebar-collapsed .snav__home-row{
  display:flex;
  justify-content:center;
  margin-bottom:10px;
}
body.sidebar-collapsed .snav__item--home{
  flex:0 0 auto;
  margin:0;
}
body.sidebar-collapsed .snav__toggle-inline{
  width:38px;
}

body.sidebar-collapsed .snav__item,
body.sidebar-collapsed .snav__summaryLink{
  justify-content:center;
  padding:12px 10px;
}

body.sidebar-collapsed .snav__item > span:not(.snav__icon),
body.sidebar-collapsed .snav__summaryLink > span:not(.snav__icon){
  display:none;
}

/* Hide sublinks unless the group is opened; show as a stacked flyout */
body.sidebar-collapsed .snav__sub{display:none;}
body.sidebar-collapsed details.snav__group{position:relative;}

/* Base flyout item style */
body.sidebar-collapsed details.snav__group[open] .snav__sub{
  display:block;
  position:absolute;
  left:76px;
  right:auto;
  width:220px;
  background:linear-gradient(180deg, var(--cta), var(--cta-2));
  border:1px solid rgba(255,255,255,.16);
  box-shadow:0 12px 28px rgba(0,0,0,.28);
  border-radius:14px;
  padding:10px 12px;
  z-index:50;
  color:#fff;
}
body.sidebar-collapsed details.snav__group[open] .snav__sub:not(.snav__sub--heading):not(.snav__sub--level2),
body.sidebar-collapsed details.snav__group[open] .snav__sub--level2{
  margin-left:0;
  border-left:0;
  padding-left:12px;
  background:linear-gradient(180deg, rgba(15, 95, 114, .98), rgba(11, 78, 95, .98));
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.14);
}
body.sidebar-collapsed details.snav__group[open] .snav__sub--level2::before{
  display:none;
}
body.sidebar-collapsed details.snav__group[open] .snav__sub--heading{
  display:none;
}

body.sidebar-collapsed details.snav__group[open] .snav__sub:not(.snav__sub--heading):hover,
body.sidebar-collapsed details.snav__group[open] .snav__sub--level2:hover{
  background:linear-gradient(180deg, rgba(21, 108, 126, .99), rgba(15, 95, 114, .99));
}

body.sidebar-collapsed details.snav__group[open] .snav__sub.is-active{
  background:linear-gradient(180deg, rgba(var(--red-rgb), .90), rgba(180, 58, 86, .92));
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.26);
}

/* Stack: each next link is pushed down */
body.sidebar-collapsed details.snav__group[open] .snav__sub:nth-of-type(1){ top:6px; }
body.sidebar-collapsed details.snav__group[open] .snav__sub:nth-of-type(2){ top:52px; }
body.sidebar-collapsed details.snav__group[open] .snav__sub:nth-of-type(3){ top:98px; }
body.sidebar-collapsed details.snav__group[open] .snav__sub:nth-of-type(4){ top:144px; }
body.sidebar-collapsed details.snav__group[open] .snav__sub:nth-of-type(5){ top:190px; }
body.sidebar-collapsed details.snav__group[open] .snav__sub:nth-of-type(6){ top:236px; }

/* =========================================================
   Micro-Passe UX Finale
   Uniformisation fine: dashboard, listes, boutons, modales
   ========================================================= */

:root{
  --ux-radius-sm:10px;
  --ux-radius-md:12px;
  --ux-control-h:36px;
}

.main{
  padding:14px;
  min-width:0;
}

.page-footer{
  margin-top:14px;
  text-align:right;
  color:var(--muted);
  font-size:12px;
}

.card{
  border-radius:var(--ux-radius-md);
  box-shadow:0 8px 18px rgba(8, 31, 37, .08);
}

.card--chapter > .card__body{
  padding:11px 13px 13px;
  background:
    radial-gradient(circle at right top, rgba(var(--red-rgb), .05), transparent 58%),
    linear-gradient(180deg, #f8fafb 0%, #f3f6f8 100%);
}

.card__head{
  padding:10px 13px;
}

.card__title{
  font-size:16px;
  line-height:1.2;
}

.card__subtitle{
  font-size:11px;
}

.btn,
.a2z-btn,
.a2z-pop__btn{
  min-height:var(--ux-control-h);
  padding:0 11px;
  border-radius:var(--ux-radius-sm);
  font-size:12px;
  font-weight:850;
  letter-spacing:.01em;
}

.btn--icon{
  width:36px;
  height:36px;
  min-height:36px;
  padding:0;
  border-radius:var(--ux-radius-sm);
}

.input,
.a2z-input,
.a2z-field input,
.a2z-field select,
.a2z-field textarea,
.auth-field input{
  min-height:var(--ux-control-h);
  border-radius:var(--ux-radius-sm);
  font-size:13px;
}

.a2z-field textarea{
  min-height:92px;
}

.dash-kpi{
  border-radius:var(--ux-radius-md);
  padding:10px 11px;
}

.dash-kpi__label{
  font-size:11px;
}

.dash-kpi__value{
  margin-top:4px;
  font-size:21px;
}

.dash-kpi__hint{
  font-size:11px;
}

.dash-panel{
  border-radius:var(--ux-radius-md);
  padding:9px 10px;
}

.dash-panel__title{
  font-size:12px;
}

.dash-panel__meta{
  font-size:11px;
}

.dash-bars{
  gap:8px;
}

.dash-bar{
  gap:8px;
}

.dash-bar__track{
  height:8px;
}

.dash-bar__val{
  font-size:11px;
}

.a2z-dialog[open]{
  padding:16px;
}

.a2z-dialog__card{
  border-radius:13px;
  border:1px solid rgba(18, 56, 64, .16);
  box-shadow:0 16px 34px rgba(6, 24, 28, .20);
  max-height:calc(100vh - 34px);
  overflow:hidden;
}

.a2z-dialog__head{
  min-height:50px;
  padding:12px 14px !important;
  box-shadow:inset 0 -1px 0 var(--underline-white-soft);
}

.a2z-dialog__title{
  font-size:14px;
  letter-spacing:.2px;
}

.a2z-dialog__close{
  min-width:32px;
  height:32px;
  font-size:15px;
  border-width:1px;
}

.a2z-dialog__body{
  gap:10px !important;
  padding:9px 12px 10px !important;
}

.a2z-dialog__actions{
  gap:8px !important;
  padding:8px 12px 10px !important;
}

.a2z-dialog__actions--wizardlike{
  display:flex;
  align-items:center;
  justify-content:flex-end;
}

.a2z-dialog__actions-right--wizardlike{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
  margin-left:auto;
}

.a2z-dialog__actions-left--wizardlike{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}

.a2z-dialog__actions-right--wizardlike .a2z-btn[disabled]{
  opacity:.46;
  cursor:not-allowed;
  pointer-events:none;
}

#operationModal .a2z-dialog__body,
#portageCreateDialog .a2z-dialog__body,
#exploitantCreateDialog .a2z-dialog__body,
#cgpDialog .a2z-dialog__body,
#souscripteurEditDialog .a2z-dialog__body{
  padding:9px 12px 10px !important;
}

.a2z-field label{
  font-size:12px;
  font-weight:800;
  line-height:1.25;
}

/* =========================================================
   Global modal overlay (all dialogs)
   - Keep topbar + sidebar clear
   - Mask only the main content area behind modals
   ========================================================= */
body.a2z-has-open-dialog{
  overflow:hidden;
}
body.a2z-has-open-dialog .layout .main{
  position:relative;
}
body.a2z-has-open-dialog .layout .main::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:1040;
  background:var(--bg);
  pointer-events:auto;
}

/* Keep modal cards above the content overlay even when opened via [open] fallback. */
dialog[open]{
  z-index:1060;
}

/* Neutralize native backdrops to keep one consistent behavior everywhere. */
dialog::backdrop,
.a2z-dialog::backdrop,
.a2z-pop::backdrop,
.a2z-chart-dialog::backdrop{
  background:transparent !important;
}

/* =========================================================
   Global modal geometry
   - Never overlap topbar
   - Fill useful app area (below topbar, next to sidebar)
   - Keep wide create/edit modals visually substantial
   ========================================================= */
.a2z-dialog[open]{
  position:fixed !important;
  top:var(--topbar-height) !important;
  right:0 !important;
  bottom:0 !important;
  left:0 !important;
  width:100vw !important;
  height:calc(100dvh - var(--topbar-height)) !important;
  max-width:none !important;
  max-height:none !important;
  margin:0 !important;
  display:flex !important;
  align-items:flex-start !important;
  justify-content:center !important;
  padding:14px 14px 14px calc(var(--sidebar-width) + 14px) !important;
  overflow:auto !important;
}

body.sidebar-collapsed .a2z-dialog[open]{
  padding-left:calc(var(--sidebar-collapsed-width) + 14px) !important;
}

.a2z-dialog__card--wide{
  width:min(1360px, calc(100vw - var(--sidebar-width) - 28px)) !important;
  height:auto !important;
  min-height:0 !important;
  max-height:calc(100dvh - var(--topbar-height) - 28px);
  margin:0 !important;
}

body.sidebar-collapsed .a2z-dialog__card--wide{
  width:min(1360px, calc(100vw - var(--sidebar-collapsed-width) - 28px)) !important;
}

#operationEditDialog .a2z-dialog__card{
  padding:0 !important;
  overflow:hidden;
}

@media (max-width:980px){
  .a2z-dialog[open]{
    padding:12px !important;
  }

  body.sidebar-collapsed .a2z-dialog[open]{
    padding:12px !important;
  }

  .a2z-dialog__card--wide{
    width:min(1360px, calc(100vw - 24px)) !important;
    height:auto !important;
    min-height:0 !important;
    max-height:calc(100dvh - var(--topbar-height) - 24px);
  }
}