/* Neo-Brutalism UI Global Overrides stylesheet for SIBK */

:root {
    --neo-bg: #FFF3C8;
    --neo-sidebar: #458393;
    --neo-sidebar-active: #34A99D;
    --neo-card: #FFF8DE;
    --neo-card-alt: #EED9A7;
    --neo-heading: #1F2A2E;
    --neo-text: #314246;
    --neo-muted: #647376;
    --neo-primary-btn: #34A99D;
    --neo-primary-btn-text: #FFFFFF;
    --neo-secondary-btn: #E5CB90;
    --neo-secondary-btn-text: #2E3A3D;
    --neo-border: #D9CCA5;
}

body {
    background-color: var(--neo-bg) !important;
    font-family: 'Lexend Deca', 'Poppins', sans-serif !important;
    color: var(--neo-text) !important;
}

/* Headings */
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
    color: var(--neo-heading) !important;
    font-weight: 800;
}

p, span, td, div {
    color: var(--neo-text);
}

/* Card Styling */
.card {
    background-color: var(--neo-card) !important;
    border: 3px solid var(--neo-border) !important;
    box-shadow: 5px 5px 0px var(--neo-border) !important;
    border-radius: 8px !important;
    overflow: hidden;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.card:hover {
    transform: translate(-2px, -2px);
    box-shadow: 7px 7px 0px var(--neo-border) !important;
}

.card-header {
    background-color: var(--neo-card-alt) !important;
    border-bottom: 3px solid var(--neo-border) !important;
    font-weight: 800 !important;
    color: var(--neo-heading) !important;
}

/* Buttons */
.btn {
    border: 3px solid var(--neo-border) !important;
    border-radius: 8px !important;
    font-weight: 800 !important;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    box-shadow: 3px 3px 0px var(--neo-border) !important;
    transition: all 0.15s ease;
}

.btn:hover:not(:disabled) {
    transform: translate(-2px, -2px) !important;
    box-shadow: 5px 5px 0px var(--neo-border) !important;
}

.btn:active:not(:disabled) {
    transform: translate(1px, 1px) !important;
    box-shadow: 1px 1px 0px var(--neo-border) !important;
}

.btn-primary {
    background-color: var(--neo-primary-btn) !important;
    color: var(--neo-primary-btn-text) !important;
}
.btn-success {
    background-color: var(--neo-primary-btn) !important;
    color: var(--neo-primary-btn-text) !important;
}
.btn-warning {
    background-color: var(--neo-secondary-btn) !important;
    color: var(--neo-secondary-btn-text) !important;
}
.btn-danger {
    background-color: #e11d48 !important;
    color: #ffffff !important;
}
.btn-info {
    background-color: var(--neo-secondary-btn) !important;
    color: var(--neo-secondary-btn-text) !important;
}
.btn-secondary {
    background-color: var(--neo-secondary-btn) !important;
    color: var(--neo-secondary-btn-text) !important;
}

/* Inputs & Form Controls */
.form-control, .form-select {
    border: 3px solid var(--neo-border) !important;
    background-color: var(--neo-card) !important;
    border-radius: 8px !important;
    font-weight: 600 !important;
    color: var(--neo-text) !important;
    box-shadow: 2px 2px 0px var(--neo-border) !important;
    transition: all 0.15s ease;
}

.form-control:focus, .form-select:focus {
    outline: none !important;
    box-shadow: 4px 4px 0px var(--neo-border) !important;
    background-color: var(--neo-card-alt) !important;
    border-color: var(--neo-border) !important;
    color: var(--neo-text) !important;
}

/* Badges */
.badge {
    border: 2px solid var(--neo-border) !important;
    box-shadow: 1.5px 1.5px 0px var(--neo-border) !important;
    border-radius: 4px !important;
    font-weight: 800 !important;
    color: var(--neo-heading) !important;
    padding: 0.4em 0.6em !important;
}
.bg-primary { background-color: var(--neo-primary-btn) !important; color: var(--neo-primary-btn-text) !important; }
.bg-success { background-color: var(--neo-primary-btn) !important; color: var(--neo-primary-btn-text) !important; }
.bg-warning { background-color: var(--neo-secondary-btn) !important; color: var(--neo-secondary-btn-text) !important; }
.bg-danger { background-color: #e11d48 !important; color: #ffffff !important; }
.bg-info { background-color: var(--neo-secondary-btn) !important; color: var(--neo-secondary-btn-text) !important; }
.bg-secondary { background-color: var(--neo-card-alt) !important; color: var(--neo-secondary-btn-text) !important; }

/* Alerts */
.alert {
    border: 3px solid var(--neo-border) !important;
    box-shadow: 4px 4px 0px var(--neo-border) !important;
    border-radius: 8px !important;
    color: var(--neo-text) !important;
    font-weight: 700 !important;
}
.alert-success { background-color: var(--neo-card) !important; border-color: var(--neo-primary-btn) !important; }
.alert-danger { background-color: #ffe4e6 !important; border-color: #e11d48 !important; }
.alert-warning { background-color: var(--neo-card-alt) !important; }
.alert-info { background-color: var(--neo-card) !important; border-color: var(--neo-sidebar) !important; }

/* Tables */
.table {
    border: 3px solid var(--neo-border) !important;
    border-collapse: collapse !important;
    border-radius: 8px !important;
    overflow: hidden !important;
}
.table th {
    background-color: var(--neo-card-alt) !important;
    color: var(--neo-heading) !important;
    border: 3px solid var(--neo-border) !important;
    font-weight: 800 !important;
    text-transform: uppercase;
}
.table td {
    border: 2px solid var(--neo-border) !important;
    background-color: var(--neo-card) !important;
    color: var(--neo-text) !important;
    font-weight: 600 !important;
}

/* Modals */
.modal-content {
    border: 4px solid var(--neo-border) !important;
    box-shadow: 8px 8px 0px var(--neo-border) !important;
    border-radius: 12px !important;
    background-color: var(--neo-card) !important;
}
.modal-header {
    border-bottom: 3px solid var(--neo-border) !important;
    background-color: var(--neo-card-alt) !important;
}
.modal-footer {
    border-top: 3px solid var(--neo-border) !important;
}

/* Custom Neo Classes */
.neo-box-yellow {
    background-color: var(--neo-card-alt) !important;
    border: 3px solid var(--neo-border) !important;
    box-shadow: 4px 4px 0px var(--neo-border) !important;
    border-radius: 8px !important;
}
.neo-box-orange {
    background-color: var(--neo-secondary-btn) !important;
    border: 3px solid var(--neo-border) !important;
    box-shadow: 4px 4px 0px var(--neo-border) !important;
    border-radius: 8px !important;
}
.neo-box-blue {
    background-color: var(--neo-sidebar) !important;
    border: 3px solid var(--neo-border) !important;
    box-shadow: 4px 4px 0px var(--neo-border) !important;
    border-radius: 8px !important;
}
.neo-box-green {
    background-color: var(--neo-primary-btn) !important;
    border: 3px solid var(--neo-border) !important;
    box-shadow: 4px 4px 0px var(--neo-border) !important;
    border-radius: 8px !important;
}
.neo-box-white {
    background-color: var(--neo-card) !important;
    border: 3px solid var(--neo-border) !important;
    box-shadow: 4px 4px 0px var(--neo-border) !important;
    border-radius: 8px !important;
}

/* Vis Network Customization */
#mynetwork {
    border: 3px solid var(--neo-border) !important;
    box-shadow: 4px 4px 0px var(--neo-border) !important;
}
