:root {
  /* Esbjerg fB Brandbook 23/24 — hjemmebane-identitet (the primary
     palette the brandbook itself says to start from). --brand was
     already very close to the official mørkeblå before this pass; now
     it's the exact hex. Guld is deliberately kept out of --medal-gold
     etc. above (those are a separate, semantic "1st/2nd/3rd place"
     ranking metaphor, not brand identity) and used only as an accent —
     never a fill/background — per the brandbook's own rule. */
  --ink: #16243b;
  --muted: #8194ac;
  --line: #dde3ee;
  --canvas: #f5f7fb;
  --card: #ffffff;
  --brand: #001c44;
  --brand-light: #005397;
  --brand-soft: #dee7f6;
  --gold-dark: #614f18;
  --gold: #ad8f39;
  --gold-light: #e2cc8e;
  --gold-gradient: linear-gradient(135deg, var(--gold-dark), var(--gold), var(--gold-light));
  --font-heading: "Kanit", ui-sans-serif, system-ui, sans-serif;
  --sky: #0284c7;
  --sky-soft: #e0f2fe;
  --amber: #b5792c;
  --amber-soft: #fff4df;
  --red: #b9574e;
  --red-soft: #fbe9e7;
  /* Match-outcome traffic light — deliberately separate from the brand
     palette above (a win is green regardless of the club's own colors). */
  --win: #1a7f4a;
  --win-soft: #e3f5ea;
  /* One color per team for the multi-team calendar — reuses the brand's
     status colors above where they already read well as a team accent
     (sky/amber/red/win), and adds two more for the teams that don't have
     an existing token (Divisionen, U17). */
  --team-division: #6a4c93;
  --team-division-soft: #efe7f6;
  --team-u17: #0f9488;
  --team-u17-soft: #e0f5f2;
  --medal-gold: #a9781c;
  --medal-gold-soft: #fbf1d9;
  --medal-silver: #6b7480;
  --medal-silver-soft: #eef0f3;
  --medal-bronze: #9a5b32;
  --medal-bronze-soft: #f7e8dc;
  /* Ny skal (Fase 0, 2026-10-04) */
  --radius-card: 16px;
  --shadow-card: 0 1px 2px rgba(0, 28, 68, .05), 0 6px 18px rgba(0, 28, 68, .05);
  --pill-active-bg: var(--gold-light);
  --pill-active-ink: var(--brand);
  --sidebar-ink: #dbe6f5;
  --sidebar-muted: #8fa3c4;
  --sidebar-hover: #16345c;
  --tone-ok: var(--win); --tone-ok-soft: var(--win-soft);
  --tone-warn: var(--amber); --tone-warn-soft: var(--amber-soft);
  --tone-bad: var(--red); --tone-bad-soft: var(--red-soft);
  --tone-info: var(--sky); --tone-info-soft: var(--sky-soft);
  --tone-mute: var(--muted); --tone-mute-soft: #eef1f6;
  font-family: "Kanit", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-weight: 300;
  color: var(--ink);
  background: var(--canvas);
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--canvas); }
button, select, input, textarea { font: inherit; }
strong, b { font-weight: 600; }
button { cursor: pointer; }
/* Base dropdown look, applied everywhere a bare <select> shows up. Kept as
   a low-specificity element selector on purpose so the many existing more
   specific rules (.team-picker select, td select, .availability-cell's
   tiny colored status pills, etc.) still win on any property they already
   set — this only fills in the native-browser-chrome gaps (custom arrow,
   hover/focus, cursor) they don't otherwise override. */
