/* =========================================================
   BZCS GAMETRACKER - GLOBAL DARK THEME
   ========================================================= */

:root {
    --bzcs-bg: #0d0f12;
    --bzcs-surface: #15191e;
    --bzcs-surface-2: #1b2026;
    --bzcs-border: #292f36;
    --bzcs-red: #c62828;
    --bzcs-red-hover: #e03535;
    --bzcs-text: #e7e9ec;
    --bzcs-muted: #8b929b;
}

/* GLOBAL */
body {
    background: var(--bzcs-bg);
    color: var(--bzcs-text);
}

#main-content {
    background: var(--bzcs-bg);
}

/* NAVBAR */
.bzcs-navbar {
    background: #111419 !important;
    border-bottom: 1px solid #292e34;
    box-shadow: 0 4px 18px rgba(0, 0, 0, .28) !important;
}

.bzcs-navbar .navbar-brand {
    color: #fff;
    letter-spacing: -.02em;
}

.bzcs-navbar .navbar-brand .bi-controller {
    color: var(--bzcs-red) !important;
}

.bzcs-navbar .nav-link {
    color: #aeb4bc;
    transition: color .15s ease, background-color .15s ease;
}

.bzcs-navbar .nav-link:hover,
.bzcs-navbar .nav-link:focus {
    color: #fff;
}

.bzcs-navbar .nav-link:hover i,
.bzcs-navbar .nav-link:focus i {
    color: var(--bzcs-red-hover);
}

/* NAVBAR DROPDOWNS */
.bzcs-navbar .dropdown-menu {
    background: #171b20;
    border: 1px solid #30363d;
    box-shadow: 0 12px 30px rgba(0, 0, 0, .40) !important;
}

.bzcs-navbar .dropdown-item {
    color: #cbd0d6;
}

.bzcs-navbar .dropdown-item:hover,
.bzcs-navbar .dropdown-item:focus {
    color: #fff;
    background: #22272e;
}

.bzcs-navbar .dropdown-divider {
    border-color: #30363d;
}

.bzcs-navbar .dropdown-item.text-danger {
    color: #ef5350 !important;
}

/* FOOTER */
.bzcs-footer {
    background: #111419 !important;
    border-top: 1px solid #343a40 !important;
    color: #cbd0d6;
}

.bzcs-footer .bi-controller {
    color: var(--bzcs-red) !important;
}

.bzcs-footer h5,
.bzcs-footer h6 {
    color: #f3f4f6 !important;
}

.bzcs-footer .text-muted {
    color: #7f8790 !important;
}

.bzcs-footer a.text-muted {
    color: #89919a !important;
    transition: color .15s ease;
}

.bzcs-footer a.text-muted:hover {
    color: #ef5350 !important;
}

.bzcs-footer hr {
    border-color: #30363d !important;
    opacity: 1;
}

/* PRIMARY BUTTONS */
.btn-primary {
    background-color: var(--bzcs-red);
    border-color: var(--bzcs-red);
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
    background-color: #a91f1f !important;
    border-color: #a91f1f !important;
}

/* OUTLINE BUTTONS */
.btn-outline-primary {
    color: #e34a4a;
    border-color: #b72a2a;
}

.btn-outline-primary:hover,
.btn-outline-primary:focus {
    color: #fff;
    background: var(--bzcs-red);
    border-color: var(--bzcs-red);
}

/* LINKS INSIDE MAIN CONTENT */
#main-content a:not(.btn):not(.bzcs-server-name) {
    color: #dc4b4b;
}

#main-content a:not(.btn):not(.bzcs-server-name):hover {
    color: #f06464;
}

/* MOBILE NAV */
@media (max-width: 991.98px) {
    .bzcs-navbar .navbar-collapse {
        background: #111419;
    }

    .bzcs-navbar .navbar-nav {
        padding-top: .4rem;
        padding-bottom: .4rem;
    }

    .bzcs-navbar .nav-link {
        border-radius: 4px;
    }

    .bzcs-navbar .nav-link:hover {
        background: #1a1f24;
    }
}


/* =========================================================
   BZCS GAMETRACKER - SERVER DETAIL
   ========================================================= */

/* Main detail cards */
#main-content .card {
    background: var(--bzcs-surface);
    color: var(--bzcs-text);
    border: 1px solid var(--bzcs-border) !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, .18) !important;
}

/* Hero */
#main-content .card-img-top {
    border-bottom: 1px solid var(--bzcs-border);
}

#main-content .position-relative > .bg-dark.bg-opacity-25 {
    background: linear-gradient(
        to top,
        rgba(8, 10, 12, .92) 0%,
        rgba(8, 10, 12, .42) 55%,
        rgba(8, 10, 12, .18) 100%
    ) !important;
    opacity: 1 !important;
}

#main-content h1,
#main-content h2,
#main-content h3,
#main-content h4,
#main-content h5,
#main-content h6,
#main-content .text-dark {
    color: #f2f3f5 !important;
}

/* Tabs */
#serverTabs {
    gap: 6px;
    padding-bottom: 14px;
    border-bottom: 1px solid var(--bzcs-border);
}

#serverTabs .nav-link {
    color: #9ca3ad;
    background: transparent;
    border: 1px solid transparent;
    font-size: .88rem;
    font-weight: 600;
    border-radius: 4px !important;
    transition: all .15s ease;
}

#serverTabs .nav-link:hover {
    color: #fff;
    background: #1d2228;
    border-color: #30363d;
}

#serverTabs .nav-link.active {
    color: #fff;
    background: var(--bzcs-red);
    border-color: var(--bzcs-red);
}

/* List information rows */
#serverTabsContent .list-group {
    --bs-list-group-bg: transparent;
    --bs-list-group-color: var(--bzcs-text);
    --bs-list-group-border-color: var(--bzcs-border);
}

#serverTabsContent .list-group-item {
    background: transparent !important;
    color: #d8dce1;
    border-color: var(--bzcs-border);
}

#serverTabsContent .text-muted {
    color: var(--bzcs-muted) !important;
}

#serverTabsContent code {
    color: #e7e9ec;
    background: #0d1014 !important;
    border: 1px solid #2d333a;
}

/* Old Bootstrap light badges */
#serverTabsContent .badge.bg-light {
    color: #dfe3e7 !important;
    background: #252b31 !important;
    border: 1px solid #343b43;
}

/* Internal light statistic cards */
#serverTabsContent .card.bg-light {
    background: #11151a !important;
    border: 1px solid #2a3037 !important;
    box-shadow: none !important;
}

#serverTabsContent .card.bg-light .card-body {
    color: var(--bzcs-text);
}

/* Generic card headers */
#main-content .card-header {
    color: var(--bzcs-text);
    border-bottom-color: var(--bzcs-border) !important;
}

/* Inputs / textarea inside detail page */
#main-content .form-control,
#main-content .form-select {
    color: #e4e7eb;
    background-color: #0f1317;
    border-color: #30363d;
}

#main-content .form-control:focus,
#main-content .form-select:focus {
    color: #fff;
    background-color: #101419;
    border-color: var(--bzcs-red);
    box-shadow: 0 0 0 .15rem rgba(198, 40, 40, .16);
}

#main-content .form-control::placeholder {
    color: #68717b;
}

/* Quick Actions */
#main-content .col-lg-4 > .card {
    background: #15191e;
}

#main-content .col-lg-4 > .card .card-header {
    background: #181d22 !important;
}

#main-content .col-lg-4 > .card .card-header .text-primary {
    color: #e04747 !important;
}

