/* =========================================================
   INTELLISTUDENT UNIVERSITY GLOBAL THEME
   ========================================================= */

:root {
    --uni-navy: #0b2d52;
    --uni-navy-dark: #071d35;
    --uni-blue: #0b5ba8;
    --uni-blue-light: #eaf2fb;
    --uni-gold: #f5ca5d;
    --uni-gold-dark: #ad7e16;

    --uni-white: #ffffff;
    --uni-bg: #f4f7fb;
    --uni-surface: #ffffff;

    --uni-text: #1d3048;
    --uni-muted: #718096;

    --uni-border: #dce4ed;

    --uni-shadow:
        0 8px 24px rgba(11, 45, 82, 0.07);

    --uni-shadow-hover:
        0 14px 35px rgba(11, 45, 82, 0.12);

    --uni-radius: 14px;
}


/* =========================================================
   BODY
   ========================================================= */

body {
    background:
        var(--uni-bg) !important;

    color:
        var(--uni-text) !important;

    font-family:
        Inter,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        sans-serif;
}


/* =========================================================
   LINKS
   ========================================================= */

a {
    color:
        var(--uni-blue);

    transition:
        color .2s ease;
}


a:hover {
    color:
        var(--uni-navy);
}


/* =========================================================
   TOP NAVBAR
   ========================================================= */

.navbar {
    background:
        var(--uni-white) !important;

    border-bottom:
        1px solid var(--uni-border);

    box-shadow:
        0 3px 15px rgba(11, 45, 82, 0.05);
}


.navbar-brand {
    color:
        var(--uni-navy) !important;

    font-weight:
        800;
}


.navbar-brand i {
    color:
        var(--uni-gold);
}


