/* ============================================================
   Cassiopeia Child "btfv" — Minimal Layout (LIGHT, kompakt)
   ============================================================ */

/* Grundfarben & Variablen */
html, body {
  background: #f5f7fb;
  color: #1f2328;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body.minimal {
  margin: 0;
  padding: 16px;

  --bg: #f5f7fb;
  --card: #ffffff;
  --text: #1f2328;
  --muted: #5f6b7a;
  --brand: #0d6efd;
  --brand-600: #0b5ed7;
  --border: #e7eaf0;
  --shadow: 0 1px 2px rgba(0,0,0,.04), 0 6px 18px rgba(0,0,0,.05);
  --radius: 12px;

  --table-min-width: 960px;
}

body.minimal main { max-width: 1120px; margin: 0 auto; }

/* Headings / Links */
body.minimal h1, body.minimal h2, body.minimal h3 { margin: 0 0 .4rem; line-height: 1.25; }
body.minimal h1 { font-size: clamp(1.6rem, 2.2vw + 1rem, 2.25rem); }
body.minimal h2 { font-size: 1.2rem; color:#20262e; }
body.minimal a { color: var(--brand); text-decoration: none; text-underline-offset: 2px; }
body.minimal a:hover { text-decoration: underline; }

/* ============================================================
   Menü oben (horizontal)
   ============================================================ */
body.minimal .container-banner.minimal-banner {
  display: flex; justify-content: center; margin: 4px 0 14px;
}
body.minimal .container-banner ul.mod-menu,
body.minimal .container-banner .mod-menu > ul {
  display: flex !important; flex-direction: row; align-items: center; gap: 8px;
  list-style: none; margin: 0; padding: 6px 10px;
  background: var(--card); border: 1px solid var(--border);
  border-radius: 14px; box-shadow: var(--shadow);
}
body.minimal .container-banner .mod-menu > li > a,
body.minimal .container-banner ul.mod-menu > li > a {
  display: block; padding: .4rem .9rem; border-radius: 999px;
  text-decoration: none; color: #334155; font-weight: 500;
  transition: all .15s ease;
}
body.minimal .container-banner .mod-menu > li > a:hover,
body.minimal .container-banner .mod-menu > li.active > a,
body.minimal .container-banner .mod-menu > li.current > a {
  background: #eef4ff; color: var(--brand);
}

/* ============================================================
   Kompakte Cards / Abstände
   ============================================================ */
body.minimal .breadcrumbs,
body.minimal .card {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: .65rem .9rem;
  margin-bottom: .6rem;
}

/* Abschnittsüberschrift (z. B. BTFV) als Leiste, NAHTLOS zur Tabelle */
body.minimal .componentheading {
  background: var(--card);
  border: 1px solid var(--border);
  border-bottom: 0; /* an Tabelle andocken */
  border-radius: var(--radius) var(--radius) 0 0;
  box-shadow: var(--shadow);
  padding: .55rem .95rem;
  margin: .35rem 0 0; /* KEINE große Lücke mehr */
  font-weight: 700;
  font-size: 1.05rem;
}

/* Entfernt überflüssige Joomla-Abstände */
body.minimal span.article_seperator,
body.minimal [style*="padding: 3px"],
body.minimal [style*="margin: 3px"],
body.minimal [style*="padding:3px"] { display: none !important; }

/* ============================================================
   Tabellen (Ranglisten & Turniere)
   ============================================================ */
body.minimal .uk-overflow-auto { margin: 0 !important; }

/* Table-Card – ohne oberen Radius, weil die Überschrift ihn hat */
body.minimal .componentheading + .uk-overflow-auto > table,
body.minimal .componentheading + .uk-overflow-auto table {
  border-radius: 0 0 var(--radius) var(--radius);
  border-top: 1px solid var(--border); /* feine Trennlinie */
}
body.minimal table {
  width: 100%;
  min-width: var(--table-min-width);
  border-collapse: collapse;
  background: var(--card);
  border: 1px solid var(--border);
  /*border-radius: var(--radius);*/
  overflow: hidden;
  box-shadow: var(--shadow);
  margin: .0rem 0 .7rem; /* dichter an Überschrift dank Andock-Regel oben */
  font-size: 0.93rem;
}

/* Kopfzeile (liegt als TR im TBODY) – mehr Innenabstand seitlich */
body.minimal tr.sectiontableheader th {
  background: #eef2f7;
  color: #3b4250;
  font-weight: 700;
  padding: .65rem 1rem;   /* <-- mehr Platz links/rechts */
  text-align: left;
  border-bottom: 1px solid var(--border);
  white-space: nowrap;
}
/* runde Ecken nur oben in der Kopfzeile (falls Tabelle ohne Überschrifts-Leiste kommt) */
body.minimal tr.sectiontableheader th:first-child { border-top-left-radius: var(--radius); }
body.minimal tr.sectiontableheader th:last-child  { border-top-right-radius: var(--radius); }

/* Tabellenzellen */
body.minimal tr.sectiontableentry1 td,
body.minimal tr.sectiontableentry2 td {
  padding: .55rem .9rem;   /* gleichmäßig mit Kopfzeile */
  border-bottom: 1px solid #f0f2f6;
  vertical-align: middle;
  text-align: left;
}

body.minimal tr.sectiontableentry1 td { background: #ffffff; }
body.minimal tr.sectiontableentry2 td { background: #fdfdff; }

/* Hover */
body.minimal tr.sectiontableentry1:hover td,
body.minimal tr.sectiontableentry2:hover td { background: #f5f9ff; }

/* Datumsspalte schmal */
body.minimal tr.sectiontableheader th:first-child,
body.minimal tr.sectiontableentry1  td:first-child,
body.minimal tr.sectiontableentry2  td:first-child {
  width: 1%;
  white-space: nowrap;
}

/* Links in Tabellen */
body.minimal table a { text-decoration: none; }
body.minimal table a:hover { text-decoration: underline; }

/* ===== Tabellen-Footer: „Mehr …“ an die Tabelle andocken ===== */
/* Direktes <a> nach einer Tabellen-Box als Footer rendern */
body.minimal .uk-overflow-auto + a {
  display: block;
  background: var(--card);
  border: 1px solid var(--border);
  border-top: 0; /* an Tabelle andocken */
  border-radius: 0 0 var(--radius) var(--radius);
  box-shadow: var(--shadow);
  padding: .55rem .9rem;
  width: 100%;
  max-width: 100%;
  text-decoration: none;
  color: var(--brand);
  margin: -0.55rem 0 .6rem; /* nach oben „unter“ die Tabelle ziehen */
}
body.minimal .uk-overflow-auto + a:hover { background: #f7faff; text-decoration: underline; }

/* Wenn mehrere Tabellenblöcke folgen, Abstände klein halten */
body.minimal .uk-overflow-auto + a + .componentheading { margin-top: .5rem; }

/* ============================================================
   Badges (Disziplinen OD/DYP) — neben dem Turniernamen
   ============================================================ */
body.minimal .badge {
  display: inline-block;
  padding: 0.12rem 0.45rem;
  border-radius: 999px;
  font-size: 0.78rem;
  line-height: 1.2;
  border: 1px solid var(--border);
  background: #eef4ff;
  color: #1b4bcc;
  white-space: nowrap;
  margin-left: 0.5rem;
  vertical-align: middle;
}
body.minimal .badge.badge--disc-OD  { background: #e9f1ff; color: #0a53be; }
body.minimal .badge.badge--disc-DYP { background: #eafcf1; color: #0f874f; }
body.minimal .badge.badge--disc-SD  { background: #fff7e6; color: #9c6f00; }
body.minimal .badge.badge--disc-DD  { background: #f8e9ff; color: #7a22b7; }

/* ============================================================
   Sportmanager: Linkraster / Tabellen mit Linklisten
   ============================================================ */
body.minimal table.contentpaneopen {
  width: 100%;
  border: 1px solid var(--border);
  background: var(--card);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  border-collapse: separate;
  border-spacing: 0;
  overflow: hidden;
  margin: .4rem 0 .7rem;
}
body.minimal table.contentpaneopen td {
  padding: .55rem .85rem;                  /* mehr Innenabstand */
  border-bottom: 1px solid #eef2f7;
  border-right: 1px solid #eef2f7;
  white-space: nowrap;
}
body.minimal table.contentpaneopen tr:last-child td { border-bottom: 0; }
body.minimal table.contentpaneopen td:last-child { border-right: 0; }
body.minimal table.contentpaneopen a { text-decoration: none; color: #0d6efd; }
body.minimal table.contentpaneopen a:hover { text-decoration: underline; }

/* ============================================================
   Formulare & Buttons
   ============================================================ */
body.minimal input,
body.minimal select,
body.minimal button {
  padding: .4rem .55rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: #fff;
  font: inherit;
}
body.minimal button,
body.minimal .btn {
  cursor: pointer;
  border: 1px solid var(--border);
  background: #fff;
  border-radius: 10px;
  padding: .4rem .7rem;
}
body.minimal .btn-primary,
body.minimal input[type="submit"] {
  background: var(--brand); color: #fff; border-color: var(--brand);
}
body.minimal .btn-primary:hover,
body.minimal input[type="submit"]:hover {
  background: var(--brand-600); border-color: var(--brand-600);
}

/* Button-Gruppen */
body.minimal .btn-group { display: flex; gap: 6px; flex-wrap: wrap; }

/* Kompakter Modus */
body.minimal.compact table { font-size: .9rem; }
body.minimal.compact tr.sectiontableentry1 td,
body.minimal.compact tr.sectiontableentry2 td { padding: .45rem .55rem; }

/* Responsive */
@media (max-width: 760px) {
  body.minimal main { margin: 0 .75rem; }
}

/* Immer Light */
@media (prefers-color-scheme: dark) {
  html, body { background: #f5f7fb !important; color: #1f2328 !important; }
}