/* Secondary / outline controls */
#main-content .btn-outline-secondary {
    color: #aeb5bd;
    border-color: #3b424a;
}

#main-content .btn-outline-secondary:hover {
    color: #fff;
    background: #292f36;
    border-color: #4a525b;
}

/* Statistics */
#statistics .card {
    background: #11151a !important;
    border: 1px solid #292f36 !important;
    box-shadow: none !important;
}

#statistics .text-muted {
    color: #858d96 !important;
}

/* Tables inside server detail */
#main-content .table {
    --bs-table-bg: transparent;
    --bs-table-color: #dce0e4;
    --bs-table-border-color: #292f36;
    --bs-table-hover-bg: #1b2026;
    --bs-table-hover-color: #fff;
}

/* Alerts */
#main-content .alert-info {
    color: #b9d7e8;
    background: #14212a;
    border-color: #263c49;
}

#main-content .alert-warning {
    color: #e5ce8a;
    background: #292313;
    border-color: #49401f;
}

/* Modals */
.modal-content {
    color: var(--bzcs-text);
    background: #15191e;
    border: 1px solid #30363d;
}

.modal-header,
.modal-footer {
    border-color: #30363d !important;
}

.modal .btn-close {
    filter: invert(1) grayscale(100%) brightness(180%);
}

/* Popovers */
.popover {
    --bs-popover-bg: #171b20;
    --bs-popover-border-color: #30363d;
    --bs-popover-body-color: #d7dbe0;
}

/* Detail links */
#serverTabsContent a:not(.btn) {
    color: #dc4b4b;
}

#serverTabsContent a:not(.btn):hover {
    color: #f06464;
}

/* Hero badges */
#main-content .badge.bg-info {
    background: #26323c !important;
    color: #dce8ef !important;
}

#main-content .badge.bg-success {
    background: #1d6b45 !important;
}

/* Mobile */
@media (max-width: 767.98px) {
    #serverTabs {
        gap: 4px;
    }

    #serverTabs .nav-link {
        padding: .55rem .45rem;
        font-size: .76rem;
    }

    #main-content .card-body {
        padding: 1rem !important;
    }

    #main-content .position-absolute.bottom-0.start-0 {
        padding: 1rem !important;
    }

    #main-content .position-absolute.bottom-0.start-0 h1 {
        font-size: 1.25rem;
    }
}

/* =========================================================
   BZCS GAMETRACKER - STATISTICS
   ========================================================= */

#statistics {
    color: #e7e9ec;
}

#statistics > .h6 {
    color: #f4f5f7 !important;
    padding-bottom: 12px;
    margin-bottom: 18px !important;
    border-bottom: 1px solid #292f36;
}

#statistics > .h6 .text-muted {
    color: #7f8791 !important;
}

#statistics .bi-trophy {
    color: #d32f2f !important;
}

#statistics .bi-graph-up {
    color: #d32f2f !important;
}

/* Statistic cards */
#statistics .card.bg-light {
    background:
        linear-gradient(145deg, #1b2026 0%, #14181d 100%) !important;
    border: 1px solid #2b3138 !important;
    border-radius: 8px;
    box-shadow: none !important;
    transition:
        border-color .18s ease,
        transform .18s ease,
        box-shadow .18s ease;
}

#statistics .card.bg-light:hover {
    border-color: rgba(211, 47, 47, .7) !important;
    transform: translateY(-1px);
    box-shadow: 0 5px 16px rgba(0, 0, 0, .18) !important;
}

#statistics .card.bg-light .card-body {
    padding: 18px 14px;
}

#statistics .card.bg-light .text-muted {
    color: #8e96a0 !important;
    text-transform: uppercase;
    letter-spacing: .45px;
    font-size: .72rem !important;
    font-weight: 600;
}

#statistics .card.bg-light .h3,
#statistics .card.bg-light .h4 {
    color: #f5f6f7 !important;
}

/* Score + rank get stronger BZCS emphasis */
#statistics .row:first-of-type .card {
    position: relative;
    overflow: hidden;
}

#statistics .row:first-of-type .card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 2px;
    background: #d32f2f;
}

#statistics .row:first-of-type .h3,
#statistics .row:first-of-type .h4 {
    color: #ef4444 !important;
}

#statistics .text-success {
    color: #36c786 !important;
}

/* Chart area */
#statistics canvas#statisticsChart {
    width: 100% !important;
}

#statistics canvas#statisticsChart + * {
    color: #7f8791;
}

/* Empty statistics state */
#statistics .alert-info {
    background: #171c21 !important;
    border: 1px solid #29323a !important;
    color: #aeb6bf !important;
}

/* Mobile */
@media (max-width: 767.98px) {
    #statistics .card.bg-light .card-body {
        padding: 14px 10px;
    }

    #statistics .card.bg-light .h3 {
        font-size: 1.45rem;
    }

    #statistics .card.bg-light .h4 {
        font-size: 1.2rem;
    }
}

/* =========================================================
   BZCS GAMETRACKER - HOME PORTAL
   ========================================================= */

.bzcs-home {
    max-width: 1080px;
    margin: 8px auto 20px;
    font-size: 13px;
}

.bzcs-home .row {
    --bs-gutter-x: 8px;
}

.bzcs-ticker {
    height: 38px;
    display: flex;
    overflow: hidden;
    margin-bottom: 8px;
    background: #111519;
    border: 1px solid #343a40;
    border-bottom: 2px solid #c62828;
}

.bzcs-ticker-label {
    flex: 0 0 auto;
    display: flex;
    gap: 7px;
    align-items: center;
    padding: 0 15px;
    background: #c62828;
    color: #fff;
    font-size: 11px;
    font-weight: 800;
}

.bzcs-ticker-track {
    min-width: 0;
    display: flex;
    align-items: stretch;
    overflow: hidden;
}

.bzcs-ticker-item {
    min-width: 190px;
    max-width: 230px;
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 0 12px;
    color: #d7dbe0 !important;
    text-decoration: none;
    border-right: 1px solid #292e34;
}

.bzcs-ticker-item:hover {
    background: #1b2026;
    color: #fff !important;
}

.bzcs-ticker-item strong {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 11px;
}

.bzcs-ticker-item small {
    margin-left: auto;
    color: #929aa3;
    white-space: nowrap;
}

.bzcs-ticker-status {
    width: 6px;
    height: 6px;
    flex: 0 0 6px;
    border-radius: 50%;
    background: #27b36a;
    box-shadow: 0 0 7px rgba(39, 179, 106, .55);
}

.bzcs-ticker-empty {
    display: flex;
    align-items: center;
    padding: 0 14px;
    color: #858d96;
}

