/* -------- LIGNE PRINCIPALE -------- */
.apprenti-row {
  display: flex;
  align-items: center;
  gap: 15px;
  background: #ffffff;
  border: 1px solid #cccccc;
  border-radius: 8px;
  padding: 10px 15px;
  margin-bottom: 12px;
  box-shadow: 0 1px 3px rgba(0,0,0,0.06);
}

/* -------- COLONNE PHOTO -------- */
.apprenti-photo img.photo {
  width: 90px;
  height: 90px;
  border-radius: 8px;
  object-fit: cover;
}

/* -------- INFOS IDENTITAIRES -------- */
.apprenti-infos-id {
  flex: 1.2;
  min-width: 220px;
  line-height: 1.2;
}

.nom-ligne {
  display: flex;
  align-items: baseline;
  gap: 6px;
}

.nom-ligne .nom {
  font-weight: 800;
  color: #651c86;
  font-size: 1.2rem;
  text-transform: uppercase;
}

.linkedin-icon, .cv-icon {
  width: 20px;
  height: 20px;
  vertical-align: middle;
}

.opt {
  color: #a4133c;
  font-weight: 600;
}

.entreprise {
  color: #333;
  font-size: 0.9rem;
}

.rpma {
  font-size: 0.9rem;
  color: #444;
  margin-top: 2px;
}

.num-iad {
  font-size: 0.85rem;
  color: #c14a6b;
  margin-top: 3px;
}

/* -------- TRAVAUX / RÉSULTATS -------- */
.apprenti-travaux {
  flex: 2;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  font-size: 0.9rem;
  text-align: center;
}

.travaux-header, .travaux-body, .travaux-notes {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  align-items: center;
}

.travaux-header {
  background: #1f4f87;
  color: white;
  font-weight: 700;
  padding: 4px 0;
  font-size: 0.9rem;
}

.travaux-body {
  padding: 4px 0;
}

.travaux-body i {
  color: #009b3a;
  font-size: 1.3rem;
}

.travaux-notes span {
  font-size: 0.8rem;
  color: #555;
  padding-bottom: 2px;
}

/* -------- RESPONSIVE -------- */




@media (max-width: 800px) {
  .apprenti-row {
    flex-direction: column;
    align-items: stretch;
    padding: 10px;
  }

  .apprenti-photo img.photo {
    width: 130px;
    height: 130px;
    margin: 0 auto;
  }

  .apprenti-infos-id {
    text-align: center;
    margin-top: 8px;
  }

  .apprenti-travaux {
    margin-top: 10px;
  }

  .travaux-header, .travaux-body, .travaux-notes {
    grid-template-columns: repeat(3, 1fr);
  }
}
/* ---------- LIGNE PROJET ---------- */
.apprenti-projet {
  grid-column: 1 / -1;
  background: #1f4f87;
  color: white;
  font-weight: 600;
  font-size: 1rem;
  padding: 6px 10px;
  border-radius: 0 0 6px 6px;
  margin-top: -4px;       /* colle visuellement à la ligne précédente */
}

.apprenti-projet .label {
  color: #fff;
  font-weight: bold;
  margin-right: 8px;
}


/* ---------- BLOC STAT2---------- */
.stats-container {
  margin: 25px auto;
  text-align: center;
  background: #f7f8fc;
  border-radius: 10px;
  padding: 20px;
  width: 95%;
  box-shadow: 0 1px 4px rgba(0,0,0,0.1);
}

.stats-container h3 {
  margin-bottom: 12px;
  color: #1f4f87;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.stats-grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 18px;
}

.stat-card {
  flex: 0 1 120px;
  text-align: center;
}

.stat-circle {
  position: relative;
  width: 90px;
  height: 90px;
  border-radius: 50%;
  background: conic-gradient(#2fa84f calc(var(--p) * 1%), #ccc 0);
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0 auto 8px auto;
  transition: background 0.5s;
}

.stat-circle .stat-number {
  font-weight: 700;
  color: #333;
  font-size: 1.1rem;
}

.stat-label {
  font-size: 0.9rem;
  font-weight: bold;
  color: #004aad;
}

.stat-small {
  font-size: 0.8rem;
  color: #666;
}


.eval-admin-icons {
    display: flex;
    flex-wrap: wrap;
    gap: 3px;
}
.eval-admin-icons img {
    width: 50px;
    height: auto;
}

.eval-admin-fichs {
    display: flex;
    flex-wrap: wrap;
    gap: 3px;
}

.eval-admin-fichs img {
    width: 80px;
    height: auto;
}
	/* Création portes coulissantes */			
 #choixindex {
    float:left;
    width:100%;
    font-size:93%;
	line-height:normal;
    }				
#choixindex ul {
    margin:0;
    padding:10px 10px 0;
    list-style:none;
    }
  #choixindex li {
    float:left;
	background:url("../APPRENTI2/img/left.gif") no-repeat left top;
    margin:0;
    padding:0 0 0 9px;
    }				
 #choixindex a {
	 float:left;
    display:block;
	 background:url("../APPRENTI2/img/right.gif") no-repeat right top;
      padding:5px 15px 4px 6px;
	  text-decoration:none;
  font-weight:bold;
  color:#765;
        }
/* Commented Backslash Hack
   hides rule from IE5-Mac \*/
