/* Responsive Optimizations for Family Tree */

/* Custom Scrollbar for Statistics */
.stats-scroll-container::-webkit-scrollbar {
    height: 4px; /* Thin scrollbar */
}

.stats-scroll-container::-webkit-scrollbar-track {
    background: transparent;
}

.stats-scroll-container::-webkit-scrollbar-thumb {
    background: #cbd5e1;
    border-radius: 10px;
}

/* Hide scrollbar for standard look but allow scroll */
.stats-scroll-container {
    -ms-overflow-style: none;  /* IE and Edge */
    scrollbar-width: none;  /* Firefox */
}
.stats-scroll-container::-webkit-scrollbar {
    display: none;
}

/* Border utilities responsive */
@media (min-width: 768px) {
    .border-end-md {
        border-left: 1px solid #e2e8f0 !important; /* RTL uses left as end visually or swap based on dir */
    }
    
    html[dir="rtl"] .border-end-md {
        border-left: 1px solid #e2e8f0 !important;
        border-right: none !important;
    }
    
    html[dir="ltr"] .border-end-md {
        border-right: 1px solid #e2e8f0 !important;
        border-left: none !important;
    }



    
}

/* Ensure nice spacing on mobile horizontal scroll */
@media (max-width: 768px) {
    .stats-scroll-container {
        padding-left: 10px;
        padding-right: 10px;
    }

        /* Adjust font sizes for mobile */
    h1 {
        font-size: 1rem;
    }
    
    h2 {
        font-size: 1.25rem;
    }

    /* Stack flex containers on mobile if needed */
    .d-flex-mobile-column {
        flex-direction: column;
    }
    p{
        font-size: .6rem;
    }
    .btn{
        font-size: 10px;
              padding: 8px 7px !important;
    }
   header h1 {
    padding: 0 27px;
   }
   #installAppBtnContainer{
    flex-direction: column !important;
   }
}