/* ============================================================
   BOTONES MÓVIL
   Sistema de Administración de Condominios
   ============================================================
   Contenido:
   - Tamaños touch de btn genérico
   - btn-sm compacto
   - action-buttons / btn-group gap
   - btn-action (tablas)
   - Touch improvements (pointer: coarse)
   ============================================================ */

@media screen and (max-width: 768px) {
    /* El alto y la fuente salen de Diseño Responsive (AdminMaster). Iban como
       números fijos con !important, así que la regla que inyecta index.html para
       aplicar esos dos ajustes perdía siempre: se podían mover en el panel y no
       cambiaba nada. Ahora el !important lleva dentro el valor configurable, y
       el número sólo actúa de reserva si la config no llega. */
    .btn,
    button:not(.menu-toggle):not(.tab-btn):not(.dir-tab) {
        min-height: var(--mobile-btn-min-height, var(--touch-target-min, 44px)) !important;
        padding: 12px 16px !important;
        font-size: var(--mobile-btn-font-size, 14px) !important;
    }

    .btn-sm {
        min-height: 36px !important;
        padding: 8px 12px !important;
        font-size: 12px !important;
    }

    .action-buttons, .btn-group { gap: 8px !important; }

    .action-buttons .btn,
    .btn-group .btn {
        min-width: 40px !important;
        min-height: 40px !important;
    }

    .btn-action {
        min-width: 44px !important;
        min-height: 44px !important;
        padding: 10px !important;
    }

    /* Volver de módulos y submódulos: cuando el botón sólo contiene la flecha
       debe ocupar lo mismo en todo el sistema y no heredar el alto táctil de
       los botones de formulario. */
    #moduleContainer button:has(> i.fa-arrow-left:only-child) {
        flex: 0 0 26px !important;
        width: 26px !important;
        min-width: 26px !important;
        max-width: 26px !important;
        height: 26px !important;
        min-height: 26px !important;
        max-height: 26px !important;
        margin: 0 !important;
        padding: 0 !important;
        font-size: 11px !important;
        line-height: 1 !important;
        text-align: center !important;
        box-sizing: border-box !important;
    }

    #moduleContainer button:has(> i.fa-arrow-left:only-child) > i {
        margin: 0 !important;
        line-height: 1 !important;
    }
}

/* ── Touch improvements (dispositivos con puntero impreciso) ── */
@media (pointer: coarse) {
    a, button, input[type="button"],
    input[type="submit"], input[type="reset"],
    .btn, .clickable {
        min-height: var(--touch-target-min);
        min-width: var(--touch-target-min);
    }

    table a, .dir-table a {
        display: inline-block;
        padding: 8px 4px;
    }

    .table-responsive, .dir-table-wrapper,
    .dropdown-list, .modal-body {
        -webkit-overflow-scrolling: touch;
        scroll-behavior: smooth;
    }

    /* Desactivar hover en touch */
    .card:hover, .btn:hover, .report-card:hover {
        transform: none !important;
    }
}
