/* ==========================================================================
   RDB Theme — Blue Yu-Gi-Oh (matching logo)
   ========================================================================== */

/* ── Palette ─────────────────────────────────────────────────────────────── */
:root,
[data-bs-theme="dark"] {
    /* Core — deep navy from the logo background */
    --rdb-bg:           #06101e;
    --rdb-surface:      #0c1a2e;
    --rdb-surface-2:    #112240;
    --rdb-surface-3:    #183058;
    --rdb-border:       #1e3a5f;

    /* Accent — the bright blues from the logo */
    --rdb-blue:         #1a8fd1;
    --rdb-blue-lt:      #4fb8e8;
    --rdb-blue-dk:      #126ea5;
    --rdb-cyan:         #29b6f6;

    /* Secondary accents */
    --rdb-red:          #d32f2f;
    --rdb-green:        #388e3c;
    --rdb-orange:       #e6a817;
    --rdb-gold:         #f0c040;

    /* Text */
    --rdb-text:         #b8cce0;
    --rdb-text-dim:     #6a8baa;
    --rdb-text-bright:  #e8f0ff;

    /* Bootstrap overrides */
    --bs-body-bg:               var(--rdb-bg);
    --bs-body-color:            var(--rdb-text);
    --bs-emphasis-color:        var(--rdb-text-bright);
    --bs-secondary-color:       var(--rdb-text-dim);
    --bs-tertiary-color:        var(--rdb-text-dim);
    --bs-border-color:          var(--rdb-border);
    --bs-link-color:            var(--rdb-cyan);
    --bs-link-hover-color:      var(--rdb-blue-lt);
    --bs-card-bg:               var(--rdb-surface);
    --bs-card-border-color:     var(--rdb-border);
    --bs-card-cap-bg:           var(--rdb-surface-2);
    --bs-modal-bg:              var(--rdb-surface);
    --bs-modal-border-color:    var(--rdb-border);
    --bs-tertiary-bg:           var(--rdb-surface-2);
    --bs-secondary-bg:          var(--rdb-surface-2);
    --bs-primary-rgb:           26,143,209;
    --bs-heading-color:         var(--rdb-text-bright);
}

/* ── Base ────────────────────────────────────────────────────────────────── */
body {
    background: var(--rdb-bg) !important;
    color: var(--rdb-text) !important;
}

::selection {
    background: var(--rdb-blue);
    color: #fff;
}

a            { color: var(--rdb-cyan); }
a:hover      { color: var(--rdb-blue-lt); }
hr           { border-color: var(--rdb-border); opacity: .4; }
h1,h2,h3,h4,h5,h6 { color: var(--rdb-text-bright); }

