/**
 * SICONFI - Estilos responsivos para smartphone e tablet
 * Layout compatível com uso pelo prefeito em dispositivos móveis
 */

/* Evitar overflow horizontal */
html, body {
    overflow-x: hidden;
}

/* Safe area para dispositivos com notch (iPhone X+) */
@supports (padding: max(0px)) {
    body {
        padding-left: max(0px, env(safe-area-inset-left));
        padding-right: max(0px, env(safe-area-inset-right));
    }
}

/* Base - touch targets mínimos 44px para acessibilidade */
@media (max-width: 991.98px) {
    .btn, .nav-link, .form-select, .form-control {
        min-height: 44px;
    }
    .navbar-brand {
        font-size: 1rem;
    }
}

/* Navbar colapsável em mobile */
.navbar-expand-lg .navbar-collapse {
    margin-top: 0.5rem;
}
@media (min-width: 992px) {
    .navbar-expand-lg .navbar-collapse {
        margin-top: 0;
    }
}

/* Filtros - empilhamento em mobile */
@media (max-width: 767.98px) {
    .card-body .row.g-3 > [class*="col-"] {
        margin-bottom: 0.5rem;
    }
    .valor-destaque {
        font-size: 1.25rem;
    }
}

/* Tabelas - scroll horizontal em mobile */
.table-responsive {
    -webkit-overflow-scrolling: touch;
    overflow-x: auto;
}
@media (max-width: 767.98px) {
    .table {
        font-size: 0.875rem;
    }
    .table th, .table td {
        padding: 0.5rem;
        white-space: nowrap;
    }
    .table th:first-child,
    .table td:first-child {
        position: sticky;
        left: 0;
        background: inherit;
        z-index: 1;
        box-shadow: 2px 0 4px rgba(0,0,0,.05);
    }
}

/* Cards - padding reduzido em mobile */
@media (max-width: 575.98px) {
    .container-fluid {
        padding-left: 0.75rem;
        padding-right: 0.75rem;
    }
    .card-body {
        padding: 1rem;
    }
    .card-header {
        padding: 0.75rem 1rem;
        font-size: 0.95rem;
    }
}

/* Login - ajustes mobile */
@media (max-width: 575.98px) {
    .login-card {
        margin: 0.5rem !important;
    }
    .login-header {
        padding: 1rem;
    }
    .login-header h4 {
        font-size: 1.1rem;
    }
}

/* Usuário no navbar - ocultar roles em mobile */
@media (max-width: 991.98px) {
    .navbar .text-white-50 {
        display: none;
    }
}

/* Botão Consultar em destaque em mobile */
@media (max-width: 767.98px) {
    #btnConsultar {
        min-height: 48px;
        font-weight: 600;
    }
}
