@import url('https://fonts.googleapis.com/css2?family=Hanken+Grotesk:ital,wght@0,100..900;1,100..900&family=Tiro+Devanagari+Hindi:ital@0;1&display=swap');

:root{
    --red: #DC3545;
    --green: #28A745;
    --blue: #04539C;
}

html {
    overflow: auto;
    scrollbar-width: none; /* Firefox: hides scrollbar */
    -ms-overflow-style: none;  /* IE and Edge */
    scroll-behavior: smooth;
}

html::-webkit-scrollbar {
    width: 0;
    height: 0;
}

body {
    font-family: "Tiro Devanagari Hindi", serif;
    margin: 0;
    padding: 0;
    overflow: hidden; 
}
body::before {
    content: ""; 
    position: fixed;
    top: 9rem;
    left: 50%;
    transform: translateX(-50%);
    width: 80%;
    height: 80%;
    background: url('../img/background.png') no-repeat center;
    background-size: contain; 
    opacity: 0.1; 
    z-index: -1; 
}

button:hover,
button:focus,
a:focus,
a:hover {
    cursor: pointer;
    text-decoration: none;
    box-shadow: none;
    outline: none;
}

/* Navbar */
.nav-link{
    margin: 0 10px;
}

.main-heading, 
.main-heading-manage{
    text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.4) !important;
}
.main-heading-manage{
    color: var(--blue);
}

/* Search */
.transparent-input{
    background-color: transparent;
    border: 1px solid #04539C;
}
.search-btn{
    border: none;
    background: none;
}
.search-btn i{
    font-size: 1.2rem;
    color: #b6b6b6;
    position: absolute;
    left: -30px;
    bottom: 50%;
    transform: translateY(50%);
}


/* Remove Bootstrap's default bottom border from tabs */
.nav-tabs {
    border-bottom: none;
}

/* Custom styles for language buttons */
.language-btn .nav-item {
    white-space: nowrap;
    margin: 0; /* Ensure no extra margin between items */
    border: 1px solid var(--red); /* Custom border color */
    border-radius: 6px;
    background-color: transparent; /* Transparent background for non-active tabs */
    color: var(--red); /* Text color */
    width: 45px; /* Fixed width for consistency */
    text-align: center; /* Center the text inside the button */
    padding: 5px 10px; /* Adjust padding for better appearance */
    transition: all 0.3s ease; /* Smooth transition for hover effect */
}

.language-btn .nav-item:hover {
    background-color: var(--red); /* Background on hover */
    color: #fff; /* Text color on hover */
}

/* Active button style */
.language-btn .nav-item.active {
    background-color: var(--red); /* Active background color */
    color: #fff; /* Active text color */
    box-shadow: inset 3px 3px 6px rgba(0, 0, 0, 0.2); /* Active box-shadow */
    border-color: var(--red); /* Border color for active button */
}

/* Statistics Cards */
.statistics-cards .card{
    position: relative;
    width: minmax(25%, 320px);
    min-height: 185px;
    background: #fff;
    box-shadow: 0px 3px 3px 0px rgba(0, 0, 0, 0.2);
    border-radius: 6px;
    transition: 0.4s ;
}

/* Parts Cards Hover */
/* .statistics-cards #parts-card:hover{
    background: var(--blue);
}
.statistics-cards .card:hover h5,
.statistics-cards .card:hover p{
    color: #fff !important;
}
.statistics-cards .card:hover button{
    background: #fff !important;
}
.statistics-cards #parts-card:hover button i{
    color: var(--blue);
} */

/* Schedules Cards Hover */
/* .statistics-cards #schedules-card:hover{
    background: var(--red);
}
.statistics-cards #schedules-card:hover button i{
    color: var(--red);
} */

/* Articles Cards Hover */
/* .statistics-cards #articles-card:hover{
    background: var(--green);
} */ 


.statistics-cards .card h5,
.statistics-cards .card p{
    font-size: 1.7rem;
}
.statistics-cards .card p{
    margin-top: -10px;
}

.statistics-cards #parts-card h5,
.statistics-cards #parts-card p{
    color: #04539C;
}
.statistics-cards #schedules-card h5,
.statistics-cards #schedules-card p{
    color: #DC3545;
}
.statistics-cards #articles-card h5,
.statistics-cards #articles-card p{
    color: #28A745;
}

.statistics-cards #parts-card{
    border-top: 3px solid #04539C;
}
.statistics-cards #parts-card button{
    background: #04539C;
}
.statistics-cards #schedules-card{
    border-top: 3px solid #DC3545;
}
.statistics-cards #schedules-card button{
    background: #DC3545;
}
.statistics-cards #articles-card{
    border-top: 3px solid #28A745;
}

.statistics-cards .card .add-parts-btn{
    position: absolute;
    right: 12px;
    bottom: 12px;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 30px;
    height: 30px;
    cursor: pointer;
    border: none;
    border-radius: 6px;
}
.statistics-cards .card .add-parts-btn i{
    color: #fff;
    font-size: 1.4rem;
}

#articles-card .card-body img{
    width: 20%;
}

