@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@400;500;600;700&family=Inter:wght@400;500;600;700&display=swap');

:root {
    --pga-navy: #041e42;
    --pga-navy-deep: #021024;
    --pga-navy-light: #0a2d5c;
    --pga-gold: #ffb81c;
    --pga-gold-hover: #ffc94a;
    --pga-red: #c8102e;
    --pga-text: #e8eaee;
    --pga-text-dim: #a7adb8;
    --pga-border: rgba(255,255,255,0.08);
    --pga-surface: #0d1b2a;
    --pga-surface-alt: #122437;
}

html, body {
    font-family: 'Inter', 'Helvetica Neue', Helvetica, Arial, sans-serif;
    background-color: var(--pga-navy-deep);
    color: var(--pga-text);
    -webkit-font-smoothing: antialiased;
}

/* Scale entire site to 80% (20% smaller) */
body {
    zoom: 0.8;
}

/* Firefox fallback (Firefox doesn't support zoom on body in older versions) */
@-moz-document url-prefix() {
    body {
        zoom: unset;
        transform: scale(0.8);
        transform-origin: 0 0;
        width: 125%;
        min-height: 125vh;
    }
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'Oswald', 'Arial Narrow', sans-serif;
    font-weight: 600;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    color: #fff;
}

h1 { font-size: 2.25rem; }
h2 { font-size: 1.75rem; }
h3 { font-size: 1.375rem; }

a, .btn-link {
    color: var(--pga-gold);
    text-decoration: none;
}

a:hover, .btn-link:hover {
    color: var(--pga-gold-hover);
}

.btn-primary {
    color: var(--pga-navy-deep);
    background-color: var(--pga-gold);
    border-color: var(--pga-gold);
    font-family: 'Oswald', sans-serif;
    font-weight: 600;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.btn-primary:hover,
.btn-primary:focus {
    background-color: var(--pga-gold-hover);
    border-color: var(--pga-gold-hover);
    color: var(--pga-navy-deep);
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
    box-shadow: 0 0 0 0.1rem var(--pga-navy-deep), 0 0 0 0.25rem var(--pga-gold);
}

.content {
    padding: 1.5rem 2rem;
    max-width: 1400px;
    margin: 0 auto;
}

h1:focus {
    outline: none;
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid #e50000;
}

.validation-message {
    color: #ff6b6b;
}

.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
    padding: 1rem 1rem 1rem 3.7rem;
    color: white;
}

    .blazor-error-boundary::after {
        content: "An error has occurred."
    }

.darker-border-checkbox.form-check-input {
    border-color: #929292;
}

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
    color: var(--bs-secondary-color);
    text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
    text-align: start;
}

/* ============================================================
   PGA-style Top Navigation
   ============================================================ */
nav.eq-nav {
    display: flex !important;
    flex-wrap: wrap;
    align-items: stretch;
    background: var(--pga-navy);
    background-image: linear-gradient(180deg, var(--pga-navy) 0%, var(--pga-navy-deep) 100%);
    padding: 0 24px;
    gap: 0;
    border-bottom: 3px solid var(--pga-gold);
    box-shadow: 0 2px 12px rgba(0,0,0,0.35);
    position: sticky;
    top: 0;
    z-index: 1000;
    min-height: 58px;
}

/* EQ Tour logo at the top-left of the nav — clicks through to the root page */
nav.eq-nav a.eq-nav-logo {
    display: inline-flex;
    align-items: center;
    padding: 4px 16px 4px 0;
    margin-right: 8px;
    text-decoration: none !important;
}
nav.eq-nav a.eq-nav-logo img {
    height: 44px;
    width: auto;
    display: block;
    transition: transform 0.15s ease, filter 0.15s ease;
}
nav.eq-nav a.eq-nav-logo:hover img {
    transform: scale(1.05);
    filter: drop-shadow(0 0 6px rgba(255, 184, 28, 0.5));
}

nav.eq-nav a.eq-nav-link,
nav.eq-nav span.eq-nav-link {
    display: inline-flex;
    align-items: center;
    padding: 18px 18px;
    color: #fff !important;
    text-decoration: none !important;
    font-family: 'Oswald', 'Arial Narrow', sans-serif;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    cursor: pointer;
    border-bottom: 3px solid transparent;
    margin-bottom: -3px;
    transition: color 0.15s ease, border-color 0.15s ease, background 0.15s ease;
}

