.ts-course{
  --ts:#026168;
  --ts-dark:#014a50;
  --gold:#ffb80c;
  --ink:#173235;
  --muted:#66777a;
  --line:#dde5e6;
  color:var(--ink);
}

.ts-course *{
  box-sizing:border-box;
}

.ts-course-hero{
  min-height:440px;
  background:
    linear-gradient(115deg,#014a50,#026168);
  background-size:cover;
  background-position:center;
  display:flex;
  align-items:flex-end;
  color:#fff;
  border-radius:0 0 24px 24px;
  overflow:hidden;
}

.ts-course-hero__inner{
  position:relative;
  width:min(1180px,100%);
  margin:auto;
  padding:64px 34px 44px;
}

.ts-course-badge{
  display:inline-block;
  background:rgba(255,255,255,.15);
  border:1px solid rgba(255,255,255,.2);
  padding:7px 13px;
  border-radius:999px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.05em;
}

.ts-course-hero h1{
  max-width:780px;
  margin:17px 0 18px;
  color:#fff;
  font-size:clamp(40px,6vw,70px);
  line-height:1.02;
}

.ts-course-meta,
.ts-course-actions{
  display:flex;
  flex-wrap:wrap;
  gap:14px 20px;
  align-items:center;
}

.ts-course-meta{
  font-weight:700;
}

.ts-course-actions{
  margin-top:26px;
}

.ts-course-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:13px 19px;
  border-radius:12px;
  text-decoration:none;
  font-weight:800;
}

.ts-course-btn--primary{
  background:var(--gold);
  color:#173235;
}

.ts-course-btn--ghost{
  background:rgba(255,255,255,.13);
  color:#fff;
  border:1px solid rgba(255,255,255,.3);
}

.ts-course-shell{
  width:min(1180px,calc(100% - 36px));
  margin:0 auto;
  padding:42px 0;
}

.ts-course-section > h2,
.ts-course-card h2,
.ts-course-advice h2,
.ts-course-cta h2{
  color:var(--ts);
  margin-top:0;
}

.ts-course-races{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(145px,1fr));
  gap:12px;
}

.ts-course-race{
  border:1px solid var(--line);
  border-radius:16px;
  padding:20px 14px;
  text-align:center;
  background:#fff;
  box-shadow:0 8px 25px rgba(23,50,53,.045);
}

.ts-course-race strong{
  display:block;
  color:var(--ts);
  font-size:27px;
}

.ts-course-race span,
.ts-course-race small{
  display:block;
  margin-top:7px;
}

.ts-course-race__time{
  font-weight:800;
}

.ts-course-grid{
  display:grid;
  grid-template-columns:1.12fr .88fr;
  gap:24px;
  margin-top:34px;
}

.ts-course-card{
  border:1px solid var(--line);
  border-radius:18px;
  padding:25px;
  background:#fff;
}

.ts-course-prose{
  line-height:1.72;
}

.ts-course-highlights{
  display:flex;
  flex-wrap:wrap;
  gap:9px;
  margin-top:20px;
}

.ts-course-highlights span{
  background:#edf7f7;
  color:var(--ts);
  padding:10px 12px;
  border-radius:10px;
  font-weight:750;
}

.ts-course-facts{
  margin:0;
}

.ts-course-facts > div{
  display:grid;
  grid-template-columns:135px 1fr;
  gap:14px;
  padding:11px 0;
  border-bottom:1px solid #edf1f1;
}

.ts-course-facts > div:last-child{
  border-bottom:0;
}

.ts-course-facts dt{
  font-weight:800;
  color:var(--ts);
}

.ts-course-facts dd{
  margin:0;
}

.ts-course-wide{
  margin-top:24px;
}

