/* public/assets/app.css (soft + blue mode) */


.table td, .table th { vertical-align: middle; }

#tbl td { position: relative; }
#tbl td .btn, #tbl td button, #tbl td a { position: relative; z-index: 2; }


.mz-phone.is-invalid{
  animation: mzBlink .35s linear 1;
}
@keyframes mzBlink{
  0% { box-shadow: 0 0 0 0 rgba(220,53,69,.0); }
  50%{ box-shadow: 0 0 0 .25rem rgba(220,53,69,.25); }
  100%{ box-shadow: 0 0 0 0 rgba(220,53,69,.0); }
}


/* zone actions: alignement + clic garanti */
#tbl td { position: relative; }
.mz-actions{
  display: inline-flex;
  gap: .35rem;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
}
.mz-actions .btn{
  padding: .25rem .45rem;
  line-height: 1;
}

/* si jamais un overlay mange les clics */
#tbl td * { pointer-events: auto; }


@media (max-width: 576px){
  .mz-actions{ flex-direction: column; }
}


tr.table-secondary {
  opacity: .75;
}
tr.table-secondary .mz-actions .btn.disabled,
tr.table-secondary .mz-actions .btn:disabled {
  pointer-events: none;
}

/* --- Header look --- */
.navbar { backdrop-filter: blur(8px); }
.mz-dot{
  width:10px;height:10px;border-radius:50%;
  background: var(--mz-accent, #198754);
  display:inline-block;
  box-shadow: 0 0 0 .25rem rgba(25,135,84,.15);
}

/* --- Cards + layout --- */
.container-fluid{ max-width: 1400px; }
.card{ border-radius: 16px; }
.card-body{ padding: 1rem; }

/* --- Filters responsive --- */
@media (max-width: 576px){
  .row.g-2.align-items-end > [class*="col-"],
  .row.g-2.align-items-end > [class*="col-md-"]{
    width: 100%;
  }
  .pull-right{ text-align: left !important; }
}

/* --- DataTable overflow safe --- */
.mz-tablewrap{ overflow:auto; }
#tbl{ width:100% !important; }


/* Desktop: ok en nowrap, mobile: laisse respirer */
#tbl th, #tbl td{ white-space: nowrap; }

@media (max-width: 768px){
  #tbl th, #tbl td{ white-space: normal; } /* ✅ permet le wrap */
}


.mz-tablewrap{ overflow-x: auto; }


/* Cacher certaines colonnes sur mobile */
@media (max-width: 768px){
  .col-hide-sm{ display:none !important; }
}


@media (max-width: 576px){
  .mz-actions{
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
  }
  .mz-actions .btn{
    width: auto;
  }
}


@media (max-width: 576px){
  #bulkBar .card-body .d-flex{
    flex-direction: column;
    align-items: stretch !important;
  }
  #bulkBar .btn, #bulkBar .form-control, #bulkBar .form-select{
    width: 100%;
  }
  #lockBox .d-flex{
    flex-direction: column;
    align-items: stretch;
  }
}



/* =========================
   THEME: Vert PRO (vrai vert)
   ========================= */
:root[data-mz-theme="mint"]{
  --mz-accent:   #0f8a2a;        /* vert franc */
  --mz-accent-2: #0c6f22;        /* hover */
  /* --mz-bg:       #dff4e6;        /* ✅ PLUS VERT (avant: #eaf7ef)  */
  --mz-bg: 		 #d2f0dc;
  --mz-card:     #ffffff;
  --mz-border:   rgba(15,138,42,.26); /* un poil + visible */
  --mz-soft:     rgba(15,138,42,.18); /* glow plus vert */
}

/* fond général */
:root[data-mz-theme="mint"] body.bg-body-tertiary{
  background: var(--mz-bg) !important;
}

/* cards */
:root[data-mz-theme="mint"] .card{
  border: 1px solid var(--mz-border) !important;
  background: var(--mz-card) !important;
}

/* navbar */
:root[data-mz-theme="mint"] .navbar{
  background: rgba(255,255,255,.92) !important;
  border-bottom: 1px solid var(--mz-border) !important;
}

/* point logo */
:root[data-mz-theme="mint"] .mz-dot{
  background: var(--mz-accent) !important;
  box-shadow: 0 0 0 .25rem var(--mz-soft) !important;
}

