/* BASE STYLES */
html, body {
    height: 100%;
}
body {
    display: flex;
    flex-direction: column;
}
html {
    scrollbar-width: thin;
    scrollbar-color: #0d2c4b #f8f9fa;
}
html::-webkit-scrollbar {
    width: 8px;
}
html::-webkit-scrollbar-track {
    background: #f8f9fa;
}
html::-webkit-scrollbar-thumb {
    background: #0d2c4b;
    border-radius: 4px;
}
html::-webkit-scrollbar-thumb:hover {
    background: #1a4a6e;
}
.container-fluid.p-4 {
    padding: 1.5rem !important;
}
.alert {
    border: none;
    border-radius: 0.5rem;
    border-left: 4px solid;
}
.alert-info {
    border-left-color: #0dcaf0;
}
.alert-success {
    border-left-color: #198754;
}
.alert-danger {
    border-left-color: #dc3545;
}
.alert-warning {
    border-left-color: #ffc107;
}

/* LAYOUT & UTILITIES */
#page-content-wrapper {
    width: 100%;
    transition: margin-left 0.3s ease;
    min-height: 100vh;
    flex: 1 0 auto;
}
.ms-md-250 {
    margin-left: 250px !important;
}
.feature-icon-primary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 4rem;
    height: 4rem;
    border-radius: 0.75rem;
}
.collapse {
    transition: all 0.3s ease;
}
.dropdown-menu {
    border: none;
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
    border-radius: 0.5rem;
}
.dropdown-item {
    padding: 0.5rem 1rem;
    transition: all 0.2s ease;
}
.dropdown-item:hover {
    background-color: #e9ecef;
}
.text-muted .display-1 {
    font-size: 4rem;
    opacity: 0.5;
}

/* FORM & CONTROL BASE */
.form-control:focus,
.form-select:focus {
    border-color: #0d2c4b;
    box-shadow: 0 0 0 0.2rem rgba(13, 44, 75, 0.25);
}

/* RESPONSIVE BASE */
@media (min-width: 768px) {
    #page-content-wrapper.ms-md-250 {
        width: calc(100% - 250px) !important;
    }
    #wrapper.sidebar-toggled #page-content-wrapper {
        margin-left: 0 !important;
        width: 100% !important; 
    }
}
@media (max-width: 768px) {
    .ms-md-250 {
        margin-left: 0 !important;
    }
    #page-content-wrapper {
        width: 100% !important;
    }
    .container-fluid.p-4 {
        padding: 1rem !important;
    }
}