.ts-course-advice{
  display:flex;
  gap:18px;
  margin-top:24px;
  border:1.5px solid var(--gold);
  border-radius:18px;
  padding:24px;
  background:linear-gradient(90deg,#fff8e8,#fff);
}

.ts-course-advice__icon{
  display:grid;
  place-items:center;
  flex:0 0 55px;
  height:55px;
  border-radius:50%;
  background:var(--gold);
  font-size:26px;
}

.ts-course-section{
  margin-top:34px;
}

.ts-course-nearby{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:13px;
}

.ts-course-nearby a{
  border:1px solid var(--line);
  border-radius:14px;
  padding:17px;
  text-decoration:none;
  color:var(--ink);
  background:#fff;
}

.ts-course-nearby b,
.ts-course-nearby span{
  display:block;
}

.ts-course-nearby b{
  color:var(--ts);
  margin-bottom:7px;
}

.ts-course-nearby span{
  color:var(--muted);
  font-size:14px;
}

.ts-course-cta{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px;
  margin-top:34px;
  padding:25px;
  border-radius:17px;
  background:var(--ts);
  color:#fff;
}

.ts-course-cta h2{
  color:#fff;
  margin-bottom:4px;
}

.ts-course-cta p{
  margin:0;
  color:#dbecec;
}

@media(max-width:860px){

  .ts-course-grid{
    grid-template-columns:1fr;
  }

  .ts-course-nearby{
    grid-template-columns:repeat(2,1fr);
  }

}

@media(max-width:560px){

  .ts-course-hero{
    min-height:390px;
  }

  .ts-course-hero__inner{
    padding:42px 22px 30px;
  }

  .ts-course-shell{
    width:min(100% - 24px,1180px);
  }

  .ts-course-races{
    grid-template-columns:1fr 1fr;
  }

  .ts-course-facts > div{
    grid-template-columns:1fr;
    gap:4px;
  }

  .ts-course-nearby{
    grid-template-columns:1fr;
  }

  .ts-course-cta{
    align-items:flex-start;
    flex-direction:column;
  }

}

.ts-course-race__type{
  display:inline-block !important;
  margin-top:8px !important;
  padding:5px 9px;
  border-radius:999px;
  background:#edf7f7;
  color:#026168;
  font-size:12px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.03em;
}

/* Retour vers le calendrier régional */
.ts-course-back-wrap {
    margin: 22px 0 12px;
}

.ts-course-back {
    display: inline-flex;
    align-items: center;
    padding: 11px 17px;
    background: #026168;
    color: #fff !important;
    text-decoration: none !important;
    border-radius: 8px;
    font-weight: 700;
    line-height: 1.2;
    transition: transform .2s ease, background .2s ease, color .2s ease;
}

.ts-course-back:hover {
    background: #ffb80c;
    color: #1d1d1d !important;
    transform: translateY(-1px);
}

.ts-course-status {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    padding: .45rem .8rem;
    border-radius: 999px;
    font-size: .78rem;
    font-weight: 800;
    line-height: 1;
    letter-spacing: .02em;
    margin-right: .5rem;
    background: rgba(255,255,255,.14);
    border: 1px solid rgba(255,255,255,.24);
    color: #fff;
}

.ts-course-status--upcoming {
    background: rgba(255,184,12,.18);
    border-color: rgba(255,184,12,.65);
}

.ts-course-status--open {
    background: rgba(46,160,67,.22);
    border-color: rgba(80,200,100,.65);
}

.ts-course-status--full,
.ts-course-status--closed {
    background: rgba(190,120,20,.24);
    border-color: rgba(255,184,12,.7);
}

.ts-course-status--cancelled {
    background: rgba(190,45,45,.28);
    border-color: rgba(255,110,110,.7);
}

.ts-course-status--postponed {
    background: rgba(120,90,190,.28);
    border-color: rgba(180,150,255,.7);
}

.ts-course-status--finished {
    background: rgba(80,80,80,.28);
    border-color: rgba(200,200,200,.45);
}


.ts-course-sources__list {
    display: grid;
    gap: 10px;
}

.ts-course-source {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 13px 15px;
    border: 1px solid #e3ebeb;
    border-radius: 10px;
    background: #fff;
}

.ts-course-source__main {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px 12px;
}

.ts-course-source__main strong {
    color: #026168;
}

.ts-course-source__main a {
    font-weight: 700;
}

.ts-course-source__confidence {
    flex: 0 0 auto;
    padding: 5px 9px;
    border-radius: 999px;
    background: #edf7f7;
    color: #026168;
    font-size: 12px;
    font-weight: 800;
}

@media (max-width: 700px) {
    .ts-course-source {
        align-items: flex-start;
        flex-direction: column;
    }
}


.ts-course-race__source {
    display: block;
    margin-top: 8px;
    padding-top: 8px;
    border-top: 1px dashed #d8e2e2;
    color: #687878;
    font-size: 11px;
    font-weight: 600;
    line-height: 1.35;
}


.ts-course-location__intro {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 14px;
    margin-bottom: 14px;
    color: #536363;
}

.ts-course-location__intro strong {
    color: #026168;
}

.ts-course-map {
    width: 100%;
    height: 360px;
    border-radius: 14px;
    overflow: hidden;
    border: 1px solid #dfe8e8;
    background: #eef3f3;
}

.ts-course-location__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 14px;
}

