.leaflet-control-container{
    position: absolute;
    top: 326px;
}

.no-border {
    border-bottom: none !important;
}


.reset-zoom-container {
    display: flex;
    justify-content: center;
    align-items: center;
}

/* .bi {
    font-size: 1.25rem;
    line-height: 1;
    vertical-align: middle;
} */

.dropdown-toggle::after {
    display: none;  /* Remove the default caret from the dropdown toggle */
}

.ag-row.dummy-date{
    /* height:1px; */
    /* display: none !important; */
    height: 0px !important;
    min-height: 0px !important;
    max-height: 0px !important;
    overflow: hidden !important;
    pointer-events: none;
}

.copy-right-text {

    color: #ffffff;
  
}
  
.copy-right-text a {
  
    color: #ffb606;
  
  }

  .copy-right-text a:hover {
  
    color: blue;
  
  }
  
.terms-privacy li+li {
  
    margin-left: 30px;
  
  }
  
.terms-privacy li a {
  
    color: #888;
  
    position: relative;
  
  }
  
.terms-privacy li a:after {
  
    position: absolute;
  
    content: '|';
  
    color: blue;
  
    display: inline-block;
  
    top: 0;
  
    right: -18px;
  
  }
  
.terms-privacy li+li a:after {
  
    display: none;
  
  }
   
.footer-link:hover{
    text-decoration: underline;
}

.color{
    background-color: lightsteelblue;
    pointer-events: none;
    font-weight: bold;
}

.text-green-bold{
    color: green ;
    font-weight: bold;
}

.right-align {
    text-align: right !important;
}
 

/* .ag-row.custom-row-0,
  .ag-row.custom-row-8,
  .ag-row.custom-row-14,
  .ag-row.custom-row-19,
  .ag-row.custom-row-24,
  .ag-row.custom-row-28,
  .ag-row.custom-row-33,
  .ag-row.custom-row-36,
  .ag-row.custom-row-41 {
      background-color: lightsteelblue;
      font-weight: bold;
      font-size: medium;
  } */

 
  /* .non-editable {
      pointer-events: none;
  }
  */

  .non-editable {
    background-color: lightsteelblue;
    font-weight: bold;
    font-size: medium;
    text-align: left;
    pointer-events: none;
  }
 
.header-rights{
    /* display: flex;*/
    justify-content: center;
    align-items: center;
    /* padding: 5px 0; */
    background-color: #939185;
    /* color:white; */
    /* ag-header-cell-hover-background-color: #686D76; */
}
 
.header-rights:hover {
    background-color: #939185; /* Keeps the same background color on hover */
}
/*
.ag-header-cell:hover {
    background-color: #686D76 !important;
} */
 
/* .header-rights:hover{
    /* display: flex;
    justify-content: center;
    align-items: center;
    /* padding: 5px 0;
    background-color: #686D76;
 } */
 
.header-rights-granted{
    justify-content: center;
    align-items: center;
    /* padding: 5px 0; */
    background-color: #939185;
}



/* .ag-row.cust-con-rows-0,
.ag-row.cust-rows-7,
.ag-row.cust-rows-18,
.ag-row.cust-rows-26,
.ag-row.cust-rows-33,
.ag-row.cust-rows-40,
.ag-row.cust-rows-45,
.ag-row.cust-rows-53,
.ag-row.cust-rows-56,
.ag-row.cust-rows-64,
.ag-row.cust-rows-72,
.ag-row.cust-rows-81,
.ag-row.cust-rows-89,
.ag-row.cust-rows-97,
.ag-row.cust-rows-102,
.ag-row.cust-rows-107,
.ag-row.cust-rows-113,
.ag-row.cust-rows-116,
.ag-row.cust-rows-121,
.ag-row.cust-rows-127,
.ag-row.cust-rows-132 { */
    /* background-color: lightsteelblue;
    font-weight: bold;
    font-size: medium;
    text-align: center;
} */
 
