/* Modern compatibility layer for the original WebMod templates. */
:root {
  color-scheme: dark;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

html { min-height: 100%; background: #0b1120; }
body {
  min-height: 100vh;
  margin: 0;
  color: var(--color-base-content);
  background:
    radial-gradient(circle at 10% -10%, color-mix(in oklab, var(--color-primary) 18%, transparent), transparent 32rem),
    radial-gradient(circle at 95% 15%, color-mix(in oklab, var(--color-secondary) 10%, transparent), transparent 28rem),
    var(--color-base-300);
  font-size: 0.9375rem;
  line-height: 1.55;
}

* { box-sizing: border-box; }
a { color: var(--color-primary); text-decoration: none; }
a:hover { color: color-mix(in oklab, var(--color-primary) 75%, white); text-decoration: none; }
.navbar a, .menu a, .btn { color: inherit; }
summary { list-style: none; }
summary::-webkit-details-marker { display: none; }

.app-main center { display: block; width: 100%; }
.app-main h1 {
  margin: 0;
  color: var(--color-base-content);
  font-size: clamp(1.55rem, 3vw, 2.35rem);
  font-weight: 800;
  letter-spacing: -0.035em;
}
.app-main h1 b, .app-main b h1 { font-weight: inherit; }
.app-main .page-header { margin: 0 0 1rem; padding: 0; border: 0; }
.app-main hr { border-color: color-mix(in oklab, var(--color-base-content) 10%, transparent); }
.section-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 1rem; }
.section-kicker {
  display: block;
  margin-bottom: .2rem;
  color: var(--color-primary);
  font-size: .7rem;
  font-weight: 800;
  letter-spacing: .15em;
  text-transform: uppercase;
}

/* Bootstrap-era layout classes retained by the templates. */
.container-fluid, .row { width: 100%; margin: 0; padding: 0; }
.col, .well { min-height: 0; }
.col-md-10, .col-md-8 { float: none; width: min(100%, 72rem); margin: 1.25rem auto; }
.col-md-8 { max-width: 52rem; }
.pull-left { float: left; }
.pull-right { float: right; }

.col-md-10, .well, .app-main > div[align="center"] {
  overflow: hidden;
  border: 1px solid color-mix(in oklab, var(--color-base-content) 9%, transparent);
  border-radius: 1rem;
  background: color-mix(in oklab, var(--color-base-200) 92%, transparent);
  box-shadow: 0 18px 50px rgb(0 0 0 / 0.16);
}
.col-md-10, .well { padding: clamp(1rem, 2.5vw, 1.75rem); }
.app-main > div[align="center"] { max-width: 42rem; margin: 4vh auto; padding: clamp(1.5rem, 4vw, 2.5rem); }
.well.col { float: none; }

.transp {
  width: 100% !important;
  height: auto !important;
  min-height: 0;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  border: 1px solid color-mix(in oklab, var(--color-base-content) 10%, transparent);
  border-radius: 1.25rem;
  background-color: var(--color-base-200);
  box-shadow: 0 24px 70px rgb(0 0 0 / 0.3);
}
.dashboard-overview {
  display: block;
  width: 100%;
  margin-bottom: 1.5rem;
  text-align: left;
}
.map-overview {
  display: grid;
  grid-template-columns: minmax(16rem, 24rem) minmax(0, 1fr);
  align-items: stretch;
  gap: 1.25rem;
  margin-bottom: 1.25rem;
}
.server-hero { position: relative; width: 100%; margin: 0; }
.server-hero:not(:has(.transp)) { display: none; }
.map-overview:not(:has(.server-hero .transp)) { grid-template-columns: 1fr; }
.map-summary {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 1rem;
  min-width: 0;
  padding: clamp(1rem, 2.4vw, 1.5rem);
  border: 1px solid color-mix(in oklab, var(--color-base-content) 9%, transparent);
  border-radius: 1.25rem;
  background:
    linear-gradient(135deg, color-mix(in oklab, var(--color-primary) 9%, transparent), transparent 42%),
    color-mix(in oklab, var(--color-base-200) 94%, transparent);
  box-shadow: 0 18px 50px rgb(0 0 0 / .16);
}
.map-summary-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.map-summary h2 { margin: 0; overflow: hidden; font-size: clamp(1.25rem, 2.4vw, 1.75rem); font-weight: 800; letter-spacing: -.025em; text-overflow: ellipsis; white-space: nowrap; }
.scoreboard { display: flex; align-items: center; justify-content: center; gap: clamp(.75rem, 3vw, 2rem); }
.score-team { display: flex; align-items: center; gap: .7rem; min-width: 0; }
.score-team strong { font-size: clamp(2.2rem, 5vw, 4rem); font-weight: 900; line-height: 1; font-variant-numeric: tabular-nums; }
.score-team-ct strong { color: #60a5fa; }
.score-team-t strong { color: #fb7185; }
.score-team-name { max-width: 9rem; overflow: hidden; color: color-mix(in oklab, var(--color-base-content) 62%, transparent); font-size: .72rem; font-weight: 800; letter-spacing: .08em; text-overflow: ellipsis; text-transform: uppercase; white-space: nowrap; }
.score-divider { color: color-mix(in oklab, var(--color-base-content) 28%, transparent); font-size: 2rem; font-weight: 300; }
.match-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); overflow: hidden; border: 1px solid color-mix(in oklab, var(--color-base-content) 8%, transparent); border-radius: .85rem; background: color-mix(in oklab, var(--color-base-300) 55%, transparent); }
.match-stat { min-width: 0; padding: .75rem; border-right: 1px solid color-mix(in oklab, var(--color-base-content) 8%, transparent); }
.match-stat:last-child { border-right: 0; }
.match-stat span { display: block; overflow: hidden; color: color-mix(in oklab, var(--color-base-content) 52%, transparent); font-size: .65rem; font-weight: 700; letter-spacing: .06em; text-overflow: ellipsis; text-transform: uppercase; white-space: nowrap; }
.match-stat strong { display: block; margin-top: .2rem; overflow: hidden; font-size: 1rem; font-variant-numeric: tabular-nums; text-overflow: ellipsis; white-space: nowrap; }
.match-stat small { color: color-mix(in oklab, var(--color-base-content) 48%, transparent); font-size: .7em; font-weight: 600; }
.match-stat-time strong { color: var(--color-primary); }
.team-score-section {
  width: min(100%, 72rem);
  margin: 1.25rem auto;
  overflow: hidden;
  border: 1px solid color-mix(in oklab, var(--color-base-content) 9%, transparent);
  border-radius: 1rem;
  background: color-mix(in oklab, var(--color-base-200) 94%, transparent);
  box-shadow: 0 18px 50px rgb(0 0 0 / .16);
}
.team-score-header { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem 1.25rem; border-bottom: 1px solid color-mix(in oklab, var(--color-base-content) 8%, transparent); }
.team-score-header h2 { margin: 0; font-size: 1.1rem; font-weight: 800; letter-spacing: -.02em; }
.team-score-board { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: stretch; }
.team-score-side { display: flex; align-items: center; gap: clamp(.65rem, 2vw, 1.25rem); min-width: 0; padding: clamp(1rem, 3vw, 1.75rem); }
.team-score-side strong { flex: 0 0 auto; font-size: clamp(2.5rem, 7vw, 4.75rem); font-weight: 900; line-height: 1; font-variant-numeric: tabular-nums; }
.team-score-ct { justify-content: flex-end; background: linear-gradient(90deg, transparent, rgb(59 130 246 / .13)); }
.team-score-t { justify-content: flex-start; background: linear-gradient(90deg, rgb(244 63 94 / .12), transparent); }
.team-score-ct strong { color: #60a5fa; }
.team-score-t strong { color: #fb7185; }
.team-score-name { min-width: 0; overflow: hidden; font-size: clamp(.75rem, 1.5vw, .95rem); font-weight: 850; letter-spacing: .06em; text-overflow: ellipsis; text-transform: uppercase; white-space: nowrap; }
.team-score-icon { display: grid; flex: 0 0 auto; width: 2.65rem; height: 2.65rem; place-items: center; border-radius: .8rem; }
.team-score-icon svg { width: 1.35rem; height: 1.35rem; }
.team-score-ct .team-score-icon { background: rgb(59 130 246 / .16); color: #60a5fa; }
.team-score-t .team-score-icon { background: rgb(244 63 94 / .15); color: #fb7185; }
.team-score-vs { display: flex; z-index: 1; flex-direction: column; align-items: center; justify-content: center; gap: .25rem; width: clamp(4rem, 8vw, 6rem); border-inline: 1px solid color-mix(in oklab, var(--color-base-content) 8%, transparent); background: var(--color-base-300); }
.team-score-vs span { display: grid; width: 2.25rem; height: 2.25rem; place-items: center; border: 1px solid color-mix(in oklab, var(--color-base-content) 12%, transparent); border-radius: 999px; color: color-mix(in oklab, var(--color-base-content) 62%, transparent); font-size: .7rem; font-weight: 900; }
.team-score-vs small { max-width: 5rem; overflow: hidden; color: color-mix(in oklab, var(--color-base-content) 42%, transparent); font-size: .58rem; text-align: center; text-overflow: ellipsis; white-space: nowrap; }
.general-info-card { width: 100%; margin: 0; }
.general-info-card .table td:first-child { width: 42%; text-align: left; }
.general-info-card .table td:last-child { width: 58%; text-align: right; }
.general-info-card .table tr:first-child td { width: 50%; text-align: center; }
.general-info-card form { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: .5rem; }
.general-info-card .map-change-form {
  display: grid;
  gap: .65rem;
  width: min(100%, 34rem);
  margin: .25rem 0 .25rem auto;
}
.map-choice {
  display: grid;
  grid-template-columns: 1.25rem minmax(6rem, auto) minmax(8rem, 1fr) auto;
  align-items: center;
  gap: .65rem;
  width: 100%;
  text-align: left;
}
.map-choice input[type="radio"] { margin: 0; }
.map-choice input[type="text"], .map-choice select { width: 100%; min-width: 0; }
.map-choice:first-child input[type="text"] { grid-column: 3 / 5; }

/* Responsive daisyUI-style data surfaces. */
.app-main table {
  width: 100%;
  max-width: 100%;
  margin-inline: auto;
  border: 0;
  border-collapse: separate;
  border-spacing: 0;
  color: var(--color-base-content);
  background: transparent;
}
.app-main .table { display: table; font-size: .875rem; }
.app-main td, .app-main th {
  height: auto;
  padding: .8rem .9rem;
  border: 0;
  border-bottom: 1px solid color-mix(in oklab, var(--color-base-content) 8%, transparent);
  font-size: .875rem;
}
.app-main tr:last-child > td { border-bottom: 0; }
.app-main .table tr:hover > td { background: color-mix(in oklab, var(--color-base-content) 4%, transparent); }
.normcell { background: transparent !important; }
.teamCT { background: color-mix(in oklab, #3b82f6 16%, var(--color-base-200)) !important; }
.teamTERRORIST { background: color-mix(in oklab, #ef4444 14%, var(--color-base-200)) !important; }
.teamSPECTATOR, .teamUNASSIGNED { background: color-mix(in oklab, var(--color-base-content) 7%, var(--color-base-200)) !important; }

/* Form elements share daisyUI's sizing and interaction language. */
.app-main input:not([type="submit"]):not([type="button"]):not([type="checkbox"]):not([type="radio"]),
.app-main select,
.app-main textarea {
  min-height: 2.75rem;
  max-width: 100%;
  border: 1px solid color-mix(in oklab, var(--color-base-content) 15%, transparent);
  border-radius: .65rem;
  outline: 0;
  background: var(--color-base-100);
  color: var(--color-base-content);
  padding: .65rem .8rem;
  font: inherit;
  transition: border-color .15s ease, box-shadow .15s ease;
}
.app-main textarea { width: 100%; min-height: 18rem; resize: vertical; }
.app-main input:focus, .app-main select:focus, .app-main textarea:focus {
  border-color: var(--color-primary);
  box-shadow: 0 0 0 3px color-mix(in oklab, var(--color-primary) 20%, transparent);
}
.app-main input[type="checkbox"], .app-main input[type="radio"] {
  width: 1.1rem;
  height: 1.1rem;
  margin: .25rem .5rem;
  accent-color: var(--color-primary);
}
.app-main input[type="submit"], .app-main input[type="button"], .app-main button {
  min-height: 2.65rem;
  border: 0;
  border-radius: .65rem;
  background: var(--color-primary);
  color: var(--color-primary-content);
  padding: .65rem 1rem;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
  box-shadow: 0 8px 24px color-mix(in oklab, var(--color-primary) 22%, transparent);
  transition: filter .15s ease, transform .15s ease;
}
.app-main input[type="submit"]:hover, .app-main button:hover { filter: brightness(1.08); transform: translateY(-1px); }
.app-main .btn-danger { background: var(--color-error); color: var(--color-error-content); }
.app-main form { margin-block: .75rem; }
.app-main form select.form-control { width: 100%; margin: .65rem 0; }

font[size="4"] { font-size: 1rem; font-weight: 700; }
font[size="3"] { font-size: .95rem; }
font[size="-2"] { color: color-mix(in oklab, var(--color-base-content) 58%, transparent); font-size: .75rem; }
.nojs { border-radius: .65rem; background: color-mix(in oklab, var(--color-warning) 18%, transparent); padding: .75rem; }

@media (max-width: 760px) {
  .app-main { overflow-x: hidden; }
  .app-main .table { display: block; overflow-x: auto; white-space: nowrap; }
  .app-main td, .app-main th { padding: .7rem .65rem; }
  .pull-left, .pull-right { float: none; display: block; margin-block: .5rem; }
  .app-main table[width="500"] { display: block; overflow-x: auto; }
  .section-heading { align-items: flex-start; flex-direction: column; }
  .map-overview { grid-template-columns: 1fr; }
  .server-hero { width: min(100%, 28rem); }
  .match-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .match-stat:nth-child(2) { border-right: 0; }
  .match-stat:nth-child(-n+2) { border-bottom: 1px solid color-mix(in oklab, var(--color-base-content) 8%, transparent); }
  .team-score-side { flex-direction: column; justify-content: center; gap: .4rem; text-align: center; }
  .team-score-ct .team-score-icon { order: 1; }
  .team-score-ct .team-score-name { order: 2; }
  .team-score-ct strong { order: 3; }
  .team-score-t strong { order: 3; }
  .team-score-t .team-score-name { order: 2; }
  .team-score-t .team-score-icon { order: 1; }
  .team-score-vs small { display: none; }
  .general-info-card .table td:first-child,
  .general-info-card .table td:last-child { width: auto; }
  .map-choice { grid-template-columns: 1.25rem minmax(5rem, auto) minmax(0, 1fr); }
  .map-choice input[type="submit"] { grid-column: 3; justify-self: end; }
  .map-choice:first-child input[type="text"] { grid-column: 3; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; }
}