/* boutons primaires */
:root[data-mz-theme="mint"] .btn-primary{
  background: var(--mz-accent) !important;
  border-color: var(--mz-accent) !important;
}
:root[data-mz-theme="mint"] .btn-primary:hover,
:root[data-mz-theme="mint"] .btn-primary:focus{
  background: var(--mz-accent-2) !important;
  border-color: var(--mz-accent-2) !important;
}

/* boutons outline success (Export Excel) */
:root[data-mz-theme="mint"] .btn-outline-success{
  border-color: var(--mz-accent) !important;
  color: var(--mz-accent) !important;
}
:root[data-mz-theme="mint"] .btn-outline-success:hover{
  background: var(--mz-accent) !important;
  border-color: var(--mz-accent) !important;
  color: #fff !important;
}

/* badges */
:root[data-mz-theme="mint"] .badge.text-bg-secondary{
  background: rgba(15,138,42,.18) !important;
  color: #0b3b18 !important;
  border: 1px solid var(--mz-border) !important;
}

:root[data-mz-theme="mint"] .table thead th{
  background: rgba(15,138,42,.18) !important; /* ✅ plus vert */
}

:root[data-mz-theme="mint"] .table-striped > tbody > tr:nth-of-type(odd) > *{
  background: rgba(15,138,42,.05) !important; /* ✅ bande verte légère */
}

:root[data-mz-theme="mint"] .table tbody tr:hover > *{
  background: rgba(15,138,42,.10) !important; /* ✅ hover plus visible */
}




/* =========================
   FORCE MINT BACKGROUND
   même si Bootstrap est en dark
   ========================= */

:root[data-mz-theme="mint"]{
  /* écrase les variables Bootstrap */
  --bs-body-bg:        var(--mz-bg) !important;
  --bs-body-bg-rgb:    234,247,239;
  --bs-tertiary-bg:    var(--mz-bg) !important;
  --bs-secondary-bg:  #ffffff !important;

  --bs-border-color:  var(--mz-border) !important;
}

/* body global */
:root[data-mz-theme="mint"] body{
  background-color: var(--mz-bg) !important;
}

:root[data-mz-theme="mint"] body{
  background-color: var(--mz-bg) !important;
  background-image: radial-gradient(circle at 20% 10%, rgba(15,138,42,.18), transparent 55%),
                    radial-gradient(circle at 90% 30%, rgba(15,138,42,.12), transparent 60%),
                    linear-gradient(to bottom, rgba(15,138,42,.10), transparent 35%);
  background-attachment: fixed;
}


/* containers Bootstrap */
:root[data-mz-theme="mint"] .bg-body,
:root[data-mz-theme="mint"] .bg-body-tertiary,
:root[data-mz-theme="mint"] .bg-body-secondary{
  background-color: var(--mz-bg) !important;
}

/* cartes restent blanches */
:root[data-mz-theme="mint"] .card{
  background-color: #ffffff !important;
}















:root[data-mz-theme="mint"]{
  --mz-accent:   #0b8f2a;
  --mz-accent-2: #08741f;

  /* ✅ fond plus vert (plus visible) */
  --mz-bg:       #d6f5df;

  --mz-card:     #ffffff;
  --mz-border:   rgba(11,143,42,.28);
  --mz-soft:     rgba(11,143,42,.18);

  /* ✅ override Bootstrap */
  --bs-body-bg:        var(--mz-bg) !important;
  --bs-tertiary-bg:    var(--mz-bg) !important;
  --bs-border-color:   var(--mz-border) !important;

  /* ✅ tables Bootstrap (striped/hover) */
  --bs-table-striped-bg: rgba(11,143,42,.08) !important;
  --bs-table-hover-bg:   rgba(11,143,42,.12) !important;
}

/* body global */
:root[data-mz-theme="mint"] body{
  background-color: var(--mz-bg) !important;
}

/* cards restent bien blanches */
:root[data-mz-theme="mint"] .card{
  background: #fff !important;
  border: 1px solid var(--mz-border) !important;
}

/* thead plus vert */
:root[data-mz-theme="mint"] .table thead th{
  background: rgba(11,143,42,.16) !important;
}