.bzcs-promo {
    min-height: 82px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    margin-bottom: 8px;
    padding: 16px 22px;
    border: 1px solid #5e1719;
    border-bottom: 3px solid #c62828;
    background:
        radial-gradient(circle at 75% 50%, rgba(211,47,47,.22), transparent 28%),
        linear-gradient(110deg, #16191d 0%, #111317 55%, #2b0b0d 100%);
}

.bzcs-promo-kicker {
    display: block;
    margin-bottom: 3px;
    color: #ef4444;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 1.3px;
}

.bzcs-promo strong {
    display: block;
    color: #fff;
    font-size: 18px;
}

.bzcs-promo small {
    display: block;
    margin-top: 3px;
    color: #949ca5;
}

.bzcs-promo-btn,
.bzcs-add-server {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    gap: 7px;
    padding: 10px 16px;
    background: #c62828;
    border: 1px solid #e13b3b;
    color: #fff !important;
    font-size: 11px;
    font-weight: 800;
    text-decoration: none;
    white-space: nowrap;
}

.bzcs-promo-btn:hover,
.bzcs-add-server:hover {
    background: #e03535;
}

.bzcs-panel {
    overflow: hidden;
    background: #0d1013;
    border: 1px solid #343a40;
    border-radius: 5px;
}

.bzcs-panel-title {
    min-height: 34px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 11px;
    background: linear-gradient(#f5f5f5, #d6d6d6);
    border-bottom: 1px solid #8b8b8b;
    color: #111;
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
}

.bzcs-panel-title-red {
    background: linear-gradient(#d71920, #b6080e);
    border-bottom-color: #ef363b;
    color: #fff;
}

.bzcs-panel-title a {
    padding: 3px 6px;
    border: 1px solid rgba(255,255,255,.35);
    color: inherit !important;
    font-size: 9px;
    text-decoration: none;
}

.bzcs-news-content {
    min-height: 286px;
    display: grid;
    grid-template-columns: minmax(0, 1.65fr) minmax(230px, .85fr);
    gap: 10px;
    padding: 12px;
    background: #080a0c;
}

.bzcs-news-feature,
.bzcs-news-side {
    position: relative;
    overflow: hidden;
    border: 1px solid #2b3239;
    border-radius: 6px;
    background:
        radial-gradient(circle at 75% 15%, rgba(198,40,40,.13), transparent 32%),
        linear-gradient(145deg, #171b20, #0c0f12);
}

.bzcs-news-feature {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 26px 22px;
}

.bzcs-news-feature::before {
    content: "BZCS";
    position: absolute;
    top: -28px;
    right: 12px;
    color: rgba(255,255,255,.025);
    font-size: 120px;
    font-weight: 900;
    pointer-events: none;
}

.bzcs-news-tag,
.bzcs-news-date {
    width: fit-content;
    margin-bottom: 10px;
    padding: 4px 8px;
    border: 1px solid #384049;
    border-radius: 20px;
    color: #a8b0b9;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .8px;
}

.bzcs-news-feature h1 {
    position: relative;
    margin: 0 0 8px;
    color: #fff;
    font-size: 24px;
    font-weight: 800;
}

.bzcs-news-feature p,
.bzcs-news-side p {
    position: relative;
    color: #a6adb5;
    line-height: 1.55;
}

.bzcs-news-actions {
    position: relative;
    display: flex;
    gap: 8px;
    margin-top: 8px;
}

.bzcs-news-actions a {
    padding: 7px 10px;
    border: 1px solid #343b43;
    color: #e2e5e8 !important;
    text-decoration: none;
    font-size: 11px;
}

.bzcs-news-actions a:hover {
    border-color: #c62828;
    background: #1b1113;
}

.bzcs-news-side {
    padding: 18px 15px;
}

.bzcs-news-side h2 {
    color: #fff;
    font-size: 17px;
    font-weight: 700;
}

.bzcs-news-mini-stats {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px;
    margin-top: 16px;
}

.bzcs-news-mini-stats span {
    padding: 9px 6px;
    background: #101419;
    border: 1px solid #2b3239;
    color: #818a94;
    text-align: center;
    font-size: 9px;
    text-transform: uppercase;
}

.bzcs-news-mini-stats strong {
    display: block;
    margin-bottom: 2px;
    color: #fff;
    font-size: 16px;
}

.bzcs-stats-panel {
    height: 100%;
    border-color: #64181a;
}

.bzcs-stats-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 5px;
    padding: 8px;
}

.bzcs-stats-grid > div {
    padding: 13px 4px;
    border: 1px solid #d72a30;
    border-radius: 4px;
    background: linear-gradient(145deg, #b80c12, #85080c);
    text-align: center;
}

.bzcs-stats-grid strong {
    display: block;
    color: #fff;
    font-size: 19px;
    line-height: 1;
}

.bzcs-stats-grid span {
    display: block;
    margin-top: 5px;
    color: #ffd9d9;
    font-size: 8px;
    font-weight: 700;
}

.bzcs-add-server {
    margin: 3px 8px 8px;
    width: calc(100% - 16px);
}

.bzcs-home-lists {
    margin-top: 8px !important;
}

.bzcs-server-list {
    background: #111418;
}

.bzcs-server-line {
    min-height: 27px;
    display: grid;
    grid-template-columns: 22px 20px 25px minmax(0,1fr) auto;
    align-items: center;
    padding: 0 7px;
    border-bottom: 1px solid #292e34;
    color: #dfe2e5 !important;
    text-decoration: none;
}

.bzcs-server-line:last-child {
    border-bottom: 0;
}

.bzcs-server-line:hover {
    background: #1c2126;
}

.bzcs-server-position {
    color: #737c85;
    font-size: 10px;
}

.bzcs-server-game img {
    display: block;
    width: 15px;
    height: 15px;
    object-fit: contain;
}

.bzcs-server-country {
    font-size: 14px;
}

.bzcs-server-name {
    overflow: hidden;
    color: #e4e6e8;
    font-size: 10px;
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.bzcs-server-players {
    padding-left: 8px;
    color: #9ca4ac;
    font-size: 9px;
    white-space: nowrap;
}

.bzcs-home-empty {
    padding: 25px 10px;
    color: #777f87;
    text-align: center;
    font-size: 11px;
}

@media (max-width: 991.98px) {
    .bzcs-home {
        max-width: none;
    }

    .bzcs-news-content {
        grid-template-columns: 1fr;
    }

    .bzcs-news-side {
        min-height: 180px;
    }

    .bzcs-stats-panel {
        margin-top: 8px;
    }
}

@media (max-width: 575.98px) {
    .bzcs-promo {
        align-items: flex-start;
        flex-direction: column;
    }

    .bzcs-promo-btn {
        width: 100%;
    }

    .bzcs-news-content {
        padding: 7px;
    }

    .bzcs-news-feature {
        min-height: 240px;
        padding: 18px 15px;
    }

    .bzcs-news-feature h1 {
        font-size: 20px;
    }

    .bzcs-news-actions {
        flex-direction: column;
    }

    .bzcs-ticker-item {
        min-width: 180px;
    }
}

/* =========================================================
   BZCS GAMETRACKER - HOME V2
   ========================================================= */

/* Gaming portal background - HOME only */
body:has(.bzcs-home) #main-content {
    position: relative;
    background:
        radial-gradient(circle at 12% 35%, rgba(198, 40, 40, .22), transparent 25%),
        radial-gradient(circle at 88% 38%, rgba(198, 40, 40, .18), transparent 27%),
        linear-gradient(90deg,
            #090b0d 0%,
            #17090b 14%,
            #090b0d 24%,
            #090b0d 76%,
            #17090b 86%,
            #090b0d 100%);
}

body:has(.bzcs-home) #main-content::before,
body:has(.bzcs-home) #main-content::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    width: 260px;
    pointer-events: none;
    opacity: .65;
}

body:has(.bzcs-home) #main-content::before {
    left: 0;
    background:
        repeating-linear-gradient(
            0deg,
            transparent 0,
            transparent 38px,
            rgba(211, 47, 47, .045) 39px,
            rgba(211, 47, 47, .045) 40px
        ),
        repeating-linear-gradient(
            90deg,
            transparent 0,
            transparent 38px,
            rgba(211, 47, 47, .035) 39px,
            rgba(211, 47, 47, .035) 40px
        ),
        radial-gradient(circle at 30% 35%, rgba(211,47,47,.24), transparent 45%);
}

body:has(.bzcs-home) #main-content::after {
    right: 0;
    background:
        repeating-linear-gradient(
            0deg,
            transparent 0,
            transparent 38px,
            rgba(211, 47, 47, .045) 39px,
            rgba(211, 47, 47, .045) 40px
        ),
        repeating-linear-gradient(
            90deg,
            transparent 0,
            transparent 38px,
            rgba(211, 47, 47, .035) 39px,
            rgba(211, 47, 47, .035) 40px
        ),
        radial-gradient(circle at 70% 35%, rgba(211,47,47,.22), transparent 45%);
}

/* Main Bootstrap container must not restrict portal width */
body:has(.bzcs-home) #main-content > .container-fluid {
    position: relative;
    z-index: 1;
    padding-top: 12px !important;
    padding-bottom: 22px !important;
}

/* Main portal shell */
.bzcs-home {
    position: relative;
    z-index: 2;
    width: min(1180px, calc(100vw - 30px));
    max-width: 1180px;
    margin: 0 auto;
    padding: 7px;
    background:
        linear-gradient(
            180deg,
            rgba(53, 8, 10, .86),
            rgba(12, 14, 17, .96) 130px,
            rgba(9, 11, 13, .98)
        );
    border-left: 1px solid rgba(198, 40, 40, .42);
    border-right: 1px solid rgba(198, 40, 40, .42);
    box-shadow:
        0 0 45px rgba(0, 0, 0, .72),
        0 0 28px rgba(198, 40, 40, .08);
}

/* =========================================================
   LIVE TICKER
   ========================================================= */

.bzcs-ticker {
    height: 42px;
    margin-bottom: 7px;
    background: #111418;
    border: 1px solid #4a1719;
    border-bottom: 2px solid #d2252b;
    box-shadow: inset 0 1px rgba(255,255,255,.025);
}

.bzcs-ticker-label {
    min-width: 78px;
    justify-content: center;
    padding: 0 14px;
    background:
        linear-gradient(180deg, #dc252b, #b60c12);
    font-size: 11px;
    letter-spacing: .3px;
}

.bzcs-ticker-track {
    flex: 1;
    background:
        linear-gradient(180deg, #15191e, #101317);
}

.bzcs-ticker-item {
    min-width: 235px;
    max-width: 285px;
    padding: 0 13px;
    border-right-color: #30363d;
}

.bzcs-ticker-item strong {
    font-size: 11px;
}

/* =========================================================
   MAIN PROMO BANNER
   ========================================================= */

.bzcs-promo {
    position: relative;
    overflow: hidden;
    min-height: 105px;
    margin-bottom: 7px;
    padding: 18px 24px;
    border: 1px solid #76171a;
    border-bottom: 3px solid #d51f26;
    background:
        radial-gradient(circle at 77% 50%, rgba(227, 35, 42, .32), transparent 20%),
        radial-gradient(circle at 92% 30%, rgba(227, 35, 42, .18), transparent 22%),
        linear-gradient(105deg, #15191d 0%, #101316 49%, #33090c 100%);
}

.bzcs-promo::before {
    content: "BZCS";
    position: absolute;
    right: 135px;
    top: -34px;
    color: rgba(255,255,255,.035);
    font-size: 125px;
    line-height: 1;
    font-weight: 900;
    font-style: italic;
    transform: skewX(-9deg);
}

.bzcs-promo::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    width: 47%;
    height: 2px;
    background:
        linear-gradient(90deg, transparent, #ef353b);
}

.bzcs-promo > * {
    position: relative;
    z-index: 2;
}

.bzcs-promo-kicker {
    color: #ef3b40;
    font-size: 10px;
    letter-spacing: 1.5px;
}

.bzcs-promo strong {
    margin-top: 2px;
    font-size: 20px;
}

.bzcs-promo small {
    margin-top: 5px;
    font-size: 11px;
}

.bzcs-promo-btn {
    min-width: 128px;
    min-height: 40px;
    border-color: #f0464b;
    background:
        linear-gradient(180deg, #df2c32, #b80d13);
    box-shadow: 0 4px 15px rgba(0,0,0,.25);
}

/* =========================================================
   PANELS
   ========================================================= */

.bzcs-panel {
    border-color: #3a3f45;
    border-radius: 4px;
    box-shadow: 0 3px 12px rgba(0,0,0,.2);
}

.bzcs-panel-title {
    min-height: 38px;
    padding: 0 12px;
    font-size: 11px;
}

.bzcs-panel-title-red {
    background:
        linear-gradient(180deg, #dc171e 0%, #b8080e 100%);
    border-bottom: 1px solid #f12b31;
}

.bzcs-panel-title-red span {
    text-shadow: 0 1px rgba(0,0,0,.35);
}

/* =========================================================
   NEWS
   ========================================================= */

.bzcs-news-content {
    min-height: 330px;
    grid-template-columns: minmax(0, 1.75fr) minmax(250px, .8fr);
    gap: 11px;
    padding: 12px;
}

.bzcs-news-feature {
    min-height: 304px;
    padding: 28px 25px;
    background:
        linear-gradient(
            90deg,
            rgba(10,12,14,.94) 0%,
            rgba(10,12,14,.83) 55%,
            rgba(36,8,10,.67) 100%
        ),
        radial-gradient(circle at 78% 30%, rgba(211,47,47,.28), transparent 35%);
}

.bzcs-news-feature::after {
    content: "";
    position: absolute;
    width: 210px;
    height: 210px;
    right: -70px;
    bottom: -95px;
    border: 1px solid rgba(211,47,47,.18);
    border-radius: 50%;
    box-shadow:
        0 0 0 30px rgba(211,47,47,.025),
        0 0 0 60px rgba(211,47,47,.02);
}

.bzcs-news-feature h1 {
    max-width: 600px;
    font-size: 27px;
    line-height: 1.15;
}

.bzcs-news-feature p {
    max-width: 590px;
    font-size: 12px;
}

.bzcs-news-actions a {
    padding: 8px 12px;
    background: rgba(12,15,18,.75);
}

.bzcs-news-side {
    padding: 21px 17px;
    background:
        radial-gradient(circle at 75% 5%, rgba(198,40,40,.2), transparent 28%),
        linear-gradient(145deg, #171b20, #0c0f12);
}

.bzcs-news-side h2 {
    margin-top: 5px;
    font-size: 19px;
    line-height: 1.15;
}

.bzcs-news-side p {
    font-size: 11px;
}

/* =========================================================
   STATS
   ========================================================= */

.bzcs-stats-grid {
    gap: 6px;
    padding: 10px;
}

.bzcs-stats-grid > div {
    min-height: 72px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 10px 4px;
    background:
        linear-gradient(145deg, #c20d14, #8f080c);
}

.bzcs-stats-grid strong {
    font-size: 23px;
}

.bzcs-stats-grid span {
    font-size: 8px;
}

.bzcs-add-server {
    min-height: 38px;
    margin: 1px 10px 10px;
    width: calc(100% - 20px);
}

/* =========================================================
   SERVER LISTS
   ========================================================= */

.bzcs-home-lists {
    margin-top: 9px !important;
}

.bzcs-home-lists .bzcs-panel {
    min-height: 305px;
    background:
        linear-gradient(180deg, #12161a, #0b0e11);
}

.bzcs-server-list {
    min-height: 265px;
    background:
        repeating-linear-gradient(
            180deg,
            #13171b 0,
            #13171b 27px,
            #101317 27px,
            #101317 54px
        );
}

.bzcs-server-line {
    min-height: 29px;
    grid-template-columns: 23px 20px 27px minmax(0,1fr) auto;
    padding: 0 8px;
    background: rgba(17,20,24,.94);
}

.bzcs-server-line:nth-child(even) {
    background: rgba(20,24,28,.96);
}

.bzcs-server-line:hover {
    background: #271416;
    box-shadow: inset 3px 0 #d4262c;
}

.bzcs-server-name {
    font-size: 10.5px;
}

.bzcs-server-players {
    color: #b6bdc5;
    font-size: 9.5px;
}

.bzcs-home-empty {
    min-height: 265px;
    display: flex;
    justify-content: center;
    align-items: center;
}

/* =========================================================
   HOME FOOTER INTEGRATION
   ========================================================= */

body:has(.bzcs-home) .bzcs-footer {
    margin-top: 0 !important;
    border-top: 2px solid #b9161b !important;
    background:
        linear-gradient(180deg, #27080a 0%, #121519 45%, #0d1013 100%) !important;
}

body:has(.bzcs-home) .bzcs-footer > .container,
body:has(.bzcs-home) .bzcs-footer > .container-fluid {
    max-width: 1180px;
}

/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 1199.98px) {
    .bzcs-home {
        width: calc(100vw - 24px);
    }

    body:has(.bzcs-home) #main-content::before,
    body:has(.bzcs-home) #main-content::after {
        width: 150px;
    }
}

@media (max-width: 991.98px) {
    body:has(.bzcs-home) #main-content::before,
    body:has(.bzcs-home) #main-content::after {
        display: none;
    }

    .bzcs-home {
        width: 100%;
        padding: 5px;
        border-left: 0;
        border-right: 0;
    }

    .bzcs-news-content {
        grid-template-columns: 1fr;
    }

    .bzcs-home-lists .bzcs-panel {
        min-height: auto;
    }

    .bzcs-server-list,
    .bzcs-home-empty {
        min-height: 180px;
    }
}

@media (max-width: 575.98px) {
    body:has(.bzcs-home) #main-content > .container-fluid {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .bzcs-promo {
        min-height: 145px;
    }

    .bzcs-promo::before {
        right: -20px;
        opacity: .5;
    }

    .bzcs-news-feature h1 {
        font-size: 22px;
    }

    .bzcs-stats-grid strong {
        font-size: 20px;
    }
}

/* =========================================================
   BZCS HOME V3 - OFFICIAL GAMING BACKGROUND
   ========================================================= */

body:has(.bzcs-home) #main-content {
    position: relative;

    background-image:
        linear-gradient(
            180deg,
            rgba(5, 7, 9, .12) 0%,
            rgba(5, 7, 9, .18) 45%,
            rgba(5, 7, 9, .78) 100%
        ),
        url('/assets/images/bzcs-home-bg.png');

    background-repeat: no-repeat, no-repeat;
    background-position: top center, top center;
    background-size: cover, 1920px auto;
    background-color: #080a0c;
}

/* Ukloni stare V2 generisane bocne efekte */
body:has(.bzcs-home) #main-content::before,
body:has(.bzcs-home) #main-content::after {
    display: none !important;
}

/*
 * Portal ostaje taman/proziran tako da se BZCS background
 * vidi kroz centralni dio, ali tekst ostaje citljiv.
 */
.bzcs-home {
    background:
        linear-gradient(
            180deg,
            rgba(12, 14, 17, .91) 0%,
            rgba(9, 11, 13, .95) 180px,
            rgba(8, 10, 12, .97) 100%
        );

    border-left: 1px solid rgba(211, 47, 47, .55);
    border-right: 1px solid rgba(211, 47, 47, .55);

    box-shadow:
        0 0 55px rgba(0, 0, 0, .88),
        0 0 30px rgba(198, 40, 40, .10);
}

/* Ticker malo proziran */
.bzcs-ticker {
    background: rgba(12, 15, 18, .94);
}

/* Promo dozvoljava malo background atmosfere */
.bzcs-promo {
    background:
        radial-gradient(
            circle at 80% 50%,
            rgba(227, 35, 42, .28),
            transparent 27%
        ),
        linear-gradient(
            105deg,
            rgba(18, 21, 25, .96) 0%,
            rgba(12, 15, 18, .94) 52%,
            rgba(53, 8, 11, .91) 100%
        );
}

/* Donji dio postepeno prelazi u crno */
body:has(.bzcs-home) #main-content::after {
    content: "";
    display: block !important;
    position: absolute;
    z-index: 0;
    pointer-events: none;

    left: 0;
    right: 0;
    bottom: 0;

    width: auto;
    height: 260px;

    background:
        linear-gradient(
            180deg,
            transparent 0%,
            rgba(8, 10, 12, .45) 45%,
            #080a0c 100%
        );

    opacity: 1;
}

/* Laptop / manji desktop */
@media (max-width: 1400px) {
    body:has(.bzcs-home) #main-content {
        background-size: cover, 1700px auto;
    }
}

/* Mobile - background ostaje ali bez agresivnog zooma */
@media (max-width: 767.98px) {
    body:has(.bzcs-home) #main-content {
        background-image:
            linear-gradient(
                rgba(7, 9, 11, .60),
                rgba(7, 9, 11, .90)
            ),
            url('/assets/images/bzcs-home-bg.png');

        background-position: top center;
        background-size: auto, auto 720px;
    }
}


/* =========================================================
   BZCS HOME V4 - COMPACT PORTAL
   ========================================================= */

/* Nemoj rastezati donje panele kada nema dovoljno servera */
.bzcs-home-lists .bzcs-panel {
    min-height: 0 !important;
    height: auto !important;
}

/* Lista ima nekoliko vizuelnih redova, ali bez fake podataka */
.bzcs-server-list {
    min-height: 170px !important;
    height: auto;
    background:
        repeating-linear-gradient(
            180deg,
            #13171b 0,
            #13171b 29px,
            #101317 29px,
            #101317 58px
        );
}

/* Jedan pravi server ostaje normalne visine */
.bzcs-server-line {
    min-height: 30px;
}

/* Malo zbijamo glavni portal */
.bzcs-home {
    padding-bottom: 8px;
}

/* Donje liste bliže glavnom sadržaju */
.bzcs-home-lists {
    margin-top: 8px !important;
}

/* Background ostaje fiksiran na vrhu i ne razvlači se */
body:has(.bzcs-home) #main-content {
    background-size: cover, 1920px auto;
    background-position: top center, top center;
}

