/* Control de contenidos: jerarquía compacta y calendario de semanas. */
.training-contents { font-family: 'Commissioner', 'Segoe UI', sans-serif; color: #203d54; }
.training-contents .ct-topbar,
.training-contents .ct-section-heading,
.training-contents .ct-week-heading { display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap; }
.training-contents .ct-topbar { margin-bottom: 22px; }
.training-contents .ct-page-title { font-size: 21px; letter-spacing: -.4px; font-weight: 700; margin: 0; }
.training-contents .ct-section-title { font-size: 16px; letter-spacing: -.2px; font-weight: 650; margin: 0; }
.training-contents .ct-section-heading { margin-bottom: 23px; }
.training-contents .ct-section-note { display: block; color: #87929c; font-size: 11px; margin-top: 5px; }
.training-contents .ct-panel { background: white; border: 1px solid #e6eaee; border-radius: 10px; padding: 23px 26px; margin-bottom: 22px; box-shadow: none; }
.training-contents .ct-segment { display: inline-flex; flex-wrap: wrap; padding: 3px; background: #f1f3f5; border-radius: 7px; font-size: 12px; }
.training-contents .ct-segment label { display: inline-flex; align-items: center; position: relative; padding: 7px 12px; border-radius: 5px; margin: 0; cursor: pointer; color: #7a8792; }
.training-contents .ct-segment label:has(input:checked) { background: white; color: #203d54; box-shadow: 0 1px 3px rgba(30,61,89,.08); font-weight: 600; }
.training-contents .ct-segment label:focus-within { outline: 2px solid #6b95b7; outline-offset: 2px; }
.training-contents .ct-segment input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.training-contents .ct-week-filter { margin-bottom: 24px; }
.training-contents .ct-week-heading { margin-bottom: 2px; }
.training-contents .ct-control-label { font-size: 11px; font-weight: 600; color: #788794; }
.training-contents .ct-all-weeks { border: 0; background: transparent; color: #788794; font-size: 11px; padding: 4px 0; }
.training-contents .ct-all-weeks:hover { color: #203d54; }
.training-contents .ct-week-slider { margin: 9px 8px 0; padding: 8px 0 12px !important; }
.training-contents .ct-week-slider .rc-slider-mark { display: none; }
.training-contents .ct-week-slider .rc-slider-rail { background: #e3e8ed; height: 3px; }
.training-contents .ct-week-slider .rc-slider-track { background: #4b6b85; height: 3px; }
.training-contents .ct-week-slider .rc-slider-handle { width: 12px; height: 12px; margin-top: -5px; border: 2px solid #4b6b85; background: white; box-shadow: none; opacity: 1; }
.training-contents .ct-week-slider .rc-slider-handle:hover,
.training-contents .ct-week-slider .rc-slider-handle:active { border-color: #203d54; }
.training-contents .ct-week-slider .rc-slider-dot { width: 4px; height: 4px; bottom: 0; background: #e3e8ed; border: 0; }
.training-contents .ct-weeks { display: flex; gap: 8px; overflow-x: auto; padding: 6px 4px; }
.training-contents .ct-week { flex: 1 0 92px; display: flex; flex-direction: column; align-items: center; gap: 7px; border: 0; border-radius: 8px; background: transparent; color: #788794; padding: 6px 4px; font-size: 11px; text-align: center; }
.training-contents .ct-week-circle { display: grid; place-items: center; width: 36px; height: 36px; border: 1px solid #d8e1e8; border-radius: 50%; background: white; font-size: 13px; font-weight: 600; transition: background .15s, box-shadow .15s; }
.training-contents .ct-week.is-selected { color: #203d54; font-weight: 600; }
.training-contents .ct-week.is-selected .ct-week-circle { background: #e6eef4; border-color: #a4bacb; }
.training-contents .ct-week.is-single .ct-week-circle { background: #1e3d59; border-color: #1e3d59; color: white; box-shadow: 0 0 0 4px #e1eaf1; }
.training-contents .ct-week.is-empty .ct-week-circle { border-style: dashed; }
.training-contents .ct-week:hover .ct-week-circle { box-shadow: 0 0 0 4px #e9eff4; border-color: #6a8ba5; }
.training-contents .ct-week:focus-visible { outline: 2px solid #6b95b7; outline-offset: -2px; }
.training-contents .ct-phases { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); }
.training-contents .ct-phase { padding: 0 26px; min-width: 0; border-left: 1px solid #edf0f3; }
.training-contents .ct-phase:first-child { border-left: 0; padding-left: 0; }
.training-contents .ct-phase:last-child { padding-right: 0; }
.training-contents .ct-phase-header { border-top: 3px solid var(--phase-color); padding-top: 17px; margin-bottom: 22px; }
.training-contents .ct-phase-header h5 { color: var(--phase-color); font-size: 14px; font-weight: 650; margin: 0 0 10px; }
.training-contents .ct-phase-share { display: flex; align-items: baseline; gap: 8px; }
.training-contents .ct-phase-share strong { font-size: 27px; font-weight: 650; letter-spacing: -.8px; color: #203d54; }
.training-contents .ct-phase-share span { color: #94a0aa; font-size: 11px; }
.training-contents .ct-phase-columns-heading { display: flex; justify-content: space-between; font-size: 11px; color: #9ba5ae; margin-bottom: 15px; }
.training-contents .ct-content-row { margin-bottom: 20px; }
.training-contents .ct-content-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; font-size: 12px; line-height: 1.4; margin-bottom: 8px; }
.training-contents .ct-content-heading span:first-child { color: #516575; }
.training-contents .ct-content-heading span:last-child { font-weight: 600; white-space: nowrap; font-variant-numeric: tabular-nums; }
.training-contents .ct-content-track { background: #f1f3f5; height: 4px; border-radius: 2px; overflow: hidden; }
.training-contents .ct-content-track > div { height: 100%; background: var(--phase-color); border-radius: 2px; }
.training-contents .ct-chart-caption { font-size: 11px; color: #8a97a2; margin: 0; }
.training-contents .ct-total-legend { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 10px; }
.training-contents .ct-phase-legend { display: flex; gap: 18px; color: #788794; font-size: 10px; }
.training-contents .ct-phase-legend > span { display: inline-flex; align-items: center; gap: 6px; }
.training-contents .ct-phase-legend i { width: 6px; height: 6px; border-radius: 50%; }
.training-contents .ct-general-section > .ct-section-title { margin-bottom: 16px; }
.training-contents .ct-blocks-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); column-gap: 28px; row-gap: 8px; }
.training-contents .ct-block { text-align: left; border: 0; border-radius: 4px; background: transparent; padding: 12px 0; min-width: 0; }
.training-contents .ct-block.is-active { background: #f7f9fb; outline: 1px solid #dce5eb; outline-offset: 6px; }
.training-contents .ct-block-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.training-contents .ct-block-label { color: #516575; font-size: 12px; }
.training-contents .ct-block-percent { color: #203d54; font-size: 17px; font-weight: 650; font-variant-numeric: tabular-nums; }
.training-contents .ct-block-minutes { color: #9aa5af; font-size: 11px; }
.training-contents .ct-block-expand { color: #9aa5af; font-size: 13px; }
.training-contents .ct-block-track { height: 3px; background: #f0f3f5; margin-top: 10px; }
.training-contents .ct-block-track > div { height: 100%; }
.training-contents .ct-block-detail { border-top: 1px solid #edf0f3; margin-top: 12px; padding-top: 18px; }
.training-contents .ct-detail-title { font-size: 11px; color: #788794; }
.training-contents .ct-general-details { display: flex; flex-wrap: wrap; gap: 24px; margin-top: 12px; }
.training-contents .ct-general-detail-item { display: flex; gap: 10px; align-items: baseline; font-size: 11px; }
.training-contents .ct-evolution-select { width: 220px; font-size: 11px; }
.training-contents .ct-pending { font-size: 11px; border-top: 1px solid #e4e9ed; color: #929da6; padding: 14px 0; }
.training-contents .ct-pending summary { cursor: pointer; }
.training-contents .ct-notice-explanation { margin: 12px 0; }
.training-contents .ct-empty { color: #94a0aa; padding: 20px 0; font-size: 12px; }
.training-contents .js-plotly-plot { min-width: 0; }
.training-contents .ct-specific-composition { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 36px; align-items: start; }
.training-contents .ct-donut-primary { min-width: 0; }
.training-contents .ct-donut-legend { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; max-width: 450px; margin: 0 auto; padding: 5px 12px 12px; }
.training-contents .ct-donut-legend:has(.ct-donut-legend-item:nth-child(4)) { grid-template-columns: repeat(2,minmax(0,1fr)); }
.training-contents .ct-donut-legend-item { display: grid; grid-template-columns: 11px minmax(0,1fr); align-items: center; column-gap: 8px; row-gap: 3px; font: inherit; font-size: 13px; color: #344e63; text-align: left; border: 0; background: transparent; border-radius: 4px; padding: 5px 2px; cursor: pointer; }
.training-contents .ct-donut-legend-item:hover { background: #f1f5f8; }
.training-contents .ct-donut-legend-item:focus-visible { outline: 2px solid #6b95b7; outline-offset: 2px; }
.training-contents .ct-donut-legend-item.is-hidden { color: #8796a2; }
.training-contents .ct-donut-legend-item.is-hidden .ct-donut-key-label { text-decoration: line-through; }
.training-contents .ct-donut-legend-item.is-hidden .ct-donut-key { opacity: .4; }
.training-contents .ct-donut-denominator { text-align: center; font-size: 11px; color: #788794; margin-top: 3px; }
.training-contents .ct-donut-key { display: inline-block; width: 11px; height: 11px; border-radius: 3px; flex: 0 0 11px; }
.training-contents .ct-donut-legend-item strong { grid-column: 2; font-size: 14px; font-weight: 650; }
.training-contents .ct-specific-detail { min-width: 0; }
.training-contents .ct-specific-detail-heading { font-size: 13px; color: #344e63; font-weight: 600; margin-bottom: 15px; }
.training-contents .ct-phase-accordion .accordion-item { border: 0; border-bottom: 1px solid #e8edf1; border-radius: 0; }
.training-contents .ct-phase-accordion .accordion-button { padding: 10px 8px; font-size: 13px; color: #203d54; background: white; box-shadow: none; }
.training-contents .ct-phase-accordion .accordion-button:not(.collapsed) { background: #f4f7f9; border-radius: 6px; }
.training-contents .ct-phase-accordion .accordion-button::after { margin-left: 14px; width: 14px; height: 14px; background-size: 14px; }
.training-contents .ct-phase-accordion .accordion-body { padding: 12px 8px 10px; }
.training-contents .ct-accordion-title { display: flex; align-items: center; gap: 9px; width: 100%; }
.training-contents .ct-accordion-share { margin-left: auto; font-size: 13px; font-weight: 650; }
.training-contents .ct-accordion-note { font-size: 11px; color: #62788a; margin: 0 0 10px; }
.training-contents .ct-phase-accordion .ct-content-row { margin-bottom: 10px; }
.training-contents .ct-phase-accordion .ct-content-heading { margin-bottom: 5px; }
.training-contents .ct-content-heading span:first-child { color: #344e63; }
.training-contents .ct-specific-panel > .ct-section-heading { margin-bottom: 12px; }
.training-contents .ct-specific-panel .ct-section-title { font-size: 18px; font-weight: 700; }
.training-contents .ct-segment { background: #edf1f4; border: 1px solid #dbe2e8; }
.training-contents .ct-segment label { color: #344e63; }
.training-contents .ct-segment label:has(input:checked) { background: #1e3d59; color: white; box-shadow: none; }
@media (max-width: 900px) {
    .training-contents .ct-phase { padding: 0 16px; }
    .training-contents .ct-phase-share { flex-direction: column; gap: 0; }
    .training-contents .ct-blocks-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 640px) {
    .training-contents .ct-panel { padding: 20px 16px; }
    .training-contents .ct-section-heading { gap: 12px; }
    .training-contents .ct-page-title { font-size: 18px; }
    .training-contents .ct-phases { grid-template-columns: 1fr; gap: 20px; }
    .training-contents .ct-phase { padding: 0; border-left: 0; }
    .training-contents .ct-phase-share { flex-direction: row; gap: 8px; }
    .training-contents .ct-evolution-select { width: 100%; }
    .training-contents .ct-blocks-grid { grid-template-columns: 1fr; }
    .training-contents .ct-specific-composition { grid-template-columns: 1fr; gap: 24px; }
}
