/* ============================================================
   RESET CRÍTICO MÓVIL
   Sistema de Administración de Condominios
   ============================================================
   Contenido:
   - Variables CSS móvil (mirror de _breakpoints.css)
   - Reset html/body/box-sizing para evitar overflow
   - Excepciones: tooltips, tablas internas, recibo PDF,
     botones de directorio, app-container, main-content,
     content-wrapper, formularios e inputs
   ============================================================ */

:root {
    --touch-target-min:    44px;
    --mobile-padding:      12px;
    --mobile-gap:          12px;
    --mobile-font-input:   16px;
    --mobile-border-radius: 10px;
}

@media screen and (max-width: 768px) {
    html {
        overflow-x: hidden !important;
        overflow-y: scroll !important;
        width: 100% !important;
        max-width: 100vw !important;
        -webkit-overflow-scrolling: touch !important;
        touch-action: manipulation !important;
    }

    body {
        overflow-x: hidden !important;
        overflow-y: visible !important;
        width: 100% !important;
        max-width: 100vw !important;
        min-height: 100vh !important;
    }

    *, *::before, *::after {
        box-sizing: border-box !important;
        max-width: 100% !important;
    }

    /* Excepciones: tooltips y popovers */
    .tooltip, .tooltip *, .popover, .popover * {
        max-width: none !important;
    }

    /* Excepciones: tablas internas */
    table:not(.dir-table),
    thead, tbody, tr, th, td {
        max-width: none !important;
    }

    /* Excepción: Recibo PDF — no aplicar reglas globales móvil */
    #reciboParaPDF, #reciboParaPDF *,
    #reciboParaPDF *::before, #reciboParaPDF *::after,
    #tempReciboParaPDF, #tempReciboParaPDF *,
    #tempReciboParaPDF *::before, #tempReciboParaPDF *::after,
    #tempReciboContainer, #tempReciboContainer * {
        max-width: none !important;
        min-width: 0 !important;
        min-height: 0 !important;
    }

    /* Excepciones: botones de acciones del directorio */
    .dir-actions, .dir-btn-edit, .dir-btn-delete,
    .dir-btn-duplicate, .dir-btn-change-type, .col-acciones {
        max-width: none !important;
        overflow: visible !important;
    }

    .dir-table { max-width: 100% !important; }

    /* Ocultar columnas secundarias en móvil */
    .hide-mobile, .col-index, .col-apellido,
    .col-documento, .col-telefono, .col-email,
    .col-tipo, .col-contrato {
        display: none !important;
    }

    /* Contenedor de la app */
    .app-container {
        overflow: visible !important;
        width: 100% !important;
    }

    /* Main content */
    .main-content, #mainContent {
        overflow: visible !important;
        width: 100% !important;
        max-width: 100vw !important;
        padding-left: 8px !important;
        padding-right: 8px !important;
    }

    .content-wrapper, #moduleContainer {
        overflow: visible !important;
        width: 100% !important;
        max-width: calc(100vw - 16px) !important;
    }

    /* Formularios */
    form, .form-container, #directoryForm, .form-panel,
    .unified-panel, .form-panel.unified-panel, .panel-content,
    .form-section, .form-section-unified, .form-row-flex,
    .input-group-modern, .form-group {
        width: 100% !important;
        max-width: calc(100vw - 16px) !important;
        box-sizing: border-box !important;
        overflow: visible !important;
    }

    /* Inputs — forzar 100% ancho */
    input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"])
        :not([style*="display: none"]):not([style*="display:none"])
        :not(#pagoDescLineaFijo):not(.concepto-extra-desc-fijo),
    select, textarea,
    .input-modern, .select-modern, .textarea-modern {
        width: 100% !important;
        max-width: calc(100vw - 32px) !important;
        box-sizing: border-box !important;
        display: block !important;
    }

    /* Selects de apartamentos con inline styles */
    .apartment-select, .apartment-select-prop,
    select[name^="apartamento_"] {
        width: 100% !important;
        max-width: 100% !important;
        display: block !important;
    }

    #apartmentsListPropietario, #apartmentsListRepresentante,
    #apartmentsListInquilino, .apartments-list {
        width: 100% !important;
    }

    .apartment-row, .apartment-field-row,
    [class*="apartment"] > div {
        display: flex !important;
        flex-direction: column !important;
        gap: 8px !important;
        width: 100% !important;
    }

    .apartment-field-row select { width: 100% !important; display: block !important; }

    .btn-remove-apartment {
        width: 100% !important;
        margin-top: 4px !important;
        min-height: 40px !important;
    }

    .checkbox-inline-row { flex-wrap: wrap !important; }
    .checkbox-inline-row label { width: auto !important; min-width: auto !important; }

    .fg-expand, .fg-narrow, .fg-narrow-md, .fg-reside,
    .info-adicional-left, .info-adicional-right {
        width: 100% !important;
        max-width: 100% !important;
        flex: 1 1 100% !important;
        min-width: 0 !important;
    }

    .form-actions {
        margin-left: 0 !important;
        margin-right: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
    }

    .panel-content, .form-section-unified {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
}

/* Excepción recibo PDF en móvil */
@media screen and (max-width: 768px) {
    #reciboParaPDF, #reciboParaPDF * {
        max-width: none !important;
        min-height: 0 !important;
    }
}
