/* ==========================================================
   MultiServicios — ajustes responsive globales
   Se carga en todas las pantallas después de Bootstrap.
   ========================================================== */
html { -webkit-text-size-adjust: 100%; }
body { overflow-x: hidden; }
img, video, iframe { max-width: 100%; height: auto; }

/* Textos largos (mails, links, tokens) no rompen el ancho */
td, th, .card-body, .alert, .dropdown-item-text { overflow-wrap: anywhere; }
code, pre { white-space: pre-wrap; word-break: break-all; }

/* Tablas: scroll horizontal suave y celdas compactas */
.table-responsive { -webkit-overflow-scrolling: touch; }
.table-responsive > .table { margin-bottom: 0; }
.table td .btn-group, .table td .d-flex { flex-wrap: nowrap; }

/* Encabezados con acciones: siempre pueden bajar de línea */
.d-flex.justify-content-between { flex-wrap: wrap; gap: .5rem; }
.btn-group { flex-wrap: wrap; }
.input-group { max-width: 100% !important; }

/* Navbar: marca larga no desborda */
.navbar-brand { white-space: normal; line-height: 1.2; max-width: calc(100% - 70px); }

/* ---------- Tablet y menor (< 992px) ---------- */
@media (max-width: 991.98px) {
    .navbar-collapse { padding-top: .5rem; }
    .navbar-nav .ms-nav-link, .navbar-nav .nav-link { display: block; padding: 10px 12px !important; }
    .ms-nav-link.active::after { left: 0; right: auto; top: 8px; bottom: 8px; width: 3px; height: auto; }
    .navbar-nav .dropdown-menu { background: #fff; }
    .ms-user-chip { margin: .5rem 0; display: inline-flex; }
}

/* ---------- Celular (< 768px) ---------- */
@media (max-width: 767.98px) {
    .container, .container-fluid { padding-left: 14px; padding-right: 14px; }
    h1, .h1 { font-size: 1.7rem; }
    h2, .h2 { font-size: 1.45rem; }
    h3, .h3 { font-size: 1.3rem; }
    h4, .h4 { font-size: 1.15rem; }
    .display-4, .display-5, .display-6 { font-size: 2rem; }

    .card-body.p-4, .card.p-4 { padding: 1rem !important; }
    .card-header { padding: .75rem 1rem !important; }
    .card[style*="max-width"] { max-width: 100% !important; }

    .table { font-size: .875rem; }
    .table > :not(caption) > * > * { padding: .45rem .5rem; }
    .table th, .table td { white-space: nowrap; }
    .table td.text-wrap, .table td .text-wrap { white-space: normal; }

    /* Botones de acciones de página: ocupan bien el ancho */
    .d-flex.gap-2.flex-wrap > .btn { flex: 1 1 calc(50% - .5rem); }
    .px-4.py-2.btn { padding-left: 1rem !important; padding-right: 1rem !important; }

    /* Evita el zoom automático de iOS al enfocar inputs */
    input.form-control, select.form-select, textarea.form-control,
    input.form-control-sm, select.form-select-sm { font-size: 16px; }

    .modal-dialog { margin: .5rem; }
    .dropdown-menu { max-width: calc(100vw - 2rem); }
}

/* ---------- Celular chico (< 400px) ---------- */
@media (max-width: 399.98px) {
    .col-6 { flex: 0 0 100%; max-width: 100%; }
    .d-flex.gap-2.flex-wrap > .btn { flex-basis: 100%; }
    .navbar-brand { font-size: 1rem; }
    .ms-navbar .navbar-brand .ms-brand-badge { width: 26px; height: 26px; }
}

/* Impresión: sin navbar */
@media print {
    .navbar, .ms-support-banner, .btn { display: none !important; }
    body { background: #fff !important; }
}