nav.eq-nav a.eq-nav-link:hover,
nav.eq-nav span.eq-nav-link:hover,
nav.eq-nav .eq-nav-dropdown:hover > .eq-nav-link {
    color: var(--pga-gold) !important;
    border-bottom-color: var(--pga-gold);
    background: rgba(255, 184, 28, 0.04);
}

nav.eq-nav .eq-nav-dropdown {
    position: relative;
    display: inline-flex;
}

nav.eq-nav .eq-nav-parent {
    user-select: none;
}

nav.eq-nav .eq-nav-dropdown-content {
    display: none;
    position: absolute;
    left: 0;
    top: 100%;
    background: var(--pga-navy-deep);
    min-width: 240px;
    box-shadow: 0 12px 32px rgba(0,0,0,0.55);
    border: 1px solid var(--pga-border);
    border-top: 3px solid var(--pga-gold);
    z-index: 1001;
    padding: 6px 0;
}

nav.eq-nav .eq-nav-dropdown:hover .eq-nav-dropdown-content {
    display: block !important;
}

nav.eq-nav a.eq-nav-sub {
    display: block;
    padding: 11px 20px;
    color: var(--pga-text) !important;
    text-decoration: none !important;
    font-family: 'Inter', sans-serif;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: 0.02em;
    white-space: nowrap;
    border-left: 3px solid transparent;
    transition: all 0.12s ease;
}

nav.eq-nav a.eq-nav-sub:hover {
    background: var(--pga-navy-light);
    color: var(--pga-gold) !important;
    border-left-color: var(--pga-gold);
}

.eq-clickable-rows .k-master-row {
    cursor: pointer;
}

/* ============================================================
   Compact grid sizing — applies to every Telerik grid on the site.
   Smaller text + tighter padding to reduce vertical real estate.
   ============================================================ */
.k-grid,
.k-grid table,
.k-grid .k-table {
    font-size: 12px;
    line-height: 1.25;
}

.k-grid .k-grid-header,
.k-grid .k-grid-header th,
.k-grid .k-header {
    font-size: 12px;
    line-height: 1.25;
    padding-top: 4px;
    padding-bottom: 4px;
}

.k-grid td,
.k-grid .k-table-td {
    padding-top: 3px;
    padding-bottom: 3px;
    padding-left: 6px;
    padding-right: 6px;
}

.k-grid th,
.k-grid .k-table-th {
    padding-left: 6px;
    padding-right: 6px;
}

.k-grid .k-grid-footer td,
.k-grid .k-footer-template td,
.k-grid tfoot td {
    padding-top: 3px;
    padding-bottom: 3px;
    font-size: 12px;
}

.k-grid .k-button {
    font-size: 11px;
    padding: 2px 6px;
}

.k-grid input,
.k-grid select,
.k-grid .k-input,
.k-grid .k-input-inner,
.k-grid .k-numerictextbox,
.k-grid .k-textbox,
.k-grid .k-dropdownlist,
.k-grid .k-datepicker {
    font-size: 12px;
}

/* ============================================================
   Content cards / Telerik grid polish
   ============================================================ */
.content > h1,
.content > h2,
.content > h3 {
    position: relative;
    padding-bottom: 0.5rem;
    margin-bottom: 1.25rem;
    border-bottom: 1px solid var(--pga-border);
}

.content > h1::after,
.content > h2::after,
.content > h3::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -1px;
    width: 64px;
    height: 3px;
    background: var(--pga-gold);
}

/* ============================================================
   PGA dark-theme skin for all :is(.eq-grid, .special-grid-paddings) Telerik grids
   (matches the look established on /eqstandings)
   ============================================================ */

/* Wrap container — subtle card */
:is(.eq-grid, .special-grid-paddings).k-grid {
    background: rgba(255,255,255,0.025) !important;
    border: 1px solid rgba(255,255,255,0.10) !important;
    border-top: 2px solid var(--pga-gold) !important;
    border-radius: 4px !important;
    box-shadow: 0 2px 12px rgba(0,0,0,0.35);
    color: var(--pga-text) !important;
}

:is(.eq-grid, .special-grid-paddings) .k-grid-aria-root,
:is(.eq-grid, .special-grid-paddings) .k-grid-container,
:is(.eq-grid, .special-grid-paddings) .k-grid-content,
:is(.eq-grid, .special-grid-paddings) .k-grid-content-wrap,
:is(.eq-grid, .special-grid-paddings) .k-grid-header,
:is(.eq-grid, .special-grid-paddings) .k-grid-header-wrap {
    background: transparent !important;
    border: none !important;
    color: #fff !important;
}

