/* 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}

/* 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}

/* Helpers */
.d-none{display:none!important}.d-block{display:block!important}.d-flex{display:flex!important}
.flex-column{flex-direction:column!important}.align-center{align-items:center!important}.justify-between{justify-content:space-between!important}
.mt-1{margin-top:.25rem}.mt-2{margin-top:.5rem}.mt-3{margin-top:1rem}
.mb-1{margin-bottom:.25rem}.mb-2{margin-bottom:.5rem}.mb-3{margin-bottom:1rem}
.p-1{padding:.25rem}.p-2{padding:.5rem}.p-3{padding:1rem}

/* 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;}

/* 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;
}