/* Wrapping element */
body {
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
}

/* Set some basic padding to keep content from hitting the edges */
.body-content {
    margin-top: 15px;
    padding-left: 15px;
    padding-right: 15px;
}




/* Responsive: Portrait tablets and up */
@media screen and (min-width: 768px) {
    .body-content {
        padding: 0;
    }
}

/* NAVBAR COLORS + FONTS (GLOBAL) */
.navbar-brand,
.navbar-nav .nav-link {
    color: white !important;
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

/* Link font size + weight */
.navbar-nav .nav-link {
    font-size: 1rem;
    font-weight: 600;
}

/* Brand (title) font size + weight */
.navbar-brand {
    font-size: 1.25rem;
    font-weight: 700;
}

    /* Hover color */
    .navbar-brand:hover,
    .navbar-nav .nav-link:hover {
        color: #cccccc !important;
    }

/* Footer styled like the navbar */
.footer-dark {
    background-color: #000; /* same black as navbar */
    color: white;
    font-size: 1.1rem;
}

    /* Optional: make footer text slightly lighter on hover */
    .footer-dark:hover {
        color: #cccccc;
    }

/* Make labels larger */
.form-label {
    font-size: 1rem;
    font-weight: 600;
}


.form-control {
    width: 100% !important;
    box-sizing: border-box;
}

.btn.w-100 {
    width: 100% !important;
}

.btn {
    box-sizing: border-box;
}

.updates-feed {
    max-height: 500px;
    overflow-y: auto;
    padding-right: 5px;
}

.update-item {
    padding: 10px 0;
    border-bottom: 1px solid #ddd;
}

.update-user {
    font-weight: 700;
    color: #333;
}

.update-time {
    font-size: 0.85rem;
    color: #777;
}

.update-text {
    margin-top: 4px;
    white-space: pre-wrap;
}

    .update-text img,
    .update-text iframe {
        max-width: 100%;
        height: auto;
    }


.card .card-title {
    background-color: blue;
    color: #fff;
    padding: 12px 12px;
    border-radius: 4px;
    font-weight: 700
}



.btn {
    font-weight: 700;
}

@media (max-width: 576px) {
    .dashboard-row {
        padding-left: 20px;
        padding-right: 20px;
    }
}

@media (max-width: 576px) {
    .dashboard-card {
        max-width: 360px;
        margin-left: auto;
        margin-right: auto;
    }
}

/* Desktop: add breathing room around the cards */
@media (min-width: 992px) {
    .dashboard-row {
        padding-left: 20px;
        padding-right: 20px;
    }
}


/* Default (desktop + tablet) */
.dashboard-container {
    width: 90% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* Mobile override */
@media (max-width: 576px) {
    .dashboard-container {
        width: 98% !important;
        padding-left: 6px !important;
        padding-right: 6px !important;
    }
}





.standings-wrap {
    width: 96%;
    margin-left: auto;
    margin-right: auto;
}

@media (max-width: 576px) {
    .standings-wrap {
        width: 98%;
        padding-left: 0;
        padding-right: 0;
    }
}

.region-header {
    text-align: center;
    font-weight: bold;
    font-size: 1.1rem; /* adjust as needed */
}


/* Desktop: shrink the card grid */
@media (min-width: 992px) {
    .dashboard-inner {
        width: 85%;
        margin-left: auto;
        margin-right: auto;
    }
}

/* Desktop: shrink dashboard content */
@media (min-width: 992px) {
    .dashboard-wrapper {
        width: 90%;
        margin-left: auto;
        margin-right: auto;
    }
}

/* Mobile: full width */
@media (max-width: 991px) {
    .dashboard-wrapper {
        width: 100%;
        padding-left: 6px;
        padding-right: 6px;
    }
}

.dashboard-wrapper {
    width: 85%; /* or whatever width you prefer */
    margin-left: 0; /* left‑justify */
    margin-right: 0; /* prevent centering */
    padding-left: 0;
    padding-right: 0;
}