/* Footer odmah nastavlja portal */
body:has(.bzcs-home) .bzcs-footer {
    margin-top: 0 !important;
    padding-top: 22px !important;
    padding-bottom: 18px !important;
    border-top: 2px solid #c51c22 !important;
}

/* Manje praznog prostora unutar footera */
body:has(.bzcs-home) .bzcs-footer hr {
    margin-top: 16px;
    margin-bottom: 14px;
}

@media (max-width: 991.98px) {
    .bzcs-server-list {
        min-height: 120px !important;
    }
}

/* =========================================================
   BZCS GAMETRACKER - NAVBAR V2
   ========================================================= */

.bzcs-navbar {
    min-height: 64px;
    padding: 0 !important;
    background:
        linear-gradient(
            180deg,
            #171b20 0%,
            #0e1115 58%,
            #090b0e 100%
        ) !important;

    border-top: 1px solid #242a30;
    border-bottom: 2px solid #b8161c;
    box-shadow:
        0 5px 20px rgba(0,0,0,.55),
        inset 0 -1px rgba(255,255,255,.025) !important;
}

.bzcs-navbar-inner {
    width: min(1180px, calc(100% - 30px));
    max-width: 1180px;
    min-height: 64px;
    margin: 0 auto;
    padding: 0 !important;
}


