/*# sourceMappingURL=custom.min.css.map */

/* ============================================
   HORÁRIOS DISPONÍVEIS - RESPONSIVO HORIZONTAL
   ============================================ */
#horarios-disponiveis-container,
.horarios-disponiveis-container-varios {
    margin-top: 0.5rem;
    padding: 0.75rem;
    background-color: #f8f9fa;
    border-radius: 0.375rem;
    border: 1px solid #dee2e6;
    width: 100%;
    box-sizing: border-box;
}

#horarios-disponiveis-lista,
.horarios-disponiveis-lista-varios {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    gap: 0.5rem;
    overflow-x: hidden;
    overflow-y: hidden;
    padding-bottom: 0.5rem;
    width: 100%;
    box-sizing: border-box;
    position: relative;
}

.horario-disponivel-btn,
.horario-disponivel-btn-varios {
    font-size: 0.8125rem;
    padding: 0.625rem 1rem;
    white-space: nowrap;
    text-align: center;
    transition: all 0.2s ease;
    border-radius: 0.5rem;
    font-weight: 500;
    min-width: 130px;
    flex-shrink: 0;
    cursor: pointer;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.horario-disponivel-btn:hover,
.horario-disponivel-btn-varios:hover {
    transform: translateY(-1px);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.horario-disponivel-btn.btn-primary,
.horario-disponivel-btn-varios.btn-primary,
.horario-disponivel-btn.active,
.horario-disponivel-btn-varios.active,
.horario-disponivel-btn.btn-primary.active,
.horario-disponivel-btn-varios.btn-primary.active,
button.horario-disponivel-btn.btn-primary,
button.horario-disponivel-btn-varios.btn-primary,
button.horario-disponivel-btn.active,
button.horario-disponivel-btn-varios.active {
    background-color: #0d6efd !important;
    border-color: #0d6efd !important;
    color: #fff !important;
    box-shadow: 0 0 0 0.2rem rgba(13, 110, 253, 0.25) !important;
    font-weight: 600 !important;
}

.horario-disponivel-btn.btn-primary:hover,
.horario-disponivel-btn-varios.btn-primary:hover,
.horario-disponivel-btn.active:hover,
.horario-disponivel-btn-varios.active:hover {
    background-color: #0b5ed7 !important;
    border-color: #0a58ca !important;
    transform: translateY(-1px);
    box-shadow: 0 0 0 0.2rem rgba(13, 110, 253, 0.35);
}

/* Mobile - Telas pequenas (até 576px) */
@media (max-width: 575.98px) {
    #horarios-disponiveis-container,
    .horarios-disponiveis-container-varios {
        padding: 0.5rem;
        margin-left: -0.5rem;
        margin-right: -0.5rem;
        width: calc(100% + 1rem);
    }
    
    #horarios-disponiveis-lista,
    .horarios-disponiveis-lista-varios {
        gap: 0.5rem;
    }
    
    .horario-disponivel-btn,
    .horario-disponivel-btn-varios {
        font-size: 0.75rem;
        padding: 0.5rem 0.75rem;
        min-width: 100px;
    }
}

/* Tablet - Telas médias (576px a 768px) */
@media (min-width: 576px) and (max-width: 767.98px) {
    #horarios-disponiveis-container,
    .horarios-disponiveis-container-varios {
        margin-left: -0.75rem;
        margin-right: -0.75rem;
        width: calc(100% + 1.5rem);
    }
    
    #horarios-disponiveis-lista,
    .horarios-disponiveis-lista-varios {
        gap: 0.625rem;
    }
    
    .horario-disponivel-btn,
    .horario-disponivel-btn-varios {
        font-size: 0.78125rem;
        padding: 0.5625rem 0.875rem;
        min-width: 115px;
    }
}

/* Desktop pequeno - Telas grandes (768px a 992px) */
@media (min-width: 768px) and (max-width: 991.98px) {
    #horarios-disponiveis-container,
    .horarios-disponiveis-container-varios {
        margin-left: -1rem;
        margin-right: -1rem;
        width: calc(100% + 2rem);
    }
    
    .horario-disponivel-btn,
    .horario-disponivel-btn-varios {
        min-width: 125px;
    }
}

/* Desktop - Telas muito grandes (992px+) */
@media (min-width: 992px) {
    #horarios-disponiveis-container,
    .horarios-disponiveis-container-varios {
        margin-left: -1rem;
        margin-right: -1rem;
        width: calc(100% + 2rem);
    }
    
    .horario-disponivel-btn,
    .horario-disponivel-btn-varios {
        font-size: 0.875rem;
        padding: 0.6875rem 1.125rem;
        min-width: 140px;
    }
}

/* Botões de navegação de horários */
.btn-horario-prev,
.btn-horario-next,
.btn-horario-prev-varios,
.btn-horario-next-varios {
    min-width: 40px;
    width: 40px;
    padding: 0.375rem 0.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

.btn-horario-prev i,
.btn-horario-next i,
.btn-horario-prev-varios i,
.btn-horario-next-varios i {
    font-size: 1.2rem;
}

.btn-horario-prev:disabled,
.btn-horario-next:disabled,
.btn-horario-prev-varios:disabled,
.btn-horario-next-varios:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}
.clickable-col.selected {
    border-top: 3px solid #4f98cf;
    /* Altere para a cor desejada */
}

.bg-purple {
    background-color: #6f42c1 !important;
}

/* Classes para status pedido_reserva */
.text-purple {
    color: #6610f2 !important;
}

.badge-soft-purple {
    background-color: rgba(102, 16, 242, 0.1) !important;
    color: #6610f2 !important;
}

.badge-purple {
    background-color: #6610f2 !important;
    color: white !important;
}

.bg-darkorange {
    background-color: darkorange;
}

.bg-orange {
    background-color: orange;
}

.bg-darkblue {
    background-color: darkblue;
    ;
}

.bg-lightblue {
    background-color: lightblue;
}

.bg-green {
    background-color: green;
}

.clickable-col {
    border-top: 3px solid #ffffff;
    /* Altere para a cor desejada */
}

.fc-col-header-cell-cushion {
    color: #ffffff !important;
}

.clickable-col {
    cursor: pointer;
}

.clickable-col:not(.selected):hover {
    border-top: 3px solid #00aaff;
    /* Altere para a cor desejada */
    background-color: #f0f0f07a;
    /* Altere para a cor desejada */
}

#rateioInfo .titles {
    font-size: 15px;
    color: #747373;
}

#rateioInfo .values {
    font-size: 25px;
    font-weight: bold;
    color: #000000;
}

.modal-content {
    overflow-y: auto;
    /* Permite a rolagem se o conteúdo for muito grande */
}

.item-cc-remove:hover {
    color: #FFF;
    background-color: #f06548;
}

.dropdown-menu {
    position: relative;
    padding-bottom: 40px;
    /* Espaço para o botão */
}

#openModalConfiguracoes {
    position: absolute;
    bottom: 0;
    left: 0;
}

.input-error {
    border: 1px solid red;
}

.bootstrap-select .dropdown-menu {
    overflow: visible !important;
}

.valor_amostragem {
    display: block;
    font-weight: bold;
}

.dropup+.bootstrap-select .dropdown-menu {
    position: absolute;
    z-index: 1060;
    /* Ou um número maior que o z-index do modal */
}

.swal2-popup {
    width: 90% !important;
    /* Adaptativo para telas menores */
    max-width: 800px !important;
    /* Um máximo para telas maiores */
}

/* Sobrescrever o estilo do tooltip para o Bootstrap 5 */
.tooltip .tooltip-inner {
    background-color: #299cdb !important;
    /* Cor de fundo */
    color: #fff !important;
    /* Cor do texto */
}

.tooltip .arrow::before {
    border-color: transparent !important;
    /* Transparência para as bordas da seta */
}

.tooltip.bs-tooltip-top .arrow::before,
.tooltip.bs-tooltip-auto[x-placement^="top"] .arrow::before {
    border-top-color: #299cdb !important;
    /* Cor da seta para tooltips no topo */
}

.tooltip.bs-tooltip-right .arrow::before,
.tooltip.bs-tooltip-auto[x-placement^="right"] .arrow::before {
    border-right-color: #299cdb !important;
    /* Cor da seta para a direita */
}

.tooltip.bs-tooltip-bottom .arrow::before,
.tooltip.bs-tooltip-auto[x-placement^="bottom"] .arrow::before {
    border-bottom-color: #299cdb !important;
    /* Cor da seta para baixo */
}

.tooltip.bs-tooltip-left .arrow::before,
.tooltip.bs-tooltip-auto[x-placement^="left"] .arrow::before {
    border-left-color: #299cdb !important;
    /* Cor da seta para a esquerda */
}

.timeline-2 .timeline-year p {
    background-color: #4E98D2 !important;
    color: #fff !important;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
}

.timeline-2::after {
    background: #4E98D2 !important;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
}

.timeline-2 .timeline-date::after {
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
}

.timeline-2 .timeline-box {
    width: 100% !important;
    max-width: 90% !important;
}

.timeline-2 .timeline-box .timeline-text {
    width: 100% !important;
}

.timeline-2::after {
    height: 100% !important;
}

#today {
    max-height: calc(100vh - 350px);
    overflow-y: auto;
    overflow-x: hidden;
}

#crescimento-timeline {
    max-height: 650px;
    overflow-y: auto;
    overflow-x: hidden;
}

.navbar-menu .navbar-nav .nav-link[data-bs-toggle=collapse][aria-expanded=true] {
    color: #4f98cf;
}

.navbar-menu .navbar-nav .nav-link:hover {
    color: #4f98cf;
}

[data-layout=horizontal] .navbar-menu .navbar-nav .nav-sm .nav-link:hover,
[data-layout=horizontal] .navbar-menu .navbar-nav .nav-sm .nav-link.active {
    color: #4f98cf;
}

.thumbnail-container {
    padding: 5px;
    border: 1px solid #ddd;
    border-radius: 4px;
    margin-bottom: 10px;
    text-align: center;
}

.thumbnail-container img {
    width: 100%;
    height: auto;
    max-height: 120px;
    /* Adjust as needed */
}

.thumbnail-actions {
    list-style: none;
    padding: 0;
    margin-top: 5px;
    display: flex;
    justify-content: center;
    gap: 10px;
}

.thumbnail-actions a {
    text-decoration: none;
    color: inherit;
}



