/*
 * SISO responsive safety layer.
 * Loaded after the theme and project customizations so legacy screens with
 * fixed inline widths remain usable on phones and tablets.
 */

html {
    max-width: 100%;
    overflow-x: hidden;
}

/* O tema ja forca overflow-y: scroll no body. Quando overflow-x: hidden era
   aplicado tambem nele, body e html viravam dois scroll containers verticais. */
body {
    max-width: 100%;
    overflow: visible;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

.wrapper,
.main,
main.content,
main.content > .container-fluid,
#adianti_div_content,
#adianti_online_content {
    min-width: 0;
    max-width: 100%;
}

img,
video,
svg,
canvas,
iframe {
    max-width: 100%;
}

img,
video {
    height: auto;
}

/* Never let a field's legacy inline width enlarge the viewport. */
.tfield,
.form-control,
.form-select,
.input-group,
.select2-container,
.select2-choice,
.ms-options-wrap,
.note-editor,
.tdate-group,
.tdatetime-group,
.tfile_row_wrapper {
    max-width: 100% !important;
}

.row > *,
.tformrow > *,
.card,
.card-body,
.panel,
.panel-body,
.tab-content,
.tab-pane {
    min-width: 0;
}

/* Wide data stays complete and gains a local, touch-friendly scrollbar. */
.table-responsive,
.dataTables_wrapper,
.fixedTable-body,
.tgantt,
.div_arrow_steps,
.card-body:has(> table.tdatagrid_table),
.panel-body:has(> table.tdatagrid_table),
.card-body:has(> table.tfieldlist),
.panel-body:has(> table.tfieldlist) {
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-inline: contain;
}

table.tdatagrid_table,
table.tfieldlist {
    width: max-content;
    min-width: 100%;
}

.table-responsive > .table {
    margin-bottom: 0;
}

.card-header,
.panel-heading,
.header-actions,
.card-footer,
.panel-footer,
.tformaction > td {
    min-width: 0;
}

.card-title,
.panel-title,
.dropdown-item,
.dropdown-header,
.alert,
.bootbox-body,
.swal2-html-container {
    overflow-wrap: anywhere;
}

.ui-dialog,
.offcanvas,
.right-panel {
    max-width: 100vw;
}

.sidebar-backdrop {
    display: none;
}

/* The source logo files contain large transparent margins. These viewports
   reveal only the artwork, without fragile negative margins in the markup. */
#sidebar .sidebar-content {
    min-height: 100%;
}

#sidebar .sidebar-system-name.siso-sidebar-brand {
    height: 72px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

#sidebar .sidebar-logo.siso-sidebar-logo {
    width: 190px;
    height: 68px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border-radius: 0;
    line-height: normal;
}

.siso-sidebar-symbol,
.siso-sidebar-word {
    position: relative;
    display: block;
    flex: 0 0 auto;
    overflow: hidden;
}

.siso-sidebar-symbol {
    width: 44px;
    height: 54px;
}

.siso-sidebar-word {
    width: 132px;
    height: 54px;
}

.siso-sidebar-symbol img,
.siso-sidebar-word img {
    position: absolute;
    max-width: none;
    height: auto;
    pointer-events: none;
    user-select: none;
}

.siso-sidebar-symbol img {
    width: 82px;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.siso-sidebar-word img {
    width: 194px;
    left: calc(50% - 4px);
    top: calc(50% + 7px);
    transform: translate(-50%, -50%);
}

.modal-body,
.ui-dialog-content,
.right-panel,
.right-panel .container-part {
    overscroll-behavior: contain;
}

/* Datagrids are wrapped by theme.js. Keeping their natural column width is
   preferable to hiding fields or compressing values until they are unreadable. */
.siso-datagrid-scroll,
.dataTables_wrapper {
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    overflow-y: visible;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-inline: contain;
}

.siso-datagrid-scroll:focus-visible {
    outline: 2px solid var(--bs-primary);
    outline-offset: 2px;
}

#pp_custom_tabs .pp-tab-label {
    margin-left: .35rem;
}

/* The element is inserted for editor accessibility, but is visible only on
   narrow portrait screens in the media query below. */
.siso-odontogram-orientation-note {
    display: none;
}