/* .ag-row.cust-con-rows-0{
    background-color: lightsteelblue;
    font-weight: bold;
    font-size: medium;
    text-align: left !important;
}
 
.ag-row.cust-con-rows-1{
    background-color: lightsteelblue;
    font-weight: bold;
    font-size: medium;
    text-align: center !important;
} */
 
 
.center-align {
    text-align: right;
   
}

/*  
.left-align {
    text-align: left;
    background-color: lightgreen;
}
  */
.left-align {
    background-color: lightsteelblue;
    font-weight: bold;
    font-size: medium;
    text-align: left;
    pointer-events: none;
}


.color{
    background-color: lightsteelblue;
    pointer-events: none;
}
 
.grey-bg {
    background-color: lightgray;
    color: black;
}
 
 
.spanned-row {
    background-color: #119dff;
    border-left: 1px solid lightgrey !important;
    border-right: 1px solid lightgrey !important;
    border-bottom: 1px solid lightgrey !important;
    text-align: center;
    padding: 70px 0px;
}

.column-select-checklist{
    position: absolute;
    top: 0;
    right: -300px;
    width: 300px;
    height: 500px;
    background-color: white;
    box-shadow: 0 0 15px rgba(0,0,0,0.2);
    transition: right 0.3s ease-in-out;
    z-index: 1000;
    margin-top: 40px;
    display: none;
}
 
.form-group.required .control-label:after {
    content:"*";
    color:red;
  }

.redbg{
    background-color: lightcoral;
    color: black;
}
.greenbg{
    background-color: lightgreen;
    color: black;
}

/* 
NEW CSS FOR REPORTING GRID DATA */


.custom-grid-style .ag-header-cell-label {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    height: 100%;
}

.ag-theme-balham {
    margin-top: -5px;
}


.custom-grid-style .ag-cell {
    font-size: 14px;
}



/* css for  vertical lines */

.ag-theme-balham.custom-grid-style {
    --ag-row-border-width: 1px;
    --ag-row-border-color: #dde2eb;
    --ag-cell-horizontal-border: solid var(--ag-row-border-width) var(--ag-row-border-color);
    --ag-border-color: #dde2eb;
}

.ag-theme-balham.custom-grid-style .ag-header {
    border-bottom: solid 1px;
    border-bottom-color: #dde2eb;
}

.ag-theme-balham.custom-grid-style .ag-header-cell {
    border-right: solid 1px;
    border-right-color: #dde2eb;

}

.ag-theme-balham.custom-grid-style .ag-cell {
    border-right: solid 1px;
    border-right-color: #dde2eb;
}

.ag-theme-balham.custom-grid-style .ag-cell:last-child {
    border-right: none;
}

.ag-theme-balham.custom-grid-style .ag-header-cell-text {
    color: #333333; /* Dark font color */
    font-weight: bold; /* Bold text */
}



table thead {
    position: sticky;
    top: 0;
    background-color: white; /* Ensure the header has a background when it sticks */
    z-index: 1; /* To make sure the header stays above the scrolling content */
}

.non-editable{
    pointer-events: none;
}

/* for map in grid dashboard */
#from-date-picker {
    z-index: 1050;
    position: relative;
}
 
#to-date-picker {
    z-index: 1050;
    position: relative;
}

#sch-ml-dropdown{
    z-index: 1000;
    position: relative;
}

#country-dropdowndt{
    z-index: 1050;
    /* position: relative; */
}



/*login page css added below: */

@media (max-width: 767px) {
    .card-animate {
        width: 90% !important;  
        max-width: 320px !important;  
        margin: 0 auto !important; 
        padding: 15px !important;  
    }

    .login-card {
        display: flex;
        justify-content: center;  
        align-items: center;      
        height: 100vh;           
        text-align: center;       
        padding: 15px;            
    }

    .login-header {
        font-size: 1.2rem !important;  
        margin-bottom: 15px !important;  
    }

    .login-text {
        font-size: 0.9rem !important;  
        margin-bottom: 20px !important;  
    }

    .login-input {
        font-size: 0.9rem !important;  
        padding: 10px !important;      
    }

    .login-button {
        width: 100%;
        font-size: 1rem !important;  
        padding: 12px !important;    
    }
}