.select2-container .select2-selection--single {
    height: calc(2.25rem + 2px) !important;
    /* Altura padrão do select do Bootstrap 5 */
    padding: 0.375rem 0.75rem !important;
    /* Padding padrão do select do Bootstrap 5 */
    border: 1px solid #ced4da !important;
    /* Borda padrão do select do Bootstrap 5 */
    border-radius: 0.25rem !important;
    /* Border radius padrão do select do Bootstrap 5 */
    background-color: #fff !important;
    /* Fundo padrão do select do Bootstrap 5 */
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 2.25rem !important;
    /* Alinhamento vertical do texto */
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: calc(2.25rem + 2px) !important;
    /* Altura do botão de dropdown */
    right: 0.75rem;
    /* Ajuste da posição do botão de dropdown */
}

.select2-results__option[aria-selected="true"] {
    background-color: #dcdcdc !important;
    /* Cinza mais claro para item selecionado */
    color: #000;
    /* Cor do texto */
}

.select2-results__option--highlighted[aria-selected] {
    background-color: #c0c0c0 !important;
    /* Cinza um pouco mais escuro para item em foco */
    color: #000;
    /* Cor do texto */
}

.select2-result-repository {
    display: flex !important;
    align-items: center !important;
    padding: 5px !important;
}

.select2-result-repository__avatar {
    flex: 0 0 50px !important;
}

.select2-result-repository__avatar img {
    width: 100% !important;
    height: auto !important;
    border-radius: 50% !important;
}

.select2-result-repository__details {
    flex: 1 !important;
    padding-left: 10px !important;
}

.select2-result-repository__title {
    font-weight: bold !important;
    margin-bottom: 3px !important;
}

.select2-result-repository__meta {
    display: flex !important;
    flex-wrap: wrap !important;
    font-size: 0.875em !important;
    color: #6c757d !important;
}

.select2-result-repository__meta div {
    margin-right: 10px !important;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 28px !important;
}

.select2-results__option.cadastrar-novo {
    background-color: #0ab39c !important;
    /* Cor de sucesso do Bootstrap */
    color: #fff !important;
    /* Texto branco */
    font-weight: bold !important;
    text-align: center !important;
    padding: 5px !important;
    cursor: pointer !important;
}

.select2-results__option.cadastrar-novo:hover {
    background-color: #0ab39c !important;
    /* Cor de sucesso mais escura ao passar o mouse */
}


.badge-custom {
    display: inline-block;
    padding: 0.25em 0.4em;
    font-size: 75%;
    font-weight: 700;
    line-height: 1;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: 0.375rem;
    margin-right: 0.5rem;
    /* Adicionando estilo de borda personalizada */
    border: 1px solid rgba(0, 0, 0, 0.1);
}

.select2-container--open .select2-dropdown {
    z-index: 99999 !important;
}

/* Garante que o dropdown seja exibido acima da tabela */
.custom-dropdown .dropdown-menu {
    z-index: 1050;
    /* Valor alto para garantir que o dropdown fique acima de outros elementos */
    position: absolute !important;
    /* Garantir que o dropdown seja absoluto */
}

/* Define o botão para ter um z-index alto */
.custom-dropdown .dropdown-toggle {
    z-index: 1049;
    /* Um pouco abaixo do dropdown para evitar sobreposição de itens */
}

/* Ajustes para manter o dropdown dentro da viewport */
.custom-dropdown {
    position: relative;
    overflow: visible;
}

.table-responsive {
    overflow: visible;
    /* Torna a tabela visível para permitir que o dropdown apareça sobre ela */
}

.menu-rastreabilidade {
    width: 25em !important;
}

.table-modal-custom {
    overflow-x: auto;
    white-space: nowrap;
}

.table-modal-custom th,
.table-modal-custom td {
    white-space: nowrap;
}

.table-modal-custom td {
    vertical-align: middle;
}

.profile-project-card.profile-project-aberto {
    border-left-color: rgba(10, 179, 156, 0.7) !important;
}

.profile-project-card.profile-project-em_andamento {
    border-left-color: rgba(0, 0, 139, 0.7) !important;
}

.profile-project-card.profile-project-nao_compareceu {
    border-left-color: rgba(255, 0, 0, 0.7) !important;
}

.profile-project-card.profile-project-finalizado {
    border-left-color: rgba(0, 128, 0, 0.7) !important;
}

.profile-project-card.profile-project-cancelado_paciente {
    border-left-color: rgba(255, 165, 0, 0.7) !important;
}

.profile-project-card.profile-project-cancelado_profissional {
    border-left-color: rgba(255, 140, 0, 0.7) !important;
}

.profile-project-card.profile-project-falta_justificada {
    border-left-color: rgba(139, 0, 139, 0.7) !important;
}


.text-aberto {
    color: rgba(10, 179, 156, 0.7) !important;
}

.text-em_andamento {
    color: rgba(0, 0, 139, 0.7) !important;
}

.text-nao_compareceu {
    color: rgba(255, 0, 0, 0.7) !important;
}

.text-finalizado {
    color: rgba(0, 128, 0, 0.7) !important;
}

.text-cancelado_paciente {
    color: rgba(255, 165, 0, 0.7) !important;
}

.text-cancelado_profissional {
    color: rgba(255, 140, 0, 0.7) !important;
}

.text-falta_justificada {
    color: rgba(139, 0, 139, 0.7) !important;
}

.table-secondary {
    background-color: #f8f9fa !important;
    /* Cor cinza clara */
    opacity: 0.6;
    /* Deixa a linha um pouco transparente */
}

.campo-btn:not(.modelo-oftalmologia-btn) {
    width: 140px;
    height: 140px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 10px;
    border: none;
    background-color: #f8f9fa;
    border-radius: 8px;
    position: relative;
    transition: background-color 0.2s, transform 0.2s;
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
}

.campo-btn:not(.modelo-oftalmologia-btn) img {
    max-width: 90px;
    max-height: 90px;
    margin-bottom: 8px;
}

.campo-btn:not(.modelo-oftalmologia-btn) span {
    font-size: 14px;
    color: #333;
    margin-top: 6px;
}

.campo-btn:not(.modelo-oftalmologia-btn):hover {
    background-color: #e2e6ea;
    transform: scale(1.05);
}

.campo-btn:not(.modelo-oftalmologia-btn):hover .icon-plus {
    opacity: 1;
}

.icon-plus {
    position: absolute;
    bottom: 8px;
    left: 8px;
    font-size: 20px;
    color: #4f98cf;
    opacity: 0;
    transition: opacity 0.2s;
}

@media (max-width: 768px) {
    .campo-btn {
        width: 100px;
        height: 100px;
    }

    .campo-btn img {
        max-width: 60px;
        max-height: 60px;
    }

    .campo-btn span {
        font-size: 12px;
    }

    .icon-plus {
        font-size: 16px;
        bottom: 6px;
        left: 6px;
    }
}


/* Estilos personalizados para o collapse */

.custom-collapse {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    background-color: #f8f9fa;
    cursor: pointer;
    font-size: 16px;
    transition: background-color 0.3s;
}

.custom-collapse i {
    color: #393d42;
}

.custom-collapse:hover {
    background-color: #f1f3f5;
}

.custom-switch {
    display: flex;
    align-items: center;
    gap: 10px;
}

/* Conteúdo do Collapse */
.collapse-content {
    padding: 15px;
    border: 1px solid #e0e0e0;
    border-top: none;
    border-radius: 0 0 8px 8px;
}

/* Título personalizado */
.custom-title {
    color: #393d42;
    display: flex;
    align-items: center;
    gap: 5px;
}

/* Estilos exclusivos para .modelo-oftalmologia-btn */
.modelo-oftalmologia-btn {
    background: none;
    border: none;
    padding: 0;
    margin: 10px 0;
    width: 100%;
    /* Faz o botão ocupar toda a largura do contêiner */
    max-width: 600px;
    /* Define um limite de largura para evitar que fiquem exageradamente grandes */
}

.modelo-oftalmologia-btn img {
    width: 70%;
    height: auto;
    display: block;
    border-radius: 8px;
    /* Cantos arredondados (opcional) */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    /* Sombras para dar destaque */
    transition: transform 0.2s;
    /* Animação suave ao passar o mouse */
}

.modelo-oftalmologia-btn img:hover {
    transform: scale(1.03);
    /* Efeito de zoom leve ao passar o mouse */
}


/* Ajustes de responsividade para telas menores */
@media (max-width: 768px) {
    .custom-collapse {
        padding: 8px;
        font-size: 14px;
        flex-direction: column;
        /* Coloca os itens em coluna para telas menores */
        align-items: flex-start;
    }

    .custom-title {
        font-size: 14px;
        gap: 3px;
    }

    .custom-switch {
        margin-top: 8px;
        /* Dá espaço entre o título e o switch em telas menores */
        gap: 5px;
    }

    .collapse-content {
        padding: 10px;
    }
}

.flatpickr-day.disponibilidade-verde {
    border-bottom: 3px solid #4CAF50 !important;
    /* Borda verde */
    border-top: 0.1em solid #4CAF5070 !important;
    /* Borda verde */
    border-left: 0.1em solid #4CAF5070 !important;
    /* Borda verde */
    border-right: 0.1em solid #4CAF5070 !important;
    /* Borda verde */
}

.flatpickr-day.disponibilidade-amarelo {
    border-bottom: 3px solid #f9f505 !important;
    /* Borda amarela */
    border-top: 0.1em solid #f9f50570 !important;
    /* Borda amarela */
    border-left: 0.1em solid #f9f50570 !important;
    /* Borda amarela */
    border-right: 0.1em solid #f9f50570 !important;
    /* Borda amarela */
}

.flatpickr-day.disponibilidade-laranja {
    border-bottom: 3px solid #FF9800 !important;
    /* Borda laranja */
    border-top: 0.1em solid #FF980070 !important;
    /* Borda laranja */
    border-left: 0.1em solid #FF980070 !important;
    /* Borda laranja */
    border-right: 0.1em solid #FF980070 !important;
    /* Borda laranja */
}

.flatpickr-day.disponibilidade-vermelho {
    border-bottom: 3px solid #F44336 !important;
    /* Borda vermelha */
    border-top: 0.1em solid #f4433670 !important;
    /* Borda vermelha */
    border-left: 0.1em solid #f4433670 !important;
    /* Borda vermelha */
    border-right: 0.1em solid #f4433670 !important;
    /* Borda vermelha */
}

.flatpickr-day.disponibilidade-preto {
    border-bottom: 3px solid #000000 !important;
    /* Borda preta */
    border-top: 0.1em solid #00000070 !important;
    /* Borda preta */
    border-left: 0.1em solid #00000070 !important;
    /* Borda preta */
    border-right: 0.1em solid #00000070 !important;
    /* Borda preta */
}

/* Estilo personalizado para tooltips do calendário */
.tooltip-calendar.bs-tooltip-top .tooltip-inner {
    background-color: #333;
    /* Cor de fundo */
    color: #fff;
    /* Cor do texto */
    padding: 8px 12px;
    border-radius: 5px;
    font-size: 13px;
    max-width: 200px;
    text-align: center;
}

