/* ==========================================================
   UMI – Offre de formation : refonte visuelle (nov. 2026)
   Palette alignée sur iro/rsi : bleu #007fa4, bleu foncé #0b4f66, orange #f7a94a
   ========================================================== */
:root{--umi-blue:#007fa4;--umi-dark:#0b4f66;--umi-orange:#f7a94a;--umi-light:#f4f8fa;--umi-border:#e2ecf0}
body{font-family:"Roboto",Arial,sans-serif!important;color:#2b3a42;background:#fff}
h1,h2,h3,h4,h5{font-family:"Roboto",Arial,sans-serif!important}

/* ---------- Barre des établissements ---------- */
.header,#profils_preferences{background:var(--umi-dark)!important}
#profils_preferences .UEI_title a{font-size:13px!important;letter-spacing:.03em;color:rgba(255,255,255,.9)!important}
#profils_preferences .UEI_title a:hover{color:#ffcf8a!important;text-decoration:none}

/* ---------- Bannière : image entière, jamais déformée ni agrandie au-delà de sa taille réelle (1420x301, version sans photo) ---------- */
.umi-banner{position:relative;margin-top:40px;overflow:hidden;background:#0b7fa6;line-height:0}
.umi-banner-bg{position:absolute;inset:-20px;background-size:cover;background-position:center;filter:blur(14px) brightness(.9) saturate(1.05);transform:scale(1.05)}
.umi-banner-img{position:relative;display:block;width:100%;max-width:1420px;height:auto;margin:0 auto;aspect-ratio:1420/301}
/* Mobile : recadrage centré sur « FORMATION » et les trois pastilles (le logo reste dans le pied de page) */
@media (max-width:575px){
  .umi-banner{margin-top:36px}
  .umi-banner-img{height:110px;width:100%;object-fit:cover;object-position:50% 50%;aspect-ratio:auto}
}

/* ---------- Menu ---------- */
.menu-container{background:var(--umi-blue)!important;box-shadow:0 3px 12px rgba(0,40,55,.15)}
.training-title-container a{font-weight:500!important;letter-spacing:.06em;transition:color .2s ease,background .2s ease}
.training-title-container a:hover{color:#ffcf8a!important;background:rgba(255,255,255,.06);text-decoration:none}

/* ---------- Accueil ---------- */
.umi-hero{padding:42px 0 10px}
.umi-hero h1{font-size:30px;font-weight:700;color:var(--umi-dark);margin:0 0 14px;line-height:1.25}
.umi-hero h1::after{content:"";display:block;width:56px;height:3px;background:var(--umi-orange);border-radius:3px;margin-top:14px}
.umi-hero p{font-size:16px;line-height:1.7;color:#4a5a63;max-width:900px;margin:0}
.umi-domains{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px;margin:26px 0 8px;padding:0;list-style:none}
.umi-domains li{display:flex;align-items:center;gap:14px;padding:16px 18px;background:#fff;border:1px solid var(--umi-border);border-radius:10px;box-shadow:0 2px 8px rgba(0,50,70,.06);font-weight:500;color:var(--umi-dark);transition:transform .2s ease,box-shadow .2s ease}
.umi-domains li:hover{transform:translateY(-3px);box-shadow:0 10px 22px rgba(0,50,70,.13)}
.umi-domains .fa{flex:0 0 44px;width:44px;height:44px;line-height:44px;text-align:center;border-radius:50%;background:rgba(0,127,164,.1);color:var(--umi-blue);font-size:19px}
.umi-cta{display:flex;flex-wrap:wrap;gap:12px;margin:22px 0 4px}
.umi-btn{display:inline-block;padding:11px 22px;border-radius:6px;font-weight:600;letter-spacing:.02em;transition:background .2s ease,transform .2s ease}
.umi-btn-primary{background:var(--umi-blue);color:#fff!important}
.umi-btn-primary:hover{background:var(--umi-dark);text-decoration:none;transform:translateY(-1px)}
.umi-btn-outline{border:1px solid var(--umi-blue);color:var(--umi-blue)!important}
.umi-btn-outline:hover{background:rgba(0,127,164,.08);text-decoration:none}

/* ---------- Cartes statistiques (graphiques) ---------- */
.umi-charts{display:grid;grid-template-columns:repeat(auto-fit,minmax(420px,1fr));gap:22px;margin:30px 0 50px}
@media (max-width:500px){.umi-charts{grid-template-columns:1fr}}
.umi-card{background:#fff;border:1px solid var(--umi-border);border-radius:12px;box-shadow:0 2px 10px rgba(0,50,70,.07);overflow:hidden}
.umi-card-header{background:linear-gradient(135deg,var(--umi-blue),#005c78);color:#fff;padding:14px 18px;font-size:15px;font-weight:600;letter-spacing:.02em}
.umi-card-header .fa{color:#ffcf8a;margin-right:8px}
.umi-card-body{padding:12px}
.umi-chart{width:100%!important;height:320px!important}

/* ---------- Pages Établissements / Diplômes (widgets existants) ---------- */
.widget-box{border:1px solid var(--umi-border)!important;border-radius:12px;overflow:hidden;box-shadow:0 2px 10px rgba(0,50,70,.07)}
.widget-header{background:linear-gradient(135deg,var(--umi-blue),#005c78)!important;border:0!important}
.courses h1{color:var(--umi-dark);font-weight:700}
table{border-collapse:collapse}
.table thead th,table thead th{background:var(--umi-light);color:var(--umi-dark);border-bottom:2px solid var(--umi-blue)!important}
.table tbody tr:hover{background:#f7fbfc}
.btn,button,input[type=submit]{border-radius:6px}
select,input[type=text],input[type=search]{border-radius:6px!important;border:1px solid #cfdde3!important}

/* ---------- Pied de page ---------- */
.footer{background:var(--umi-dark)!important}
.footer .footer_title{font-size:14px!important;letter-spacing:.1em;text-transform:uppercase;position:relative;padding-bottom:12px}
.footer .footer_title::after{content:"";position:absolute;left:0;bottom:0;width:36px;height:2px;background:var(--umi-orange);border-radius:2px}
.footer .footer_contact_info li{color:rgba(255,255,255,.82)!important;line-height:1.8}
.footer .footer_social a{border-radius:50%;transition:background .2s ease}
.footer .footer_social a:hover{background:rgba(255,255,255,.15)}

/* ---------- Pages de recherche (Établissements / Diplômes) ---------- */
.courses{padding-top:34px;padding-bottom:40px}
.courses .container > .row:first-child,.courses_search_container{background:#fff;border:1px solid var(--umi-border);border-radius:12px;box-shadow:0 2px 10px rgba(0,50,70,.07);padding:18px 16px;margin-bottom:22px}
/* Onglets « Recherche par … » */
.courses .btn-info{background:#fff!important;color:var(--umi-blue)!important;border:1px solid var(--umi-blue)!important;border-radius:20px!important;padding:7px 16px!important;font-weight:500;margin:4px 6px!important;transition:background .2s ease,color .2s ease}
.courses .btn-info:hover,.courses .btn-info:focus,.courses .btn-info.active{background:var(--umi-blue)!important;color:#fff!important;box-shadow:none}
/* Listes déroulantes et champs */
.courses_search_input,.courses select,.courses .form-control{height:46px!important;border:1px solid #cfdde3!important;border-radius:8px!important;padding:0 14px!important;font-size:15px!important;color:#2b3a42!important;background-color:#fff!important;box-shadow:none!important;transition:border-color .2s ease,box-shadow .2s ease}
.courses_search_input:focus,.courses select:focus,.courses .form-control:focus{border-color:var(--umi-blue)!important;box-shadow:0 0 0 3px rgba(0,127,164,.15)!important;outline:0}
/* Boutons de recherche */
.courses_search_button{background:var(--umi-blue)!important;color:#fff!important;border:0!important;border-radius:8px!important;height:46px;padding:0 26px!important;font-weight:600!important;letter-spacing:.03em;text-transform:none!important;transition:background .2s ease,transform .2s ease}
.courses_search_button:hover{background:var(--umi-dark)!important;transform:translateY(-1px)}
/* Bouton Retour */
.courses .fa-backward{margin-right:6px}
/* Zone des résultats */
#Diplome,#Etablissement,#result,.search_result,.courses .table-responsive{background:#fff;border-radius:12px}
.courses .card,.courses .list-group-item{border:1px solid var(--umi-border)!important;border-radius:10px!important;margin-bottom:10px;box-shadow:0 2px 8px rgba(0,50,70,.05);transition:box-shadow .2s ease}
.courses .card:hover,.courses .list-group-item:hover{box-shadow:0 8px 20px rgba(0,50,70,.1)}
.courses a{color:var(--umi-blue)}
.courses a:hover{color:var(--umi-dark)}
/* Typeahead (autocomplétion) */
.typeahead.dropdown-menu{border:0;border-radius:10px;box-shadow:0 12px 28px rgba(0,40,55,.18);padding:6px 0}
.typeahead.dropdown-menu .active > a,.typeahead.dropdown-menu a:hover{background:rgba(0,127,164,.1)!important;color:var(--umi-dark)!important}
@media (max-width:767px){
  .courses{padding-top:20px}
  .umi-hero{padding-top:24px}
  .umi-hero h1{font-size:23px}
  .umi-hero p{font-size:15px}
  .umi-cta .umi-btn{width:100%;text-align:center}
  .umi-chart{height:280px!important}
  .courses_search_button{width:100%;margin-left:0!important}
}

/* ---------- En-tête des pages intérieures ---------- */
.umi-page-head{padding:6px 0 18px}
.umi-page-head h1{font-size:28px;font-weight:700;color:var(--umi-dark);margin:0 0 10px;line-height:1.25}
.umi-page-head h1::after{content:"";display:block;width:56px;height:3px;background:var(--umi-orange);border-radius:3px;margin-top:12px}
.umi-page-head p{font-size:15.5px;color:#4a5a63;max-width:820px;margin:0;line-height:1.65}

/* ---------- Barre de recherche (Diplômes) : champ + liste + bouton, qui passent à la ligne si besoin ---------- */
.courses_search_container.courses_search_form{flex-wrap:wrap!important;gap:12px;justify-content:flex-start!important;align-items:stretch!important}
.courses_search_container.courses_search_form > .courses_search_input,.courses_search_container.courses_search_form > input{flex:1 1 260px;min-width:0;margin:0!important;width:auto!important}
.courses_search_container.courses_search_form > .courses_search_button{flex:0 0 auto;margin:0!important}
.courses_search_container #resultat:empty{display:none}
/* Champ texte (Établissements) aligné sur les listes */
#search_d .courses_search_input,#search.courses_search_input{width:100%!important}
.courses .row > [class*="col-sm-3"]{margin-bottom:10px}
/* Onglets de mode de recherche : alignés et de même largeur */
#row_choix{gap:0;margin-bottom:8px}
#row_choix .courses_search_button{width:100%!important;margin-top:10px!important;white-space:normal;line-height:1.3;min-height:46px;height:auto;padding:10px 16px!important}

/* ---------- Chargement ---------- */
#test{font-size:15px!important;font-weight:500;color:var(--umi-blue)!important;display:flex;align-items:center;gap:10px;margin:18px 0}
.umi-spinner{display:inline-block;width:20px;height:20px;border:3px solid rgba(0,127,164,.2);border-top-color:var(--umi-blue);border-radius:50%;animation:umi-spin .8s linear infinite}
@keyframes umi-spin{to{transform:rotate(360deg)}}

/* ---------- Compteur de résultats ---------- */
.umi-count{margin:8px 0 16px;font-size:15px;font-weight:600;color:var(--umi-dark)}
.umi-count.umi-empty{font-weight:500;color:#6a7a83;background:var(--umi-light);border:1px dashed #cfdde3;border-radius:10px;padding:18px 20px;text-align:center}

/* ---------- Cartes de résultats : grille, même hauteur ---------- */
#search_result .courses_row{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:18px;margin:0!important}
#search_result .courses_row > .course_col{max-width:none!important;width:auto!important;flex:none!important;padding:0!important;margin:0!important}
#search_result .courses_row::before,#search_result .courses_row::after{display:none}
#search_result .course_col:has(.course_title a:empty){display:none!important}
#search_result .course{height:100%;display:flex;flex-direction:column;background:#fff;border:1px solid var(--umi-border);border-radius:12px;box-shadow:0 2px 8px rgba(0,50,70,.06);overflow:hidden;transition:transform .2s ease,box-shadow .2s ease;margin:0!important}
#search_result .course:hover{transform:translateY(-3px);box-shadow:0 12px 24px rgba(0,50,70,.13)}
#search_result .course_body{flex:1 1 auto;padding:18px 18px 12px!important;text-align:start}
#search_result .course_title{font-size:16px!important;line-height:1.4!important;font-weight:600!important;margin:0 0 8px!important;text-align:start;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
#search_result .course_title a{color:var(--umi-dark)!important}
#search_result .course_title a:hover{color:var(--umi-blue)!important;text-decoration:none}
#search_result .course_title[dir="rtl"],#search_result .course_title:lang(ar){font-size:17px!important}
#search_result .course_teacher{font-size:13px!important;color:#6a7a83!important;margin-bottom:10px!important;text-align:start}
/* Pastilles */
#search_result .span-info{display:inline-flex;align-items:center;gap:6px;font-size:12px!important;font-weight:600;line-height:1;padding:6px 10px!important;border-radius:20px!important;background:rgba(0,127,164,.1)!important;color:var(--umi-blue)!important;margin:2px 4px 2px 0!important}
#search_result .span-info.bl{background:rgba(0,127,164,.1)!important;color:var(--umi-blue)!important}
#search_result .span-info.bg-success{background:rgba(247,169,74,.16)!important;color:#b86b0c!important}
#search_result .course_body br{display:none}
/* Pied de carte : établissement */
#search_result .course_footer{border-top:1px solid #edf2f4;padding:12px 18px!important;background:#fafcfd;margin:0!important}
#search_result .course_info{font-size:13px;color:#4a5a63;display:flex;align-items:flex-start;gap:8px;line-height:1.4}
#search_result .course_info .fa{color:var(--umi-orange);margin-top:2px}

/* ---------- Autocomplétion jQuery UI ---------- */
.ui-autocomplete{max-height:320px;overflow-y:auto;border:0!important;border-radius:10px;box-shadow:0 12px 28px rgba(0,40,55,.18);padding:6px 0!important;font-family:"Roboto",Arial,sans-serif;font-size:14px;background:#fff;z-index:1000!important}
.ui-autocomplete .ui-menu-item-wrapper,.ui-autocomplete .ui-menu-item a{padding:8px 14px!important;border:0!important;border-radius:0!important}
.ui-autocomplete .ui-state-active,.ui-autocomplete .ui-menu-item-wrapper:hover{background:rgba(0,127,164,.1)!important;color:var(--umi-dark)!important;margin:0!important}

/* ---------- Fiche détaillée d'une formation ---------- */
.course_container .course_title,.course > .course_title{color:var(--umi-dark)}
.tab{border-radius:8px 8px 0 0;font-weight:500;transition:background .2s ease,color .2s ease}
.tab.active{background:var(--umi-blue)!important;color:#fff!important}
.tab_panel_title{color:var(--umi-dark);font-weight:600}
.tab_panel_content{line-height:1.7;color:#3b4a52}
.sidebar_section{background:#fff;border:1px solid var(--umi-border);border-radius:12px;box-shadow:0 2px 10px rgba(0,50,70,.06);padding:20px 20px 10px;margin-bottom:22px}
.feature{border-bottom:1px solid #edf2f4;padding:10px 0}
.feature:last-child{border-bottom:0}
.feature_title{color:var(--umi-dark);font-weight:500}
.feature_text{color:#4a5a63}

@media (max-width:767px){
  .umi-page-head h1{font-size:22px}
  .umi-page-head p{font-size:14.5px}
  #search_result .courses_row{grid-template-columns:1fr;gap:12px}
  .courses_search_container.courses_search_form > .courses_search_button{flex:1 1 100%}
}

/* ---------- Menu « Facultés et écoles » ---------- */
#profils_preferences .UEI_title a{display:inline-flex;align-items:center;gap:8px;padding:9px 0}
.UEI_nav > div > ul{background:#fff!important;border-radius:0 0 12px 12px;box-shadow:0 14px 30px rgba(0,40,55,.22);padding:18px 22px 14px!important;display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:6px 28px}
.UEI_nav .UEI_SECTEURS{list-style:none}
.UEI_nav .UEI_SECTEURS > b{display:block;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--umi-orange);margin:0 0 8px;padding-bottom:6px;border-bottom:1px solid #edf2f4}
.UEI_nav .UEI_DETAILS{list-style:none;padding:0;margin:0}
.UEI_nav .UEI_DETAILS li{padding:5px 0;font-size:14px}
.UEI_nav .UEI_DETAILS li .fa{color:var(--umi-blue);font-size:10px;margin-right:8px}
.UEI_nav .UEI_DETAILS a{color:#2b3a42!important;transition:color .2s ease}
.UEI_nav .UEI_DETAILS a:hover{color:var(--umi-blue)!important;text-decoration:none}
.UEI_nav li.close{grid-column:1/-1;text-align:right;list-style:none;opacity:1;float:none}
.UEI_nav li.close button{background:transparent;border:0;color:#6a7a83;font-size:13px;cursor:pointer}
.UEI_nav li.close button:hover{color:var(--umi-dark)}

/* ---------- Menu principal (Accueil / Rechercher / Par diplôme) ---------- */
.menu-container{background:linear-gradient(90deg,#0b4f66,#007fa4)!important;border:0!important}
.menu-inner-container{max-width:1170px;margin:0 auto;padding:0 15px}
.training-title-container{display:block!important;float:none!important;width:100%!important;padding:0!important;margin:0!important;text-align:left!important}
.umi-nav{display:flex;flex-wrap:wrap;align-items:stretch;gap:4px}
.umi-nav-link{display:inline-flex!important;align-items:center;gap:9px;padding:15px 18px!important;color:rgba(255,255,255,.9)!important;font-size:14.5px!important;font-weight:500!important;letter-spacing:.02em;text-transform:none!important;text-decoration:none!important;border:0!important;box-shadow:inset 0 -3px 0 transparent;background:transparent!important;transition:color .2s ease,background .2s ease,box-shadow .2s ease;line-height:1.2!important;height:auto!important}
.umi-nav-link .fa{font-size:15px;opacity:.9}
.umi-nav-link:hover,.umi-nav-link:focus{color:#ffcf8a!important;background:rgba(255,255,255,.07)!important;outline:0}
.umi-nav-link.is-active{color:#fff!important;box-shadow:inset 0 -3px 0 var(--umi-orange);background:rgba(255,255,255,.08)!important}
@media (max-width:575px){
  .umi-nav{gap:0;justify-content:space-between}
  .umi-nav-link{flex:1 1 0;justify-content:center;flex-direction:column;gap:4px;padding:10px 6px!important;font-size:12px!important;text-align:center}
  .umi-nav-link .fa{font-size:17px}
}