@media (max-width: 768px) {
    .login-card {
        position: absolute !important;
        top: 50% !important;
        left: 50% !important;
        transform: translate(-50%, -50%) !important;
        width: 90% !important; 
        height: auto !important; 
    }
}

.dropdown-toggle::after {
    display: none;  
}

@media (max-width: 768px) {
    #username, #password {
        width: 95% !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }
}

@media screen and (max-width: 768px) {
    body {
        font-size: 14px;
    }
}


.no-click{
    pointer-events: none;
}


.ag-header-cell-label .center-align-header{
    text-align: center !important;
    justify-content: center !important;
}

.container-trends {
    display: flex;
    flex-direction: column;
    align-items: center;
    left: 0;
    right: 0;
    bottom: 0;
    top: 10;
    justify-content: center;
    width: 100%;
}
/* .tabs {
    display: flex;
    position: relative;
    background-color: #fff;
    box-shadow: 0 0 1px 0 rgba(24, 94, 224, 0.15), 0 6px 12px 0 rgba(24, 94, 224, 0.15);
    padding: 0.75rem;
    border-radius: 99px;
    *{
        z-index: 2;
    }
} */
/* .radio-tabs {
    display: flex;
    justify-content: space-around;
    width: 100%;
}
.radio-tabs label {
    padding: 10px 20px;
    cursor: pointer;
    font-size: 1.25rem;
    font-weight: 500;
    border-radius: 99px;
    transition: color 0.15s ease-in;
}
.glider {
    position: absolute;
    height: 54px;
    width: 200px;
    background-color: #e6eef9;
    border-radius: 99px;
    transition: transform 0.25s ease-out;
} */

/* .radio-tabs label {

    position: relative; 

    z-index: 2;

    padding: 10px 20px;

    cursor: pointer;

    font-size: 1.25rem;

    font-weight: 500;

    border-radius: 99px;

    transition: color 0.15s ease-in;

} */
 
/* .radio-tabs {

    display: flex;

    justify-content: space-between; 

    width: 100%;

    gap: 8px;  

} */
 
/* .glider {

    position: absolute;

    height: 54px;

    width: calc(100% / 3); 

    background-color: #e6eef9;

    border-radius: 99px;

    transition: transform 0.25s ease-out;

    z-index: 1;

} */

.custom-modal .modal-dialog {
    /* max-width: 90% !important;  Set your desired width */
    width: 100% !important;
}

.tabs-trends {
    display: flex;
    position: relative;
    width: 100%;  /* Full width */
    max-width: 600px;  /* Optional: Adjust for responsiveness */
    background-color: #fff;
    box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1); /* Softer shadow */
    padding: 10px;
    border-radius: 50px;
    justify-content: space-around;
}
 
.radio-tabs {
    display: flex;
    width: 100%;
    justify-content: space-between; /* Even spacing */
    gap: 20px; /* Adds spacing between labels */
}
 
.radio-tabs label {
    position: relative;
    z-index: 2;
    padding: 12px 34px;
    font-size: 1.25rem;
    font-weight: 500;
    cursor: pointer;
    border-radius: 99px;
    transition: color 0.15s ease-in;
}
 
.glider {
    position: absolute;
    height: 50px;
    width: calc(85% / 3 - 0px); 
    /* height: 50%; */
    /* width: 30%; */
    background-color: #e6eef9;
    border-radius: 99px;
    transition: transform 0.3s ease-out;
    z-index: 1;
    /* left: 5px; */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
}

 
.tab-content {
    margin-top: 20px;
    font-size: 18px;
    color: #333;
    overflow-y: hidden;
    height: auto;

}

.DateInput_input, .DateInput {
    border: none !important;
    background: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    font-size: 14px !important;
    color: black !important;
    text-align: center;
}

.DateInput_input:focus, .DateInput:focus {
    outline: none !important;
    border: none !important;
    box-shadow: none !important;
}