/* Tablet and smaller */
@media (max-width: 991.98px) {
    main.content {
        width: 100%;
        padding-block: .75rem !important;
        padding-inline: max(.75rem, env(safe-area-inset-left)) max(.75rem, env(safe-area-inset-right)) !important;
    }

    main.content > .container-fluid {
        --bs-gutter-x: 0;
        padding-inline: 0;
    }

    .card-header,
    .panel-heading {
        flex-wrap: wrap;
        gap: .5rem;
    }

    .header-actions {
        flex-wrap: wrap;
        gap: .35rem;
    }

    .navbar {
        width: 100%;
        min-width: 0;
        padding-left: max(.5rem, env(safe-area-inset-left)) !important;
        padding-right: max(.5rem, env(safe-area-inset-right)) !important;
    }

    .navbar > .navbar-collapse,
    .navbar > .navbar-collapse.navbar {
        min-width: 0;
        justify-content: space-between;
    }

    .navbar .dropdown-menu {
        max-width: calc(100vw - 1rem);
    }

    .dropdown-menu:not(.datepicker):not(.ui-datepicker) {
        max-height: min(70dvh, 32rem);
        overflow-y: auto;
        overscroll-behavior: contain;
    }

    /* The menu becomes an overlay and no longer squeezes page content. */
    #sidebar {
        position: fixed;
        top: 0;
        right: auto;
        bottom: auto;
        left: 0;
        width: min(86vw, var(--ad-menu-size));
        min-width: min(86vw, var(--ad-menu-size));
        max-width: min(86vw, var(--ad-menu-size));
        height: 100vh !important;
        height: 100dvh !important;
        min-height: 100vh;
        min-height: 100dvh;
        max-height: none;
        margin-left: 0 !important;
        align-self: stretch;
        overflow-y: auto;
        transform: translateX(0);
        transition: transform .25s ease-in-out;
        z-index: 1045;
    }

    #sidebar.collapsed {
        margin-left: 0 !important;
        transform: translateX(-101%);
        box-shadow: none !important;
    }

    .sidebar-backdrop {
        position: fixed;
        inset: 0;
        display: none;
        border: 0;
        padding: 0;
        background: rgb(0 0 0 / 45%);
        z-index: 1040;
    }

    body.sidebar-open {
        overflow: hidden;
    }

    body.sidebar-open .sidebar-backdrop {
        display: block;
    }

    .right-panel {
        width: min(100%, 980px) !important;
        height: 100dvh;
        overflow-x: hidden;
    }

    .ui-dialog {
        width: calc(100vw - 1rem) !important;
        max-height: calc(100dvh - 1rem);
        left: .5rem !important;
    }

    .ui-dialog .ui-dialog-content {
        max-height: calc(100dvh - 8rem) !important;
        overflow: auto;
    }

    /* Mapping is a workspace rather than a short form: use nearly all of the
       available mobile height, leaving only the dialog title and safe gaps. */
    .ui-dialog:has(#odontograma-game-container-form[data-odontograma-context="mapping"]) {
        height: calc(100dvh - 1rem) !important;
        max-height: calc(100dvh - 1rem) !important;
    }

    .ui-dialog:has(#odontograma-game-container-form[data-odontograma-context="mapping"]) .ui-dialog-content {
        height: calc(100dvh - 4.5rem) !important;
        max-height: calc(100dvh - 4.5rem) !important;
        box-sizing: border-box;
        overflow-y: auto !important;
    }

    .financeiro-grid-wrapper .table-responsive,
    .financeiro-grid-wrapper .lancamentos-tabela,
    #form_orcamentos .panel-body {
        max-width: 100%;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch;
    }

    table.tdatagrid_table {
        width: max-content !important;
        min-width: 100% !important;
        table-layout: auto !important;
    }

    table.tdatagrid_table > thead > tr > th,
    table.tdatagrid_table > tbody > tr > td,
    table.tdatagrid_table > tfoot > tr > td {
        width: auto;
        min-width: max-content;
        white-space: nowrap !important;
    }

    /* Adianti's hiddable columns normally disappear according to viewport
       width. Inside the horizontal scroller they can remain fully available. */
    .siso-datagrid-scroll table.tdatagrid_table [hiddable],
    .dataTables_wrapper table.tdatagrid_table [hiddable] {
        display: table-cell !important;
    }

    .siso-datagrid-scroll.is-horizontally-scrollable:not(.scroll-hint-seen)::before,
    .dataTables_wrapper.is-horizontally-scrollable:not(.scroll-hint-seen)::before {
        content: "\2194  Arraste para o lado para ver todas as colunas";
        position: sticky;
        left: .35rem;
        z-index: 4;
        display: table;
        margin: .25rem .35rem .45rem;
        padding: .3rem .55rem;
        border: 1px solid var(--bs-primary-border-subtle);
        border-radius: 999px;
        background: var(--bs-primary-bg-subtle);
        color: var(--bs-primary-text-emphasis);
        font-size: .75rem;
        font-weight: 600;
        white-space: nowrap;
        pointer-events: none;
    }

    /* ---------- Patient record ---------- */
    #pp_custom_tabs {
        width: 100%;
        max-width: 100%;
        display: flex;
        flex-wrap: nowrap;
        gap: .35rem;
        margin-left: 0;
        padding: 0 0 .35rem;
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: thin;
    }

    #pp_custom_tabs .btn,
    #pp_custom_tabs a.btn {
        flex: 0 0 auto;
        margin: 0 !important;
        white-space: nowrap;
    }

    #pp_notebook_wrap,
    #pp_notebook_wrap .tabwrapper.bordered,
    #pp_notebook_wrap .tab-content,
    #pp_notebook_wrap .tab-pane,
    #pp_notebook_wrap .pp-page-root {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
    }

    #pp_notebook_wrap .tabwrapper.bordered {
        overflow: visible !important;
    }

    #pp_notebook_wrap .tab-content,
    #pp_notebook_wrap .tab-pane.active,
    #pp_notebook_wrap .tab-pane.active > *,
    #pp_notebook_wrap .pp-page-root,
    #pp_notebook_wrap .card-body,
    #pp_notebook_wrap .panel-body {
        height: auto !important;
        max-height: none !important;
        overflow-x: visible !important;
        overflow-y: visible !important;
    }

    #pp_notebook_wrap .tabwrapper.bordered .tab-pane .card-body,
    #pp_notebook_wrap .tabwrapper.bordered .tab-pane .panel-body {
        padding: .75rem !important;
    }

    #pp_notebook_wrap .tab-header .card-body,
    #pp_notebook_wrap .tab-header .panel-body {
        padding: 0 !important;
    }

    #pp_notebook_wrap form,
    #pp_notebook_wrap form .card,
    #pp_notebook_wrap form .panel {
        width: 100% !important;
        max-width: 100% !important;
    }

    #pp_notebook_wrap form textarea,
    #pp_notebook_wrap form .select2-container,
    #pp_notebook_wrap form .tfield {
        width: 100% !important;
        max-width: 100% !important;
    }

    #pp_notebook_wrap .toggle-wrapper,
    #pp_notebook_wrap .toggle-wrapper .btn-group {
        max-width: 100%;
        flex-wrap: wrap;
    }

    .prontuariopaciente,
    .prontuariopaciente .card,
    .prontuariopaciente .card-body {
        max-width: 100%;
    }

    .prontuariopaciente .form-control-static,
    .prontuariopaciente .info-group,
    .timeline-content {
        overflow-wrap: anywhere;
        word-break: break-word;
    }

    /* Keep every odontogram in one coordinate system. The outer viewport pans,
       while teeth and absolute SVG overlays remain aligned inside the wrapper. */
    .siso-odontogram-viewport {
        width: 100% !important;
        max-width: 100% !important;
        display: block !important;
        overflow-x: auto !important;
        overflow-y: visible !important;
        padding: .25rem 0 .75rem;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior-inline: contain;
        touch-action: pan-x pan-y;
        scrollbar-width: auto;
        scrollbar-color: var(--bs-primary) var(--bs-secondary-bg);
        cursor: grab;
    }

    .siso-odontogram-viewport::-webkit-scrollbar {
        height: 11px;
    }

    .siso-odontogram-viewport::-webkit-scrollbar-track {
        background: var(--bs-secondary-bg);
        border-radius: 999px;
    }

    .siso-odontogram-viewport::-webkit-scrollbar-thumb {
        background: var(--bs-primary);
        border: 2px solid var(--bs-secondary-bg);
        border-radius: 999px;
    }

    .siso-odontogram-viewport.is-touch-panning {
        cursor: grabbing;
        -webkit-user-select: none;
        user-select: none;
    }

    .siso-odontogram-viewport::before {
        content: "\2194  Arraste para visualizar toda a arcada";
        position: sticky;
        left: .35rem;
        z-index: 12;
        display: table;
        margin: 0 .35rem .4rem;
        padding: .3rem .55rem;
        border: 1px solid var(--bs-primary-border-subtle);
        border-radius: 999px;
        background: var(--bs-primary-bg-subtle);
        color: var(--bs-primary-text-emphasis);
        font-size: .75rem;
        font-weight: 600;
        white-space: nowrap;
        pointer-events: none;
    }

    .siso-odontogram-viewport > .odontograma-scroll-wrapper,
    #odontograma-game-container .siso-odontogram-viewport > .odontograma-scroll-wrapper {
        width: 1008px !important;
        min-width: 1008px !important;
        max-width: none !important;
        padding-inline: 8px !important;
        overflow: visible !important;
        box-sizing: border-box !important;
        position: relative !important;
        align-items: center !important;
    }

    .siso-odontogram-viewport .odontograma-container {
        width: 992px !important;
        min-width: 992px !important;
        max-width: none !important;
        padding: 0 !important;
        overflow: visible !important;
    }

    .siso-odontogram-viewport .odontograma-row {
        width: 992px !important;
        min-width: 992px !important;
        max-width: none !important;
        justify-content: center !important;
        align-items: stretch !important;
        overflow: visible !important;
        min-height: 126px !important;
        margin-bottom: 8px !important;
    }

    .siso-odontogram-viewport .odontograma-row .dente,
    .siso-odontogram-viewport .odontograma-row .dente-game {
        flex: 0 0 60px !important;
        width: 60px !important;
        min-width: 60px !important;
        max-width: 60px !important;
        height: 126px !important;
        min-height: 126px !important;
        max-height: 126px !important;
        margin-inline: 1px !important;
        box-sizing: border-box !important;
        aspect-ratio: auto !important;
        flex-shrink: 0 !important;
        overflow: visible !important;
    }

    /* Status-specific odontogram rules previously changed width/aspect-ratio,
       making special teeth collapse and shifting every following SVG. */
    .siso-odontogram-viewport .odontograma-game-container .odontograma-row .dente-game.tooth-absent,
    .siso-odontogram-viewport .odontograma-game-container .odontograma-row .dente-game.tooth-removed,
    .siso-odontogram-viewport .odontograma-game-container .odontograma-row .dente-game.tooth-implant,
    .siso-odontogram-viewport .odontograma-game-container .odontograma-row .dente-game.tooth-prosthesis,
    .siso-odontogram-viewport .odontograma-game-container .odontograma-row .dente-game[data-procedure] {
        flex: 0 0 60px !important;
        width: 60px !important;
        min-width: 60px !important;
        max-width: 60px !important;
        height: 126px !important;
        min-height: 126px !important;
        max-height: 126px !important;
        aspect-ratio: auto !important;
        flex-shrink: 0 !important;
    }

    .siso-odontogram-viewport .odontograma-row .dente img,
    .siso-odontogram-viewport .odontograma-row .dente-game img:not(.anchor-implant-img) {
        width: 48px !important;
        height: 48px !important;
        min-width: 48px !important;
        max-width: 48px !important;
    }

    .siso-odontogram-viewport .odontograma-row .dente-face-svg,
    .siso-odontogram-viewport .odontograma-row .dente-game .dente-face-svg {
        width: 48px !important;
        height: 48px !important;
        min-width: 48px !important;
        max-width: 48px !important;
    }

    .siso-odontogram-viewport .odontograma-row .dente-numero {
        font-size: 13px !important;
    }

    /* In the editable form, dragging over teeth belongs to selection. Native
       panning is disabled only while selection mode is active; edge scrolling
       is then handled by the odontogram runtime. */
    .siso-odontogram-editor-viewport {
        /* Vertical page scrolling remains native; horizontal movement is
           handled explicitly so the odontogram follows the finger on iOS. */
        touch-action: pan-y !important;
        overscroll-behavior-inline: contain;
    }

    .siso-odontogram-editor-viewport::before {
        content: "Segure um dente e arraste; aproxime da borda para avançar";
    }

    .siso-odontogram-viewport .odontograma-scroll-wrapper[data-context="form"].selection-mode .dente-game,
    .siso-odontogram-viewport .odontograma-scroll-wrapper[data-context="form"].selection-mode .dente-game * {
        touch-action: none !important;
        -webkit-touch-callout: none;
        -webkit-user-select: none;
        user-select: none;
    }

    /* The odontogram shown in the record tab needs more vertical room for
       status labels and procedure SVG overlays. Keep the 126px tooth box used
       by the desktop overlay math and add the extra room around it. */
    .siso-odontogram-record-viewport .odontograma-row {
        min-height: 136px !important;
        align-items: center !important;
        margin-bottom: 12px !important;
    }

    .siso-odontogram-record-viewport .odontograma-row .dente,
    .siso-odontogram-record-viewport .odontograma-row .dente-game,
    .siso-odontogram-record-viewport .odontograma-game-container .odontograma-row .dente-game.tooth-absent,
    .siso-odontogram-record-viewport .odontograma-game-container .odontograma-row .dente-game.tooth-removed,
    .siso-odontogram-record-viewport .odontograma-game-container .odontograma-row .dente-game.tooth-implant,
    .siso-odontogram-record-viewport .odontograma-game-container .odontograma-row .dente-game.tooth-prosthesis,
    .siso-odontogram-record-viewport .odontograma-game-container .odontograma-row .dente-game[data-procedure] {
        height: 126px !important;
        min-height: 126px !important;
        max-height: 126px !important;
        gap: 3px !important;
    }

    /* Match the desktop proportions: the face diagram is smaller than the
       tooth image. Using 48px for both made bridges and appliances look
       compressed and moved their visual center. */
    .siso-odontogram-record-viewport .odontograma-row .dente-face-svg,
    .siso-odontogram-record-viewport .odontograma-row .dente-game .dente-face-svg {
        width: 32px !important;
        height: 32px !important;
        min-width: 32px !important;
        max-width: 32px !important;
        margin-block: 2px !important;
    }

    /* The inner odontogram is 1008px wide even on a phone. Anchor dimensions
       therefore must follow that coordinate system, not the device vw. */
    .siso-odontogram-record-viewport .anchor-implant-img {
        width: 34px !important;
        min-width: 34px !important;
        max-width: 34px !important;
        height: auto !important;
    }

    /* Financial tables are dense by nature: keep them intact in a scroller. */
    #pp_notebook_wrap .financeiro-grid-wrapper,
    #pp_notebook_wrap .financeiro-grid-wrapper .lancamentos-tabela,
    #pp_notebook_wrap .financeiro-grid-wrapper .table-responsive {
        width: 100%;
        max-width: 100%;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch;
    }

    footer {
        width: 100%;
        padding: .75rem max(.75rem, env(safe-area-inset-right)) max(.75rem, env(safe-area-inset-bottom)) max(.75rem, env(safe-area-inset-left));
    }
}

