/* EU Cup Organizer · UI refinement, October 2026.
   Scoped to the Organizer page; no changes to public pages or shared components. */
.organizer-page {
  --navy: #17345b;
  --blue: #2c6399;
  --wash: #f5f7fb;
  --line: #e1e7ef;
  --muted: #697b91;
  --ink: #20314a;
  background: var(--wash);
  color: var(--ink);
  font-size: 13px;
}
.organizer-page .org-icon-defs { position:absolute; width:0; height:0; overflow:hidden; pointer-events:none; }
.organizer-page .org-icon {
  display:block; width:19px; height:19px; flex:0 0 19px;
  fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round;
}
.organizer-page [hidden] { display:none !important; }
.organizer-page :where(button,a,input,select,textarea,summary):focus-visible {
  outline:2px solid #428ad2; outline-offset:3px;
}
.organizer-page .organizer-shell {
  grid-template-columns: 252px minmax(0,1fr);
  min-height:calc(100dvh - 4px);
  background: #f5f7fb;
}
.organizer-page .side {
  position:sticky; top:0; height:calc(100dvh - 4px);
  align-self:start; overflow-y:auto; overflow-x:hidden;
  display:flex; flex-direction:column; gap:0;
  padding:22px 14px 15px;
  background:#142e52;
  scrollbar-width:thin; scrollbar-color:#516a87 transparent;
  z-index:32;
}
.organizer-page .organizer-side-header { display:flex; align-items:center; justify-content:space-between; padding:1px 8px 17px; }
.organizer-page .side .brand { gap:10px; }
.organizer-page .side .brand img { width:39px; height:39px; border:1px solid rgba(255,255,255,.22); }
.organizer-page .side .brand strong { font-size:24px; letter-spacing:.075em; }
.organizer-page .side .brand small { margin-top:5px; color:#b3c4dc; font-size:9px; letter-spacing:.15em; }
.organizer-page .organizer-back-home {
  display:flex; align-items:center; gap:11px;
  margin:0 4px 15px; padding:11px 12px; border:1px solid rgba(193,212,240,.16);
  border-radius:9px; color:#d5e2f4; font-size:12px; font-weight:600;
  background:rgba(255,255,255,.04);
}
.organizer-page .organizer-back-home .org-icon { width:16px; height:16px; flex-basis:16px; }
.organizer-page .organizer-back-home:hover { background:rgba(255,255,255,.1); }
.organizer-page .side-nav { display:flex; flex-direction:column; gap:3px; margin:0; padding:0; overflow:visible; }
.organizer-page .side-nav .simple-nav-heading,
.organizer-page .side-nav .simple-nav-heading:not(:first-child) {
  display:block; border:0; margin:17px 0 4px;
  padding:7px 13px 5px; color:#90a8c5; opacity:1;
  font-size:10px; font-weight:700; letter-spacing:.12em; text-transform:uppercase;
}
.organizer-page .side-nav button[data-view] {
  display:flex; align-items:center; gap:12px; width:100%; min-height:43px;
  padding:10px 13px; border:0; border-radius:9px;
  background:transparent; color:#cfdaeb; text-align:left;
  font:600 12px/1.35 var(--sans);
  letter-spacing:0; text-transform:none; box-shadow:none;
  transition:background .15s ease, color .15s ease;
}
.organizer-page .side-nav button[data-view] .org-icon { width:18px; height:18px; flex-basis:18px; opacity:.81; }
.organizer-page .side-nav button[data-view]:hover:not(:disabled) { color:#fff; background:rgba(222,238,255,.09); }
.organizer-page .side-nav button[data-view].active:not(:disabled),
.organizer-page .side-nav button[data-view].active {
  padding:10px 13px; color:#fff !important; background:#2a4e7d !important;
  box-shadow:inset 3px 0 0 #9ac4f2 !important;
}
.organizer-page .side-nav button[data-view]:disabled { opacity:.38 !important; color:#b4c5de !important; background:transparent !important; box-shadow:none !important; }
.organizer-page .side-footer { margin-top:auto; padding:20px 12px 5px; border-top:1px solid rgba(218,233,255,.12); color:#b4c6dd; font-size:10px; line-height:1.8; }
.organizer-page .side-footer a { color:#e3ebf6; }
.organizer-page .side-footer-credit { display:block; margin-top:2px; color:#829dbb; font-weight:600; }
.organizer-page .organizer-side-close,
.organizer-page .organizer-menu-toggle,
.organizer-page .organizer-menu-backdrop { display:none; }
.organizer-page .organizer-main { min-width:0; padding-bottom:35px; }
.organizer-page .topbar {
  min-height:94px; padding:19px clamp(20px, 3.3vw, 52px);
  display:flex; align-items:center; gap:15px; background:#fff;
  border-bottom:1px solid #e2e8f0;
}
.organizer-page .topbar .eyebrow { color:#8293a8; font-size:10px; font-weight:700; letter-spacing:.1em; }
.organizer-page .topbar h1 { margin:6px 0 3px; font-size:clamp(24px,2.5vw,32px); line-height:1.05; letter-spacing:.025em; }
.organizer-page .organizer-title-group { min-width:0; }
.organizer-page .organizer-page-help { margin:4px 0 0; color:#71839a; font-size:11px; line-height:1.5; }
.organizer-page .portal-language-picker select {
  min-height:39px; min-width:128px; padding-left:12px;
  border-radius:8px; background:#fff; font-size:10px;
}
.organizer-page .organizer-activity {
  display:flex; gap:10px; min-height:43px; padding:9px clamp(20px,3.3vw,52px);
  border-bottom:1px solid #e7edf4; background:#f9fbfe;
  color:#697d92; font-size:11px;
}
.organizer-page .organizer-activity.is-busy { background:#f1f7fc; }
.organizer-page .organizer-activity.has-warning { background:#fff5e8; }
.organizer-page .organizer-activity-spinner { width:14px; height:14px; }
.organizer-page .organizer-activity-refresh {
  min-height:27px; padding:5px 12px; border-radius:7px;
  background:#fff; font-size:11px; font-weight:700;
}
.organizer-page .organizer-activity-build { color:#a3b0c1; font-size:10px; }
.organizer-page .organizer-load-error {
  margin:16px clamp(20px,3.3vw,52px) 0; padding:14px 16px;
  border:1px solid #edc6a5; border-radius:9px; background:#fff8f0;
  color:#7c4525; font-size:13px;
}
.organizer-page .organizer-initial-loading {
  margin:26px clamp(20px,3.3vw,52px); padding:27px; display:flex;
  align-items:center; gap:17px; border:1px solid #dce6f0;
  border-radius:12px; background:#fff;
}
.organizer-page .organizer-initial-loading .organizer-activity-spinner { width:24px; height:24px; border-width:3px; }
.organizer-page .organizer-initial-loading strong { display:block; font-size:14px; color:#17345b; }
.organizer-page .organizer-initial-loading p { margin:5px 0 0; color:#7889a0; font-size:12px; }
.organizer-page .organizer-shell.is-initializing .dashboard-content { display:none; }
.organizer-page .dashboard-content { width:100%; max-width:1700px; padding:25px clamp(20px,3.3vw,52px) 45px; margin:0 auto; }
.organizer-page .panel {
  border:1px solid #e0e7f0; border-radius:12px;
  background:#fff; box-shadow:0 2px 11px rgba(22,46,83,.03);
}
.organizer-page .panel-head { padding:20px 23px 17px; gap:16px; align-items:center; }
.organizer-page .panel-head h2 { font-size:26px; letter-spacing:.02em; }
.organizer-page .panel-head .eyebrow { color:#8a9aaf; font-size:9px; }
.organizer-page .panel-head p { font-size:12px; line-height:1.5; }
.organizer-page .action-center { overflow:hidden; margin-bottom:19px; border-color:#dce5f0; }
.organizer-page .action-hero {
  padding:27px 25px 21px; background:#fff; color:#17345b;
  grid-template-columns:minmax(0,1fr) auto; gap:18px;
}
.organizer-page .action-hero .eyebrow { color:#8699b3; font-size:10px; }
.organizer-page .action-hero h2 { margin:9px 0 10px; color:#17345b; font-size:33px; line-height:1.1; }
.organizer-page .action-hero p { color:#71849c; font-size:12px; line-height:1.6; }
.organizer-page .action-summary { min-width:150px; padding:14px 19px; background:#f4f7fb; border:1px solid #e5ecf5; border-radius:10px; }
.organizer-page .action-summary strong { color:#17345b; font-size:38px; }
.organizer-page .action-summary span,
.organizer-page .action-summary small { color:#7589a3; font-size:9px; }
.organizer-page .organizer-next-task {
  margin:0 25px 20px; padding:18px 20px;
  border:1px solid #dfe8f3; border-radius:10px;
  background:#f7f9fc; box-shadow:none;
}
.organizer-page .organizer-next-task h3 { color:#17345b; font-size:19px; }
.organizer-page .organizer-next-task p { font-size:12px; }
.organizer-page .action-card-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; padding:0 25px 25px; background:#fff; }
.organizer-page .action-card,
.organizer-page .health-card {
  box-shadow:none; border:1px solid #e0e7f0; border-radius:10px;
  background:#fff; padding:17px; animation:none;
}
.organizer-page .action-card:hover { box-shadow:0 5px 16px rgba(22,46,83,.06); }
.organizer-page .action-card h3 { font-size:13px; }
.organizer-page .action-card p { font-size:11px; min-height:0; }
.organizer-page .action-card strong { font-size:31px; }
.organizer-page .action-card .action-label { font-size:9px; }
.organizer-page .button { min-height:39px; padding:0 14px; border-radius:8px; font-size:11px; letter-spacing:.025em; }
.organizer-page .button-secondary { border-color:#d8e3ee; }
.organizer-page .table-wrap { overflow-x:auto; scrollbar-width:thin; }
.organizer-page th { padding:14px 14px; background:#f9fbfd; color:#8292a9; font-size:10px; letter-spacing:.06em; }
.organizer-page td { padding:13px 14px; color:#61738d; font-size:12px; line-height:1.5; }
.organizer-page td strong { color:#17345b; }
.organizer-page tbody tr:hover { background:#f7fafd; }
.organizer-page .table-tabs { padding:0 18px; border-bottom:1px solid #e0e7f0; }
.organizer-page .table-tabs button { min-height:41px; font-size:12px; }
.organizer-page .organizer-data-table td small { font-size:10px; }
.organizer-page .table-search input,
.organizer-page input:not([type=checkbox]):not([type=radio]):not([type=file]),
.organizer-page select,
.organizer-page textarea {
  min-height:40px; border-color:#d7e1ec; border-radius:8px;
}
.organizer-page .form-note,
.organizer-page .schedule-note,
.organizer-page .muted { font-size:12px; line-height:1.6; }
.organizer-page .group-card-grid { gap:13px; }
.organizer-page .event-admin-grid { gap:16px; }
.organizer-page .workspace-empty { border-radius:9px; }
.organizer-page .archive-clean-notice { margin-bottom:15px; border-radius:10px; }
.organizer-page .toast { padding:13px 18px; border-radius:9px; font-size:12px; }
/* Remove motion-heavy effects for staff using the interface for long shifts. */
.organizer-page .view, .organizer-page .action-card { animation:none; }
@media(max-width:1250px) {
  .organizer-page .action-card-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:920px) {
  .organizer-page .organizer-shell { display:block; grid-template-columns:minmax(0,1fr); }
  .organizer-page .side {
    position:fixed; top:0; bottom:0; left:0; z-index:61; width:min(294px,87vw); height:100dvh;
    padding:21px 14px 15px; transform:translateX(-105%); transition:transform .2s ease;
    box-shadow:15px 0 35px rgba(9,27,53,.15);
  }
  .organizer-page.organizer-menu-open .side { transform:translateX(0); }
  .organizer-page.organizer-menu-open { overflow:hidden; }
  .organizer-page .side .brand,
  .organizer-page .side-footer { display:flex; }
  .organizer-page .side-footer { display:block; }
  .organizer-page .side-nav { display:flex; flex-direction:column; overflow:visible; }
  .organizer-page .side-nav .simple-nav-heading { display:block; }
  .organizer-page .side-nav button[data-view] { min-height:45px; flex:none; white-space:normal; }
  .organizer-page .organizer-side-close,
  .organizer-page .organizer-menu-toggle {
    display:flex; align-items:center; justify-content:center; flex:none;
    width:42px; height:42px; padding:0; border:1px solid #dae4f0;
    border-radius:9px; background:#fff; color:#17345b;
  }
  .organizer-page .organizer-side-close { width:34px; height:34px; border-color:rgba(255,255,255,.18); background:rgba(255,255,255,.08); color:#fff; font-size:22px; }
  .organizer-page .organizer-menu-backdrop:not([hidden]) {
    position:fixed; inset:0; display:block; z-index:60;
    width:100vw; height:100dvh; border:0; background:rgba(13,33,60,.54);
  }
  .organizer-page .topbar { min-height:76px; padding:12px 19px; }
  .organizer-page .dashboard-content { padding:17px 17px 32px; }
  .organizer-page .organizer-activity { padding:9px 19px; }
  .organizer-page .organizer-load-error { margin:14px 17px 0; }
  .organizer-page .organizer-initial-loading { margin:17px; }
  .organizer-page .topbar h1 { font-size:27px; }
  .organizer-page .action-card-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .organizer-page .action-hero { grid-template-columns:1fr auto; }
  .organizer-page .panel-head { padding:17px 18px; }
}
@media(max-width:610px) {
  .organizer-page .topbar { gap:11px; padding:11px 13px; }
  .organizer-page .topbar h1 { font-size:22px; margin-top:5px; }
  .organizer-page .topbar .eyebrow { font-size:9px; }
  .organizer-page .organizer-page-help { font-size:10px; }
  .organizer-page .portal-language-picker select { min-width:0; max-width:98px; padding-left:8px; font-size:9px; }
  .organizer-page .dashboard-content { padding:14px 12px 28px; }
  .organizer-page .organizer-activity { padding:8px 12px; font-size:10px; }
  .organizer-page .organizer-activity-build { display:none; }
  .organizer-page .organizer-load-error { margin:12px; }
  .organizer-page .organizer-initial-loading { margin:12px; }
  .organizer-page .action-hero { grid-template-columns:1fr; padding:20px 17px; }
  .organizer-page .action-hero h2 { font-size:28px; }
  .organizer-page .action-summary { width:100%; min-height:0; padding:14px; }
  .organizer-page .organizer-next-task { margin:0 16px 16px; padding:17px; }
  .organizer-page .action-card-grid { padding:0 16px 17px; gap:10px; }
  .organizer-page .action-card,.organizer-page .health-card { padding:13px; }
  .organizer-page .action-card strong { font-size:25px; }
  .organizer-page .panel-head { flex-wrap:wrap; align-items:flex-start; }
  .organizer-page .panel-head h2 { font-size:24px; }
  .organizer-page th { padding:11px; }
  .organizer-page td { padding:11px; }
}
@media(max-width:390px) {
  .organizer-page .action-card-grid { grid-template-columns:1fr; }
  .organizer-page .organizer-page-help { display:none; }
  .organizer-page .topbar h1 { font-size:20px; }
}
@media(prefers-reduced-motion:reduce) {
  .organizer-page .side { transition:none; }
  .organizer-page .action-card,.organizer-page .button { transition:none; }
}
