:root {
    --bg-dark: #0e1117;
    --text-light: #e0e0e0;
    --accent: #00c3ff;
    --accent2: #0077ff;
    --font: "Segoe UI", Roboto, sans-serif;
}

body {
    background: radial-gradient(
        circle at 30% 30%,
        #1a1f2b 0%,
        var(--bg-dark) 80%
    );
    color: var(--text-light);
    font-family: var(--font);
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    margin: 0;
    padding: 0;
    padding-bottom: 3.3rem;
    min-height: 100vh;
}

header {
    width: 90%;
}

main {
    width: 100%;
    margin: 0;
    padding: 0;
}

h1 {
    font-size: 2.5em;
    margin-bottom: 0.3em;
    color: var(--accent);
    letter-spacing: 1px;
}

p {
    font-size: 1.1em;
    color: #aaa;
    margin-bottom: 2em;
}

.btn-primary {
    --bs-btn-color: #555;
    --bs-btn-bg: var(--accent);
    --bs-btn-border-color: var(--accent);
    --bs-btn-hover-color: var(--text-light);
    --bs-btn-hover-bg: var(--accent2);
    --bs-btn-hover-border-color: #0b60c1;
    --bs-btn-focus-shadow-rgb: 49, 132, 253;
    --bs-btn-active-color: var(--text-light);
    --bs-btn-active-bg: #0b60c1;
    --bs-btn-active-border-color: #095fc2;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: var(--text-light);
    --bs-btn-disabled-bg: var(--accent);
    --bs-btn-disabled-border-color: var(--accent);
}

.bg-info {
    background-color: var(--accent2) !important;
}

.select2-results__option--selectable {
    color: #0077ff;
}

.breadcrumbMain {
    color: #555;
    background-color: var(--accent);
    margin: 0;
    padding: 0.375rem 0.75rem;
}

.breadcrumb {
    padding: 0;
    margin: 0;
}

.box {
    background: rgba(0, 0, 0, 0.25);
    border: 1px solid #2a2f3a;
    box-shadow: 0 0 15px rgba(0, 195, 255, 0.15);
    animation: flicker 3s infinite ease-in-out;
}

.terminal {
    background: rgba(0, 0, 0, 0.25);
    border: 1px solid #2a2f3a;
    border-radius: 8px;
    padding: 1em 1.5em;
    width: 320px;
    text-align: left;
    font-family: "Courier New", monospace;
    color: var(--accent);
    font-size: 0.9em;
    box-shadow: 0 0 15px rgba(0, 195, 255, 0.15);
    animation: flicker 3s infinite ease-in-out;
}

@keyframes flicker {
    0%,
    100% {
        opacity: 1;
    }
    50% {
        opacity: 0.9;
    }
}

code {
    text-align: start;
}

footer {
    color: #555;
    font-size: 0.8em;
    position: absolute;
    height: fit-content;
    padding: 0.8rem 3rem 1.5rem;
    bottom: 0;
}

.copyrights {
    font-style: italic;
}