.ophthalmology-model-3 .card-header {
    background-color: #f9f9f9;
    border-bottom: 1px solid #dee2e6;
}

.ophthalmology-table {
    width: 100%;
    border-collapse: collapse;
    border-radius: 8px;
    overflow: hidden;
    border: 1px solid #dee2e6;
}

.ophthalmology-table th,
.ophthalmology-table td {
    padding: 8px;
    border: 1px solid #dee2e6;
}

.ophthalmology-table th {
    background-color: #f0f0f0;
    font-weight: bold;
    text-align: center;
    color: #333;
}

.ophthalmology-label {
    background-color: #e9ecef;
    font-weight: bold;
    text-align: center;
    color: #333;
    width: 15%;
}

.ophthalmology-table input[type="text"] {
    border: 1px solid #ced4da;
    border-radius: 4px;
    width: 100%;
    padding: 4px;
    box-shadow: none;
    text-align: center;
}

.ophthalmology-table input[type="text"]::placeholder {
    color: #6c757d;
    opacity: 0.7;
}

.ophthalmology-table thead th:first-child,
.ophthalmology-table tbody td:first-child {
    border-left: none;
}

.ophthalmology-table thead th:last-child,
.ophthalmology-table tbody td:last-child {
    border-right: none;
}

.ophthalmology-table tr:last-child td {
    border-bottom: none;
}

#fixedField {
    margin-bottom: 15px;
}

.text-status-usuarios {
    margin-inline-start: 4em !important;
}

.horizontal-timeline::before {
    background-color: #4E98D2 !important;
}

.item-slide-agendamentos-finalizados {
    cursor: pointer;
}

.item-slide-agendamentos-finalizados .timeline-content:hover {
    background-color: #fcfcfc;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.offcanvas-custom-width {
    width: 50% !important;
    /* Ajuste a largura conforme necessário */
}

.timelinedata-container {
    overflow-x: auto;
    /* Permite scroll horizontal */
    white-space: nowrap;
    /* Garante que os itens não quebrem de linha */
    padding: 20px;
    position: relative;
    border: 1px solid #ddd;
    border-radius: 10px;
    background-color: #fff;
}

.timelinedata {
    display: flex;
    align-items: center;
    /* Centraliza verticalmente as bolinhas */
    justify-content: flex-start;
    /* Inicia os itens à esquerda */
    position: relative;
    width: fit-content;
    /* Ajusta dinamicamente ao conteúdo */
}

.timelinedata-line {
    position: absolute;
    top: 0.6em;
    /* Centraliza a linha verticalmente em relação às bolinhas */
    left: 0;
    height: 2px;
    background-color: #4E98D2;
    z-index: 1;
    transform: translateY(-50%);
    width: 100%;
    /* Por padrão, cobre todo o conteúdo */
}

.timelinedata-items {
    display: flex;
    /* Garante o layout horizontal dos itens */
    position: relative;
    z-index: 2;
    /* Itens acima da linha */
}

.timelinedata-item {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    margin: 0 40px;
    /* Espaçamento ajustado entre as bolinhas */
}

.timelinedata-dot {
    width: 16px;
    height: 16px;
    background-color: #4E98D2;
    border-radius: 50%;
    /* Torna as bolinhas redondas */
    z-index: 3;
    /* Garante que a bolinha fique acima da linha */
}

.timelinedata-date {
    margin-top: 10px;
    font-size: 12px;
    color: #6c757d;
    white-space: nowrap;
}

/* Scrollbar customizado */
.timelinedata-container::-webkit-scrollbar {
    height: 8px;
}

.timelinedata-container::-webkit-scrollbar-thumb {
    background: #4E98D2;
    border-radius: 10px;
}

.timelinedata-container::-webkit-scrollbar-track {
    background: #f1f1f1;
}

.profile-user img {
    width: 15em;
    height: 15em;
}

.swal2-accordion-scroll {
    max-height: 70vh;
    overflow-y: auto;
}

/* Estilos para a escala de atendimento */
.day-column {
    border: 1px solid #ddd;
    border-radius: 4px;
    margin: 0 5px;
    padding: 10px;
    min-height: 250px;
}

.day-title {
    text-align: center;
    font-weight: bold;
    margin-bottom: 10px;
}

.day-slot {
    background-color: #f8f9fa;
}

.slot-time {
    font-weight: bold;
}

.slot-location {
    color: #666;
    font-size: 0.9rem;
}

.slot-actions .btn {
    font-size: 0.8rem;
}



/* Responsividade */
@media (max-width: 768px) {
    .timelinedata-date {
        font-size: 10px;
    }

    .timelinedata-dot {
        width: 12px;
        height: 12px;
    }

    .timelinedata-item {
        margin: 0 20px;
        /* Menor espaçamento em telas pequenas */
    }
}



/* Ajustes para telas muito pequenas (ex. smartphones) */
@media (max-width: 480px) {
    .custom-collapse {
        padding: 6px;
        font-size: 13px;
    }

    .custom-title {
        font-size: 13px;
    }

    .collapse-content {
        padding: 8px;
    }

}

@media (max-width: 600px) {
    .swal2-popup {
        width: 85% !important;
        /* Ainda mais adaptativo para telas muito pequenas */
    }
}

.lds-ellipsis {
    display: inline-block;
    position: relative;
    width: 80px;
    height: 80px;
}

.lds-ellipsis div {
    position: absolute;
    top: 33px;
    width: 13px;
    height: 13px;
    border-radius: 50%;
    background: #049dd4;
    animation-timing-function: cubic-bezier(0, 1, 1, 0);
}

.lds-ellipsis div:nth-child(1) {
    left: 8px;
    animation: lds-ellipsis1 0.6s infinite;
}

.lds-ellipsis div:nth-child(2) {
    left: 8px;
    animation: lds-ellipsis2 0.6s infinite;
}

.lds-ellipsis div:nth-child(3) {
    left: 32px;
    animation: lds-ellipsis2 0.6s infinite;
}

.lds-ellipsis div:nth-child(4) {
    left: 56px;
    animation: lds-ellipsis3 0.6s infinite;
}

@keyframes lds-ellipsis1 {
    0% {
        transform: scale(0);
    }

    100% {
        transform: scale(1);
    }
}

@keyframes lds-ellipsis3 {
    0% {
        transform: scale(1);
    }

    100% {
        transform: scale(0);
    }
}

@keyframes lds-ellipsis2 {
    0% {
        transform: translate(0, 0);
    }

    100% {
        transform: translate(24px, 0);
    }
}

.heartbeat {
    stroke: #049dd4;
    stroke-width: 2;
    fill: none;
    /* Aqui aumentamos a parte visível para 130px, deixando 94px como espaço (total aproximado de 224px) */
    stroke-dasharray: 150 94;
    animation: dash 1s linear infinite;
}

@keyframes dash {
    from {
        stroke-dashoffset: 0;
    }

    to {
        stroke-dashoffset: -224;
    }
}



/* O card que envolve a imagem */
#lista-trigger-points-card {
    /* Para centralizar horizontalmente usando flex */
    display: flex;
    justify-content: center;
    /* Se quiser também alinhar verticalmente, pode usar align-items: center; */
    /* ou, se preferir, pode usar text-align: center em um container block */
}

/* O contêiner que envolve a imagem e os pontos */
#container-trigger-points {
    position: relative;
    display: inline-block;
    /* Importante para que o posicionamento absoluto seja relativo a ele */
    max-width: 100%;
    /* Não ultrapassar a largura do container pai */
    text-align: center;
    /* Opcional, se quiser centralizar conteúdo interno */
}

/* A imagem do paciente */
#imagem-paciente {
    width: 100%;
    height: auto;
    display: block;
    max-width: 70em;
    margin: 0 auto;
}


/* Classe para os pontos vermelhos */
.ponto-dor {
    position: absolute;
    width: 10px;
    height: 10px;
    background-color: red;
    border-radius: 50%;
    cursor: pointer;
}

/* Ajusta o tamanho em telas menores */
@media (max-width: 768px) {
    .ponto-dor {
        width: 6px;
        height: 6px;
    }
}

/* Estilo dos dots coloridos no popover */
.popover .dot {
    font-size: 18px;
    margin-right: 5px;
}

.popover .opcao-cor {
    cursor: pointer;
    padding: 4px 8px;
}

.popover .opcao-cor:hover {
    background-color: #f0f0f0;
    border-radius: 4px;
}

.dot-legenda {
    width: 14px;
    height: 14px;
    border-radius: 50%;
    display: inline-block;
    border: 1px solid #999;
}

/* Estilo box-shadow para o container-trigger-points */
#container-trigger-points {
    box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
}

/* =========================
       Estilos Básicos da Timeline
       ========================= */
.timeline-trigger-points-slider {
    position: relative;
    padding: 5em 0;
    /* espaço vertical */
}

.timeline-trigger-points-slider::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    height: 2px;
    background: #eee;
    transform: translateY(-50%);
    z-index: 1;
}

/* Cada slide vira a "bolinha + label" */
.swiper-slide {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
    cursor: pointer;
}

.timeline-trigger-points-dot {
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background-color: #6c757d;
    border: 2px solid #fff;
    box-shadow: 0 0 0 2px #6c757d;
    z-index: 2;
}

.timeline-trigger-points-label {
    position: absolute;
    bottom: 100%;
    left: 50%;
    transform: translateX(-50%);
    margin-bottom: 8px;
    background-color: #20c997;
    color: #fff;
    border-radius: 4px;
    padding: 4px 8px;
    font-size: 0.8rem;
    white-space: nowrap;
}

/* Se quiser destacar o slide selecionado */
.swiper-slide.selected .timeline-trigger-points-dot {
    background-color: #4f98cf;
    box-shadow: 0 0 0 2px #6c757d;
}

.swiper-slide.selected .timeline-trigger-points-label {
    background-color: #4f98cf;
}

.loader-trigger-points {
    min-height: 50px;
    /* Ajuste a altura que você quer reservar */
    display: flex;
    align-items: center;
    justify-content: center;
}

.wizard-progress {
    position: relative;
    margin-bottom: 2rem;
}

.wizard-progress .progress-line {
    position: absolute;
    top: 20px;
    left: 0;
    right: 0;
    height: 2px;
    background-color: #e0e0e0;
    z-index: 0;
}

.step-indicator {
    position: relative;
    z-index: 1;
    flex: 1;
}

.step-indicator .circle-step {
    width: 40px;
    height: 40px;
    margin: 0 auto;
    border-radius: 50%;
    background-color: #d3d3d3;
    color: #fff;
    font-weight: bold;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 5px;
    transition: background-color 0.3s ease;
}

.step-indicator.active .circle-step,
.step-indicator.visited .circle-step {
    background-color: #049dd4;
}