/* On phones, records become vertical cards instead of compressed columns. */
@media (max-width: 991.98px) {
    .siso-datagrid-scroll,
    .dataTables_wrapper,
    #pp_notebook_wrap .financeiro-grid-wrapper,
    #pp_notebook_wrap .financeiro-grid-wrapper .table-responsive,
    #pp_notebook_wrap .financeiro-grid-wrapper .lancamentos-tabela {
        overflow-x: visible !important;
    }

    .siso-datagrid-scroll::before,
    .dataTables_wrapper::before {
        display: none !important;
    }

    table.siso-mobile-card-table,
    table.siso-mobile-card-table > tbody {
        display: block !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
    }

    table.siso-mobile-card-table > thead {
        display: none !important;
    }

    table.siso-mobile-card-table > tbody > tr {
        display: flex !important;
        flex-direction: column;
        width: 100% !important;
        margin: 0 0 .75rem !important;
        border: 1px solid var(--bs-border-color) !important;
        border-radius: .65rem !important;
        background: var(--bs-body-bg) !important;
        box-shadow: 0 .125rem .35rem rgb(0 0 0 / 8%);
        overflow: visible;
    }

    /* Preserve expandable/collapsible financial rows. Their script uses
       table-row/none, which must map to block/none in the card layout. */
    table.siso-mobile-card-table > tbody > tr[style*="display: table-row"],
    table.siso-mobile-card-table > tbody > tr[style*="display:table-row"] {
        display: flex !important;
    }

    .financeiro-grid-wrapper table.siso-mobile-card-table > tbody > tr.aditivo-row:not([style]),
    table.siso-mobile-card-table > tbody > tr[hidden],
    table.siso-mobile-card-table > tbody > tr[style*="display: none"],
    table.siso-mobile-card-table > tbody > tr[style*="display:none"] {
        display: none !important;
    }

    table.siso-mobile-card-table > tbody > tr > td,
    table.siso-mobile-card-table > tbody > tr > th,
    table.siso-mobile-card-table > tbody > tr > [hiddable] {
        display: grid !important;
        grid-template-columns: minmax(6.5rem, 38%) minmax(0, 1fr);
        align-items: center;
        gap: .65rem;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        padding: .6rem .7rem !important;
        border: 0 !important;
        border-bottom: 1px solid var(--bs-border-color-translucent) !important;
        white-space: normal !important;
        overflow-wrap: anywhere;
        text-align: left !important;
        order: 10;
    }

    table.siso-mobile-card-table > tbody > tr > td:last-child,
    table.siso-mobile-card-table > tbody > tr > th:last-child {
        border-bottom: 0 !important;
    }

    table.siso-mobile-card-table > tbody > tr > td::before,
    table.siso-mobile-card-table > tbody > tr > th::before {
        content: attr(data-label);
        min-width: 0;
        color: var(--bs-secondary-color);
        font-size: .75rem;
        font-weight: 700;
        line-height: 1.25;
        text-transform: uppercase;
        overflow-wrap: anywhere;
    }

    table.siso-mobile-card-table > tbody > tr > .siso-mobile-full-row {
        grid-template-columns: 1fr;
    }

    table.siso-mobile-card-table > tbody > tr > .siso-mobile-card-primary {
        order: 0;
        grid-template-columns: minmax(5.5rem, 30%) minmax(0, 1fr);
        padding-block: .75rem !important;
        background: var(--bs-tertiary-bg);
        font-weight: 600;
    }

    table.siso-mobile-card-table > tbody > tr > .siso-mobile-actions {
        order: 100;
        grid-template-columns: minmax(5.5rem, 30%) minmax(0, 1fr);
        background: var(--bs-secondary-bg);
    }

    table.siso-mobile-card-table > tbody > tr > .siso-mobile-full-row::before,
    table.siso-mobile-card-table > tbody > tr > td[data-label=""]::before,
    table.siso-mobile-card-table > tbody > tr > th[data-label=""]::before {
        display: none;
    }

    table.siso-mobile-card-table td > *,
    table.siso-mobile-card-table th > * {
        min-width: 0;
        max-width: 100%;
    }

    table.siso-mobile-card-table > tbody > tr > td > .siso-mobile-cell-value,
    table.siso-mobile-card-table > tbody > tr > th > .siso-mobile-cell-value {
        display: block;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        white-space: normal !important;
        word-break: normal !important;
        overflow-wrap: break-word !important;
    }

    table.siso-mobile-card-table > tbody > tr > .siso-mobile-full-row > .siso-mobile-cell-value {
        grid-column: 1 / -1;
    }

    table.siso-mobile-card-table > tbody > tr > .siso-mobile-actions > .siso-mobile-cell-value {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: .35rem;
    }

    #pp_notebook_wrap .financeiro-grid-wrapper .lancamentos-tabela.siso-mobile-card-table,
    #pp_notebook_wrap .financeiro-grid-wrapper .lancamentos-tabela.siso-mobile-card-table > tbody,
    #pp_notebook_wrap .financeiro-grid-wrapper .lancamentos-tabela.siso-mobile-card-table > tbody > tr,
    #pp_notebook_wrap .financeiro-grid-wrapper .lancamentos-tabela.siso-mobile-card-table > tbody > tr > td {
        min-width: 0 !important;
        max-width: 100% !important;
        width: 100% !important;
    }

    table.siso-mobile-card-table .btn-group,
    table.siso-mobile-card-table .tdatagrid_actions {
        display: flex;
        flex-wrap: wrap;
        gap: .3rem;
    }

    table.siso-mobile-card-table > tfoot {
        display: block;
        width: 100%;
    }

    .card-body:has(table.siso-mobile-card-table),
    .panel-body:has(table.siso-mobile-card-table),
    #pacientes_datagrid_wrap,
    #pacientes_datagrid_wrap > * {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        overflow-x: visible !important;
    }

    /* Six icon-only tabs fit without requiring horizontal panning. */
    #pp_custom_tabs {
        display: grid !important;
        grid-template-columns: repeat(6, minmax(0, 1fr));
        gap: .25rem;
        padding-bottom: .3rem;
        overflow: visible;
    }

    #pp_custom_tabs .btn,
    #pp_custom_tabs a.btn {
        width: 100%;
        min-width: 0;
        min-height: 42px;
        margin: 0 !important;
        padding: .45rem .2rem;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border-radius: .45rem !important;
        font-size: 1rem;
    }

    #pp_custom_tabs .pp-tab-label {
        position: absolute !important;
        width: 1px !important;
        height: 1px !important;
        padding: 0 !important;
        margin: -1px !important;
        overflow: hidden !important;
        clip: rect(0, 0, 0, 0) !important;
        white-space: nowrap !important;
        border: 0 !important;
    }

    .siso-odontogram-orientation-note {
        display: none;
    }

    #pp_notebook_wrap .financeiro-grid-wrapper tr.group-col-header,
    #pp_notebook_wrap .financeiro-grid-wrapper tbody.orcamento-gap {
        display: none !important;
    }
}