/* -------------------------
   BRAND
   ------------------------- */

.bzcs-navbar-brand {
    height: 64px;
    min-width: 205px;

    display: flex;
    align-items: center;

    margin: 0 12px 0 0 !important;
    padding: 0 18px 0 10px !important;

    position: relative;

    border-right: 1px solid #30353b;

    font-size: 18px;
    letter-spacing: -.25px;
}

.bzcs-navbar-brand::after {
    content: "";
    position: absolute;

    left: 8px;
    right: 18px;
    bottom: 0;

    height: 2px;

    background:
        linear-gradient(
            90deg,
            #e1262d,
            rgba(225,38,45,0)
        );
}

.bzcs-navbar-brand .bi-controller {
    color: #e3262d !important;
    margin-right: 7px;

    font-size: 21px;

    filter:
        drop-shadow(0 0 5px rgba(227,38,45,.30));
}

.bzcs-navbar-brand span {
    white-space: nowrap;
}


/* -------------------------
   MAIN NAVIGATION
   ------------------------- */

.bzcs-main-nav {
    min-height: 64px;
    align-items: stretch;
}

.bzcs-main-nav > .nav-item {
    display: flex;
    align-items: stretch;

    border-left: 1px solid rgba(255,255,255,.025);
}

.bzcs-main-nav > .nav-item:last-child {
    border-right: 1px solid rgba(255,255,255,.025);
}