.step-indicator small {
    color: #999;
}

.step-indicator.active small,
.step-indicator.visited small {
    color: #049dd4;
}

/* Linha progressiva preenchida */
.wizard-progress::before {
    content: '';
    position: absolute;
    top: 20px;
    left: 0;
    height: 2px;
    background-color: #049dd4;
    z-index: 1;
    transition: width 0.3s ease;
}

.wizard-progress::before {
    width: var(--wizard-line-fill, 0%);
}

.irs-bar,
.irs-bar-edge,
.irs-single {
    background: #049dd4 !important;
    /* Cor do progresso */
    border-color: #049dd4 !important;
}

.nivel-dor-display {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-top: 10px;
    font-size: 1.2rem;
}

.nivel-dor-display i {
    color: #049dd4;
}

.irs--round .irs-handle {
    border: 4px solid #049dd4 !important;
    box-shadow: 0 1px 3px #049dd49b;
}

.irs--round .irs-single:before {
    border-top-color: #049dd4 !important;
}

#medicamentosResultados {
    max-height: 300px;
    overflow-y: auto;
    border: 1px solid #dee2e6;
    border-radius: 4px;
}

.pulse-border {
    position: relative;
}

.pulse-border::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    height: 4px;
    width: 100%;
    border-radius: 2px;
    animation: pulseBorder 1.5s infinite;
    z-index: 1;
}

@keyframes pulseBorder {
    0% {
        transform: scaleX(1);
        opacity: 0.7;
    }

    50% {
        transform: scaleX(1.1);
        opacity: 1;
    }

    100% {
        transform: scaleX(1);
        opacity: 0.7;
    }
}

.resumo-triagem .card-title i {
    color: #049dd4;
}

.resumo-triagem ul li i {
    color: #049dd4;
    margin-right: 0.35rem;
}

.resumo-triagem .list-unstyled li {
    font-size: 1.05rem;
}

.resumo-triagem .card {
    min-height: 100%;
}

@media (min-width: 992px) {
    .resumo-triagem .equal-height {
        display: flex;
        gap: 1rem;
    }

    .resumo-triagem .equal-height>div {
        flex: 1;
    }
}

.vital-box {
    border: 2px solid #b1c5d8;
    border-radius: 12px;
    padding: 0.75rem 1rem;
    margin-bottom: 0.75rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 1.05rem;
    background: #fff;
}

.vital-box strong {
    font-weight: 600;
}

.vital-bar {
    width: 120px;
    height: 14px;
    border-radius: 20px;
    background-color: #ccc;
}

.vital-bar.normal {
    background-color: #28a745;
}

.vital-bar.alerta {
    background-color: #ffc107;
}

.vital-bar.critico {
    background-color: #dc3545;
}

.icon-vital {
    color: #049dd4;
    font-size: 1.25rem;
    margin-right: 0.5rem;
}

.card-vitais {
    background-color: #f9f9fb;
    border: 1px solid #dee2e6;
    padding: 1.5rem;
    border-radius: 10px;
}

.card-atendimento {
    cursor: pointer;
}

/* coloca no seu CSS */
body.modal-open {
    overflow: auto !important;
}

/* Container geral com borda arredondada e sombra */
.custom-accordionwithicon .accordion-button {
    font-weight: 500;
}

.custom-accordionwithicon .accordion-button:not(.collapsed) {
    background-color: #f1f1f1;
}

/* Corpo do modal: padding e scroll interno */
#iaResultModal .modal-body {
    max-height: 70vh;
    overflow-y: auto;
    padding: 1.5rem;
}

/* Títulos de seções */
.ia-section-title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 1.5rem;
}

/* Só quando a nav tiver nav-custom junto de nav-pills */
.nav-pills.nav-custom .nav-link {
    background-color: #f8f9fa;
    color: #6c757d;
    transition: background-color .2s, color .2s;
    border-bottom: 3px solid transparent;
}

.nav-pills.nav-custom .nav-link:hover {
    background-color: #e9ecef;
    color: #495057;
}

.nav-pills.nav-custom .nav-link.active {
    background-color: #09a18c !important;
    color: #fff !important;
    border-bottom-color: #068a78;
    box-shadow: 0 .25rem .5rem rgba(0, 0, 0, .1);
}


.ia-section-title h5 {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 600;
    border-bottom: 2px solid #4aa3df;
    padding-bottom: .25rem;
}

/* Bloco de texto completo */
#ia-full-text {
    margin-top: .5rem;
    padding: 1rem;
    background: #f8f9fa;
    border: 1px solid #ddd;
    border-radius: .25rem;
    white-space: pre-wrap;
    font-family: sans-serif;
    font-size: .95rem;
    line-height: 1.4;
}

/* Seções estruturadas: cada bloco */
.ia-section-body {
    margin-top: .5rem;
    padding: .75rem;
    background: #fff;
    border: 1px solid #ddd;
    border-radius: .25rem;
    font-size: .95rem;
    line-height: 1.4;
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

#certificadosDisponiveis {
    max-height: 200px;
    overflow-y: auto;
}

.expirado {
    color: #dc3545;
}

/* No início do seu CSS, importe a fonte Quendra */
@import url('https://fonts.googleapis.com/css2?family=Quendra&display=swap');

daai-consultation-recorder {
    /* 2. Cores do sistema SoulClinic */
    --recorder-primary-color: #0066CC;
    /* Azul principal SoulClinic */
    --recorder-secondary-color: #4F4F4F;
    /* Cinza escuro */
    --recorder-success-color: #28A745;
    /* Verde de sucesso */
    --recorder-support-color: #17A2B8;
    /* Azul turquesa de apoio */
    --recorder-disable-color: #6C757D;
    /* Cinza de elementos desabilitados */
    --recorder-error-color: #DC3545;
    /* Vermelho de erro */
    --recorder-transparent-color: rgba(0, 0, 0, 0.1);
    /* Transparência sutil */
    --recorder-background-color: #FFFFFF;
    /* Fundo branco */
    --recorder-border-color: #E0E0E0;
    /* Borda clara */

    /* 3. Estilo de bordas e tipografia */
    --recorder-button-radius: 4px;
    --recorder-border-radius: 4px;
    --recorder-text-color: #212529;
    /* Texto escuro */
    --recorder-border-button-color: #0066CC;
    /* Borda de botão */
    --recorder-font-family: 'Quendra', sans-serif;
    /* Fonte Quendra */

    /* 4. Animações de gravação */
    --recorder-animation-recording-color: #DC3545;
    /* Indicador vermelho */
    --recorder-animation-paused-color: #FFC107;
    /* Indicador amarelo */

    /* 5. Logos e imagens internas */
    --recorder-tutorial-image: url('/assets/images/logo_32.svg');
    --recorder-daai-logo-icon: url('/assets/images/logo_32.svg');

    /* 6. Tamanhos responsivos internos */
    --recorder-large-device-max-width: 100%;
    --recorder-large-device-min-width: 100%;
    --recorder-small-device-max-width: 500px;
    --recorder-small-device-min-width: 300px;
    --recorder-large-device-height: 52px;
    --recorder-small-device-height: 120px;
    --recorder-gap: 4px;
    --recorder-padding: 8px;

    /* 7. Layout interno */
    --recorder-align: center;
    --recorder-justify-large-size: space-between;
    --recorder-justify-small-size: center;
    --recorder-large-devices-direction: row;
    --recorder-small-devices-direction: column;

    /* 8. Posicionamento fixo no canto inferior esquerdo */
    position: fixed;
    bottom: clamp(1rem, 5vh, 2rem);
    left: clamp(1rem, 5vw, 2rem);
    z-index: 9999;

    /* 9. Largura adaptável para não ultrapassar a tela */
    max-width: 90%;
    width: auto;
}

@media (max-width: 600px) {
    daai-consultation-recorder {
        bottom: 1rem;
        left: 1rem;
        max-width: 95%;
    }
}

.session-timer {
    position: fixed;
    bottom: 20px;
    left: 20px;
    background: rgba(33, 37, 41, 0.85);
    backdrop-filter: blur(10px);
    color: #ddd;
    padding: 10px 14px;
    border-radius: 12px;
    font-family: sans-serif;
    font-size: 13px;
    display: none;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    transition: background 0.3s ease, color 0.3s ease, transform 0.3s ease;
    z-index: 1050;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    border: 1px solid rgba(255, 255, 255, 0.1);
    min-width: 80px;
}

.session-timer.blink {
    background: rgba(220, 53, 69, 0.95);
    color: #fff;
    animation: pulse-left 1s ease-in-out infinite;
    box-shadow: 0 4px 20px rgba(220, 53, 69, 0.4);
}

.session-timer .renew-btn {
    display: none;
    background: transparent;
    border: 1px solid #ddd;
    color: #ddd;
    padding: 2px 6px;
    font-size: 12px;
    border-radius: 4px;
    cursor: pointer;
    transition: background 0.2s ease, color 0.2s ease;
}

.session-timer.blink .renew-btn {
    display: inline-block;
}

.session-timer.blink .renew-btn:hover {
    background: #fff;
    color: #dc3545;
    border-color: #fff;
}


/* Estilo base para todos os cards de escala */
.day-slot .card {
    border: none;
    border-radius: 0.75rem;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
    transition: transform 0.2s, box-shadow 0.2s;
}

/* Elevation leve ao passar o mouse */
.day-slot .card:hover {
    transform: translateY(-3px);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
}

/* Tempo em destaque */
.slot-time {
    font-size: 0.95rem;
    color: #0d6efd;
    /* cor primária do Velzon/Bootstrap */
    margin-bottom: 0.25rem;
}

/* Local do atendimento, tom mais sutil */
.slot-location {
    font-size: 0.85rem;
    color: #6c757d;
    margin-bottom: 0.5rem;
}

/* Badge online menor e mais harmonioso */
.slot-online .badge {
    font-size: 0.7rem;
    padding: 0.25em 0.4em;
}

/* Botões de ação compactos */
.slot-actions .btn {
    padding: 0.25rem 0.5rem;
    font-size: 0.8rem;
}

/* Se quiser um destaque de cor para atendimento online, pode marcar o card todo */
.day-slot .badge.bg-success {
    /* aplica borda verde ao redor do card */
    border: 1px solid #198754;
}

.day-slot .card .badge.bg-success {
    /* ou se preferir, um border-left */
    border-left: 4px solid #198754;
}

/* Espaçamento interno do card-body */
.day-slot .card-body {
    padding: 0.75rem;
}

/* Card dia: só sombra e cantos arredondados */
.col-4 .card {
    border-radius: 1rem !important;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.05) !important;
}

