/* ==========================================================================
   REFONTE VISUELLE - Site public de l'école
   Fichier additif : ne modifie aucun fichier du thème d'origine.
   Charge en dernier (voir stylesheets.php), il vient donc naturellement
   affiner/surcharger les styles par défaut du thème "Front".
   ========================================================================== */

/* ---------- 1. Palette & typographie ---------- */
:root {
  /* Palette "école" : bleu profond + accent doré, plus chaleureuse que le
     bleu générique du thème par défaut. Change ces 3 valeurs pour adapter
     aux couleurs de l'établissement (logo, uniforme, etc.) */
  --school-primary:   #1a3a6b;
  --school-primary-dark: #102548;
  --school-accent:    #f2a900;
  --school-accent-dark: #d99400;
  --school-ink:       #1e2430;
  --school-muted:     #6b7686;
  --school-bg-soft:   #f7f9fc;

  --primary: var(--school-primary) !important;
}

body {
  color: var(--school-ink);
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  font-weight: 600;
  letter-spacing: -0.01em;
}

.text-primary {
  color: var(--school-primary) !important;
}

p {
  color: var(--school-muted);
  line-height: 1.75;
}

/* ---------- 2. Boutons ---------- */
.btn {
  border-radius: 8px;
  font-weight: 500;
  letter-spacing: 0.01em;
  transition: transform .18s ease, box-shadow .18s ease, background-color .18s ease;
}

.btn-primary {
  background-color: var(--school-primary);
  border-color: var(--school-primary);
  box-shadow: 0 6px 16px rgba(26, 58, 107, 0.25);
}
.btn-primary:hover,
.btn-primary:focus {
  background-color: var(--school-primary-dark);
  border-color: var(--school-primary-dark);
  transform: translateY(-2px);
  box-shadow: 0 10px 22px rgba(26, 58, 107, 0.32);
}

.btn-soft-success,
.btn-soft-primary {
  background-color: rgba(242, 169, 0, 0.12);
  color: var(--school-accent-dark);
  border-color: transparent;
}

.btn-pill {
  border-radius: 50px;
}

/* Bouton accent doré, utile pour les CTA ("S'inscrire", "Admission en ligne") */
.btn-accent {
  background-color: var(--school-accent);
  border-color: var(--school-accent);
  color: #1e2430;
  box-shadow: 0 6px 16px rgba(242, 169, 0, 0.3);
}
.btn-accent:hover {
  background-color: var(--school-accent-dark);
  border-color: var(--school-accent-dark);
  color: #1e2430;
  transform: translateY(-2px);
}

/* ---------- 3. Navigation ---------- */
.u-header__navbar-brand-text-white,
.u-header__nav-link {
  font-weight: 500;
}

.u-header__navbar-nav .nav-item.active .nav-link,
.u-header__nav-link:hover {
  color: var(--school-accent) !important;
}

.u-header__section {
  transition: background-color .25s ease, box-shadow .25s ease;
}

/* ---------- 4. Hero / slider ---------- */
.u-hero-v1 .js-slide {
  position: relative;
}
.u-hero-v1 .js-slide::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(16,37,72,.55) 0%, rgba(16,37,72,.72) 100%);
}
.u-hero-v1 .js-slide > div {
  position: relative;
  z-index: 1;
}
.u-hero-v1 h2 {
  font-size: 2.6rem;
  font-weight: 700;
  text-shadow: 0 2px 12px rgba(0,0,0,.25);
}
.u-hero-v1 p {
  color: rgba(255,255,255,.92) !important;
  font-size: 1.05rem;
}

/* ---------- 5. Sections / cartes ---------- */
.space-2, .space-3 {
  padding-top: 4.5rem;
  padding-bottom: 4.5rem;
}

.card,
.u-shadow-v18,
.u-block-hover {
  border: none;
  border-radius: 14px;
  box-shadow: 0 4px 20px rgba(30, 36, 48, 0.06);
  transition: transform .25s ease, box-shadow .25s ease;
}
.card:hover,
.u-block-hover:hover {
  transform: translateY(-6px);
  box-shadow: 0 14px 32px rgba(30, 36, 48, 0.12);
}

.u-icon-v1 {
  background-color: var(--school-bg-soft) !important;
  color: var(--school-primary) !important;
  border-radius: 14px;
}

.btn.btn-xs.btn-pill {
  text-transform: uppercase;
  font-size: .72rem;
  letter-spacing: .06em;
}

hr {
  opacity: .08;
}

/* ---------- 6. Footer ---------- */
footer, #footer {
  background-color: var(--school-primary-dark) !important;
}
footer a, #footer a {
  color: rgba(255,255,255,.75) !important;
  transition: color .15s ease;
}
footer a:hover, #footer a:hover {
  color: var(--school-accent) !important;
}
footer h1, footer h2, footer h3, footer h4, footer h5,
#footer h1, #footer h2, #footer h3, #footer h4, #footer h5 {
  color: #fff !important;
}

/* Bootstrap .list-group-item a son propre fond blanc par défaut : invisible
   sur un footer clair, mais ça devient une "carte blanche" incongrue une
   fois le footer passé en bleu marine, et le texte clair devient illisible
   dessus. On neutralise ce fond et on soigne les états du lien. */
footer .list-group-item,
#footer .list-group-item {
  background-color: transparent !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
  color: rgba(255, 255, 255, 0.75) !important;
}
footer .list-group-item-action,
#footer .list-group-item-action {
  color: rgba(255, 255, 255, 0.75) !important;
  background-color: transparent !important;
}
footer .list-group-item-action:hover,
footer .list-group-item-action:focus,
#footer .list-group-item-action:hover,
#footer .list-group-item-action:focus {
  color: var(--school-accent) !important;
  background-color: transparent !important;
}
footer address a,
#footer address a {
  color: rgba(255, 255, 255, 0.75) !important;
}
footer address a:hover,
#footer address a:hover {
  color: var(--school-accent) !important;
}

/* ---------- 7. Petits détails ---------- */
img {
  border-radius: 10px;
}
.rounded-circle img,
.avatar,
.u-header__navbar-brand img {
  border-radius: 50% !important;
}

::selection {
  background: var(--school-accent);
  color: #1e2430;
}

@media (max-width: 576px) {
  .u-hero-v1 h2 {
    font-size: 1.7rem;
  }
  .space-2, .space-3 {
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
  }
}