.bzcs-main-nav > .nav-item > .nav-link {
    min-width: 104px;
    min-height: 64px;

    display: flex;
    justify-content: center;
    align-items: center;

    position: relative;

    padding: 0 15px !important;

    color: #c5cbd2 !important;

    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .2px;

    transition:
        background .16s ease,
        color .16s ease;
}

.bzcs-main-nav > .nav-item > .nav-link i {
    margin-right: 6px !important;
    color: #8e99a5;

    font-size: 13px;

    transition: color .16s ease;
}

.bzcs-main-nav > .nav-item > .nav-link::after {
    content: "";

    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;

    height: 3px;

    background: transparent;
}

.bzcs-main-nav > .nav-item > .nav-link:hover {
    color: #fff !important;

    background:
        linear-gradient(
            180deg,
            rgba(198,40,40,.08),
            rgba(198,40,40,.20)
        );
}

.bzcs-main-nav > .nav-item > .nav-link:hover i {
    color: #ef353c;
}

.bzcs-main-nav > .nav-item > .nav-link:hover::after {
    background: #d51f26;
}


/* -------------------------
   HOME ACTIVE STATE
   samo na Home stranici
   ------------------------- */

body:has(.bzcs-home) .bzcs-nav-home {
    color: #fff !important;

    background:
        linear-gradient(
            180deg,
            #d51e25 0%,
            #ae090f 100%
        ) !important;

    text-shadow: 0 1px 1px rgba(0,0,0,.35);
}

body:has(.bzcs-home) .bzcs-nav-home i {
    color: #fff !important;
}

body:has(.bzcs-home) .bzcs-nav-home::after {
    background: #ff4b50 !important;
}


/* -------------------------
   SERVERS ACTIVE STATE
   ------------------------- */

body:has(.bzcs-servers-page) .bzcs-nav-servers {
    color: #fff !important;

    background:
        linear-gradient(
            180deg,
            #d51e25 0%,
            #ae090f 100%
        ) !important;
}

body:has(.bzcs-servers-page) .bzcs-nav-servers i {
    color: #fff !important;
}


/* -------------------------
   PREMIUM
   ------------------------- */

.bzcs-nav-premium i {
    color: #d9ad42 !important;
}

.bzcs-nav-premium:hover i {
    color: #ffd65d !important;
}


/* -------------------------
   RIGHT USER / ADMIN
   ------------------------- */

.bzcs-navbar .navbar-collapse > .navbar-nav:last-child {
    min-height: 64px;
    align-items: center;
}

.bzcs-navbar .navbar-collapse > .navbar-nav:last-child > .nav-item > .nav-link {
    min-height: 42px;

    display: flex;
    align-items: center;

    margin-left: 5px;

    color: #c3cad1 !important;

    border: 1px solid transparent;
    border-radius: 2px;

    font-size: 12px;
}

.bzcs-navbar .navbar-collapse > .navbar-nav:last-child > .nav-item > .nav-link:hover {
    color: #fff !important;
    border-color: #343a40;

    background: #171b20;
}


/* -------------------------
   DROPDOWNS
   ------------------------- */

.bzcs-navbar .dropdown-menu {
    padding: 5px;

    background: #111519;

    border: 1px solid #333941;
    border-top: 2px solid #cf1d23;

    border-radius: 2px;

    box-shadow: 0 12px 30px rgba(0,0,0,.65) !important;
}

.bzcs-navbar .dropdown-item {
    padding: 8px 11px;

    color: #bfc6cd;

    border-radius: 2px;

    font-size: 12px;
}

.bzcs-navbar .dropdown-item i {
    color: #7f8994;
}

.bzcs-navbar .dropdown-item:hover,
.bzcs-navbar .dropdown-item:focus {
    color: #fff;

    background: #251315;
}

.bzcs-navbar .dropdown-item:hover i {
    color: #e32a31;
}

.bzcs-navbar .dropdown-divider {
    border-color: #30353a;
}


/* -------------------------
   MOBILE
   ------------------------- */

@media (max-width: 991.98px) {

    .bzcs-navbar {
        min-height: 58px;
    }

    .bzcs-navbar-inner {
        width: 100%;
        min-height: 58px;
        padding: 0 12px !important;
    }

    .bzcs-navbar-brand {
        min-width: auto;
        height: 58px;

        border-right: 0;
    }

    .bzcs-navbar-brand::after {
        display: none;
    }

    .bzcs-navbar .navbar-toggler {
        padding: 6px 8px;

        border: 1px solid #363c43 !important;
        border-radius: 2px;
    }

    .bzcs-navbar .navbar-collapse {
        padding: 7px;

        background: #0d1013;

        border: 1px solid #292f35;
        border-top: 2px solid #c91c22;
    }

    .bzcs-main-nav {
        min-height: 0;
    }

    .bzcs-main-nav > .nav-item {
        display: block;

        border: 0;
        border-bottom: 1px solid #24292f;
    }

    .bzcs-main-nav > .nav-item > .nav-link {
        min-width: 0;
        min-height: 44px;

        justify-content: flex-start;

        padding: 0 12px !important;
    }

    .bzcs-main-nav > .nav-item > .nav-link::after {
        width: 3px;
        height: auto;

        top: 0;
        right: auto;
        bottom: 0;
    }

    .bzcs-navbar .navbar-collapse > .navbar-nav:last-child {
        min-height: 0;
        align-items: stretch;
    }

    .bzcs-navbar .navbar-collapse > .navbar-nav:last-child > .nav-item > .nav-link {
        min-height: 42px;
        margin: 0;
    }
}


/* =========================================================
   BZCS HOME + NAVBAR CLEAN FIX
   ========================================================= */

/* 1. UKLONI CRNE/CRVENE VERTIKALNE CRTE OKO HOME PORTALA */
.bzcs-home {
    border-left: 0 !important;
    border-right: 0 !important;

    box-shadow:
        0 12px 35px rgba(0,0,0,.45) !important;
}

/* Ukloni eventualne pseudo-elemente koji prave rubove */
.bzcs-home::before,
.bzcs-home::after {
    border: 0 !important;
    box-shadow: none !important;
}

/* Main background nema dodatne vertikalne rubove */
body:has(.bzcs-home) #main-content {
    border: 0 !important;
    box-shadow: none !important;
}