/* Header — banded background + gold underline */
:is(.eq-grid, .special-grid-paddings) .k-grid-header,
:is(.eq-grid, .special-grid-paddings) .k-grid-header table,
:is(.eq-grid, .special-grid-paddings) .k-grid-header thead,
:is(.eq-grid, .special-grid-paddings) .k-grid-header tr,
:is(.eq-grid, .special-grid-paddings) .k-grid-header th,
:is(.eq-grid, .special-grid-paddings) .k-grid-header .k-table-th {
    background-color: rgba(255,255,255,0.06) !important;
    border-bottom: 2px solid var(--pga-gold) !important;
}

:is(.eq-grid, .special-grid-paddings) .k-grid-header th,
:is(.eq-grid, .special-grid-paddings) .k-grid-header .k-table-th,
:is(.eq-grid, .special-grid-paddings) .k-grid-header th *,
:is(.eq-grid, .special-grid-paddings) .k-grid-header .k-link,
:is(.eq-grid, .special-grid-paddings) .k-grid-header .k-column-title,
:is(.eq-grid, .special-grid-paddings) .k-grid-header .k-cell-inner,
:is(.eq-grid, .special-grid-paddings) .k-grid-header .k-cell-inner > .k-link {
    color: #fff !important;
    font-family: 'Oswald', 'Arial Narrow', sans-serif !important;
    font-weight: 600 !important;
    letter-spacing: 0.08em !important;
    font-size: 12px !important;
    text-transform: uppercase;
}

:is(.eq-grid, .special-grid-paddings) .k-grid-header th,
:is(.eq-grid, .special-grid-paddings) .k-grid-header .k-table-th {
    padding-top: 8px !important;
    padding-bottom: 8px !important;
}

:is(.eq-grid, .special-grid-paddings) .k-grid-header .k-sort-icon,
:is(.eq-grid, .special-grid-paddings) .k-grid-header .k-i-sort-asc-sm,
:is(.eq-grid, .special-grid-paddings) .k-grid-header .k-i-sort-desc-sm,
:is(.eq-grid, .special-grid-paddings) .k-grid-header .k-icon {
    color: var(--pga-gold) !important;
}

/* Body rows */
:is(.eq-grid, .special-grid-paddings) .k-grid-table,
:is(.eq-grid, .special-grid-paddings) tr,
:is(.eq-grid, .special-grid-paddings) tr.k-master-row,
:is(.eq-grid, .special-grid-paddings) tr.k-alt,
:is(.eq-grid, .special-grid-paddings) tr.k-table-row,
:is(.eq-grid, .special-grid-paddings) tr.k-table-alt-row,
:is(.eq-grid, .special-grid-paddings) td,
:is(.eq-grid, .special-grid-paddings) .k-table-td {
    background: transparent !important;
    color: #fff !important;
}

:is(.eq-grid, .special-grid-paddings) td,
:is(.eq-grid, .special-grid-paddings) .k-table-td {
    border-bottom: 1px solid rgba(255,255,255,0.06) !important;
}

/* Zebra striping */
:is(.eq-grid, .special-grid-paddings) tr.k-master-row.k-alt,
:is(.eq-grid, .special-grid-paddings) tr.k-table-alt-row {
    background: rgba(255,255,255,0.03) !important;
}

/* Hover */
:is(.eq-grid, .special-grid-paddings) tr.k-master-row:hover,
:is(.eq-grid, .special-grid-paddings) tr.k-master-row:hover td,
:is(.eq-grid, .special-grid-paddings) tr.k-master-row.k-hover,
:is(.eq-grid, .special-grid-paddings) tr.k-master-row.k-hover td,
:is(.eq-grid, .special-grid-paddings) tr.k-table-row:hover,
:is(.eq-grid, .special-grid-paddings) tr.k-table-row:hover td {
    background: rgba(255, 184, 28, 0.10) !important;
    color: #fff !important;
}

:is(.eq-grid, .special-grid-paddings).eq-clickable-rows tr.k-master-row:hover,
:is(.eq-grid, .special-grid-paddings).eq-clickable-rows tr.k-table-row:hover {
    cursor: pointer;
}

/* Selected row */
:is(.eq-grid, .special-grid-paddings) tr.k-selected,
:is(.eq-grid, .special-grid-paddings) tr.k-selected td {
    background: rgba(255, 184, 28, 0.18) !important;
    color: #fff !important;
}

