/* STRICT MOBILE UI FIXES v3 - COMMON FILE */
@media (max-width: 768px) {
    body { padding: 0 !important; margin: 0 !important; overflow-x: hidden !important; }
    .container, .container-fluid { padding-left: 5px !important; padding-right: 5px !important; margin-left: 0 !important; margin-right: 0 !important; width: 100% !important; max-width: 100% !important; overflow-x: hidden !important; }
    .row { margin-left: 0 !important; margin-right: 0 !important; }
    .col, [class*='col-'] { padding-left: 5px !important; padding-right: 5px !important; }
    .card, .dashboard-card, .form-box, .balance-card, .section-box, .info-section, .calendar-wrapper, .jpg-container { margin-left: 0 !important; margin-right: 0 !important; margin-top: 5px !important; margin-bottom: 10px !important; padding: 10px !important; border-radius: 8px !important; width: 100% !important; max-width: 100% !important; box-sizing: border-box !important; }
    .card-body, .card-header-custom { padding: 8px !important; }
    
    * { overflow-wrap: break-word !important; } 
    
    /* FIX: Allow table elements to stay in single line and scroll */
    .dashboard-card *, .card *, .form-box *, .info-section * { white-space: normal; } 

    /* Force tables to be scrollable block elements on mobile */
    table, .table-responsive { 
        display: block !important; 
        width: 100% !important; 
        overflow-x: auto !important; 
        -webkit-overflow-scrolling: touch !important; 
        font-size: 0.85rem !important; 
    }
    
    /* Ensure table content does NOT wrap, preventing the 1-character-per-line issue */
    table th, table td, .table-responsive th, .table-responsive td, .custom-table th, .custom-table td {
        white-space: nowrap !important;
        word-break: keep-all !important; /* Keep words intact */
        padding: 8px 10px !important; /* Thinner padding for beautiful layout */
        font-size: 0.85rem !important; /* Fine font size */
    }

    img, input, select, textarea, button { max-width: 100% !important; box-sizing: border-box !important; }
    .navbar-custom { margin: 5px 0 15px 0 !important; border-radius: 10px !important; padding: 10px !important; width: 100% !important; }
    
    /* Button Text Fixes */
    .btn span.d-none, .btn span.d-sm-inline, .btn span.d-md-inline, .btn span.d-lg-inline,
    .nav-btn span.d-none, .nav-btn span.d-sm-inline {
        display: inline-block !important;
        font-size: 0.85rem !important;
        margin-left: 4px;
    }
}

/* Scroll Hint Style */
.mobile-scroll-hint {
    display: none;
    text-align: center;
    font-size: 0.85rem;
    color: #0dcaf0;
    font-weight: bold;
    margin-bottom: 5px;
    animation: pulse 2s infinite;
}
@media (max-width: 768px) {
    .mobile-scroll-hint { display: block; }
}
@keyframes pulse {
    0% { opacity: 0.5; }
    50% { opacity: 1; }
    100% { opacity: 0.5; }
}