/*
 * VOXEL PACS — camada responsiva compartilhada
 * Convenção: desktop > 900px; tablet 576–900px; mobile <= 575px.
 * Mantém a semântica e as permissões das telas PHP; altera somente apresentação e interação.
 */
:root {
    --voxel-safe-top: env(safe-area-inset-top, 0px);
    --voxel-safe-right: env(safe-area-inset-right, 0px);
    --voxel-safe-bottom: env(safe-area-inset-bottom, 0px);
    --voxel-safe-left: env(safe-area-inset-left, 0px);
    --voxel-mobile-tap: 44px;
}

html { -webkit-text-size-adjust: 100%; }
body { min-height: 100dvh; }

/* Sidebar e conteúdo em tablet/mobile, incluindo modo PWA standalone. */
@media (max-width: 900px) {
    #pacs-wrapper { min-height: 100dvh; }
    #pacs-sidebar {
        width: min(86vw, 320px) !important;
        padding-top: var(--voxel-safe-top);
        padding-bottom: var(--voxel-safe-bottom);
        transform: translateX(-105%);
        transition: transform .2s ease;
        z-index: 1100;
        box-shadow: 18px 0 38px rgba(2, 6, 23, .38);
    }
    #pacs-sidebar.mobile-open { transform: translateX(0); }
    #pacs-content,
    #pacs-content.sidebar-collapsed { margin-left: 0 !important; width: 100%; }
    #pacs-topbar {
        min-height: calc(56px + var(--voxel-safe-top));
        padding-top: var(--voxel-safe-top);
        padding-right: calc(1rem + var(--voxel-safe-right));
        padding-left: calc(.75rem + var(--voxel-safe-left));
        position: sticky;
        top: 0;
        z-index: 1000;
    }
    #pacs-page {
        min-height: calc(100dvh - 56px);
        padding-bottom: calc(1rem + var(--voxel-safe-bottom));
    }
    .pacs-mobile-backdrop {
        position: fixed;
        inset: 0;
        z-index: 1090;
        background: rgba(2, 6, 23, .48);
        opacity: 0;
        pointer-events: none;
        transition: opacity .2s ease;
    }
    body.pacs-mobile-nav-open { overflow: hidden; }
    body.pacs-mobile-nav-open .pacs-mobile-backdrop { opacity: 1; pointer-events: auto; }

    /* Listagens administrativas continuam legíveis sem comprimir a tabela. */
    #pacs-page .pacs-card:has(.pacs-table),
    #pacs-page .pacs-card:has(.platform-table) { overflow-x: auto; -webkit-overflow-scrolling: touch; }
    #pacs-page .pacs-table,
    #pacs-page .platform-table { min-width: 680px; }

    /* Modais ocupam a tela disponível em dispositivos móveis. */
    .modal-dialog { margin: 0; width: 100vw; max-width: 100vw; min-height: 100dvh; }
    .modal-content { min-height: 100dvh; border: 0; border-radius: 0; padding-bottom: var(--voxel-safe-bottom); }
    .modal-header, .modal-footer { padding-right: calc(1rem + var(--voxel-safe-right)); padding-left: calc(1rem + var(--voxel-safe-left)); }
}

/* Worklist: filtros recolhíveis e tabela transformada em cards de leitura clínica. */
.wl-mobile-filters-toggle { display: none; }