/* Cada escala como item de lista: cantos arredondados e sombra leve */
.card-body .list-group-item {
    border: none !important;
    background: #fff !important;
    border-radius: .75rem !important;
    box-shadow: 0 1px 6px rgba(0, 0, 0, 0.04) !important;
    margin-bottom: .5rem !important;
    padding: .75rem 1rem !important;
    transition: background .2s, transform .2s !important;
}

.card-body .list-group-item:hover {
    background: #f8f9fa !important;
    transform: translateY(-2px) !important;
}

/* Horário em destaque */
.slot-time {
    color: var(--vz-primary) !important;
    font-weight: 600 !important;
    margin-bottom: .25rem !important;
}

/* Local do atendimento mais suave */
.slot-location {
    font-size: .875rem !important;
    color: #6c757d !important;
}

/* Botões dentro do item: pill e sombra suave */
.slot-actions .btn {
    border-radius: 1.5rem !important;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08) !important;
}

.card-header-soulclinic {
    background-color: #4f98cf !important;
    color: #fff !important;
}


/* Ajuste no botão de adicionar (canto arredondado maior) */
.card-header .addEscala {
    width: 2rem !important;
    height: 2rem !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

@keyframes pulse {
    0%,
    100% {
        transform: translateX(-50%) scale(1);
    }
    50% {
        transform: translateX(-50%) scale(1.05);
    }
}

@keyframes pulse-left {
    0%,
    100% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.05);
    }
}

@media (max-width: 576px) {
    .session-timer {
        font-size: 11px;
        padding: 8px 10px;
        left: 10px;
        bottom: 10px;
        min-width: 70px;
    }

    .session-timer .renew-btn {
        font-size: 10px;
        padding: 2px 4px;
    }
}

.custom-nav-container {
    background: rgba(255, 255, 255, 0.85);
    backdrop-filter: blur(10px);
    padding: 0.5rem 1rem;
    border-radius: 0.375rem;
}

/* Links padrão */
.custom-nav-container .nav-link {
    color: #6c757d;
    margin-right: 1rem;
    padding: 0.5rem 0;
    position: relative;
    transition: color 0.2s;
}

/* Hover */
.custom-nav-container .nav-link:hover {
    color: var(--bs-primary);
}

/* Aba ativa */
.custom-nav-container .nav-link.active {
    color: var(--bs-primary);
    font-weight: 500;
}

/* Indicador embaixo da aba ativa */
.custom-nav-container .nav-link.active::after {
    content: '';
    position: absolute;
    bottom: -0.25rem;
    left: 0;
    width: 100%;
    height: 3px;
    background: var(--bs-primary);
    border-radius: 2px;
}

#recorder {
    margin-bottom: 2.2em !important;
}

/* Estilos para select2 no plano alimentar */
.select2-container--default .select2-selection--single {
    height: 38px !important;
    border: 1px solid #ced4da !important;
    border-radius: 0.375rem !important;
    padding: 6px 12px !important;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    color: #495057 !important;
    line-height: 24px !important;
    padding-left: 0 !important;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 36px !important;
    right: 8px !important;
}

.select2-dropdown {
    border: 1px solid #ced4da !important;
    border-radius: 0.375rem !important;
    box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075) !important;
}

.select2-search--dropdown .select2-search__field {
    border: 1px solid #ced4da !important;
    border-radius: 0.25rem !important;
    padding: 8px 12px !important;
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
    background-color: #4f98cf !important;
}