@media (max-width: 767.98px) and (orientation: portrait) {
    .siso-odontogram-orientation-note {
        display: flex;
        align-items: center;
        gap: .55rem;
        margin: .25rem 0 .55rem;
        padding: .65rem .75rem;
        border: 1px solid var(--bs-warning-border-subtle);
        border-radius: .55rem;
        background: var(--bs-warning-bg-subtle);
        color: var(--bs-warning-text-emphasis);
        font-size: .82rem;
        line-height: 1.35;
    }

    .siso-odontogram-orientation-note i {
        flex: 0 0 auto;
        font-size: 1.1rem;
        transform: rotate(90deg);
    }
}

/* Phone */
@media (max-width: 575.98px) {
    main.content {
        padding-block: .5rem !important;
        padding-inline: max(.5rem, env(safe-area-inset-left)) max(.5rem, env(safe-area-inset-right)) !important;
    }

    .card {
        --bs-card-cap-padding-x: .75rem;
        --bs-card-spacer-x: .75rem;
    }

    .card-header,
    .panel-heading {
        align-items: flex-start;
    }

    .card-header .header-actions,
    .panel-heading .header-actions {
        width: 100%;
        margin-left: 0;
    }

    .header-actions > .btn,
    .header-actions > .btn-group {
        flex: 1 1 auto;
    }

    .tformrow {
        --bs-gutter-x: .75rem;
    }

    .tformrow > [class*="col-"] {
        width: 100%;
        max-width: 100%;
    }

    .tformrow .col-form-label,
    .tformrow .control-label {
        padding-bottom: .2rem;
        text-align: left !important;
    }

    .btn-toolbar,
    .card-footer,
    .panel-footer,
    .tformaction > td {
        flex-wrap: wrap;
        gap: .4rem;
    }

    .modal-dialog {
        width: auto;
        margin: .5rem;
    }

    .modal-content {
        max-height: calc(100dvh - 1rem);
    }

    .modal-body {
        overflow-y: auto;
    }

    .swal2-popup {
        width: calc(100vw - 1rem) !important;
        padding: 1rem;
    }

    .navbar .btn-group:last-child > button > span {
        display: none;
    }

    .navbar .btn-group:last-child > button::after {
        margin-left: .35rem;
    }

    .fc-toolbar {
        flex-wrap: wrap;
        gap: .5rem;
    }

    .fc-toolbar > * {
        max-width: 100%;
    }

    .system-calendar {
        height: auto;
        min-height: calc(100dvh - 7rem);
    }

    /* Compact, readable patient header instead of a desktop card squeezed down. */
    .prontuariopaciente .card-body {
        padding: .65rem !important;
    }

    .prontuariopaciente .row {
        margin-inline: 0 !important;
    }

    .prontuariopaciente .row > [class^="col-"],
    .prontuariopaciente .row > [class*=" col-"] {
        padding-inline: .25rem !important;
    }

    .prontuariopaciente .profile-image-container img {
        width: 88px !important;
        height: 88px !important;
        margin-bottom: .5rem;
    }

    .prontuariopaciente .info-group {
        padding: .5rem .6rem;
        margin-bottom: .4rem !important;
    }

    .prontuariopaciente .card-body > .mt-3 .btn {
        width: 100%;
    }

    #pp_notebook_wrap .tab-header .card-header {
        gap: .35rem;
    }

    #pp_notebook_wrap .tab-header .badge {
        white-space: normal;
        text-align: right;
    }

    /* Evolution becomes a single-column timeline with useful content width. */
    #pp_notebook_wrap .timeline-odonto {
        width: 100%;
        padding-inline: 0;
    }

    #pp_notebook_wrap .timeline-odonto:not(:empty)::after {
        left: 15px;
    }

    #pp_notebook_wrap .timeline-odonto-item .timeline-badge {
        left: 15px;
        width: 30px;
        height: 30px;
        margin-left: -15px;
    }

    #pp_notebook_wrap .timeline-odonto-item .timeline-panel {
        float: none !important;
        width: calc(100% - 36px);
        margin-left: 36px;
        padding: .65rem;
    }

    #pp_notebook_wrap .timeline-odonto-item .timeline-header {
        align-items: flex-start;
        flex-wrap: wrap;
        gap: .35rem;
    }

    #pp_notebook_wrap .timeline-odonto-item .timeline-date {
        white-space: normal;
    }

    #pp_notebook_wrap .financeiro-filtros .row,
    #pp_notebook_wrap .financeiro-resumo .resumo-row {
        --bs-gutter-x: .75rem !important;
        --bs-gutter-y: .75rem !important;
        margin-inline: 0 !important;
    }

    #pp_notebook_wrap .financeiro-filtros .row > [class^="col-"],
    #pp_notebook_wrap .financeiro-filtros .row > [class*=" col-"],
    #pp_notebook_wrap .financeiro-resumo .resumo-row > [class^="col-"],
    #pp_notebook_wrap .financeiro-resumo .resumo-row > [class*=" col-"] {
        width: 100% !important;
        padding-inline: .375rem !important;
    }

    #pp_notebook_wrap .financeiro-filtros .fin-actions,
    #pp_notebook_wrap .financeiro-filtros .fin-toggles {
        width: 100%;
        display: flex;
        flex-wrap: wrap;
        gap: .4rem;
        margin-left: 0 !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    #sidebar {
        transition: none;
    }
}