select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px 34px 10px 12px;
  font-size: 13px;
  font-weight: 400;
  color: var(--ink);
  background-color: #fff;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='7'%3E%3Cpath d='M1 1.5l4.5 4 4.5-4' stroke='%23516079' stroke-width='1.7' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 13px center;
  background-size: 11px 7px;
  box-shadow: 0 1px 2px rgba(10, 34, 64, .04);
  cursor: pointer;
  transition: border-color .15s, box-shadow .15s, background-color .15s;
}
select:hover { border-color: #aebbd1; background-color: #fafbfd; }
select:focus { outline: none; border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-soft); }
select:disabled { cursor: not-allowed; opacity: .55; }
.app-shell { min-height: 100vh; display: flex; }
.sidebar { width: 262px; flex: none; background: var(--brand); color: var(--sidebar-ink); padding: 22px 14px 18px; display: flex; flex-direction: column; position: sticky; top: 0; height: 100vh; overflow-y: auto; transition: width .18s; scrollbar-width: thin; scrollbar-color: #2c4d7a transparent; }
/* Logoet vises uændret (brandbog s. 6-7: ingen skygge/strækning/omfarvning);
   .brand's luft omkring logoet er respektafstanden. */
.brand { display: flex; gap: 11px; align-items: center; padding: 4px 8px 22px; }
.brand-mark { width: 44px; height: 44px; flex: none; display: grid; place-items: center; }
.brand-mark img { width: 100%; height: 100%; object-fit: contain; }
.brand-text { min-width: 0; flex: 1; }
.brand strong, .brand span { display: block; }
.brand strong { font-size: 17px; letter-spacing: .01em; font-family: var(--font-heading); font-weight: 700; text-transform: uppercase; color: #fff; }
.brand span { font-size: 10px; color: var(--sidebar-muted); margin-top: 2px; letter-spacing: .14em; text-transform: uppercase; }
.sidebar-collapse { flex: none; width: 30px; height: 30px; border: 1px solid #2c4d7a; border-radius: 8px; background: transparent; color: var(--sidebar-muted); display: grid; place-items: center; padding: 0; }
.sidebar-collapse:hover { background: var(--sidebar-hover); color: #fff; }
.sidebar-collapse svg { width: 16px; height: 16px; }
.main-nav { display: grid; gap: 3px; align-content: start; }
.nav-item { border: 0; background: transparent; color: var(--sidebar-muted); text-align: left; padding: 10px 12px; border-radius: 11px; display: flex; align-items: center; gap: 12px; font-size: 14px; font-family: var(--font-heading); font-weight: 400; letter-spacing: .01em; width: 100%; }
.nav-item em { font-style: normal; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nav-icon { width: 20px; height: 20px; flex: none; display: grid; place-items: center; }
.nav-icon svg, .topbar-icon svg, .icon-button svg { width: 18px; height: 18px; }
.nav-item:hover { background: var(--sidebar-hover); color: #fff; }
/* Aktivt punkt: lys guld-pille med navy tekst (brandbog s. 12: guld som lille accent-flade). */
.nav-item.active { background: var(--pill-active-bg); color: var(--pill-active-ink); font-weight: 600; }
.nav-section { margin: 18px 0 4px; padding: 0 12px; font-size: 10px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: #6f87ad; font-family: var(--font-heading); }
.nav-teams { display: grid; gap: 3px; }
.sidebar-footer { margin-top: auto; padding: 16px 8px 0; border-top: 1px solid #1c3a63; }
.role-label { color: #7e93b8; text-transform: uppercase; font-size: 10px; letter-spacing: .1em; margin-bottom: 8px; }
#role-switcher, #coach-identity-switcher { width: 100%; color: #e6edf7; background-color: #12315a; border: 1px solid #2c4d7a; border-radius: 8px; padding: 9px 30px 9px 9px; margin-bottom: 12px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%238fa3c4' stroke-width='1.6' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }
.sidebar-footer p { color: #7e93b8; font-size: 11px; line-height: 1.5; margin: 6px 0 0; }
/* Kollapset menu: kun ikoner */
.sidebar.collapsed { width: 76px; padding-left: 10px; padding-right: 10px; }
.sidebar.collapsed .brand { flex-direction: column; gap: 10px; padding-left: 0; padding-right: 0; }
.sidebar.collapsed .brand-text, .sidebar.collapsed .nav-item em, .sidebar.collapsed .nav-section, .sidebar.collapsed .sidebar-footer { display: none; }
.sidebar.collapsed .nav-item { justify-content: center; padding: 11px 0; }
.sidebar.collapsed .nav-teams .nav-item::before { content: attr(data-short); font-size: 11px; font-weight: 600; }
.sidebar.collapsed .nav-teams .nav-icon { display: none; }
.content { flex: 1; min-width: 0; }
.topbar { height: 76px; display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 0 42px; background: var(--card); border-bottom: 1px solid var(--line); position: sticky; top: 0; z-index: 4; }
.breadcrumb { display: flex; align-items: center; gap: 10px; font-size: 14px; color: var(--muted); min-width: 0; }
.breadcrumb-current { color: var(--brand); font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.breadcrumb-sep { color: #b4c0d3; }
/* Overskrifter: Kanit Bold i versaler (brandbog s. 8). */
h1 { font-family: var(--font-heading); font-weight: 700; text-transform: uppercase; font-size: 26px; letter-spacing: .01em; margin: 5px 0 0; }
.topbar-actions { display: flex; align-items: center; gap: 20px; }
.team-picker { display: flex; align-items: center; gap: 8px; color: var(--muted); font-size: 12px; font-weight: 400; }
.topbar-icon { display: inline-grid; place-items: center; color: var(--muted); }
.team-picker select { border: 1px solid var(--line); border-radius: 7px; background-color: #fff; color: var(--ink); padding: 8px 28px 8px 10px; font-size: 12px; }
.icon-button { border: 0; background: transparent; color: var(--muted); font-size: 23px; display: grid; place-items: center; width: 36px; height: 36px; border-radius: 10px; }
.icon-button:hover { background: var(--canvas); }
.avatar { width: 36px; height: 36px; border-radius: 50%; background: #d7e6f7; color: var(--brand); display: grid; place-items: center; font-weight: 700; font-size: 12px; }
.mobile-menu { display: none; border: 0; background: none; font-size: 20px; }
#app { padding: 32px 42px 60px; max-width: 1500px; }
.view-header { display: flex; justify-content: space-between; align-items: flex-end; gap: 20px; margin-bottom: 24px; }
.view-header h2 { font-family: var(--font-heading); font-weight: 700; text-transform: uppercase; font-size: 18px; margin: 0 0 5px; letter-spacing: 0; }
.view-header p { color: var(--muted); font-size: 13px; margin: 0; }
.header-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.plain-select { border: 1px solid var(--line); border-radius: 7px; background-color: #fff; color: var(--ink); padding: 8px 28px 8px 10px; font-size: 12px; }
.button { border: 1px solid var(--brand); background: var(--brand); color: white; padding: 10px 16px; border-radius: 10px; font-weight: 500; font-size: 12px; }
.button.gold, .button.primary-gold { background: var(--pill-active-bg); border-color: var(--pill-active-bg); color: var(--pill-active-ink); font-weight: 600; }
.button.secondary { background: white; color: var(--brand); }
.button.secondary.active { background: var(--brand-soft); border-color: var(--brand); }
.stat-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 15px; margin-bottom: 22px; }
.stat-grid-6 { grid-template-columns: repeat(6, 1fr); }
.stat-grid-5 { grid-template-columns: repeat(5, 1fr); gap: 10px; }
.stat-grid-5 .stat-card { padding: 13px; }
.stat-grid-5 .stat-value { font-size: 22px; margin: 6px 0 3px; }
.stat-grid-5 .stat-label { font-size: 11px; }
.stat-grid-5 .stat-detail { font-size: 10px; }
.stat-card.tone-red { background: var(--red-soft); border-color: var(--red); }
.stat-card.tone-amber { background: var(--amber-soft); border-color: var(--amber); }
.stat-card.tone-green { background: var(--win-soft); border-color: var(--win); }
.stat-card.tone-blue { background: var(--sky-soft); border-color: var(--sky); }
.stat-card.tone-red .stat-value, .stat-card.tone-red .stat-label, .stat-card.tone-red .stat-detail { color: var(--red); }
.stat-card.tone-amber .stat-value, .stat-card.tone-amber .stat-label, .stat-card.tone-amber .stat-detail { color: var(--amber); }
.stat-card.tone-green .stat-value, .stat-card.tone-green .stat-label, .stat-card.tone-green .stat-detail { color: var(--win); }
.stat-card.tone-blue .stat-value, .stat-card.tone-blue .stat-label, .stat-card.tone-blue .stat-detail { color: var(--sky); }
.stat-card-solid.tone-red, .stat-card-solid.tone-amber, .stat-card-solid.tone-green, .stat-card-solid.tone-blue { border-color: transparent; }
.stat-card-solid.tone-red { background: var(--red); }
.stat-card-solid.tone-amber { background: var(--amber); }
.stat-card-solid.tone-green { background: var(--win); }
.stat-card-solid.tone-blue { background: var(--sky); }
.stat-card-solid.tone-red .stat-value, .stat-card-solid.tone-red .stat-label, .stat-card-solid.tone-red .stat-detail,
.stat-card-solid.tone-amber .stat-value, .stat-card-solid.tone-amber .stat-label, .stat-card-solid.tone-amber .stat-detail,
.stat-card-solid.tone-green .stat-value, .stat-card-solid.tone-green .stat-label, .stat-card-solid.tone-green .stat-detail,
.stat-card-solid.tone-blue .stat-value, .stat-card-solid.tone-blue .stat-label, .stat-card-solid.tone-blue .stat-detail { color: #fff; }
.bar-track-inline { background: var(--brand-soft); border-radius: 4px; height: 8px; width: 90px; overflow: hidden; }
.bar-fill-inline { background: var(--brand); height: 100%; border-radius: inherit; }
.andel-cell { display: flex; align-items: center; gap: 8px; }
tr.tone-row-red td { background: var(--red-soft); }
tr.tone-row-amber td { background: var(--amber-soft); }
tr.tone-row-green td { background: var(--win-soft); }
tr.tone-row-blue td { background: var(--sky-soft); }
.stat-card, .card { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius-card); box-shadow: var(--shadow-card); }
.stat-card { padding: 19px; }
.stat-label { color: var(--muted); font-size: 12px; }
.stat-value { font-size: 29px; font-weight: 600; letter-spacing: -.02em; margin: 10px 0 4px; }
.stat-detail { font-size: 11px; color: var(--brand); }
.stat-detail.warning { color: var(--amber); }
.stat-detail.trend-up { color: var(--win); }
.stat-detail.trend-down { color: var(--red); }
.subprincip-table { width: 100%; border-collapse: collapse; font-size: 12px; }
.subprincip-table th, .subprincip-table td { border-bottom: 1px solid var(--line); padding: 8px 10px; text-align: left; vertical-align: middle; }
.subprincip-table thead th { color: var(--muted); font-weight: 650; text-transform: uppercase; font-size: 11px; letter-spacing: .03em; }
.status-category-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.status-category-heading { color: var(--muted); font-weight: 650; text-transform: uppercase; font-size: 11px; letter-spacing: .03em; margin-bottom: 10px; }
.status-category-list { display: grid; gap: 8px; }
.status-category-row { display: grid; gap: 6px; padding-bottom: 10px; border-bottom: 1px solid var(--line); }
.status-category-days { display: flex; flex-wrap: wrap; gap: 4px; }
.status-day-chip { width: auto; white-space: nowrap; }
@media (max-width: 900px) { .status-category-grid { grid-template-columns: 1fr; } }
.grid-2 { display: grid; grid-template-columns: 1.4fr 1fr; gap: 18px; }
.dev-plan-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 14px; }
.dev-plan-card { display: flex; flex-direction: column; gap: 12px; transition: box-shadow .15s, transform .15s; }
.dev-plan-card:hover { box-shadow: 0 8px 24px rgba(10,34,64,.08); transform: translateY(-1px); }
.dev-plan-card-top { display: flex; align-items: center; gap: 11px; }
.dev-plan-card-who { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.dev-plan-card-team { color: var(--muted); font-size: 11px; }
.dev-plan-card-period { color: var(--brand); font-size: 11px; font-weight: 650; text-transform: uppercase; letter-spacing: .03em; }
.dev-plan-card-goal { background: var(--canvas); border-radius: 8px; padding: 12px 13px; flex: 1; }
.dev-plan-card-goal-label { color: var(--muted); font-size: 10px; font-weight: 650; text-transform: uppercase; letter-spacing: .04em; margin-bottom: 4px; }
.dev-plan-card-goal p { margin: 0; font-size: 13px; color: var(--ink); line-height: 1.45; }
.dev-plan-card-goal-empty { margin: 0; font-size: 12px; color: var(--muted); font-style: italic; }
.dev-plan-card-footer { display: flex; align-items: center; justify-content: space-between; gap: 10px; border-top: 1px solid var(--line); padding-top: 11px; }
.dev-plan-empty { color: var(--muted); font-size: 13px; text-align: center; padding: 30px; }
.card { padding: 20px; }
.card-heading { display: flex; justify-content: space-between; align-items: center; margin-bottom: 17px; }
.card-heading h3 { font-family: var(--font-heading); font-weight: 700; text-transform: uppercase; letter-spacing: .01em; font-size: 14px; margin: 0; }
.card-heading a { color: var(--brand); font-size: 12px; cursor: pointer; }
.rows { display: grid; gap: 2px; }
.row { border-top: 1px solid var(--line); padding: 13px 0; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.row:first-child { border-top: 0; padding-top: 0; }
.row:last-child { padding-bottom: 0; }
.row-main { min-width: 0; }
.row-title { font-size: 13px; font-weight: 650; }
.row-meta { color: var(--muted); font-size: 11px; margin-top: 4px; }
.dev-plan-status-row { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.dev-plan-missing { font-size: 12px; color: var(--amber); margin: 4px 0 10px; padding-left: 18px; }
.dev-plan-missing li { margin-bottom: 2px; }
.badge { display: inline-block; border-radius: 20px; padding: 5px 8px; font-size: 10px; font-weight: 700; white-space: nowrap; }
.badge.green { background: var(--win-soft); color: var(--win); }
.badge.amber { background: var(--amber-soft); color: var(--amber); }
.badge.red { background: var(--red-soft); color: var(--red); }
.badge.blue { background: var(--sky-soft); color: var(--sky); }
.badge.win { background: var(--win-soft); color: var(--win); }
.badge.draw { background: var(--amber-soft); color: var(--amber); }
.badge.loss { background: var(--red-soft); color: var(--red); }
.toolbar { display: flex; gap: 10px; margin-bottom: 14px; flex-wrap: wrap; align-items: center; }
.toolbar-center { justify-content: center; }
.search, .filter, .toolbar select, .toolbar input[type="date"] { border: 1px solid var(--line); border-radius: 7px; background-color: white; padding: 10px 12px; font-size: 12px; color: var(--ink); font-family: inherit; }
.toolbar select { padding-right: 30px; }
.toolbar span { color: var(--muted); font-size: 12px; }
.search { flex: 1; max-width: 360px; }
.subtabs { display: flex; gap: 4px; margin-bottom: 20px; border-bottom: 1px solid var(--line); }
.subtab { border: 0; background: none; padding: 10px 4px; margin-right: 18px; font-size: 13px; font-weight: 650; color: var(--muted); border-bottom: 2px solid transparent; }
.subtab.active { color: var(--brand); border-bottom-color: var(--brand); }
table { border-collapse: collapse; width: 100%; font-size: 12px; }
th { color: var(--muted); font-size: 10px; font-weight: 650; text-align: left; text-transform: uppercase; letter-spacing: .06em; padding: 11px 12px; border-bottom: 1px solid var(--line); }
td { padding: 14px 12px; border-bottom: 1px solid var(--line); }
tr:last-child td { border-bottom: 0; }
.player-name { font-weight: 650; }
a.player-name { cursor: pointer; color: var(--ink); text-decoration: none; }
a.player-name:hover { color: var(--brand); text-decoration: underline; }
td select, td input[type="number"], td input[type="text"], td input[type="time"] { border: 1px solid var(--line); border-radius: 6px; padding: 6px 8px; font-size: 12px; color: var(--ink); font-family: inherit; }
td select { padding-right: 24px; background-position: right 7px center; }
.activity-calendar-table { min-width: 1100px; }
.activity-calendar-table td select, .activity-calendar-table td input[type="text"], .activity-calendar-table td input[type="time"] { width: 100%; min-width: 80px; }
.activity-calendar-table td:first-child { white-space: nowrap; }
.activity-calendar-table .muted { color: var(--muted); }
.activity-calendar-table .ac-add-slot { margin-left: 4px; font-weight: 800; }
.vinderspil-toggle { width: 100%; border: 1px solid var(--line); border-radius: 999px; padding: 6px 10px; font-size: 11px; font-weight: 650; background: var(--canvas); color: var(--muted); cursor: pointer; }
.vinderspil-toggle.active { background: var(--win-soft); color: var(--win); border-color: transparent; }
.vinderspil-toggle:disabled { cursor: default; opacity: .7; }
.activity-calendar-table tr.ac-weekend td { background: #eef0f3; }
.activity-calendar-table tr.ac-date-first td { border-top: 2px solid var(--line); padding-top: 10px; }
.activity-calendar-table .ac-date-cell { vertical-align: middle; white-space: nowrap; border-top: 2px solid var(--line); }
.week-banner { display: flex; align-items: center; gap: 14px; background: var(--brand); border-radius: 10px; padding: 12px 18px; margin-bottom: 16px; }
.week-banner-badge { display: flex; align-items: center; gap: 6px; border: 2px solid var(--medal-gold); border-radius: 7px; padding: 5px 14px; color: white; }
.week-banner-badge span { font-size: 10px; font-weight: 650; text-transform: uppercase; letter-spacing: .06em; color: var(--medal-gold); }
.week-banner-badge strong { font-size: 18px; }
.week-banner-range { color: white; font-weight: 650; font-size: 14px; }
.week-overview-table { min-width: 900px; border-collapse: collapse; }
.week-overview-table thead th { background: var(--brand); color: white; font-size: 11px; font-weight: 650; text-transform: uppercase; letter-spacing: .04em; padding: 13px 12px; text-align: left; border-bottom: none; }
.week-overview-table thead th:first-child { border-top-left-radius: 8px; }
.week-overview-table thead th:last-child { border-top-right-radius: 8px; }
.week-overview-table .week-date-cell { vertical-align: middle; white-space: nowrap; color: var(--brand); font-weight: 700; }
.week-overview-table tr.week-weekend td { background: #eef0f3; }
.week-overview-table tr.today-col td { background: var(--sky-soft) !important; }
.week-overview-table .week-date-cell.today-col { color: var(--sky); }
.player-sub { color: var(--muted); font-size: 11px; margin-top: 3px; }
.calendar-grid { display: grid; grid-template-columns: repeat(7, 1fr); border-left: 1px solid var(--line); border-top: 1px solid var(--line); }
.day { min-height: 130px; background: white; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 10px; }
.day.has-events { background: #fbfcfe; }
.day[data-calendar-new-activity] { cursor: pointer; }
.team-filter { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }
.team-filter-pill { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--line); border-radius: 20px; padding: 6px 12px 6px 8px; font-size: 12px; font-weight: 650; color: var(--ink); cursor: pointer; user-select: none; background: white; }
.team-filter-pill input { margin: 0; accent-color: var(--brand); }
.team-filter-pill .dot { width: 9px; height: 9px; border-radius: 50%; display: inline-block; }
.team-filter-pill.active { border-color: currentColor; }
.day.muted { background: #fafbfd; color: #a9b6cc; }
.day-number { font-size: 12px; font-weight: 700; }
.event { margin-top: 6px; background: var(--event-soft, var(--brand-soft)); border-left: 3px solid var(--event-color, var(--brand)); padding: 6px; border-radius: 3px; font-size: 10px; color: var(--event-color, var(--brand)); cursor: pointer; }
.event:hover { filter: brightness(0.96); }
.event-team-label { font-weight: 700; text-transform: uppercase; letter-spacing: .02em; font-size: 9px; }
.ac-note-badge { opacity: .8; font-style: italic; }
.notice { background: #eef3fb; border: 1px solid #d7e3f5; color: var(--brand); border-radius: 8px; padding: 12px 14px; font-size: 12px; margin-bottom: 18px; }
.empty { text-align: center; color: var(--muted); padding: 35px; font-size: 13px; }
.modal-backdrop { position: fixed; inset: 0; z-index: 20; display: grid; place-items: center; padding: 20px; background: rgba(10,34,64,.42); }
.modal { position: relative; width: min(460px, 100%); display: grid; gap: 13px; padding: 25px; border-radius: 12px; background: white; box-shadow: 0 20px 60px rgba(0,0,0,.18); }
.modal.modal-wide { width: min(780px, 100%); }
.modal.modal-wide h3 { margin: 6px 0 -4px; font-size: 13px; }
.modal h2 { margin: 0 0 4px; font-size: 19px; }
.modal { max-height: 90vh; overflow-y: auto; }
.modal label { display: grid; gap: 5px; color: var(--muted); font-size: 11px; font-weight: 650; }
.modal input, .modal select, .modal textarea { border: 1px solid var(--line); border-radius: 7px; padding: 10px; color: var(--ink); font-size: 13px; font-family: inherit; }
.modal select { padding-right: 32px; }
.modal textarea { min-height: 70px; resize: vertical; }
.modal-close { position: absolute; right: 15px; top: 12px; border: 0; background: none; color: var(--muted); font-size: 24px; }
.form-fieldset { display: grid; gap: 8px; border: 1px solid var(--line); border-radius: 7px; padding: 10px 12px; }
.form-fieldset-legend { font-size: 11px; font-weight: 650; color: var(--muted); text-transform: uppercase; letter-spacing: .02em; }
.form-fieldset label { flex-direction: row; align-items: center; gap: 8px; }
.weekday-checkbox-row { display: flex; gap: 6px; flex-wrap: wrap; }
.weekday-check { flex-direction: row !important; align-items: center; gap: 5px; border: 1px solid var(--line); border-radius: 7px; padding: 7px 10px; font-size: 11px; font-weight: 650; color: var(--ink); cursor: pointer; }
.weekday-check input { width: auto; }
/* The planner card lives outside any .modal, so its labels/selects need
   their own polish instead of inheriting .modal label's typography — same
   muted-uppercase look as the rest of the app's forms, just scoped here. */
.planner-controls-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-bottom: 14px; }
.planner-controls-grid label { display: grid; gap: 6px; color: var(--muted); font-size: 11px; font-weight: 650; text-transform: uppercase; letter-spacing: .03em; }
.planner-start-row { display: flex; gap: 8px; }
/* Own row, separate from any variable-width action button, so a wider/
   narrower "+ Opret ny X" label next to it can never shift the tabs'
   position — see renderTrainingPlans()'s tabsRowHTML comment. */
.planner-start-toggle-row { margin-bottom: 20px; }
.planner-start-toggle { display: inline-flex; border: 1px solid var(--line); border-radius: 8px; padding: 2px; background: #f5f7fb; flex: none; }
.planner-start-toggle button { border: 0; background: transparent; color: var(--muted); font-size: 12px; font-weight: 650; padding: 7px 12px; border-radius: 6px; cursor: pointer; }
.planner-start-toggle button.active { background: white; color: var(--brand); box-shadow: 0 1px 3px rgba(10, 34, 64, .12); }
.planner-start-row select, .planner-start-row input[type="date"] { flex: 1; min-width: 0; }
.transition-planner-grid { max-height: 440px; overflow-y: auto; display: grid; gap: 8px; border: 1px solid var(--line); border-radius: 9px; padding: 10px; background: #fbfcfe; }
/* flex-wrap so the per-row "Til hold" select drops to its own line on
   narrower windows instead of forcing horizontal scroll on the grid —
   it still reads right after the day boxes, just wraps when it must. */
.transition-planner-row { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; background: white; border: 1px solid var(--line); border-radius: 8px; padding: 8px 10px; }
.transition-planner-name { font-size: 12px; font-weight: 650; color: var(--ink); width: 138px; flex: none; }
.transition-planner-days { display: flex; gap: 5px; flex: none; }
.transition-day-box { border: 1px solid var(--line); border-radius: 7px; padding: 6px 8px; font-size: 11px; font-weight: 650; color: var(--muted); background: #f4f4f5; cursor: pointer; transition: background-color .12s, border-color .12s; }
.transition-day-box:hover { background: #e9e9ec; }
.transition-day-box.existing { background: var(--win-soft); border-color: var(--win); color: var(--win); }
.transition-day-box.active { background: var(--brand); border-color: var(--brand); color: white; }
/* En allerede-fast dag der er klikket til fjernelse — tydeligt forskellig
   fra både "fast" (grøn) og "tilføjes" (navy), så det er indlysende
   hvad der sker ved næste Gem. */
.transition-day-box.removing { background: var(--red-soft); border-color: var(--red); color: var(--red); text-decoration: line-through; }
.transition-planner-target { width: 132px; flex: none; margin-left: auto; font-size: 12px !important; padding: 8px 28px 8px 10px !important; }
@media (max-width: 700px) { .transition-planner-target { margin-left: 150px; } }
.transition-planner-group-label { margin: 6px 2px 0; font-size: 11px; font-weight: 650; color: var(--muted); text-transform: uppercase; letter-spacing: .02em; }
@media (max-width: 900px) { .planner-controls-grid { grid-template-columns: 1fr; } }
.players-points-list { max-height: 220px; overflow-y: auto; display: grid; gap: 6px; border: 1px solid var(--line); border-radius: 7px; padding: 10px; }
.players-points-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: 12px; color: var(--ink); font-weight: 500; }
.players-points-row label { display: flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 500; color: var(--ink); text-transform: none; }
.players-points-row input[type="number"] { width: 56px; padding: 4px 6px; }
.points-negative { color: var(--red); }
.points-stepper { display: inline-flex; align-items: center; gap: 4px; }
.points-stepper button { width: 22px; height: 22px; border-radius: 6px; border: 1px solid var(--line); background: white; color: var(--ink); font-weight: 700; line-height: 1; cursor: pointer; }
.points-stepper button:hover { background: var(--canvas); }
.points-stepper input[type="number"] { width: 42px; text-align: center; }
.winning-add-player { display: flex; gap: 8px; margin-top: 10px; align-items: center; }
.winning-add-player select { flex: 1; }
.rank-number { display: inline-block; width: 18px; color: var(--muted); font-weight: 650; }
.rank-medal { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 50%; color: white; font-size: 11px; font-weight: 800; margin-right: 2px; }
.rank-medal-gold { background: linear-gradient(155deg, #f3d27a, var(--medal-gold)); }
.rank-medal-silver { background: linear-gradient(155deg, #d9dee4, var(--medal-silver)); }
.rank-medal-bronze { background: linear-gradient(155deg, #d9a374, var(--medal-bronze)); }
.row.rank-gold, .row.rank-silver, .row.rank-bronze { border-radius: 8px; padding: 8px 10px; margin: 0 -10px; }
.row.rank-gold { background: var(--medal-gold-soft); }
.row.rank-silver { background: var(--medal-silver-soft); }
.row.rank-bronze { background: var(--medal-bronze-soft); }
.row.rank-gold .row-title, .row.rank-gold strong { color: var(--medal-gold); }
.row.rank-silver .row-title, .row.rank-silver strong { color: var(--medal-silver); }
.row.rank-bronze .row-title, .row.rank-bronze strong { color: var(--medal-bronze); }
.leaderboard-table { width: 100%; border-collapse: collapse; }
.leaderboard-table th, .leaderboard-table td { padding: 10px; text-align: left; border-bottom: 1px solid var(--line); }
.leaderboard-table thead th { color: var(--muted); font-weight: 650; text-transform: uppercase; font-size: 11px; letter-spacing: .03em; }
.leaderboard-table th:first-child, .leaderboard-table td:first-child { width: 30px; }
.leaderboard-table tr.rank-gold td { background: var(--medal-gold-soft); }
.leaderboard-table tr.rank-silver td { background: var(--medal-silver-soft); }
.leaderboard-table tr.rank-bronze td { background: var(--medal-bronze-soft); }
.leaderboard-table tr.rank-gold strong { color: var(--medal-gold); }
.leaderboard-table tr.rank-silver strong { color: var(--medal-silver); }
.leaderboard-table tr.rank-bronze strong { color: var(--medal-bronze); }
.team-filter-pill input[type="checkbox"] { width: 14px; height: 14px; }
.dev-plan-period { align-items: flex-start; flex-direction: column; gap: 10px; }
.dev-plan-period .row-main { display: grid; gap: 8px; }
.dev-goal { display: grid; gap: 14px; width: 100%; }
.dev-goal-picker-box { display: flex; align-items: center; gap: 12px; border: 1px solid var(--line); border-radius: 11px; padding: 14px 18px; background: var(--brand-soft); }
.dev-goal-picker-label { color: var(--brand); font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; white-space: nowrap; }
.dev-goal-picker-select { flex: 1; font-size: 14px; font-weight: 650; border: 1px solid var(--brand); border-radius: 7px; padding: 9px 30px 9px 12px; background-color: #fff; color: var(--ink); }
.dev-domain-stack { display: grid; gap: 12px; }
.dev-domain-box { border: 1px solid var(--line); border-top: 3px solid var(--line); border-radius: 11px; padding: 16px 18px; background: var(--card); display: grid; gap: 12px; }
.dev-domain-box.dom-fodbold { border-top-color: var(--sky); }
.dev-domain-box.dom-fysisk { border-top-color: var(--win); }
.dev-domain-box.dom-mentalt { border-top-color: var(--team-division); }
.dev-domain-box-heading-row { display: flex; justify-content: space-between; align-items: center; }
.dev-domain-box-heading { font-weight: 700; font-size: 13px; text-transform: uppercase; letter-spacing: .03em; }
.dev-domain-box.dom-fodbold .dev-domain-box-heading { color: var(--sky); }
.dev-domain-box.dom-fysisk .dev-domain-box-heading { color: var(--win); }
.dev-domain-box.dom-mentalt .dev-domain-box-heading { color: var(--team-division); }
.dev-domain-field { display: grid; gap: 4px; }
.dev-domain-field-label { color: var(--muted); font-size: 12px; }
.dev-domain-field-value { color: var(--ink); font-size: 13px; line-height: 1.4; }
.dev-domain-edit-form { display: grid; gap: 10px; }
.dev-domain-edit-form label { display: grid; gap: 4px; font-size: 12px; color: var(--muted); }
.dev-domain-edit-form textarea { min-height: 70px; font-size: 13px; color: var(--ink); font-family: inherit; border: 1px solid var(--line); border-radius: 7px; padding: 10px; resize: vertical; }
.dev-plan-dates { color: var(--muted); font-size: 12px; }
.dev-goal-edit-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.dev-goal-edit-domain { border: 1px solid var(--line); border-radius: 8px; padding: 10px; display: grid; gap: 8px; font-size: 12px; }
.dev-goal-edit-domain strong { font-size: 11px; text-transform: uppercase; letter-spacing: .03em; }
.dev-goal-edit-domain textarea { min-height: 50px; }
.dev-domain-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.dev-domain-chip { font-size: 10px; font-weight: 650; text-transform: uppercase; letter-spacing: .03em; padding: 3px 8px; border-radius: 999px; }
.dev-domain-chip.dom-fodbold { background: var(--sky-soft); color: var(--sky); }
.dev-domain-chip.dom-fysisk { background: var(--win-soft); color: var(--win); }
.dev-domain-chip.dom-mentalt { background: var(--team-division-soft); color: var(--team-division); }
@media (max-width: 900px) {
  .dev-goal-edit-grid { grid-template-columns: 1fr; }
  .stat-grid-5 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) { .dev-goal-picker-box { flex-direction: column; align-items: stretch; } }
.availability-grid-wrap { overflow-x: auto; }
.availability-grid { border-collapse: separate; border-spacing: 0; }
.availability-grid th, .availability-grid td { padding: 4px 6px; text-align: center; font-size: 11px; white-space: nowrap; border-bottom: 1px solid var(--line); }
.availability-grid thead th { font-weight: 650; color: var(--muted); padding-bottom: 6px; }
.availability-grid .sticky-col { position: sticky; left: 0; background: white; text-align: left; z-index: 1; padding-right: 14px; box-shadow: 2px 0 0 var(--line); }
.availability-grid .player-name-cell { font-weight: 650; color: var(--ink); }
.availability-grid .phase-row th { padding-top: 0; padding-bottom: 8px; font-weight: 500; color: var(--brand); font-size: 10px; }
.availability-grid .session-row th { padding-top: 0; padding-bottom: 4px; font-weight: 650; color: var(--muted); font-size: 9px; text-transform: uppercase; letter-spacing: .03em; }
.availability-grid .session-row .link-button { font-size: 11px; margin-left: 3px; }
.availability-grid .today-col { background: #f7f9fc; }
.availability-cell { width: 62px; border: 1px solid var(--line); border-radius: 5px; padding: 3px 2px; font-size: 10px; font-weight: 650; text-align: center; cursor: pointer; }
.availability-cell.tone-green { background: var(--win-soft); color: var(--win); border-color: transparent; }
.availability-cell.tone-red { background: var(--red-soft); color: var(--red); border-color: transparent; }
.availability-cell.tone-amber { background: var(--amber-soft); color: var(--amber); border-color: transparent; }
.availability-cell.tone-blue { background: var(--sky-soft); color: var(--sky); border-color: transparent; }
.availability-cell.tone-white { background: white; color: var(--muted); border-color: var(--line); }
.availability-cell.tone-purple { background: var(--team-division-soft); color: var(--team-division); border-color: transparent; }
.availability-grid .bulk-row th { padding-top: 2px; padding-bottom: 6px; display: table-cell; }
.availability-grid .bulk-row th { vertical-align: top; }
.avail-bulk-btn { display: block; width: 100%; border: 1px solid var(--line); background: white; color: var(--brand); border-radius: 5px; padding: 3px 2px; font-size: 9px; font-weight: 650; line-height: 1.2; cursor: pointer; white-space: normal; margin-bottom: 3px; }
.avail-bulk-btn:last-child { margin-bottom: 0; }
.avail-bulk-btn:hover { background: var(--brand-soft); }
.link-button { border: 0; background: none; color: var(--brand); font-size: 11px; font-weight: 650; padding: 0; cursor: pointer; }

/* Medicinsk modul, Fase 1 — one cell can hold several slot chips (unlike
   the single-status-per-day coach grid above), since a physio's day is
   split into several bookable slots. */
.medical-slot-cell { display: flex; flex-direction: column; gap: 3px; align-items: stretch; min-width: 54px; }
.medical-slot-chip { border: 1px solid var(--line); border-radius: 5px; padding: 2px 4px; font-size: 9px; font-weight: 650; cursor: pointer; }
.medical-slot-chip.tone-green { background: var(--win-soft); color: var(--win); border-color: transparent; }
.medical-slot-chip.tone-red { background: var(--red-soft); color: var(--red); border-color: transparent; }
.medical-slot-chip.tone-blue { background: var(--sky-soft); color: var(--sky); border-color: transparent; cursor: default; }

tr.row-spillerinitiativ td { background: var(--win-soft); }
tr.row-traenerinitiativ td { background: var(--amber-soft); }

/* Træningsplan */
.tp-header-meta { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 16px; }
.tp-header-fields { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-bottom: 16px; }
.tp-header-fields label { display: grid; gap: 5px; color: var(--muted); font-size: 11px; font-weight: 650; text-transform: uppercase; letter-spacing: .03em; min-width: 0; }
.tp-header-fields select { min-width: 0; width: 100%; }
.tp-position-groups { display: grid; gap: 10px; }
.tp-position-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.tp-position-group { border: 1px solid var(--line); border-radius: 8px; padding: 10px 12px; background: #fbfcfe; }
.tp-position-heading { font-size: 11px; font-weight: 650; color: var(--muted); text-transform: uppercase; letter-spacing: .03em; margin-bottom: 4px; }
.tp-position-names { font-size: 12px; color: var(--ink); font-weight: 600; min-height: 16px; }
.tp-position-unassigned { font-size: 11px; color: var(--muted); padding-top: 4px; }
.tp-status-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 14px; }
/* "Jeg behøver ikke se alle trænere på en række... 2-3 kolonner, så de
   fylder mindst muligt" — the outer grid stays a single column here (only
   one list is passed in, unlike Spillerstatus' two squad-halves), and the
   list itself wraps trainers into as many compact columns as fit. */
.tp-trainer-status-grid { grid-template-columns: 1fr; }
.tp-trainer-status-grid > div { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 0 14px; }
.tp-status-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 6px 0; border-bottom: 1px solid var(--line); font-size: 12px; font-weight: 600; color: var(--ink); }
.tp-status-row .status-day-chip { padding: 3px 8px; }
.tp-status-row button[data-tp-remove-trainer] { flex: none; border: 0; background: none; color: var(--muted); font-size: 16px; line-height: 1; cursor: pointer; padding: 0 2px; }
.tp-add-trainer { display: flex; align-items: center; gap: 8px; margin-top: 10px; }
.tp-add-trainer select { flex: 1; min-width: 0; }
.tp-block-list { display: grid; gap: 12px; }
.tp-block-card { border: 1px solid var(--line); border-radius: 9px; padding: 12px 14px; break-inside: avoid; }
.tp-block-head { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.tp-block-number { flex: none; width: 22px; height: 22px; border-radius: 50%; background: var(--brand); color: white; font-size: 11px; font-weight: 700; display: grid; place-items: center; }
.tp-block-title { flex: 1; font-size: 14px; font-weight: 650; border: 1px solid transparent; border-radius: 6px; padding: 4px 6px; }
.tp-block-title:hover, .tp-block-title:focus { border-color: var(--line); outline: none; }
.tp-block-player-count { flex: none; font-size: 11px; font-weight: 650; color: var(--muted); background: var(--brand-soft); border-radius: 999px; padding: 3px 9px; }
.tp-block-actions { display: flex; align-items: center; gap: 10px; flex: none; }
.tp-block-actions button[data-tp-move-block] { border: 1px solid var(--line); background: white; border-radius: 6px; width: 24px; height: 24px; color: var(--muted); cursor: pointer; }
.tp-block-actions button[data-tp-move-block]:disabled { opacity: .35; cursor: not-allowed; }
.tp-block-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin-bottom: 8px; }
.tp-block-grid label, .tp-block-card > label { display: grid; gap: 3px; font-size: 10px; font-weight: 650; color: var(--muted); text-transform: uppercase; letter-spacing: .02em; margin-bottom: 8px; }
.tp-block-card textarea { min-height: 44px; resize: vertical; font-family: inherit; font-size: 12px; color: var(--ink); border: 1px solid var(--line); border-radius: 6px; padding: 6px 8px; }
.tp-block-card input[type="text"], .tp-block-card input[type="time"], .tp-block-card input[type="number"] { border: 1px solid var(--line); border-radius: 6px; padding: 6px 8px; font-size: 12px; color: var(--ink); }
.tp-hold-picker { margin-bottom: 10px; padding: 10px; background: #eef3fb; border-radius: 7px; }
.tp-hold-picker-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 6px; }
.tp-hold-picker-head h4 { font-size: 10px; font-weight: 650; color: var(--muted); text-transform: uppercase; letter-spacing: .02em; margin: 0; }
.tp-hold-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.tp-hold-chip { border: 1px solid var(--line); background: white; border-radius: 999px; padding: 5px 11px; font-size: 12px; font-weight: 600; color: var(--muted); cursor: pointer; }
.tp-hold-chip.active { background: var(--brand); border-color: var(--brand); color: white; }
.tp-hold-chip:disabled { cursor: not-allowed; opacity: .7; }
.tp-hold-picker-head > div { display: flex; align-items: baseline; gap: 6px; }
.tp-block-teams { display: grid; gap: 8px; margin-bottom: 8px; }
.gk-create-row { display: flex; gap: 8px; align-items: center; margin-bottom: 16px; }
.gk-session-card { border-left: 3px solid var(--brand); }
.gk-session-card .tp-hold-chip.active { padding-right: 9px; }
.tp-block-team { border: 1px solid var(--line); border-radius: 7px; padding: 8px 10px; background: white; }
.tp-block-team-head { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.tp-block-team-swatch { flex: none; width: 13px; height: 13px; border-radius: 50%; }
.tp-block-team-name { flex: 1; min-width: 0; border: 1px solid transparent; border-radius: 5px; padding: 3px 5px; font-size: 12px; font-weight: 650; color: var(--ink); }
.tp-block-team-name:hover, .tp-block-team-name:focus { border-color: var(--line); outline: none; }
.tp-hold-unassigned { font-size: 12px; color: var(--muted); padding-top: 8px; margin-top: 4px; border-top: 1px dashed var(--line); }
/* "Jeg skal ikke skulle åbne Inddel igen for at se hvem der står hvor" —
   a compact, inline-wrapping summary under a hold's chips, only present
   once at least one member actually has a zone. */
.tp-hold-formation { display: flex; flex-wrap: wrap; gap: 3px 10px; margin-top: 6px; padding-top: 6px; border-top: 1px dashed var(--line); font-size: 11px; color: var(--muted); }
.tp-hold-formation strong { color: var(--ink); }
/* "Inddel" formation board — four fixed zone-columns, drag chips between
   them (see openFormationModal). */
.formation-board { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin: 14px 0; }
.formation-zone { border: 1px solid var(--line); border-radius: 8px; background: #f5f7fb; padding: 8px; min-height: 120px; }
.formation-zone-label { font-size: 10px; font-weight: 650; color: var(--muted); text-transform: uppercase; letter-spacing: .03em; margin-bottom: 6px; text-align: center; }
.formation-zone-chips { display: flex; flex-direction: column; gap: 6px; min-height: 40px; }
.formation-chip { border: 1px solid var(--line); background: white; border-radius: 999px; padding: 6px 12px; font-size: 12px; font-weight: 600; color: var(--ink); text-align: center; cursor: grab; user-select: none; }
.formation-chip.dragging { opacity: .4; }
.formation-empty { font-size: 11px; color: var(--muted); text-align: center; padding: 8px 0; }
.formation-tray { border-top: 1px dashed var(--line); padding-top: 10px; }
.formation-tray .formation-zone-chips { flex-direction: row; flex-wrap: wrap; }
.formation-tray .formation-chip { flex: none; }
@media (max-width: 640px) { .formation-board { grid-template-columns: repeat(2, 1fr); } }
.tp-template-blocks { display: grid; gap: 8px; }
.tp-template-block-row { display: flex; align-items: center; gap: 8px; }
.tp-template-block-row input[type="text"] { flex: 1; min-width: 0; border: 1px solid var(--line); border-radius: 6px; padding: 7px 9px; font-size: 13px; color: var(--ink); }
.tp-template-block-row input[type="number"] { width: 80px; flex: none; border: 1px solid var(--line); border-radius: 6px; padding: 7px 9px; font-size: 13px; color: var(--ink); }
.tp-template-block-row button[data-template-move-block], .tp-template-block-row button[data-template-delete-block] { flex: none; border: 1px solid var(--line); background: white; border-radius: 6px; width: 28px; height: 28px; color: var(--muted); cursor: pointer; }
.tp-template-block-row button[data-template-move-block]:disabled { opacity: .35; cursor: not-allowed; }
.tp-purpose-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-bottom: 8px; }
.tp-purpose-box { display: flex; align-items: center; gap: 6px; border: 1px solid var(--line); border-radius: 6px; padding: 4px 6px; }
.tp-purpose-box input { border: 0 !important; padding: 2px !important; flex: 1; min-width: 0; }
.tp-purpose-number { flex: none; width: 16px; height: 16px; border-radius: 50%; background: var(--brand-soft); color: var(--brand); font-size: 9px; font-weight: 700; display: grid; place-items: center; }
.tp-tasks { margin-bottom: 8px; }
.tp-tasks-label { font-size: 10px; font-weight: 650; color: var(--muted); text-transform: uppercase; letter-spacing: .02em; margin-bottom: 6px; }
.tp-tasks-rows { display: grid; gap: 6px; margin-bottom: 6px; }
.tp-task-row { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.tp-task-row select { flex: none; width: 150px; font-size: 11px !important; padding: 6px 26px 6px 8px !important; }
.tp-task-row input[type="text"] { flex: 1; min-width: 140px; }
.tp-task-row button { flex: none; border: 0; background: none; color: var(--muted); font-size: 16px; line-height: 1; cursor: pointer; padding: 0 4px; }

/* Øvelsesdiagram / taktiktavle — a slim icon-first rail, not a boxed
   strip of text buttons; the canvas is the main event. */
.tp-diagram { margin-top: 6px; }
.tp-diagram-toggle { font-size: 11px; }
.tp-diagram-toolbar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 8px 0; padding: 6px 8px; }
.tp-diagram-tools { display: flex; gap: 3px; flex-wrap: wrap; }
.tp-diagram-tool-btn { width: 26px; height: 26px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--line); background: white; color: var(--muted); font-size: 13px; line-height: 1; padding: 0; border-radius: 6px; cursor: pointer; }
.tp-diagram-tool-btn.active { background: var(--brand); border-color: var(--brand); color: white; }
.tp-diagram-tool-icon { width: 16px; height: 16px; object-fit: contain; pointer-events: none; }
.tp-diagram-colors { display: flex; gap: 4px; }
.tp-diagram-color-swatch { width: 16px; height: 16px; border-radius: 50%; border: 2px solid transparent; cursor: pointer; padding: 0; }
.tp-diagram-color-swatch.active { border-color: var(--brand); box-shadow: 0 0 0 1px white inset; }
.tp-diagram-bg-select { font-size: 11px; padding: 3px 6px; border: 1px solid var(--line); border-radius: 6px; color: var(--muted); }
.tp-diagram-zoom { display: flex; align-items: center; gap: 4px; }
.tp-diagram-zoom-label { font-size: 11px; color: var(--muted); min-width: 34px; text-align: center; }
.tp-diagram-tool-btn:disabled { opacity: 0.35; cursor: default; }
/* Only rendered in the DOM at all once something is selected — never a
   permanently-reserved strip ("kun fylde, når de er relevante"). */
.tp-diagram-context { display: flex; align-items: center; gap: 4px; flex-wrap: wrap; margin: 0 0 8px; padding: 5px 8px; background: var(--brand-soft, #eef3fb); border-radius: 7px; }
.tp-diagram-ctx-btn { width: 24px; height: 24px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--line); background: white; color: var(--ink); font-size: 12px; padding: 0; border-radius: 5px; cursor: pointer; }
.tp-diagram-ctx-opacity { width: 70px; }
.tp-diagram-ctx-count { font-size: 11px; color: var(--muted); padding: 0 2px; }
/* overflow:auto (not hidden) — when a block is zoomed in via the toolbar's
   +/− buttons, native scrolling is the pan mechanism (no custom pan-drag
   code); at the default 100% zoom this behaves identically to before. */
.tp-diagram-canvas-wrap { border: 1px solid var(--line); border-radius: 8px; overflow: auto; background: #fff; }
.tp-diagram-canvas-wrap.tp-diagram-collapsed { display: none; }
.tp-diagram-svg { width: 100%; height: auto; display: block; touch-action: none; transform-origin: 0 0; }
.tp-diagram-shape { cursor: pointer; }
/* Selection overlay/handles — never persisted, drawn fresh on top of
   whichever shape is selected. */
.tp-diagram-select-ring { fill: none; stroke: var(--brand); stroke-width: 1.5; stroke-dasharray: 3,2; pointer-events: none; }
.tp-diagram-select-outline { fill: none; stroke: var(--brand); stroke-width: 1.5; stroke-dasharray: 4,2; pointer-events: none; }
.tp-diagram-select-group-outline { stroke-dasharray: 6,3; stroke-width: 2; }
.tp-diagram-handle { fill: white; stroke: var(--brand); stroke-width: 1.5; cursor: pointer; }
.tp-diagram-handle-rotate { cursor: grab; }
/* On-canvas "Erstat"/"Slet" — right next to the selected object, every
   shape type, so neither needs a trip to the toolbar/context panel. */
.tp-diagram-quick-btn { cursor: pointer; }
.tp-diagram-quick-btn circle { fill: white; stroke: var(--line); stroke-width: 1.2; }
.tp-diagram-quick-btn:hover circle { stroke: var(--brand); }
.tp-diagram-quick-btn text { font-size: 9px; fill: var(--ink); pointer-events: none; }

/* "Udskriv øvelseskort" — the ONE print format for a training plan
   (the old separate full-plan "Udskriv" print, and its .tp-print-area/
   @media print pathway, has been removed entirely per Dennis's "der
   skal kun være ét printformat fremover"). Portrait, 4 pocket-sized
   EfB-blue coaching cards per A4 page, fixed physical size — content is
   fit INTO the card, never the other way around. Sizing/layout rules
   below are deliberately OUTSIDE @media print — fitAndPrintExerciseCards()
   measures each card's real scrollHeight against its fixed budget
   on-screen, before ever calling window.print(), so the exact print
   dimensions must already apply off-screen (@media print rules don't
   exist yet at measurement time). Only visibility/positioning is
   print-conditional, at the very bottom of this block. */
.tp-cards-print-area { position: fixed; left: -10000px; top: 0; width: 287mm; }
.tp-cards-page { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 1fr 1fr; width: 287mm; height: 199mm; gap: 3mm; break-after: page; }
.tp-cards-page:last-child { break-after: auto; }
/* Each card lands at roughly 50%×50% of the page above (minus the new
   inter-card gap) — Dennis's ~105×148.5mm ¼-A4 target, without
   hardcoding a figure that would drift from a given printer's real
   unprintable edge (the portrait @page override injected right before
   printing uses a near-zero margin, see fitAndPrintExerciseCards). */
/* Plain block flow, deliberately NOT flex — a flex column lets children
   shrink to fit the fixed height instead of genuinely overflowing it,
   which would make scrollHeight silently equal clientHeight even when
   content doesn't really fit, breaking the whole measure-and-trim loop
   in fitAndPrintExerciseCards. Block flow lets content truly overflow
   (caught by overflow:hidden as the visual backstop) so scrollHeight
   stays an honest signal — the head/main/hold-band sections below are
   just ordinary block children, stacked top to bottom. */
.tp-exercise-card { border: 1px solid var(--brand-soft); border-radius: 2.5mm; overflow: hidden; box-sizing: border-box; display: block; background: white; }
/* EfB-blue header bar — øvelsesnavn + nummer (tier 1) and tidspunkt
   (tier 2), the two things a coach needs in the first half-second. */
.tp-card-head { display: flex; align-items: center; justify-content: space-between; gap: 3mm; background: var(--brand); color: white; padding: 2.5mm 4mm; }
.tp-card-head-title { display: flex; align-items: baseline; gap: 2mm; overflow: hidden; min-width: 0; }
.tp-card-number { display: inline-flex; align-items: center; justify-content: center; width: 5.5mm; height: 5.5mm; border-radius: 50%; background: white; color: var(--brand); font-size: 8pt; font-weight: 700; flex: 0 0 auto; }
.tp-card-title { font-weight: 700; font-size: 10.5pt; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tp-card-time { font-size: 8pt; font-weight: 650; white-space: nowrap; flex: 0 0 auto; }
.tp-card-main { padding: 3mm 4mm; }
/* Diagram (tier 3) and the info column sit in separate CSS Grid tracks
   — never one shared block-flow column — so text can never paint into
   the diagram's pixels regardless of content length or the diagram
   SVG's own aspect ratio (the actual mechanism behind the old overlap
   bug). Diagram is never dropped (tiers 1–4 are absent from
   CARD_DROP_ORDER), so it always gets its track. */
.tp-card-body { display: grid; grid-template-columns: 1fr 1fr; gap: 3mm; align-items: stretch; }
.tp-card-diagram-wrap { overflow: hidden; display: flex; align-items: center; justify-content: center; min-height: 0; border: 1px solid var(--brand-soft); border-radius: 2mm; background: #fafbfd; }
.tp-card-diagram-wrap svg { width: 100%; height: 100%; display: block; }
.tp-card-info { display: flex; flex-direction: column; gap: 2mm; min-width: 0; }
.tp-card-section-label { font-size: 6.5pt; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--brand); border-bottom: 1px solid var(--brand-soft); padding-bottom: .5mm; margin-bottom: .5mm; }
.tp-card-fokus, .tp-card-opgaver { font-size: 8pt; line-height: 1.28; }
.tp-card-fokus div, .tp-card-opgaver div { margin-bottom: .5mm; }
.tp-card-body-text { font-size: 8pt; line-height: 1.28; }
/* Holdinddeling (tier 5) — visibly separate full-width band below the
   diagram/info body, not squeezed into the info column, so a coach can
   see the actual zone rosters (GK/DEF/MID/ANG) at a glance. */
.tp-card-hold-band { border-top: 1px solid var(--brand-soft); padding: 2mm 4mm; display: flex; flex-wrap: wrap; gap: 1.5mm 5mm; background: #f7f9fc; }
.tp-card-hold-team { font-size: 7.5pt; line-height: 1.35; }
.tp-card-hold-team strong { color: var(--brand); font-size: 8pt; margin-right: 1.5mm; }
.tp-card-hold-zone { margin-right: 3mm; }
/* Font-size fallback (tier 10) — only ever applied after every optional
   section (tiers 5–9) is already gone and the card still overflows (see
   fitAndPrintExerciseCards), never the first move. */
.tp-exercise-card.tp-card-compact { font-size: 90%; }
.tp-exercise-card.tp-card-compact .tp-card-head { padding: 2mm 3.5mm; }

@media print {
  /* Kun printområdet fylder — resten af appen fjernes helt (ellers giver den skjulte side masser af tomme sider) */
  body.print-cards > *:not(.tp-cards-print-area) { display: none !important; }
  body.print-cards .tp-cards-print-area { position: static; left: auto; width: 287mm; }
  body.print-cards { background: #fff !important; }
}

/* Kampdetaljer — tæt, navyblå header-bjælke + meta-række, mimer
   Kampstatistik.xlsm's eget "Upload kampe"-ark i stedet for appens
   generiske kort/header-stil. Alle felter heri er redigerbare direkte
   (data-match-field), ingen separat "Redigér kamp"-popup. */
.match-header-bar { display: flex; align-items: center; justify-content: space-between; gap: 16px; background: var(--brand); color: white; border-radius: 10px; padding: 16px 20px; margin-bottom: 10px; }
.match-header-team, .match-header-opponent { flex: 1 1 0; min-width: 0; }
.match-header-opponent { text-align: right; }
.match-score { flex: 0 0 auto; font-family: var(--font-heading); font-weight: 700; font-size: 26px; white-space: nowrap; }
.match-header-select, .match-header-input { background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.3); color: white; border-radius: 6px; padding: 8px 10px; font-size: 15px; font-weight: 650; width: 100%; }
.match-header-opponent .match-header-input { text-align: right; }
.match-header-select option { color: var(--ink); }
.match-header-select::placeholder, .match-header-input::placeholder { color: rgba(255,255,255,.7); }
.match-meta-row { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 14px; background: var(--card); border: 1px solid var(--line); border-radius: 10px; padding: 12px 16px; margin-bottom: 16px; }
.match-meta-row label { display: flex; flex-direction: column; gap: 4px; font-size: 11px; color: var(--muted); font-weight: 650; }
.match-meta-row select, .match-meta-row input { font-size: 13px; padding: 6px 8px; }
/* Datoen brugte browserens helt generiske talvisning — sat i samme
   Kanit-overskriftsfont og navy som resten af brandguiden (fx
   .match-score), med et lille brand-navyt kalenderikon i stedet for
   browserens egen grå. Selve kalender-popup'en er OS-styret og kan ikke
   restyles, men det er kun feltets EGEN visning brugeren ser til hverdag. */
.match-meta-row input[type="date"] {
  position: relative;
  font-family: var(--font-heading);
  font-weight: 650;
  font-size: 14px;
  color: var(--brand);
  letter-spacing: .02em;
  border: 1px solid var(--brand-soft);
  border-radius: 6px;
  padding: 7px 34px 7px 10px;
  background: white url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23001c44' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2'/%3E%3Cline x1='16' y1='2' x2='16' y2='6'/%3E%3Cline x1='8' y1='2' x2='8' y2='6'/%3E%3Cline x1='3' y1='10' x2='21' y2='10'/%3E%3C/svg%3E") no-repeat right 9px center;
  background-size: 15px;
}
.match-meta-row input[type="date"]::-webkit-calendar-picker-indicator {
  position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer;
}
.match-meta-readonly { color: var(--muted); font-size: 13px; }
.match-meta-badge { margin-left: auto; }
.match-meta-actions { display: flex; gap: 8px; }
.match-squad-table th, .match-squad-table td { padding: 6px 8px; font-size: 12px; }
.match-event-table { width: 100%; }
.match-event-table th { text-align: left; font-size: 10px; color: var(--muted); font-weight: 650; text-transform: uppercase; letter-spacing: .03em; padding: 0 6px 6px; }
.match-event-table td { padding: 5px 6px; font-size: 12px; border-bottom: 1px solid var(--line); }
.match-event-table tr:last-child td { border-bottom: none; }
/* Den altid-synlige "udfyld direkte"-række nederst i hver tabel — en
   svag baggrund markerer den som stadig tom/redigerbar, adskilt fra de
   allerede gemte rækker ovenfor. */
.match-event-draft-row { background: var(--canvas); }
.match-event-draft-row select, .match-event-draft-row input { font-size: 12px; padding: 3px 5px; }

@media (max-width: 900px) { .sidebar { width: 210px; } #app, .topbar { padding-left: 24px; padding-right: 24px; } .stat-grid { grid-template-columns: repeat(2, 1fr); } .grid-2 { grid-template-columns: 1fr; } }
@media (max-width: 650px) { .sidebar { position: fixed; z-index: 5; height: 100vh; transform: translateX(-100%); transition: transform .2s; } .sidebar.open { transform: translateX(0); } .mobile-menu { display: block; } .topbar { gap: 12px; height: 78px; } h1 { font-size: 22px; } #app { padding: 24px 16px; } .topbar { padding: 0 16px; } .topbar-actions { gap: 8px; } .team-picker { font-size: 0; } .team-picker select { font-size: 11px; max-width: 130px; } .stat-grid { gap: 9px; } .stat-card { padding: 13px; } .stat-value { font-size: 24px; } .calendar-grid { overflow-x: auto; grid-template-columns: repeat(7, minmax(110px, 1fr)); } table { min-width: 620px; } .card { overflow-x: auto; } .view-header { align-items: flex-start; flex-direction: column; } }

/* Navngivne træningsskabeloner (Fase 5) */
.named-template-block { margin-top: 12px; }
.named-template-block textarea { width: 100%; box-sizing: border-box; border: 1px solid var(--line); border-radius: 6px; padding: 7px 9px; font-size: 13px; color: var(--ink); font-family: inherit; }
.named-template-block .dev-goal-edit-grid { display: grid; gap: 10px; }
.named-template-block .dev-goal-edit-grid input { width: 100%; box-sizing: border-box; border: 1px solid var(--line); border-radius: 6px; padding: 7px 9px; font-size: 13px; color: var(--ink); }
.named-template-diagram-wrap { margin-top: 10px; max-width: 320px; }
@media (max-width: 600px) { .named-template-diagram-wrap { max-width: 100%; } }
.named-template-block label { display: grid; gap: 4px; font-size: 11px; font-weight: 650; color: var(--muted); }
.named-template-block .tp-template-block-row { margin-bottom: 0; }
@media (max-width: 600px) {
  .named-template-block .tp-template-block-row { flex-wrap: wrap; }
  .named-template-block .tp-template-block-row input[type="text"] { flex: 1 1 100%; order: 10; }
}

/* Fælles øvelseskort (F5.2) */
.exercise-card { background: var(--card); border: 1px solid var(--line); border-radius: 14px; padding: 16px 18px; }
.xc-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 18px; margin-bottom: 14px; }
.xc-left, .xc-right { display: grid; gap: 10px; align-content: start; min-width: 0; }
.xc-section-label { font-family: var(--font-heading); font-weight: 700; text-transform: uppercase; letter-spacing: .04em; font-size: 11px; color: var(--gold-dark); margin-top: 4px; }
.exercise-card label { display: grid; gap: 4px; font-size: 11px; font-weight: 650; color: var(--muted); }
.exercise-card input[type="text"], .exercise-card input[type="number"], .exercise-card input[type="time"], .exercise-card select, .exercise-card textarea { border: 1px solid var(--line); border-radius: 8px; padding: 8px 10px; font-size: 13px; color: var(--ink); background: #fbfcfe; font-family: inherit; width: 100%; box-sizing: border-box; }
.exercise-card textarea { resize: vertical; }
.xc-phase-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.xc-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.xc-chip { border: 1px solid var(--line); background: white; border-radius: 999px; padding: 5px 12px; font-size: 12px; font-weight: 600; color: var(--muted); cursor: pointer; }
.xc-chip.active { background: var(--brand); border-color: var(--brand); color: white; }
.xc-chip:disabled { cursor: not-allowed; opacity: .7; }
.xc-sketch { border: 1px solid var(--line); border-radius: 10px; background: #e6f1e6; padding: 8px; min-height: 90px; }
.xc-sketch-preview svg, .xc-sketch-img { display: block; width: 100%; height: auto; max-height: 360px; object-fit: contain; border-radius: 6px; }
.xc-sketch-empty { text-align: center; color: var(--muted); font-size: 12px; padding: 28px 0; }
.xc-sketch-actions { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.xc-upload { display: inline-flex !important; align-items: center; border: 1px dashed var(--brand-light); border-radius: 8px; padding: 8px 12px; font-size: 12px !important; color: var(--brand-light) !important; cursor: pointer; background: white; }
.xc-upload.dragover { background: var(--brand-soft); }
.xc-time-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 10px; align-items: end; padding-top: 10px; border-top: 1px solid var(--line); }
.xc-total-hint { grid-column: 1 / -1; justify-self: start; }
@media (max-width: 900px) { .xc-grid { grid-template-columns: 1fr; } }
.modal.exercise-card { max-height: 92vh; overflow-y: auto; }

/* Træningseditor: Dele (F5.4) */
.tp-part { margin: 14px 0; }
.part-header { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 10px 14px; background: var(--card); border: 1px solid var(--line); border-radius: 12px; margin-bottom: 10px; }
.part-badge { flex: none; width: 28px; height: 28px; border-radius: 50%; background: var(--gold-gradient); color: white; font-family: var(--font-heading); font-weight: 700; display: grid; place-items: center; }
.part-title { font-family: var(--font-heading); text-transform: uppercase; letter-spacing: .03em; color: var(--brand); }
.part-participants { font-size: 12px; font-weight: 650; color: var(--muted); background: var(--brand-soft); border-radius: 999px; padding: 3px 10px; }
.part-groups { display: flex !important; align-items: center; gap: 6px; margin-left: auto; font-size: 11px; font-weight: 650; color: var(--muted); }
.part-groups select { width: auto; border: 1px solid var(--line); border-radius: 6px; padding: 4px 6px; }
.tp-part-cards { display: grid; gap: 12px; }
.tp-part-actions { display: flex; gap: 10px; margin-top: 10px; }
.part-groups select { min-width: 58px; }
.tp-card-sketch { display: block; width: 100%; height: 100%; object-fit: contain; }

/* ===== Fælles komponenter (Fase 0) — genbruges af Overblik, Træneropfølgning, Spillerprofil ===== */
.kpi-card { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius-card); box-shadow: var(--shadow-card); padding: 20px 22px; display: grid; grid-template-columns: 1fr auto; gap: 4px 12px; align-items: start; }
.kpi-label { font-family: var(--font-heading); font-size: 11px; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.kpi-value { grid-column: 1; font-size: 34px; font-weight: 500; color: var(--brand); line-height: 1.1; }
.kpi-sub { grid-column: 1; font-size: 12px; color: var(--muted); }
.kpi-icon { grid-column: 2; grid-row: 1 / span 2; width: 40px; height: 40px; border-radius: 10px; display: grid; place-items: center; background: var(--brand-soft); color: var(--brand); }
.kpi-icon svg { width: 20px; height: 20px; }
.kpi-icon.tone-ok { background: var(--tone-ok-soft); color: var(--tone-ok); }
.kpi-icon.tone-warn { background: var(--tone-warn-soft); color: var(--tone-warn); }
.kpi-icon.tone-bad { background: var(--tone-bad-soft); color: var(--tone-bad); }
.kpi-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; margin-bottom: 20px; }
.section-label { display: flex; align-items: center; gap: 10px; font-family: var(--font-heading); font-weight: 700; text-transform: uppercase; letter-spacing: .04em; font-size: 14px; color: var(--brand); }
.section-label::before { content: ""; width: 3px; height: 16px; border-radius: 2px; background: var(--gold); }
.chip { display: inline-flex; align-items: center; gap: 6px; border-radius: 999px; padding: 4px 11px; font-size: 12px; font-weight: 500; background: var(--tone-mute-soft); color: var(--tone-mute); white-space: nowrap; }
.chip svg { width: 13px; height: 13px; }
.chip.tone-ok { background: var(--tone-ok-soft); color: var(--tone-ok); }
.chip.tone-warn { background: var(--tone-warn-soft); color: var(--tone-warn); }
.chip.tone-bad { background: var(--tone-bad-soft); color: var(--tone-bad); }
.chip.tone-info { background: var(--tone-info-soft); color: var(--tone-info); }
.chip.chip-square { width: 26px; height: 26px; padding: 0; justify-content: center; border-radius: 7px; font-weight: 600; font-size: 11px; }
.tabs-pill { display: flex; flex-wrap: wrap; gap: 4px; background: var(--card); border: 1px solid var(--line); border-radius: var(--radius-card); padding: 6px; box-shadow: var(--shadow-card); }
.tabs-pill > button { flex: 1 1 auto; border: 0; background: transparent; border-radius: 11px; padding: 10px 16px; font-size: 14px; color: var(--muted); display: inline-flex; align-items: center; justify-content: center; gap: 8px; }
.tabs-pill > button:hover { background: var(--canvas); }
.tabs-pill > button.active { background: var(--pill-active-bg); color: var(--pill-active-ink); font-weight: 600; }
.tabs-pill .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--gold); }
.segmented { display: inline-flex; background: var(--card); border: 1px solid var(--line); border-radius: 12px; padding: 4px; gap: 2px; }
.segmented > button { border: 0; background: transparent; border-radius: 9px; padding: 8px 14px; font-size: 13px; color: var(--muted); display: inline-flex; align-items: center; gap: 6px; }
.segmented > button.active { background: var(--pill-active-bg); color: var(--pill-active-ink); font-weight: 600; }
.status-card { background: var(--card); border: 1px solid var(--line); border-radius: 14px; box-shadow: var(--shadow-card); padding: 12px 14px; display: flex; align-items: center; gap: 12px; min-width: 150px; }
.status-card-icon { width: 34px; height: 34px; border-radius: 9px; display: grid; place-items: center; background: var(--tone-mute-soft); color: var(--tone-mute); flex: none; }
.status-card-label { font-size: 10px; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); font-family: var(--font-heading); }
.status-card-value { font-size: 15px; font-weight: 500; color: var(--brand); }
.status-card.tone-ok .status-card-value { color: var(--tone-ok); } .status-card.tone-ok .status-card-icon { background: var(--tone-ok-soft); color: var(--tone-ok); }
.status-card.tone-bad .status-card-value { color: var(--tone-bad); } .status-card.tone-bad .status-card-icon { background: var(--tone-bad-soft); color: var(--tone-bad); }
.status-card.tone-warn .status-card-value { color: var(--tone-warn); } .status-card.tone-warn .status-card-icon { background: var(--tone-warn-soft); color: var(--tone-warn); }
.table-clean { width: 100%; border-collapse: collapse; }
.table-clean th { text-align: left; font-size: 12px; font-weight: 400; color: var(--muted); padding: 10px 12px; border-bottom: 1px solid var(--line); }
.table-clean td { padding: 14px 12px; border-bottom: 1px solid var(--line); font-size: 14px; }
.table-clean tr:last-child td { border-bottom: 0; }
.jersey-badge { width: 36px; height: 36px; border-radius: 50%; background: var(--gold-light); color: var(--brand); font-family: var(--font-heading); font-weight: 700; display: inline-grid; place-items: center; }
@media (max-width: 650px) { .topbar .breadcrumb-root, .topbar .breadcrumb-sep { display: none; } .team-picker .topbar-icon { display: none; } }
[hidden] { display: none !important; }
@media (max-width: 650px) { .sidebar-collapse { display: none; } .sidebar.collapsed { width: 210px; } }

/* ===== Overblik (Fase 1) ===== */
.overview-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 20px; margin-bottom: 20px; flex-wrap: wrap; }
.overview-weeklabel { font-family: var(--font-heading); font-size: 11px; letter-spacing: .14em; color: var(--muted); font-weight: 500; }
.overview-title { font-family: var(--font-heading); font-weight: 700; text-transform: uppercase; font-size: 28px; margin: 4px 0 4px; color: var(--brand); letter-spacing: .01em; }
.overview-sub { margin: 0; color: var(--muted); font-size: 14px; }
.overview-section-title { font-family: var(--font-heading); text-transform: uppercase; letter-spacing: .04em; font-size: 14px; color: var(--brand); margin: 28px 0 12px; }
.focus-banner { display: flex; justify-content: space-between; align-items: center; gap: 16px; background: var(--brand-soft); border: 1px solid #c9d8ee; border-radius: var(--radius-card); padding: 18px 22px; margin-bottom: 20px; cursor: pointer; text-decoration: none; color: var(--brand); }
.focus-banner:hover { background: #d3e0f3; }
.focus-label { font-family: var(--font-heading); font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--brand-light); margin-bottom: 8px; font-weight: 500; }
.focus-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.focus-chips .chip { background: #fff; color: var(--brand); border: 1px solid #c9d8ee; }
.insight-card, #followup-card { margin-bottom: 20px; }
.insight-sub { margin: 6px 0 14px; font-size: 13px; color: var(--muted); }
.insight-row { display: flex; align-items: center; gap: 12px; background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 12px 14px; margin-bottom: 8px; cursor: pointer; color: var(--ink); text-decoration: none; font-size: 14px; }
.insight-row:hover { border-color: var(--brand-light); box-shadow: var(--shadow-card); }
.insight-ico { flex: none; display: grid; place-items: center; }
.insight-ico svg { width: 18px; height: 18px; }
.insight-ico.tone-bad { color: var(--tone-bad); } .insight-ico.tone-warn { color: var(--tone-warn); } .insight-ico.tone-info { color: var(--tone-info); }
.insight-text { flex: 1; min-width: 0; }
.insight-arrow { flex: none; color: var(--muted); display: grid; place-items: center; }
.insight-arrow svg { width: 16px; height: 16px; }
.insight-empty { display: flex; align-items: center; gap: 10px; color: var(--tone-ok); font-size: 14px; padding: 8px 2px; }
.insight-empty svg { width: 18px; height: 18px; }
.followup-scroll { overflow-x: auto; }
.followup-table th.fu-head { text-align: center; white-space: nowrap; }
.followup-table td.fu-cell { text-align: center; }
.followup-table td.fu-count { font-weight: 600; width: 32px; }
.fu-count.tone-bad { color: var(--tone-bad); } .fu-count.tone-warn { color: var(--tone-warn); } .fu-count.tone-info { color: var(--tone-info); }
.fu-detail { color: var(--brand-light); font-size: 13px; cursor: pointer; white-space: nowrap; }
.fu-none { color: #b4c0d3; }
.flag-dot { display: inline-block; width: 12px; height: 12px; border-radius: 50%; }
.flag-dot.tone-bad { background: var(--tone-bad); } .flag-dot.tone-warn { background: #e0a82e; } .flag-dot.tone-info { background: #5bb8e8; }
.fu-legend { display: flex; flex-wrap: wrap; gap: 18px; margin-top: 14px; font-size: 12px; color: var(--muted); align-items: center; }
.fu-legend span { display: inline-flex; align-items: center; gap: 6px; }
.segmented > button { white-space: nowrap; }
.segmented svg { width: 15px; height: 15px; }
.kpi-sub a { color: var(--brand-light); text-decoration: none; }
.kpi-sub a:hover { text-decoration: underline; }

/* Træneropfølgning (Fase 2) */
#coach-followup-card { margin-bottom: 20px; }
.coach-table td { vertical-align: middle; }
.coach-team strong { font-size: 15px; font-weight: 600; color: var(--brand); }
.coach-name { font-size: 12px; color: var(--muted); margin: 2px 0 6px; }
.coach-results { display: flex; align-items: center; gap: 4px; flex-wrap: wrap; }
.coach-record { margin-left: 6px; font-size: 12px; color: var(--muted); white-space: nowrap; }
.th-sub { display: block; font-size: 10px; color: #a9b6cc; margin-top: 2px; }
.chip.chip-none { color: #a9b6cc; background: var(--tone-mute-soft); }
.chip.chip-sm { padding: 2px 9px; font-size: 11px; background: #fff; border: 1px solid var(--line); color: var(--brand); }
.chip.chip-square { background: var(--tone-mute-soft); }
.chip.chip-square.tone-ok { background: var(--tone-ok-soft); } .chip.chip-square.tone-bad { background: var(--tone-bad-soft); }
.insight-arrow[data-coach-team] { cursor: pointer; }
.coach-table .coach-team { min-width: 270px; }
.coach-table .coach-results { flex-wrap: nowrap; }
.coach-table .chip.chip-square { width: 24px; height: 24px; }

/* Spillerprofil (Fase 3) */
.player-pager { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: 16px; flex-wrap: wrap; }
.back-link { color: var(--brand-light); font-size: 14px; cursor: pointer; text-decoration: none; }
.back-link:hover { text-decoration: underline; }
.player-pager-nav { display: flex; align-items: center; gap: 8px; }
.player-pager-nav .icon-button { border: 1px solid var(--line); background: #fff; font-size: 20px; }
.player-pager-nav .icon-button:disabled { opacity: .35; cursor: not-allowed; }
.player-header { display: grid; grid-template-columns: auto 1fr auto; gap: 24px; align-items: start; margin-bottom: 18px; padding: 24px; }
.player-photo-wrap { position: relative; }
.player-photo { width: 112px; height: 112px; border-radius: 50%; object-fit: cover; display: block; border: 3px solid #fff; box-shadow: var(--shadow-card); }
.player-photo-empty { display: grid; place-items: center; background: var(--brand-soft); color: var(--brand); font-family: var(--font-heading); font-weight: 700; font-size: 34px; }
.photo-upload { position: absolute; right: 0; bottom: 0; width: 32px; height: 32px; border-radius: 50%; background: var(--brand); color: #fff; display: grid; place-items: center; cursor: pointer; border: 2px solid #fff; }
.photo-upload svg { width: 16px; height: 16px; }
.player-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 10px; }
.player-chips .chip svg { width: 13px; height: 13px; }
.chip.tone-warn-soft { background: #fbf1d9; color: #7a5b13; }
.player-name-heading { font-family: var(--font-heading); font-weight: 700; text-transform: uppercase; font-size: 32px; margin: 0 0 8px; color: var(--brand); line-height: 1.1; }
.player-meta-line { display: flex; flex-wrap: wrap; gap: 16px; color: var(--muted); font-size: 14px; }
.player-meta-line span { display: inline-flex; align-items: center; gap: 6px; }
.player-meta-line svg { width: 15px; height: 15px; }
.player-goal { display: flex; align-items: center; gap: 12px; margin-top: 14px; font-size: 14px; color: var(--ink); }
.player-header-side { display: grid; gap: 14px; justify-items: end; }
.quick-stats { display: flex; gap: 10px; }
.quick-stat { background: var(--canvas); border: 1px solid var(--line); border-radius: 12px; padding: 12px 18px; text-align: center; min-width: 92px; }
.quick-stat-value { font-size: 26px; font-weight: 500; color: var(--brand); line-height: 1.1; }
.quick-stat-label { font-size: 12px; color: var(--muted); margin-top: 2px; }
.player-tabs-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 14px; align-items: start; margin-bottom: 20px; }
.player-tabs > button svg { width: 16px; height: 16px; }
.status-cards { display: flex; gap: 10px; }
.status-card-sub { font-size: 11px; color: var(--muted); }
.status-card-icon svg { width: 18px; height: 18px; }
.kpi-row-5 { grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); }
@media (max-width: 1100px) { .player-tabs-row { grid-template-columns: 1fr; } .status-cards { flex-wrap: wrap; } }
@media (max-width: 800px) { .player-header { grid-template-columns: 1fr; } .player-header-side { justify-items: start; } .quick-stats { flex-wrap: wrap; } .player-name-heading { font-size: 26px; } }
.player-photo-wrap { width: 112px; }

/* Positionskort (Fase 5) */
.pos-table { width: 100%; border-collapse: separate; border-spacing: 0; }
.pos-table th, .pos-table td { text-align: left; vertical-align: top; padding: 10px 8px; border-bottom: 1px solid var(--line); }
.pos-head { font-size: 13px; font-weight: 500; color: var(--ink); min-width: 150px; }
.pos-year-head, .pos-year { font-size: 16px; font-weight: 500; color: var(--brand); width: 70px; }
.pos-cell { min-width: 150px; }
.pos-pill { display: flex; align-items: center; justify-content: space-between; gap: 8px; border-radius: 10px; padding: 6px 10px; margin-bottom: 6px; font-size: 13px; cursor: pointer; text-decoration: none; border: 1px solid var(--line); background: #fff; color: var(--ink); }
.pos-pill:hover { box-shadow: var(--shadow-card); }
.pos-pill.tone-green { background: var(--tone-ok-soft); border-color: #bfe3cd; color: var(--tone-ok); }
.pos-pill.tone-amber { background: var(--tone-warn-soft); border-color: #f0d9a8; color: #8a5a14; }
.pos-pill.tone-red { background: var(--tone-bad-soft); border-color: #efc4be; color: var(--tone-bad); }
.pos-pill.pos-secondary { border-style: dashed; opacity: .7; }
.pos-name { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pos-dots { display: inline-flex; align-items: center; gap: 3px; flex: none; }
.pos-dot, .pos-plan { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: #cfd8e6; }
.pos-plan { border-radius: 3px; width: 9px; height: 9px; margin-left: 2px; }
.pos-dot.tone-green, .pos-plan.tone-green { background: #22a45d; } .pos-dot.tone-amber, .pos-plan.tone-amber { background: #e0a82e; } .pos-dot.tone-red, .pos-plan.tone-red { background: var(--tone-bad); }
.pos-dot.tone-none, .pos-plan.tone-none { background: transparent; border: 1px solid #b4c0d3; }
#position-map-card .card-heading { flex-wrap: wrap; gap: 12px; }
@media (max-width: 650px) { #position-map-card .header-actions { width: 100%; } .segmented { max-width: 100%; overflow-x: auto; } }

/* Perioder, Direktiver, Årshjul (Fase 6) */
.period-card { margin-bottom: 14px; }
.period-card.period-current { border-color: var(--gold); }
.period-name { font-family: var(--font-heading); font-weight: 700; text-transform: uppercase; font-size: 17px; margin: 4px 0 0; color: var(--brand); display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.directive-card { margin-bottom: 14px; }
.focus-chips .chip[data-directive-toggle] { cursor: pointer; border: 0; }
.focus-chips .chip[disabled] { cursor: default; }
.yw-table { border-collapse: separate; border-spacing: 2px; font-size: 11px; }
.yw-theme-head, .yw-theme { text-align: left; font-weight: 500; white-space: nowrap; padding-right: 14px; position: sticky; left: 0; background: #fff; z-index: 1; min-width: 150px; color: var(--ink); font-size: 13px; }
.yw-band { text-align: left; color: var(--brand-light); font-weight: 600; font-size: 11px; border-left: 2px solid var(--brand-soft); padding-left: 4px; }
.yw-week { color: var(--muted); font-weight: 400; text-align: center; min-width: 24px; }
.yw-week.yw-now, .yw-cell.yw-now { background: #fbf1d9; }
.yw-cell { width: 24px; height: 24px; border: 1px solid var(--line); border-radius: 6px; text-align: center; cursor: pointer; background: #fff; }
.yw-cell:hover { border-color: var(--brand-light); }
.yw-auto { font-size: 9px; color: var(--muted); font-weight: 400; margin-left: 4px; }
.yw-planned { display: inline-block; width: 9px; height: 9px; border-radius: 50%; background: #e0a82e; }
.yw-some { display: inline-grid; place-items: center; min-width: 18px; height: 18px; border-radius: 5px; background: #fbf1d9; color: #8a5a14; font-weight: 600; font-size: 11px; }
.yw-all { display: inline-grid; place-items: center; width: 18px; height: 18px; border-radius: 5px; background: var(--tone-ok-soft); color: var(--tone-ok); font-weight: 700; font-size: 12px; }
.yw-box { display: inline-grid; place-items: center; width: 22px; height: 22px; border: 1px solid var(--line); border-radius: 6px; background: #fff; }
.button { white-space: nowrap; }
@media (max-width: 650px) { .yw-theme-head, .yw-theme { min-width: 104px; font-size: 11px; padding-right: 6px; } }

/* Holdbase */
.team-tabs { margin-bottom: 18px; }
.team-tabs > button svg { width: 16px; height: 16px; }
.week-mini-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.week-mini { background: var(--canvas); border: 1px solid var(--line); border-radius: 12px; padding: 14px 16px; }
.week-mini-value { font-size: 16px; font-weight: 500; color: var(--brand); margin: 2px 0 6px; }
.progress { height: 6px; background: #e4e9f2; border-radius: 3px; overflow: hidden; margin: 8px 0 6px; }
.progress > span { display: block; height: 100%; background: var(--gold); border-radius: 3px; }
.week-mini-foot { display: flex; justify-content: space-between; font-size: 12px; color: var(--muted); }
.week-mini-foot a { color: var(--brand-light); cursor: pointer; }
.week-count { font-size: 22px; font-weight: 500; color: var(--gold-dark); }
.declining-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 12px; }
.declining-card { background: var(--canvas); border: 1px solid var(--line); border-radius: 12px; padding: 12px 14px; cursor: pointer; text-decoration: none; color: var(--ink); }
.declining-pct { font-size: 26px; font-weight: 500; color: #b5792c; line-height: 1.1; }
.declining-from { font-size: 12px; color: var(--tone-bad); }
.declining-name { font-size: 14px; margin-top: 6px; }
.scatter { width: 100%; height: auto; }
.sc-label { font-size: 12px; font-weight: 500; } .sc-axis { font-size: 11px; fill: var(--muted); }
.todo-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 14px; }
.todo-card { background: var(--canvas); border: 1px solid var(--line); border-radius: 12px; padding: 14px; display: grid; gap: 4px; align-content: start; }
.todo-head { display: flex; align-items: center; gap: 8px; font-weight: 500; color: var(--brand); margin-bottom: 4px; }
.todo-head svg { width: 16px; height: 16px; } .todo-head .week-count { margin-left: auto; font-size: 18px; }
.todo-name { font-size: 13px; color: var(--ink); cursor: pointer; padding: 2px 0; } .todo-name:hover { color: var(--brand-light); }
.tw-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 16px; }
.tw-grid label { display: grid; gap: 6px; font-size: 11px; font-weight: 500; color: var(--muted); font-family: var(--font-heading); text-transform: uppercase; letter-spacing: .08em; }
.tw-grid textarea { width: 100%; box-sizing: border-box; border: 1px solid var(--line); border-radius: 10px; padding: 9px 11px; font-size: 13px; font-family: inherit; background: #fbfcfe; text-transform: none; letter-spacing: 0; color: var(--ink); resize: vertical; }
.tw-match-head { display: flex; justify-content: space-between; align-items: baseline; margin-top: 4px; }
.tw-score { font-weight: 600; color: var(--brand); }
.tw-days { display: grid; grid-template-columns: repeat(7, minmax(220px, 1fr)); gap: 12px; margin-top: 16px; overflow-x: auto; padding-bottom: 8px; }
.tw-day { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius-card); padding: 12px; box-shadow: var(--shadow-card); display: grid; gap: 10px; align-content: start; }
.tw-day.tw-today { border-color: var(--gold); }
.tw-day-head strong { font-family: var(--font-heading); font-size: 15px; color: var(--brand); }
.tw-item { border-left: 4px solid #8a94a6; background: #fbfcfe; border-radius: 8px; padding: 9px 10px; display: grid; gap: 4px; }
.tw-item-head { display: flex; justify-content: space-between; gap: 8px; align-items: center; }
.timeline { display: grid; gap: 6px; margin: 6px 0; border-left: 2px solid var(--line); padding-left: 10px; }
.tl-part { display: flex; gap: 8px; align-items: flex-start; position: relative; }
.tl-badge { flex: none; width: 20px; height: 20px; margin-left: -21px; border-radius: 50%; background: var(--gold-gradient); color: #fff; font-family: var(--font-heading); font-weight: 700; font-size: 11px; display: grid; place-items: center; }
.tl-body { min-width: 0; flex: 1; }
.tl-row { display: flex; justify-content: space-between; gap: 6px; font-size: 13px; }
.tl-title { overflow: hidden; text-overflow: ellipsis; }
.tl-thumb { display: block; width: 100%; max-width: 150px; border-radius: 6px; margin: 4px 0; border: 1px solid var(--line); }
.button.gold-soft { background: var(--pill-active-bg); border-color: var(--pill-active-bg); color: var(--pill-active-ink); }
.sketch-label { font-size: 13px; font-weight: 600; } .sketch-sub { font-size: 11px; }
.cal-layout { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 16px; align-items: start; }
.cal-table { width: 100%; border-collapse: collapse; table-layout: fixed; }
.cal-table th { font-size: 11px; letter-spacing: .1em; color: var(--muted); font-weight: 500; padding: 8px 4px; }
.cal-week { width: 36px; font-size: 11px; color: var(--muted); vertical-align: top; padding-top: 8px; }
.cal-band td { font-size: 11px; color: var(--brand-light); padding: 6px 4px 2px; }
.cal-day { border: 1px solid var(--line); vertical-align: top; height: 86px; padding: 4px 6px; cursor: pointer; overflow: hidden; background: #fff; }
.cal-day:hover { background: #f5f8ff; } .cal-out { background: #fafbfd; color: #b4c0d3; } .cal-today .cal-num { background: var(--gold-light); border-radius: 50%; width: 22px; height: 22px; display: grid; place-items: center; font-weight: 600; } .cal-selected { outline: 2px solid var(--brand-light); outline-offset: -2px; }
.cal-num { font-size: 12px; margin-bottom: 3px; }
.cal-event { font-size: 11px; border-left: 3px solid #8a94a6; background: #f5f6f9; padding: 1px 4px; margin-bottom: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; border-radius: 3px; }
.cal-side { position: sticky; top: 90px; display: grid; gap: 10px; }
.cal-title { min-width: 130px; text-align: center; font-family: var(--font-heading); }
@media (max-width: 1000px) { .cal-layout { grid-template-columns: 1fr; } .week-mini-grid { grid-template-columns: 1fr; } }
@media print { .sidebar, .topbar, .team-tabs, .cal-side, .header-actions { display: none !important; } }
.button svg { width: 16px; height: 16px; vertical-align: -3px; margin-right: 4px; }
.week-mini-foot a { white-space: nowrap; }

/* Kalender som liste (hold) */
.list-week { margin-bottom: 14px; padding: 6px 16px 10px; }
.list-week-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 10px 0; border-bottom: 1px solid var(--line); color: var(--brand); }
.list-row { display: grid; grid-template-columns: 54px 52px minmax(0, 1fr) 90px 80px; gap: 10px; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--line); }
.list-row:last-child { border-bottom: 0; }
.list-row.list-today { background: #fbf6e6; margin: 0 -8px; padding-left: 8px; padding-right: 8px; border-radius: 8px; }
.list-date { text-align: center; } .list-day { font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); } .list-num { font-size: 18px; font-weight: 500; color: var(--brand); }
.list-time { font-size: 14px; color: var(--muted); } .list-open { text-align: right; }
@media (max-width: 700px) { .list-row { grid-template-columns: 44px minmax(0, 1fr) auto; } .list-time, .list-plan { display: none; } }

/* Kalender-liste: dagsblokke med + og inline formular */
.list-day-block { display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 10px; padding: 8px 0; border-bottom: 1px solid var(--line); }
.list-day-block:last-child { border-bottom: 0; }
.list-day-block.list-today { background: #fbf6e6; margin: 0 -8px; padding-left: 8px; padding-right: 8px; border-radius: 8px; }
.list-day-label { text-align: center; display: grid; gap: 2px; justify-items: center; align-content: start; }
.list-plus { width: 26px; height: 26px; border-radius: 50%; border: 1px solid var(--line); background: #fff; color: var(--brand-light); font-size: 18px; line-height: 1; cursor: pointer; padding: 0; }
.list-plus:hover { background: var(--pill-active-bg); border-color: var(--pill-active-bg); color: var(--brand); }
.list-day-body .list-row { grid-template-columns: 52px minmax(0, 1fr) 90px 80px; border-bottom: 1px dashed var(--line); }
.list-day-body .list-row:last-of-type { border-bottom: 0; }
.list-empty { color: #b4c0d3; font-size: 13px; padding: 8px 0; }
.list-add-form { margin: 8px 0 4px; padding: 14px; background: #f6f9fe; border: 1px solid #c9d8ee; border-radius: 12px; display: grid; gap: 12px; }
.list-add-title { font-family: var(--font-heading); font-weight: 600; color: var(--brand); }
.list-add-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 10px; }
.list-add-grid label { display: grid; gap: 4px; font-size: 11px; font-weight: 500; color: var(--muted); }
.list-add-grid .wide { grid-column: 1 / -1; }
.list-add-grid input[type="text"], .list-add-grid input[type="time"] { border: 1px solid var(--line); border-radius: 8px; padding: 8px 10px; font-size: 13px; background: #fff; font-family: inherit; width: 100%; box-sizing: border-box; }
.list-add-grid select { width: 100%; }
@media (max-width: 700px) { .list-day-block { grid-template-columns: 48px minmax(0, 1fr); } .list-day-body .list-row { grid-template-columns: 44px minmax(0, 1fr) auto; } }

/* Fasevurdering og holdevaluering */
.phase-rate { display: flex; align-items: center; gap: 6px; }
.phase-rate-btn { width: 34px; height: 34px; border-radius: 9px; border: 1px solid var(--line); background: #fff; font-size: 14px; color: var(--muted); cursor: pointer; }
.phase-rate-btn:hover:not(:disabled) { border-color: var(--brand-light); }
.phase-rate-btn.active { color: #fff; font-weight: 600; border-color: transparent; }
.phase-rate-btn.active.tone-green { background: #22a45d; } .phase-rate-btn.active.tone-amber { background: #e0a82e; } .phase-rate-btn.active.tone-red { background: var(--tone-bad); }
.eval-progress { display: grid; gap: 6px; margin-bottom: 8px; }
.eval-prev { color: var(--muted); text-align: center; }
.eval-trend { font-size: 12px; } .eval-trend.up { color: var(--tone-ok); } .eval-trend.down { color: var(--tone-bad); }
.eval-comment { width: 100%; min-width: 180px; box-sizing: border-box; border: 1px solid var(--line); border-radius: 8px; padding: 7px 10px; font-size: 13px; font-family: inherit; background: #fbfcfe; }
.eval-comment:disabled { background: #f3f5f9; }

/* Holdindstillinger */
.train-days { display: grid; grid-template-columns: 140px 110px; gap: 8px 14px; align-items: center; margin-bottom: 8px; }
.train-days input[type="time"] { border: 1px solid var(--line); border-radius: 8px; padding: 7px 9px; font-size: 13px; background: #fff; font-family: inherit; }
#team-settings-form .tw-grid input, #team-settings-form .tw-grid select { border: 1px solid var(--line); border-radius: 8px; padding: 8px 10px; font-size: 13px; background: #fff; font-family: inherit; width: 100%; box-sizing: border-box; text-transform: none; letter-spacing: 0; color: var(--ink); }

.rpe-scale { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.rpe-scale .chip { min-width: 36px; border-width: 2px; cursor: pointer; }

.fd-table td, .fd-table th { vertical-align: top; }
.fd-head { text-align: center; white-space: nowrap; }
.fd-field { min-width: 260px; }
.fd-link { cursor: pointer; font-weight: 600; }
.fd-cell { text-align: center; font-weight: 600; white-space: nowrap; }
.fd-ok { color: #2f9e5b; } .fd-warn { color: #b8860b; } .fd-bad { color: #d64545; } .fd-none { color: var(--muted, #8a93a3); }
.fd-total { border-left: 1px solid rgba(0,0,0,.08); }
.fd-overall { font-size: 28px; font-weight: 700; text-align: right; }

.tp-missing { margin-bottom: 10px; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.tp-obs-add { display: flex; gap: 8px; margin-top: 8px; }
.tp-obs-add select { flex: 0 0 220px; width: 220px; }
.tp-obs-add input { flex: 1 1 160px; width: auto; min-width: 0; }
@media (max-width: 600px) { .tp-obs-add { flex-direction: column; } .tp-obs-add select, .tp-obs-add input { flex: none; width: 100%; } }

.match-event-draft-row select { min-width: 110px; }
.match-event-draft-row .button { white-space: nowrap; }

.tp-logistics { margin-bottom: 12px; }
.tp-status-row { flex-wrap: wrap; }
.tp-status-main { display: flex; align-items: center; justify-content: space-between; gap: 8px; width: 100%; }
.tp-until { display: flex; align-items: center; gap: 6px; font-size: 11px; color: var(--muted, #6b7488); margin: 2px 0 6px; width: 100%; }
.tp-until select { flex: 1; min-width: 0; }
.tp-status-summary { display: flex; flex-wrap: wrap; gap: 14px; margin-bottom: 10px; font-size: 12px; }
.tp-status-summary .dot { display: inline-block; width: 9px; height: 9px; border-radius: 50%; margin-right: 5px; }
.tp-status-summary .dot.ok { background: #2f9e5b; } .tp-status-summary .dot.warn { background: #e0a82e; }
.tp-status-summary .dot.bad { background: #d64545; } .tp-status-summary .dot.guest { background: #6b5bd6; }
.tp-guest-add { margin-bottom: 10px; } .tp-guest-add select { width: 100%; }

.chip.chip-square.code-K { background: #e9d9a0; color: #5a4a10; }
.chip.chip-square.code-T { background: var(--tone-ok-soft); color: var(--tone-ok); }
.chip.chip-square.code-R { background: #dbe8fb; color: #1f4e9c; }
.chip.chip-square.code-H { background: #e6e0fb; color: #4b3bb0; }
.chip.chip-square.code-U { background: #fdf0d5; color: #8a5a00; }
.chip.chip-square.code-S { background: var(--tone-bad-soft); color: var(--tone-bad); }
.chip.chip-square.code-L { background: #fbe0ef; color: #a0206b; }
.chip.chip-square.code-F { background: #e3e6ec; color: #5b6475; }
.fu-legend .chip-square { width: 20px; height: 20px; font-size: 10px; vertical-align: middle; }

/* Periodeplan */
.pp-tabs { display: flex; flex-wrap: wrap; gap: 8px; margin: 4px 0 16px; }
.pp-tab { border: 1px solid var(--line, #e3e6ec); background: #fff; border-radius: 12px; padding: 8px 14px; cursor: pointer; font: inherit; font-size: 13px; display: inline-flex; gap: 6px; align-items: center; }
.pp-tab.active { background: var(--gold-light, #f1dc9d); border-color: transparent; font-weight: 700; }
.pp-tab-ico { font-size: 12px; } .pp-tab.st-done .pp-tab-ico { color: #2f9e5b; } .pp-tab-new { border-style: dashed; color: var(--muted, #6b7488); }
.pp-period-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; flex-wrap: wrap; margin-bottom: 12px; }
.pp-period-head h2 { margin: 0; font-size: 22px; }
.pp-dates { display: flex; gap: 14px; align-items: flex-end; flex-wrap: wrap; }
.pp-dates label, .pp-field { display: flex; flex-direction: column; gap: 4px; font-size: 11px; text-transform: uppercase; letter-spacing: .04em; color: var(--muted, #6b7488); }
.pp-field textarea, .pp-field input { text-transform: none; letter-spacing: 0; font-size: 14px; color: inherit; }
.pp-goal-text { margin-bottom: 16px; }
.pp-domains { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-bottom: 16px; }
.pp-domain-head { display: flex; justify-content: space-between; font-weight: 700; text-transform: uppercase; font-size: 12px; letter-spacing: .05em; margin-bottom: 8px; }
.pp-goal { border: 1px solid var(--line, #e3e6ec); border-radius: 12px; padding: 12px; margin-bottom: 10px; display: flex; flex-direction: column; gap: 6px; background: #fff; }
.pp-goal textarea { width: 100%; font-size: 13px; }
.pp-goal-head { display: flex; justify-content: space-between; align-items: center; }
.pp-label { font-size: 10px; text-transform: uppercase; letter-spacing: .06em; color: var(--muted, #6b7488); }
.pp-link-row { display: flex; gap: 6px; } .pp-link-row select { flex: 1; min-width: 0; }
.pp-trend > div { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 4px; }
.pp-trend-btn { cursor: pointer; border: 1px solid var(--line, #e3e6ec); background: #fff; }
.pp-trend-btn.on.t-Fremgang { background: #d9f0e2; color: #1f7a45; } .pp-trend-btn.on.t-Stabil { background: #fbefc9; color: #8a5a00; } .pp-trend-btn.on.t-Tilbagegang { background: #f9d9d9; color: #a32d2d; }
.pp-add { width: 100%; border: 1px dashed var(--line, #cfd5df); background: transparent; border-radius: 12px; padding: 10px; cursor: pointer; color: var(--muted, #6b7488); }
.pp-reflections { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-bottom: 16px; }
.pp-green textarea { background: #eaf6ee; border-color: #bfe3cd; }
.pp-log-row { display: grid; grid-template-columns: 90px 1fr; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--line, #eef0f4); }
.pp-log-date { color: var(--muted, #6b7488); font-size: 13px; }
.pp-eval-block { margin-bottom: 18px; } .pp-eval-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; gap: 8px; }
.pp-eval-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.pp-rate-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 16px; margin-bottom: 10px; }
.pp-rate-item { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 8px 12px; border: 1px solid var(--line, #eef0f4); border-radius: 10px; background: #fff; }
.pp-rate { display: inline-flex; gap: 6px; }
.pp-sq { width: 26px; height: 26px; border-radius: 7px; border: 0; background: var(--sq-soft); cursor: pointer; padding: 0; }
.pp-sq.on { background: var(--sq); box-shadow: 0 0 0 2px #fff, 0 0 0 3px var(--sq); } .pp-sq:disabled { cursor: default; }
.pp-dot { display: inline-block; width: 10px; height: 10px; border-radius: 50%; vertical-align: middle; }
.pp-avg { font-size: 13px; }
@media (max-width: 900px) { .pp-domains, .pp-reflections, .pp-eval-grid, .pp-rate-grid { grid-template-columns: 1fr; } }

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

.dl-when { white-space: nowrap; font-size: 13px; } .dl-bad { color: var(--tone-bad); } .dl-warn { color: #b8860b; }
#deadlines-card td { vertical-align: middle; }
#deadlines-card td:nth-child(2) { min-width: 220px; }

/* På banen */
.pitch { position: relative; width: 100%; aspect-ratio: 1.7 / 1; min-height: 420px; border: 3px solid #3f5878; border-radius: 6px; background: #f6f8fb; margin-top: 8px; }
.pitch-line.pitch-mid { position: absolute; left: 50%; top: 0; bottom: 0; border-left: 3px solid #3f5878; }
.pitch-circle { position: absolute; left: 50%; top: 50%; width: 17%; aspect-ratio: 1; transform: translate(-50%, -50%); border: 3px solid #3f5878; border-radius: 50%; }
.pitch-box { position: absolute; top: 20%; bottom: 20%; width: 16%; border: 3px solid #3f5878; }
.pitch-box-l { left: 0; border-left: 0; } .pitch-box-r { right: 0; border-right: 0; }
.pitch-six { position: absolute; top: 37%; bottom: 37%; width: 6%; border: 3px solid #3f5878; }
.pitch-six-l { left: 0; border-left: 0; } .pitch-six-r { right: 0; border-right: 0; }
.pitch-slot { position: absolute; transform: translate(-50%, -50%); z-index: 2; text-align: center; max-width: 26%; }
.pitch-slot-label { font-size: 10px; text-transform: uppercase; letter-spacing: .05em; color: #3f5878; margin-bottom: 3px; background: rgba(246,248,251,.85); border-radius: 6px; padding: 0 4px; }
.pitch-slot-pills { display: grid; gap: 3px 4px; justify-content: center; }
.pitch-pill { margin: 0; padding: 3px 9px; font-size: 12px; border-width: 2px; border-radius: 999px; white-space: nowrap; display: block; }
@media (max-width: 700px) { .pitch-wrap { overflow-x: auto; } .pitch { min-width: 720px; } }
.pitch-wrap { width: 100%; }

.xc-sketch { margin-left: auto; margin-right: auto; transition: width .12s ease; }
.xc-size { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; font-size: 12px; }
.xc-size input[type=range] { flex: 1 1 140px; }
.xc-size-presets { display: inline-flex; gap: 10px; }

.xc-fieldsize { display: grid; gap: 6px; }
.xc-fieldsize-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.xc-fieldsize-row input { width: 90px; }

/* Redigerbare aktivitetsrækker */
.list-day-body .list-row.list-row-edit { grid-template-columns: 112px minmax(0, 1fr) 90px 70px; align-items: start; }
.tc-time { display: flex; flex-direction: column; gap: 6px; }
.tc-time input[type=time] { width: 104px; }
.tc-dur { display: flex; align-items: center; gap: 4px; font-size: 12px; color: var(--muted, #6b7488); } .tc-dur input { width: 64px; }
.tc-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 8px; }
.tc-type { border: 2px solid; border-radius: 999px; padding: 4px 10px; font-weight: 600; background: #fff; }
.tc-selects { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px 10px; align-items: end; }
.tc-sel { display: flex; flex-direction: column; gap: 3px; font-size: 10px; text-transform: uppercase; letter-spacing: .05em; color: var(--muted, #6b7488); }
.tc-sel select { text-transform: none; letter-spacing: 0; font-size: 13px; color: inherit; }
.tc-more { justify-self: start; }
.tc-details { margin-top: 10px; display: grid; gap: 6px; }
.tc-label { font-size: 10px; text-transform: uppercase; letter-spacing: .05em; color: var(--muted, #6b7488); }
.tc-chips { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.tc-chip { display: inline-flex; gap: 6px; align-items: center; } .tc-x { border: 0; background: transparent; cursor: pointer; font-size: 15px; line-height: 1; padding: 0 2px; }
.tc-add { max-width: 220px; } .tc-upload { cursor: pointer; }
@media (max-width: 700px) { .list-day-body .list-row.list-row-edit { grid-template-columns: minmax(0, 1fr); } .list-row-edit .list-time, .list-row-edit .list-plan { display: flex !important; } }

.tc-week-edit { display: grid; gap: 8px; margin: 8px 0; } .tc-week-time { display: flex; }
.tc-week-time .tc-time { flex-direction: row; align-items: center; min-width: 0; gap: 8px; }
.tc-week-edit .tc-selects { grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); }

/* Ugeplan: alt indhold skal blive inde i dagkortet */
.tw-days { grid-template-columns: repeat(7, minmax(260px, 1fr)); }
.tw-day, .tw-item, .tc-week-edit, .tc-week-edit .tc-selects, .tc-week-edit .tc-sel { min-width: 0; }
.tw-item { overflow: hidden; }
.tc-week-edit .tc-selects { grid-template-columns: repeat(auto-fill, minmax(112px, 1fr)); }
.tc-week-edit select, .tc-week-edit input { width: 100%; min-width: 0; max-width: 100%; box-sizing: border-box; }
.tc-week-edit .tc-time { flex-wrap: wrap; width: 100%; }
.tc-week-edit .tc-time input[type=time] { flex: 1 1 100px; width: auto; }
.tc-week-edit .tc-dur { flex: 1 1 90px; } .tc-week-edit .tc-dur input { width: 100%; }
.tc-week-time { width: 100%; }

.train-days-table input[type=time], .train-days-table input[type=number] { width: 110px; } .train-days-table select { min-width: 130px; }
.train-days-table tr.td-off td:not(:first-child) { opacity: .5; }

#auth-screen { min-height: 100vh; display: grid; place-items: center; padding: 20px; background: #0a2240; }
.auth-card { background: #fff; border-radius: 12px; padding: 28px; max-width: 420px; width: 100%; }
.auth-card h1 { margin: 0 0 12px; font-size: 24px; }
.inline-form { display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-end; }
.inline-form label { display: grid; gap: 4px; font-size: 13px; }

.survey-q { margin: 14px 0; display: grid; gap: 6px; }
.survey-q textarea { width: 100%; }
.survey-scale { display: flex; gap: 8px; flex-wrap: wrap; }
.survey-scale label { cursor: pointer; }
.survey-scale input { position: absolute; opacity: 0; }
.survey-scale span { display: inline-block; min-width: 44px; text-align: center; padding: 10px 14px; border: 1px solid #c8d0dc; border-radius: 10px; background: #fff; }
.survey-scale input:checked + span { background: #0a2240; color: #fff; border-color: #0a2240; }
.survey-scale input:focus-visible + span { outline: 2px solid #c9a24a; }
.survey-q-edit { display: flex; gap: 8px; margin: 8px 0; }
.survey-q-edit .sq-text { flex: 1; }

.mo-row { display: grid; grid-template-columns: 110px 1fr 160px; gap: 12px; align-items: center; margin: 8px 0; }
.mo-name { font-weight: 600; }
.mo-bar { display: flex; height: 26px; border-radius: 8px; overflow: hidden; background: #e7ebf1; gap: 2px; }
.mo-seg { display: grid; place-items: center; color: #fff; font-size: 12px; font-weight: 600; min-width: 22px; }
.mo-seg.ok, .mo-dot.ok { background: #2f9e5b; }
.mo-seg.sick, .mo-dot.sick { background: #d9a21b; }
.mo-seg.out, .mo-dot.out { background: #d64545; }
.mo-meta { font-size: 13px; color: var(--muted); }
.mo-legend { margin-bottom: 8px; }
.mo-dot { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin: 0 4px 0 12px; }
@media (max-width: 640px) { .mo-row { grid-template-columns: 1fr; gap: 4px; } }

.eval-avg { text-align: center; white-space: nowrap; }

/* Vinderspil: podie med top 3 + liste */
.wb-podium { display: grid; grid-template-columns: 1fr 1.15fr 1fr; gap: 10px; align-items: end; margin: 8px 0 18px; }
.wb-pod { display: grid; justify-items: center; gap: 4px; text-align: center; padding: 10px 6px 12px; border-radius: 16px; background: #f4f6fa; position: relative; }
.wb-pod-1 { background: #fbf3df; padding-top: 22px; padding-bottom: 18px; }
.wb-empty { background: none; }
.wb-ring { position: relative; width: 62px; height: 62px; border-radius: 50%; display: grid; place-items: center; font-weight: 700; background: #fff; border: 3px solid var(--rc, #4a90d9); color: var(--rc, #4a90d9); }
.wb-pod-1 .wb-ring { width: 76px; height: 76px; --rc: #e0a82e; font-size: 20px; }
.wb-pod-2 { --rc: #4a90d9; }
.wb-pod-3 { --rc: #2f9e5b; }
.wb-badge { position: absolute; bottom: -9px; left: 50%; transform: translateX(-50%); width: 22px; height: 22px; background: var(--rc, #4a90d9); color: #fff; display: grid; place-items: center; border-radius: 50%; border: 2px solid #fff; font-style: normal; font-size: 11px; font-weight: 800; }
.wb-badge { writing-mode: horizontal-tb; }
.wb-crown { position: absolute; top: -2px; font-size: 22px; color: #e0a82e; line-height: 1; }
.wb-name { font-weight: 600; margin-top: 8px; word-break: break-word; }
.wb-main { font-size: 22px; font-weight: 800; color: var(--rc, #4a90d9); }
.wb-sub { font-size: 12px; color: var(--muted); }
.wb-row { display: grid; grid-template-columns: 30px 36px 1fr auto auto; gap: 10px; align-items: center; padding: 8px 2px; border-top: 1px solid var(--line); }
.wb-row-sub { font-size: 12px; color: var(--muted); }
@media (max-width: 640px) { .wb-row { grid-template-columns: 26px 32px 1fr auto; } .wb-row-sub { display: none; } }

.wb-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: stretch; }
.wb { display: flex; flex-direction: column; min-width: 0; }
.wb-podium { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.wb-list { height: 360px; overflow-y: auto; }
@media (max-width: 800px) { .wb-grid { grid-template-columns: minmax(0, 1fr); } }

.scope-toggle button { white-space: nowrap; }

/* Kalenderliste: kompakte rækker på én linje + datoflise */
.date-tile { width: 50px; border-radius: 12px; overflow: hidden; background: #fff; border: 1px solid var(--line); box-shadow: 0 1px 2px rgba(10, 34, 64, .08); text-align: center; }
.date-tile .list-day { background: var(--brand, #0a2240); color: #fff; font-size: 10px; font-weight: 700; letter-spacing: .1em; padding: 3px 0; }
.date-tile-weekend .list-day { background: #8a94a6; }
.date-tile .list-num { font-size: 22px; font-weight: 800; line-height: 1.1; padding: 4px 0 0; color: var(--brand, #0a2240); }
.date-tile .list-mon { font-size: 10px; text-transform: uppercase; letter-spacing: .08em; color: var(--muted); padding-bottom: 4px; }
.list-day-block.list-today .date-tile { border-color: #c9a24a; box-shadow: 0 0 0 2px #f1dfa6; }
.list-day-block.list-today .date-tile .list-day { background: #c9a24a; color: #0a2240; }
.list-day-block { align-items: start; padding: 6px 0; }
.list-day-body .list-row { padding: 6px 0; }
.list-day-body .list-row.list-row-edit { grid-template-columns: 150px minmax(0, 1fr) 84px 56px; align-items: center; }
.list-row-edit .tc-time { flex-direction: row; align-items: center; gap: 6px; }
.list-row-edit .tc-time input[type=time] { width: 92px; }
.list-row-edit .tc-dur input { width: 54px; }
.list-row-edit .list-main { display: flex; align-items: center; gap: 10px 14px; flex-wrap: wrap; }
.list-row-edit .tc-head { margin: 0; flex: 0 0 auto; flex-wrap: nowrap; }
.list-row-edit .tc-head strong { white-space: nowrap; }
.list-row-edit .tc-selects { flex: 1 1 360px; grid-template-columns: repeat(auto-fit, minmax(105px, 1fr)); gap: 6px 8px; }
.list-row-edit .tc-sel { font-size: 9px; }
.list-row-edit .tc-sel select { padding: 5px 6px; font-size: 12px; }
.list-row-edit .tc-details { flex: 1 1 100%; margin-top: 2px; }
@media (max-width: 760px) { .list-day-body .list-row.list-row-edit { grid-template-columns: 1fr; } }
.list-day-body .list-row:has(.tc-time) { grid-template-columns: 150px minmax(0, 1fr) 84px 56px; align-items: center; }
.list-day-body .tc-time { flex-direction: row; align-items: center; gap: 6px; }
.list-day-body .tc-time input[type=time] { width: 92px; }
.list-row-edit .tc-selects { grid-template-columns: repeat(auto-fill, minmax(108px, 150px)); }
.list-row-edit .tc-selects .tc-more { align-self: end; white-space: nowrap; }
.list-day-body .tc-head { margin-bottom: 0; flex-wrap: nowrap; }
.list-row-edit .tc-selects { grid-template-columns: repeat(auto-fill, minmax(92px, 128px)); }
.list-row-edit .tc-selects .tc-more { font-size: 11px; }

/* Kalenderliste: alt på én linje (tid | type | fysisk | fase | hovedprincip | mødetid | bane | indgang) */
.list-row-edit .list-main { flex-wrap: wrap; }
.list-row-edit .tc-selects { flex: 1 1 760px; min-width: 0; grid-template-columns: 78px minmax(110px, 140px) minmax(130px, 170px) 84px minmax(100px, 130px) minmax(170px, 1fr) auto; gap: 6px 8px; }
.list-row-edit .tc-sel input { font-size: 12px; padding: 5px 6px; width: 100%; box-sizing: border-box; min-width: 0; border: 1px solid var(--line); border-radius: 8px; background: #fff; font-family: inherit; }
.list-row-edit .tc-sel select, .list-row-edit .tc-sel input { height: 30px; }
.list-row-edit .tc-selects .tc-more { align-self: end; white-space: nowrap; font-size: 11px; padding-bottom: 6px; }
.list-row-edit .list-main { flex-wrap: nowrap; align-items: flex-end; }
.list-row-edit .tc-head { align-self: flex-end; height: 30px; }
.list-row-edit .tc-selects { flex: 1 1 0; grid-template-columns: 78px minmax(110px, 140px) minmax(130px, 170px) 84px minmax(100px, 130px) minmax(170px, 1fr); grid-template-rows: auto; grid-auto-flow: column; grid-auto-columns: minmax(100px, 140px); }
.list-row-edit .list-main { flex-wrap: wrap; }
.list-row-edit .tc-selects { flex: 1 1 640px; }
.list-row-edit .tc-details { flex: 1 1 100%; }

.list-row-edit .tc-selects { grid-template-columns: 70px minmax(100px, 130px) minmax(120px, 150px) 78px minmax(90px, 110px) minmax(110px, 1fr); grid-auto-columns: minmax(88px, 120px); gap: 6px; }
.list-row-edit .tc-selects .tc-more { padding: 0 0 6px 2px; }

.list-day-body .list-row:has(.tc-time), .list-day-body .list-row.list-row-edit { grid-template-columns: 138px minmax(0, 1fr) 80px 52px; }
.list-row-edit .tc-selects { grid-template-columns: 68px minmax(96px, 120px) minmax(110px, 140px) 76px minmax(84px, 100px) minmax(150px, 1fr); }

/* Spillervælger (individuel træning) */
.pick-modal { width: min(460px, 94vw); }
.pick-search { width: 100%; box-sizing: border-box; padding: 9px 12px; border: 1px solid var(--line); border-radius: 10px; font-size: 14px; margin: 6px 0 10px; }
.pick-list { max-height: 340px; overflow-y: auto; border: 1px solid var(--line); border-radius: 12px; }
.pick-item { display: grid; grid-template-columns: 22px 1fr auto; gap: 10px; align-items: center; padding: 9px 12px; border-bottom: 1px solid var(--line); cursor: pointer; }
.pick-item:last-child { border-bottom: 0; }
.pick-item:hover { background: #f4f6fa; }
.pick-item[hidden] { display: none; }
.pick-foot { display: flex; justify-content: space-between; align-items: center; margin-top: 12px; }
/* Kalenderliste: hovedkolonne som grid så "Spillere/Træningsprogram" ligger på egen linje under rækken */
.list-row-edit .list-main { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 6px 12px; align-items: end; flex-wrap: nowrap; }
.list-row-edit .tc-selects { flex: none; min-width: 0; }
.list-row-edit .tc-details { grid-column: 1 / -1; flex: none; }

/* Kalenderliste v3: kompakt hovedlinje; sekundær fase på egen linje */
.list-day-body .list-row:has(.tc-time), .list-day-body .list-row.list-row-edit { grid-template-columns: 132px minmax(0, 1fr) 78px 48px; }
.list-row-edit .list-main { grid-template-columns: max-content minmax(0, 1fr); }
.list-row-edit .tc-selects:not(.tc-secondary-row) { grid-template-columns: 62px minmax(80px, 1fr) minmax(90px, 1.3fr) 76px minmax(76px, 1fr) minmax(110px, 1.6fr) auto; grid-auto-flow: row; grid-auto-columns: auto; }
.list-row-edit .tc-secondary-row { grid-column: 1 / -1; grid-template-columns: repeat(2, minmax(150px, 220px)); grid-auto-flow: row; justify-content: start; }
.list-row-edit .tc-sel select, .list-row-edit .tc-sel input { min-width: 0; text-overflow: ellipsis; }
.list-row-edit .tc-sel span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.list-row-edit .tc-selects .tc-more { padding: 0 0 6px 2px; white-space: nowrap; }
.list-row-edit .tc-head select.tc-type { padding: 4px 8px; font-size: 13px; }
.list-row-edit .tc-time input[type=time] { width: 88px; }
.list-row-edit .tc-dur input { width: 46px; }
.list-row-edit .tc-dur span { display: none; }
.list-row-edit .tc-time { gap: 4px; }

/* Kalenderliste v4: fast kolonnerækkefølge — Tid | Mødetid | Bane | Type | Fysisk | Fase | Hovedprincip | Sek. fase | Sek. hovedprincip | Indgang */
:root { --lc: 126px 86px minmax(86px, 1fr) 112px 62px minmax(92px, 1.1fr) minmax(104px, 1.4fr) minmax(92px, 1.1fr) minmax(104px, 1.4fr) minmax(112px, 1.8fr) 74px 46px; }
.list-cols { display: grid; grid-template-columns: var(--lc); gap: 6px; padding: 8px 0 2px 74px; font-size: 10px; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); border-bottom: 1px solid var(--line); }
.list-day-body .list-row.list-row-edit { display: grid; grid-template-columns: var(--lc); gap: 6px; align-items: center; }
.list-row-edit .list-main, .list-row-edit .tc-selects { display: contents; }
.list-row-edit .tc-sel > span { display: none; }
.list-row-edit .list-time { order: 1; }
.list-row-edit .tc-c-meeting_time { order: 2; }
.list-row-edit .tc-c-location_id { order: 3; }
.list-row-edit .tc-head { order: 4; margin: 0; }
.list-row-edit .tc-c-physical_label { order: 5; }
.list-row-edit .tc-c-phase { order: 6; }
.list-row-edit .tc-c-main_principle { order: 7; }
.list-row-edit .tc-c-secondary_phase { order: 8; }
.list-row-edit .tc-c-secondary_main_principle { order: 9; }
.list-row-edit .tc-c-indgang_note { order: 10; }
.list-row-edit .list-plan { order: 11; }
.list-row-edit .list-open { order: 12; }
.list-row-edit .tc-details { order: 20; grid-column: 1 / -1; padding-left: 130px; }
.list-row-edit .tc-head strong { display: none; }
.list-row-edit .tc-head select.tc-type { width: 100%; padding: 4px 6px; font-size: 12px; }
.list-row-edit .tc-sel select, .list-row-edit .tc-sel input { width: 100%; min-width: 0; height: 30px; font-size: 12px; padding: 4px 6px; box-sizing: border-box; text-overflow: ellipsis; }
.list-row-edit .tc-time { gap: 4px; }
.list-row-edit .tc-time input[type=time] { width: 80px; }
.list-row-edit .tc-dur input { width: 42px; }

/* "+": ny linje i samme kolonner som rækkerne */
.list-add-row { background: #f6f9fe; border: 1px dashed #b9cbe6; border-radius: 10px; padding: 6px !important; margin: 4px 0; }
.list-add-row .list-time input, .list-add-row .tc-sel input, .list-add-row .tc-sel select, .list-add-row .tc-type { height: 30px; }
.list-add-row .tc-sel input[type=time], .list-add-row .tc-time input[type=time] { width: 100%; }
.list-add-extra { order: 20; grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 8px 14px; align-items: center; padding-left: 4px; }
.list-add-extra .form-fieldset { display: flex; flex-wrap: wrap; gap: 4px 12px; }
.add-extra-field { display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--muted); }
.add-extra-field input, .add-extra-field select { height: 30px; }
:root { --lc: 96px 86px minmax(86px, 1fr) 112px 62px minmax(92px, 1.1fr) minmax(104px, 1.4fr) minmax(92px, 1.1fr) minmax(104px, 1.4fr) minmax(112px, 1.8fr) 74px 46px; }
.list-row-edit .tc-details { padding-left: 100px; }

/* Kalenderliste v5: komprimeret, så rækken passer i ca. 800 px (uden at flyde ud) */
:root { --lc: 60px 60px minmax(60px, 1fr) 84px 50px minmax(52px, .8fr) minmax(74px, 1.3fr) minmax(52px, .8fr) minmax(74px, 1.3fr) minmax(74px, 1.8fr) 64px 32px; }
.list-day-block { grid-template-columns: 54px minmax(0, 1fr); gap: 8px; }
.list-cols { padding-left: 62px; gap: 4px; font-size: 9px; letter-spacing: .04em; }
.list-day-body .list-row.list-row-edit { gap: 4px; padding: 3px 0; min-width: 0; }
.list-row-edit > * { min-width: 0; }
.date-tile { width: 44px; border-radius: 10px; }
.date-tile .list-num { font-size: 18px; padding-top: 2px; }
.date-tile .list-day { font-size: 9px; padding: 2px 0; }
.date-tile .list-mon { font-size: 9px; padding-bottom: 2px; }
.list-plus { width: 22px; height: 22px; font-size: 15px; }
.list-row-edit .tc-sel select, .list-row-edit .tc-sel input, .list-row-edit .tc-time input[type=time], .list-add-row .list-time input, .list-add-row .tc-sel input, .list-add-row .tc-sel select {
  height: 26px; font-size: 11.5px; padding: 2px 4px; border-radius: 7px; width: 100%; min-width: 0; box-sizing: border-box; }
.list-row-edit input[type=time]::-webkit-calendar-picker-indicator { display: none; }
.list-row-edit input[type=time] { text-align: center; }
.list-row-edit .tc-head select.tc-type, .list-add-row .tc-type { height: 26px; font-size: 11.5px; padding: 1px 6px; border-width: 1.5px; width: 100%; }
.list-row-edit .list-plan .chip { font-size: 10.5px; padding: 3px 7px; white-space: nowrap; }
.list-row-edit .list-open .link-button { font-size: 11px; padding: 0; }
.list-row-edit .list-plan .button { height: 26px; padding: 0 8px; font-size: 11.5px; }
.list-add-row { padding: 4px !important; }
.list-add-extra { font-size: 12px; padding-left: 2px; }
.list-row-edit .tc-details { padding-left: 66px; }
.list-week { padding: 4px 12px 8px; }

/* Faste kolonner (eksplicit), så rækker uden nogle felter (Møde/Andet/Kamp/Fri) stadig flugter */
.list-row-edit .list-time { grid-column: 1; }
.list-row-edit .tc-c-meeting_time { grid-column: 2; }
.list-row-edit .tc-c-location_id { grid-column: 3; }
.list-row-edit .tc-head { grid-column: 4; }
.list-row-edit .tc-c-physical_label { grid-column: 5; }
.list-row-edit .tc-c-phase { grid-column: 6; }
.list-row-edit .tc-c-main_principle { grid-column: 7; }
.list-row-edit .tc-c-secondary_phase { grid-column: 8; }
.list-row-edit .tc-c-secondary_main_principle { grid-column: 9; }
.list-row-edit .tc-c-indgang_note { grid-column: 10; }
.list-row-edit .list-plan { grid-column: 11; }
.list-row-edit .list-open { grid-column: 12; }
.list-row-edit .tc-c-ha { order: 5; grid-column: 5 / 7; }
.list-row-edit .tc-c-opp { order: 7; grid-column: 7 / 10; }
.list-row-edit .tc-c-title { order: 5; grid-column: 5 / 10; }
/* Tid og Mødetid ens: samme ramme, højde og skrift */
.list-row-edit .tc-time input[type=time], .list-add-row .tc-time input[type=time], .list-row-edit .tc-c-meeting_time input, .list-add-row .tc-c-meeting_time input {
  border: 1px solid var(--line); background: #fff; border-radius: 7px; height: 26px; font: inherit; font-size: 11.5px; padding: 2px 4px; width: 100%; box-sizing: border-box; text-align: center; color: inherit; }
.list-row-edit .tc-time { width: 100%; }

/* Fysisk (MD-dag) i farver, som i Excel-arket */
select[data-md] { font-weight: 600; }
select[data-md="MD-4"] { background-color: #0070c0; color: #fff; border-color: #0070c0; }
select[data-md="MD-3"] { background-color: #00b050; color: #fff; border-color: #00b050; }
select[data-md="MD-2"] { background-color: #ffe866; color: #3a3000; border-color: #e6c800; }
select[data-md="MD-1"] { background-color: #a6a6a6; color: #fff; border-color: #a6a6a6; }
select[data-md="MD"] { background-color: #6b1520; color: #fff; border-color: #6b1520; }
select[data-md="MD+1"] { background-color: #f4a261; color: #3a1a00; border-color: #e08a3c; }
select[data-md="MD+2"] { background-color: #b4a7d6; color: #2a1f4d; border-color: #9b8cc4; }
/* To tidspunkter lidt mindre, Fysisk lidt større */
:root { --lc: 52px 52px minmax(60px, 1fr) 84px 64px minmax(52px, .8fr) minmax(74px, 1.3fr) minmax(52px, .8fr) minmax(74px, 1.3fr) minmax(74px, 1.8fr) 64px 32px; }
.list-row-edit .tc-time input[type=time], .list-add-row .tc-time input[type=time], .list-row-edit .tc-c-meeting_time input, .list-add-row .tc-c-meeting_time input { font-size: 11px; padding: 2px 1px; }
.list-cols { padding-left: 62px; }

.list-add-line { display: grid; grid-template-columns: var(--lc); padding: 0 0 2px; }
.list-add-line .list-plus { grid-column: 1; justify-self: center; }
.list-day-label .date-tile { margin: 0 auto; }
.date-tile .list-num { font-size: 16px; line-height: 1; padding-top: 1px; }
.date-tile .list-mon { line-height: 1; padding: 0 0 2px; }
.date-tile .list-day { padding: 1px 0; line-height: 1.3; }
.list-add-line { padding: 0; }
.list-add-line .list-plus { width: 20px; height: 20px; font-size: 14px; line-height: 1; }
.list-day-block { padding: 4px 0; }

.pick-filters { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 6px 0 4px; }
.pick-filters .pick-search { grid-column: 1 / -1; margin: 0; }
.pick-filters select { padding: 8px 10px; border: 1px solid var(--line); border-radius: 10px; font-size: 14px; background: #fff; }
.pick-tools { display: flex; gap: 14px; margin: 4px 2px 6px; font-size: 12px; }
.pick-modal { width: min(560px, 94vw); }
.pick-item { grid-template-columns: 22px 1fr auto; }
.pick-locked { opacity: .55; }

.eval-player { display: flex; align-items: center; gap: 10px; white-space: nowrap; }
.eval-player .avatar { width: 30px; height: 30px; font-size: 11px; flex: none; }

/* Holdets faner: Dashboard som lang bjælke, resten samlet under */
.team-tabs-wrap { display: grid; gap: 8px; margin-bottom: 18px; }
.team-dash-bar { display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; padding: 12px 18px; border-radius: 14px; border: 1px solid var(--line); background: #fff; color: var(--muted); font: inherit; font-weight: 600; font-size: 15px; cursor: pointer; box-shadow: 0 1px 2px rgba(10, 34, 64, .06); }
.team-dash-bar svg { width: 18px; height: 18px; }
.team-dash-bar:hover { border-color: var(--brand-light); }
.team-dash-bar.active { background: var(--pill-active-bg, #e2cf93); color: var(--brand, #0a2240); border-color: transparent; }
.team-tabs-wrap .team-tabs { margin: 0; flex-wrap: nowrap; overflow-x: auto; justify-content: space-between; }
.team-tabs-wrap .team-tabs > button { white-space: nowrap; }

.avatar-photo { padding: 0; overflow: hidden; background: #dfe7f3; }
.avatar-photo img { width: 100%; height: 100%; object-fit: cover; display: block; border-radius: 50%; }
.wb-ring { overflow: visible; }
.wb-ring img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; display: block; }

.train-days-table .ts-add { font-size: 11px; margin-left: 8px; white-space: nowrap; }
.train-days-table tr.ts-extra td { border-top: 1px dashed var(--line); }

/* Spillerprofil: nøgle/værdi-lister i samme stil som holdets Indstillinger + ens sektionsoverskrifter */
.kv-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 24px; padding: 4px 2px 6px; }
.kv-grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.kv-stack { display: grid; gap: 14px; padding: 4px 2px 6px; }
.kv { display: grid; gap: 3px; min-width: 0; }
.kv-k { font-size: 10px; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); font-weight: 600; }
.kv-v { font-size: 14px; color: var(--brand, #0a2240); line-height: 1.45; word-break: break-word; }
.kv-wide .kv-v { font-size: 13.5px; color: #33425c; }
.kv-empty { color: #b4c0d3; }
.kv-edit { font-size: 12px; }
.card-heading .kv-edit { margin-left: auto; }
.kv-table th { font-size: 10px; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); font-weight: 600; }
.kv-table td { font-size: 13.5px; padding-top: 9px; padding-bottom: 9px; }
.kv-table td .link-button { font-size: 11px; margin-left: 6px; opacity: .8; }
.pd-section { margin: 22px 0 8px; }
.player-tabs-wrap { align-content: start; }
@media (max-width: 760px) { .kv-grid, .kv-grid-3 { grid-template-columns: 1fr; } }
.player-tabs-wrap .team-tabs-rest { flex-wrap: wrap; justify-content: flex-start; }
.player-tabs-wrap .team-tabs-rest > button { padding: 8px 12px; font-size: 13px; }

/* Hjem */
.home-hero { text-align: center; padding: 26px 0 22px; display: grid; justify-items: center; gap: 10px; }
.home-logo { width: 74px; height: auto; }
.home-kicker { letter-spacing: .32em; font-size: 12px; color: var(--muted); font-weight: 600; }
.home-slogan { width: min(640px, 88%); height: auto; margin-top: 2px; }
.home-welcome { margin: 4px 0 0; color: var(--muted); font-size: 15px; }
.home-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; max-width: 1100px; margin: 0 auto; }
.home-grid > .home-bday { grid-column: 1 / -1; background: linear-gradient(120deg, #fff7de, #fff); border-color: #ecd58a; }
.home-bday-row { display: flex; align-items: center; gap: 14px; padding: 6px 4px; }
.home-cake { font-size: 34px; line-height: 1; }
.home-links { display: flex; flex-wrap: wrap; gap: 10px; padding: 4px 0; }
@media (max-width: 820px) { .home-grid { grid-template-columns: 1fr; } }

tr.player-row-click { cursor: pointer; }
tr.player-row-click:hover td { background: #f6f9fe; }

.home-kicker { font-family: "Kanit", sans-serif; font-weight: 500; letter-spacing: .34em; font-size: 13px; text-transform: none; }
.home-grid { margin-bottom: 22px; }

.home-slogan { width: min(420px, 64%); }
.home-hero { padding: 18px 0 14px; gap: 8px; }
.home-grid { grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); }
.fu-gaps { font-size: 12px; line-height: 1.35; color: #44506a; min-width: 200px; }
.fu-gaps div + div { margin-top: 2px; }

.phase-rate { display: inline-flex; align-items: center; gap: 8px; }

.tw-item-head .tw-type { padding: 3px 8px; font-size: 12px; border-width: 1.5px; border-radius: 999px; background: #fff; max-width: 120px; }

.tl-edit { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; align-items: center; margin: 3px 0; }
.tl-title-input { width: 100%; min-width: 0; box-sizing: border-box; border: 1px solid transparent; border-radius: 7px; padding: 4px 6px; font: inherit; font-size: 13px; background: transparent; color: inherit; }
.tl-title-input:hover, .tl-title-input:focus { border-color: var(--line); background: #fff; }
.tl-dur { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; color: var(--muted); }
.tl-dur input { width: 52px; border: 1px solid transparent; border-radius: 7px; padding: 4px 4px; font: inherit; font-size: 12.5px; text-align: right; background: transparent; }
.tl-dur input:hover, .tl-dur input:focus { border-color: var(--line); background: #fff; }
.tl-template .tl-badge { opacity: .55; }
.tpl-label { font-size: 11px; text-transform: uppercase; letter-spacing: .06em; margin: 8px 0 2px; }

/* Del 1–5 (delvis deltagelse) = orange */
:root { --orange: #c2610c; --orange-soft: #ffe6cc; }
.availability-cell.tone-orange { background: var(--orange-soft); color: var(--orange); border-color: transparent; }
.badge.orange { background: var(--orange-soft); color: var(--orange); }
.stat-card.tone-orange { background: var(--orange-soft); border-color: var(--orange); }

.tp-status-main { display: flex; align-items: center; gap: 8px; flex-wrap: nowrap; }
.tp-status-main > span:first-child { flex: 1 1 auto; min-width: 0; }
.tp-until-inline { display: inline-flex; align-items: center; gap: 4px; font-size: 11px; color: var(--muted); white-space: nowrap; }
.tp-until-inline .tp-until-select { width: 118px; font-size: 10.5px; }
.tp-until-inline .tp-until-select { width: 104px; }
.tp-status-main .badge { white-space: nowrap; }

.tp-chips { display: inline-flex; align-items: center; gap: 6px; flex: none; }
.tp-chips .availability-cell, .tp-chips .badge { width: 88px; text-align: center; box-sizing: border-box; }
.tp-chips .badge { display: inline-block; padding: 7px 4px; border-radius: 6px; font-size: 11px; font-weight: 700; }
.tp-status-main > span:first-child { flex: 1 1 auto; min-width: 0; }

/* Spillerstatus: tre kolonner, ens brikker (96×30) */
.tp-status-grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.tp-trainer-status-grid { grid-template-columns: 1fr; }
.tp-trainer-status-grid > div { display: flex; flex-wrap: wrap; gap: 4px 28px; }
.tp-trainer-status-grid .tp-status-row { min-width: 260px; flex: 0 1 300px; }
.tp-chips { gap: 6px; }
.tp-status-main .availability-cell, .tp-chips .availability-cell { width: 96px; height: 30px; padding: 0 4px; font-size: 11px; font-weight: 700; border-radius: 6px; text-align: center; text-align-last: center; box-sizing: border-box; }
@media (max-width: 1100px) { .tp-status-grid-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 720px) { .tp-status-grid-3 { grid-template-columns: 1fr; } }

/* Positioner: lille fodboldbane */
.pos-pitch { width: 100%; max-width: 880px; height: auto; display: block; margin: 6px auto 10px; border-radius: 12px; background: #fff; }
.pp-zone { background: rgba(255, 255, 255, .92); border: 1px solid #cfd8e6; border-radius: 8px; padding: 3px 6px 4px; font-family: inherit; box-shadow: 0 1px 2px rgba(10, 34, 64, .08); overflow: hidden; }
.pp-zone-label { font-size: 8.5px; letter-spacing: .06em; text-transform: uppercase; color: #6f7f99; font-weight: 700; line-height: 12px; }
.pp-zone-name { font-size: 10.5px; line-height: 13px; color: #0a2240; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pp-zone-empty { opacity: .6; }

/* Positionsbane: markant mindre */
.pos-pitch { max-width: 300px; margin: 4px 0 6px; }
.pp-zone { padding: 3px 7px 4px; border-radius: 10px; }
.pp-zone-label { font-size: 11px; line-height: 15px; }
.pp-zone-name { font-size: 14.5px; line-height: 17px; }
/* Træningsplan: Indgang + Overordnet plan side om side */
.tp-top-row { display: grid; grid-template-columns: minmax(260px, 1fr) minmax(0, 1.6fr); gap: 16px; align-items: start; }
.tp-entry-card label { display: grid; gap: 4px; font-size: 11px; color: var(--muted); margin-top: 8px; }
.tp-entry-card select, .tp-entry-card input[type=text] { width: 100%; box-sizing: border-box; padding: 7px 8px; border: 1px solid var(--line); border-radius: 8px; font: inherit; font-size: 13px; background: #fff; }
.entry-topic { display: grid; gap: 4px; }
.tp-schedule th { font-size: 10px; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.tp-schedule td { padding: 3px 4px; }
.tp-schedule input { box-sizing: border-box; border: 1px solid transparent; border-radius: 6px; padding: 3px 5px; font: inherit; font-size: 12.5px; background: transparent; }
.tp-schedule input:hover, .tp-schedule input:focus { border-color: var(--line); background: #fff; }
.tp-schedule input[type=time] { width: 78px; }
.tp-sched-title { width: 100%; min-width: 120px; }
.tp-sched-min { width: 52px; text-align: right; }
.tp-sched-parallel td:first-child { border-left: 3px solid #c9a24a; }
.tp-sched-total { text-align: right; padding: 4px 6px 0; }
@media (max-width: 1000px) { .tp-top-row { grid-template-columns: 1fr; } }
/* Baneoversigt */
.tp-pitch-wrap { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(260px, 1fr); gap: 16px; align-items: start; }
.tp-pitch-svg { width: 100%; height: auto; border-radius: 10px; background: #fff; touch-action: none; }
.pitch-list { display: grid; gap: 6px; }
.pitch-row { display: flex; align-items: center; gap: 6px; font-size: 12px; }
.pitch-dot { width: 10px; height: 10px; border-radius: 3px; flex: none; }
.pitch-name { flex: 1 1 auto; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-weight: 600; }
.pitch-row label { display: inline-flex; align-items: center; gap: 3px; color: var(--muted); }
.pitch-row input { width: 58px; box-sizing: border-box; border: 1px solid var(--line); border-radius: 6px; padding: 4px 5px; font: inherit; font-size: 12px; }
@media (max-width: 900px) { .tp-pitch-wrap { grid-template-columns: 1fr; } }

/* Del-header med start/total tid; tid-række med arbejdstid/pause/runder/længde/bredde; hold side om side */
.part-time { display: flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 700; color: var(--muted); }
.part-time input { width: 96px; padding: 6px 8px; }
.part-time input[type="number"] { width: 70px; }
.xc-time-row .xc-fieldsize { display: contents; }
.xc-time-row .xc-fieldsize input { width: 100%; }
.xc-time-row .xc-fs-presets { grid-column: 1 / -1; display: flex; gap: 12px; align-items: center; }
.tp-block-teams { grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); }
@media (max-width: 800px) { .tp-block-teams { grid-auto-flow: row; } }

/* Opgaver: lodret, kompakt liste med træner-brikker */
.tp-task-lines { display: grid; gap: 3px; margin-bottom: 6px; }
.tp-task-line { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 2px 0; border-bottom: 1px solid var(--line); }
.tp-task-label { flex: 0 0 230px; max-width: 230px; font-size: 12px; font-weight: 650; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tp-task-focus b { display: inline-grid; place-items: center; width: 16px; height: 16px; border-radius: 50%; background: var(--navy, #0b2a52); color: #fff; font-size: 10px; margin-right: 4px; }
.tp-task-focus i { font-weight: 400; color: var(--muted); }
.tp-coach-chips { display: flex; gap: 4px; flex-wrap: wrap; }
.tp-coach-chip { border: 1px solid var(--line); background: #fff; border-radius: 999px; padding: 2px 9px; font-size: 11px; cursor: pointer; }
.tp-coach-chip.active { background: var(--navy, #0b2a52); border-color: var(--navy, #0b2a52); color: #fff; font-weight: 700; }
.tp-task-extra select { width: 140px; font-size: 11px !important; padding: 3px 24px 3px 8px !important; }
.tp-task-extra input[type="text"] { flex: 1; min-width: 120px; padding: 3px 8px; font-size: 12px; }
.tp-task-del { border: 0; background: none; color: var(--muted); font-size: 16px; cursor: pointer; }
.tp-task-add-select { width: 220px; font-size: 12px !important; padding: 4px 26px 4px 8px !important; }
.tp-tasks .tp-task-add-select { width: 220px; }
.tp-tasks .tp-task-extra select { width: 140px; }

/* Øvelseskort v3: tider øverst, designer + hold ved siden af læringsmål/sådan skal det løses/regler, individuelt fokus */
.xc-time-row { border-top: 0; padding-top: 0; padding-bottom: 12px; margin-bottom: 12px; border-bottom: 1px solid var(--line); }
.xc-grid { grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); }
.xc-grid-meta { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.xc-sketch { padding: 0; background: transparent; border: 0; min-height: 0; }
.tp-diagram-svg { aspect-ratio: 700 / 450; max-height: none; }
.tp-diagram-tool-btn.pinned { box-shadow: 0 0 0 2px var(--gold, #c9a24a); }
.xc-fs-presets { grid-column: 1 / -1; display: flex; gap: 12px; align-items: center; flex-wrap: wrap; }
.xc-fs-hint { font-size: 12px; color: #9aa4b5; font-style: italic; }
.xc-left .tp-hold-picker { background: transparent; padding: 0; margin: 8px 0 0; }
.tp-block-teams { margin-top: 4px; }
.tp-indiv { display: grid; gap: 8px; margin: 4px 0 14px; }
.tp-indiv-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.tp-indiv-chip { border: 1px solid var(--line); background: #fff; color: var(--ink); border-radius: 999px; padding: 4px 12px; font-size: 12px; font-weight: 600; cursor: pointer; display: inline-flex; align-items: center; gap: 6px; }
.tp-indiv-chip.fit { background: #e3f5e8; border-color: #4caf6a; color: #1b6b36; }
.tp-indiv-chip.fit.active { background: #2e9a52; border-color: #2e9a52; color: #fff; }
.tp-indiv-chip.active:not(.fit) { background: var(--brand); border-color: var(--brand); color: #fff; }
.tp-indiv-gap { font-style: normal; font-size: 10px; font-weight: 700; color: #b35c00; background: #ffe9cf; border-radius: 999px; padding: 1px 6px; }
.tp-indiv-chip.active .tp-indiv-gap { background: rgba(255,255,255,.25); color: #fff; }
.tp-indiv-rows { display: grid; gap: 4px; }
.tp-indiv-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.tp-indiv-row b { flex: 0 0 160px; font-size: 12px; }
.tp-indiv-row select { width: 190px !important; }
.tp-indiv-row input[type="text"] { flex: 1; min-width: 160px; }
@media (max-width: 900px) { .xc-grid, .xc-grid-meta { grid-template-columns: 1fr; } }
.xc-onpitch { display: flex !important; align-items: center; gap: 6px !important; white-space: nowrap; }
.exercise-card .xc-onpitch input[type="number"] { width: 64px; padding: 4px 6px; }

/* Startside: uge + fødselsdage under velkomsten, dashboard-titel centreret */
.home-week { margin-top: 2px; }
.home-bdays { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; max-width: 1100px; margin-top: 4px; }
.home-bday-chip { display: inline-flex; align-items: center; gap: 6px; background: #fff; border: 1px solid var(--line); border-radius: 999px; padding: 4px 12px; font-size: 13px; }
.home-bday-chip.today { background: linear-gradient(120deg, #fff7de, #fff); border-color: #ecd58a; font-weight: 700; }
.overview-head-center { justify-content: center; text-align: center; }
.home-bday-chip .home-cake { font-size: 15px; line-height: 1; }
.home-bday-chip.today { background: linear-gradient(120deg, #ffd34d, #ffe9a3); border-color: #d9a400; color: #4a3500; box-shadow: 0 0 0 3px rgba(255, 211, 77, .35); }
.home-bday-chip.today .stat-detail { color: #6b4e00; font-weight: 700; }
.row-badges { display: flex; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.dev-todo-group { border-top: 1px solid var(--line); padding: 8px 0; }
.dev-todo-group summary { cursor: pointer; font-weight: 650; display: flex; align-items: center; gap: 8px; }
.dev-todo-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; max-height: 190px; overflow-y: auto; }
.dev-todo-chip { border: 1px solid var(--line); background: #fff; border-radius: 999px; padding: 3px 11px; font-size: 12px; font-weight: 600; cursor: pointer; }

/* Øvelseskort v4: hold i fuld bredde, individuelt som dropdown med farver */
.xc-hold-full { margin: 0 0 14px; }
.xc-hold-full .tp-hold-picker { margin: 0; }
.xc-hold-full .tp-block-teams { grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 12px; }
.xc-grid-meta { margin-bottom: 10px; }
.indiv-dd { position: relative; }
.indiv-dd-summary { cursor: pointer; display: inline-flex; align-items: center; gap: 8px; border: 1px solid var(--line); background: #fff; border-radius: 8px; padding: 7px 12px; font-size: 13px; font-weight: 650; list-style: none; }
.indiv-dd-summary::-webkit-details-marker { display: none; }
.indiv-dd[open] .indiv-dd-summary { border-color: var(--brand); }
.indiv-dd-list { margin-top: 6px; border: 1px solid var(--line); border-radius: 10px; background: #fff; max-height: 300px; overflow-y: auto; padding: 4px; box-shadow: 0 6px 18px rgba(10, 30, 60, .12); max-width: 560px; }
.indiv-dd-label { font-size: 10px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--muted); padding: 8px 8px 3px; }
.indiv-dd-item { display: flex; align-items: center; gap: 8px; width: 100%; text-align: left; border: 0; background: #fff; border-radius: 7px; padding: 7px 10px; font-size: 13px; cursor: pointer; }
.indiv-dd-item:hover { filter: brightness(.97); }
.indiv-dd-item.fit { background: #e3f5e8; color: #1b6b36; }
.indiv-dd-item.fit.chosen { background: #2e9a52; color: #fff; }
.indiv-dd-item.chosen:not(.fit) { background: var(--brand); color: #fff; }
.indiv-dd-name { font-weight: 650; }
.indiv-dd-goal { font-size: 11px; opacity: .8; flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tp-indiv-row b.fit { color: #1b6b36; }
.tp-indiv-row { padding: 3px 0; border-bottom: 1px solid var(--line); }
.xc-hold-full .tp-hold-picker { background: transparent; padding: 0; }

/* Periodeplan: visning/redigering, datovælger, ét refleksionsfelt */
.date-dd { display: inline-flex; gap: 6px; }
.date-dd select { min-width: 0; padding: 7px 26px 7px 10px; font-size: 13px; }
.pp-view-text { font-size: 14px; line-height: 1.45; color: var(--ink); white-space: normal; }
.pp-view-text.pp-empty { color: var(--muted); }
.pp-date-view { display: flex; flex-direction: column; gap: 2px; font-size: 14px; }
.pp-reflection-one { grid-template-columns: 1fr; }
.pp-goal .pp-link { order: -1; margin-bottom: 4px; }
.pp-goal-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 6px; }
.pp-goal-block { margin-bottom: 14px; }
.pp-goal-block .pp-goal-text { margin-bottom: 0; }
.dev-sort { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 650; color: var(--muted); margin-left: 12px; }
.dev-sort select { width: auto; }

/* Holdsiden: navn centreret og større, Akademioversigt i hjørnet, derunder Dashboard-bjælke og faner */
.team-head { position: relative; justify-content: center; text-align: center; margin-bottom: 16px; }
.team-head .overview-title { font-size: 44px; margin: 4px 0 6px; }
.team-head .coach-results { justify-content: center; }
.team-head > .button { position: absolute; right: 0; top: 0; }
@media (max-width: 700px) { .team-head > .button { position: static; margin-top: 8px; } }
.pl-who { display: flex; align-items: center; gap: 10px; }
.pl-eval { display: inline-flex; align-items: center; gap: 6px; font-weight: 650; white-space: nowrap; }
.pp-dot-lg { width: 14px; height: 14px; border-radius: 4px; display: inline-block; }
.kpi-value-link { color: inherit; text-decoration: none; cursor: pointer; }
.kpi-value-link:hover { text-decoration: underline; }
.fx-grid { display: grid; gap: 8px; margin: 12px 0; }
.fx-row { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.fx-label { flex: 0 0 140px; font-size: 12px; font-weight: 650; }
.fx-chip { border: 1px solid var(--line); background: #fff; border-radius: 8px; padding: 6px 10px; font-size: 12px; font-weight: 650; cursor: pointer; color: var(--muted); }
.fx-chip.on { background: #2e9a52; border-color: #2e9a52; color: #fff; }

/* Ugeplan: seks ens felter (3 × 2) */
.tw-grid3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; align-items: stretch; }
.tw-tile { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.tw-label { font-family: var(--font-heading); font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--gold-dark, #8a6d1f); }
.tw-meta { min-height: 38px; font-size: 13px; }
.tw-tile textarea { width: 100%; box-sizing: border-box; flex: 1; min-height: 110px; border: 1px solid var(--line); border-radius: 10px; padding: 9px 11px; font-size: 13px; font-family: inherit; background: #fbfcfe; color: var(--ink); resize: vertical; }
.tw-tile .focus-chips { margin: 2px 0 6px; }
@media (max-width: 900px) { .tw-grid3 { grid-template-columns: 1fr; } .tw-meta { min-height: 0; } }
/* Træningsplaner: kortliste som Udviklingsplan */
.tp-list-card:hover { box-shadow: 0 6px 18px rgba(10, 30, 60, .10); }
.xc-left > [data-xc-show-secondary] { justify-self: start; }
.xc-right .tp-tasks { margin-top: 4px; }

/* Liggende print (A4): oplysningsark + øvelseskort i EfB-blå, som referencearket */
.tp-exercise-card { border: 0.4mm solid var(--brand); border-radius: 0; display: flex; flex-direction: column; background: #fff; }
.tp-exercise-card .tp-card-head { border-radius: 0; padding: 1.6mm 3mm; }
.tp-card-head-title { gap: 3mm; flex: 1; }
.tp-card-head-title .tp-card-time { font-size: 7.5pt; opacity: .95; }
.tp-card-head-right { display: flex; align-items: center; gap: 4mm; font-size: 8pt; font-weight: 700; }
.tp-card-count { font-size: 8pt; }
.tp-exercise-card .tp-card-main { padding: 0; flex: 1; min-height: 0; }
.tp-exercise-card .tp-card-body { grid-template-columns: 1.55fr 1fr; gap: 0; height: 100%; }
.tp-exercise-card .tp-card-diagram-wrap { border: 0; border-right: 0.3mm solid var(--brand); border-radius: 0; background: #fff; padding: 1.5mm; }
.tp-exercise-card .tp-card-info { gap: 0; }
.tp-card-box { border-bottom: 0.3mm solid var(--brand); padding-bottom: 1mm; }
.tp-card-box .tp-card-section-label { background: var(--brand); color: #fff; border: 0; text-align: center; margin: 0 0 .8mm; padding: .5mm 0; font-size: 6.5pt; }
.tp-card-box .tp-card-fokus, .tp-card-box .tp-card-body-text, .tp-card-box .tp-card-opgaver, .tp-card-tid { padding: 0 1.5mm; font-size: 7pt; line-height: 1.25; }
.tp-card-tid > div { display: flex; justify-content: space-between; gap: 2mm; }
.tp-card-hold-band { border-top: 0.3mm solid var(--brand); background: #fff; padding: 1.2mm 3mm; display: flex; gap: 6mm; justify-content: center; }
.tp-card-hold-team { display: flex; flex-direction: column; text-align: center; font-size: 7pt; line-height: 1.3; }
.tp-card-hold-team strong { font-size: 8pt; margin: 0; }
/* oplysningsark */
.tp-cards-first .tp-info-sheet { grid-row: 1 / span 2; grid-column: 1; border: 0.4mm solid var(--brand); display: flex; flex-direction: column; overflow: hidden; min-height: 0; background: #fff; }
.tp-info-title { background: var(--brand); color: #fff; text-align: center; font-family: var(--font-heading); font-weight: 700; font-size: 15pt; padding: 3mm; }
.tp-info-cols { display: grid; grid-template-columns: 1.1fr .9fr; flex: 1; min-height: 0; }
.tp-info-left { border-right: 0.3mm solid var(--brand); display: flex; flex-direction: column; min-width: 0; }
.tp-info-right { display: flex; flex-direction: column; min-width: 0; overflow: hidden; }
.tp-info-row { display: grid; grid-template-columns: 24mm 1fr; border-bottom: 0.3mm solid var(--brand); }
.tp-info-label { background: var(--brand); color: #fff; font-weight: 700; font-size: 8pt; display: flex; align-items: center; padding: 1.4mm 2mm; }
.tp-info-value { font-size: 8pt; font-weight: 600; padding: 1.4mm 2mm; text-align: center; display: flex; align-items: center; justify-content: center; }
.tp-info-head { background: var(--brand); color: #fff; text-align: center; font-weight: 700; font-size: 8pt; padding: 1mm; display: flex; justify-content: center; gap: 4mm; }
.tp-prog-row { display: grid; grid-template-columns: 13mm 1fr 8mm; font-size: 7.5pt; padding: .7mm 2mm; gap: 1mm; }
.tp-prog-name b { margin-right: 1mm; }
.tp-prog-min { text-align: right; }
.tp-prog-total { display: flex; justify-content: space-between; border-top: 0.3mm solid var(--brand); margin-top: auto; padding: 1.2mm 3mm; font-size: 8pt; }
.tp-stat-list { columns: 2; column-gap: 0; font-size: 6.8pt; }
.tp-stat-row { display: flex; justify-content: space-between; gap: 2mm; padding: .2mm 1.5mm; break-inside: avoid; }
.tp-stat-row.bad { background: #f9d9d9; }
.tp-pos-group { border-top: 0.3mm solid var(--brand); font-size: 7pt; text-align: center; padding-bottom: .8mm; }
.tp-pos-label { background: var(--brand); color: #fff; font-weight: 700; font-size: 6.5pt; padding: .4mm; margin-bottom: .6mm; }

.tp-purpose-card { margin: 10px 0; }
.tp-pc-grid { display: grid; gap: 16px; grid-template-columns: 1fr; }
.tp-pc-grid.has-captain { grid-template-columns: 1fr 1fr; }
.tp-pc-field { display: flex; flex-direction: column; gap: 6px; font-size: 11px; font-weight: 650; color: var(--muted); }
.tp-pc-field textarea { width: 100%; box-sizing: border-box; border: 1px solid var(--line); border-radius: 10px; padding: 9px 11px; font-size: 13px; font-family: inherit; background: #fbfcfe; color: var(--ink); resize: vertical; }
.tp-cap-rows { display: grid; gap: 6px; }
.tp-cap-row { display: flex; gap: 8px; align-items: center; }
.tp-cap-row select { min-width: 0; }
.tp-cap-row select:first-child { flex: 1; }
.tp-cap-view { display: flex; gap: 6px; flex-wrap: wrap; }
.tp-info-value { white-space: pre-line; }
@media (max-width: 900px) { .tp-pc-grid.has-captain { grid-template-columns: 1fr; } }

/* =====================================================================================================
   POLISH-LAG (2026-10-08) — samlet finpudsning af hele appen: rytme, dybde, kontrast, mikrointeraktioner.
   Ligger bevidst sidst og ændrer kun udtryk (farver, skygger, radier, typografi, overgange) — ikke layout.
   ===================================================================================================== */
:root {
  --shadow-card: 0 1px 2px rgba(0, 28, 68, .04), 0 4px 12px rgba(0, 28, 68, .04), 0 14px 32px -12px rgba(0, 28, 68, .08);
  --shadow-hover: 0 2px 4px rgba(0, 28, 68, .05), 0 10px 24px rgba(0, 28, 68, .08), 0 24px 44px -16px rgba(0, 28, 68, .14);
  --ring: 0 0 0 3px rgba(173, 143, 57, .28);
  --ease: cubic-bezier(.2, .7, .2, 1);
}
html { scroll-behavior: smooth; }
body { background: linear-gradient(180deg, #f7f9fd 0, var(--canvas) 320px); -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; color: var(--ink); }
::selection { background: rgba(173, 143, 57, .28); }
* { scrollbar-width: thin; scrollbar-color: #c3cde0 transparent; }
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-thumb { background: #c3cde0; border-radius: 10px; border: 2px solid transparent; background-clip: content-box; }
::-webkit-scrollbar-thumb:hover { background: #9fb0cc; background-clip: content-box; border: 2px solid transparent; }

/* Fokus: tydelig, ens og elegant for tastatur */
:focus-visible { outline: none; box-shadow: var(--ring); border-radius: 8px; }
input:focus-visible, select:focus-visible, textarea:focus-visible { border-color: var(--brand-light) !important; }

/* Topbar: let glasflade */
.topbar { background: rgba(255, 255, 255, .86); -webkit-backdrop-filter: saturate(160%) blur(10px); backdrop-filter: saturate(160%) blur(10px); border-bottom: 1px solid rgba(0, 28, 68, .07); box-shadow: 0 1px 0 rgba(255, 255, 255, .8), 0 6px 20px -14px rgba(0, 28, 68, .18); }

/* Sidebar: dybde og rolige overgange */
.sidebar { background: linear-gradient(180deg, #00224f 0, var(--brand) 38%, #001738 100%); box-shadow: 4px 0 24px -12px rgba(0, 12, 40, .5); }
.nav-item { transition: background .16s var(--ease), color .16s var(--ease), transform .16s var(--ease); position: relative; }
.nav-item:hover { transform: translateX(2px); }
.nav-item.active { background: linear-gradient(135deg, #f0dfa8, var(--gold-light) 55%, #d9bf74); box-shadow: 0 6px 16px -8px rgba(226, 204, 142, .7), inset 0 1px 0 rgba(255, 255, 255, .5); }
.nav-section { letter-spacing: .14em; font-weight: 600; opacity: .85; }

/* Kort: finere kant, blød flerlags-skygge, løft på klikbare */
.card, .kpi-card, .tabs-pill { border: 1px solid rgba(0, 28, 68, .07); border-radius: var(--radius-card); box-shadow: var(--shadow-card); }
.card { background: linear-gradient(180deg, #fff 0, #fff 100%); }
.dev-plan-card, .tp-list-card, .kpi-card, [data-training-plan-open], .player-row-click { transition: box-shadow .2s var(--ease), transform .2s var(--ease), border-color .2s var(--ease), background-color .2s var(--ease); }
.dev-plan-card:hover, .tp-list-card:hover { box-shadow: var(--shadow-hover); transform: translateY(-2px); border-color: rgba(0, 83, 151, .18); }
.player-row-click:hover { background: #f6f9ff; }

/* Overskrifter og sektionsetiketter */
.view-header h2, .overview-title { letter-spacing: .015em; }
.view-header h2 { font-size: 22px; }
.view-header p { color: #7a8ca8; margin-top: 2px; }
.card-heading { margin-bottom: 18px; padding-bottom: 12px; border-bottom: 1px solid rgba(0, 28, 68, .06); }
.card-heading h3 { letter-spacing: .06em; font-size: 13px; color: var(--brand); }
.section-label { letter-spacing: .08em; font-size: 12.5px; }
.section-label::before { width: 3px; height: 15px; background: linear-gradient(180deg, var(--gold-light), var(--gold)); }

/* Knapper: primær med dybde, sekundær med blød hover */
.button { border-radius: 11px; padding: 10px 18px; font-weight: 600; letter-spacing: .01em; transition: transform .14s var(--ease), box-shadow .14s var(--ease), background .14s var(--ease), border-color .14s var(--ease), color .14s var(--ease); }
.button:not(.secondary):not(.gold) { background: linear-gradient(180deg, #0a2f63 0, var(--brand) 100%); border-color: #001633; box-shadow: 0 1px 0 rgba(255, 255, 255, .14) inset, 0 6px 14px -6px rgba(0, 28, 68, .55); }
.button:not(.secondary):hover { transform: translateY(-1px); box-shadow: 0 1px 0 rgba(255, 255, 255, .16) inset, 0 10px 20px -8px rgba(0, 28, 68, .6); }
.button:active { transform: translateY(0); box-shadow: none; }
.button.secondary { background: #fff; border-color: #cdd7e6; box-shadow: 0 1px 2px rgba(0, 28, 68, .05); }
.button.secondary:hover { background: #f4f8ff; border-color: var(--brand-light); transform: translateY(-1px); box-shadow: 0 6px 14px -8px rgba(0, 28, 68, .25); }
.button.gold { box-shadow: 0 6px 14px -8px rgba(173, 143, 57, .7); }
.link-button { transition: color .14s var(--ease), opacity .14s; }
.link-button:hover { color: var(--brand-light); }
.button:disabled, .link-button:disabled { opacity: .5; transform: none; box-shadow: none; }

/* Felter: ens højde og rolig fokus */
input[type="text"], input[type="number"], input[type="time"], input[type="date"], input[type="email"], input[type="tel"], input[type="url"], input[type="search"], textarea, select { transition: border-color .15s var(--ease), box-shadow .15s var(--ease), background-color .15s; }
input[type="text"]:hover, input[type="number"]:hover, input[type="time"]:hover, input[type="date"]:hover, textarea:hover { border-color: #aebbd1; }
input:focus, textarea:focus, select:focus { outline: none; border-color: var(--brand-light); box-shadow: 0 0 0 3px rgba(0, 83, 151, .12); background-color: #fff; }
input::placeholder, textarea::placeholder { color: #a6b3c8; font-weight: 300; }

/* Tabeller: rolig tabelhoved, hover på rækker */
table thead th { font-size: 10.5px; letter-spacing: .08em; text-transform: uppercase; color: #7f92ae; font-weight: 600; background: #fafbfe; border-bottom: 1px solid #e4eaf4; }
table tbody tr { transition: background-color .14s; }
table tbody tr:hover td { background: #f8faff; }
td { border-bottom: 1px solid #edf1f8; }
table.table-clean tbody tr:last-child td, table tbody tr:last-child td { border-bottom: 0; }

/* Mærker (badges) og chips: lidt mere luft og kant */
.badge { padding: 4px 10px; font-size: 10.5px; letter-spacing: .01em; box-shadow: inset 0 0 0 1px rgba(0, 28, 68, .05); }
.chip { transition: background-color .14s, border-color .14s, box-shadow .14s; }

/* Segmenterede valg og faner */
.planner-start-toggle, .segmented { background: #eef2f9; border: 1px solid #dfe6f1; border-radius: 10px; padding: 3px; }
.planner-start-toggle button, .segmented button { border-radius: 8px; transition: background-color .16s var(--ease), color .16s, box-shadow .16s; }
.planner-start-toggle button.active, .segmented button.active { background: #fff; color: var(--brand); box-shadow: 0 1px 2px rgba(0, 28, 68, .12), 0 4px 10px -4px rgba(0, 28, 68, .18); }
.tabs-pill button, .team-tabs-rest button, .pp-tab { transition: background-color .16s var(--ease), color .16s, box-shadow .16s, transform .16s; }
.tabs-pill button:hover:not(.active) { background: #f1f5fc; }
.tabs-pill button.active, .team-tabs-rest button.active { box-shadow: 0 6px 14px -8px rgba(173, 143, 57, .8), inset 0 1px 0 rgba(255, 255, 255, .5); }
.team-dash-bar { transition: box-shadow .18s var(--ease), transform .18s var(--ease), background .18s; }
.team-dash-bar.active { background: linear-gradient(135deg, #ecd998, var(--gold-light) 55%, #d6bb6e); box-shadow: 0 10px 22px -12px rgba(173, 143, 57, .9), inset 0 1px 0 rgba(255, 255, 255, .55); }

/* KPI: tydeligere tal, ikonet som blød chip */
.kpi-card { position: relative; overflow: hidden; }
.kpi-card::after { content: ""; position: absolute; inset: 0 0 auto 0; height: 3px; background: linear-gradient(90deg, var(--gold-light), var(--gold) 40%, transparent 85%); opacity: .75; }
.kpi-value { font-weight: 600; letter-spacing: -.01em; }
.kpi-label { letter-spacing: .1em; font-weight: 600; }

/* Mikrotekst og tomme tilstande */
.stat-detail { color: #7d8fab; }
.notice { border-radius: 12px; border: 1px solid #d5e0f2; background: linear-gradient(180deg, #f1f6fe, #eaf1fc); color: #2f4670; }

/* Modaler: blød baggrund og dyb skygge */
.modal-backdrop { background: rgba(0, 18, 46, .5); -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); }
.modal { border-radius: 18px; box-shadow: 0 30px 80px -20px rgba(0, 18, 46, .55), 0 0 0 1px rgba(0, 28, 68, .06); }
.modal h2 { letter-spacing: .01em; }

/* Respektér reduceret bevægelse */
@media (prefers-reduced-motion: reduce) { * { transition: none !important; animation: none !important; scroll-behavior: auto !important; } .nav-item:hover, .button:hover, .dev-plan-card:hover, .tp-list-card:hover { transform: none !important; } }
.list-week-head .list-past-wrap { flex: 1; text-align: center; }
.list-past-btn { font-size: 12px; font-weight: 650; border: 1px solid var(--line); border-radius: 999px; padding: 4px 14px; background: #fff; }
.list-past-btn:hover { background: #f4f8ff; border-color: var(--brand-light); }

/* Fysisk / individuel træning: enkle øvelseskort */
.px-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 18px; margin-top: 8px; }
.px-left, .px-right { display: grid; gap: 10px; align-content: start; min-width: 0; }
.px-numbers { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.px-numbers label, .px-left label { display: grid; gap: 4px; font-size: 11px; font-weight: 650; color: var(--muted); }
.px-grid input[type="text"], .px-grid input[type="number"], .px-grid input[type="url"], .px-grid textarea { width: 100%; box-sizing: border-box; border: 1px solid var(--line); border-radius: 8px; padding: 8px 10px; font-size: 13px; font-family: inherit; background: #fbfcfe; color: var(--ink); }
@media (max-width: 900px) { .px-grid { grid-template-columns: 1fr; } .px-numbers { grid-template-columns: 1fr 1fr; } }
.tp-ind-list { display: grid; gap: 6px; }
.tp-ind-row { display: grid; grid-template-columns: 200px 1fr; gap: 12px; align-items: center; padding: 8px 12px; border: 1px solid var(--line); border-radius: 10px; background: #fff; }
.tp-ind-row.fit { background: #e9f7ee; border-color: #8fd0a5; }
.tp-ind-who { display: flex; flex-direction: column; }

.pt-bar { display: flex; height: 10px; min-width: 120px; background: #eef2f9; border-radius: 6px; overflow: hidden; }
.pt-seg.hold { background: var(--brand-light); } .pt-seg.ind { background: var(--gold); } .pt-seg.gk { background: #2e9a52; }
.pt-legend { display: flex; gap: 14px; align-items: center; margin-top: 10px; font-size: 12px; color: var(--muted); }
.pt-dot { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: 5px; }
.pt-dot.hold { background: var(--brand-light); } .pt-dot.ind { background: var(--gold); } .pt-dot.gk { background: #2e9a52; }
.pt-total td { border-top: 2px solid var(--line); }

/* Faseanalyse */
.pa-attention { display: grid; gap: 8px; }
.pa-att-row { display: grid; grid-template-columns: 1.2fr 1fr auto; gap: 16px; align-items: center; padding: 12px 14px; border-radius: 12px; border: 1px solid var(--line); background: #fff; border-left: 4px solid var(--amber); }
.pa-att-row.tone-bad { border-left-color: var(--red); background: linear-gradient(90deg, #fff7f6, #fff 40%); }
.pa-att-main { display: flex; flex-direction: column; gap: 2px; }
.pa-att-need { display: flex; flex-direction: column; gap: 4px; }
.pa-bar { height: 8px; background: #eef2f9; border-radius: 6px; overflow: hidden; }
.pa-bar span { display: block; height: 100%; background: linear-gradient(90deg, var(--brand-light), #3b86d6); border-radius: 6px; }
.pa-ok { display: flex; gap: 10px; align-items: center; font-size: 13px; }
.pa-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.pa-card { border: 1px solid var(--line); border-radius: 14px; padding: 14px; background: #fff; display: grid; gap: 10px; }
.pa-card.flag { border-color: #e3b5af; background: #fffafa; }
.pa-card-top { display: flex; justify-content: space-between; align-items: center; gap: 6px; }
.pa-rating { display: flex; align-items: center; gap: 8px; font-size: 14px; }
.pa-train { display: grid; gap: 4px; }
@media (max-width: 1100px) { .pa-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .pa-att-row { grid-template-columns: 1fr; } }
.tc-fri-pill { display: inline-block; border: 2px solid #8a94a6; border-radius: 999px; padding: 7px 18px; font-weight: 650; font-size: 13px; color: var(--ink); background: #fff; }

/* Spillestil · dækning */
.sp-summary { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 14px; }
.sp-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.sp-card { border: 1px solid var(--line); border-radius: 14px; overflow: hidden; background: #fff; display: flex; flex-direction: column; }
.sp-card-head { display: flex; justify-content: space-between; align-items: center; padding: 10px 14px; font-size: 13px; }
.sp-card-head span { font-size: 11px; opacity: .85; }
.sp-list { display: grid; }
.sp-row { padding: 9px 14px; border-top: 1px solid #edf1f8; display: grid; gap: 2px; border-left: 3px solid transparent; }
.sp-row.st-green { border-left-color: var(--win); }
.sp-row.st-amber { border-left-color: var(--amber); background: #fffcf5; }
.sp-row.st-red { border-left-color: var(--red); background: #fffafa; }
.sp-name { font-size: 12.5px; font-weight: 600; color: var(--ink); line-height: 1.3; }
.sp-meta { display: flex; justify-content: space-between; gap: 8px; font-size: 11px; color: var(--muted); }
.sp-row.st-red .sp-status { color: var(--red); } .sp-row.st-amber .sp-status { color: var(--amber); } .sp-row.st-green .sp-status { color: var(--win); }
@media (max-width: 1200px) { .sp-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 700px) { .sp-grid { grid-template-columns: 1fr; } }

/* Udviklingsplan: én spiller = ét kort, øvrige planer foldet sammen */
.dev-plan-earlier { margin-top: 10px; font-size: 12px; color: var(--muted, #5b6b84); }
.dev-plan-earlier summary { cursor: pointer; font-weight: 700; }
.dev-plan-earlier-row { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 6px 0; border-top: 1px solid var(--line); }

/* Kampside: faner + faseevaluering (kort pr. fase) */
.match-tabs { margin: 4px 0 14px; }
.pp-sq-letter { font-weight: 800; font-size: 12px; color: var(--sq); background: #fff; border: 1.5px solid var(--sq-soft); }
.pp-sq-letter.on { background: var(--sq); color: #fff; border-color: var(--sq); box-shadow: none; }
.pp-sq-letter:disabled:not(.on) { opacity: .75; }
.fe-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.fe-card { border: 1px solid var(--line); border-radius: 14px; padding: 14px; background: #fff; display: grid; gap: 10px; align-content: start; }
.fe-card.fe-rated { border-color: #cfd9ea; }
.fe-head { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.fe-principles { margin: 0; padding: 0; list-style: none; display: grid; gap: 3px; font-size: 12px; color: var(--muted); }
.fe-principles b { color: var(--ink); margin-right: 4px; }
.fe-note { width: 100%; resize: vertical; min-height: 64px; border: 1px solid var(--line); border-radius: 10px; padding: 8px 10px; font: inherit; font-size: 13px; background: #fafbfd; }
.fe-mention-btns { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.fe-plus, .fe-minus { border: 1px solid var(--line); background: #fff; border-radius: 10px; padding: 8px 10px; font: inherit; font-size: 12.5px; font-weight: 700; cursor: pointer; text-align: left; }
.fe-plus { color: #1f8a4c; } .fe-minus { color: #c0392b; }
.fe-mentions { display: grid; gap: 4px; }
.fe-mention { font-size: 12.5px; padding: 5px 9px; border-radius: 8px; background: #f4f6fb; border-left: 3px solid var(--line); }
.fe-mention.plus { border-left-color: #2f9e5b; } .fe-mention.minus { border-left-color: #d64545; }
.fe-mention-form { display: grid; gap: 6px; }
.fe-mention-form select, .fe-mention-form input { width: 100%; }
@media (max-width: 1200px) { .fe-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 760px) { .fe-grid { grid-template-columns: 1fr; } }

/* Faseanalyse: træning mod præstation, kampmatrix, individuelle nævninger */
.pa-gap { padding: 12px 14px; border-radius: 12px; margin-bottom: 12px; font-size: 13px; background: #fff7f6; border: 1px solid #f0c9c4; color: #8a2d22; }
.pa-gap.tone-warn { background: #fffaf0; border-color: #efdcae; color: #7a5a10; }
.pa-table, .gm-table { width: 100%; border-collapse: collapse; }
.pa-table th { text-align: left; font-size: 11px; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); padding: 6px 10px; }
.pa-table td { padding: 10px; border-top: 1px solid #edf1f8; vertical-align: middle; }
.pa-train-cell { display: grid; gap: 4px; min-width: 200px; }
.gm-box { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 8px; color: #fff; font-weight: 800; font-size: 13px; }
.gm-box.gm-sm { width: 24px; height: 24px; font-size: 11px; }
.gm-empty { color: var(--muted); }
.gm-table th { font-size: 12px; padding: 6px 8px; text-align: center; font-weight: 700; }
.gm-table tbody th { text-align: left; font-size: 13px; }
.gm-table td { padding: 5px 8px; text-align: center; }
.gm-table thead .link-button { display: grid; gap: 1px; font-size: 12px; text-align: center; }
.gm-table thead .link-button span { font-weight: 500; color: var(--muted); font-size: 11px; }
.gm-mentions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.gm-mention { border: 1px solid var(--line); border-left: 4px solid var(--line); border-radius: 12px; padding: 10px 12px; background: #fff; display: grid; gap: 3px; }
.gm-mention.plus { border-left-color: #2f9e5b; } .gm-mention.minus { border-left-color: #d64545; }
.gm-mention-top { display: flex; justify-content: space-between; gap: 8px; }
.gm-mention.plus b { color: #1f8a4c; } .gm-mention.minus b { color: #c0392b; }
@media (max-width: 1000px) { .gm-mentions { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .gm-mentions { grid-template-columns: 1fr; } }

/* Indsigt nederst i træningsplanen */
.ti-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; border: 1px solid var(--line); border-radius: 14px; margin-bottom: 12px; }
.ti-stats > div { padding: 12px 16px; display: grid; gap: 2px; border-left: 1px solid var(--line); }
.ti-stats > div:first-child { border-left: 0; }
.ti-stats b { font-size: 18px; }
.ti-meta { display: flex; justify-content: space-between; gap: 12px; font-size: 13px; margin-bottom: 6px; flex-wrap: wrap; }
.ti-period { font-size: 13px; color: #1f8a4c; margin-bottom: 10px; }
.ti-bars { display: grid; gap: 6px; margin: 10px 0 14px; }
.ti-bar-row { display: grid; grid-template-columns: minmax(140px, 260px) 1fr 44px; gap: 12px; align-items: center; font-size: 13px; }
.ti-bar-row b { text-align: right; }
.ti-part { border-top: 1px solid var(--line); padding: 10px 0; display: grid; gap: 6px; }
.ti-part-head { display: flex; justify-content: space-between; gap: 8px; }
.ti-ex { padding-left: 12px; display: grid; gap: 2px; font-size: 13px; }
.ti-ex-top { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.ti-missing { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; border-top: 1px solid var(--line); padding-top: 10px; }
@media (max-width: 760px) { .ti-stats { grid-template-columns: 1fr; } .ti-stats > div { border-left: 0; border-top: 1px solid var(--line); } }

/* Perioder (en uge pr. periode): liste til venstre, indhold til højre */
.pl-tabs { display: flex; gap: 6px; flex-wrap: wrap; margin: 6px 0 14px; }
.pl-tabs button { border: 1px solid var(--line); background: #fff; border-radius: 999px; padding: 7px 14px; font: inherit; font-size: 13px; font-weight: 600; cursor: pointer; color: var(--ink); }
.pl-tabs button.active { background: var(--gold, #d9bd6f); border-color: var(--gold, #d9bd6f); color: #1d2a44; }
.pl-layout { display: grid; grid-template-columns: minmax(240px, 300px) 1fr; gap: 16px; align-items: start; }
.pl-list { display: grid; gap: 8px; max-height: 78vh; overflow-y: auto; padding-right: 4px; position: sticky; top: 8px; }
.pl-item { display: grid; gap: 4px; text-align: left; border: 1px solid var(--line); background: #fff; border-radius: 14px; padding: 12px 14px; font: inherit; cursor: pointer; }
.pl-item.active { border-color: #1d2a44; box-shadow: 0 0 0 1px #1d2a44; }
.pl-item.now:not(.active) { border-color: #9bd2b0; }
.pl-item-top { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.pl-detail { display: grid; gap: 12px; }
.pl-text { margin: 0; white-space: pre-wrap; font-size: 14px; }
.pl-empty { color: var(--muted); font-style: italic; }
.pl-goals { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.pl-goal { border: 1px solid var(--line); border-radius: 14px; padding: 14px; display: grid; gap: 8px; align-content: start; background: #fafbfd; }
.pl-goal.tone-green { border-top: 3px solid #2f9e5b; } .pl-goal.tone-red { border-top: 3px solid #d64545; }
.pl-goal-kind { font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); }
.pl-goal-principle { font-size: 14px; }
.pl-subs { margin: 0; padding-left: 18px; font-size: 13px; display: grid; gap: 3px; }
.pl-learn { display: grid; gap: 2px; font-size: 13px; border-top: 1px solid var(--line); padding-top: 8px; }
.pl-two { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.pl-edit-sides { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.pl-edit-side, .pl-edit-sides > div { display: grid; gap: 8px; align-content: start; }
.pl-sub-pick { display: grid; gap: 4px; max-height: 190px; overflow-y: auto; }
.pl-sub-pick .weekday-check { font-size: 12px; font-weight: 500; color: var(--ink); align-items: flex-start; }
@media (max-width: 900px) { .pl-layout, .pl-goals, .pl-two, .pl-edit-sides { grid-template-columns: 1fr; } .pl-list { position: static; max-height: 260px; } }

/* Trup: kort i to kolonner (billede, navn, position, nummer) */
.sq-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.sq-card { display: grid; grid-template-columns: auto 1fr auto; gap: 14px; align-items: center; background: #fff; border: 1px solid var(--line); border-radius: 16px; padding: 12px 16px; cursor: pointer; }
.sq-card:hover { border-color: #b8c6de; box-shadow: 0 6px 18px -10px rgba(0, 28, 68, .35); }
.sq-avatar { width: 52px; height: 52px; font-size: 16px; }
.sq-avatar img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; }
.sq-main { display: grid; gap: 3px; min-width: 0; }
.sq-meta { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; font-size: 12px; }
.sq-side { display: grid; gap: 6px; justify-items: end; align-self: start; }
.sq-number { font-size: 20px; font-weight: 800; color: var(--muted); }
@media (max-width: 900px) { .sq-grid { grid-template-columns: 1fr; } }
.todo-line { display: flex; gap: 8px; align-items: center; font-size: 13px; margin: 4px 0; }

/* Kampstatistik: rolige tabeller — farven ligger i en bjælke til venstre, ikke som fyldt række */
.kamp-table { width: 100%; border-collapse: separate; border-spacing: 0; }
.kamp-table th { text-align: left; font-size: 11px; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); padding: 10px 12px; border-bottom: 1px solid var(--line); }
.kamp-table td { padding: 11px 12px; border-bottom: 1px solid #edf1f8; font-size: 13.5px; background: #fff; }
.kamp-table tbody tr:hover td { background: #f6f9fe; }
.kamp-table td:first-child { border-left: 5px solid transparent; font-weight: 700; color: var(--muted); }
.kamp-table tr.kt-red td:first-child { border-left-color: #d64545; }
.kamp-table tr.kt-amber td:first-child { border-left-color: #e0a82e; }
.kamp-table tr.kt-green td:first-child { border-left-color: #22a45d; }
.kamp-table tr.kt-blue td:first-child { border-left-color: #2563eb; }
.kamp-table.kamp-detail td:first-child { color: var(--ink); font-weight: 600; }
.kt-zero { color: #b6bfd0; }
.kamp-legend { margin: 4px 0 12px; }
.card:has(> .kamp-table) { overflow-x: auto; }
.kamp-table td, .kamp-table th { white-space: nowrap; }

/* Individuel oversigt: tal samlet i ét roligt kort */
.stat-strip { display: grid; gap: 16px; padding: 16px 18px; }
.stat-strip-title { font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .07em; color: var(--muted); margin-bottom: 8px; }
.stat-strip-row { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }
.stat-strip-row > div { display: grid; gap: 4px; padding: 10px 14px; border-left: 1px solid var(--line); background: #fff; }
.stat-strip-row > div:first-child { border-left: 0; }
.stat-strip-row span { font-size: 11.5px; color: var(--muted); line-height: 1.25; }
.stat-strip-row b { font-size: 20px; line-height: 1.1; }
@media (max-width: 900px) { .stat-strip-row { grid-template-columns: repeat(3, minmax(0, 1fr)); } .stat-strip-row > div:nth-child(4) { border-left: 0; } .stat-strip-row > div:nth-child(n+4) { border-top: 1px solid var(--line); } }
.match-squad-table select.availability-cell { min-width: 150px; }
.match-squad-table input[data-squad-score] { width: 64px !important; }
.kamp-table th.sortable { cursor: pointer; user-select: none; }
.kamp-table th.sortable:hover, .kamp-table th.sorted { color: var(--ink); }

/* Samtaler: kort pr. samtale, grupperet pr. måned, med liste over hvem der mangler en samtale */
.cv-layout { display: grid; grid-template-columns: minmax(250px, 300px) 1fr; gap: 16px; align-items: start; margin-top: 14px; }
.cv-side { position: sticky; top: 8px; max-height: 80vh; overflow-y: auto; }
.cv-people { display: grid; }
.cv-person { display: grid; grid-template-columns: auto 1fr auto; gap: 10px; align-items: center; padding: 8px 4px; border-top: 1px solid #edf1f8; cursor: pointer; }
.cv-person:first-child { border-top: 0; }
.cv-person-name { font-size: 13.5px; font-weight: 600; color: var(--ink); }
.cv-avatar-sm { width: 30px; height: 30px; font-size: 11px; }
.cv-avatar { width: 38px; height: 38px; font-size: 13px; }
.cv-avatar img, .cv-avatar-sm img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; }
.cv-filters { align-items: center; margin-bottom: 4px; }
.cv-month { font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; color: var(--muted); margin: 18px 2px 8px; }
.cv-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.cv-card { background: #fff; border: 1px solid var(--line); border-left: 4px solid var(--line); border-radius: 14px; padding: 12px 14px; display: grid; gap: 8px; align-content: start; }
.cv-card.cv-player { border-left-color: #2f9e5b; } .cv-card.cv-coach { border-left-color: #e0a82e; }
.cv-head { display: grid; grid-template-columns: auto 1fr auto; gap: 10px; align-items: center; }
.cv-who { display: grid; gap: 1px; min-width: 0; }
.cv-tags { display: flex; gap: 6px; flex-wrap: wrap; }
.cv-topic { margin: 0; font-size: 13.5px; }
.cv-empty { color: var(--muted); font-style: italic; }
@media (max-width: 1100px) { .cv-layout, .cv-grid { grid-template-columns: 1fr; } .cv-side { position: static; max-height: 320px; } }
.cv-person { grid-template-columns: auto 1fr auto auto; border-radius: 10px; padding: 8px 6px; }
.cv-person:hover { background: #f4f7fd; }
.cv-person-name { display: grid; gap: 1px; }
.cv-profile { font-size: 11px; font-weight: 600; color: var(--muted); text-decoration: underline; width: fit-content; }
.cv-plus { font-size: 11.5px; font-weight: 700; color: #1d3a73; opacity: 0; }
.cv-person:hover .cv-plus { opacity: 1; }
.map-range { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.map-range button { border: 1px solid var(--line); background: #fff; border-radius: 999px; padding: 5px 12px; font: inherit; font-size: 12.5px; font-weight: 600; cursor: pointer; }
.map-range button.active { background: #1d2a44; color: #fff; border-color: #1d2a44; }
.map-range input[type=date] { font-size: 12.5px; padding: 4px 8px; border: 1px solid var(--line); border-radius: 8px; }

/* Træningsplaner: kompakt oversigt pr. uge */
.tpl-week { padding: 6px 0; margin-bottom: 12px; }
.tpl-week-head { display: flex; gap: 10px; align-items: baseline; padding: 10px 18px 8px; border-bottom: 1px solid var(--line); }
.tpl-row { display: grid; grid-template-columns: 56px minmax(0, 1.5fr) auto minmax(0, 1.3fr) 170px 60px; gap: 14px; align-items: center; padding: 10px 18px; border-top: 1px solid #edf1f8; cursor: pointer; }
.tpl-row:first-of-type { border-top: 0; }
.tpl-row:hover { background: #f6f9fe; }
.tpl-row.tpl-today { background: #fffbea; }
.tpl-date { display: grid; justify-items: center; line-height: 1.1; padding: 4px 0; border-radius: 10px; background: #f1f4fa; }
.tpl-date b { font-size: 18px; } .tpl-date span { font-size: 10.5px; text-transform: uppercase; color: var(--muted); letter-spacing: .06em; }
.tpl-main, .tpl-focus { display: grid; gap: 2px; min-width: 0; }
.tpl-status { justify-self: start; }
@media (max-width: 900px) { .tpl-row { grid-template-columns: 52px 1fr auto; } .tpl-tags, .tpl-focus { display: none; } }
.tp-gk-box { display: grid; gap: 8px; padding: 14px 18px; }
.tp-gk-head { display: flex; justify-content: space-between; align-items: center; }
.tp-gk-row { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; font-size: 13.5px; }

/* Træningsplan: tidsfelter og tekstfelter i topfelterne ligner rullemenuerne */
.tp-header-fields input[type=time], .tp-header-fields input[type=text], .tp-header-fields input[type=date] {
  width: 100%; min-width: 0; box-sizing: border-box; padding: 10px 12px; border: 1px solid var(--line); border-radius: 8px;
  background: #fff; color: var(--ink); font-size: 13px; font-weight: 400; text-transform: none; letter-spacing: 0;
  box-shadow: 0 1px 2px rgba(10, 34, 64, .04); line-height: 1.35;
}
.tp-header-fields input:focus, .tp-header-fields select:focus { outline: 2px solid #9db9ea; outline-offset: 1px; }

/* Kampresumé-import */
.kr-modal { width: min(920px, 100%); }
.kr-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.kr-table td, .kr-table th { padding: 5px 8px; border-bottom: 1px solid #edf1f8; text-align: left; vertical-align: middle; }
.kr-table select { max-width: 240px; }
.kr-warn { background: #fffaf0; border-color: #efdcae; color: #7a5a10; }
.kr-head { display: grid; gap: 4px; }
.ev-edit-row .ev-min { width: 56px; }
.ev-edit-row .ev-sel { max-width: 190px; font-size: 12.5px; padding: 6px 28px 6px 8px; }

/* Forside: mindre banner, ugevælgeren ved ugens label */
.home-hero { padding: 12px 0 10px; gap: 6px; }
.home-logo { width: 54px; }
.home-slogan { width: min(300px, 52%); }
.home-weeknav { display: flex; gap: 10px; align-items: center; justify-content: center; flex-wrap: wrap; margin-top: 4px; }
.home-weeknav .button { padding: 7px 12px; font-size: 12.5px; }
.home-range { display: inline-flex; gap: 6px; margin-left: 10px; padding-left: 12px; border-left: 1px solid var(--line); }
.home-range .button.active { background: #1d2a44; color: #fff; border-color: #1d2a44; }

/* ==== DESIGN-REFERENCE (Oversigt-skærmbillede fra Dennis): guld som accent, rolige kort, understregede faner ==== */
/* Sidebar: gyldne afsnitsoverskrifter med tynd linje, aktiv række med guldkant */
.nav-section { display: flex; align-items: center; gap: 10px; color: var(--gold-light); opacity: 1; letter-spacing: .2em; font-size: 10.5px; }
.nav-section::after { content: ""; flex: 1; height: 1px; background: linear-gradient(90deg, rgba(226, 204, 142, .45), transparent); }
.nav-item.active { background: linear-gradient(90deg, rgba(226, 204, 142, .22), rgba(226, 204, 142, .04) 70%); color: #fff; border-left: 3px solid var(--gold-light); box-shadow: none; }
.nav-item.active svg, .nav-item.active .nav-icon { color: var(--gold-light); }
/* Topbar: Akademi / Mit hold som understregede tekstfaner */
.scope-toggle.segmented { background: transparent; box-shadow: none; padding: 0; gap: 22px; border-radius: 0; }
.scope-toggle.segmented button { background: transparent !important; box-shadow: none !important; border: 0; border-bottom: 2px solid transparent; border-radius: 0; padding: 8px 2px; font-size: 12px; letter-spacing: .12em; text-transform: uppercase; font-weight: 600; color: var(--muted); }
.scope-toggle.segmented button.active { color: var(--brand); border-bottom-color: var(--gold); }
.breadcrumb { text-transform: uppercase; letter-spacing: .12em; font-size: 12px; }
/* Forside: gylden kicker, ugelabel som lille versal-tekst, rolig dashboard-titel */
.home-kicker { color: var(--gold); }
.home-week, .overview-weeklabel { letter-spacing: .16em; font-size: 11px; color: #6b7d99; }
.overview-title { letter-spacing: .12em; font-size: 22px; }
/* Nøgletalskort: cremefarvet, kort guldstreg øverst til venstre, tynd cirkel om ikonet */
.kpi-card { background: #fdfcf8; border: 1px solid #e8e4d8; box-shadow: 0 8px 24px -16px rgba(0, 28, 68, .25); }
.kpi-card::after { inset: 0 auto auto 22px; width: 38px; height: 3px; background: var(--gold); opacity: 1; border-radius: 0 0 3px 3px; }
.kpi-card .kpi-label { letter-spacing: .14em; font-size: 10.5px; }
.kpi-card .kpi-icon { background: transparent; border: 1.5px solid #d8c88f; border-radius: 50%; width: 42px; height: 42px; display: grid; place-items: center; color: var(--gold); }
.kpi-card .kpi-icon.tone-ok { border-color: #8fcfa6; color: #1f8a4c; }
.kpi-card .kpi-icon.tone-bad { border-color: #e6a39b; color: #c0392b; }
.kpi-card .kpi-icon.tone-warn { border-color: #e6c27a; color: #b5792c; }
.kpi-card[data-skadesyg-open]:hover { border-bottom: 3px solid var(--gold); }
.scope-toggle.segmented, #team-field { border: 0 !important; outline: 0; }
/* Uge / 30 dage / 90 dage står i en egen række over datoen, så datoen er centreret */
.home-weeknav { display: grid; justify-items: center; gap: 8px; }
.home-weekrow { display: flex; gap: 10px; align-items: center; justify-content: center; flex-wrap: wrap; }
.home-range { margin: 0; padding: 0; border: 0; display: inline-flex; gap: 6px; }

/* Forside-ugevælger: rolig, uden kasser — understregede tekstfaner og lette pile */
.home-range { gap: 22px; }
.home-range .button { background: transparent !important; border: 0 !important; border-bottom: 2px solid transparent !important; border-radius: 0 !important; box-shadow: none !important;
  padding: 4px 2px !important; font-size: 11.5px !important; letter-spacing: .16em; text-transform: uppercase; font-weight: 600; color: var(--muted) !important; }
.home-range .button.active { color: var(--brand) !important; border-bottom-color: var(--gold) !important; }
.home-weekrow { gap: 14px; }
.home-weekrow .button { background: transparent !important; border: 0 !important; box-shadow: none !important; padding: 4px 6px !important; font-size: 12px !important;
  font-weight: 600; color: var(--brand-light) !important; }
.home-weekrow .button:hover { text-decoration: underline; }
.home-weekrow .home-week { font-weight: 700; color: var(--brand); }

/* Klipregistrering */
.klip-panel { margin-top: 16px; }
.klip-head { display: flex; align-items: center; gap: 10px; justify-content: space-between; }
.klip-head h3 { margin: 0; }
.klip-panel h4 { margin: 18px 0 6px; font-size: 13px; text-transform: uppercase; letter-spacing: .05em; color: var(--muted, #6b7280); }
.klip-row, .klip-clip, .klip-over-row { display: flex; align-items: center; gap: 10px; padding: 6px 0; border-bottom: 1px solid var(--line, #e5e7eb); }
.klip-mark { width: 20px; text-align: center; }
.klip-name { flex: 1; }
.klip-clip time { min-width: 56px; font-variant-numeric: tabular-nums; color: var(--muted, #6b7280); }
.klip-clip > span { flex: 1; }
.klip-over-row > span { flex: 1; }
.klip-group { margin-bottom: 10px; }
.klip-entry { display: grid; grid-template-columns: 150px 260px 1fr auto; gap: 8px; align-items: center; }
.klip-entry input { width: 100%; }
.klip-entry-meta { display: flex; justify-content: space-between; margin-top: 6px; }
.klip-personal { display: grid; gap: 6px; margin-top: 8px; }
.klip-video-row { display: grid; grid-template-columns: 1fr 140px 140px auto; gap: 8px; align-items: end; margin-top: 8px; }
.klip-video-row label { display: grid; gap: 4px; font-size: 12px; }
.klip-batch { margin-top: 16px; display: flex; gap: 8px; flex-wrap: wrap; }
.klip-pos { color: #1f7a4d; }
.klip-dev { color: #b26a00; }
.klip-warn { color: #b3261e; font-weight: 600; }
@media (max-width: 760px) { .klip-entry, .klip-video-row { grid-template-columns: 1fr; } }
.kamp-table td.kt-wrap { white-space: normal; min-width: 220px; }

/* Spilleropfølgning (Oversigt): kompakt og i samme rolige stil som de øvrige tabeller */
.followup-table { width: 100%; border-collapse: separate; border-spacing: 0; table-layout: auto; }
.followup-table th { font-size: 10.5px; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); font-weight: 600; padding: 10px 8px; white-space: normal; line-height: 1.25; text-align: left; border-bottom: 1px solid var(--line); }
.followup-table th.fu-head { text-align: center; }
.followup-table td { padding: 10px 8px; border-bottom: 1px solid #edf1f8; background: #fff; vertical-align: middle; }
.followup-table td .player-name { white-space: nowrap; }
.followup-table td.fu-cell, .followup-table td:has(.flag-dot) { text-align: center; }
.followup-table td.fu-count { font-weight: 800; width: 34px; border-left: 4px solid transparent; }
.followup-table td.fu-count.tone-bad { border-left-color: #d64545; color: #b23b3b; }
.followup-table td.fu-count.tone-warn { border-left-color: #e0a82e; color: #9a6e10; }
.followup-table td.fu-count.tone-info { border-left-color: #9db9ea; }
.followup-table tbody tr:hover td { background: #f6f9fe; }
.followup-table .fu-gaps { min-width: 0; white-space: nowrap; }
.followup-scroll { overflow-x: auto; }

.klip-clip-wrap { border-bottom: 1px solid var(--line, #e5e7eb); }
.klip-clip-wrap .klip-clip { border-bottom: 0; }
.klip-comments { padding: 0 0 8px 66px; display: grid; gap: 4px; }
.klip-comment { font-size: 13px; }
.klip-comments input { width: 100%; font-size: 13px; }
.klip-hidden { opacity: .55; }