.DateInput_fang, .DateInput_fangShape {
    display: none !important;
}

.SingleDatePickerInput__withBorder {
    border: none !important;
}

.SingleDatePickerInput {
    background: none !important;
    border: none !important;
    box-shadow: none !important;
}
input[type="datetime-local"] {
    border: none !important;
    background: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    font-size: 14px !important;
    color: rgb(18, 51, 196) !important;
    text-align: center;
    font-weight: bold important;
}

input[type="datetime-local"]:focus {
    outline: none !important;
    border: none !important;
    box-shadow: none !important;
}

.DatePickerSingle {
    border: none !important;
    background: none !important;
    box-shadow: none !important;
}

.DatePickerSingle input {
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
}

li a:hover {
    color: white !important;
    background-color: #d0dec5 !important;
    border-radius: 10px;
    padding: 10px;
    transition: 0.3s;
}

.hover-btn:hover {
    color: white !important;
    background-color: #d0dec5 !important;
    border-radius: 10px;
    transition: 0.3s;
}

.time-btn:hover {
    color: white !important;
    background-color: #d0dec5 !important;
    border-radius: 10px;
    transition: 0.3s;
}

.nav-btn:hover {
    color: white !important;
    background-color: #d0dec5 !important;
    border-radius: 10px;
    transition: 0.3s;
}

/* --- Main Container: Ensures proper alignment --- */

.main-container {

    display: flex;

    align-items: center;

    flex-wrap: wrap;

    gap: 10px;

}
 
/* --- Navbar Style for Day/Week/Month/Year and Time Intervals --- */

.nav-container, #date-container, .time-navbar {

    display: flex;

    gap: 5px;

    background-color: #f0f5f9;

    padding: 8px 12px;

    border-radius: 25px;

    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);

}
 
/* --- Buttons inside Navbars --- */

.nav-btn, .time-btn {

    padding: 6px 12px;

    color: #1d3259;

    border: none;

    background: none;

    cursor: pointer;

    font-weight: 500;

}
 
.nav-btn:hover, .time-btn:hover {

    background-color: #e0ecf1;

    border-radius: 15px;

}
 
/* --- Date Picker Container: Dark Green Background & Rounded Edges --- */

/* .date-container {

    display: flex;

    align-items: center;

    gap: 8px;

    background-color: #2f5d39; 

    padding: 8px 12px;

    border-radius: 25px;

    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);

} */
 
/* --- Date Picker Fields --- */

/* .date-picker {

    font-size: 14px;

    padding: 5px;

    width: 160px;

    border-radius: 6px;

    border: none;

    background: none;

    color: white;

} */
 
/* --- "To" Label: White for Contrast --- */

/* .to-label {

    font-weight: bold;

    font-size: 14px;

    color: white;

} */

/* --- Date Picker Container: Dark Green Background & Proper Alignment --- */

#date-container {

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 10px;

    background-color: #d0dec5; /* Dark Green */

    padding: 8px 16px;

    border-radius: 25px;

    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);

}
 
/* --- Date Picker Fields: Ensuring Consistent Styling --- */

.date-picker {

    font-size: 14px;

    padding: 6px 10px;

    width: 165px; /* Ensures both date pickers have the same width */

    height: 35px; /* Uniform height */

    border-radius: 20px;

    border: none;

    text-align: center;

    background: white;

    color: black;

}
 
/* --- "To" Label: Centered and Spaced Properly --- */

.to-label {

    font-weight: bold;

    font-size: 14px;

    color: white;

    margin: auto;

}

 
 
/* --- Green Update Button: Aligned Right --- */

.update-button {

    background-color: #1c7c54; /* Green */

    color: white;

    border: none;

    padding: 8px 16px;

    font-size: 14px;

    border-radius: 6px;

    cursor: pointer;

    font-weight: 600;

    transition: 0.2s;

    margin-left: 30px; /* Moves to the right */

}
 
.update-button:hover {

    background-color: #145a3d;

}

/* Group all Accordions with a vertical sidebar line */

.accordion-group {

    display: flex;

    align-items: flex-start;

}
 
