/* Serverlist V Red Glow Theme with Glass Effect and White Text */

@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@500&display=swap');

body {
    background-image: url(https://wallpapercave.com/wp/wp2809948.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    background-attachment: fixed;
    font-family: 'Orbitron', sans-serif; /* Best gaming font */
    overflow: hidden;
    color: #ffffff; /* White text */
}

h3 {
    color: #ffffff; /* White text */
    border-radius: 20px;
    padding: 10px;
    backdrop-filter: blur(12px); /* More blur for better glass effect */
    background-color: rgba(0, 0, 0, 0.35); /* Slightly more transparent */
}

h5 {
    color: #ffffff; /* White text */
}

.form-check-input {
    background-color: rgba(85, 0, 0, 0.35); /* Slightly more transparent dark red */
    border-radius: 10px;
}

.form-check-input:checked {
    background-color: rgba(255, 102, 102, 0.55); /* Slightly more transparent red */
    accent-color: rgba(255, 102, 102, 0.55);
}

navbar-brand {
    font-size: 30px;
    animation: flicker 1.5s infinite alternate;
}
.card {
    margin-top: 10px;
    background-color: rgba(0, 0, 0, 0.45); /* More transparent glass effect */
    border-radius: 12px; /* Enhanced radius */
    backdrop-filter: blur(12px); /* More blur */
    transition-duration: 0.2s !important;
}

.card:hover {
    background-color: rgba(0, 0, 0, 0.55); /* Slightly darker for hover */
}

b {
    color: #ffffff; /* White text */
}

i {
    color: rgba(255, 77, 77, 0.6); /* Slightly more transparent darker red */
}

#customSystemButton:hover i {
    color: #ffffff;
    background-color: rgba(0, 0, 0, 0.45); /* Slightly more transparent background */
}

#customSystemURLInput {
    color: #ffffff; /* White text */
    backdrop-filter: brightness(0.8) blur(6px) saturate(1.1); /* More blur */
    background-color: rgba(0, 0, 0, 0.35); /* Transparent black background */
    border-radius: 7.5px;
    font-size: 12px;
    padding: 5px;
}

#customGameShareButton {
    display: none;
    font-size: 1px;
}

label {
    color: #ffffff; /* White text */
    font-weight: 700;
}

.modal-content {
    background-color: rgba(102, 0, 0, 0.5); /* Slightly more transparent dark red */
    border-radius: 12px;
    backdrop-filter: blur(18px); /* More blur */
}

#systemsList::-webkit-scrollbar {
    width: 5px;
    background-color: rgba(255, 255, 255, 0);
}

.btn-danger {
    color: #ffffff; /* White text */
    background-color: rgba(102, 0, 0, 0.5); /* Slightly more transparent dark red */
    border-radius: 8px;
}

footer {
    color: #ffffff;
    font-size: 1px;
    display: none;
}

#systemReportCard {
    border-radius: 12px;
}

#systemReportPlayerList {
    color: #f0f5f1; /* White text */
}

#systemReportLink {
    color: #3cff2a; /* White text */
}

#customThemeShow {
    color: rgba(255, 102, 102, 0.6); /* Glowing red with more transparency */
    border-radius: 10px;
    transition-duration: 0.2s !important;
    backdrop-filter: blur(12px); /* More blur */
}

#customThemeShow:hover {
    background-color: rgba(0, 0, 0, 0.45); /* Slightly transparent background */
    color: rgba(255, 102, 102, 0.6); /* Glowing red with more transparency */
    font-weight: bold;
}

#settingsPanel {
    background-color: rgba(0, 0, 0, 0.65); /* Slightly more transparent black with blur effect */
    border-radius: 10px;
}

.text-center {
    color: #ffffff; /* White text */
}

.col-sm-2 {
    color: #ffffff; /* White text */
}

#systemsList div.system-card:hover,
#systemsList div.bg-dark.system-card:hover {
    cursor: pointer;
}

#systemReportCard:hover,
#systemReportCard.bg-dark:hover {
    background-color: rgba(0, 0, 0, 0.65); /* Slightly more transparent hover */
}

.w-10 {
    border-radius: 12px;
    backdrop-filter: blur(6px); /* More blur */
}

.w-90 {
    border-radius: 12px;
    backdrop-filter: blur(6px); /* More blur */
}

#customSystemButton {
    border-radius: 8px;
    backdrop-filter: blur(6px); /* More blur */
}

.w-10:hover {
    background-color: rgba(255, 51, 51, 0.2); /* Light red hover */
    color: rgba(255, 102, 102, 0.6); /* Glowing red with more transparency */
}

.w-90:hover {
    background-color: rgba(255, 51, 51, 0.2); /* Light red hover */
    font-weight: bold;
}