/* Footer/Home prijelaz bez crvene horizontalne crte */
body:has(.bzcs-home) .bzcs-footer {
    border-top: 0 !important;
}

/* =========================================================
   NAVBAR V3 - COMPACT GAMING HEADER
   ========================================================= */

.bzcs-navbar {
    min-height: 58px !important;
    padding: 0 !important;

    background:
        linear-gradient(180deg, #12161a 0%, #090c0f 100%) !important;

    border: 0 !important;
    border-bottom: 1px solid #292e34 !important;

    box-shadow: 0 4px 14px rgba(0,0,0,.45) !important;
}

.bzcs-navbar-inner {
    width: min(1180px, calc(100% - 30px)) !important;
    max-width: 1180px !important;
    min-height: 58px !important;

    margin: 0 auto !important;
    padding: 0 !important;
}

/* BRAND */

.bzcs-navbar-brand {
    min-width: 205px !important;
    height: 58px !important;

    margin: 0 10px 0 0 !important;
    padding: 0 14px 0 0 !important;

    border: 0 !important;

    font-size: 18px !important;
}

.bzcs-navbar-brand::after {
    display: none !important;
}

.bzcs-navbar-brand .bi-controller {
    color: #e1282f !important;
    font-size: 20px !important;
}

/* GLAVNI MENI */

.bzcs-main-nav {
    min-height: 58px !important;
    gap: 3px;
}

.bzcs-main-nav > .nav-item {
    border: 0 !important;
}

.bzcs-main-nav > .nav-item > .nav-link {
    min-width: auto !important;
    min-height: 58px !important;

    padding: 0 18px !important;

    border: 0 !important;
    border-radius: 0 !important;

    color: #c5cbd2 !important;

    font-size: 12px !important;
    font-weight: 700 !important;
    text-transform: uppercase;
}

/* potpuno ugasi stare donje crte */
.bzcs-main-nav > .nav-item > .nav-link::after {
    display: none !important;
}

/* obični hover */
.bzcs-main-nav > .nav-item > .nav-link:hover {
    color: #fff !important;

    background:
        linear-gradient(
            180deg,
            #291114 0%,
            #170d0f 100%
        ) !important;
}

/* HOME ACTIVE */

body:has(.bzcs-home) .bzcs-nav-home {
    color: #fff !important;

    background:
        linear-gradient(
            180deg,
            #dc252c 0%,
            #b60d13 100%
        ) !important;

    box-shadow:
        inset 0 -3px #ff4a50,
        inset 0 1px rgba(255,255,255,.08) !important;
}

body:has(.bzcs-home) .bzcs-nav-home i {
    color: #fff !important;
}

/* ICONS */

.bzcs-main-nav .nav-link i {
    color: #8f9aa5 !important;
}

body:has(.bzcs-home) .bzcs-nav-home i {
    color: #fff !important;
}

.bzcs-nav-premium i {
    color: #d5a83b !important;
}

/* DESNA STRANA */

.bzcs-navbar .navbar-collapse > .navbar-nav:last-child {
    min-height: 58px !important;
}

.bzcs-navbar .navbar-collapse > .navbar-nav:last-child > .nav-item > .nav-link {
    min-height: 38px !important;

    margin-left: 4px !important;
    padding: 0 11px !important;

    border: 0 !important;

    font-size: 11px !important;
}

/* HOME WRAPPER - bez vertikalnog okvira */

body:has(.bzcs-home) #main-content > .container-fluid {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.bzcs-home {
    width: min(1180px, 100%) !important;
    max-width: 1180px !important;

    padding-left: 7px !important;
    padding-right: 7px !important;
}

/* BACKGROUND ide cisto iza portala */
body:has(.bzcs-home) #main-content {
    background-position: top center !important;
}

/* MOBILE */

@media (max-width: 991.98px) {

    .bzcs-navbar-inner {
        width: 100% !important;
        padding: 0 12px !important;
    }

    .bzcs-navbar-brand {
        min-width: auto !important;
    }

    .bzcs-main-nav {
        gap: 0;
    }

    .bzcs-main-nav > .nav-item > .nav-link {
        min-height: 44px !important;
        padding: 0 12px !important;
    }

    .bzcs-home {
        width: 100% !important;
    }
}


/* =========================================================
   BZCS HOME + NAVBAR FINAL FIX
   ========================================================= */

/* HOME: ukloni sve stare portal vertikalne rubove */
body:has(.bzcs-home) .bzcs-home {
    width: min(1180px, 100%) !important;
    max-width: 1180px !important;
    margin-left: auto !important;
    margin-right: auto !important;

    border: 0 !important;
    border-left: 0 !important;
    border-right: 0 !important;
    border-top: 0 !important;
    border-bottom: 0 !important;

    outline: 0 !important;

    box-shadow:
        0 0 45px rgba(0,0,0,.82) !important;
}

/* Nemoj crtati pseudo-elemente oko portala */
body:has(.bzcs-home) .bzcs-home::before,
body:has(.bzcs-home) .bzcs-home::after {
    display: none !important;
    content: none !important;
}

/* Main wrapper nema nikakvu crvenu liniju */
body:has(.bzcs-home) #main-content,
body:has(.bzcs-home) #main-content > .container-fluid {
    border: 0 !important;
    outline: 0 !important;
}

body:has(.bzcs-home) #main-content > .container-fluid {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* Ugasi stari pseudo overlay koji je pravio donju crvenu granicu */
body:has(.bzcs-home) #main-content::before,
body:has(.bzcs-home) #main-content::after {
    display: none !important;
    content: none !important;
}

/* HOME footer nema crvenu horizontalnu granicu */
body:has(.bzcs-home) .bzcs-footer {
    border-top: 0 !important;
    box-shadow: none !important;
}

body:has(.bzcs-home) .bzcs-footer::before,
body:has(.bzcs-home) .bzcs-footer::after {
    display: none !important;
    content: none !important;
}


/* =========================================================
   NAVBAR FINAL
   ========================================================= */

.bzcs-navbar {
    min-height: 58px !important;
    padding: 0 !important;

    background:
        linear-gradient(
            180deg,
            #15191e 0%,
            #0b0e11 100%
        ) !important;

    border: 0 !important;
    border-bottom: 1px solid #292e34 !important;

    box-shadow: 0 4px 14px rgba(0,0,0,.45) !important;
}

.bzcs-navbar .bzcs-navbar-inner {
    width: min(1180px, calc(100% - 30px)) !important;
    max-width: 1180px !important;
    min-height: 58px !important;

    margin: 0 auto !important;
    padding: 0 !important;
}

.bzcs-navbar .bzcs-navbar-brand {
    min-width: 205px !important;
    height: 58px !important;

    display: flex !important;
    align-items: center !important;

    margin: 0 10px 0 0 !important;
    padding: 0 14px 0 0 !important;

    border: 0 !important;

    font-size: 18px !important;
}

.bzcs-navbar .bzcs-navbar-brand::after {
    display: none !important;
}

.bzcs-navbar .bzcs-main-nav {
    min-height: 58px !important;
    align-items: stretch !important;
    gap: 2px !important;
}

.bzcs-navbar .bzcs-main-nav > .nav-item {
    display: flex !important;
    align-items: stretch !important;
    border: 0 !important;
}

.bzcs-navbar .bzcs-main-nav > .nav-item > .nav-link {
    min-width: auto !important;
    min-height: 58px !important;

    display: flex !important;
    align-items: center !important;

    padding: 0 18px !important;

    border: 0 !important;
    border-radius: 0 !important;

    color: #c5cbd2 !important;

    font-size: 12px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
}