/* Ajustes para múltiplos select2 */
.select2-container--default .select2-selection--multiple {
    border: 1px solid #ced4da !important;
    border-radius: 0.375rem !important;
    min-height: 38px !important;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice {
    background-color: #4f98cf !important;
    border: 1px solid #4f98cf !important;
    border-radius: 0.25rem !important;
    color: white !important;
    padding: 2px 8px !important;
    margin: 2px !important;
}

.food-select.select2-hidden-accessible+.select2-container {
    min-width: 350px !important;
    width: 100% !important;
    max-width: 600px;
}

.food-select {
    min-width: 350px !important;
    width: 100% !important;
    max-width: 600px;
}

.measure-select.select2-hidden-accessible+.select2-container {
    min-width: 180px !important;
    width: 100% !important;
    max-width: 350px;
}

.measure-select {
    min-width: 180px !important;
    width: 100% !important;
    max-width: 350px;
}

/* Melhoria visual para o container de alimentos */
.food-select {
    min-width: 200px !important;
}
/*
.select2-container {
    z-index: 1050 !important;
}
*/
/* Garante que o Select2 dropdown sempre fique acima dos modais */
.select2-dropdown {
    z-index: 9999 !important;
}

/* Garante que o Select2 container aberto tenha z-index alto */
.select2-container--open {
    z-index: 9999 !important;
}

/* Garante que o Select2 dropdown aberto tenha z-index alto */
.select2-container--open .select2-dropdown {
    z-index: 9999 !important;
}

/* Garantir que Select2 tenha a mesma largura que form-control */
.select2-container {
    width: 100% !important;
}

.select2-container--default .select2-selection--single {
    width: 100% !important;
}

/* 1.1) Garante overflow oculto em todos os wrappers do evento */
.fc .fc-timegrid-event-harness,
.fc .fc-timegrid-event,
.fc .fc-event {
    overflow: hidden !important;
}

/* 1.2) Volta a permitir quebra de linha dentro do main (pois o FullCalendar força nowrap) */
.fc .fc-timegrid-event .fc-event-main {
    white-space: normal !important;
}

/* 1.3) Opcional: melhora o comportamento de título e horário */
.fc .fc-timegrid-event .fc-event-time,
.fc .fc-timegrid-event .fc-event-title {
    display: block !important;
    white-space: normal !important;
}

/* 1.4) Seu container custom de várias linhas — corta o que passar de 4 linhas */
.fc-event-custom {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    line-clamp: 4;
    /* até 4 linhas, você ajusta esse número */
    overflow: hidden;
    /* corta o excesso */
    line-height: 1.1em;
    /* mesma altura de linha que você usou */
    font-size: 0.75em;
    /* conforme seu taste */
    margin-top: 2px;
    /* só um espacinho abaixo do título */
}


/* CSS plano alimentar para responsividade e visual dos blocos nutricionais e cards de dias */
.nutri-info {
    background: #f8f9fa;
    border-radius: 6px;
    padding: 6px 12px;
    min-width: 70px;
    text-align: center;
    font-size: 0.95em;
    margin-bottom: 2px;
  }
  .nutri-info .label {
    font-weight: 600;
    color: #666;
    display: block;
  }
  .nutri-info .value {
    font-size: 1.1em;
    color: #222;
    display: block;
  }
  @media (max-width: 768px) {
    .nutri-info { min-width: 50px; font-size: 0.85em; padding: 4px 6px; }
  }
  
  /* Estilos para botões de dias da semana */
  .btn-group-days {
    align-items: center;
  }
  
  .day-btn {
    border-radius: 0.375rem !important;
    padding: 0.5rem 1rem !important;
    font-weight: 500 !important;
    font-size: 0.875rem !important;
    min-width: 60px !important;
    transition: all 0.2s ease !important;
    text-transform: lowercase !important;
  }
  
  .day-btn:hover {
    transform: translateY(-1px) !important;
    box-shadow: 0 2px 4px rgba(0,0,0,0.15) !important;
  }
  
  .day-btn.btn-success {
    background-color: #198754 !important;
    border-color: #198754 !important;
    color: white !important;
  }
  
  .day-btn.btn-outline-success {
    background-color: transparent !important;
    border-color: #198754 !important;
    color: #198754 !important;
  }
  
  .day-btn.btn-outline-success:hover {
    background-color: #198754 !important;
    color: white !important;
  }
  
  #selectAllDays {
    border-radius: 0.375rem !important;
    padding: 0.5rem 1rem !important;
    font-weight: 500 !important;
    transition: all 0.2s ease !important;
  }
  
  #selectAllDays.btn-success {
    background-color: #198754 !important;
    border-color: #198754 !important;
    color: white !important;
  }
  
  #selectAllDays.btn-outline-success {
    background-color: transparent !important;
    border-color: #198754 !important;
    color: #198754 !important;
  }
  
  #selectAllDays:hover {
    transform: translateY(-1px) !important;
    box-shadow: 0 2px 4px rgba(0,0,0,0.15) !important;
  }
  
  /* Layout dos containers de dias */
  .d-flex.flex-column.gap-3 {
    align-items: flex-start !important;
  }
  
  /* Estilos para accordion de refeições */
  .meal-accordion {
    --bs-accordion-border-width: 0;
  }
  
  .meal-accordion .accordion-item {
    border: 1px solid #dee2e6 !important;
    border-radius: 0.5rem !important;
    margin-bottom: 1.5rem !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
    position: relative !important;
    overflow: visible !important;
  }
  
  .meal-accordion .accordion-header {
    position: relative !important;
  }
  
  .meal-accordion .accordion-button {
    background-color: #f8f9fa !important;
    border: none !important;
    color: #495057 !important;
    font-weight: 600 !important;
    padding: 1.2rem !important;
    border-radius: 0.5rem !important;
    position: relative !important;
    width: 100% !important;
  }
  
  .meal-accordion .accordion-button:not(.collapsed) {
    background-color: #e7f1ff !important;
    color: #0d6efd !important;
    border-bottom-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
  }
  
  .meal-accordion .accordion-button:focus {
    border-color: #86b7fe !important;
    box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25) !important;
  }
  
  .meal-accordion .accordion-button::after {
    margin-left: auto !important;
  }
  
  /* Botão de exclusão */
  .accordion-header .remove-meal {
    position: absolute !important;
    top: 50% !important;
    right: 1rem !important;
    transform: translateY(-50%) !important;
    z-index: 10 !important;
    border: 1px solid #dc3545 !important;
    background: rgba(255, 255, 255, 0.9) !important;
    color: #dc3545 !important;
    backdrop-filter: blur(3px) !important;
    transition: all 0.2s ease !important;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1) !important;
  }
  
  .accordion-header .remove-meal:hover {
    background: #dc3545 !important;
    color: white !important;
    transform: translateY(-50%) scale(1.05) !important;
    box-shadow: 0 4px 8px rgba(220, 53, 69, 0.3) !important;
  }
  
  /* Garantir que o botão não interfira no accordion */
  .accordion-header {
    position: relative !important;
  }
  
  /* Campos dentro do accordion body */
  .meal-time-input, .meal-name-input {
    border: 1px solid #ced4da !important;
    border-radius: 0.375rem !important;
    font-size: 0.875rem !important;
  }
  
  .meal-time-input:focus, .meal-name-input:focus {
    border-color: #86b7fe !important;
    box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25) !important;
  }
  
  .meal-accordion .accordion-body {
    padding: 1.5rem !important;
  }
  
  /* Badge contador de itens */
  .meal-items-count {
    font-size: 0.75rem !important;
    white-space: nowrap !important;
    margin-left: 0.5rem !important;
  }
  
  /* Handle do sortable */
  .handle {
    color: #6c757d !important;
    cursor: grab !important;
    font-size: 1.2rem !important;
    margin-right: 0.5rem !important;
  }
  
  .handle:active {
    cursor: grabbing !important;
  }
  
  /* Responsividade */
  @media (max-width: 768px) {
    .meal-accordion .accordion-button {
      font-size: 0.875rem !important;
      padding: 1rem 4rem 1rem 1rem !important;
    }
    
    .meal-accordion .accordion-body {
      padding: 1rem !important;
    }
    
    .d-flex.align-items-center.gap-3 {
      flex-direction: column !important;
      align-items: flex-start !important;
      gap: 0.5rem !important;
    }
    
    .accordion-header .remove-meal {
      right: 0.5rem !important;
      top: 1rem !important;
      transform: none !important;
      position: absolute !important;
    }
    
    .grafico {
      height: 200px !important;
    }
    
    .nested-list .list-group-item {
      padding: 0.75rem !important;
    }
    
    /* Responsividade para botões de dias */
    .btn-group-days {
      justify-content: center !important;
    }
    
    .day-btn {
      min-width: 50px !important;
      font-size: 0.8rem !important;
      padding: 0.4rem 0.8rem !important;
    }
    
    #selectAllDays {
      font-size: 0.875rem !important;
      padding: 0.4rem 0.8rem !important;
      width: 100% !important;
      max-width: 200px !important;
      margin: 0 auto !important;
    }
  }
  
  @media (max-width: 576px) {
    .btn-group-days {
      gap: 0.5rem !important;
    }
    
    .day-btn {
      min-width: 45px !important;
      font-size: 0.75rem !important;
      padding: 0.3rem 0.6rem !important;
    }
  }
  
  /* Estilos para contador de dias */
  #selectedDaysCount {
    font-weight: 500 !important;
    transition: all 0.3s ease !important;
  }
  
  #selectedDaysCount.text-danger {
    color: #dc3545 !important;
    font-weight: 600 !important;
  }
  
  #selectedDaysCount.text-success {
    color: #198754 !important;
    font-weight: 600 !important;
  }
  
  /* Animação para erro */
  .animate__shakeX {
    animation: shakeX 1s;
  }
  
  @keyframes shakeX {
    from, to {
      transform: translate3d(0, 0, 0);
    }
    10%, 30%, 50%, 70%, 90% {
      transform: translate3d(-10px, 0, 0);
    }
    20%, 40%, 60%, 80% {
      transform: translate3d(10px, 0, 0);
    }
  }
  
  /* Melhora o visual dos itens dentro do accordion */
  .nested-list .list-group-item {
    border: 1px solid #dee2e6 !important;
    border-radius: 0.375rem !important;
    margin-bottom: 0.75rem !important;
    padding: 1rem !important;
    background: #fafbfc !important;
    transition: all 0.2s ease !important;
  }
  
  .nested-list .list-group-item:hover {
    box-shadow: 0 2px 4px rgba(0,0,0,0.1) !important;
    background: white !important;
  }
  
  /* Melhora o visual do gráfico */
  .grafico {
    background: white !important;
    border-radius: 0.375rem !important;
  }
  
  /* Estilos para os cards dentro do accordion */
  .accordion-body .card {
    border: 1px solid #e9ecef !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.1) !important;
  }
  
  .accordion-body .card-header {
    background-color: #f8f9fa !important;
    border-bottom: 1px solid #e9ecef !important;
    padding: 0.75rem 1rem !important;
  }
  
  .accordion-body .card-body {
    padding: 1rem !important;
  }
  
  /* Melhora os títulos e labels */
  .accordion-body .fw-semibold {
    color: #495057 !important;
    font-size: 0.875rem !important;
  }
  
  /* Espaçamento melhor para o botão adicionar */
  .add-item {
    padding: 0.5rem 1rem !important;
    font-size: 0.875rem !important;
    border-radius: 0.375rem !important;
  }
  
  /* Badge do contador de itens */
  .meal-items-count {
    font-size: 0.7rem !important;
    padding: 0.3rem 0.6rem !important;
  }
  
  /* Estilos para os badges nutricionais dos equivalentes */
  .nutri-badge {
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%) !important;
    border: 1px solid #dee2e6 !important;
    border-radius: 0.5rem !important;
    padding: 0.5rem !important;
    text-align: center !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.1) !important;
  }
  
  .nutri-badge:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 8px rgba(0,0,0,0.15) !important;
  }
  
  .nutri-badge.nutri-cho {
    border-left: 4px solid #0d6efd !important;
  }
  
  .nutri-badge.nutri-ptn {
    border-left: 4px solid #198754 !important;
  }
  
  .nutri-badge.nutri-lip {
    border-left: 4px solid #dc3545 !important;
  }
  
  .nutri-badge.nutri-kcal {
    border-left: 4px solid #fd7e14 !important;
  }
  
  .nutri-badge .nutri-label {
    font-size: 0.7rem !important;
    font-weight: 600 !important;
    color: #6c757d !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    margin-bottom: 0.25rem !important;
  }
  
  .nutri-badge .nutri-value {
    font-size: 0.9rem !important;
    font-weight: 700 !important;
    color: #212529 !important;
    line-height: 1 !important;
  }
  
  /* Estilos para os cards de equivalentes */
  .equivalent-item {
    animation: fadeInUp 0.5s ease-out !important;
  }
  
  .equivalent-item .card {
    transition: all 0.3s ease !important;
    border: 1px solid #e9ecef !important;
  }
  
  .equivalent-item .card:hover {
    box-shadow: 0 8px 25px rgba(0,0,0,0.1) !important;
    transform: translateY(-2px) !important;
  }
  
  .equivalent-item .card-title {
    color: #495057 !important;
    font-size: 1rem !important;
    font-weight: 600 !important;
    margin-bottom: 0.5rem !important;
  }
  
  .equivalent-item .text-muted {
    font-size: 0.875rem !important;
    color: #6c757d !important;
  }
  
  .equivalent-item .badge {
    font-size: 0.75rem !important;
    padding: 0.25rem 0.5rem !important;
  }
  
  .equivalent-item .remove-equivalent {
    transition: all 0.3s ease !important;
    border-radius: 50% !important;
    width: 36px !important;
    height: 36px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }
  
  .equivalent-item .remove-equivalent:hover {
    background-color: #dc3545 !important;
    border-color: #dc3545 !important;
    color: white !important;
    transform: scale(1.1) !important;
  }
  
  /* Container de equivalentes */
  .equivalents-container {
    border: 1px solid #e9ecef !important;
    border-radius: 0.75rem !important;
    padding: 1rem !important;
    background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%) !important;
    margin-top: 1rem !important;
  }
  
  .equivalents-container h6 {
    color: #0d6efd !important;
    font-weight: 600 !important;
    margin-bottom: 0 !important;
  }
  
  .equivalents-container .btn-outline-success {
    transition: all 0.3s ease !important;
    border-radius: 0.5rem !important;
    font-size: 0.875rem !important;
    font-weight: 500 !important;
  }
  
  .equivalents-container .btn-outline-success:hover {
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 8px rgba(25, 135, 84, 0.2) !important;
  }
  
  /* Animações */
  @keyframes fadeInUp {
    from {
      opacity: 0;
      transform: translateY(20px);
    }
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }
  
  .animate__animated {
    animation-duration: 0.5s !important;
    animation-fill-mode: both !important;
  }
  
  .animate__fadeInUp {
    animation-name: fadeInUp !important;
  }
  
  .animate__fadeOutUp {
    animation-name: fadeOutUp !important;
  }
  
  @keyframes fadeOutUp {
    from {
      opacity: 1;
      transform: translateY(0);
    }
    to {
      opacity: 0;
      transform: translateY(-20px);
    }
  }
  
  .animate__pulse {
    animation-name: pulse !important;
  }
  
  @keyframes pulse {
    0% {
      transform: scale(1);
    }
    50% {
      transform: scale(1.05);
    }
    100% {
      transform: scale(1);
    }
  }
  
  .la-spin {
    animation: spin 1s linear infinite !important;
  }
  
  @keyframes spin {
    0% {
      transform: rotate(0deg);
    }
    100% {
      transform: rotate(360deg);
    }
  }
  
  /* Responsividade para badges nutricionais */
  @media (max-width: 768px) {
    .nutri-badge {
      padding: 0.375rem !important;
    }
    
    .nutri-badge .nutri-label {
      font-size: 0.65rem !important;
    }
    
    .nutri-badge .nutri-value {
      font-size: 0.8rem !important;
    }
    
    .equivalent-item .card-body {
      padding: 1rem !important;
    }
    
    .equivalent-item .remove-equivalent {
      width: 32px !important;
      height: 32px !important;
    }
  }
  
  /* Melhorias para o toast de notificação */
  .toast {
    box-shadow: 0 8px 32px rgba(0,0,0,0.2) !important;
    border-radius: 0.75rem !important;
    border: none !important;
    backdrop-filter: blur(10px) !important;
  }
  
  .toast .toast-body {
    padding: 1rem !important;
    font-weight: 500 !important;
    font-size: 0.9rem !important;
  }
  
  .toast .btn-close {
    margin: 0.5rem !important;
  }
  
  /* Estilos para SortableJS */
  .sortable-ghost {
    opacity: 0.4 !important;
    background: linear-gradient(135deg, #e3f2fd 0%, #bbdefb 100%) !important;
    border: 2px dashed #2196f3 !important;
    border-radius: 0.5rem !important;
    transform: rotate(2deg) !important;
  }
  
  .sortable-chosen {
    opacity: 0.8 !important;
    transform: scale(1.02) !important;
    box-shadow: 0 8px 25px rgba(0,0,0,0.2) !important;
    z-index: 1000 !important;
  }
  
  .sortable-drag {
    opacity: 0.9 !important;
    transform: rotate(5deg) !important;
    box-shadow: 0 12px 35px rgba(0,0,0,0.3) !important;
    z-index: 9999 !important;
  }
  
  /* Melhorias nos handles de ordenação */
  .nested-sortable-handle-card,
  .nested-sortable-handle {
    cursor: grab !important;
    transition: all 0.3s ease !important;
    padding: 0.5rem !important;
    border-radius: 0.375rem !important;
    margin-right: 0.5rem !important;
  }
  
  .nested-sortable-handle-card:hover,
  .nested-sortable-handle:hover {
    background-color: #e3f2fd !important;
    color: #1976d2 !important;
    transform: scale(1.1) !important;
    box-shadow: 0 2px 8px rgba(33, 150, 243, 0.3) !important;
  }
  
  .nested-sortable-handle-card:active,
  .nested-sortable-handle:active {
    cursor: grabbing !important;
    transform: scale(1.05) !important;
  }
  
  /* Estados de ordenação melhorados */
  .sortable-ghost .card,
  .sortable-ghost .list-group-item {
    background-color: #f8f9fa !important;
    border-radius: 0.5rem !important;
  }
  

  
  /* Responsividade */
  @media (max-width: 768px) {
    .nested-sortable-handle-card,
    .nested-sortable-handle {
      padding: 0.375rem !important;
      margin-right: 0.25rem !important;
    }
    
    .sortable-ghost {
      min-height: 40px !important;
      line-height: 40px !important;
    }
  }
  
  /* 🔧 ESTILOS PARA VALIDAÇÃO EM TEMPO REAL */
  .is-valid {
      border-color: #28a745 !important;
      box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.25) !important;
  }
  
  .is-invalid {
      border-color: #dc3545 !important;
      box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.25) !important;
  }
  
  .border-success {
      border: 2px solid #28a745 !important;
      border-radius: 0.375rem;
  }
  
  .border-danger {
      border: 2px solid #dc3545 !important;
      border-radius: 0.375rem;
  }
  
  /* Animação para destacar erros */
  @keyframes shakeX {
      from, to {
          transform: translate3d(0, 0, 0);
      }
      10%, 30%, 50%, 70%, 90% {
          transform: translate3d(-10px, 0, 0);
      }
      20%, 40%, 60%, 80% {
          transform: translate3d(10px, 0, 0);
      }
  }
  
  .animate__shakeX {
      animation: shakeX 0.82s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;
  }
  
  .animate__animated {
      animation-duration: 1s;
      animation-fill-mode: both;
  }
  
  /* Feedback visual melhorado para formulários */
  .validation-feedback {
      display: block;
      width: 100%;
      margin-top: 0.25rem;
      font-size: 0.875em;
  }
  
  .valid-feedback {
      color: #28a745;
  }
  
  .invalid-feedback {
      color: #dc3545;
  }
  
  /* Destaque para campos obrigatórios */
  .required-field:before {
      content: "* ";
      color: #dc3545;
      font-weight: bold;
  }
  
  /* Indicador de progresso do formulário */
  .form-progress {
      height: 4px;
      background-color: #e9ecef;
      border-radius: 2px;
      overflow: hidden;
      margin-bottom: 1rem;
  }
  
  .form-progress-bar {
      height: 100%;
      background: linear-gradient(90deg, #28a745, #20c997);
      width: 0%;
      transition: width 0.3s ease;
  }

  /* =========================
   ESTILOS PARA SELEÇÃO DE MODELOS DE PRONTUÁRIO
   ========================= */

  /* Container principal dos cards */
  .modelo-prontuario-container {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 1.5rem;
    padding: 1rem;
    max-height: 70vh;
    overflow-y: auto;
  }

/* =========================
   ESTILOS PARA ALERTAS INTELIGENTES
   ========================= */

.alertas-dropdown {
    max-height: 400px;
    overflow-y: auto;
}

.alertas-dropdown .dropdown-item {
    transition: background-color 0.2s ease;
}

.alertas-dropdown .dropdown-item:hover {
    background-color: #f8f9fa;
}

.alertas-dropdown .alert-container {
    min-width: 0;
}

.alertas-dropdown .alert-header {
    font-weight: 600;
    color: #495057;
    line-height: 1.3;
}

.alertas-dropdown .alert-details {
    color: #6c757d;
    line-height: 1.4;
}

.alertas-dropdown .alert-info-icon {
    cursor: help;
    transition: color 0.2s ease;
}

.alertas-dropdown .alert-info-icon:hover {
    color: #0d6efd !important;
}

.avatar-xs {
    width: 32px;
    height: 32px;
}

.avatar-title {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    font-size: 14px;
}

/* Novo efeito de pulse mais sutil e elegante */
.alertas-pulse-container {
    position: relative;
    display: inline-block;
}

/* Efeito específico para o badge de alertas */
.alertas-badge.alertas-pulse-container {
    position: relative;
    overflow: visible;
}

.alertas-pulse-aura {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 140%;
    height: 140%;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(220, 53, 69, 0.5) 0%, rgba(220, 53, 69, 0.25) 50%, transparent 70%);
    animation: alertasBreathing 3s ease-in-out infinite;
    pointer-events: none;
    z-index: -1;
    /* Garantir que seja visível */
    opacity: 1;
}