/* Toolbar / pager */
:is(.eq-grid, .special-grid-paddings) .k-grid-toolbar,
:is(.eq-grid, .special-grid-paddings) .k-grid-pager,
:is(.eq-grid, .special-grid-paddings) .k-pager {
    background: rgba(255,255,255,0.04) !important;
    border-color: rgba(255,255,255,0.10) !important;
    color: #fff !important;
}
:is(.eq-grid, .special-grid-paddings) .k-pager-info,
:is(.eq-grid, .special-grid-paddings) .k-pager-numbers .k-link {
    color: #fff !important;
}
:is(.eq-grid, .special-grid-paddings) .k-pager-numbers .k-link.k-state-selected,
:is(.eq-grid, .special-grid-paddings) .k-pager-numbers .k-selected {
    background: var(--pga-gold) !important;
    color: var(--pga-navy-deep) !important;
    border-color: var(--pga-gold) !important;
}

/* Edit inputs inside grid retain readable look */
:is(.eq-grid, .special-grid-paddings) .k-input-inner,
:is(.eq-grid, .special-grid-paddings) input.k-input-inner,
:is(.eq-grid, .special-grid-paddings) .k-numerictextbox .k-input-inner {
    color: #111 !important;
}

/* Anchor tags in cells (Name templates, etc.) */
:is(.eq-grid, .special-grid-paddings) td a {
    color: #fff !important;
    text-decoration: none;
    font-weight: 600;
}
:is(.eq-grid, .special-grid-paddings) td a:hover {
    color: var(--pga-gold) !important;
    text-decoration: underline;
}

/* Sticky-header opt-in helper */
:is(.eq-grid, .special-grid-paddings).eq-sticky-header .k-grid-header {
    position: sticky;
    top: 0;
    z-index: 5;
    backdrop-filter: blur(4px);
}

/* Scrollbar */
:is(.eq-grid, .special-grid-paddings) .k-grid-content::-webkit-scrollbar { width: 10px; height: 10px; }
:is(.eq-grid, .special-grid-paddings) .k-grid-content::-webkit-scrollbar-track { background: rgba(255,255,255,0.04); }
:is(.eq-grid, .special-grid-paddings) .k-grid-content::-webkit-scrollbar-thumb {
    background: rgba(255,255,255,0.20);
    border-radius: 5px;
}
:is(.eq-grid, .special-grid-paddings) .k-grid-content::-webkit-scrollbar-thumb:hover {
    background: rgba(255,184,28,0.5);
}

/* ============================================================
   PGA dark-theme skin for Telerik DropDownLists / ComboBoxes
   Excludes dropdowns INSIDE grid cells (those keep light editor look)
   ============================================================ */

