/* Cyclisme & Dopage - Feuille de style
// Création     : 09/08/2025
// Purpose      : feuille de style pour les chronologies (timeline)
// Usage        : Affaires.xlsm, Portraits.xlsm
*/

 .timeline-wrap{
    padding:12px 0;
  }

  .timeline{
    position:relative;
    padding:24px 0;
  }

  /* ligne verticale */
  .timeline::before{
    content:"";
    position:absolute;
    left:158px; /* position de la ligne dans le bloc */
    top:0;
    bottom:0;
    width:3px;
    background:#C7C7C7;
  }

  .timeline-item{
    position:relative;
    margin-bottom:28px;
    display:flex;
  }

  /* pastille */
  .timeline-item::before{
    content:"";
    position:absolute;
    left:150px;
    width:18px;
    height:18px;
    border-radius:50%;
    background:#DCDCDC;
    box-shadow: 0 0 0 4px #C7C7C7, 0 0 0 6px #69003F inset;
    z-index:2;
  }

  /* colonne date */
  .timeline-date{
    width:200px;
    text-align:right;
    padding-right:60px;
    box-sizing:border-box;
  }

  /* colonne contenu */
  .timeline-content{
    flex:1;
    padding-left:10px; 
 
  }

  details{
    padding:0;
  
  }

  summary.chronologie{
    list-style:none;
    cursor:pointer;
    font-weight:bold;
    color:black;
    display:flex;
    align-items:center;
    gap:6px;
  }
  summary.chronologie::-webkit-details-marker { display:none; }

  .toggle-icon{
    font-size:0.8rem;
    color:#FF9A00;
    transition:transform 0.2s ease;
  }

  details[open] .toggle-icon{
    transform:rotate(90deg);
  }

  .meta{
    font-size:0.85rem;
    color:#B4547D;
    margin:4px 0;
  }

  .desc{
    margin:0;
    color:black;
    padding-top:10px;
  }

  /* mobile */
  @media (max-width:700px){
    .timeline::before{ left:10px; }
    .timeline-item{ flex-direction:column; padding-left:32px; }
    .timeline-item::before{ left:0; }
    .timeline-date{
      width:auto;
      text-align:left;
      padding-right:0;
      margin-bottom:4px;
    }
    .timeline-content{ padding-left:0; }
  }