.navbar .nav-link {
    color:
        #526278 !important;

    font-weight:
        600;

    border-radius:
        9px;

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


.navbar .nav-link:hover,
.navbar .nav-link.active {
    color:
        var(--uni-navy) !important;

    background:
        var(--uni-blue-light);
}


/* =========================================================
   SIDEBAR
   ========================================================= */

.sidebar {
    background:
        linear-gradient(
            180deg,
            var(--uni-navy-dark),
            var(--uni-navy)
        ) !important;

    border-right:
        1px solid rgba(255,255,255,.07);

    box-shadow:
        5px 0 25px rgba(3, 18, 35, 0.12);
}


.sidebar .nav-link {
    color:
        rgba(255,255,255,.72) !important;

    border-radius:
        10px;

    margin:
        3px 10px;

    transition:
        background .2s ease,
        color .2s ease,
        transform .15s ease;
}


.sidebar .nav-link:hover {
    color:
        white !important;

    background:
        rgba(255,255,255,.09);

    transform:
        translateX(2px);
}


.sidebar .nav-link.active {
    color:
        var(--uni-navy) !important;

    background:
        var(--uni-gold);

    font-weight:
        700;

    box-shadow:
        0 5px 16px rgba(245,202,93,.18);
}


.sidebar .nav-link i {
    color:
        inherit;
}


/* Sidebar headings */
.sidebar .nav-section,
.sidebar .sidebar-heading,
.sidebar small {
    color:
        rgba(255,255,255,.42) !important;

    font-weight:
        700;

    letter-spacing:
        .08em;
}


/* =========================================================
   MAIN CONTENT
   ========================================================= */

.main-content,
.page-content,
.content-area {
    background:
        var(--uni-bg);
}


/* =========================================================
   PAGE HEADINGS
   ========================================================= */

.page-title,
h1.page-title {
    color:
        var(--uni-navy);

    font-weight:
        800;

    letter-spacing:
        -.025em;
}


.page-subtitle {
    color:
        var(--uni-muted) !important;
}


/* General headings */
h1,
h2,
h3,
h4,
h5,
h6 {
    color:
        var(--uni-text);
}


/* =========================================================
   CARDS
   ========================================================= */

.card,
.card-soft {
    background:
        var(--uni-surface) !important;

    border:
        1px solid var(--uni-border) !important;

    border-radius:
        var(--uni-radius) !important;

    box-shadow:
        var(--uni-shadow);

    transition:
        transform .2s ease,
        box-shadow .25s ease,
        border-color .2s ease;
}


.card:hover,
.card-soft:hover {
    box-shadow:
        var(--uni-shadow-hover);

    border-color:
        #cbd8e6 !important;
}


.card-header {
    background:
        #f8fafc !important;

    color:
        var(--uni-navy);

    border-bottom:
        1px solid var(--uni-border);
}


/* =========================================================
   UNIVERSITY GOLD ACCENT
   ========================================================= */

.text-gold {
    color:
        var(--uni-gold-dark) !important;
}


.bg-gold {
    background:
        var(--uni-gold) !important;
}


/* =========================================================
   BUTTONS
   ========================================================= */

.btn-primary {
    background:
        var(--uni-navy) !important;

    border-color:
        var(--uni-navy) !important;

    color:
        white !important;

    font-weight:
        700;

    border-radius:
        10px;

    box-shadow:
        0 6px 16px rgba(11,45,82,.12);

    transition:
        transform .18s ease,
        background .2s ease,
        box-shadow .2s ease;
}


.btn-primary:hover {
    background:
        #154875 !important;

    border-color:
        #154875 !important;

    transform:
        translateY(-1px);

    box-shadow:
        0 9px 22px rgba(11,45,82,.18);
}


.btn-outline-primary {
    color:
        var(--uni-navy) !important;

    border-color:
        var(--uni-navy) !important;

    border-radius:
        10px;

    font-weight:
        700;
}


.btn-outline-primary:hover {
    background:
        var(--uni-navy) !important;

    border-color:
        var(--uni-navy) !important;

    color:
        white !important;
}


.btn-warning {
    background:
        var(--uni-gold) !important;

    border-color:
        var(--uni-gold) !important;

    color:
        #142238 !important;

    font-weight:
        700;
}


.btn-outline-secondary {
    border-radius:
        10px;

    font-weight:
        600;
}


/* =========================================================
   BADGES
   ========================================================= */

.badge.bg-primary {
    background:
        var(--uni-navy) !important;
}


.badge.bg-success {
    background:
        #3f8059 !important;
}


.badge.bg-warning {
    color:
        #392b08 !important;

    background:
        var(--uni-gold) !important;
}


/* =========================================================
   FORM CONTROLS
   ========================================================= */

.form-control,
.form-select {
    border:
        1px solid var(--uni-border);

    border-radius:
        10px;

    background:
        #fbfcfe;

    color:
        var(--uni-text);

    min-height:
        45px;

    transition:
        border-color .2s ease,
        box-shadow .2s ease,
        background .2s ease;
}


.form-control:focus,
.form-select:focus {
    border-color:
        #b48a29;

    background:
        white;

    box-shadow:
        0 0 0 4px rgba(180,138,41,.10);
}


/* =========================================================
   TABLES
   ========================================================= */

.table {
    color:
        var(--uni-text);
}


.table thead th {
    background:
        #eef4fa;

    color:
        var(--uni-navy);

    border-bottom:
        2px solid #cfdae7;

    font-weight:
        800;
}


.table tbody tr {
    transition:
        background .15s ease;
}


.table tbody tr:hover {
    background:
        #f7fafe;
}


.table td,
.table th {
    border-color:
        #e1e8f0;
}


/* =========================================================
   ALERTS
   ========================================================= */

.alert {
    border-radius:
        12px;

    border:
        1px solid transparent;
}


/* =========================================================
   PROGRESS BARS
   ========================================================= */

.progress {
    height:
        9px;

    border-radius:
        20px;

    background:
        #e3eaf2;
}


.progress-bar {
    background:
        var(--uni-navy);
}


/* =========================================================
   NAV TABS
   ========================================================= */

.nav-tabs {
    border-bottom:
        1px solid var(--uni-border);
}


.nav-tabs .nav-link {
    color:
        #6b7a8e;

    border:
        none;

    border-bottom:
        3px solid transparent;
}


.nav-tabs .nav-link:hover {
    color:
        var(--uni-navy);
}


.nav-tabs .nav-link.active {
    color:
        var(--uni-navy);

    font-weight:
        700;

    border-bottom:
        3px solid var(--uni-gold);

    background:
        transparent;
}


/* =========================================================
   DROPDOWNS
   ========================================================= */

.dropdown-menu {
    border:
        1px solid var(--uni-border);

    border-radius:
        12px;

    box-shadow:
        0 15px 35px rgba(11,45,82,.12);
}


.dropdown-item {
    color:
        var(--uni-text);

    border-radius:
        7px;

    margin:
        2px 5px;

    width:
        calc(100% - 10px);
}


.dropdown-item:hover {
    background:
        var(--uni-blue-light);

    color:
        var(--uni-navy);
}


/* =========================================================
   MODALS
   ========================================================= */

.modal-content {
    border:
        1px solid var(--uni-border);

    border-radius:
        16px;

    box-shadow:
        0 25px 80px rgba(5,25,45,.25);
}


.modal-header {
    background:
        var(--uni-navy);

    color:
        white;

    border-radius:
        15px 15px 0 0;
}


.modal-header .modal-title {
    color:
        white;
}


/* =========================================================
   PAGINATION
   ========================================================= */

.page-link {
    color:
        var(--uni-navy);

    border-color:
        var(--uni-border);
}


.page-link:hover {
    background:
        var(--uni-blue-light);

    color:
        var(--uni-navy);
}


.page-item.active .page-link {
    background:
        var(--uni-navy);

    border-color:
        var(--uni-navy);
}


/* =========================================================
   PROFILE / USER AREA
   ========================================================= */

.user-name,
.profile-name {
    color:
        var(--uni-navy);

    font-weight:
        800;
}


/* =========================================================
   ICON ACCENTS
   ========================================================= */

.card i.text-primary,
.text-primary {
    color:
        var(--uni-blue) !important;
}


/* =========================================================
   DIVIDERS
   ========================================================= */

hr {
    border-color:
        var(--uni-border);

    opacity:
        1;
}


/* =========================================================
   FOOTER
   ========================================================= */

footer {
    color:
        #7c8a9b;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 768px) {

    .card,
    .card-soft {
        border-radius:
            12px !important;
    }

    .page-title {
        font-size:
            1.55rem;
    }

    .table-responsive {
        border-radius:
            12px;
    }

}