/* Adaptación de pantalla y áreas seguras. Cargar después de los estilos de página. */
:root {
    --lm-safe-top: env(safe-area-inset-top, 0px);
    --lm-safe-right: env(safe-area-inset-right, 0px);
    --lm-safe-bottom: env(safe-area-inset-bottom, 0px);
    --lm-safe-left: env(safe-area-inset-left, 0px);
}

@media screen {
    html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
    body { min-height: 100svh; }
    .lm-app-layout, .lm-main { min-width: 0; min-height: 100svh; }
    :is(.lm-content, .lm-card, .lm-form-group, .request-card, .client-shell,
           .lm-grid-2 > *, .lm-grid-3 > *, .lm-grid-4 > *, .lm-form-row > *,
           .request-grid > *, .payment-grid > *, .client-order > *) { min-width: 0; }
    :is(input:not([type=checkbox]):not([type=radio]), select, textarea) { min-width: 0; max-width: 100%; }

    /* El fondo de la propia cabecera cubre el notch incluso al hacer scroll. */
    .lm-header {
        top: 0;
        height: calc(var(--lm-header-height) + var(--lm-safe-top));
        padding-top: var(--lm-safe-top);
    }
    .lm-header-inner { height: var(--lm-header-height); padding-inline: max(24px, var(--lm-safe-left)) max(24px, var(--lm-safe-right)); }
    .client-topbar-inner { max-width: calc(100% - max(32px, var(--lm-safe-left) + var(--lm-safe-right) + 32px)); }
    .client-topbar { top: 0; padding-top: var(--lm-safe-top); background: var(--lm-white); }
    html[data-theme="dark"] .client-topbar { background: #101D2D; }
    html[data-theme="contrast"] .client-topbar { background: #080808; }
    :is(.lm-header-title, .client-brand, .client-brand > span:last-child,
           .client-app-head-copy, .client-app-head-copy > div) { min-width: 0; }
    :is(.lm-header-toggle, .lm-header-actions, .client-user, .client-brand-mark,
           .client-app-close, .payment-close, .toggle-switch) { flex-shrink: 0; }

    .launcher-shell { padding-top: calc(28px + var(--lm-safe-top)); }
    .request-public-shell { padding-top: calc(36px + var(--lm-safe-top)); }
    :is(.tracking-shell, .privacy-shell, .access-shell) { padding-top: calc(40px + var(--lm-safe-top)); }
    .request-progress { top: calc(10px + var(--lm-safe-top)); }
    :is(.launcher-shell, .client-shell, .request-public-shell, .tracking-shell, .privacy-shell, .access-shell) {
        max-width: calc(100% - max(20px, var(--lm-safe-left) + var(--lm-safe-right) + 20px));
    }
    body:has(> .account-card), body:has(> .reset-card), body:has(> .first-card) {
        padding: max(24px, var(--lm-safe-top)) max(16px, var(--lm-safe-right))
                 max(24px, var(--lm-safe-bottom)) max(16px, var(--lm-safe-left));
    }
    :is(.account-card, .reset-card, .first-card) { min-width: 0; overflow-wrap: anywhere; }

    :is(.lm-sidebar, .client-app-overlay, .document-launcher-overlay, .security-modal-backdrop,
           .payment-modal-backdrop, .wos-information-overlay, .request-documents-modal, .request-time-modal) {
        padding: max(14px, var(--lm-safe-top)) max(14px, var(--lm-safe-right))
                 max(14px, var(--lm-safe-bottom)) max(14px, var(--lm-safe-left));
    }
    :is(.lm-sidebar-inner, .client-app-dialog, .document-launcher-dialog, .security-modal,
           .payment-modal, .wos-information-dialog, .request-documents-dialog, .request-time-dialog) {
        min-width: 0;
        max-height: min(var(--lm-dialog-limit, 100dvh), calc(100dvh - max(14px, var(--lm-safe-top)) - max(14px, var(--lm-safe-bottom))));
        overscroll-behavior: contain;
    }
    .lm-sidebar-inner, .request-documents-dialog { --lm-dialog-limit: 820px; }
    .wos-information-dialog { --lm-dialog-limit: 880px; }
    .wos-information-dialog { display: flex; flex-direction: column; }
    .wos-information-content { min-height: 0; }
    .pwa-menu-sheet { max-height: calc(100dvh - var(--lm-safe-top) - 16px); visibility: hidden; pointer-events: none; }
    .pwa-menu-sheet.open { visibility: visible; pointer-events: auto; }
    .order-document-viewer { padding: max(12px, var(--lm-safe-top)) max(12px, var(--lm-safe-right)) max(12px, var(--lm-safe-bottom)) max(12px, var(--lm-safe-left)); }
    .order-document-viewer-dialog { max-height: 100%; }
    .lm-modal-overlay {
        padding: max(14px, var(--lm-safe-top)) max(14px, var(--lm-safe-right)) max(14px, var(--lm-safe-bottom)) max(14px, var(--lm-safe-left)) !important;
    }
    .lm-modal { max-height: calc(100dvh - max(14px, var(--lm-safe-top)) - max(14px, var(--lm-safe-bottom))); overflow-y: auto; overscroll-behavior: contain; }
    .lm-toast-container { top: max(20px, var(--lm-safe-top)) !important; right: max(12px, var(--lm-safe-right)) !important; max-width: calc(100% - max(12px, var(--lm-safe-left)) - max(12px, var(--lm-safe-right))) !important; }
}

@media screen and (max-width: 900px) {
    .lm-content { width: 100%; padding-inline: max(12px, var(--lm-safe-left)) max(12px, var(--lm-safe-right)); }
    .lm-header-inner { gap: 8px; padding-inline: max(12px, var(--lm-safe-left)) max(12px, var(--lm-safe-right)); }
    .lm-header-user { max-width: 130px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .lm-table-container { max-width: 100%; margin-inline: 0; padding-inline: 0; overscroll-behavior-x: contain; }
    :is(.dash-recent, .orders-panel, .builder-sheet) { min-width: 0; max-width: 100%; }
    .dash-recent { overflow-x: auto; }
    :is(.lm-tabs, .settings-nav, .request-progress) { max-width: 100%; overscroll-behavior-x: contain; }
    :is(.lm-tab, .settings-nav-item, .request-progress button) { flex-shrink: 0; min-height: 44px; }
    .lm-pagination { flex-wrap: wrap; }
    .lm-page-btn { min-width: 44px; min-height: 44px; }
    :is(.lm-form-row, .lm-grid-2, .lm-grid-3, .lm-grid-4, .orders-filters, .guide-form-grid) { grid-template-columns: minmax(0, 1fr); }
    :is(.lm-form-input, .lm-form-select, .request-field input, .request-field select) { min-height: 44px; }
    :is(.lm-btn-icon, .client-logout, .client-app-close, .payment-close, .lm-header-toggle, .lm-header-logout-btn) { min-width: 44px; min-height: 44px; }
    :is(.lm-btn, .request-step-button, .client-live-actions a) { white-space: normal; text-align: center; }
    .lm-filters { align-items: stretch; }
    .lm-filters > * { min-width: 0; max-width: 100%; }
    .setting-row { gap: 16px; }
    .setting-row > :first-child { min-width: 0; overflow-wrap: anywhere; }
    .setting-row > :last-child { flex-shrink: 0; }
    .request-detail-actions { position: static; }
    .builder-layout { grid-template-columns: minmax(0, 1fr); }
    .builder-sheet { overscroll-behavior: contain; }
    .order-detail-layout { grid-template-columns: minmax(0, 1fr) !important; }
    .order-detail-layout > * { min-width: 0; overflow-wrap: anywhere; }
    .lm-modal { padding: 20px !important; max-height: calc(100dvh - max(14px, var(--lm-safe-top)) - max(14px, var(--lm-safe-bottom))) !important; }
}

@media screen and (max-width: 640px) {
    :is(.launcher-shell, .request-public-shell, .tracking-shell, .privacy-shell, .access-shell) { padding-top: calc(18px + var(--lm-safe-top)); }
    .client-topbar-inner {
        width: auto;
        height: auto;
        min-height: 64px;
        margin-inline: max(10px, var(--lm-safe-left)) max(10px, var(--lm-safe-right));
        gap: 8px;
        padding-block: 8px;
    }
    .client-brand { gap: 8px; }
    .client-brand strong { overflow-wrap: anywhere; }
    .lm-header-title { min-width: 0; }
    .lm-header-user { display: none; }
    .lm-wtm-menu-panel { position: fixed; top: calc(68px + var(--lm-safe-top)); right: max(12px, var(--lm-safe-right)); width: min(290px, calc(100% - 24px - var(--lm-safe-left) - var(--lm-safe-right))); }
    .lm-header-toggle span { display: none; }
    .lm-header-toggle { padding: 7px; justify-content: center; }
    .lm-header-actions { gap: 6px; }
    :is(.lm-content h1, .lm-content h2, .client-hero h1, .client-live-route, .tracking-folio,
           .request-brand, .request-section-heading, .security-modal h2) { overflow-wrap: anywhere; }
    :is(.orders-toolbar, .document-page-head, .dash-recent-header, .request-section-heading,
           .payment-template-item, .payment-history-row, .request-draft-notice.visible) { flex-wrap: wrap; gap: 12px; }
    :is(.dash-hero-actions, .guide-download-links, .payment-actions, .client-live-actions, .account-actions) > :is(a, button) { flex: 1 1 140px; justify-content: center; }
    .dash-stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
    .dash-stat { min-width: 0; padding: 14px; }
    .dash-stat-label { overflow-wrap: anywhere; }
    .dash-table { min-width: 600px; }
    .lm-table { min-width: 680px; }
    .settings-nav-item { padding-inline: 14px; }
    .setting-row > .lm-btn { flex-shrink: 1; max-width: 46%; }
    .client-hero { padding: 20px; }
    .client-app-head { gap: 10px; }
    .client-app-head strong { font-size: 16px; overflow-wrap: anywhere; }
    .client-app-head-icon { flex-shrink: 0; }
    .client-app-view { padding: 16px; }
    :is(.client-document, .request-document-row) { flex-wrap: wrap; }
    :is(.client-document button, .client-order-link, .payment-link) { min-height: 44px; display: inline-flex; align-items: center; }
    .security-actions { flex-wrap: wrap; }
    .security-modal { width: min(390px, 100%); padding: 18px; }
    .security-modal-backdrop { overflow-y: auto; }
    .payment-modal-head { align-items: flex-start; gap: 10px; }
    .payment-modal-head > div { min-width: 0; overflow-wrap: anywhere; }
    .payment-modal-body, .payment-display-fields { padding: 16px; }
    .payment-extra-row { grid-template-columns: minmax(0, 1fr); }
    :is(.first-card, .account-card, .reset-card, .privacy-card) { padding: 20px; }
    .order-document-viewer-dialog { height: 100%; }
    .lm-modal > div:last-child { flex-wrap: wrap; }
    .lm-modal button { min-height: 44px; }
    .flow-strip { min-width: 0; flex-wrap: wrap; }
    .app-tile { min-width: 0; }
    .app-tile strong { overflow-wrap: anywhere; }
    .launcher-apps.client-session { grid-template-columns: minmax(0, 1fr); }
    :is(.order-summary-grid, .order-route-grid) { grid-template-columns: minmax(0, 1fr) !important; }
    .field-row { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
    .field-row .field-label { grid-column: 1 / -1; }
    :is(.field-row .field-key, .field-row .field-source) { grid-column: 1 / -1 !important; }
    .section-head { flex-wrap: wrap; }
    .section-head > input { flex-basis: 100%; }
    .preview-paper { padding: 16px; }
    .preview-grid { grid-template-columns: minmax(0, 1fr); }
    .offline-card { padding: 20px; min-width: 0; }
}

@media screen and (max-width: 360px) {
    .app-grid, .directory-apps { grid-template-columns: minmax(0, 1fr); }
    .client-verification-actions { grid-template-columns: minmax(0, 1fr); }
    .client-verification-actions .client-verification-confirm { grid-column: auto; }
    .client-overview-stats { grid-template-columns: minmax(0, 1fr); }
    .lm-header-title { font-size: 13px; }
}

@media screen and (max-height: 500px) and (orientation: landscape) {
    .lm-modal-overlay { align-items: center !important; }
    .lm-modal { max-height: calc(100dvh - max(14px, var(--lm-safe-top)) - max(14px, var(--lm-safe-bottom))) !important; }
    .lm-sidebar-inner, .client-app-dialog, .security-modal { max-height: calc(100dvh - max(14px, var(--lm-safe-top)) - max(14px, var(--lm-safe-bottom))); }
}
