/* --- Theme Color Variables --- */
:root {

    /*--ocdb-sidebar-bg: rgb(40 39 76); */
    --ocdb-sidebar-bg:  #07063f;

   
    --ocdb-sidebar-text: rgb(255, 255, 255); /* Slightly brighter general text for better label visibility */

   --ocdb-sidebar-link-hover-bg: #ce7d45; 
    
    /*  --ocdb-sidebar-link-hover-bg: #E17121; */

    /* --ocdb-primary-accent: #ce7d45; */

    --ocdb-primary-accent: #ce7d45;;


    --ocdb-sidebar-active-text: #ffffff; /* Usually white for text on accent bg */
    
    --ocdb-sidebar-border-color: #041a28;
    --ocdb-form-container-bg: rgb(74, 70, 107);
    --ocdb-form-border-color: #2f2d5a; 
    
    --ocdb-input-bg: rgb(191, 191, 203);
    /* --ocdb-input-border-color: #ce7d45; */
    --ocdb-input-border-color: #ce7d45;
    #
    --ocdb-input-border-width: 2px; 
    
    --ocdb-input-text-actual: #000000; 
    --ocdb-input-placeholder: rgb(89, 89, 89);  
    
    --ocdb-checkbox-border-color: #7495ae;

    --ocdb-pill-active-text-color: var(--ocdb-sidebar-bg); /* Dark blue text on white pill */
}

/* --- Main Sidebar Column --- */
.ocdb-sidebar-column {
    background-color: var(--ocdb-sidebar-bg);
    color: var(--ocdb-sidebar-text);
}

.ocdb-sidebar-title {
    color: var(--ocdb-sidebar-text);
    font-weight: 500;
}
.ocdb-sidebar-title .hl { 
    color: var(--ocdb-primary-accent);
}
.ocdb-sidebar-title .fa-search { 
    color: var(--ocdb-primary-accent);
}

.ocdb-sidebar-column ::placeholder{
    color: var(--ocdb-input-placeholder) !important; 
    font-style: italic;
}

/* --- Sidebar Menu --- */
#ocdb-main-menu .list-group {
    border: none;
}

#ocdb-main-menu .list-group-item {
    background-color: transparent;
    color: var(--ocdb-sidebar-text);
    border: none;
    border-radius: 0.3rem; 
    margin-bottom: 3px;
    transition: background-color 0.15s ease-in-out, color 0.15s ease-in-out;
    display: flex;
    align-items: center;
}

#ocdb-main-menu .list-group-item > .fa-search { 
    font-size: 0.8em;  
    vertical-align: middle; 
}


#ocdb-main-menu .list-group-item:hover,
#ocdb-main-menu .list-group-item:focus {
    background-color: var(--ocdb-sidebar-link-hover-bg);
    color: var(--ocdb-sidebar-text); 
    text-decoration: none;
}
#ocdb-main-menu .list-group-item:hover > .fa-search,
#ocdb-main-menu .list-group-item:focus > .fa-search {
    color: var(--ocdb-sidebar-text); 
}


#ocdb-main-menu .list-group-item.active {
    background-color: var(--ocdb-primary-accent);
    color: var(--ocdb-sidebar-active-text); 
    font-weight: 500;
}
#ocdb-main-menu .list-group-item.active > .fa-search {
    color: var(--ocdb-sidebar-active-text) !important; 
}
#ocdb-main-menu .list-group-item:not(.active) > .fa-search {
    color: var(--ocdb-sidebar-text); 
}


/* --- Sidebar Menu Pills (Badges) --- */
#ocdb-main-menu .list-group-item .badge {
    font-size: 0.7em; 
    font-weight: 600;
    /* padding: 0.3em 0.6em; /* Bootstrap's default is often 0.35em 0.65em */
    
    /* --- NEW STYLES FOR CONSISTENT PILL SIZE AND TEXT ALIGNMENT --- */
    min-width: 2.8em;   /* Adjust as needed to fit "251" comfortably */
                        /* (3 digits * ~0.5-0.6em/digit) + (padding * 2) */
                        /* Test with 2.5em, 2.8em, 3em */
    text-align: center;
    /* Ensure consistent vertical padding for the pill shape */
    padding-top: 0.35em;    /* Match Bootstrap's typical vertical badge padding */
    padding-bottom: 0.35em; /* Match Bootstrap's typical vertical badge padding */
    /* Horizontal padding is largely handled by rounded-pill for shape, but can be set */
    /* padding-left: 0.65em; */
    /* padding-right: 0.65em; */
    /* ms-5 class in HTML handles the left margin */
}