.alertas-pulse-aura.warning {
    background: radial-gradient(circle, rgba(255, 193, 7, 0.5) 0%, rgba(255, 193, 7, 0.25) 50%, transparent 70%);
}

.alertas-pulse-aura.info {
    background: radial-gradient(circle, rgba(13, 202, 240, 0.5) 0%, rgba(13, 202, 240, 0.25) 50%, transparent 70%);
}

@keyframes alertasBreathing {
    0%, 100% {
        transform: translate(-50%, -50%) scale(1);
        opacity: 0.6;
    }
    50% {
        transform: translate(-50%, -50%) scale(1.3);
        opacity: 1;
    }
}

/* Efeito de destaque sutil para o badge */
.alertas-badge-highlight {
    position: relative;
    overflow: visible;
}

/* Garantir que o badge tenha overflow visível */
.alertas-badge.alertas-badge-highlight {
    overflow: visible !important;
}

.alertas-badge-highlight::after {
    content: '';
    position: absolute;
    top: -2px;
    left: -2px;
    right: -2px;
    bottom: -2px;
    background: rgba(255, 255, 255, 0.2);
    border-radius: 50%;
    animation: alertasBadgeBreathing 4s ease-in-out infinite;
    z-index: -1;
}

@keyframes alertasBadgeBreathing {
    0%, 100% {
        opacity: 0.1;
        transform: scale(1);
    }
    50% {
        opacity: 0.3;
        transform: scale(1.08);
    }
}

.severidade-alta {
    border-left: 4px solid #dc3545;
}

.severidade-media {
    border-left: 4px solid #ffc107;
}

.severidade-baixa {
    border-left: 4px solid #0dcaf0;
}

.grupo-unidade {
    background-color: #f8f9fa;
    border-radius: 6px;
    margin: 2px 0;
}

.paciente-item {
    padding-left: 1rem !important;
    border-left: 2px solid #dee2e6;
    margin-left: 0.5rem;
}

  /* Card individual do modelo */
  .modelo-card {
    background: linear-gradient(135deg, #ffffff 0%, #f8f9fa 100%);
    border: 2px solid #e9ecef;
    border-radius: 12px;
    padding: 1.5rem;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    overflow: hidden;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
  }

  .modelo-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 12px 32px rgba(4, 157, 212, 0.15);
    border-color: #049dd4;
  }

  .modelo-card.selected {
    border-color: #049dd4;
    background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 100%);
    box-shadow: 0 8px 24px rgba(4, 157, 212, 0.2);
  }

  /* Informações do modelo */
.modelo-info {
    text-align: center;
    padding: 1rem;
}

  /* Informações do modelo */
  .modelo-info {
    text-align: center;
  }

  .modelo-nome {
    font-size: 1.1rem;
    font-weight: 600;
    color: #1f2937;
    margin-bottom: 0.5rem;
    line-height: 1.3;
  }

  .modelo-id {
    font-size: 0.85rem;
    color: #6b7280;
    font-weight: 500;
    background: #f3f4f6;
    padding: 0.25rem 0.75rem;
    border-radius: 20px;
    display: inline-block;
    margin-top: 0.5rem;
  }

  /* Indicador de seleção */
  .modelo-card.selected::before {
    content: '✓';
    position: absolute;
    top: 1rem;
    right: 1rem;
    width: 24px;
    height: 24px;
    background: #049dd4;
    color: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.8rem;
    font-weight: bold;
    animation: fadeInScale 0.3s ease;
  }

  @keyframes fadeInScale {
    from {
        opacity: 0;
        transform: scale(0);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
  }

  /* Efeito de brilho no hover */
  .modelo-card::after {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.4), transparent);
    transition: left 0.5s ease;
  }

  .modelo-card:hover::after {
    left: 100%;
  }

  /* Responsividade */
@media (max-width: 768px) {
    .modelo-prontuario-container {
        grid-template-columns: 1fr;
        gap: 1rem;
        padding: 0.5rem;
    }
    
    .modelo-card {
        padding: 1rem;
    }
    
    .modelo-nome {
        font-size: 1rem;
    }
    
    .modelo-id {
        font-size: 0.8rem;
    }
}

@media (max-width: 480px) {
    .modelo-prontuario-container {
        padding: 0.25rem;
    }
    
    .modelo-card {
        padding: 0.75rem;
    }
}

  /* Scrollbar customizada para o container */
  .modelo-prontuario-container::-webkit-scrollbar {
    width: 8px;
  }

  .modelo-prontuario-container::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 4px;
  }

  .modelo-prontuario-container::-webkit-scrollbar-thumb {
    background: #049dd4;
    border-radius: 4px;
  }

  .modelo-prontuario-container::-webkit-scrollbar-thumb:hover {
    background: #0284c7;
  }

  /* Animação de entrada dos cards */
  .modelo-card {
    animation: slideInUp 0.6s ease forwards;
    opacity: 0;
    transform: translateY(30px);
  }

  .modelo-card:nth-child(1) { animation-delay: 0.1s; }
  .modelo-card:nth-child(2) { animation-delay: 0.2s; }
  .modelo-card:nth-child(3) { animation-delay: 0.3s; }
  .modelo-card:nth-child(4) { animation-delay: 0.4s; }
  .modelo-card:nth-child(5) { animation-delay: 0.5s; }
  .modelo-card:nth-child(6) { animation-delay: 0.6s; }

  @keyframes slideInUp {
    to {
        opacity: 1;
        transform: translateY(0);
    }
  }

  /* Estado de loading */
  .modelo-prontuario-container.loading {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 200px;
  }

  .modelo-prontuario-container.loading::after {
    content: 'Carregando modelos...';
    color: #6b7280;
    font-size: 1rem;
  }

  /* Estado vazio */
  .modelo-prontuario-container.empty {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 200px;
    text-align: center;
  }

  .modelo-prontuario-container.empty::after {
    content: 'Nenhum modelo encontrado';
    color: #6b7280;
    font-size: 1rem;
  }

  .modelo-icone-prontuario {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 1rem;
  }

  .modelo-icone-prontuario .mdi {
    font-size: 3.5rem;
    color: #b0b0b0; /* cor neutra padrão */
    transition: color 0.2s;
  }

  .modelo-card.selected .modelo-icone-prontuario .mdi {
    color: #049dd4; /* cor principal SoulClinic quando selecionado */
  }