/* Sidebar Line */

.sidebar-line {

    width: 3px;

    height: 100%;

    background-color: #ccc;

    margin-right: 10px;

}
 
/* Remove all Accordion Borders */

.accordion-wrapper .accordion-item {

    border: none !important;

    background: transparent !important;

    box-shadow: none !important;

    margin-bottom: 10px; /* Add spacing between accordions */

}
 
/* Style the Header */

.accordion-custom .accordion-button {

    background-color: transparent !important;  /* No visible background */

    color: white !important; /* White text */

    font-weight: bold;

    border: none;

    padding: 8px 10px;

}
 
/* Change Arrow to White */

.accordion-custom .accordion-button::after {

    filter: brightness(100); /* Make arrow white */

}
 
/* Remove focus box shadow */

.accordion-custom .accordion-button:focus {

    box-shadow: none !important;

}
 
/* Checklist Container */

.checklist-container {

    flex-grow: 1; /* Expand to take remaining space */

    padding: 5px 10px;

}



 
/* Custom Accordion Styling */

.accordion-wrapper-dcc {

    border: none;

    background: none;

}
 
/* Customizing the Accordion Header */

.accordion-custom-dcc .accordion-button {

    background-color: white;  /* Dark background */

    color: #2C3E50;  /* White text */

    font-weight: bold;

    border-radius: 5px;

}
 
/* Removing default accordion styles */

.accordion-custom-dcc .accordion-button:focus {

    box-shadow: none !important;

    outline: none !important;

}
 
/* Hide default border and add padding */

.accordion-custom-dcc .accordion-item {

    border: none !important;

    margin-bottom: 5px;

}
 
/* Custom search bar */

/* .search-bar {

    width: 100%;

    padding: 8px;

    border: 1px solid #ccc;

    border-radius: 5px;

    margin-bottom: 10px;

} */
.search-bar {
    width: 100%;
    padding: 8px;
    border: 1px solid #ddd;
    border-radius: 5px;
    margin-bottom: 10px;
}
 
/* Select All Checkbox Styling */

.select-all {

    margin-bottom: 10px;

    font-weight: bold;

}
 
/* Checklist Styling */

/* .checklist-items {

    display: flex;

    flex-direction: column;

    gap: 5px;
    position: absolute;
    z-index: 5000;

} */
.checklist-items {
    max-height: 200px;
    overflow-y: auto;
    background: white;
    padding: 5px;
    border-radius: 5px;
}

.divider-line {
    margin: 10px 0;
    border: none;
    height: 1px;
    background-color: #ddd;
}
 
/* Styling the checklist labels */

.checklist-items label {

    cursor: pointer;

    padding: 5px;

    transition: 0.3s ease-in-out;

}
 
/* Highlight on hover */

.checklist-items label:hover {

    background-color: #f0f0f0;

    border-radius: 5px;

}
 
/* Add vertical line (Sidebar Line) */

.accordion-custom-dcc {

    position: relative;

    /* padding-left: 10px; */

}
 
/* Sidebar Line on the Left */

/* .accordion-custom-dcc::before {

    content: "";

    position: absolute;

    top: 0;

    left: -5px;

    width: 3px;

    height: 100%;

    background-color: #007bff; 

} */

/* Make sure the card acts as a positioning reference */

.card-container {
    position: relative;  
    width:80%;
    overflow: visible;  /* Ensure dropdown is not clipped */

}
 
/* Style the Accordion */

/* .accordion-custom-dcc {

    position: relative;

} */
 
/* Style the Accordion Header */

/* .accordion-custom-dcc .accordion-button {

    background-color: #2C3E50;

    color: white;

    font-weight: bold;

    border-radius: 5px;

} */
 
/* Accordion Content (Prevent Card Expansion) */

.accordion-custom-dcc .accordion-body {

    position: absolute;

    top: 100%; /* Opens below the accordion header */

    left: 0;

    width: 100%;

    background-color: white;

    z-index: 10; /* Ensures it stays on top */

    box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1); /* Soft shadow effect */

    padding: 10px;

    border-radius: 5px;

}
 
