/* Responsive Fixes for Mobile & Tablet */

/* 1. Prevent body horizontal scroll */
body {
    overflow-x: hidden;
}

/* 2. Responsive forms and grids */
@media (max-width: 991px) {

    .sidebar.sidebar-mini .sidebar-toggle {
        right: -10px !important;
    }

    /* Stack elements inside d-flex that are not intended to be column on desktop, 
       but should be on mobile if they are breaking the layout */
    .content-inner {
        padding: 10px !important;
        overflow-x: hidden;
    }
    
    .card {
        margin-bottom: 15px;
    }

    /* Fix row negative margin issues causing horizontal scroll on mobile */
    .row {
        margin-left: 0;
        margin-right: 0;
    }

    .row > [class^="col-"] {
        padding-left: 10px;
        padding-right: 10px;
    }

    /* Ensure tables inside table-responsive display correctly */
    .table-responsive {
        border: 0;
        margin-bottom: 0;
    }
    
    /* Make buttons full width on small screens for better touch targets */
    .btn-responsive-block {
        display: block;
        width: 100%;
        margin-bottom: 10px;
    }
    
    /* Ensure sidebar behavior correctly */
    .sidebar {
        transform: translateX(-100%);
        transition: transform 0.3s ease-in-out;
        z-index: 1050;
        position: fixed;
    }
    
    .sidebar.sidebar-mini,
    .sidebar.sidebar-open,
    body.sidebar-main .sidebar {
        transform: translateX(0);
    }
    
    .main-content {
        margin-left: 0 !important;
        width: 100% !important;
    }
    
    /* Adjust navbar */
    .iq-navbar {
        width: 100% !important;
        left: 0 !important;
        padding: 5px !important; /* Decreased padding heavily for mobile */
        min-height: 60px;
    }
    
    .iq-navbar .navbar-inner {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
    }

    /* Mobile Center Area (Logo and Title) */
    .mobile-center-area {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        flex-grow: 1; /* Center it properly */
    }

    .mobile-center-area .logo-mobile {
        display: block;
        margin-bottom: 5px;
        margin-left: 0 !important; /* Force center */
    }

    .mobile-center-area .page-title-navbar {
        font-size: 14px !important;
        margin: 0 !important;
        text-align: center !important; /* Force center */
        padding-left: 0 !important; /* Remove any previous left padding */
        line-height: 1.2;
    }

    /* Right side icons */
    .product-offcanvas {
        display: flex;
        align-items: center;
        justify-content: flex-end;
    }

    .navbar-list {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: flex-end;
        gap: 15px; /* Space between bell and user icon */
        margin-bottom: 0;
        padding-left: 0;
        height: 100%;
    }

    .navbar-list .nav-item {
        display: flex;
        align-items: center;
        justify-content: center;
        margin: 0 !important;
        height: 100%;
    }

    .navbar-list .nav-link {
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 0 !important;
    }

    /* Adjust the user icon circle to center properly on mobile */
    .navbar-list .rounded-circle {
        margin-right: 0 !important;
        width: 35px;
        height: 35px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 1.2rem !important;
    }

    /* Font Size Reductions for Mobile */
    body, p, .text-muted, .form-control, .btn {
        font-size: 13px !important;
    }

    h1, .h1 { font-size: 1.2rem !important; }
    h2, .h2 { font-size: 1.1rem !important; }
    h3, .h3 { font-size: 1rem !important; }
    h4, .h4 { font-size: 0.9rem !important; }
    h5, .h5 { font-size: 0.8rem !important; }
    h6, .h6 { font-size: 0.7rem !important; }

    /* Tables */
    .table th, 
    .table td {
        font-size: 12px !important;
        padding: 0.4rem 0.5rem !important;
    }

    /* Colunas da tabela de investimentos */
    .col-contract {
        width: auto !important;
        max-width: none !important;
        min-width: 200px;
    }

    .col-investor {
        width: auto !important;
        max-width: none !important;
        min-width: 200px;
    }

    /* Painel Filter Wrappers */
    .filter-header-wrapper {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 10px;
    }

    .filter-header-wrapper > h5 {
        margin-bottom: 5px !important;
    }

    .filter-header-wrapper > .d-flex {
        flex-direction: column !important;
        width: 100% !important;
    }

    .filter-header-wrapper select, 
    .filter-header-wrapper input {
        width: 100% !important;
        max-width: 100% !important;
    }

    /* Grid Actions Wrapper (Search and Pagination) */
    .grid-actions-wrapper {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 15px;
    }

    .grid-actions-wrapper .input-group input {
        min-width: 100% !important;
        width: 100% !important;
    }
}

/* For Desktop - hide the mobile logo */
@media (min-width: 992px) {
    .mobile-center-area {
        display: flex;
        align-items: center;
    }
    .mobile-center-area .logo-mobile {
        display: none !important;
    }
}

/* For very small screens (phones) */
@media (max-width: 575px) {
    /* Stack form inputs */
    .form-group {
        margin-bottom: 1rem;
    }
    
    h1, h2, h3, h4, h5, h6 {
        word-wrap: break-word;
    }
}