#choixindex a {float:none;}
/* End IE5-Mac hack */
#choixindex a:hover {
  color:#333;
  }		
 #choixindex #current {
    background-image:url("../APPRENTI2/img/left_on.gif");
    }
  #choixindex #current a {
    background-image:url("../APPRENTI2/img/right_on.gif");
	color:#333;
	  padding-bottom:5px;
    }	
			#choixindex li.excel-link {
    float: right;              /* pousse ce li à droite */
    background: none;          /* pas de left.gif */
    padding: 0;                /* pas de padding gauche spécial */
    margin-left: 10px;         /* petit espace avec les autres onglets */
}
#choixindex li.excel-link a {
    background: none;          /* pas de right.gif */
    padding: 5px 5px 4px 5px;  /* un peu de marge autour de l’icône */
}
/* et enlève le float sur l’img */
#choixindex li.excel-link img {
    float: none;
    display: block;            /* optionnel pour centrer verticalement */
}
/* style TOEIC \*/

/* Conteneur principal stylé */
.toeic-panel{
  border:1px solid #004d6e;
  border-left:6px solid #009ee0;
  border-radius:14px;
  background:#ffffff;
  box-shadow:0 6px 24px rgba(0,0,0,0.08);
  padding:20px;
}

/* En-tête */
.toeic-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  margin-bottom:12px;
}
.toeic-badge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  background:#0d6efd;
  color:#fff;
  text-transform:uppercase;
  font-weight:700;
  letter-spacing:.03em;
  padding:8px 12px;
  border-radius:10px;
  box-shadow:0 2px 8px rgba(13,110,253,0.25);
  font-size:.9rem;
}
.toeic-badge i{ color:#cdfc87; }
.toeic-logo{ height:100px; object-fit:contain; }

/* Intro */
.toeic-intro{
  color:#334155; 
  margin:8px 0 18px;
}

/* Bloc résultat */
.toeic-result{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:16px;
  flex-wrap:wrap;
  border:1px dashed rgba(0,0,0,0.08);
  border-radius:12px;
  padding:12px 14px;
  background:linear-gradient(180deg,#f8fbff,transparent);
  margin-bottom:14px;
}
.toeic-score-label{
  font-size:.9rem; 
  color:#64748b; 
  margin-bottom:2px;
}
.toeic-score-value{
  font-size: clamp(32px, 6vw, 56px);
  line-height:1;
  font-weight:800;
  color:#0b4a6b;
  letter-spacing:-0.02em;
}
.toeic-subscore{
  color:#475569;
  margin-top:4px;
}
.toeic-level{
  text-align:right;
  font-size:.95rem;
}
.toeic-level-chip{
  display:inline-block;
  font-size:2rem;
  padding:6px 100px;
  border-radius:999px;
  background:#e6f7ff;
  color:#004d6e;
  font-weight:700;
  border:1px solid #b3ecff;
}
.toeic-method{
  display:block;
  color:#64748b;
  margin-top:6px;
}

/* Échelle */
.toeic-scale-wrapper{ margin-top:8px; }
.toeic-scale{
  position:relative;
  height:30px;
  border-radius:999px;
  background:#eff4f7;
  overflow:hidden;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,0.06);
}

/* Bandes de couleurs pour les niveaux */
.toeic-band{ position:absolute; top:0; bottom:0; opacity:.9; }
.toeic-band.a1{ background:#d9f99d; }   /* vert doux */
.toeic-band.a2{ background:#a7f3d0; }   /* vert menthe */
.toeic-band.b1{ background:#93c5fd; }   /* bleu clair */
.toeic-band.b2{ background:#60a5fa; }   /* bleu */
.toeic-band.c1{ background:#3b82f6; }   /* bleu soutenu */

/* Marques (ticks) et labels */
.toeic-tick{
  position:absolute; top:100%;
  width:1px; height:10px; background:#94a3b8;
  transform:translateX(-0.5px);
}
.toeic-tick::after{
  content:attr(data-label);
  position:absolute; top:12px; left:50%; transform:translateX(-50%);
  color:#64748b; font-size:.75rem; white-space:nowrap;
}

/* Pointeur de score */
.toeic-pointer{
  position:absolute; top:50%;
  transform:translate(-50%, -50%);
}
.toeic-pointer-dot{
  width:18px; height:24px; border-radius:30%;
  background:#000; border:3px solid #fff;
  box-shadow:0 2px 8px rgba(14,165,233,0.5), 0 0 0 2px rgba(14,165,233,0.2);
  display:block;
}
@media (prefers-reduced-motion: no-preference){
  .toeic-pointer-dot{ animation:pop .5s ease-out both; }
  @keyframes pop{
    0%{ transform:scale(.6); opacity:.3; }
    100%{ transform:scale(1); opacity:1; }
  }
}

/* Légende */
.toeic-legend{
  display:flex; gap:12px; flex-wrap:wrap;
  list-style:none; padding:8px 0 0; margin:0;
  color:#475569; font-size:.9rem;
}
.toeic-legend .swatch{
  display:inline-block; width:14px; height:14px; border-radius:3px; margin-right:6px;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,0.08);
}
.swatch.a1{ background:#d9f99d; }
.swatch.a2{ background:#a7f3d0; }
.swatch.b1{ background:#93c5fd; }
.swatch.b2{ background:#60a5fa; }
.swatch.c1{ background:#3b82f6; }

/* Description + alertes */
.toeic-desc{
  margin-top:10px; color:#334155; background:#f8fafc; border:1px solid #e2e8f0;
  padding:12px; border-radius:10px;
}
.toeic-alert{
  margin-top:8px; color:#b45309; background:#fff7ed; border:1px solid #fed7aa;
  padding:10px; border-radius:10px; font-size:.95rem;
}