.ts-course-location__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 10px 16px;
    border-radius: 9px;
    background: #026168;
    color: #fff;
    font-weight: 700;
    text-decoration: none;
}

.ts-course-location__button:hover {
    color: #fff;
    opacity: .92;
}

.ts-course-location__button--secondary {
    background: #fff;
    color: #026168;
    border: 1px solid #026168;
}

.ts-course-location__button--secondary:hover {
    color: #026168;
}

@media (max-width: 700px) {

    .ts-course-map {
        height: 300px;
    }

    .ts-course-location__actions {
        flex-direction: column;
    }

    .ts-course-location__button {
        width: 100%;
    }
}


.ts-course-nearby__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.ts-course-nearby__card {
    display: flex;
    flex-direction: column;
    min-height: 220px;
    padding: 18px;
    border: 1px solid #dfe8e8;
    border-radius: 14px;
    background: #fff;
}

.ts-course-nearby__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 12px;
}

.ts-course-nearby__distance {
    display: inline-flex;
    padding: 5px 9px;
    border-radius: 999px;
    background: #026168;
    color: #fff;
    font-size: 12px;
    font-weight: 700;
}

.ts-course-nearby__discipline {
    color: #687878;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
}

.ts-course-nearby__card h3 {
    margin: 0 0 12px;
    color: #173b3e;
    font-size: 18px;
    line-height: 1.3;
}

.ts-course-nearby__meta {
    display: grid;
    gap: 5px;
    margin-bottom: 16px;
    color: #687878;
    font-size: 13px;
}

.ts-course-nearby__link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-top: auto;
    min-height: 40px;
    padding: 8px 13px;
    border-radius: 9px;
    background: #ffb80c;
    color: #173b3e;
    font-weight: 800;
    text-decoration: none;
}

.ts-course-nearby__link:hover {
    color: #173b3e;
    opacity: .92;
}

@media (max-width: 900px) {
    .ts-course-nearby__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 600px) {
    .ts-course-nearby__grid {
        grid-template-columns: 1fr;
    }
}


/* === TRIPP NEARBY PREMIUM START === */

/*
 * Le thème générique des sections utilise parfois une mise en page
 * titre à gauche / contenu à droite.
 * Pour les courses proches, on veut toute la largeur.
 */
.ts-course-section.ts-course-nearby {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
}

.ts-course-section.ts-course-nearby > h2 {
    width: 100% !important;
    max-width: none !important;
    margin: 0 0 24px !important;
}

.ts-course-nearby__grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    width: 100% !important;
    gap: 18px !important;
    align-items: stretch !important;
}

.ts-course-nearby__card {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 260px !important;
    padding: 20px !important;
    border: 1px solid #dbe6e6 !important;
    border-radius: 18px !important;
    background: #fff !important;
    box-shadow: 0 8px 24px rgba(2, 97, 104, .08) !important;
    overflow: hidden !important;
}

.ts-course-nearby__top {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
    margin: 0 0 16px !important;
}

.ts-course-nearby__distance {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 78px !important;
    min-height: 42px !important;
    height: auto !important;
    padding: 8px 13px !important;
    border-radius: 999px !important;
    background: #026168 !important;
    color: #fff !important;
    font-size: 15px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    white-space: nowrap !important;
}