#parts-card {
    position: relative;
    background: url("../img/parts.png") no-repeat; 
    background-size: 45%;
    background-position: 85% center;
    overflow: hidden;
}

#schedules-card {
    position: relative;
    background: url("../img/schedule.png") no-repeat;
    background-size: 45%; 
    background-position: 85% center;
    overflow: hidden;
}

#parts-card::before,
#schedules-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.6); 
    z-index: 1;
}

#parts-card .card-body,
#schedules-card .card-body {
    position: relative;
    z-index: 2;
}


/* Accordion */
.accordion .card{
    border: none !important;
    border-radius: 6px;
    box-shadow: 2px 2px 12px rgba(0, 0, 0, 0.1);
    cursor: pointer;
    background: transparent;
    transition: background-color 0.5s;
}
.accordion #partsheader,
.accordion #schedulesheader,
.accordion #preambleHeader{
    background-color: white transparent !important;
}
.accordion .card:hover,
.accordion .card .card-header:hover{
    background-color: #fff !important;
}

#lawAccordion,
#schedulesAccordion{
    border-left: 3px solid #DC3545;
    border-radius: 6px;
}
#partsAccordion{
    border-left: 3px solid #04539C;
    border-radius: 6px;
}
.no-left-border {
    border-left: none !important;
}

.accordion .card .card-header h2 button{
    color: #000;
    font-size: 1.4rem;
}
.accordion .card .card-header button:hover,
.accordion .card .card-header button:focus{
    text-decoration: none;
    box-shadow: none;
    outline: none;
}

.accordion .card .card-header h2 i{
    color: #DC3545;
}

.rotated-icon {
    transform: rotate(180deg);
    transition: transform 0.3s ease-in-out;
}

.view-button{
    padding: 2px 12px;
    background-color: var(--blue);
    color: #fff;
}
.view-button:hover{
    color: #fff;
}

.accordion-main{
    overflow-y: scroll;
    max-height: 450px;
}

/* Custom scrollbar for Webkit browsers */
.accordion-main::-webkit-scrollbar {
    width: 9px;
}

.accordion-main::-webkit-scrollbar-track {
    background: #ebebeb;
    border-radius: 10px;
}

.accordion-main::-webkit-scrollbar-thumb {
    background: #A9A9A9; 
    border-radius: 10px; 
}

.accordion-main::-webkit-scrollbar-thumb:hover {
    background: #8d8d8d; 
}


.part-accordion .card {
    border-left: 3px solid var(--blue) !important;
}

.schedule-accordion .card {
    border-left: 3px solid var(--red) !important;
}

.parts-content ul li{
    list-style: none;
    line-height: 2.1rem;
    font-size: 1.2rem;
}
.parts-content ul li a{
    text-decoration: none;
    color: var(--blue);
}



/* law_detail CSS */

/* Sidebar styling */
.sidebar {
    position: -webkit-sticky; /* For Safari */
    position: sticky; /* Make sidebar sticky */
    top: 0; /* Adjust to ensure it doesn't overlap with the header/navbar */
    height: calc(100vh - 60px); /* Full viewport height minus navbar height */
    overflow-y: auto; /* Enable vertical scrolling */
    border-right: 1px solid #ddd; /* Optional right border */

}

.sidebar::-webkit-scrollbar-track{
    background-color: #f8f9fa;
    width: 3px;
    height: auto;
}
.sidebar::-webkit-scrollbar-thumb{
    background-color: #A9A9A9;
    width: 3px;
    height: auto;
    border-radius: 10px;
}

/* Styling for navigation links */
.list-group-item {
    border: none;
    cursor: pointer;
    white-space: nowrap; /* Prevent text from wrapping */
    overflow: hidden; /* Hide overflow text */
    text-overflow: ellipsis; /* Show ellipsis for overflow text */
}

.list-group-subitems a:hover {
    background-color: #95bde3;
    border-radius: 25px;
}

.list-group-item h5{
    color: var(--blue);
}

.list-group-subitems{
    margin-left: 10px;
}
.list-group-subitem{
    margin-left: 15px;
}


.list-group-item-action.active {
    background-color: var(--blue); /* Active item background color */
    color: #fff;
    border-left: 3px solid var(--blue); /* Highlight active item */
}

.detail-nav-btn li a {
    color: #000 !important;
}

.detail-nav-btn .nav-item .nav-link.active {
    background-color: var(--red);
    color: #fff !important;
}

.detail-nav-btn .nav-item .nav-link {
    transition: background-color 0.3s ease;
}


/* Adjustments for mobile view */
@media (max-width: 992px) {
    .sidebar {
        position: relative;
        width: 100%;
        height: auto;
        overflow: visible;
    }
    .col-lg-10 {
        margin-left: 0;
        width: 100%;
    }
}


/* Indent for collapsible sections */
/* .collapse {
    margin-left: 1rem; /* Indent collapsible content 
    border-left: 1px solid #ddd; /* Visual separation 
    padding-left: 1rem;
} */
/* .fixed-header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1100;
}
*/

.fixed-header ul li a{
    color: #fff !important;
}
