.custom-accordion .accordion-button:focus {
    background-color: #FFFFFF; /* Example: green background when focused */
    box-shadow: none !important;
    font-weight: 900; /* Extra bold font-weight */


}

.custom-accordion .accordion-button {

    font-weight: 600 !important; /* Extra bold font-weight */
    color: black; /* Maintain black font color on focus */
    background-color: #FFFFFF; /* Replace with the color you want */
    border-bottom: none !important; /* Removes the bottom border */
    border-left: none !important;   /* Removes the left border */
    border-right: none !important;  /* Removes the right border */
    /* Optionally, customize the top border as needed */
    border-top: none !important;/* 1px solid #cccccc; /* Example: a light gray top bord

}

.custom-accordion .accordion-button:not(.collapsed) {
    font-weight: 900; /* Extra bold font-weight for active (expanded) state */
}

.slider-label {
    white-space: nowrap;
    overflow: visible;
   /* text-overflow: ellipsis;  /* Optional, for adding an ellipsis (...) at the end of overflowing text */
}
    
.custom-slider-marks {
    font-size: 8px; /* Change this value as needed */
}


.my-slider .rc-slider-handle {
    /* width: 7px !important; /* Makes the handle very thin, like a line */
    height:15px !important; /* Adjusts the height to make it visible as a line */
    border-radius: %50 !important; /* Removes any rounded corners */
    background-color: grey !important; /* Set handle color to grey */
    border-color: grey !important; Set handle color to grey */

}

.range-slider-mark-text {
    font-size: 10px !important;  /* Adjust as needed */
}

.my-slider .rc-slider-dot {
    border-width: 2px; /* Make the dots thicker */
    margin-top: -5px; /* Adjust margin to align with the increased height */
}

/* assets/style.css */
._dash-loading {
  margin: auto;
  color: transparent;
  width: 0;
  height: 0;
  text-align: center;
}

._dash-loading::after {
  content: '';
  display: inline-block;
  width: 2rem;
  height: 2rem;
  color: black;
  vertical-align: text-bottom;
  border: 0.25em solid currentColor;
  border-right-color: transparent;
  border-radius: 50%;
  -webkit-animation: spinner-border 0.75s linear infinite;
  animation: spinner-border 0.75s linear infinite;
  margin-top: 2rem;
}

.no-hover-effect:hover {
    cursor: default !important;
    color: inherit !important;  /* Preserves the text color */
    background-color: inherit !important;  /* Preserves the background color */
}

.transparent-offcanvas {
    background-color: rgba(240, 240, 240, 0.8); /* Semi-transparent white background */
    #backdrop-filter: blur(10px); /* Optional: adds a blur effect */
    border: none; /* Optional: removes border */
    box-shadow: none; /* Optional: removes shadow */
}

.transparent-offcanvas .offcanvas-title {
    color: #000; /* Ensures title text is visible */
}

.transparent-offcanvas .offcanvas-body {
    color: #000; /* Ensures body text is visible */
}

.rc-slider-tooltip {
    font-size: 20px; /* Yazı boyutunu artır */
    padding: 8px; /* İçeriği genişlet */
    border-radius: 8px; /* Köşeleri yuvarlat */
}

/* Prevent horizontal page scroll */
html, body {
    max-width: 100vw;
    overflow-x: hidden !important;
}

#_dash-app-content, #react-entry-point, .dash-application, .app, .app-container {
    overflow-x: hidden !important;
}