﻿/* =========================================================
   INDEX
   1) COLOR
   2) FONTS
   3) NAVBAR / BORDERS
   4) LOGO
   5) SIDEBAR
   6) DROPDOWN / MENU
   7) TEXT & UTILITIES
   8) RESPONSIVE
   ========================================================= */


/* =========================================================
   1) COLOR
   ========================================================= */
/* color section */
/* (no color tokens defined here; preserved placeholder) */
/* color end */


/* =========================================================
   2) FONTS
   ========================================================= */
/* font section start */
/* (no font-face rules here; preserved placeholder) */
/* font end */


/* =========================================================
   3) NAVBAR / BORDERS
   ========================================================= */
.navbar_border {
    border-bottom: 3px solid #ecedef;
}


/* =========================================================
   4) LOGO
   ========================================================= */
.logo_width {
    width: 160px !important;
}

.logo_text {
    height: 3rem;
    display: flex;
    align-items: center;
    line-height: 3rem;
}

.line_height_3 {
    height: 3rem !important;
}


/* =========================================================
   5) SIDEBAR
   ========================================================= */
.sidebar {
    /* background-color: #0D6EFD !important; */
    background-color: #fff !important;
    background-image: none !important;
}


/* =========================================================
   6) DROPDOWN / MENU
   ========================================================= */
.nav-item .dropdown_menu_hr:hover .dropdown_menu1 {
    display: block !important;
}

.nav-item .navbar_list_style {
    padding: 5px 15px;
}

.nav-item:hover .nav-link {
    font-weight: bold;
}
.right_13 {
    right: 13px !important;
}

/* Show dropdown menu when hovering over the nav item */
.nav-item:hover .dropdown_menu1 {
    display: block !important;
}

.nav-link:hover + .dropdown_menu1 {
    display: block; /* Show the dropdown */
}

.nav-item li {
    line-height: 34px;
    color: #454c61 !important;
}

    .nav-item li:hover {
        line-height: 34px;
        background-color: #f8f9fa !important;
        color: #454c61 !important;
    }

    .nav-item li a {
        line-height: 34px;
        color: #454c61 !important;
    }

    .nav-item li:hover a {
        color: #29aae2 !important;
    }

li > ul {
    display: block;
    padding-left: 24px !important;
}


/* =========================================================
   7) TEXT & UTILITIES
   ========================================================= */
.f_bold {
    font-weight: bold;
}

/* 
#hamburgerMenu {
    display: none;
}

.navbar-toggler:checked ~ #hamburgerMenu {
    display: block;
}
*/
/* Toggle Switch */
.switch {
    position: relative !important;
    display: inline-block !important;
    width: 44px !important;
    height: 24px !important;
}

    .switch input {
        display: none !important;
    }

.slider {
    position: absolute !important;
    cursor: pointer !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    background-color: #ccc !important;
    transition: .4s !important;
    border-radius: 24px !important;
}

    .slider:before {
        position: absolute !important;
        content: "" !important;
        height: 18px !important;
        width: 18px !important;
        left: 3px !important;
        bottom: 3px !important;
        background-color: var(--white-color) !important;
        transition: .4s !important;
        border-radius: 50% !important;
    }

input:checked + .slider {
    background-color: var(--blue-color) !important; /* Blue */
}

    input:checked + .slider:before {
        transform: translateX(20px) !important;
    }

/* Card Styles */
.summary-card {
    background: var(--white-color) !important;
    border-radius: 1rem !important;
    border: 1px solid var(--border-color) !important;
    ;
}

.task-card {
    background: var(--white-color) !important;
    border-radius: 1rem !important;
    border: 1px solid var(--border-color) !important;
    transition: box-shadow 0.2s !important;
}

    .task-card:hover {
        box-shadow: 0 2px 12px rgba(0,0,0,0.08) !important;
    }



/* =========================================================
   8) RESPONSIVE
   ========================================================= */
@media (max-width: 600px) {
    .logo_width {
        width: 140px !important;
    }

    .sidebar {
        position: sticky !important;
        top: 0 !important;
    }
}
