/* V209 · ONE PRODUCT, ONE VISUAL LANGUAGE
   Module colours are reserved for data semantics. Navigation, page openings,
   section headings and actions use one shared TrainingLoadManager system. */
#app-shell{
  --ui-ink:#102432;
  --ui-navy:#0b1e2d;
  --ui-orange:#ed6b2d;
  --ui-blue:#215c91;
  --ui-paper:#f2f0eb;
  --ui-sheet:#fffefa;
  --ui-line:#cdd1cf;
  --ui-muted:#667078;
}

/* Every page starts in exactly the same way. */
#app-shell .tab-panel{--module-accent:var(--ui-orange)!important}
#app-shell .tab-panel>.panel-header,
#app-shell .tab-panel>.fr-hero,
#app-shell .tab-panel>.isak-hero,
#app-shell .tab-panel>.module-hero,
#app-shell .tab-panel>.page-hero,
#app-shell .tab-panel>.load-hero{
  position:relative!important;display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;
  align-items:end!important;gap:18px!important;min-height:82px!important;
  margin:0 0 18px!important;padding:14px 0 16px 24px!important;
  color:var(--ui-ink)!important;background:transparent!important;
  border:0!important;border-bottom:4px solid var(--ui-navy)!important;border-radius:0!important;box-shadow:none!important;
}
#app-shell .tab-panel>.panel-header:before,
#app-shell .tab-panel>.fr-hero:before,
#app-shell .tab-panel>.isak-hero:before,
#app-shell .tab-panel>.module-hero:before,
#app-shell .tab-panel>.page-hero:before,
#app-shell .tab-panel>.load-hero:before{
  content:""!important;display:block!important;position:absolute!important;left:0!important;top:14px!important;bottom:16px!important;width:5px!important;background:var(--ui-orange)!important;
}
#app-shell .tab-panel>.panel-header h1,#app-shell .tab-panel>.panel-header h2,
#app-shell .tab-panel>.fr-hero h1,#app-shell .tab-panel>.fr-hero h2,
#app-shell .tab-panel>.isak-hero h1,#app-shell .tab-panel>.isak-hero h2,
#app-shell .tab-panel>.module-hero h1,#app-shell .tab-panel>.module-hero h2,
#app-shell .tab-panel>.page-hero h1,#app-shell .tab-panel>.page-hero h2,
#app-shell .tab-panel>.load-hero h1,#app-shell .tab-panel>.load-hero h2{
  margin:0!important;color:var(--ui-ink)!important;font-size:30px!important;line-height:1.05!important;font-weight:850!important;letter-spacing:-.035em!important;
}
#app-shell .tab-panel>.panel-header p,#app-shell .tab-panel>.fr-hero p,#app-shell .tab-panel>.isak-hero p,
#app-shell .tab-panel>.module-hero p,#app-shell .tab-panel>.page-hero p,#app-shell .tab-panel>.load-hero p{
  max-width:850px!important;margin:6px 0 0!important;color:var(--ui-muted)!important;font-size:12px!important;line-height:1.45!important;font-weight:500!important;
}
#app-shell .tab-panel>.panel-header .row,#app-shell .tab-panel>.panel-header .panel-actions,
#app-shell .tab-panel>.fr-hero .fr-actions,#app-shell .tab-panel>.isak-hero .isak-hero-actions{justify-content:flex-end!important;align-items:center!important;gap:7px!important}

/* Dashboard opening follows the same header geometry. */
#app-shell .command-home__masthead{position:relative!important;min-height:82px!important;padding:14px 0 16px 24px!important;border-bottom:4px solid var(--ui-navy)!important}
#app-shell .command-home__masthead:before{content:"";position:absolute;left:0;top:14px;bottom:16px;width:5px;background:var(--ui-orange)}
#app-shell .command-home__masthead h2{font-size:30px!important;color:var(--ui-ink)!important}

/* One button hierarchy across the product. */
#app-shell .btn-primary,#app-shell button.btn-primary,#app-shell .button-primary,
#app-shell .ce44-add-task-btn,#app-shell .pm-control-btn.primary{
  color:#fff!important;background:var(--ui-navy)!important;border-color:var(--ui-navy)!important;box-shadow:inset 0 -3px 0 var(--ui-orange)!important;
}
#app-shell .btn-primary:hover,#app-shell button.btn-primary:hover,#app-shell .button-primary:hover{background:#132f43!important}
#app-shell .btn:not(.btn-primary):not(.btn-danger):not(.btn-success),#app-shell button.btn:not(.btn-primary):not(.btn-danger):not(.btn-success){color:var(--ui-ink)!important;background:var(--ui-sheet)!important;border-color:var(--ui-line)!important}