.ts-course-nearby__discipline {
    display: inline-flex !important;
    align-items: center !important;
    min-height: 36px !important;
    padding: 7px 11px !important;
    border-radius: 999px !important;
    background: rgba(2, 97, 104, .08) !important;
    color: #026168 !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    letter-spacing: .03em !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
}

.ts-course-nearby__title {
    margin: 0 0 16px !important;
    color: #173b3e !important;
    font-size: 21px !important;
    font-weight: 800 !important;
    line-height: 1.3 !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
    hyphens: none !important;
}

.ts-course-nearby__meta {
    display: flex !important;
    flex-direction: column !important;
    gap: 6px !important;
    margin: 0 0 20px !important;
    color: #647575 !important;
    font-size: 14px !important;
    line-height: 1.45 !important;
}

.ts-course-nearby__meta span {
    display: block !important;
}

.ts-course-nearby__button {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    min-height: 46px !important;
    margin: auto 0 0 !important;
    padding: 11px 15px !important;
    border: 0 !important;
    border-radius: 11px !important;
    background: #ffb80c !important;
    color: #173b3e !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
    text-align: center !important;
    text-decoration: none !important;
}

.ts-course-nearby__button:hover {
    color: #173b3e !important;
    transform: translateY(-1px);
    opacity: .94;
}

@media (max-width: 1000px) {

    .ts-course-nearby__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 620px) {

    .ts-course-nearby__grid {
        grid-template-columns: 1fr !important;
    }

    .ts-course-nearby__card {
        min-height: 0 !important;
    }

    .ts-course-nearby__title {
        font-size: 19px !important;
    }
}

/* === TRIPP NEARBY PREMIUM END === */


/* === CARTE COURSES PROCHES === */

.ts-course-map-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 20px;
    margin-top: 12px;
    color: #647575;
    font-size: 13px;
    font-weight: 600;
}

.ts-course-map-legend span {
    display: inline-flex;
    align-items: center;
    gap: 7px;
}

.ts-course-map-legend i {
    display: inline-block;
    width: 13px;
    height: 13px;
    border: 2px solid #fff;
    border-radius: 999px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, .2);
}

.ts-course-map-legend__current {
    background: #026168;
}

.ts-course-map-legend__nearby {
    background: #ffb80c;
}

.ts-course-map-popup {
    min-width: 180px;
    line-height: 1.4;
}

.ts-course-map-popup strong {
    display: block;
    margin-bottom: 5px;
    color: #173b3e;
    font-size: 14px;
}

.ts-course-map-popup__link {
    display: inline-block;
    margin-top: 8px;
    color: #026168;
    font-weight: 800;
    text-decoration: none;
}

.ts-course-map-popup__link:hover {
    text-decoration: underline;
}


/* === HISTORIQUE DES RESULTATS === */

.ts-course-history__list {
    display: grid;
    gap: 12px;
}

.ts-course-history__item {
    display: grid;
    grid-template-columns: 78px minmax(0, 1fr) auto;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    border: 1px solid #dfe8e8;
    border-radius: 14px;
    background: #fff;
}

.ts-course-history__year {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 52px;
    border-radius: 12px;
    background: #026168;
    color: #fff;
    font-size: 18px;
    font-weight: 800;
}

.ts-course-history__content h3 {
    margin: 0 0 5px;
    color: #173b3e;
    font-size: 17px;
    line-height: 1.3;
}

.ts-course-history__source {
    color: #687878;
    font-size: 13px;
    font-weight: 600;
}

.ts-course-history__link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 9px 14px;
    border-radius: 9px;
    background: #ffb80c;
    color: #173b3e;
    font-weight: 800;
    text-decoration: none;
    white-space: nowrap;
}

.ts-course-history__link:hover {
    color: #173b3e;
    opacity: .92;
}

@media (max-width: 720px) {

    .ts-course-history__item {
        grid-template-columns: 1fr;
        align-items: stretch;
    }

    .ts-course-history__year {
        width: 86px;
    }

    .ts-course-history__link {
        width: 100%;
    }
}

