/* beautyShop — thème Bootstrap 5.3 aux couleurs du logo.
   À charger APRÈS bootstrap.min.css. */
:root{
  --bs-primary:#1a6079; --bs-primary-rgb:26,96,121;
  --bs-secondary:#d1908a; --bs-secondary-rgb:209,144,138;
  --bs-success:#2e7d5b; --bs-success-rgb:46,125,91;
  --bs-warning:#c98a1b; --bs-warning-rgb:201,138,27;
  --bs-danger:#b4443d; --bs-danger-rgb:180,68,61;
  --bs-info:#1a6079; --bs-info-rgb:26,96,121;
  --bs-body-bg:#fdfdfb; --bs-body-color:#0d2f3b;
  --bs-body-font-family:"Montserrat",system-ui,"Segoe UI",sans-serif;
  --bs-link-color:#1a6079; --bs-link-hover-color:#08465b;
  --bs-link-color-rgb:26,96,121; --bs-link-hover-color-rgb:8,70,91;
  --bs-link-decoration:none;
  --bs-border-color:#e4e9ea; --bs-border-radius:.4rem; --bs-border-radius-sm:.3rem; --bs-border-radius-lg:.6rem;
  --bs-heading-color:#08465b;
  --bs-focus-ring-color:rgba(26,96,121,.25);
  --bs-teal-fonce:#08465b; --bs-rose:#d1908a; --bs-rose-clair:#e7a89f;
  --bs-rose-pale:#fbeeec; --bs-teal-pale:#e6f0f3;
}
body{font-family:var(--bs-body-font-family)}
/* liens : couleur du thème, jamais le bleu navigateur ; soulignés par défaut dans un texte courant (hors boutons, navigation et composants) */
a{color:var(--bs-link-color);text-decoration:none}
a:hover{color:var(--bs-link-hover-color)}
p a:not([class]),li a:not([class]),.texte-courant a:not(.btn):not(.dropdown-item):not(.nav-link){text-decoration:underline;text-underline-offset:.2em}
/* focus visible et cibles tactiles */
:focus-visible{outline:3px solid rgba(26,96,121,.45);outline-offset:2px}
.btn:focus-visible,.form-control:focus-visible,.form-select:focus-visible{outline:0}
.btn{min-height:var(--ui-cible,36px);padding:.35rem .9rem;font-size:.9rem;display:inline-flex;align-items:center;justify-content:center;gap:.4rem;font-weight:600}
.btn .material-icons{font-size:1.15rem}
.btn-sm{min-height:calc(var(--ui-cible,36px) - 6px);padding:.2rem .6rem;font-size:.82rem}
.btn-link{text-decoration:none}
.btn-link:hover{text-decoration:none}
/* élévations et rayons */
:root{--ombre-1:0 1px 3px rgba(8,70,91,.10);--ombre-2:0 4px 14px rgba(8,70,91,.12);--ombre-3:0 10px 30px rgba(8,70,91,.16);--rayon-ui:.5rem}
.dropdown-menu{border:0;border-radius:var(--rayon-ui);box-shadow:var(--ombre-3);padding:.4rem}
.modal-content{border:0;border-radius:.7rem;box-shadow:var(--ombre-3)}
img[src*="logo"]{mix-blend-mode:multiply}
.navbar img.logo{height:40px}
/* boutons */
.btn-primary{--bs-btn-bg:#1a6079;--bs-btn-border-color:#1a6079;--bs-btn-hover-bg:#08465b;--bs-btn-hover-border-color:#08465b;--bs-btn-active-bg:#08465b;--bs-btn-active-border-color:#08465b;--bs-btn-disabled-bg:#1a6079;--bs-btn-disabled-border-color:#1a6079}
.btn-outline-primary{--bs-btn-color:#1a6079;--bs-btn-border-color:#1a6079;--bs-btn-hover-bg:#1a6079;--bs-btn-hover-border-color:#1a6079;--bs-btn-active-bg:#1a6079}
.btn-rose{--bs-btn-color:#fff;--bs-btn-bg:#d1908a;--bs-btn-border-color:#d1908a;--bs-btn-hover-color:#fff;--bs-btn-hover-bg:#c07c76;--bs-btn-hover-border-color:#c07c76;--bs-btn-active-bg:#c07c76;--bs-btn-active-color:#fff}
.btn-pill{border-radius:var(--bs-border-radius)}
.text-rose{color:#d1908a!important}
.text-teal{color:#08465b!important}
.bg-teal{background:#08465b!important;color:#fff}
.bg-teal-pale{background:#e6f0f3!important}
.bg-rose-pale{background:#fbeeec!important}
.bg-rose{background:#d1908a!important;color:#fff}
.badge-soft-ok{background:#e3f3ec;color:#2e7d5b}
.badge-soft-attente{background:#fbf0d9;color:#a06c10}
.badge-soft-danger{background:#f8e1df;color:#b4443d}
.badge-soft-neutre{background:#e6f0f3;color:#1a6079}
.badge-soft-rose{background:#fbeeec;color:#a5625b}
.card{border:0;box-shadow:0 2px 10px rgba(8,70,91,.08)}
/* hero */
.hero{background:linear-gradient(120deg,#08465b,#1a6079);color:#fff;border-radius:1rem}
.hero h1,.hero .h1{color:#fff}
/* produit */
.produit-ph{aspect-ratio:1;display:grid;place-items:center;font-size:2.8rem;border-radius:.8rem .8rem 0 0}
.produit-ph.grand{font-size:6rem;border-radius:1rem}
.produit-card{transition:transform .15s}
.produit-card:hover{transform:translateY(-3px)}
.prix{color:#1a6079;font-weight:700}
.pastille{border-radius:99px}
/* barre d'onglets mobile (client) */
.tabbar{position:fixed;bottom:0;left:0;right:0;z-index:1030;background:#fff;border-top:1px solid var(--bs-border-color);display:flex}
.tabbar a{flex:1;text-align:center;padding:7px 0 6px;font-size:.68rem;color:#6b7f87;text-decoration:none;position:relative}
.tabbar a i{display:block;font-size:1.3rem;line-height:1.2}
.tabbar a.active{color:#1a6079;font-weight:600}
.tabbar .badge{position:absolute;top:2px;left:calc(50% + 6px);font-size:.6rem}
body.avec-tabbar{padding-bottom:64px}
@media(min-width:768px){.tabbar{display:none}body.avec-tabbar{padding-bottom:0}}
/* administration */
.admin-menu{background:#08465b;min-height:100vh}
.admin-menu .nav-link{color:rgba(255,255,255,.8);border-radius:.6rem;padding:.6rem .8rem}
.admin-menu .nav-link:hover{background:rgba(255,255,255,.08);color:#fff}
.admin-menu .nav-link.active{background:#1a6079;color:#fff}
.admin-menu img.logo{background:#fff;border-radius:.8rem;padding:3px;mix-blend-mode:normal}
.kpi-icone{width:46px;height:46px;border-radius:.8rem;display:grid;place-items:center;font-size:1.3rem}
.kpi-valeur{font-size:1.6rem;font-weight:700;color:#08465b;line-height:1.1}
.table thead th{background:#e6f0f3;color:#08465b;font-size:.75rem;text-transform:uppercase;letter-spacing:.03em;border:0}
.etapes-suivi{display:flex;justify-content:space-between;position:relative}
.etapes-suivi::before{content:"";position:absolute;left:8%;right:8%;top:15px;height:3px;background:#e4e9ea}
.etapes-suivi .etape{flex:1;text-align:center;font-size:.72rem;color:#6b7f87;position:relative}
.etapes-suivi .etape i{display:grid;place-items:center;width:32px;height:32px;margin:0 auto 6px;border-radius:50%;background:#fff;border:3px solid #e4e9ea;font-style:normal;font-size:.8rem}
.etapes-suivi .etape.fait{color:#1a6079}
.etapes-suivi .etape.fait i{background:#1a6079;border-color:#1a6079;color:#fff}
.etapes-suivi .etape.cours i{border-color:#d1908a;color:#d1908a}

/* Modales compactes : titres, libellés, champs et marges plus petits (boutique et administration). */
.modal-header{padding:.7rem 1rem;border-bottom-color:var(--bs-border-color)}
.modal-title{font-size:1.05rem;font-weight:600}
.modal-body{padding:1rem;font-size:.9rem}
.modal-body .form-label,.modal-body label{margin-bottom:.2rem;font-size:.82rem;font-weight:600}
.modal-body .form-control,.modal-body .form-select{font-size:.9rem;padding:.35rem .7rem}
.modal-body .form-text,.modal-body small,.modal-body .invalid-feedback{font-size:.78rem}
.modal-body .row{--bs-gutter-x:.75rem;--bs-gutter-y:.6rem}
.modal-body .mb-3{margin-bottom:.75rem!important}
.modal-footer{padding:.6rem 1rem;gap:.5rem;border-top-color:var(--bs-border-color)}
.modal-footer>*{margin:0}