/* Internal navigation is identical everywhere. */
#app-shell .cargas-mode-toggle,#app-shell .subtabs,#app-shell .tabs,#app-shell .pp24-nav{
  min-height:42px!important;margin:0 0 14px!important;padding:0!important;background:transparent!important;border:0!important;border-bottom:1px solid var(--ui-line)!important;border-radius:0!important;
}
#app-shell .cargas-mode-btn,#app-shell .subtab,#app-shell .tab-btn,#app-shell .pp24-nav button{
  min-height:41px!important;padding:0 14px!important;color:var(--ui-muted)!important;background:transparent!important;border:0!important;border-radius:0!important;box-shadow:none!important;
}
#app-shell .cargas-mode-btn.active,#app-shell .subtab.active,#app-shell .tab-btn.active,#app-shell .pp24-nav button.active{
  color:var(--ui-ink)!important;background:transparent!important;box-shadow:inset 0 -3px 0 var(--ui-orange)!important;
}

/* Section headers and containers no longer change colour by module. */
#app-shell .card,#app-shell .fr-card,#app-shell .isak-card,#app-shell .section-card,#app-shell .injury-history-card,
#app-shell .player-card,#app-shell .player-load-card,#app-shell .report-chart-panel,#app-shell .ce44-ex{
  border-color:var(--ui-line)!important;background:var(--ui-sheet)!important;box-shadow:none!important;
}
#app-shell .card-title,#app-shell .fr-card-title,#app-shell .isak-card-head,#app-shell .injury-section-heading{
  color:var(--ui-ink)!important;border-color:var(--ui-navy)!important;
}
#app-shell .card-title{border-bottom:2px solid var(--ui-navy)!important}
#app-shell .fr-grid>.fr-card:first-child,#app-shell #tab-wellness>.card:nth-of-type(1),
#app-shell #tab-temporada>.grid-2>.card:first-child,#app-shell #tab-temporada>.grid-2>.card:nth-child(2),
#app-shell #tab-externa #ce-resumen-view>.card:first-child,#app-shell #tab-perfiles .injury-history-card,
#app-shell #tab-planificación #plan-pro-v24,#app-shell #tab-planificación #plan-year-view{
  border-top-color:var(--ui-navy)!important;
}
#app-shell .ce44-ex{border-top-color:var(--ui-navy)!important}
#app-shell .ce44-calendar-head,#app-shell .profile-focus-toolbar,#app-shell .live-scoreboard,#app-shell .match-scoreboard,#app-shell .tlr-head{background:var(--ui-navy)!important;border-color:var(--ui-orange)!important}

/* Tables and high-level KPI strips share the same chrome. */
#app-shell th{background:var(--ui-navy)!important;color:#fff!important;border-color:#294152!important}
#app-shell .kpi-grid{border-color:var(--ui-line)!important;background:var(--ui-line)!important}
#app-shell .kpi:before,#app-shell .kpi-card:before,#app-shell .inicio-kpi:before,#app-shell .fr-kpi:before{background:var(--ui-orange)!important}

/* Remove decorative per-module borders. Semantic card states (ACWR, alerts,
   injuries) remain untouched because those colours carry information. */
#app-shell #tab-cargas>.panel-header,#app-shell #tab-externa>.panel-header,#app-shell #tab-wellness>.panel-header,
#app-shell #tab-salud>.panel-header,#app-shell #tab-planificación>.panel-header,#app-shell #tab-partidos>.panel-header,
#app-shell #tab-perfiles>.panel-header,#app-shell #tab-temporada>.panel-header{border-bottom-color:var(--ui-navy)!important}
#app-shell #tab-perfiles #perfiles-grid .player-card:not(.is-selected){border-top-color:var(--ui-navy)!important}
#app-shell #tab-peso>.card,#app-shell #tab-antropometria>.card{border-left-color:var(--ui-navy)!important}

@media(max-width:700px){
  #app-shell .tab-panel>.panel-header,#app-shell .tab-panel>.fr-hero,#app-shell .tab-panel>.isak-hero,
  #app-shell .tab-panel>.module-hero,#app-shell .tab-panel>.page-hero,#app-shell .tab-panel>.load-hero{display:block!important;min-height:0!important;padding:12px 8px 13px 18px!important}
  #app-shell .tab-panel>.panel-header h1,#app-shell .tab-panel>.panel-header h2,#app-shell .tab-panel>.fr-hero h2,#app-shell .tab-panel>.isak-hero h2{font-size:24px!important}
  #app-shell .tab-panel>.panel-header .row,#app-shell .tab-panel>.panel-header .panel-actions,#app-shell .tab-panel>.fr-hero .fr-actions,#app-shell .tab-panel>.isak-hero .isak-hero-actions{justify-content:flex-start!important;margin-top:10px!important;overflow-x:auto!important;flex-wrap:nowrap!important}
  #app-shell .tab-panel>.panel-header:after{display:none!important}
}