/* Ensure checklist appears inside floating dropdown */

.checklist-items {
    width: 100%;
    max-height: 200px;
    background-color: white;
    overflow-y: auto;
    
}
 
/* Add a subtle border to the floating dropdown */

.accordion-body {

    border: 1px solid #ccc;
    border-radius: 5px;

}
 
/* Style the search bar */

/* .search-bar {

    width: 100%;

    padding: 8px;

    border-radius: 5px;

    border: 1px solid #ccc;

} */
 
/* Style the 'Select All' option */

/* .select-all {

    font-weight: bold;

    margin-bottom: 5px;

} */
 
/* Remove side border/line */

/* .accordion-custom-dcc::before {

    content: none;

} */

@keyframes scroll-left {
    0% {
      transform: translateX(100%);
    }
    100% {
      transform: translateX(-100%);
    }
  }

.center-aligned-group-header .ag-header-group-cell-label {
    justify-content: center; 
}
 

/* assets/scroll_button.css */

/* #scroll-top-btn {
    background-color: white;
}

#scroll-top-btn:hover {
    background-color: rgb(4, 188, 229);
    color: white;
} */

#scroll-top-btn {
    background-color: lightblue;
    outline: none;
    border: gainsboro;
}

#scroll-top-btn:focus {
    outline: none;
    /* border: none; */
    border: gainsboro;
}

#scroll-top-btn:hover {
    background-color: rgb(4, 188, 229);
    color: white;
}

#loading-report .dash-loading-spinner {
    position: absolute !important;
    top: 120px;      /* spinner will appear near top */
    left: 50%;
    transform: translateX(-50%);
    z-index: 9999;
}

/* Style for pinned rows */
.pinned-row-style {
    background-color: #bfcee4 !important;
    font-weight: bold;
    color: #000;
}
/* ✅ Force center alignment on ALL headers (including numeric ones) */
.ag-theme-alpine .ag-header-cell-label {
    justify-content: center !important;
    text-align: center !important;
}

/* ✅ For numeric columns that AG Grid aligns right by default */
.ag-theme-alpine .ag-header-cell.ag-right-aligned-header .ag-header-cell-label {
    justify-content: center !important;
    text-align: center !important;
}
.highlight-green {
    color: green !important;
    font-weight: bold !important;
}

#date-picker-grid .DateRangePicker_picker{
    z-index: 1000;
    position: absolute;
    background-color: #fff;
}


.center-header-francereport {
    text-align: center !important;
    justify-content: center !important;
    display: flex;
    align-items: center;
}

/* new version of lla - by aravind (5 aug 2025 */
/* .required::after {
    content: "*";
    color: red;
} */
.option-card:hover {
    background-color: #e0f7fa; 
    transform: scale(1.03);   
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
}
nav ol li:not(:last-child)::after {
    content: ">";
    margin: 0 0.5rem;
    color: #6c757d;
}

.custom-navbar {
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
}

.custom-tabs {
    margin-top: -5px; 
}

.nav-tabs .nav-item.show .nav-link, 
.nav-tabs .nav-link.active {
    background-color: #eaf3f7 !important; 
    color: balck !important;
    font-weight: bold;
    border-color: #eaf3f7 !important;
    border-radius: 0.25rem 0.25rem 0 0;
}


.text-green-bold{
    color: green ;
    font-weight: bold;
}
 
.text-orange-bold{
    color: orange;
    font-weight: bold;
}
 
.text-green{
    color: green;
    /* font-weight: bold; */
}
 
.text-red{
    color: red;
    /* font-weight: bold; */
}
 
 
/* Add to your assets/custom.css */
.dash-radioitem label {
    display: inline-block;
    width: 150px;  /* adjust this value to your needs */
}

.non-editable-length {
    background-color: #e9ecef !important; /* light gray */
    color: #000; /* black text */
}

.ag-cell.right-align-length {
    display: flex !important;
    justify-content: flex-end !important;
    text-align: right !important;
}