/* MarcandoConsulta - Responsividade para tablets e celulares */

@media (max-width: 1199.98px) {
    .card-body {
        padding: 1rem;
    }

    .table > :not(caption) > * > * {
        padding: .65rem .75rem;
    }
}

@media (max-width: 991.98px) {
    body {
        overflow-x: hidden;
    }

    .d-flex:has(> #sidebar) {
        min-height: 100vh;
    }

    #sidebar {
        width: min(82vw, 300px);
        max-width: 300px;
        transform: translateX(-100%);
        box-shadow: 18px 0 42px rgba(15, 23, 42, .24);
    }

    #sidebar:not(.d-none) {
        transform: translateX(0);
    }

    #sidebar.sidebar-collapsed {
        width: min(82vw, 300px);
    }

    #sidebar.sidebar-collapsed .sidebar-text {
        display: inline !important;
    }

    #sidebar.sidebar-collapsed .nav-link {
        justify-content: flex-start;
        font-size: .9rem;
    }

    #sidebar.sidebar-collapsed .nav-link i {
        margin-right: .5rem !important;
    }

    #sidebar .sidebar-collapse-btn {
        display: none;
    }

    header.navbar {
        position: sticky;
        top: 0;
        z-index: 1030;
        padding: .65rem .85rem !important;
    }

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

    main {
        padding: 1rem !important;
    }

    footer {
        padding-left: 1rem;
        padding-right: 1rem;
    }

    .row.g-4 {
        --bs-gutter-y: 1rem;
    }

    .row.g-3 {
        --bs-gutter-y: .85rem;
    }

    .card {
        border-radius: 10px;
    }

    .clinical-page-header {
        padding: .9rem;
        border-radius: 12px;
    }

    .clinical-page-header > .d-flex:last-child,
    .clinical-page-header > a:last-child {
        width: 100%;
    }

    .clinical-header-btn {
        width: 100%;
        justify-content: center;
    }

    .card-header {
        padding: .85rem 1rem !important;
    }

    .nav-tabs {
        display: flex;
        overflow-x: auto;
        overflow-y: hidden;
        flex-wrap: nowrap;
        gap: .25rem;
        padding-bottom: .25rem;
        scrollbar-width: thin;
    }

    .nav-tabs .nav-item {
        flex: 0 0 auto;
    }

    .nav-tabs .nav-link {
        white-space: nowrap;
        font-size: .85rem;
        padding: .55rem .75rem;
    }

    .table-responsive {
        border-radius: 10px;
    }

    .table {
        min-width: 720px;
    }

    .modal-dialog {
        margin: .75rem;
    }

    .modal-content {
        border-radius: 12px;
    }

    .btn {
        min-height: 38px;
    }
}

@media (max-width: 767.98px) {
    h1, .h1 { font-size: 1.75rem; }
    h2, .h2 { font-size: 1.45rem; }
    h3, .h3 { font-size: 1.25rem; }
    h4, .h4 { font-size: 1.12rem; }

    .page-header,
    .d-flex.justify-content-between.align-items-center.mb-4 {
        align-items: flex-start !important;
        flex-direction: column;
        gap: .75rem;
    }

    .d-flex.justify-content-between.align-items-center.mb-4 > .d-flex,
    .d-flex.justify-content-between.align-items-center.mb-4 > a,
    .d-flex.justify-content-between.align-items-center.mb-4 > button {
        width: 100%;
    }

    .d-flex.justify-content-between.align-items-center.mb-4 .btn {
        width: 100%;
        justify-content: center;
    }

    .btn-group,
    .btn-toolbar {
        flex-wrap: wrap;
    }

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

    .form-control,
    .form-select,
    .input-group-text,
    .btn {
        font-size: .92rem;
    }

    .input-group {
        flex-wrap: nowrap;
    }

    .input-group.mobile-stack,
    .input-group:has(.btn:nth-child(3)) {
        flex-wrap: wrap;
        gap: .5rem;
    }

    .input-group.mobile-stack > *,
    .input-group:has(.btn:nth-child(3)) > * {
        width: 100% !important;
        flex: 1 1 100% !important;
        border-radius: 8px !important;
    }

    .alert {
        align-items: flex-start !important;
        font-size: .9rem;
    }

    .dropdown-menu {
        font-size: .9rem;
    }

    .kpi-number {
        font-size: 1.55rem;
    }

    .portal-navbar .container-fluid {
        align-items: flex-start;
        gap: .75rem;
    }

    .portal-navbar .brand {
        max-width: calc(100vw - 96px);
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .portal-navbar .d-none.d-md-flex {
        order: 3;
        display: flex !important;
        width: 100%;
        overflow-x: auto;
        gap: .35rem !important;
        padding-top: .35rem;
    }

    .portal-nav-link {
        flex: 0 0 auto;
        white-space: nowrap;
    }

    .portal-card {
        border-radius: 12px;
    }
}

@media (max-width: 575.98px) {
    main {
        padding: .75rem !important;
    }

    header.navbar {
        padding: .55rem .7rem !important;
    }

    header.navbar .btn {
        padding-left: .55rem;
        padding-right: .55rem;
    }

    .card-body {
        padding: .85rem;
    }

    .card-header {
        padding: .75rem .85rem !important;
    }

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

    .col-6 {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .table {
        min-width: 640px;
        font-size: .85rem;
    }

    .table th {
        font-size: .72rem;
    }

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

    .modal-body,
    .modal-header,
    .modal-footer {
        padding: .85rem;
    }

    .modal-footer {
        flex-direction: column;
        align-items: stretch;
    }

    .modal-footer .btn {
        width: 100%;
    }

    .toast-container,
    #chatToastContainer {
        left: .5rem !important;
        right: .5rem !important;
        bottom: .5rem !important;
        padding: 0 !important;
    }

    .toast {
        width: 100%;
        min-width: 0 !important;
    }

    a[href^="https://wa.me"] {
        width: 38px !important;
        height: 38px !important;
        right: 14px !important;
        bottom: 14px !important;
    }
}