/*
  Compatibility utilities for legacy Jinja templates that previously depended
  on a missing root base.html. This is intentionally small and only supports
  existing utility-heavy templates during the Scorio shell migration.
*/

:root {
  --card-bg: var(--sc26-surface, rgba(255, 255, 255, 0.9));
  --border-color: var(--sc26-line, #d8dee8);
  --primary-color: var(--sc26-teal, #0ea5a4);
  --accent-color: var(--sc26-gold, #c9972b);
  --bg-secondary: var(--sc26-elevated, #f7f5ef);
  --bg-hover: var(--sc26-surface-soft, #fbfaf7);
  --text-color: var(--sc26-ink, #111827);
  --color-primary: var(--sc26-teal, #0ea5a4);
  --bg-tertiary: var(--sc26-surface-soft, #fbfaf7);
  --color-primary-dark: #0b8584;
  --color-primary-light: #2dd4bf;
}

.container,
.max-w-4xl,
.max-w-6xl,
.max-w-7xl {
  width: min(100% - 32px, 1120px);
  margin-left: auto;
  margin-right: auto;
}

.max-w-4xl { max-width: 896px; }
.max-w-6xl { max-width: 1152px; }
.max-w-7xl { max-width: 1280px; }
.w-full { width: 100%; }
.w-4 { width: 1rem; }
.w-8 { width: 2rem; }
.w-16 { width: 4rem; }
.w-20 { width: 5rem; }
.h-10 { height: 2.5rem; }
.h-4 { height: 1rem; }
.h-8 { height: 2rem; }
.h-16 { height: 4rem; }
.h-24 { height: 6rem; }
.h-32 { height: 8rem; }
.h-64 { height: 16rem; }
.h-\[500px\] { height: 500px; }
.min-h-\[400px\] { min-height: 400px; }
.min-h-screen { min-height: 100vh; }
.max-h-\[70vh\] { max-height: 70vh; }
.max-h-\[90vh\] { max-height: 90vh; }
.max-w-md { max-width: 28rem; }
.max-w-2xl { max-width: 42rem; }

.mx-auto { margin-left: auto; margin-right: auto; }
.mx-1 { margin-left: .25rem; margin-right: .25rem; }
.mx-2 { margin-left: .5rem; margin-right: .5rem; }
.mx-4 { margin-left: 1rem; margin-right: 1rem; }
.mt-1 { margin-top: .25rem; }
.mt-2 { margin-top: .5rem; }
.mt-4 { margin-top: 1rem; }
.mt-6 { margin-top: 1.5rem; }
.mb-1 { margin-bottom: .25rem; }
.mb-2 { margin-bottom: .5rem; }
.mb-3 { margin-bottom: .75rem; }
.mb-4 { margin-bottom: 1rem; }
.mb-6 { margin-bottom: 1.5rem; }
.mb-8 { margin-bottom: 2rem; }
.mr-2 { margin-right: .5rem; }
.mr-3 { margin-right: .75rem; }
.mr-4 { margin-right: 1rem; }

.p-0 { padding: 0; }
.p-2 { padding: .5rem; }
.p-3 { padding: .75rem; }
.p-4 { padding: 1rem; }
.p-6 { padding: 1.5rem; }
.p-8 { padding: 2rem; }
.px-2 { padding-left: .5rem; padding-right: .5rem; }
.px-3 { padding-left: .75rem; padding-right: .75rem; }
.px-4 { padding-left: 1rem; padding-right: 1rem; }
.px-6 { padding-left: 1.5rem; padding-right: 1.5rem; }
.py-0\.5 { padding-top: .125rem; padding-bottom: .125rem; }
.py-1 { padding-top: .25rem; padding-bottom: .25rem; }
.py-1\.5 { padding-top: .375rem; padding-bottom: .375rem; }
.py-2 { padding-top: .5rem; padding-bottom: .5rem; }
.py-3 { padding-top: .75rem; padding-bottom: .75rem; }
.py-6 { padding-top: 1.5rem; padding-bottom: 1.5rem; }
.py-8 { padding-top: 2rem; padding-bottom: 2rem; }
.py-12 { padding-top: 3rem; padding-bottom: 3rem; }
.pt-6 { padding-top: 1.5rem; }

.grid { display: grid; }
.flex { display: flex; }
.inline { display: inline; }
.block { display: block; }
.hidden { display: none !important; }
.fixed { position: fixed; }
.relative { position: relative; }
.absolute { position: absolute; }
.inset-0 { inset: 0; }
.top-2 { top: .5rem; }
.right-2 { right: .5rem; }
.z-50 { z-index: 50; }

.grid-cols-1 { grid-template-columns: minmax(0, 1fr); }
.grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.col-span-full { grid-column: 1 / -1; }
.items-center { align-items: center; }
.items-start { align-items: flex-start; }
.justify-center { justify-content: center; }
.justify-between { justify-content: space-between; }
.justify-end { justify-content: flex-end; }
.gap-2 { gap: .5rem; }
.gap-3 { gap: .75rem; }
.gap-4 { gap: 1rem; }
.gap-6 { gap: 1.5rem; }
.gap-8 { gap: 2rem; }
.space-x-2 > * + * { margin-left: .5rem; }
.space-x-3 > * + * { margin-left: .75rem; }
.space-x-4 > * + * { margin-left: 1rem; }
.space-y-2 > * + * { margin-top: .5rem; }
.space-y-3 > * + * { margin-top: .75rem; }
.space-y-4 > * + * { margin-top: 1rem; }
.space-y-6 > * + * { margin-top: 1.5rem; }
.space-y-8 > * + * { margin-top: 2rem; }
.flex-1 { flex: 1 1 0%; }
.flex-wrap { flex-wrap: wrap; }
.flex-shrink-0 { flex-shrink: 0; }

.overflow-hidden { overflow: hidden; }
.overflow-y-auto { overflow-y: auto; }
.overflow-x-auto { overflow-x: auto; }
.resize-none { resize: none; }
.truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.whitespace-nowrap { white-space: nowrap; }

.rounded { border-radius: var(--radius, 7px); }
.rounded-lg { border-radius: var(--radius-lg, 8px); }
.rounded-xl { border-radius: 8px; }
.rounded-2xl { border-radius: 8px; }
.rounded-full { border-radius: 999px; }
.border { border: 1px solid var(--border, #d8dee8); }
.border-2 { border: 2px solid var(--border, #d8dee8); }
.border-b { border-bottom: 1px solid var(--border, #d8dee8); }
.border-r { border-right: 1px solid var(--border, #d8dee8); }
.border-transparent { border-color: transparent; }
.border-gray-700,
.border-gray-800,
.border-slate-200,
.border-slate-300 { border-color: var(--border, #d8dee8); }
.border-\[\#0ea5a4\]\/30 { border-color: rgba(14, 165, 164, .3); }
.shadow,
.shadow-md { box-shadow: var(--shadow, 0 10px 28px rgba(17, 24, 39, .06)); }

.bg-white { background: var(--bg-card, #fff); }
.bg-gray-100,
.bg-gray-200,
.bg-slate-100,
.bg-\[\#fbfaf7\] { background: var(--bg-elevated, #fbfaf7); }
.bg-\[\#0d0d12\] { background: transparent; }
.bg-\[\#1a1a24\],
.bg-\[\#1e1e2d\],
.bg-\[\#2a2a3d\],
.bg-\[\#252532\] { background: var(--bg-card, #fff); }
.bg-\[\#16213e\] { background: var(--sc26-navy, #16213e); }
.bg-\[\#0ea5a4\]\/10 { background: var(--accent-soft, rgba(14, 165, 164, .12)); }
.bg-\[\#16213e\]\/20 { background: rgba(22, 33, 62, .14); }
.bg-\[\#22d3ee\] { background: var(--accent, #0ea5a4); }
.bg-\[\#22d3ee\]\/20 { background: rgba(14, 165, 164, .14); }
.bg-black\/80 { background: rgba(17, 24, 39, .72); }
.bg-purple-500\/20 { background: rgba(201, 151, 43, .14); }
.bg-purple-600 { background: var(--sc26-navy, #16213e); }
.bg-gray-700 { background: var(--bg-elevated, #f7f5ef); }
.bg-red-100 { background: rgba(180, 35, 24, .1); }
.bg-red-500 { background: var(--danger, #b42318); }
.bg-red-500\/20 { background: rgba(180, 35, 24, .14); }
.bg-green-500\/20 { background: rgba(22, 130, 83, .14); }
.bg-gray-500\/20 { background: rgba(102, 112, 133, .14); }
.bg-slate-950\/40 { background: rgba(15, 23, 42, .4); }

.text-white { color: var(--text, #111827); }
.text-black { color: #000; }
.text-gray-300,
.text-gray-400,
.text-gray-500,
.text-gray-600,
.text-slate-500 { color: var(--text-muted, #667085); }
.text-gray-700,
.text-slate-700 { color: var(--text-secondary, #344054); }
.text-gray-800,
.text-slate-950 { color: var(--text, #111827); }
.text-\[\#0ea5a4\],
.text-\[\#0b8382\],
.text-\[\#22d3ee\] { color: var(--accent, #0ea5a4); }
.text-purple-400 { color: var(--sc26-gold, #c9972b); }
.text-red-400,
.text-red-700 { color: var(--danger, #b42318); }
.text-green-400 { color: var(--success, #168253); }
.text-yellow-400 { color: var(--warn, #b7791f); }

.bg-\[\#1a1a24\] .text-white,
.bg-\[\#1e1e2d\] .text-white,
.bg-\[\#2a2a3d\] .text-white,
.bg-\[\#252532\] .text-white {
  color: var(--text, #111827);
}

.bg-purple-600.text-white,
.bg-\[\#16213e\].text-white {
  color: #fff;
}

.text-xs { font-size: .75rem; }
.text-sm { font-size: .875rem; }
.text-lg { font-size: 1.125rem; }
.text-xl { font-size: 1.25rem; }
.text-2xl { font-size: 1.5rem; }
.text-3xl { font-size: 1.875rem; }
.font-mono { font-family: var(--sc26-font-mono, ui-monospace, monospace); }
.font-medium { font-weight: 600; }
.font-semibold { font-weight: 750; }
.font-bold { font-weight: 850; }
.uppercase { text-transform: uppercase; }
.text-center { text-align: center; }
.text-left { text-align: left; }
.text-right { text-align: right; }

.divide-y > * + * { border-top: 1px solid var(--border, #d8dee8); }
.divide-slate-200 > * + * { border-color: var(--border, #d8dee8); }
.cursor-pointer { cursor: pointer; }
.transition-all,
.transition-colors { transition: color .18s ease, background .18s ease, border-color .18s ease, transform .18s ease; }
.backdrop-blur-sm { backdrop-filter: blur(8px); }

.hover\:bg-\[\#1f2f56\]:hover { background: #1f2f56; }
.hover\:bg-\[\#06b6d4\]:hover { background: var(--accent, #0ea5a4); }
.hover\:bg-purple-500:hover { background: #1f2f56; }
.hover\:bg-gray-600:hover { background: var(--bg-hover, #fbfaf7); }
.hover\:bg-\[\#e7ebf2\]:hover,
.hover\:bg-\[\#fbfaf7\]:hover,
.hover\:bg-gray-50:hover { background: var(--bg-elevated, #fbfaf7); }
.hover\:border-\[\#22d3ee\]:hover { border-color: var(--accent, #0ea5a4); }
.hover\:text-\[\#06b6d4\]:hover,
.hover\:text-\[\#0b8382\]:hover { color: var(--accent, #0ea5a4); }
.hover\:text-slate-950:hover { color: var(--text, #111827); }
.hover\:underline:hover { text-decoration: underline; }
.focus\:outline-none:focus { outline: none; }
.focus\:border-\[\#0ea5a4\]:focus { border-color: var(--accent, #0ea5a4); }
.accent-\[\#0ea5a4\],
.accent-\[\#22d3ee\] { accent-color: var(--accent, #0ea5a4); }

@media (min-width: 768px) {
  .md\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .md\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .md\:col-span-2 { grid-column: span 2 / span 2; }
}

@media (min-width: 1024px) {
  .lg\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lg\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .lg\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .lg\:col-span-1 { grid-column: span 1 / span 1; }
  .lg\:col-span-2 { grid-column: span 2 / span 2; }
}

/* Bootstrap-shaped templates on public organization surfaces. */
.row {
  display: flex;
  flex-wrap: wrap;
  gap: 1.5rem;
  margin-left: 0;
  margin-right: 0;
}
.col,
.col-md-3,
.col-md-6,
.col-md-8,
.col-lg-4,
.col-lg-6,
.col-lg-8 {
  flex: 1 1 0;
  min-width: 0;
}
.col { flex-basis: 100%; }
.justify-content-center { justify-content: center; }
.justify-content-between { justify-content: space-between; }
.align-items-center { align-items: center; }
.align-items-start { align-items: flex-start; }
.d-flex { display: flex; }
.d-inline { display: inline; }
.d-block { display: block; }
.d-grid { display: grid; }
.h-100 { height: 100%; }
.w-100 { width: 100%; }
.mb-0 { margin-bottom: 0; }
.mb-5 { margin-bottom: 1.25rem; }
.me-2 { margin-right: .5rem; }
.mt-3 { margin-top: .75rem; }
.py-4 { padding-top: 1rem; padding-bottom: 1rem; }
.py-5 { padding-top: 1.25rem; padding-bottom: 1.25rem; }
.card {
  background: var(--sc26-surface-solid);
  border: 1px solid var(--sc26-line);
  border-radius: var(--sc26-radius-lg);
  box-shadow: var(--sc26-shadow-sm);
  overflow: hidden;
}
.card-header,
.card-body,
.modal-header,
.modal-body,
.modal-footer {
  padding: 1.1rem 1.25rem;
}
.card-header,
.modal-header,
.modal-footer {
  background: var(--sc26-surface-soft);
  border-color: var(--sc26-line);
}
.card-header { border-bottom: 1px solid var(--sc26-line); }
.card-body.p-0 { padding: 0; }
.card h4,
.card h5,
.card h6 {
  margin-top: 0;
  color: var(--sc26-ink);
}
.breadcrumb {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
  padding: 0;
  margin: 0 0 .85rem;
  list-style: none;
  color: var(--sc26-muted);
  font-size: .82rem;
  font-weight: 700;
}
.breadcrumb-item a {
  color: var(--sc26-teal);
  text-decoration: none;
}
.breadcrumb-item + .breadcrumb-item:before {
  content: "/";
  margin-right: .45rem;
  color: var(--sc26-faint);
}
.breadcrumb-item.active { color: var(--sc26-muted); }
.table-responsive { overflow-x: auto; }
.table {
  width: 100%;
  border-collapse: collapse;
}
.table th,
.table td {
  padding: .85rem 1rem;
  border-bottom: 1px solid var(--sc26-line);
  text-align: left;
}
.table th {
  color: var(--sc26-muted);
  font-size: .72rem;
  font-weight: 850;
  text-transform: uppercase;
}
.table-hover tbody tr:hover { background: var(--sc26-surface-soft); }
.list-group { display: grid; }
.list-group-flush { border-radius: 0; }
.list-group-item {
  display: block;
  padding: .9rem 1rem;
  border-bottom: 1px solid var(--sc26-line);
  color: var(--sc26-ink);
  text-decoration: none;
}
.list-group-item:hover,
.list-group-item.active {
  background: var(--sc26-navy);
  color: #fff;
}
.badge {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: .24rem .62rem;
  font-size: .72rem;
  font-weight: 850;
}
.bg-primary,
.bg-info { background: var(--sc26-teal) !important; }
.bg-success { background: var(--sc26-green) !important; }
.bg-warning { background: var(--sc26-amber) !important; }
.bg-danger { background: var(--sc26-red) !important; }
.bg-secondary { background: var(--sc26-muted) !important; }
.text-primary,
.text-info { color: var(--sc26-teal) !important; }
.text-success { color: var(--sc26-green) !important; }
.text-warning { color: var(--sc26-amber) !important; }
.text-danger { color: var(--sc26-red) !important; }
.alert {
  padding: .9rem 1rem;
  border: 1px solid var(--sc26-line);
  border-radius: var(--sc26-radius-lg);
  background: var(--sc26-surface-soft);
}
.alert-danger {
  background: rgba(180, 35, 24, .1);
  border-color: rgba(180, 35, 24, .25);
  color: var(--sc26-red);
}
.alert-info {
  background: rgba(14, 165, 164, .1);
  border-color: rgba(14, 165, 164, .25);
  color: var(--sc26-teal);
}
.display-4 {
  font-size: clamp(2rem, 2.6rem, 3.2rem);
  line-height: 1;
  font-weight: 900;
}
.h2 { font-size: 1.45rem; font-weight: 900; }
.small { font-size: .82rem; }
.fw-bold { font-weight: 850; }
.form-label {
  display: block;
  margin-bottom: .4rem;
  color: var(--sc26-ink-2);
  font-size: .82rem;
  font-weight: 800;
}
.form-control,
.form-select,
.input-group-text,
textarea {
  min-height: 42px;
  border: 1px solid var(--sc26-line);
  border-radius: var(--sc26-radius);
  background: var(--sc26-surface-solid);
  color: var(--sc26-ink);
  font: inherit;
}
.form-control,
.form-select,
textarea {
  width: 100%;
  padding: .65rem .8rem;
}
.form-control:focus,
.form-select:focus,
textarea:focus {
  outline: none;
  border-color: var(--sc26-teal);
  box-shadow: 0 0 0 3px rgba(14, 165, 164, .12);
}
.form-text {
  margin-top: .35rem;
  color: var(--sc26-muted);
  font-size: .78rem;
}
.input-group {
  display: flex;
  align-items: stretch;
}
.input-group .form-control {
  border-radius: 0 var(--sc26-radius) var(--sc26-radius) 0;
}
.input-group-text {
  display: inline-flex;
  align-items: center;
  padding: 0 .75rem;
  border-right: 0;
  border-radius: var(--sc26-radius) 0 0 var(--sc26-radius);
  background: var(--sc26-surface-soft);
  color: var(--sc26-muted);
}
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .45rem;
  min-height: 38px;
  border: 1px solid transparent;
  border-radius: var(--sc26-radius);
  padding: .55rem .95rem;
  font: inherit;
  font-weight: 850;
  text-decoration: none;
  cursor: pointer;
}
.btn-primary {
  background: var(--sc26-navy);
  color: #fff;
}
.btn-outline-primary,
.btn-outline-secondary,
.btn-secondary {
  background: var(--sc26-surface-solid);
  border-color: var(--sc26-line);
  color: var(--sc26-ink);
}
.btn-outline-danger {
  background: var(--sc26-surface-solid);
  border-color: rgba(180, 35, 24, .28);
  color: var(--sc26-red);
}
.btn-sm {
  min-height: 32px;
  padding: .4rem .72rem;
  font-size: .78rem;
}
.btn-lg {
  min-height: 46px;
  padding: .7rem 1.1rem;
}
.btn-group {
  display: inline-flex;
  flex-wrap: wrap;
  gap: .35rem;
}
.modal-content {
  background: var(--sc26-surface-solid);
  border: 1px solid var(--sc26-line);
  border-radius: var(--sc26-radius-lg);
  box-shadow: var(--sc26-shadow);
}
.modal-footer {
  display: flex;
  justify-content: flex-end;
  gap: .6rem;
  border-top: 1px solid var(--sc26-line);
}
.btn-close {
  width: 32px;
  height: 32px;
  border: 0;
  border-radius: 999px;
  background: var(--sc26-surface-soft);
}
.btn-close:before { content: "x"; }
.text-white { color: var(--text, #111827); }
.bg-\[\#16213e\] .text-white {
  color: #fff;
}

@media (min-width: 768px) {
  .col-md-3 { flex: 0 0 calc(25% - 1.125rem); }
  .col-md-6 { flex: 0 0 calc(50% - .75rem); }
  .col-md-8 { flex: 0 0 calc(66.666% - .5rem); }
}

@media (min-width: 1024px) {
  .col-lg-4 { flex: 0 0 calc(33.333% - 1rem); }
  .col-lg-6 { flex: 0 0 calc(50% - .75rem); }
  .col-lg-8 { flex: 0 0 calc(66.666% - .5rem); }
}

/*
  Global old-theme suppression.
  This file is loaded from the shared Scorio shell after page CSS so utility,
  Bootstrap-shaped, and older inline-heavy pages inherit the same 2026 brand.
*/
body {
  background:
    linear-gradient(90deg, rgba(17, 24, 39, 0.04) 1px, transparent 1px),
    linear-gradient(180deg, rgba(17, 24, 39, 0.035) 1px, transparent 1px),
    var(--sc26-bg, #f4f1ea) !important;
  background-size: 48px 48px !important;
  color: var(--sc26-ink, #111827) !important;
  font-family: var(--sc26-font, 'Plus Jakarta Sans', ui-sans-serif, system-ui, sans-serif) !important;
  letter-spacing: 0 !important;
}

[style*="#0d0d12"],
[style*="#0f0f16"],
[style*="#1a1a24"],
[style*="#1a1a2e"],
[style*="#252532"],
[style*="#2a2a3d"],
[style*="#667eea"],
[style*="#764ba2"],
[style*="linear-gradient(135deg, #1"],
[style*="linear-gradient(135deg,#1"],
[style*="var(--card-bg"],
[style*="var(--bg-card"],
.bg-\[\#0d0d12\],
.bg-\[\#111827\],
.bg-\[\#1a1a24\],
.bg-\[\#1e1e2d\],
.bg-\[\#252532\],
.bg-\[\#2a2a3d\],
.bg-slate-900,
.bg-gray-900 {
  background: rgba(255, 255, 255, 0.9) !important;
  color: var(--sc26-ink, #111827) !important;
  border-color: var(--sc26-line, #d8dee8) !important;
}

.bg-\[\#16213e\],
.bg-purple-600,
.bg-indigo-600,
.btn-primary,
.btn.btn-primary,
button.btn-primary,
a.btn-primary,
[style*="background: #16213e"],
[style*="background:#16213e"] {
  background: var(--sc26-navy, #16213e) !important;
  color: #fff !important;
  border-color: var(--sc26-navy, #16213e) !important;
}

.bg-\[\#22d3ee\],
.bg-cyan-400,
.bg-cyan-500,
.badge.bg-success,
.alert-success {
  background: var(--sc26-teal, #0ea5a4) !important;
  color: #fff !important;
}

.text-white,
.text-gray-100,
.text-gray-200,
.text-gray-300,
.text-gray-400,
.text-slate-100,
.text-slate-200,
.text-slate-300,
.text-slate-400 {
  color: var(--sc26-ink, #111827) !important;
}

.btn-primary .text-white,
.bg-\[\#16213e\] .text-white,
.bg-purple-600 .text-white,
.badge.bg-success,
.alert-success,
button.btn-primary,
a.btn-primary {
  color: #fff !important;
}

.text-\[\#22d3ee\],
.text-cyan-400,
.text-cyan-500,
.text-indigo-500,
.text-purple-400,
[style*="color: #667eea"],
[style*="color:#667eea"],
[style*="color: #764ba2"],
[style*="color:#764ba2"] {
  color: var(--sc26-teal, #0ea5a4) !important;
}

.card,
.pricing-card,
.plan-card,
.action-card,
.stat-card,
.metric-card,
.settings-card,
.table-card,
.admin-card,
.widget-card,
.dashboard-card,
.claims-card,
.monitoring-card,
.section-card,
.content-card,
.form-card,
.modal-content,
.sc26-admin-main > section,
.sc26-admin-main > div,
.nav-tournament-main > section,
.nav-tournament-main > div {
  border: 1px solid var(--sc26-line, #d8dee8) !important;
  border-radius: 8px !important;
  background: rgba(255, 255, 255, 0.9) !important;
  color: var(--sc26-ink, #111827) !important;
  box-shadow: var(--sc26-shadow-sm, 0 10px 28px rgba(17, 24, 39, 0.06)) !important;
}

.sc26-admin-main > .flash-messages,
.nav-tournament-main > .flash-messages,
.sc26-admin-main > script,
.nav-tournament-main > script {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.page-header,
.admin-header,
.dashboard-header,
.billing-header,
.pricing-hero,
.manage-header,
.upgrade-header,
.hero-section,
.wizard-header {
  border: 1px solid rgba(17, 24, 39, 0.1) !important;
  border-radius: 8px !important;
  background:
    radial-gradient(circle at 100% 0%, rgba(14, 165, 164, 0.14), transparent 32%),
    linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(247, 245, 239, 0.9)) !important;
  color: var(--sc26-ink, #111827) !important;
  box-shadow: var(--sc26-shadow-sm, 0 10px 28px rgba(17, 24, 39, 0.06)) !important;
}

input,
select,
textarea,
.form-control,
.form-select,
.input-group-text,
.color-picker {
  border: 1px solid var(--sc26-line, #d8dee8) !important;
  border-radius: 7px !important;
  background: var(--sc26-surface-soft, #fbfaf7) !important;
  color: var(--sc26-ink, #111827) !important;
  box-shadow: none !important;
}

table,
.table,
.data-table,
.comparison-table,
.history-table {
  border: 1px solid var(--sc26-line, #d8dee8) !important;
  border-radius: 8px !important;
  background: rgba(255, 255, 255, 0.9) !important;
  color: var(--sc26-ink, #111827) !important;
  overflow: hidden;
}

thead,
th,
.table thead th {
  background: var(--sc26-elevated, #f7f5ef) !important;
  color: var(--sc26-muted, #667085) !important;
  border-color: var(--sc26-line, #d8dee8) !important;
}

td,
tr,
.table td {
  color: var(--sc26-ink, #111827) !important;
  border-color: var(--sc26-line, #d8dee8) !important;
}

.badge,
.status-badge,
.plan-badge,
.popular-badge,
.feature-tag,
.tag,
.chip,
.pill {
  border: 1px solid rgba(14, 165, 164, 0.22) !important;
  border-radius: 999px !important;
  background: rgba(14, 165, 164, 0.12) !important;
  color: var(--sc26-teal, #0ea5a4) !important;
  font-weight: 850 !important;
}

.alert,
.warning-banner,
.empty-state {
  border: 1px solid var(--sc26-line, #d8dee8) !important;
  border-radius: 8px !important;
  background: var(--sc26-elevated, #f7f5ef) !important;
  color: var(--sc26-ink, #111827) !important;
}

.billing-container,
.min-h-screen,
.sc26-admin-main,
.nav-tournament-main,
.player-profile-page,
.profile-container,
.settings-container {
  color: var(--sc26-ink, #111827) !important;
}

.billing-container h1,
.billing-container h2,
.billing-container h3,
.sc26-admin-main h1,
.sc26-admin-main h2,
.sc26-admin-main h3,
.nav-tournament-main h1,
.nav-tournament-main h2,
.nav-tournament-main h3,
.player-profile-page h1,
.player-profile-page h2,
.profile-container h1,
.profile-container h2 {
  color: var(--sc26-ink, #111827) !important;
  letter-spacing: 0 !important;
}

/* Player profile keeps a dark score card inside the lighter 2026 shell. */
.profile-container .profile-card {
  color: #ffffff !important;
}

.profile-container .profile-card__name,
.profile-container .profile-card__score,
.profile-container .profile-card__tier-badge {
  color: inherit !important;
}

/*
  Responsive overflow hardening for shared shell/admin/billing/player/social/
  organization/venue pages. These legacy pages mix Bootstrap-like utilities,
  Tailwind-like utilities, and inline styles, so keep the rules structural:
  contain flex/grid children, let prose wrap, and scroll true data tables.
*/
*,
*::before,
*::after {
  box-sizing: border-box;
}

img,
svg,
video,
canvas {
  max-width: 100%;
}

.min-w-0,
.flex > *,
.d-flex > *,
.grid > *,
.row > *,
.input-group > *,
.btn-group > *,
.card-header > *,
.card-body > *,
.modal-header > *,
.modal-body > *,
.modal-footer > *,
.sc26-admin-main > *,
.nav-tournament-main > *,
.billing-container > *,
.player-profile-page > *,
.profile-container > *,
.settings-container > * {
  min-width: 0;
}

.main-wrap,
.container,
.max-w-4xl,
.max-w-6xl,
.max-w-7xl,
.billing-container,
.player-profile-page,
.profile-container,
.settings-container,
.sc26-admin-main,
.nav-tournament-main {
  max-width: 100%;
  overflow-wrap: anywhere;
}

p,
li,
dt,
dd,
label,
legend,
small,
strong,
span,
a,
button,
input,
select,
textarea,
.subtitle,
.description,
.form-text,
.text-muted,
.stat-label,
.stat-value,
.card-title,
.card-subtitle,
.settings-card-title,
.settings-card-subtitle,
.player-name,
.player-team,
.activity-author,
.activity-text,
.suggestion-name,
.suggestion-meta {
  max-width: 100%;
  overflow-wrap: anywhere;
  word-break: normal;
}

h1,
h2,
h3,
h4,
h5,
h6,
.page-title,
.display-4,
.hero-section h1,
.pricing-hero h1,
.manage-header h1,
.upgrade-header h1,
.sc26-admin-main h1,
.nav-tournament-main h1 {
  max-width: 100%;
  overflow-wrap: anywhere;
  text-wrap: balance;
}

.page-title,
.display-4,
.hero-section h1,
.pricing-hero h1,
.manage-header h1,
.upgrade-header h1 {
  font-size: clamp(2rem, 3.4rem, 4.6rem) !important;
  line-height: 0.98 !important;
}

.card-header,
.modal-header,
.modal-footer,
.admin-header,
.page-header,
.billing-header,
.dashboard-header,
.settings-card-header,
.features-tags,
.action-buttons,
.share-btn-group,
.filter-tabs,
.feed-filters,
.admin-nav-bar {
  flex-wrap: wrap;
  align-items: flex-start;
}

.card,
.pricing-card,
.plan-card,
.action-card,
.stat-card,
.metric-card,
.settings-card,
.table-card,
.admin-card,
.widget-card,
.dashboard-card,
.claims-card,
.monitoring-card,
.section-card,
.content-card,
.form-card,
.activity-card,
.suggestion-card,
.venue-card,
.players-list-card,
.walkin-card,
.modal-content {
  max-width: 100%;
  overflow-wrap: anywhere;
}

.table-responsive,
.table-card,
.comparison-table-wrapper,
.history-table,
.players-list-card {
  max-width: 100%;
  overflow-x: auto !important;
  -webkit-overflow-scrolling: touch;
}

table,
.table,
.data-table,
.comparison-table,
.players-table,
.history-table,
.audit-log-table,
.court-stats-table {
  min-width: min(680px, 100%);
  table-layout: auto;
}

th,
td,
.table th,
.table td,
.data-table th,
.data-table td,
.comparison-table th,
.comparison-table td,
.players-table th,
.players-table td {
  max-width: 22rem;
  overflow-wrap: anywhere;
  word-break: normal;
  vertical-align: top;
}

.badge,
.status-badge,
.plan-badge,
.popular-badge,
.feature-tag,
.tag,
.chip,
.pill,
.current-user-badge,
.team-badge,
.tournament-status-badge,
.court-status-badge,
.source-badge,
.pin-set-badge,
.pin-missing-badge,
.checkin-status {
  max-width: 100%;
  min-width: 0;
  white-space: normal !important;
  overflow-wrap: anywhere;
  line-height: 1.2;
  text-align: center;
}

.btn,
.checkout-btn,
.support-link,
.share-btn,
.filter-btn,
.feed-filter-btn,
.load-more-btn,
.btn-load-more,
.action-btn,
.btn-pin,
.sc-btn,
button,
[role="button"] {
  max-width: 100%;
  min-width: 0;
  white-space: normal;
  overflow-wrap: anywhere;
  text-align: center;
}

.venue-nav {
  max-width: 100%;
}

.venue-nav-inner {
  min-width: 0;
}

.venue-nav-item {
  min-width: 0;
  flex: 0 1 auto;
  white-space: normal !important;
}

.venue-nav-label,
.bottom-nav-item,
.brand,
.brand-sub,
.badge-region,
.app-bar a,
.list-group-item,
.breadcrumb-item {
  min-width: 0;
  max-width: 100%;
  overflow-wrap: anywhere;
}

.truncate {
  min-width: 0;
}

@media (max-width: 768px) {
  .container,
  .max-w-4xl,
  .max-w-6xl,
  .max-w-7xl {
    width: min(100% - 20px, 100%);
  }

  .p-8 { padding: 1.25rem; }
  .px-6 { padding-left: 1rem; padding-right: 1rem; }
  .py-12 { padding-top: 2rem; padding-bottom: 2rem; }

  .grid-cols-2,
  .grid-cols-3 {
    grid-template-columns: minmax(0, 1fr);
  }

  .card-header,
  .modal-footer,
  .admin-header,
  .page-header,
  .billing-header,
  .dashboard-header,
  .admin-nav-bar {
    gap: .75rem;
  }

  .page-title,
  .display-4,
  .hero-section h1,
  .pricing-hero h1,
  .manage-header h1,
  .upgrade-header h1 {
    font-size: clamp(1.9rem, 2.35rem, 3.2rem) !important;
    line-height: 1.02 !important;
  }

  .text-3xl { font-size: clamp(1.65rem, 1.75rem, 1.875rem); }
  .text-2xl { font-size: clamp(1.35rem, 1.42rem, 1.5rem); }
  .text-xl { font-size: clamp(1.12rem, 1.18rem, 1.25rem); }

  .btn,
  .checkout-btn,
  .support-link,
  .share-btn,
  .filter-btn,
  .feed-filter-btn,
  .action-btn,
  .btn-pin,
  .sc-btn {
    min-height: 40px;
    line-height: 1.2;
  }

  .whitespace-nowrap,
  .card .whitespace-nowrap,
  .table .whitespace-nowrap,
  .data-table .whitespace-nowrap {
    white-space: normal;
  }

  th,
  td,
  .table th,
  .table td,
  .data-table th,
  .data-table td,
  .comparison-table th,
  .comparison-table td {
    max-width: 16rem;
  }
}

@media (max-width: 520px) {
  .table-responsive,
  .table-card,
  .comparison-table-wrapper,
  .players-list-card {
    margin-left: -10px;
    margin-right: -10px;
    padding-left: 10px;
    padding-right: 10px;
    border-radius: 0 !important;
  }

  table,
  .table,
  .data-table,
  .comparison-table,
  .players-table,
  .history-table {
    min-width: 560px;
  }

  .btn-group,
  .action-buttons,
  .share-btn-group,
  .feed-filters {
    width: 100%;
  }

  .btn-group > *,
  .action-buttons > *,
  .share-btn-group > *,
  .feed-filters > * {
    flex: 1 1 100%;
  }
}

/* Visual QA overflow hardening for long tournament, venue, team, and email text. */
.main-wrap,
.app-bar,
.app-bar-right,
.brand-wrap,
.sc26-admin-frame,
.sc26-admin-main,
.nav-tournament-main,
.sc26-public-page,
.sc26-public-content,
.billing-container,
.venue-nav,
.venue-nav-inner,
.card,
.pricing-card,
.plan-card,
.action-card,
.stat-card,
.metric-card,
.settings-card,
.table-card,
.admin-card,
.widget-card,
.dashboard-card,
.claims-card,
.monitoring-card,
.section-card,
.content-card,
.form-card,
.modal-content {
  min-width: 0;
}

.main-wrap :is(h1, h2, h3, h4, p, a, button, label, small, span),
.sc26-admin-main :is(h1, h2, h3, h4, p, a, button, label, small, span),
.nav-tournament-main :is(h1, h2, h3, h4, p, a, button, label, small, span),
.sc26-public-page :is(h1, h2, h3, h4, p, a, button, label, small, span),
.billing-container :is(h1, h2, h3, h4, p, a, button, label, small, span),
.venue-nav :is(a, span),
.app-bar :is(a, span, div) {
  max-width: 100%;
  overflow-wrap: anywhere;
  word-break: normal;
  hyphens: auto;
}

.main-wrap :is(.card, .panel, .table-card, .metric-card, .stat-card, .action-card) > *,
.sc26-admin-main :is(.card, .panel, .table-card, .metric-card, .stat-card, .action-card) > *,
.nav-tournament-main :is(.card, .panel, .table-card, .metric-card, .stat-card, .action-card) > *,
.billing-container :is(.pricing-card, .plan-card, .action-card, .feature-card) > * {
  min-width: 0;
}

@media (max-width: 640px) {
  .app-bar,
  .sc26-chrome-nav,
  .sc26-chrome-actions,
  .admin-nav-bar,
  .venue-nav-inner {
    flex-wrap: wrap;
  }

  .app-bar .brand,
  .app-bar .brand-sub,
  .sc26-brand-title,
  .sc26-brand-sub,
  .pub-hero-title,
  .page-title,
  .pricing-hero h1,
  .manage-header h1,
  .upgrade-header h1 {
    line-height: 1.05 !important;
  }

  .badge,
  .status-badge,
  .plan-badge,
  .popular-badge,
  .feature-tag,
  .tag,
  .chip,
  .pill {
    white-space: normal !important;
  }
}

/* App-wide hierarchy polish for legacy pages that still render through base_scorio. */
.admin-container,
.dashboard-container,
.monitoring-container,
.venue-verification-container,
.users-container,
.claims-container,
.referrals-container {
  width: min(100% - 32px, 1240px) !important;
  max-width: 1240px !important;
  margin: 0 auto !important;
  padding: clamp(0.75rem, 1.6vw, 1.4rem) 0 3rem !important;
}

.admin-header,
.dashboard-header,
.page-header,
.monitoring-header,
.verification-header {
  display: grid !important;
  gap: 0.25rem !important;
  margin: 0 0 clamp(0.7rem, 1.6vw, 1.1rem) !important;
  padding: 0 0 clamp(0.45rem, 1vw, 0.75rem) !important;
  border: 0 !important;
  border-bottom: 1px solid var(--sc26-line, #d8dee8) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.admin-header h1,
.dashboard-header h1,
.page-header h1,
.monitoring-header h1,
.verification-header h1,
.admin-container > h1,
.dashboard-container > h1 {
  margin: 0 !important;
  color: var(--sc26-ink, #111827) !important;
  font-size: clamp(1.35rem, 2vw, 2rem) !important;
  font-weight: 900 !important;
  line-height: 1.08 !important;
  letter-spacing: 0 !important;
  text-wrap: balance;
}

.admin-header p,
.dashboard-header p,
.page-header p,
.monitoring-header p,
.verification-header p,
.text-muted,
.subtitle {
  max-width: 68ch;
  color: var(--sc26-muted, #667085) !important;
  font-size: 0.88rem !important;
  line-height: 1.4 !important;
}

.stats-grid,
.metrics-grid,
.summary-grid,
.charts-section,
.actions-grid,
.quick-actions,
.admin-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)) !important;
  gap: clamp(0.75rem, 1.6vw, 1rem) !important;
  margin-bottom: clamp(1rem, 2.5vw, 1.5rem) !important;
}

.charts-section {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 360px), 1fr)) !important;
}

.stat-card,
.metric-card,
.chart-card,
.filter-section,
.table-section,
.admin-card,
.monitoring-card,
.verification-card,
.claims-card,
.dashboard-card,
.content-card,
.section-card {
  min-width: 0 !important;
  border: 1px solid var(--sc26-line, #d8dee8) !important;
  border-radius: 8px !important;
  background: var(--sc26-surface, rgba(255,255,255,0.9)) !important;
  color: var(--sc26-ink, #111827) !important;
  box-shadow: 0 10px 24px rgba(17, 24, 39, 0.055) !important;
}

.stat-card,
.metric-card {
  display: flex !important;
  align-items: flex-start !important;
  gap: 0.85rem !important;
  padding: clamp(0.75rem, 1.5vw, 0.95rem) !important;
}

.stat-icon,
.metric-icon,
.filter-btn .icon {
  display: grid !important;
  place-items: center !important;
  flex: 0 0 auto !important;
  width: 1.9rem !important;
  height: 1.9rem !important;
  border: 1px solid rgba(14, 165, 164, 0.24) !important;
  border-radius: 7px !important;
  background: var(--sc26-teal-soft, rgba(14,165,164,0.12)) !important;
  color: var(--sc26-teal, #0ea5a4) !important;
  font-size: 0.95rem !important;
  line-height: 1 !important;
}

.stat-value,
.metric-value {
  color: var(--sc26-ink, #111827) !important;
  font-family: var(--sc26-font-mono, ui-monospace, monospace) !important;
  font-size: clamp(1.45rem, 1.75rem, 2rem) !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  font-variant-numeric: tabular-nums;
}

.stat-label,
.metric-label,
.stat-sub {
  color: var(--sc26-muted, #667085) !important;
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

.filter-section,
.table-section,
.chart-card {
  padding: clamp(1rem, 2.2vw, 1.35rem) !important;
}

.filter-section h3,
.table-header h3,
.chart-card h3,
.admin-card h3,
.section-card h3 {
  margin: 0 0 0.85rem !important;
  color: var(--sc26-ink, #111827) !important;
  font-size: clamp(1rem, 1.08rem, 1.18rem) !important;
  font-weight: 900 !important;
  line-height: 1.2 !important;
}

.filter-buttons,
.action-buttons,
.button-row,
.table-header,
.card-header {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 0.65rem !important;
}

.table-header {
  justify-content: space-between !important;
  margin-bottom: 0.85rem !important;
}

.filter-btn,
.action-btn,
.admin-action,
.btn,
.btn-small,
.btn-secondary,
.btn-primary {
  min-width: 0 !important;
  max-width: 100% !important;
  border-radius: 7px !important;
  font-weight: 850 !important;
  line-height: 1.15 !important;
  white-space: normal !important;
  text-decoration: none !important;
}

.filter-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.55rem !important;
  min-height: 42px !important;
  padding: 0.45rem 0.75rem !important;
  border: 1px solid var(--sc26-line, #d8dee8) !important;
  background: var(--sc26-surface-soft, #fbfaf7) !important;
  color: var(--sc26-ink, #111827) !important;
  box-shadow: none !important;
}

.filter-btn.active,
.filter-btn:hover {
  border-color: rgba(14, 165, 164, 0.45) !important;
  background: var(--sc26-teal-soft, rgba(14,165,164,0.12)) !important;
  color: var(--sc26-ink, #111827) !important;
}

.filter-btn .count,
.badge,
.status,
.status-badge {
  border-radius: 6px !important;
  font-family: var(--sc26-font-mono, ui-monospace, monospace) !important;
  font-size: 0.72rem !important;
  font-weight: 900 !important;
  line-height: 1.2 !important;
  white-space: normal !important;
}

.data-table,
.admin-table,
.table {
  width: 100% !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
}

.data-table th,
.admin-table th,
.table th {
  background: var(--sc26-elevated, #f7f5ef) !important;
  color: var(--sc26-muted, #667085) !important;
  font-size: 0.72rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
}

.data-table td,
.admin-table td,
.table td {
  color: var(--sc26-ink, #111827) !important;
  vertical-align: middle !important;
}

.user-info,
.event-division-head,
.event-status-row,
.duplicate-row,
.series-form,
.event-action-strip,
.event-mini-actions,
.event-match-actions {
  min-width: 0 !important;
}

.event-action-strip,
.event-mini-actions,
.event-match-actions {
  align-items: center !important;
  gap: 0.55rem !important;
}

.event-action-strip .btn,
.event-mini-actions .btn,
.event-match-actions .btn {
  flex: 0 1 auto !important;
}

.event-metric,
.event-check-item,
.event-division-card,
.event-court-card,
.event-queue-card,
.duplicate-row {
  border-color: var(--sc26-line, #d8dee8) !important;
  border-radius: 8px !important;
  background: var(--sc26-surface, rgba(255,255,255,0.9)) !important;
  box-shadow: 0 12px 28px rgba(17, 24, 39, 0.055) !important;
}

@media (max-width: 700px) {
  .admin-container,
  .dashboard-container,
  .monitoring-container,
  .venue-verification-container,
  .users-container {
    width: min(100% - 20px, 1240px) !important;
  }

  .filter-buttons > *,
  .event-action-strip .btn {
    flex: 1 1 100% !important;
  }

  .table-header {
    align-items: flex-start !important;
    flex-direction: column !important;
  }
}