/* Picker container — dark surface with gold accent on focus */
.k-dropdownlist.k-picker,
.k-combobox.k-picker,
.k-multiselect.k-picker,
.k-datepicker.k-picker,
.k-timepicker.k-picker {
    background: var(--pga-surface-alt) !important;
    border: 1px solid rgba(255,255,255,0.20) !important;
    border-radius: 4px !important;
    color: #fff !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.3);
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

/* Re-allow Telerik defaults inside grids (inline editors stay white) */
:is(.eq-grid, .special-grid-paddings) .k-dropdownlist.k-picker,
:is(.eq-grid, .special-grid-paddings) .k-combobox.k-picker,
:is(.eq-grid, .special-grid-paddings) .k-datepicker.k-picker {
    background: #fff !important;
    border: 1px solid rgba(0,0,0,0.20) !important;
    color: #111 !important;
    box-shadow: none;
}
:is(.eq-grid, .special-grid-paddings) .k-dropdownlist .k-input-value-text,
:is(.eq-grid, .special-grid-paddings) .k-combobox .k-input-inner {
    color: #111 !important;
}

/* Hover */
.k-dropdownlist.k-picker:hover,
.k-combobox.k-picker:hover,
.k-multiselect.k-picker:hover,
.k-datepicker.k-picker:hover {
    border-color: rgba(255, 184, 28, 0.55) !important;
    background: var(--pga-surface) !important;
}

/* Focus / open state */
.k-dropdownlist.k-picker.k-focus,
.k-dropdownlist.k-picker:focus-within,
.k-combobox.k-picker.k-focus,
.k-combobox.k-picker:focus-within,
.k-multiselect.k-picker.k-focus,
.k-datepicker.k-picker.k-focus {
    border-color: var(--pga-gold) !important;
    box-shadow: 0 0 0 2px rgba(255,184,28,0.25) !important;
    outline: none !important;
}

/* Picker text */
.k-dropdownlist .k-input-inner,
.k-dropdownlist .k-input-value-text,
.k-combobox .k-input-inner,
.k-combobox input.k-input-inner,
.k-multiselect .k-input-inner,
.k-datepicker .k-input-inner {
    color: #fff !important;
    font-family: 'Inter', 'Helvetica Neue', sans-serif !important;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: 0.02em;
    padding: 6px 10px !important;
}

/* Re-allow grid editors to be readable */
:is(.eq-grid, .special-grid-paddings) .k-input-inner,
:is(.eq-grid, .special-grid-paddings) input.k-input-inner {
    color: #111 !important;
}

/* Dropdown arrow button */
.k-picker .k-input-button,
.k-picker .k-button.k-icon-button {
    background: transparent !important;
    border: none !important;
    color: var(--pga-gold) !important;
}

.k-picker .k-input-button:hover,
.k-picker .k-button.k-icon-button:hover {
    background: rgba(255,184,28,0.10) !important;
    color: var(--pga-gold-hover) !important;
}

.k-picker .k-button-icon,
.k-picker .k-svg-icon {
    color: var(--pga-gold) !important;
    fill: currentColor !important;
}

/* Placeholder */
.k-dropdownlist .k-input-inner::placeholder,
.k-combobox .k-input-inner::placeholder {
    color: rgba(255,255,255,0.45) !important;
}

/* ----- Popup list (the menu that opens) ----- */
.k-popup.k-list-container,
.k-animation-container .k-list-container,
.k-animation-container .k-popup {
    background: var(--pga-navy-deep) !important;
    border: 1px solid var(--pga-gold) !important;
    border-radius: 4px !important;
    box-shadow: 0 12px 32px rgba(0,0,0,0.55) !important;
}

.k-list,
.k-list-content,
.k-list-ul {
    background: transparent !important;
    color: var(--pga-text) !important;
}

.k-list-item,
.k-list .k-list-item {
    background: transparent !important;
    color: var(--pga-text) !important;
    font-family: 'Inter', sans-serif !important;
    font-size: 13px;
    padding: 7px 12px !important;
    border-left: 3px solid transparent;
    transition: background 0.12s, color 0.12s, border-color 0.12s;
}

.k-list-item:hover,
.k-list-item.k-hover {
    background: var(--pga-navy-light) !important;
    color: var(--pga-gold) !important;
    border-left-color: var(--pga-gold);
}

.k-list-item.k-selected,
.k-list-item[aria-selected="true"] {
    background: rgba(255,184,28,0.18) !important;
    color: #fff !important;
    border-left-color: var(--pga-gold);
    font-weight: 600;
}

.k-list-item.k-selected:hover,
.k-list-item[aria-selected="true"]:hover {
    background: rgba(255,184,28,0.28) !important;
}

/* Search box inside dropdown popups */
.k-list-filter .k-input,
.k-list-filter .k-textbox {
    background: var(--pga-surface-alt) !important;
    border: 1px solid rgba(255,255,255,0.20) !important;
    color: #fff !important;
}

/* TelerikButton brand styling */
.k-button-solid-primary,
.k-button-solid-base.k-primary {
    background: var(--pga-gold) !important;
    color: var(--pga-navy-deep) !important;
    border-color: var(--pga-gold) !important;
    font-family: 'Oswald', sans-serif !important;
    font-weight: 600;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}
.k-button-solid-primary:hover,
.k-button-solid-base.k-primary:hover {
    background: var(--pga-gold-hover) !important;
    border-color: var(--pga-gold-hover) !important;
}

/* ============================================================
   PGA dark-theme skin for TelerikWindow / TelerikDialog popups
   (Match details, "Team X as of <date>" popup, etc.)
   ============================================================ */

/* The window shell */
.k-window,
.k-dialog,
.k-window-wrapper {
    background: var(--pga-navy-deep) !important;
    color: var(--pga-text) !important;
    border: 1px solid var(--pga-gold) !important;
    border-radius: 6px !important;
    box-shadow: 0 16px 48px rgba(0,0,0,0.7) !important;
}

/* Title bar — gold-underlined, Oswald uppercase */
.k-window-titlebar,
.k-dialog-titlebar,
.k-window-title,
.k-dialog-title {
    background: var(--pga-navy) !important;
    color: #fff !important;
    border-bottom: 2px solid var(--pga-gold) !important;
    font-family: 'Oswald', 'Arial Narrow', sans-serif !important;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

/* Min/max/close icons in the title bar */
.k-window-titlebar .k-button,
.k-dialog-titlebar .k-button,
.k-window-titlebar .k-icon,
.k-window-titlebar .k-svg-icon,
.k-window-actions .k-button .k-button-icon {
    color: var(--pga-gold) !important;
    background: transparent !important;
}
.k-window-titlebar .k-button:hover,
.k-dialog-titlebar .k-button:hover {
    background: rgba(255,184,28,0.10) !important;
}

/* Body */
.k-window-content,
.k-dialog-content {
    background: var(--pga-navy-deep) !important;
    color: var(--pga-text) !important;
}

/* The "drag a column header" group bar above grids inside popups */
.k-window-content .k-grid-toolbar,
.k-window-content .k-grouping-header,
.k-dialog-content .k-grouping-header {
    background: rgba(255,255,255,0.04) !important;
    color: var(--pga-text) !important;
    border-color: rgba(255,255,255,0.10) !important;
}

/* Read-only "form-ish" text input boxes inside the Match popup
   (the Telerik form just renders <input readonly>) — flip from
   the white-with-black-text default to dark surface + light text. */
.k-window-content input,
.k-window-content input[type="text"],
.k-window-content .k-textbox,
.k-window-content .k-input,
.k-dialog-content input {
    background: var(--pga-surface-alt) !important;
    color: var(--pga-text) !important;
    border: 1px solid rgba(255,255,255,0.20) !important;
    border-radius: 3px;
}

/* The gray inline-border divs the page uses for layout cells
   (the TeamScore Match popup uses <div style="border: 1px gray solid;">).
   Re-skin them by class so the inline `gray` stops winning visually. */
.k-window-content [style*="border: 1px gray solid"],
.k-window-content [style*="border:1px gray solid"],
.k-dialog-content [style*="border: 1px gray solid"],
.k-dialog-content [style*="border:1px gray solid"] {
    background: var(--pga-surface) !important;
    color: var(--pga-text) !important;
    border-color: var(--pga-gold) !important;
    padding: 4px 8px;
    border-radius: 3px;
}

/* Section labels inside the popup ("Total Score", "Team Participation",
   "PARTICIPATION PTS", "BIRDIES", "Other Members") get a brand-coloured
   eyebrow treatment instead of bare gray text. */
.k-window-content .k-grid-layout div[style*="border"] {
    font-family: 'Inter', sans-serif;
    line-height: 1.4;
}

/* Grids rendered inside windows pick up the eq-grid skin without
   needing the class — make them legible against the dark window. */
.k-window-content .k-grid,
.k-dialog-content .k-grid {
    background: transparent !important;
    color: var(--pga-text) !important;
    border-color: rgba(255,255,255,0.10) !important;
}
.k-window-content .k-grid-header,
.k-window-content .k-grid-header th,
.k-dialog-content .k-grid-header,
.k-dialog-content .k-grid-header th {
    background: rgba(255,255,255,0.06) !important;
    color: #fff !important;
    border-bottom: 2px solid var(--pga-gold) !important;
}
.k-window-content .k-grid tr,
.k-window-content .k-grid td,
.k-window-content .k-grid .k-table-td,
.k-dialog-content .k-grid tr,
.k-dialog-content .k-grid td {
    background: transparent !important;
    color: #fff !important;
    border-color: rgba(255,255,255,0.06) !important;
}
.k-window-content .k-grid tr:hover > td,
.k-dialog-content .k-grid tr:hover > td {
    background: rgba(255,184,28,0.10) !important;
}
.k-window-content .k-grid a,
.k-dialog-content .k-grid a {
    color: #fff !important;
    text-decoration: none;
    font-weight: 600;
}
.k-window-content .k-grid a:hover,
.k-dialog-content .k-grid a:hover {
    color: var(--pga-gold) !important;
    text-decoration: underline;
}

/* "Members: 11" / "Events: 17" status row at the bottom of the Team popup */
.k-window-content .k-grid-footer,
.k-window-content .k-grid-footer-wrap,
.k-window-content tfoot td,
.k-dialog-content .k-grid-footer,
.k-dialog-content tfoot td {
    background: rgba(255,255,255,0.04) !important;
    color: #fff !important;
    border-top: 1px solid rgba(255,255,255,0.10) !important;
}

/* Modal backdrop — subtle dim instead of bright Telerik default */
.k-overlay {
    background-color: rgba(0,0,0,0.55) !important;
}

/* ============================================================
   Group-by drop zone — "Drag a column header and drop it here…"
   bar that appears above any TelerikGrid with Groupable="true".
   ============================================================ */
.k-grouping-header,
.k-grid .k-grouping-header,
.k-grouping-header-flex {
    background: rgba(255,255,255,0.04) !important;
    color: rgba(255,255,255,0.55) !important;
    border-bottom: 1px solid rgba(255,255,255,0.10) !important;
    font-style: italic;
    padding: 8px 12px !important;
}

/* Chips for already-grouped fields (e.g. you drag "Team" onto the bar) */
.k-grouping-header .k-group-indicator,
.k-grouping-header .k-chip {
    background: linear-gradient(180deg, var(--pga-navy-light) 0%, var(--pga-navy) 100%) !important;
    color: #fff !important;
    border: 1px solid var(--pga-gold) !important;
    border-radius: 999px !important;
    padding: 3px 12px !important;
    font-family: 'Oswald', 'Arial Narrow', sans-serif !important;
    font-weight: 600 !important;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-size: 11.5px;
    font-style: normal;
}

/* ============================================================
   Telerik buttons — the white "Details" / "Team Baker" pills.
   The primary variant already gets gold; theme the base/flat
   variants too so command-column + cell-template buttons match.
   ============================================================ */

/* Default solid button (used by GridCommandButton + TelerikButton
   without ThemeColor) — dark surface, light text, gold accent. */
.k-button-solid-base,
.k-button:not(.k-button-solid-primary):not(.k-input-button) {
    background: var(--pga-surface-alt) !important;
    color: #fff !important;
    border: 1px solid rgba(255,255,255,0.20) !important;
    font-family: 'Inter', sans-serif !important;
    font-weight: 500;
    transition: background 0.12s, border-color 0.12s, color 0.12s;
}

.k-button-solid-base:hover,
.k-button:not(.k-button-solid-primary):not(.k-input-button):hover {
    background: var(--pga-surface) !important;
    border-color: var(--pga-gold) !important;
    color: var(--pga-gold) !important;
}

.k-button-solid-base:active,
.k-button:not(.k-button-solid-primary):not(.k-input-button):active {
    background: rgba(255,184,28,0.16) !important;
    color: #fff !important;
}

/* Telerik flat / link buttons — keep them transparent so they don't
   overpower the cell, but use the gold accent on hover. */
.k-button-flat-base,
.k-button-link-base {
    background: transparent !important;
    color: var(--pga-text) !important;
}
.k-button-flat-base:hover,
.k-button-link-base:hover {
    color: var(--pga-gold) !important;
    background: rgba(255,184,28,0.08) !important;
}

/* Buttons that live inside a grid command column or as a cell template */
.k-grid .k-grid-content .k-button,
.k-grid td .k-button {
    padding: 3px 10px;
    font-size: 12px;
    border-radius: 3px;
}

/* Button-icon (left-side icons on command buttons) stays gold so it
   reads as the brand accent even at rest. */
.k-grid .k-button .k-button-icon,
.k-grid .k-button .k-svg-icon {
    color: var(--pga-gold) !important;
}

/* ============================================================
   TelerikSpreadsheet (SeasonView / Season pages — playoff bracket)
   Cells keep their data-driven backgrounds (yellow/red/blue/orange
   for the bracket diagram); only the chrome goes dark.
   ============================================================ */

/* Outer container — sit on a dark frame instead of bare white */
.k-spreadsheet {
    background: var(--pga-navy-deep) !important;
    border: 1px solid var(--pga-gold) !important;
    border-radius: 4px;
    box-shadow: 0 2px 12px rgba(0,0,0,0.35);
}

/* Row-number column (1, 2, 3, …) and Column-letter row (A, B, C, …)
   — hidden entirely; the bracket reads on its own without coordinates. */
.k-spreadsheet-row-header,
.k-spreadsheet-column-header,
.k-spreadsheet-pane .k-spreadsheet-column-header,
.k-spreadsheet-pane .k-spreadsheet-row-header,
.k-spreadsheet-header,
.k-spreadsheet .k-spreadsheet-top-corner,
.k-spreadsheet-top-corner {
    display: none !important;
}

/* Default cell text — white so unstyled cells read on the dark page.
   Data-driven cells (yellow, red, orange, etc. with their own text
   colors) override this via inline styles. */
.k-spreadsheet-cell,
.k-spreadsheet .k-spreadsheet-cell,
.k-spreadsheet-pane .k-spreadsheet-cell {
    color: #fff !important;
}

/* Sheet tabs at the bottom ("Sheet1" tab strip) */
.k-spreadsheet-sheets-bar,
.k-spreadsheet-sheets-remove,
.k-spreadsheet-sheets-bar .k-spreadsheet-quick-access-toolbar,
.k-spreadsheet-tabstrip {
    background: var(--pga-navy) !important;
    color: #fff !important;
    border-color: rgba(255,255,255,0.20) !important;
}

.k-spreadsheet-sheets-bar .k-button {
    color: #fff !important;
    background: transparent !important;
}
.k-spreadsheet-sheets-bar .k-button:hover {
    color: var(--pga-gold) !important;
    background: rgba(255,184,28,0.10) !important;
}

.k-spreadsheet-sheets-bar .k-sheets-bar-active,
.k-spreadsheet-sheets-bar .k-tabstrip-item.k-state-active,
.k-spreadsheet-sheets-bar .k-tabstrip-item.k-selected {
    background: var(--pga-surface-alt) !important;
    color: var(--pga-gold) !important;
    border-top: 2px solid var(--pga-gold) !important;
}

/* Scrollbars inside the spreadsheet */
.k-spreadsheet ::-webkit-scrollbar { width: 10px; height: 10px; }
.k-spreadsheet ::-webkit-scrollbar-track { background: rgba(255,255,255,0.04); }
.k-spreadsheet ::-webkit-scrollbar-thumb {
    background: rgba(255,255,255,0.20);
    border-radius: 5px;
}
.k-spreadsheet ::-webkit-scrollbar-thumb:hover {
    background: rgba(255,184,28,0.5);
}

/* Cell gridlines — light grey so they read as unobtrusive structure on
   the dark page. The bracket cells set their own gold/orange/etc.
   border colors inline (`border: 1px solid <hex>`), which win because
   we don't !important the border-color here. The 2px width still
   applies to everyone so the bracket lines are thicker too. */
.k-spreadsheet-cell,
.k-spreadsheet .k-spreadsheet-cell,
.k-spreadsheet-pane .k-spreadsheet-cell {
    border-width: 2px !important;
    border-style: solid !important;
    border-color: rgba(255,255,255,0.20);  /* light grey, ~20% white */
}

/* Cells whose data carries a WHITE background — strip it so the dark
   theme shows through (covers the various ways "white" gets emitted:
   "white", "#fff", "#ffffff", and rgb(255, 255, 255)). */
.k-spreadsheet-cell[style*="background-color: white"],
.k-spreadsheet-cell[style*="background-color: #fff;"],
.k-spreadsheet-cell[style*="background-color:#fff;"],
.k-spreadsheet-cell[style*="background-color: #ffffff"],
.k-spreadsheet-cell[style*="background-color:#ffffff"],
.k-spreadsheet-cell[style*="background-color: #FFFFFF"],
.k-spreadsheet-cell[style*="background-color:#FFFFFF"],
.k-spreadsheet-cell[style*="background-color: rgb(255, 255, 255)"],
.k-spreadsheet-cell[style*="background-color:rgb(255,255,255)"] {
    background-color: transparent !important;
    color: #fff !important;
}

/* Cells whose data carries a YELLOW background — keep the yellow fill
   but force BLACK text for readability (covers the common yellow hex
   codes Telerik can emit). */
.k-spreadsheet-cell[style*="background-color: yellow"],
.k-spreadsheet-cell[style*="background-color: #ff0"],
.k-spreadsheet-cell[style*="background-color:#ff0"],
.k-spreadsheet-cell[style*="background-color: #FF0"],
.k-spreadsheet-cell[style*="background-color:#FF0"],
.k-spreadsheet-cell[style*="background-color: #ffff00"],
.k-spreadsheet-cell[style*="background-color:#ffff00"],
.k-spreadsheet-cell[style*="background-color: #FFFF00"],
.k-spreadsheet-cell[style*="background-color:#FFFF00"],
.k-spreadsheet-cell[style*="background-color: rgb(255, 255, 0)"],
.k-spreadsheet-cell[style*="background-color:rgb(255,255,0)"] {
    color: #000 !important;
    font-weight: 600;
}