/* Estilos específicos para o filtro timeline-filter */
#timeline-filter {
    min-width: 150px;
}

.d-flex.gap-2.align-items-center {
    gap: 8px !important;
}

.form-label.mb-0.me-2 {
    margin-right: 8px !important;
    white-space: nowrap;
}

/* =========================
   ESTILOS PARA BOTÃO ADICIONAR INFORMAÇÃO
   ========================= */

/* Botão com estilo moderno e chamativo inspirado no Bootstrap 5.3 */
.btn-adicionar-informacao {
    background: linear-gradient(135deg, #20c997 0%, #198754 100%);
    border: none;
    color: #fff;
    font-weight: 600;
    border-radius: 0.5rem;
    padding: 0.5rem 1.25rem;
    position: relative;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 4px 14px 0 rgba(32, 201, 151, 0.39);
    text-transform: none;
    letter-spacing: 0.025em;
}

/* Efeito de brilho que passa pelo botão */
.btn-adicionar-informacao::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.4), transparent);
    transition: left 0.5s;
}

.btn-adicionar-informacao:hover::before {
    left: 100%;
}

.btn-adicionar-informacao:hover {
    background: linear-gradient(135deg, #198754 0%, #146c43 100%);
    transform: translateY(-2px) scale(1.02);
    box-shadow: 0 8px 25px 0 rgba(32, 201, 151, 0.5);
    color: #fff;
}

.btn-adicionar-informacao:focus {
    background: linear-gradient(135deg, #20c997 0%, #198754 100%);
    color: #fff;
    box-shadow: 0 0 0 0.25rem rgba(32, 201, 151, 0.5);
    transform: translateY(-1px);
}

.btn-adicionar-informacao:active {
    background: linear-gradient(135deg, #146c43 0%, #0f5132 100%);
    transform: translateY(0) scale(0.98);
    box-shadow: 0 2px 8px 0 rgba(32, 201, 151, 0.3);
}

/* Ícone com animação */
.btn-adicionar-informacao i {
    font-size: 1.2em;
    margin-right: 0.5rem;
    transition: transform 0.3s ease;
    display: inline-block;
}

.btn-adicionar-informacao:hover i {
    transform: rotate(90deg) scale(1.1);
}

/* Efeito de pulso sutil */
.btn-adicionar-informacao {
    animation: btnPulse 3s ease-in-out infinite;
}

@keyframes btnPulse {
    0%, 100% {
        box-shadow: 0 4px 14px 0 rgba(32, 201, 151, 0.39);
    }
    50% {
        box-shadow: 0 4px 20px 0 rgba(32, 201, 151, 0.6);
    }
}

/* Efeito de entrada com bounce */
.prontuario-adicionais-section .btn-adicionar-informacao {
    animation: btnBounceIn 0.6s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

@keyframes btnBounceIn {
    0% {
        opacity: 0;
        transform: scale(0.3) translateY(-20px);
    }
    50% {
        opacity: 1;
        transform: scale(1.05) translateY(0);
    }
    70% {
        transform: scale(0.95);
    }
    100% {
        opacity: 1;
        transform: scale(1);
    }
}

/* Responsividade */
@media (max-width: 576px) {
    .btn-adicionar-informacao {
        font-size: 0.875rem;
        padding: 0.4rem 1rem;
    }
    
    .btn-adicionar-informacao i {
        font-size: 1.1em;
        margin-right: 0.375rem;
    }
}

/* =========================
   ESTILOS PARA ABA BOLETO & PIX - CONFIGURAÇÕES DE CONTA
   ========================= */

/* Modal de confirmação Asaas */
.swal-wide {
    max-width: 800px !important;
}

/* Status da análise cadastral */
.status-icon {
    font-size: 1.2em;
}

.badge-status {
    font-size: 0.875em;
}

/* Resultado de teste */
#resultado-teste {
    transition: all 0.3s ease;
}

/* Estilos para a aba Boleto & PIX */
.asaas-config-section {
    background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%);
    border-radius: 12px;
    padding: 2rem;
    margin-bottom: 2rem;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
}

.asaas-benefits-list {
    list-style: none;
    padding: 0;
}

.asaas-benefits-list li {
    padding: 0.5rem 0;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.asaas-benefits-list li i {
    color: #20c997;
    font-size: 1.2em;
}

.asaas-subconta-info {
    background: #f8f9fa;
    border-radius: 8px;
    padding: 1.5rem;
    margin-bottom: 1.5rem;
}

.asaas-subconta-info .info-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.5rem 0;
    border-bottom: 1px solid #e9ecef;
}

.asaas-subconta-info .info-item:last-child {
    border-bottom: none;
}

.asaas-subconta-info .info-label {
    font-weight: 600;
    color: #495057;
}

.asaas-subconta-info .info-value {
    color: #6c757d;
}

/* Toggle switches personalizados */
.asaas-toggle-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem;
    background: #fff;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    margin-bottom: 1rem;
}

.asaas-toggle-label {
    font-weight: 500;
    color: #495057;
    margin: 0;
}

/* Formulários de configuração */
.asaas-form-section {
    background: #fff;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    padding: 1.5rem;
    margin-bottom: 1.5rem;
}

.asaas-form-section h6 {
    color: #495057;
    font-weight: 600;
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 2px solid #e9ecef;
}

/* Status da análise cadastral */
.asaas-status-section {
    background: #f8f9fa;
    border-radius: 8px;
    padding: 1.5rem;
    margin-bottom: 1.5rem;
}

.asaas-status-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem 0;
    border-bottom: 1px solid #e9ecef;
}

.asaas-status-item:last-child {
    border-bottom: none;
}

.asaas-status-label {
    font-weight: 500;
    color: #495057;
}

.asaas-status-value {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.asaas-status-icon {
    font-size: 1.1em;
}

.asaas-status-text {
    font-size: 0.875em;
    font-weight: 500;
}

/* Testes e validações */
.asaas-tests-section {
    background: #fff;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    padding: 1.5rem;
}

.asaas-tests-section h6 {
    color: #495057;
    font-weight: 600;
    margin-bottom: 1rem;
}

.asaas-test-buttons {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
}

.asaas-test-btn {
    flex: 1;
    min-width: 150px;
}

/* Botões de ação */
.asaas-action-btn {
    border-radius: 8px;
    font-weight: 500;
    padding: 0.75rem 1.5rem;
    transition: all 0.3s ease;
}

.asaas-action-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.asaas-action-btn.btn-primary {
    background: linear-gradient(135deg, #0d6efd 0%, #0b5ed7 100%);
    border: none;
}

.asaas-action-btn.btn-success {
    background: linear-gradient(135deg, #198754 0%, #146c43 100%);
    border: none;
}

.asaas-action-btn.btn-warning {
    background: linear-gradient(135deg, #ffc107 0%, #e0a800 100%);
    border: none;
    color: #000;
}

.asaas-action-btn.btn-danger {
    background: linear-gradient(135deg, #dc3545 0%, #b02a37 100%);
    border: none;
}

/* Loading states */
.asaas-loading {
    opacity: 0.6;
    pointer-events: none;
}

.asaas-loading .btn {
    position: relative;
}

.asaas-loading .btn::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 16px;
    height: 16px;
    border: 2px solid transparent;
    border-top: 2px solid currentColor;
    border-radius: 50%;
    animation: asaasSpin 1s linear infinite;
}

@keyframes asaasSpin {
    0% { transform: translate(-50%, -50%) rotate(0deg); }
    100% { transform: translate(-50%, -50%) rotate(360deg); }
}

/* Responsividade */
@media (max-width: 768px) {
    .asaas-config-section {
        padding: 1.5rem;
    }
    
    .asaas-subconta-info {
        padding: 1rem;
    }
    
    .asaas-form-section {
        padding: 1rem;
    }
    
    .asaas-status-section {
        padding: 1rem;
    }
    
    .asaas-tests-section {
        padding: 1rem;
    }
    
    .asaas-test-buttons {
        flex-direction: column;
    }
    
    .asaas-test-btn {
        min-width: auto;
    }
    
    .asaas-toggle-container {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }
}

@media (max-width: 576px) {
    .asaas-config-section {
        padding: 1rem;
        margin-bottom: 1rem;
    }
    
    .asaas-action-btn {
        padding: 0.5rem 1rem;
        font-size: 0.875rem;
    }
}

/* ============================================
   ESTILO MELHORADO PARA ABAS DE CONFIGURAÇÕES
   ============================================ */
.nav-tabs-custom {
    border-bottom: 1px solid #e9ecef !important;
    background-color: transparent;
    padding: 0;
    margin-bottom: 0 !important;
}

.nav-tabs-custom .nav-item {
    margin-bottom: 0;
    margin-right: 0.5rem;
}

.nav-tabs-custom .nav-link {
    border: none;
    border-radius: 0.5rem 0.5rem 0 0;
    padding: 0.875rem 1.5rem;
    color: #6c757d;
    font-weight: 500;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    background-color: transparent;
    position: relative;
    border-bottom: 3px solid transparent;
    margin-bottom: -1px;
}

.nav-tabs-custom .nav-link:hover {
    color: #4f98cf;
    background-color: rgba(79, 152, 207, 0.05);
    border-bottom-color: rgba(79, 152, 207, 0.3);
}

.nav-tabs-custom .nav-link.active {
    color: #4f98cf !important;
    background-color: #fff !important;
    border-bottom-color: #4f98cf !important;
    font-weight: 600;
    position: relative;
    z-index: 10;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.05);
}

.nav-tabs-custom .nav-link.active::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 2px;
    background: linear-gradient(90deg, #4f98cf 0%, #299cdb 100%);
    border-radius: 0.5rem 0.5rem 0 0;
}

.nav-tabs-custom .nav-link i {
    margin-right: 0.5rem;
    font-size: 0.875rem;
    transition: transform 0.2s ease;
}

.nav-tabs-custom .nav-link.active i {
    transform: scale(1.1);
}

/* Ajuste para card-body quando usa abas */
.card-header:has(.nav-tabs-custom) + .card-body {
    border-top: 1px solid #e9ecef;
    padding-top: 1.5rem;
    background-color: #fff;
}

/* Responsividade para abas */
@media (max-width: 768px) {
    .nav-tabs-custom {
        flex-wrap: wrap;
        padding: 0;
    }
    
    .nav-tabs-custom .nav-item {
        margin-right: 0.25rem;
        margin-bottom: 0.5rem;
    }
    
    .nav-tabs-custom .nav-link {
        font-size: 0.875rem;
        padding: 0.625rem 1rem;
        border-radius: 0.375rem;
    }
    
    .nav-tabs-custom .nav-link.active {
        border-bottom-color: #4f98cf;
        border-bottom-width: 2px;
    }
}