/* ── Navbar ──────────────────────────────────────────────────────────────── */
.navbar-rdb {
    background: linear-gradient(180deg, #081828 0%, var(--rdb-surface) 100%) !important;
    border-bottom: 2px solid var(--rdb-blue-dk);
    padding: .4rem 1rem;
}
.navbar-rdb .navbar-brand {
    color: #fff !important;
    font-weight: 700;
    font-size: 1.2rem;
    letter-spacing: 1px;
    display: flex;
    align-items: center;
    gap: .5rem;
    padding: 0;
}
.navbar-rdb .navbar-brand img {
    height: 38px;
    width: auto;
    border-radius: 4px;
}
.navbar-rdb .nav-link {
    color: var(--rdb-text) !important;
    font-weight: 500;
    padding: .55rem .9rem !important;
    border-radius: 6px;
    transition: background .15s, color .15s;
}
.navbar-rdb .nav-link:hover {
    color: var(--rdb-cyan) !important;
    background: rgba(26,143,209,.08);
}
.navbar-rdb .nav-link.active {
    color: var(--rdb-cyan) !important;
    background: rgba(26,143,209,.14);
}
.navbar-rdb .dropdown-menu {
    background: var(--rdb-surface);
    border: 1px solid var(--rdb-border);
}
.navbar-rdb .dropdown-item {
    color: var(--rdb-text);
}
.navbar-rdb .dropdown-item:hover,
.navbar-rdb .dropdown-item:focus {
    background: var(--rdb-surface-2);
    color: var(--rdb-cyan);
}
.navbar-rdb .dropdown-item.active {
    background: rgba(26,143,209,.14) !important;
    color: var(--rdb-cyan) !important;
    border-left: 3px solid var(--rdb-cyan);
}
.navbar-rdb .dropdown-divider {
    border-color: var(--rdb-border);
}
.navbar-toggler-icon {
    filter: invert(1);
}

/* ── Cards ───────────────────────────────────────────────────────────────── */
.card {
    background: var(--rdb-surface) !important;
    border: 1px solid var(--rdb-border) !important;
    border-radius: 8px;
    color: var(--rdb-text);
}
.card-header {
    background: var(--rdb-surface-2) !important;
    border-bottom: 1px solid var(--rdb-border) !important;
    color: var(--rdb-text-bright);
}
.card-body { color: var(--rdb-text); }
.card-footer {
    background: var(--rdb-surface-2) !important;
    border-top: 1px solid var(--rdb-border) !important;
}

a:hover > .card,
a:hover .card {
    border-color: var(--rdb-blue) !important;
    transform: translateY(-3px);
    box-shadow: 0 6px 20px rgba(26,143,209,.12);
}
a > .card, a .card {
    transition: transform .2s, border-color .2s, box-shadow .2s;
}

/* Banlist coloured cards */
.card.border-danger  { border-color: var(--rdb-red) !important; }
.card.border-danger  > .card-header { background: var(--rdb-red) !important; color: #fff; }
.card.border-warning { border-color: var(--rdb-orange) !important; }
.card.border-warning > .card-header { background: var(--rdb-orange) !important; color: #000; }
.card.border-info    { border-color: var(--rdb-blue) !important; }
.card.border-info    > .card-header { background: var(--rdb-blue) !important; color: #fff; }

/* ── Tables ──────────────────────────────────────────────────────────────── */
.table {
    --bs-table-bg:            transparent;
    --bs-table-color:         var(--rdb-text);
    --bs-table-border-color:  var(--rdb-border);
    --bs-table-striped-bg:    rgba(255,255,255,.02);
    --bs-table-hover-bg:      rgba(26,143,209,.05);
    --bs-table-hover-color:   var(--rdb-text);
}
.table > thead > tr > th {
    background: var(--rdb-surface-2) !important;
    color: var(--rdb-cyan) !important;
    font-weight: 600;
    font-size: .78rem;
    text-transform: uppercase;
    letter-spacing: .5px;
    border-bottom: 2px solid var(--rdb-blue-dk) !important;
}
.table > tbody > tr > td {
    vertical-align: middle;
    border-color: var(--rdb-border);
}

/* ── Buttons ─────────────────────────────────────────────────────────────── */
.btn-primary,
.btn-primary:active {
    background: linear-gradient(135deg, var(--rdb-blue-dk), var(--rdb-blue)) !important;
    border: none !important;
    color: #fff !important;
    font-weight: 600;
}
.btn-primary:hover {
    background: linear-gradient(135deg, var(--rdb-blue), var(--rdb-blue-lt)) !important;
    color: #fff !important;
    box-shadow: 0 0 14px rgba(26,143,209,.3);
}
.btn-primary:focus-visible {
    box-shadow: 0 0 0 .25rem rgba(26,143,209,.35) !important;
}

.btn-outline-primary {
    color: var(--rdb-cyan) !important;
    border-color: var(--rdb-blue) !important;
}
.btn-outline-primary:hover {
    background: var(--rdb-blue) !important;
    color: #fff !important;
}

.btn-secondary,
.btn-secondary:active {
    background: var(--rdb-surface-3) !important;
    border-color: var(--rdb-border) !important;
    color: var(--rdb-text) !important;
}
.btn-secondary:hover {
    background: var(--rdb-surface-2) !important;
    color: var(--rdb-text-bright) !important;
}

.btn-outline-secondary {
    color: var(--rdb-text-dim) !important;
    border-color: var(--rdb-border) !important;
}
.btn-outline-secondary:hover {
    background: var(--rdb-surface-2) !important;
    color: var(--rdb-text) !important;
    border-color: var(--rdb-border) !important;
}

.btn-success { background: var(--rdb-green) !important; border-color: var(--rdb-green) !important; }
.btn-outline-danger { color: var(--rdb-red) !important; border-color: var(--rdb-red) !important; }
.btn-outline-danger:hover { background: var(--rdb-red) !important; color: #fff !important; }

/* ── Badges ──────────────────────────────────────────────────────────────── */
.badge              { font-weight: 600; padding: .35em .6em; border-radius: 5px; }
.badge-draft        { background: var(--rdb-surface-3) !important; color: var(--rdb-text-dim) !important; }
.badge-registration { background: var(--rdb-green) !important; color: #fff !important; }
.badge-closed       { background: var(--rdb-orange) !important; color: #000 !important; }
.badge-in-progress  { background: var(--rdb-blue) !important; color: #fff !important; }
.badge-completed    { background: var(--rdb-cyan) !important; color: #000 !important; }
.badge-cancelled    { background: var(--rdb-red) !important; color: #fff !important; }
.badge.bg-gold      { background: var(--rdb-gold) !important; color: #000 !important; }

/* ── Forms ───────────────────────────────────────────────────────────────── */
.form-control,
.form-select {
    background-color: var(--rdb-surface-2) !important;
    border: 1px solid var(--rdb-border) !important;
    color: var(--rdb-text) !important;
}
.form-control:focus,
.form-select:focus {
    background-color: var(--rdb-surface-3) !important;
    border-color: var(--rdb-blue) !important;
    color: var(--rdb-text-bright) !important;
    box-shadow: 0 0 0 .2rem rgba(26,143,209,.18) !important;
}
.form-control::placeholder { color: var(--rdb-text-dim) !important; }
.form-label { color: var(--rdb-text); font-weight: 500; }
.form-check-input {
    background-color: var(--rdb-surface-2) !important;
    border-color: var(--rdb-border) !important;
}
.form-check-input:checked {
    background-color: var(--rdb-blue) !important;
    border-color: var(--rdb-blue) !important;
}
.form-check-label { color: var(--rdb-text); }
.is-invalid { border-color: var(--rdb-red) !important; }
.invalid-feedback { color: #ef5350; }

/* ── Nav Tabs ────────────────────────────────────────────────────────────── */
.nav-tabs { border-bottom: 2px solid var(--rdb-border); }
.nav-tabs .nav-link {
    color: var(--rdb-text-dim);
    border: none;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    padding: .55rem 1rem;
    font-weight: 500;
}
.nav-tabs .nav-link:hover {
    color: var(--rdb-blue-lt);
    border-bottom-color: var(--rdb-blue-dk);
    background: transparent;
}
.nav-tabs .nav-link.active {
    color: var(--rdb-cyan) !important;
    background: transparent !important;
    border-color: transparent !important;
    border-bottom-color: var(--rdb-cyan) !important;
}

/* ── Alerts ──────────────────────────────────────────────────────────────── */
.alert-success { background: rgba(56,142,60,.15) !important; color: #81c784 !important; border-left: 4px solid var(--rdb-green); border-top:0;border-right:0;border-bottom:0; }
.alert-danger  { background: rgba(211,47,47,.15) !important; color: #ef5350 !important; border-left: 4px solid var(--rdb-red); border-top:0;border-right:0;border-bottom:0; }
.alert-warning { background: rgba(230,168,23,.15) !important; color: var(--rdb-orange) !important; border-left: 4px solid var(--rdb-orange); border-top:0;border-right:0;border-bottom:0; }
.alert-info    { background: rgba(26,143,209,.15) !important; color: var(--rdb-blue-lt) !important; border-left: 4px solid var(--rdb-blue); border-top:0;border-right:0;border-bottom:0; }
.alert .btn-close { filter: invert(1) grayscale(100%) brightness(200%); }

/* ── Modals ──────────────────────────────────────────────────────────────── */
.modal-content {
    background: var(--rdb-surface) !important;
    border: 1px solid var(--rdb-border) !important;
}
.modal-header {
    border-bottom-color: var(--rdb-border) !important;
    color: var(--rdb-text-bright);
}
.modal-header .modal-title { color: var(--rdb-text-bright); }
.modal-header .btn-close { filter: invert(1) grayscale(100%) brightness(200%); }
.modal-footer { border-top-color: var(--rdb-border) !important; }

/* ── List Groups ─────────────────────────────────────────────────────────── */
.list-group-item {
    background-color: var(--rdb-surface) !important;
    border-color: var(--rdb-border) !important;
    color: var(--rdb-text) !important;
}
.list-group-item-action:hover,
.list-group-item-action:focus {
    background-color: var(--rdb-surface-2) !important;
    color: var(--rdb-cyan) !important;
}
.list-group-item-action.active {
    background-color: var(--rdb-surface-3) !important;
    border-color: var(--rdb-border) !important;
    color: var(--rdb-cyan) !important;
    border-left: 3px solid var(--rdb-blue) !important;
}

/* ── Pagination ──────────────────────────────────────────────────────────── */
.page-link {
    background-color: var(--rdb-surface) !important;
    border-color: var(--rdb-border) !important;
    color: var(--rdb-text) !important;
}
.page-link:hover {
    background-color: var(--rdb-surface-2) !important;
    color: var(--rdb-cyan) !important;
}
.page-item.active .page-link {
    background-color: var(--rdb-blue) !important;
    border-color: var(--rdb-blue) !important;
    color: #fff !important;
}
.page-item.disabled .page-link {
    background-color: var(--rdb-bg) !important;
    color: var(--rdb-text-dim) !important;
}

/* ── Text helpers ────────────────────────────────────────────────────────── */
.text-muted   { color: var(--rdb-text-dim) !important; }
.text-gold    { color: var(--rdb-gold) !important; }
.text-rdb     { color: var(--rdb-cyan) !important; }
.text-success { color: #81c784 !important; }
.text-danger  { color: #ef5350 !important; }
.text-dark    { color: var(--rdb-text) !important; }
.text-white   { color: #fff !important; }
.border-bottom { border-color: var(--rdb-border) !important; }

/* dl/dt/dd */
dt { color: var(--rdb-text-dim); font-size: .82rem; text-transform: uppercase; letter-spacing: .4px; margin-bottom: .1rem; }
dd { color: var(--rdb-text-bright); margin-bottom: .7rem; }

/* ── Blue divider ────────────────────────────────────────────────────────── */
.divider-gold {
    height: 2px;
    background: linear-gradient(90deg, transparent, var(--rdb-blue-dk), var(--rdb-blue), var(--rdb-blue-dk), transparent);
    border: none;
    margin: 1rem 0 1.5rem;
}

/* ── Stat cards (dashboard / landing) ────────────────────────────────────── */
.stat-card {
    text-align: center;
    padding: 1.5rem 1rem;
    border: 1px solid var(--rdb-border);
    border-radius: 8px;
    background: var(--rdb-surface);
    transition: border-color .2s, box-shadow .2s;
}
.stat-card:hover {
    border-color: var(--rdb-blue);
    box-shadow: 0 0 18px rgba(26,143,209,.12);
}
.stat-card .stat-icon {
    font-size: 2rem;
    color: var(--rdb-cyan);
    margin-bottom: .4rem;
}
.stat-card .stat-label {
    color: var(--rdb-text-dim);
    font-size: .82rem;
    text-transform: uppercase;
    letter-spacing: .5px;
}

/* ── Card grid (Yu-Gi-Oh cards) ──────────────────────────────────────────── */
.card-grid-item .card {
    overflow: hidden;
}
.card-grid-item .card-img-top {
    transition: transform .25s;
}
.card-grid-item:hover .card-img-top {
    transform: scale(1.04);
}
.card-grid-item .card-body {
    background: var(--rdb-surface-2) !important;
}

/* ── Winner highlight ────────────────────────────────────────────────────── */
.winner-highlight {
    color: var(--rdb-cyan) !important;
    font-weight: 700;
}

/* ── Sticky form footer ──────────────────────────────────────────────────── */
.form-actions-sticky {
    background: var(--rdb-surface);
    border-top: 2px solid var(--rdb-blue-dk);
    box-shadow: 0 -4px 12px rgba(0,0,0,.5);
}

/* ── Deck card images ────────────────────────────────────────────────────── */
.deck-card-img {
    width: 45px;
    height: 65px;
    object-fit: cover;
    border-radius: 3px;
    border: 1px solid var(--rdb-border);
    transition: transform .15s, box-shadow .15s;
    cursor: pointer;
}
.deck-card-img:hover {
    transform: scale(2.5);
    z-index: 10;
    position: relative;
    box-shadow: 0 4px 20px rgba(0,0,0,.7);
    border-color: var(--rdb-blue);
}

.deck-card-placeholder {
    width: 45px;
    height: 65px;
    border-radius: 3px;
    border: 1px solid var(--rdb-border);
    background: var(--rdb-surface-2);
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 2px;
    overflow: hidden;
    cursor: pointer;
    color: var(--rdb-text-dim);
    font-size: .5rem;
    line-height: 1.1;
}
.deck-card-placeholder:hover {
    border-color: var(--rdb-blue);
    color: var(--rdb-text);
}

/* ── Sidebar navigation layout ────────────────────────────────────────── */
.has-sidebar-nav .sidebar-main-content {
    margin-left: 240px;
}
@media (max-width: 991.98px) {
    .has-sidebar-nav .sidebar-main-content {
        margin-left: 0;
    }
    .has-sidebar-nav .d-flex.vh-100 {
        position: static !important;
        width: 100% !important;
        height: auto !important;
        border-right: none !important;
        border-bottom: 1px solid var(--rdb-border);
    }
}

/* Progress bar override */
.progress {
    background-color: var(--rdb-surface-3) !important;
}

/* ── Scrollbar ───────────────────────────────────────────────────────────── */
html { scrollbar-color: var(--rdb-surface-3) var(--rdb-bg); }
::-webkit-scrollbar       { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: var(--rdb-bg); }
::-webkit-scrollbar-thumb { background: var(--rdb-surface-3); border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: var(--rdb-border); }

/* ==========================================================================
   Light Theme
   ========================================================================== */
[data-bs-theme="light"] {
    /* Core - clean white/grey surfaces */
    --rdb-bg:           #f5f7fa;
    --rdb-surface:      #ffffff;
    --rdb-surface-2:    #eef1f6;
    --rdb-surface-3:    #dde3ec;
    --rdb-border:       #c8d0dc;

    /* Accent - same blues, slightly deeper for contrast on white */
    --rdb-blue:         #1a7fb8;
    --rdb-blue-lt:      #2a9cd8;
    --rdb-blue-dk:      #105d8a;
    --rdb-cyan:         #1586c0;

    /* Secondary accents */
    --rdb-red:          #c62828;
    --rdb-green:        #2e7d32;
    --rdb-orange:       #d49a10;
    --rdb-gold:         #c8a020;

    /* Text */
    --rdb-text:         #3a4a5c;
    --rdb-text-dim:     #6b7d92;
    --rdb-text-bright:  #1a2332;

    /* Bootstrap overrides */
    --bs-body-bg:               var(--rdb-bg);
    --bs-body-color:            var(--rdb-text);
    --bs-emphasis-color:        var(--rdb-text-bright);
    --bs-secondary-color:       var(--rdb-text-dim);
    --bs-tertiary-color:        var(--rdb-text-dim);
    --bs-border-color:          var(--rdb-border);
    --bs-link-color:            var(--rdb-cyan);
    --bs-link-hover-color:      var(--rdb-blue-lt);
    --bs-card-bg:               var(--rdb-surface);
    --bs-card-border-color:     var(--rdb-border);
    --bs-card-cap-bg:           var(--rdb-surface-2);
    --bs-modal-bg:              var(--rdb-surface);
    --bs-modal-border-color:    var(--rdb-border);
    --bs-tertiary-bg:           var(--rdb-surface-2);
    --bs-secondary-bg:          var(--rdb-surface-2);
    --bs-primary-rgb:           26,127,184;
    --bs-heading-color:         var(--rdb-text-bright);
}

/* Light mode - navbar needs explicit styling */
[data-bs-theme="light"] .navbar-rdb {
    background: linear-gradient(180deg, #e8edf4 0%, var(--rdb-surface) 100%) !important;
    border-bottom: 2px solid var(--rdb-blue-dk);
}
[data-bs-theme="light"] .navbar-rdb .navbar-brand {
    color: var(--rdb-text-bright) !important;
}
[data-bs-theme="light"] .navbar-toggler-icon {
    filter: none;
}
[data-bs-theme="light"] .form-actions-sticky {
    box-shadow: 0 -4px 12px rgba(0,0,0,.1);
}
[data-bs-theme="light"] .alert .btn-close {
    filter: none;
}
[data-bs-theme="light"] .modal-header .btn-close {
    filter: none;
}
[data-bs-theme="light"] .alert-success { background: rgba(46,125,50,.1) !important; color: #2e7d32 !important; }
[data-bs-theme="light"] .alert-danger  { background: rgba(198,40,40,.1) !important; color: #c62828 !important; }
[data-bs-theme="light"] .alert-warning { background: rgba(212,154,16,.1) !important; color: #9a7000 !important; }
[data-bs-theme="light"] .alert-info    { background: rgba(26,127,184,.1) !important; color: #1a7fb8 !important; }
[data-bs-theme="light"] .text-success { color: #2e7d32 !important; }
[data-bs-theme="light"] .text-danger  { color: #c62828 !important; }
[data-bs-theme="light"] .invalid-feedback { color: #c62828; }
[data-bs-theme="light"] .stat-card:hover {
    box-shadow: 0 0 18px rgba(26,127,184,.15);
}
[data-bs-theme="light"] .deck-card-img:hover {
    box-shadow: 0 4px 20px rgba(0,0,0,.25);
}
[data-bs-theme="light"] html { scrollbar-color: var(--rdb-surface-3) var(--rdb-bg); }

/* ── Theme toggle button ────────────────────────────────────────────────── */
.btn-theme-toggle {
    background: none;
    border: none;
    color: var(--rdb-text);
    font-size: 1.1rem;
    padding: .35rem .5rem;
    border-radius: 6px;
    cursor: pointer;
    transition: color .15s, background .15s;
    line-height: 1;
}
.btn-theme-toggle:hover {
    color: var(--rdb-cyan);
    background: rgba(26,143,209,.08);
}

/* ── Toast notifications ────────────────────────────────────────────────── */
.toast-container-rdb {
    position: fixed;
    top: 1rem;
    right: 1rem;
    z-index: 1090;
    display: flex;
    flex-direction: column;
    gap: .5rem;
}
.toast-rdb {
    background: var(--rdb-surface) !important;
    border: 1px solid var(--rdb-border) !important;
    border-radius: 8px;
    color: var(--rdb-text) !important;
    box-shadow: 0 4px 20px rgba(0,0,0,.3);
    min-width: 300px;
    max-width: 420px;
}
.toast-rdb .toast-header {
    background: var(--rdb-surface-2) !important;
    border-bottom: 1px solid var(--rdb-border) !important;
    color: var(--rdb-text-bright) !important;
    border-radius: 8px 8px 0 0;
}
.toast-rdb .toast-header .btn-close {
    filter: invert(1) grayscale(100%) brightness(200%);
}
[data-bs-theme="light"] .toast-rdb .toast-header .btn-close {
    filter: none;
}
[data-bs-theme="light"] .toast-rdb {
    box-shadow: 0 4px 20px rgba(0,0,0,.1);
}
.toast-rdb .toast-body {
    padding: .75rem 1rem;
}
.toast-rdb.toast-success { border-left: 4px solid var(--rdb-green) !important; }
.toast-rdb.toast-error   { border-left: 4px solid var(--rdb-red) !important; }
.toast-rdb.toast-warning { border-left: 4px solid var(--rdb-orange) !important; }
.toast-rdb.toast-info    { border-left: 4px solid var(--rdb-blue) !important; }
.toast-rdb.toast-success .toast-icon { color: var(--rdb-green); }
.toast-rdb.toast-error   .toast-icon { color: var(--rdb-red); }
.toast-rdb.toast-warning .toast-icon { color: var(--rdb-orange); }
.toast-rdb.toast-info    .toast-icon { color: var(--rdb-blue); }

/* ── Keyboard shortcuts help button ─────────────────────────────────────── */
.btn-shortcuts-help {
    position: fixed;
    bottom: 1.25rem;
    right: 1.25rem;
    z-index: 1050;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: var(--rdb-surface-2);
    border: 1px solid var(--rdb-border);
    color: var(--rdb-text-dim);
    font-size: .9rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: color .15s, border-color .15s, box-shadow .15s;
    padding: 0;
    line-height: 1;
}
.btn-shortcuts-help:hover {
    color: var(--rdb-cyan);
    border-color: var(--rdb-blue);
    box-shadow: 0 0 12px rgba(26,143,209,.15);
}
.shortcuts-table kbd {
    background: var(--rdb-surface-2);
    border: 1px solid var(--rdb-border);
    border-radius: 4px;
    padding: .15em .45em;
    font-size: .85rem;
    color: var(--rdb-text-bright);
}

/* ── Loading spinner on submit ──────────────────────────────────────────── */
.btn-loading .spinner-border {
    width: 1em;
    height: 1em;
    border-width: .15em;
    vertical-align: middle;
}

/* ==========================================================================
   Mobile Responsiveness
   ========================================================================== */

/* Tables: horizontal scroll on small screens */
.table-responsive-wrapper {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

@media (max-width: 991.98px) {
    /* Navbar collapse spacing */
    .navbar-rdb .navbar-collapse {
        padding-top: .5rem;
        border-top: 1px solid var(--rdb-border);
        margin-top: .5rem;
    }
    .navbar-rdb .navbar-nav .nav-link {
        padding: .6rem .75rem !important;
    }
    .navbar-rdb .navbar-nav {
        gap: .15rem;
    }
}

@media (max-width: 767.98px) {
    /* Main container breathing room */
    main.container-fluid {
        padding-left: 1rem !important;
        padding-right: 1rem !important;
    }

    /* Tournament cards full width on mobile */
    .row > [class*="col-md-6"],
    .row > [class*="col-lg-4"] {
        flex: 0 0 100%;
        max-width: 100%;
    }

    /* Stat cards stack properly */
    .stat-card {
        padding: 1rem .75rem;
    }

    /* Sticky form footer on mobile */
    .form-actions-sticky .container-fluid {
        padding-left: 1rem !important;
        padding-right: 1rem !important;
    }

    /* Toast narrower on mobile */
    .toast-container-rdb {
        left: 1rem;
        right: 1rem;
    }
    .toast-rdb {
        min-width: unset;
        max-width: 100%;
    }

    /* Shortcuts button smaller on mobile */
    .btn-shortcuts-help {
        width: 32px;
        height: 32px;
        font-size: .8rem;
        bottom: 1rem;
        right: 1rem;
    }
}

@media (max-width: 575.98px) {
    /* Headings smaller on very small screens */
    h1 { font-size: 1.5rem; }
    h2 { font-size: 1.3rem; }

    /* Nav tabs scroll horizontally */
    .nav-tabs {
        flex-wrap: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
    .nav-tabs .nav-item {
        flex-shrink: 0;
    }
}

.tooltip {
    --bs-tooltip-bg: color-mix(in srgb, var(--rdb-surface-2) 92%, #000 8%);
    --bs-tooltip-color: var(--rdb-text-bright);
    --bs-tooltip-opacity: 1;
    --bs-tooltip-max-width: 260px;
    --bs-tooltip-padding-x: .7rem;
    --bs-tooltip-padding-y: .45rem;
    --bs-tooltip-border-radius: .55rem;
    --bs-tooltip-font-size: .78rem;
    --bs-tooltip-arrow-width: .8rem;
    --bs-tooltip-arrow-height: .4rem;
}

.tooltip .tooltip-inner {
    border: 1px solid var(--rdb-border);
    box-shadow: 0 10px 24px rgba(0, 0, 0, .28);
    letter-spacing: .01em;
}

.tooltip .tooltip-arrow::before {
    filter: drop-shadow(0 1px 0 var(--rdb-border));
}