@media (max-width: 575px) {
    #pacs-page { padding-right: 0; padding-left: 0; }
    #pacs-page > .wl-page,
    #pacs-page .wl-page { padding-right: .7rem; padding-left: .7rem; }
    .topbar-title { font-size: .84rem; }
    .topbar-title .fa { margin-right: .25rem !important; }

    .wl-mobile-filters-toggle {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: .4rem;
        width: 100%;
        min-height: var(--voxel-mobile-tap);
        margin: 0 0 .55rem;
        border: 1px solid rgba(59, 130, 246, .45);
        border-radius: 8px;
        background: rgba(59, 130, 246, .10);
        color: var(--pacs-text, #e2e8f0);
        font-weight: 700;
    }
    #formFiltros .wl-filters-row1 {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: .45rem;
        padding: .65rem;
        border: 1px solid var(--pacs-border, #2d3244);
        border-radius: 8px;
        background: var(--pacs-card-bg, #1e2330);
    }
    #formFiltros .wl-filters-row1 > * { width: 100% !important; min-width: 0; }
    #formFiltros .wl-filters-row1 input[name="q"],
    #formFiltros .wl-filters-row1 input[name="paciente"],
    #formFiltros .wl-filters-row1 > .wl-btn-primary,
    #formFiltros .wl-filters-row1 > .wl-btn-outline { grid-column: 1 / -1; }
    #formFiltros:not(.mobile-filters-open) .wl-filters-row1 > :not(input[name="q"]):not(input[name="paciente"]):not(.wl-btn-primary):not(.wl-btn-outline) { display: none !important; }
    #formFiltros .wl-filters-row2 {
        display: none;
        margin-top: .45rem;
        padding: .65rem;
        border: 1px solid var(--pacs-border, #2d3244);
        border-radius: 8px;
        background: var(--pacs-card-bg, #1e2330);
        gap: .45rem;
    }
    #formFiltros.mobile-filters-open .wl-filters-row2 { display: flex; flex-wrap: wrap; }
    #formFiltros .wl-filters-row2 .wl-divider { display: none; }
    #formFiltros .wl-filters-row2 > .wl-select,
    #formFiltros .wl-filters-row2 > .wl-input,
    #formFiltros .wl-filters-row2 .wl-medico-wrap { width: 100% !important; }
    #formFiltros .wl-filters-row2 .wl-medico-wrap select { width: 100% !important; }
    #formFiltros .wl-info-right { width: 100%; justify-content: flex-start; flex-wrap: wrap; }
    #formFiltros .wl-mod-btn {
        min-width: var(--voxel-mobile-tap);
        min-height: 36px;
        padding: .35rem .48rem;
        font-size: .72rem;
    }
    #formFiltros .wl-select,
    #formFiltros .wl-input,
    #formFiltros .wl-btn-primary,
    #formFiltros .wl-btn-outline { min-height: var(--voxel-mobile-tap); }

    .wl-table-wrap { overflow: visible; }
    .wl-table, .wl-table tbody, .wl-table tr, .wl-table td { display: block; width: 100%; }
    .wl-table { min-width: 0; }
    .wl-table thead { display: none; }
    .wl-table tbody { display: grid; gap: .75rem; }
    .wl-table tr.wl-row {
        position: relative;
        overflow: visible;
        padding: .65rem .7rem;
        border: 1px solid var(--pacs-border, #2d3244);
        border-radius: 10px;
        background: var(--pacs-card-bg, #1e2330);
        box-shadow: 0 2px 8px rgba(15, 23, 42, .10);
    }
    .wl-table td { min-height: 0; padding: .34rem 0; border: 0; }
    .wl-table td[data-label] { display: grid; grid-template-columns: 106px minmax(0, 1fr); align-items: center; gap: .45rem; }
    .wl-table td[data-label]::before {
        content: attr(data-label);
        color: var(--pacs-text-muted, #8892a4);
        font-size: .64rem;
        font-weight: 800;
        letter-spacing: .04em;
        text-transform: uppercase;
    }
    .wl-table td.col-check { position: absolute; top: .52rem; right: .55rem; width: auto; padding: 0; }
    .wl-table td.col-check input { width: 20px; height: 20px; }
    .wl-table td.col-paciente { padding-right: 2rem; }
    .wl-table td.col-paciente .wl-pac-row { align-items: flex-start; }
    .wl-table td.col-paciente .wl-pac-nome { font-size: .96rem; white-space: normal; }
    .wl-table td.col-dt { padding-right: 2rem; }
    .wl-table td.col-acoes { padding-top: .55rem; border-top: 1px solid var(--pacs-border, #2d3244); }
    .wl-table td.col-acoes::before { display: none; }
    .wl-acoes-wrap { display: flex; align-items: stretch; flex-wrap: wrap; gap: .42rem; }
    .wl-acoes-wrap > a,
    .wl-acoes-wrap > button,
    .wl-acoes-wrap .wl-viewer-wrap > button { min-height: var(--voxel-mobile-tap); }
    .wl-viewer-wrap { flex: 1 1 124px; }
    .wl-btn-abrir, .wl-btn-laudo, .wl-btn-assumir, .wl-btn-peer-review { min-height: var(--voxel-mobile-tap); justify-content: center; }
    .wl-viewer-menu { z-index: 1200; }
    .wl-pagination { position: static; flex-wrap: wrap; gap: .55rem; padding-bottom: calc(.75rem + var(--voxel-safe-bottom)); }
    .wl-sel-bar { left: .5rem; right: .5rem; bottom: calc(.5rem + var(--voxel-safe-bottom)); width: auto; transform: none; }
    .wl-sel-bar-inner { flex-wrap: wrap; gap: .4rem; }
}

@media (prefers-reduced-motion: reduce) {
    #pacs-sidebar, .pacs-mobile-backdrop { transition: none; }
}

/* Login mobile: prioriza a autenticação e evita duas colunas comprimidas. */
@media (max-width: 700px) {
    .auth-layout { min-height: 100dvh; }
    .auth-brand { display: none; }
    .auth-panel {
        min-height: 100dvh;
        padding: calc(1.25rem + var(--voxel-safe-top)) calc(1rem + var(--voxel-safe-right)) calc(1.25rem + var(--voxel-safe-bottom)) calc(1rem + var(--voxel-safe-left));
    }
    .auth-box { width: 100%; max-width: 28rem; margin: auto; }
    .auth-box input,
    .auth-box select,
    .auth-box button { min-height: var(--voxel-mobile-tap); }

    /* Laudário: evita cortes e permite que a barra/editor usem a altura útil do aparelho. */
    .reports-body { min-height: 100dvh; padding-bottom: var(--voxel-safe-bottom); }
    .reports-topbar {
        min-height: calc(54px + var(--voxel-safe-top));
        padding-top: var(--voxel-safe-top);
        padding-right: calc(.7rem + var(--voxel-safe-right));
        padding-left: calc(.7rem + var(--voxel-safe-left));
        position: sticky;
        top: 0;
        z-index: 1000;
    }
    .reports-topbar .reports-topbar-title { font-size: .84rem; }
    .reports-toolbar, .ql-toolbar.ql-snow { overflow-x: auto; white-space: nowrap; -webkit-overflow-scrolling: touch; }
    .ql-toolbar.ql-snow .ql-formats { margin-right: .35rem; }
    .reports-editor, .ql-container.ql-snow { min-height: 46dvh; }
}

@media (display-mode: standalone) {
    body { min-height: 100dvh; }
}

/* BI e Plataforma: a navegação lateral vira faixa horizontal em telas estreitas. */
@media (max-width: 700px) {
    .platform-wrapper { display: block; min-height: 100dvh; }
    .platform-sidebar-nav {
        width: 100% !important;
        min-height: auto !important;
        position: static !important;
        padding-top: var(--voxel-safe-top);
    }
    .platform-sidebar-nav .sidebar-logo { padding-bottom: .45rem !important; }
    .platform-sidebar-nav .sidebar-section-title,
    .platform-sidebar-nav .sidebar-footer { display: none; }
    .platform-sidebar-nav .sidebar-nav {
        display: flex;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        gap: .2rem;
        padding: .35rem .6rem !important;
    }
    .platform-sidebar-nav .nav-link { flex: 0 0 auto; white-space: nowrap; }
    .platform-main { margin-left: 0 !important; padding: 1rem .75rem calc(1rem + var(--voxel-safe-bottom)) !important; }

    #wrapper { flex-direction: column; min-height: 100dvh; }
    #wrapper > #sidebar {
        width: 100% !important;
        min-width: 100% !important;
        min-height: auto !important;
        position: static !important;
        padding-top: var(--voxel-safe-top);
    }
    #wrapper > #sidebar .nav { flex-direction: row !important; flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; }
    #wrapper > #sidebar .nav-item { flex: 0 0 auto; }
    #wrapper > #sidebar .nav-link { white-space: nowrap; }
    #wrapper > #page-content-wrapper { width: 100%; padding-bottom: calc(1rem + var(--voxel-safe-bottom)); }
}