/* file /assets/css/utilities.css */
/* Couleurs texte */
.text-primary{color:var(--primary)!important}
.text-secondary{color:var(--secondary)!important}
.text-success{color:var(--success)!important}
.text-warning{color:var(--warning)!important}
.text-danger{color:var(--danger)!important}
.text-info{color:var(--info)!important}
.text-light{color:#fff!important}
.text-dark{color:var(--text)!important}
.text-muted{color:var(--text-muted)!important}
.text-white{color:#fff!important}
/* Fonds */
.bg-primary{background:var(--primary)!important;color:#fff}
.bg-secondary{background:var(--secondary)!important;color:#fff}
.bg-success{background:var(--success)!important;color:#fff}
.bg-warning{background:var(--warning)!important;color:var(--text)}
.bg-danger{background:var(--danger)!important;color:#fff}
.bg-info{background:var(--info)!important;color:#fff}
.bg-success-lighten{background:#e6f4ea!important;color:var(--text)!important}
.bg-warning-lighten{background:#fff3cd!important;color:var(--text)!important}
.bg-info-lighten{background:#d1f5ff!important;color:var(--text)!important}

/* Teintes sémantiques légères — theme-aware via color-mix (dark mode compatible) */
.bg-primary-weak{background:color-mix(in srgb,var(--primary) 10%,var(--panel))!important;color:var(--text)!important}
.bg-success-weak{background:var(--success-weak)!important;color:var(--text)!important}
.bg-warning-weak{background:var(--warning-weak)!important;color:var(--text)!important}
.bg-danger-weak{background:var(--danger-weak)!important;color:var(--text)!important}
.bg-info-weak{background:var(--info-weak)!important;color:var(--text)!important}

/* Au lieu de bg-light/dark en dur -> surfaces tokenisées */
.bg-page{background:var(--bg-page)!important}
.bg-surface-1{background:var(--surface-1)!important}
.bg-surface-2{background:var(--surface-2)!important}
.bg-surface-3{background:var(--surface-3)!important}

/* Bordures */
.border{border:1px solid var(--border)!important}
.border-top{border-top:1px solid var(--border)!important}
.border-bottom{border-bottom:1px solid var(--border)!important}
.border-success{border:1px solid var(--success)!important}

/* Ombre / radius déjà ok */
/* .rounded{border-radius:.5rem} */
.rounded{border-radius:.5rem}
.shadow{box-shadow:var(--shadow)}


/* Mini grille pour compat avec tes vues */
.row{display:flex;flex-wrap:wrap;margin-left:-8px;margin-right:-8px}
.col-12{flex:0 0 100%;max-width:100%;padding-left:8px;padding-right:8px}

/* Display */
.d-none{display:none!important}.d-block{display:block!important}
.d-flex{display:flex!important}.d-inline-flex{display:inline-flex!important}
.d-grid{display:grid!important}

/* Flex direction & wrap */
.flex-column{flex-direction:column!important}
.flex-row{flex-direction:row!important}
.flex-wrap{flex-wrap:wrap!important}
.flex-nowrap{flex-wrap:nowrap!important}

/* Flex sizing */
.flex-1{flex:1 1 0!important}
.flex-grow-1{flex-grow:1!important}
.flex-shrink-0{flex-shrink:0!important}
.min-w-0{min-width:0!important}

/* Flex / grid gap */
.gap-1{gap:.25rem!important}
.gap-2{gap:.5rem!important}
.gap-3{gap:1rem!important}
.gap-4{gap:1.5rem!important}
.column-gap-1{column-gap:.25rem!important}
.column-gap-2{column-gap:.5rem!important}
.column-gap-3{column-gap:1rem!important}

/* Align & justify */
.align-center{align-items:center!important}
.align-items-center{align-items:center!important}
.align-items-start{align-items:flex-start!important}
.align-items-end{align-items:flex-end!important}
.align-self-start{align-self:flex-start!important}
.align-self-center{align-self:center!important}
.justify-between{justify-content:space-between!important}
.justify-content-between{justify-content:space-between!important}
.justify-content-center{justify-content:center!important}
.justify-content-end{justify-content:flex-end!important}

/* Marges auto (push flex) */
.ml-auto{margin-left:auto!important}
.mr-auto{margin-right:auto!important}
.mx-auto{margin-left:auto!important;margin-right:auto!important}

/* Marges */
.m-0{margin:0!important}
.mt-0{margin-top:0!important}.mt-1{margin-top:.25rem!important}.mt-2{margin-top:.5rem!important}.mt-3{margin-top:1rem!important}.mt-4{margin-top:1.5rem!important}
.mb-0{margin-bottom:0!important}.mb-1{margin-bottom:.25rem!important}.mb-2{margin-bottom:.5rem!important}.mb-3{margin-bottom:1rem!important}.mb-4{margin-bottom:1.5rem!important}
.ml-1{margin-left:.25rem!important}.ml-2{margin-left:.5rem!important}.ml-3{margin-left:1rem!important}
.mr-1{margin-right:.25rem!important}.mr-2{margin-right:.5rem!important}.mr-3{margin-right:1rem!important}

/* Paddings */
.p-0{padding:0!important}.p-1{padding:.25rem!important}.p-2{padding:.5rem!important}.p-3{padding:1rem!important}.p-4{padding:1.5rem!important}
.pt-0{padding-top:0!important}.pt-1{padding-top:.25rem!important}.pt-2{padding-top:.5rem!important}.pt-3{padding-top:1rem!important}
.pb-0{padding-bottom:0!important}.pb-1{padding-bottom:.25rem!important}.pb-2{padding-bottom:.5rem!important}.pb-3{padding-bottom:1rem!important}
.pl-1{padding-left:.25rem!important}.pl-2{padding-left:.5rem!important}.pl-3{padding-left:1rem!important}.pl-4{padding-left:1.5rem!important}
.pr-1{padding-right:.25rem!important}.pr-2{padding-right:.5rem!important}.pr-3{padding-right:1rem!important}
.px-1{padding-left:.25rem!important;padding-right:.25rem!important}
.px-2{padding-left:.5rem!important;padding-right:.5rem!important}
.px-3{padding-left:1rem!important;padding-right:1rem!important}
.py-1{padding-top:.25rem!important;padding-bottom:.25rem!important}
.py-2{padding-top:.5rem!important;padding-bottom:.5rem!important}
.py-3{padding-top:1rem!important;padding-bottom:1rem!important}

/* Typographie */
.font-weight-bold{font-weight:700!important}
.font-weight-normal{font-weight:400!important}
.small{font-size:.85rem!important}
.text-nowrap{white-space:nowrap!important}

/* Alignements texte */
.text-center{ text-align:center !important }
.text-left{ text-align: start !important }
.text-end{ text-align:end !important }
.text-start {text-align: start !important;}
/* Alias Bootstrap 4 → Bootstrap 5 pour rétrocompatibilité */
.text-right{ text-align:right !important }

/* Visually hidden (accessibilité) */
.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;
}

/* Images responsive et avec bordure douce */
.img-fluid {
  max-width: 100%;
  height: auto;
  display: block;
}