/* O log pode conter JSON, URLs e identificadores sem espaços. */
.siso-audit-log,
.siso-audit-log .panel-body,
.siso-audit-log table,
.siso-audit-log .siso-audit-value {
    min-width: 0;
    max-width: 100%;
}

.siso-audit-log .siso-audit-value {
    white-space: pre-wrap;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.siso-audit-log .siso-audit-record,
.siso-audit-log .siso-audit-operation {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .25rem;
    min-width: 0;
}

@media (max-width: 991.98px) {
    .siso-audit-log .panel-body {
        padding: .5rem !important;
        overflow-x: visible !important;
    }

    .siso-audit-log table.siso-mobile-card-table > tbody > tr > td {
        grid-template-columns: minmax(5.75rem, 34%) minmax(0, 1fr);
    }

    .siso-audit-log table.siso-mobile-card-table .badge {
        max-width: 100%;
        white-space: normal;
        overflow-wrap: anywhere;
    }

    /* A tabela de aditivos é inserida depois dentro de uma linha expansível. */
    #form_orcamentos tr.orc-aditivos-expander {
        width: 100% !important;
        margin-top: -.45rem !important;
        padding: 0 !important;
        border-top: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    #form_orcamentos tr.orc-aditivos-expander > td {
        display: block !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        padding: .35rem !important;
        border: 0 !important;
    }

    #form_orcamentos tr.orc-aditivos-expander > td::before {
        display: none !important;
    }

    #form_orcamentos .orc-aditivos-box,
    #form_orcamentos .siso-orc-aditivos-wrapper,
    #form_orcamentos .siso-orc-aditivos-table {
        display: block;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        overflow: visible !important;
    }

    #form_orcamentos .siso-orc-aditivos-table > tbody > tr {
        display: flex !important;
        flex-direction: column;
        width: 100% !important;
        border-left: 3px solid var(--bs-info) !important;
        margin-bottom: .55rem !important;
    }

    #form_orcamentos .siso-orc-aditivos-table > tbody > tr > td {
        display: grid !important;
        grid-template-columns: minmax(6.5rem, 38%) minmax(0, 1fr);
        align-items: center;
        gap: .65rem;
        order: 10;
    }

    #form_orcamentos .siso-orc-aditivos-table > tbody > tr > td::before {
        content: attr(data-label);
        color: var(--bs-secondary-color);
        font-size: .75rem;
        font-weight: 700;
        line-height: 1.25;
        text-transform: uppercase;
    }

    #form_orcamentos .siso-orc-aditivos-table > tbody > tr > .siso-mobile-card-primary {
        order: 0;
    }

    #form_orcamentos .siso-orc-aditivos-table > tbody > tr > .siso-mobile-actions {
        order: 1;
    }

    #form_orcamentos .siso-orc-aditivos-table > tbody > tr > td,
    #form_orcamentos .siso-orc-aditivos-table > tbody > tr > td[style] {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        white-space: normal !important;
        text-align: left !important;
    }

    #form_orcamentos .siso-orc-aditivos-table .acoes,
    #form_orcamentos .siso-orc-aditivos-table .assinaturas-box-inline {
        display: flex !important;
        flex-wrap: wrap !important;
        align-items: center;
        gap: .35rem;
        width: 100%;
        min-width: 0;
    }

    #form_orcamentos .siso-orc-aditivos-table .btn,
    #form_orcamentos .siso-orc-aditivos-table .dropdown,
    #form_orcamentos .siso-orc-aditivos-table .btn-group {
        max-width: 100%;
    }
}