/* Styling for pills in INACTIVE menu items */
#ocdb-main-menu .list-group-item:not(.active) .badge {
    background-color: var(--ocdb-primary-accent);
    color: var(--ocdb-sidebar-active-text); 
}

/* Styling for pills in ACTIVE menu items */
#ocdb-main-menu .list-group-item.active .badge {
    background-color: var(--ocdb-sidebar-active-text); 
    color: var(--ocdb-pill-active-text-color);       
}


/* --- Search Form Container & General Form Styles --- */
.ocdb-search-form-container {
    background-color: var( --ocdb-form-container-bg);
    border: 2px solid var(--ocdb-form-border-color);
}

.ocdb-search-form-container [data-bs-theme="dark"] {
    --bs-body-color: var(--ocdb-input-text-actual); 
    --bs-border-color: var(--ocdb-input-border-color); 
    --bs-tertiary-bg: var(--ocdb-input-bg);
}

.ocdb-search-form-container .form-control:not(.bootstrap-select > .dropdown-toggle.btn),
.ocdb-search-form-container .form-select:not(.bootstrap-select > .dropdown-toggle.btn) {
    background-color: var(--ocdb-input-bg);
    color: var(--ocdb-input-text-actual); 
    border-width: var(--ocdb-input-border-width);
    border-style: solid;
    border-color: var(--ocdb-input-border-color);
    border-radius: 0.25rem;
    font-size: 0.875rem; 
    line-height: 1.5;    
}

.ocdb-search-form-container .form-control:not(.bootstrap-select > .dropdown-toggle.btn)::placeholder {
    color: var(--ocdb-input-placeholder);
    opacity: 1; 
    font-style: italic;
    font-weight: normal; 
}

.ocdb-search-form-container .form-control:not(.bootstrap-select > .dropdown-toggle.btn):focus,
.ocdb-search-form-container .form-select:not(.bootstrap-select > .dropdown-toggle.btn):focus {
    background-color: var(--ocdb-input-bg);
    color: var(--ocdb-input-text-actual);
    border-color: var(--ocdb-primary-accent); 
    box-shadow: 0 0 0 0.25rem color-mix(in srgb, var(--ocdb-primary-accent) 35%, transparent);
}

.ocdb-search-form-container .form-control.form-check-input:checked {
    background-color: var(--ocdb-primary-accent); 
    color: var(--ocdb-input-text-actual);
    border-color: var(--ocdb-primary-accent); 
    box-shadow: 0 0 0 0.25rem color-mix(in srgb, var(--ocdb-primary-accent) 35%, transparent);
}

.ocdb-search-form-container .form-control-sm{
    color: #000000 !important;  /* Darker gray for better readability */
    opacity: 1 !important;      /* Ensure full opacity */
    font-weight: 400;           /* Normal font weight */
}


.ocdb-search-form-container [data-bs-theme="dark"] .form-check-label {
    color: var(--ocdb-sidebar-text) !important; 
    font-size: 0.875rem; 
    font-weight: normal; 
}

.ocdb-search-form-container .form-check-input {
    background-color: transparent; 
    border-width: var(--ocdb-input-border-width);
    border-style: solid;
    border-color: var(--ocdb-checkbox-border-color);
}
.ocdb-search-form-container .form-check-input:focus {
    border-color: var(--ocdb-primary-accent);
    box-shadow: 0 0 0 0.25rem color-mix(in srgb, var(--ocdb-primary-accent) 35%, transparent);
}

.ocdb-search-form-container .form-control.form-check-input:checked:not(.bootstrap-select > .dropdown-toggle.btn),
.ocdb-search-form-container .form-control.form-check-input:checked[type=radio]:not(.bootstrap-select > .dropdown-toggle.btn),
.ocdb-search-form-container .form-check-input:checked {
    background-color: var(--ocdb-primary-accent); 
    border-color: var(--ocdb-primary-accent);
}
.ocdb-search-form-container .form-control.form-check-input:checked[type=radio]:not(.bootstrap-select > .dropdown-toggle.btn),
.ocdb-search-form-container .form-check-input[type="checkbox"]:checked {
     background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e");
}


/* --- Bootstrap-Select Specific Styling (Dark Theme) --- */
.ocdb-search-form-container .bootstrap-select > .dropdown-toggle.btn {
    background-color: var(--ocdb-input-bg) !important;
    color: var(--ocdb-input-text-actual) !important; 
    border: none !important; 
    border-radius: 0.25rem !important; 
    padding-top: 0.40rem; 
    padding-bottom: 0.40rem;
    font-size: 0.875rem !important; 
    line-height: 1.5 !important; 
    box-shadow: none !important; 
}