.bzcs-navbar .bzcs-main-nav > .nav-item > .nav-link::after {
    display: none !important;
}

/* HOME aktivan */
body:has(.bzcs-home) .bzcs-navbar .bzcs-nav-home {
    color: #fff !important;

    background:
        linear-gradient(
            180deg,
            #dc252c 0%,
            #ae0b11 100%
        ) !important;

    box-shadow:
        inset 0 -3px #ff4b50,
        inset 0 1px rgba(255,255,255,.08) !important;
}

body:has(.bzcs-home) .bzcs-navbar .bzcs-nav-home i {
    color: #fff !important;
}

/* ostali hover */
.bzcs-navbar .bzcs-main-nav > .nav-item > .nav-link:hover {
    color: #fff !important;
    background: #211114 !important;
}

/* logo */
.bzcs-navbar .bzcs-navbar-brand .bi-controller {
    color: #e1282f !important;
}

/* premium zvijezda */
.bzcs-navbar .bzcs-nav-premium i {
    color: #d5a83b !important;
}


/* MOBILE */
@media (max-width: 991.98px) {

    .bzcs-navbar .bzcs-navbar-inner {
        width: 100% !important;
        padding: 0 12px !important;
    }

    .bzcs-navbar .bzcs-navbar-brand {
        min-width: auto !important;
    }

    .bzcs-navbar .bzcs-main-nav {
        min-height: 0 !important;
        display: block !important;
    }

    .bzcs-navbar .bzcs-main-nav > .nav-item {
        display: block !important;
    }

    .bzcs-navbar .bzcs-main-nav > .nav-item > .nav-link {
        min-height: 44px !important;
        padding: 0 12px !important;
    }

    body:has(.bzcs-home) .bzcs-home {
        width: 100% !important;
        box-shadow: none !important;
    }
}


/* =========================================================
   BZCS HOME - SEAMLESS FINAL
   ========================================================= */

/*
 * Centralni portal nema vlastitu pozadinu/rub na vanjskom wrapperu.
 * Pozadinu imaju samo stvarni paneli unutar njega.
 */
body:has(.bzcs-home) .bzcs-home {
    background: transparent !important;

    border: 0 !important;
    outline: 0 !important;

    box-shadow: none !important;
}

/*
 * Uklanja sve pseudo-elemente koji mogu napraviti
 * vertikalni spoj uz portal.
 */
body:has(.bzcs-home) .bzcs-home::before,
body:has(.bzcs-home) .bzcs-home::after {
    content: none !important;
    display: none !important;
}

/*
 * Main mora biti jedna kontinuirana background površina.
 */
body:has(.bzcs-home) #main-content {
    border: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;

    padding-bottom: 0 !important;
}

/*
 * Bootstrap wrapper ne smije imati svoju pozadinu/rub.
 */
body:has(.bzcs-home) #main-content > .container-fluid {
    background: transparent !important;

    border: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;

    padding-left: 0 !important;
    padding-right: 0 !important;
    padding-bottom: 0 !important;
}

/*
 * Uklanjamo stari donji overlay/gradient.
 */
body:has(.bzcs-home) #main-content::before,
body:has(.bzcs-home) #main-content::after {
    content: none !important;
    display: none !important;
}

/*
 * Footer na HOME nastavlja istu tamnu površinu.
 * Nema crvenog pojasa iznad njega.
 */
body:has(.bzcs-home) .bzcs-footer {
    margin-top: 0 !important;

    background: #0b0e11 !important;

    border: 0 !important;
    border-top: 0 !important;

    outline: 0 !important;
    box-shadow: none !important;
}

body:has(.bzcs-home) .bzcs-footer::before,
body:has(.bzcs-home) .bzcs-footer::after {
    content: none !important;
    display: none !important;
}

/*
 * Ako footer ima Bootstrap mt-auto / py klase,
 * ne dozvoli vizuelni crveni prijelaz.
 */
body:has(.bzcs-home) .bzcs-footer > .container,
body:has(.bzcs-home) .bzcs-footer > .container-fluid {
    background: transparent !important;
    border: 0 !important;
}


/* Desktop: sadržaj ostaje 1180px */
@media (min-width: 992px) {
    body:has(.bzcs-home) .bzcs-home {
        width: 1180px !important;
        max-width: calc(100% - 30px) !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }
}


/* Mobile */
@media (max-width: 991.98px) {
    body:has(.bzcs-home) .bzcs-home {
        width: 100% !important;
        max-width: 100% !important;
    }
}


/* =========================================================
   BZCS HOME - CENTER PORTAL FINAL
   ========================================================= */

/*
 * Centralni portal mora biti puna tamna površina.
 * Background slika ostaje vidljiva samo lijevo/desno.
 */
body:has(.bzcs-home) .bzcs-home {
    position: relative;

    width: 1180px !important;
    max-width: calc(100% - 30px) !important;

    margin-left: auto !important;
    margin-right: auto !important;

    background: #090c0f !important;

    border: 0 !important;
    outline: 0 !important;
    box-shadow:
        -15px 0 35px rgba(0,0,0,.32),
         15px 0 35px rgba(0,0,0,.32) !important;
}

/*
 * Ticker, promo i sadržaj više nemaju
 * providne rupe prema background slici.
 */
body:has(.bzcs-home) .bzcs-ticker {
    background: #0c1014 !important;
}

body:has(.bzcs-home) .bzcs-promo {
    background:
        radial-gradient(
            circle at 82% 50%,
            rgba(198,40,40,.20),
            transparent 30%
        ),
        linear-gradient(
            105deg,
            #101419 0%,
            #0d1014 55%,
            #280c0f 100%
        ) !important;
}


/*
 * Centralni NEWS / STATS dio.
 */
body:has(.bzcs-home) .bzcs-home-main,
body:has(.bzcs-home) .bzcs-home-content,
body:has(.bzcs-home) .bzcs-home-grid {
    background: #090c0f !important;
}


/*
 * Donji server blokovi moraju sjediti na istoj
 * centralnoj crnoj površini.
 */
body:has(.bzcs-home) .bzcs-home-lists,
body:has(.bzcs-home) .bzcs-server-lists {
    background: #090c0f !important;
}


/*
 * Nema crvenih/vertikalnih linija na rubovima portala.
 */
body:has(.bzcs-home) .bzcs-home,
body:has(.bzcs-home) .bzcs-home > *,
body:has(.bzcs-home) #main-content {
    border-left-color: transparent !important;
    border-right-color: transparent !important;
}


/*
 * FOOTER
 * Čist prijelaz iz portala u footer.
 */
body:has(.bzcs-home) .bzcs-footer {
    margin-top: 0 !important;

    background:
        linear-gradient(
            180deg,
            #090c0f 0%,
            #0c0f13 100%
        ) !important;

    border-top: 0 !important;
    box-shadow: none !important;
}


/*
 * Background se završava uredno prije footera.
 */
body:has(.bzcs-home) #main-content {
    background-color: #080a0c !important;
    border-bottom: 0 !important;
}


/*
 * Nemoj koristiti stare pseudo overlaye.
 */
body:has(.bzcs-home) #main-content::before,
body:has(.bzcs-home) #main-content::after,
body:has(.bzcs-home) .bzcs-home::before,
body:has(.bzcs-home) .bzcs-home::after {
    content: none !important;
    display: none !important;
}


/* MOBILE */
@media (max-width: 991.98px) {

    body:has(.bzcs-home) .bzcs-home {
        width: 100% !important;
        max-width: 100% !important;

        box-shadow: none !important;
    }
}