.ocdb-search-form-container .bootstrap-select > .dropdown-toggle.bs-placeholder .filter-option-inner-inner {
    color: var(--ocdb-input-placeholder) !important; 
    font-style: italic !important; 
    font-weight: normal !important; 
    opacity: 1 !important; 
}
.ocdb-search-form-container .bootstrap-select > .dropdown-toggle.bs-placeholder:hover .filter-option-inner-inner,
.ocdb-search-form-container .bootstrap-select > .dropdown-toggle.bs-placeholder:focus .filter-option-inner-inner,
.ocdb-search-form-container .bootstrap-select > .dropdown-toggle.bs-placeholder:active .filter-option-inner-inner {
    color: var(--ocdb-input-placeholder) !important;
    font-style: italic !important;
    font-weight: normal !important;
}

.ocdb-search-form-container .bootstrap-select > .dropdown-toggle.btn:focus {
    box-shadow: 0 0 0 0.25rem color-mix(in srgb, var(--ocdb-primary-accent) 35%, transparent) !important;
    border: none !important; 
}

.ocdb-search-form-container .bootstrap-select .dropdown-menu {
    background-color: var(--ocdb-input-bg);
    border: 1px solid var(--ocdb-input-border-color); 
    color: var(--ocdb-input-text-actual);
    width: 100%; 
    margin-top: 1px; 
    border-radius: 0.25rem; 
    box-shadow: 0 0.5rem 1rem rgba(0,0,0,0.15);
}

.ocdb-search-form-container .bootstrap-select .dropdown-menu .inner {
    border: none !important;
    padding: 0 !important; 
    max-height: 200px !important; 
    overflow-y: auto !important;
}

.ocdb-search-form-container .bootstrap-select .dropdown-item {
    color: var(--ocdb-input-text-actual);
    padding: 0.375rem 1rem; 
    font-size: 0.875rem; 
}
.ocdb-search-form-container .bootstrap-select .dropdown-item:hover,
.ocdb-search-form-container .bootstrap-select .dropdown-item:focus {
    background-color: var(--ocdb-sidebar-link-hover-bg);
    color: var(--ocdb-input-text-actual);
}
.ocdb-search-form-container .bootstrap-select .dropdown-item.active,
.ocdb-search-form-container .bootstrap-select .dropdown-item:active {
    background-color: var(--ocdb-primary-accent); 
    color: var(--ocdb-sidebar-active-text);
}

.ocdb-search-form-container .bootstrap-select .bs-searchbox {
    padding: 0.5rem 0.75rem; 
}
.ocdb-search-form-container .bootstrap-select .bs-searchbox .form-control {
    background-color: var(--ocdb-input-bg) !important; 
    color: var(--ocdb-input-text-actual) !important;
    border-width: 1px !important; 
    border-style: solid !important;
    border-color: var(--ocdb-input-border-color) !important; 
    padding: 0.375rem 0.75rem;
    font-size: 0.875rem; 
}
.ocdb-search-form-container .bootstrap-select .bs-searchbox .form-control::placeholder {
    color: var(--ocdb-input-placeholder); 
    font-style: italic; 
    font-weight: normal;
    opacity: 1;
}
.ocdb-search-form-container .bootstrap-select .bs-searchbox .form-control:focus {
    border-color: var(--ocdb-input-border-color) !important; 
    border-width: 1px !important; 
    box-shadow: 0 0 0 0.25rem color-mix(in srgb, var(--ocdb-primary-accent) 35%, transparent) !important;
}


/* Spacing for form elements */
.ocdb-search-form-container .form-group,
.ocdb-search-form-container .bsg-field-group {
    margin-bottom: 0.5rem;
}
.ocdb-search-form-container .row > .col > .form-group:last-child,
.ocdb-search-form-container .row > .col > .bsg-field-group:last-child {
    margin-bottom: 0;
}

/* Buttons */
.ocdb-search-form-container .btn-primary {
    background-color: var(--ocdb-primary-accent); 
    border-color: var(--ocdb-primary-accent); 
    color: var(--ocdb-sidebar-active-text);
    font-weight: 500;
    border-width: var(--ocdb-input-border-width); 
    border-style: solid;
    font-size: 0.875rem; 
    padding: 0.40rem 0.75rem; 
}
.ocdb-search-form-container .btn-primary:hover {
    background-color: color-mix(in srgb, var(--ocdb-primary-accent) 85%, black);
    border-color: color-mix(in srgb, var(--ocdb-primary-accent) 80%, black);
    color: var(--ocdb-sidebar-active-text);
}

.btn-light-purple{
    background-color: var(--ocdb-form-container-bg); 
}
.btn-light-purple:hover{
    background-color: var(--ocdb-primary-accent); 
    color: var(--ocdb-sidebar-active-text);
}