
/* Variáveis de cores personalizadas */
:root {
    --matrix-dark: #1a1a1a;
    --matrix-black: #0a0a0a;
    --matrix-orange: #ffc400; /* Laranja Vívido */
    --matrix-yellow: #ffd700; /* Dourado/Amarelo */
    --matrix-light-gray: #e0e0e0;
    --matrix-medium-gray: #888888;
    --matrix-blue: #00bfff; /* Um azul claro para destaque, se necessário */
}

body {
    /* Padroniza a fonte principal para Roboto, mais legível */
    font-family: 'Roboto', sans-serif;
    background-color: var(--matrix-black); /* Fundo preto */
    color: var(--matrix-light-gray); /* Texto padrão cinza claro */
    padding-top: 50px;
    padding-bottom: 80px; /* Padding padrão para o footer */
    transition: padding-bottom 0.3s ease-in-out; /* Transição suave para o padding do body */
}

/* Navbar - Headers Finos e Discretos */
.navbar {
    background-color: var(--matrix-dark) !important; /* Fundo escuro */
    border-bottom: 1px solid var(--matrix-orange); /* Linha de destaque */
    min-height: 45px; /* Altura mínima reduzida */
    padding-top: 0.2rem; /* Padding para ajustar altura */
    padding-bottom: 0.2rem;
}
.navbar-brand {
    color: var(--matrix-light-gray) !important; /* Texto claro */
    font-size: 0.9rem; /* Fonte menor para discrição */
    font-family: 'Orbitron', sans-serif; /* Mantém Orbitron para o branding */
}
.navbar-nav .nav-link, .dropdown-item {
    color: var(--matrix-light-gray) !important; /* Texto claro */
    font-size: 0.9rem; /* Fonte menor para discrição */
}
.navbar-brand:hover, .navbar-nav .nav-link:hover, .dropdown-item:hover {
    color: var(--matrix-orange) !important; /* Destaque no hover */
}
.navbar-toggler-icon {
    filter: invert(1); /* Deixa o ícone do toggler claro */
}
.dropdown-menu {
    background-color: var(--matrix-dark); /* Fundo escuro para dropdown */
    border: 1px solid var(--matrix-yellow); /* Borda de destaque */
}
.dropdown-item.active, .dropdown-item:active {
    background-color: var(--matrix-orange) !important; /* Cor de destaque para ativo */
    color: var(--matrix-dark) !important;
}
.dropdown-divider {
    border-top: 1px solid var(--matrix-medium-gray); /* Divisor discreto */
}


/* Mensagens Flash do Django */
.alert {
    font-size: 0.9rem; /* Fonte menor */
    margin-top: 15px; /* Espaçamento */
    background-color: rgba(255,165,0,0.2); /* Fundo sutil (laranja com transparência) */
    color: var(--matrix-light-gray); /* Texto claro */
    border-color: var(--matrix-orange); /* Borda com destaque */
    border-radius: 0.5rem; /* Bordas arredondadas */
}
.alert .btn-close {
    filter: invert(1); /* Fecha o botão com cor clara */
}

/* Rodapé */
.footer {
    background-color: var(--matrix-dark) !important; /* Fundo escuro */
    border-top: 1px solid var(--matrix-orange); /* Linha de destaque */
    color: var(--matrix-light-gray) !important; /* Texto claro */
    padding-top: 0.3rem;
    padding-bottom: 0.3rem;
    font-size: 0.75rem; /* Fonte menor */
}


/* Chat Container - Estilo Matrix com Transparência e Gradientes */
.floating-chat-container {
    position: fixed;
    bottom: 29px; /* Acima do footer */
    display: flex;
    flex-direction: column;
    box-shadow: 0 -0.5rem 1rem rgba(0, 0, 0, 0.4); /* Sombra mais intensa */
    z-index: 1050;
    /* Painel flutuante transparente */
    background-color: rgba(10, 10, 10, 0.7); /* Fundo preto semi-transparente (ajustado para mais transparência) */
    border-top: 2px solid var(--matrix-orange); /* Borda superior de destaque */
    border-left: 1px solid var(--matrix-orange); /* Borda lateral esquerda visível */
    border-right: 1px solid var(--matrix-orange); /* Borda lateral direita visível */
    backdrop-filter: blur(3px); /* Efeito de desfoque para transparência */
    transition: all 0.3s ease-in-out; /* Transição suave para todas as propriedades */
    border-top-left-radius: 0.75rem;
    border-top-right-radius: 0.75rem;
    max-height: 500px; /* Altura máxima para o chat expandido */
}

/* Estado Oculto (FAB) */
.floating-chat-container.chat-hidden {
    width: 0; /* Largura zero para esconder o conteúdo */
    height: 0; /* Altura zero para esconder o conteúdo */
    opacity: 0; /* Totalmente transparente */
    pointer-events: none; /* Não interage com o mouse */
    /* Posiciona o container fora da tela ou em um ponto que não seja visível */
    bottom: 29px;
    right: 20px; /* Posição inicial do FAB */
    left: auto; /* Desativa o left para usar o right */
    border: none; /* Remove bordas quando oculto */
    box-shadow: none; /* Remove sombra quando oculto */
    overflow: hidden; /* Garante que nada vaze */
}

/* Estado Visível (Chat Completo) */
.floating-chat-container.chat-visible {
    width: 98%; /* 98% da largura da tela */
    left: 1%; /* Ajuste para centralizar */
    right: 1%; /* Ajuste para centralizar */
    height: auto; /* Altura automática para o conteúdo */
    opacity: 1; /* Totalmente opaco */
    pointer-events: auto; /* Interage com o mouse */
    border-top-left-radius: 0.75rem;
    border-top-right-radius: 0.75rem;
    border-top: 2px solid var(--matrix-orange);
    border-left: 1px solid var(--matrix-orange);
    border-right: 1px solid var(--matrix-orange);
    box-shadow: 0 -0.5rem 1rem rgba(0, 0, 0, 0.4);
}


/* Ajustes para o Header do Chat - Tudo em uma linha */
.floating-chat-container .card-header {
    cursor: pointer; /* Mantém o cursor de ponteiro para indicar que é clicável (para recolher) */
    padding: .5rem 1rem; /* Padding reduzido para deixar mais fino */
    border-bottom: 1px solid var(--matrix-medium-gray); /* Borda discreta */
    background: linear-gradient(to right, rgba(255,165,0,0.2), rgba(10,10,10,0.8)); /* Gradiente sutil */
    color: var(--matrix-yellow); /* Título em amarelo */
    font-size: 0.9rem; /* Fonte do header reduzida */
    display: flex; /* Já é flex, mas reforça */
    align-items: center;
    justify-content: space-between; /* Distribui os itens nas laterais */
    flex-wrap: nowrap; /* Impede quebras de linha no header */
    /* Cantos superiores arredondados para o header */
    border-top-left-radius: 0.75rem;
    border-top-right-radius: 0.75rem;
}

/* Estilos para o texto de saudação e ícones no header */
.chat-greeting {
    display: flex; /* Para alinhar o texto e os ícones */
    align-items: center;
    white-space: nowrap; /* Mantém o texto em uma única linha */
    overflow: hidden; /* Esconde o excesso se houver */
    text-overflow: ellipsis; /* Adiciona reticências se o texto for muito longo */
}
.chat-greeting i {
    margin: 0 5px; /* Espaço entre texto e ícones */
    font-size: 0.8em; /* Ícones um pouco menores */
}
/* .chat-greeting .chat-toggle-icon { Removido, agora o ícone está no FAB */
/* font-size: 1.1em; */
/* } */

/* Estilo para o dropdown de sessões */
#chatSessionSelect {
    background-color: var(--matrix-dark);
    color: var(--matrix-yellow);
    border: 1px solid var(--matrix-medium-gray);
    padding: 0.2rem 0.5rem; /* Padding para dropdown pequeno */
    font-size: 0.85rem; /* Fonte menor */
    height: calc(1.5em + 0.75rem + 2px); /* Ajusta a altura para combinar com os botões */
    line-height: 1.25; /* Alinhamento de texto */
    -webkit-appearance: none; /* Remove estilo padrão do navegador */
    -moz-appearance: none;
    appearance: none;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23ffd700' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e"); /* Seta customizada amarela */
    background-repeat: no-repeat;
    background-position: right .75rem center;
    background-size: 16px 12px;
    border-radius: 0.3rem; /* Bordas arredondadas */
}
#chatSessionSelect option {
    background-color: var(--matrix-dark);
    color: var(--matrix-light-gray);
}
#chatSessionSelect:focus {
    border-color: var(--matrix-orange);
    box-shadow: 0 0 0 0.25rem rgba(255,165,0,.25);
}

/* Botões do Header do Chat */
.floating-chat-container .card-header .btn {
    background-color: var(--matrix-dark); /* Fundo escuro */
    border: 1px solid var(--matrix-medium-gray); /* Borda discreta */
    color: var(--matrix-yellow); /* Ícones em amarelo */
    border-radius: 0.3rem; /* Bordas arredondadas */
    padding: 0.2rem 0.6rem; /* Padding ajustado */
    font-size: 0.8rem; /* Fonte menor */
    transition: background-color 0.2s, border-color 0.2s, color 0.2s;
}
.floating-chat-container .card-header .btn:hover {
    background-color: var(--matrix-orange); /* Laranja no hover */
    border-color: var(--matrix-orange);
    color: var(--matrix-dark); /* Texto escuro no hover */
}


#chatMessagesCollapse {
    overflow: hidden; /* Garante que o conteúdo não vaze */
    flex-grow: 1; /* Permite que o corpo do chat ocupe o espaço disponível */
}

/* Corpo do Chat (mensagens) */
.chat-messages {
    overflow-y: auto; /* Rolagem apenas no corpo das mensagens */
    flex-grow: 1;
    padding: 1rem;
    background: linear-gradient(to bottom, rgba(0,0,0,0.05), rgba(0,0,0,0.15)); /* Gradiente sutil para o fundo, mais transparente */
    display: flex;
    flex-direction: column;
    color: var(--matrix-light-gray); /* Cor do texto das mensagens */
}
/* Ajuste para o scrollbar */
.chat-messages::-webkit-scrollbar {
    width: 8px;
}
.chat-messages::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.1);
    border-radius: 10px;
}
.chat-messages::-webkit-scrollbar-thumb {
    background: var(--matrix-medium-gray);
    border-radius: 10px;
}
.chat-messages::-webkit-scrollbar-thumb:hover {
    background: var(--matrix-orange);
}


.floating-chat-container .card-body.collapse:not(.show) {
    display: none;
}
.floating-chat-container .card-footer {
    border-top: 1px solid var(--matrix-medium-gray); /* Borda discreta */
    background-color: rgba(10, 10, 10, 0.9); /* Fundo mais opaco para o input */
    padding: 0.75rem 1rem; /* Padding ajustado para o footer */
    /* Agora é um flexbox para alinhar textarea e botão inline */
    display: flex;
    align-items: flex-end; /* Alinha os itens pela base */
    gap: 0.5rem; /* Espaçamento entre o textarea e o botão */
}

/* Área de Input do Usuário */
.chat-input-area {
    position: relative; /* Para posicionar os botões de ação */
    width: 100%; /* Ocupa a largura total do footer */
    display: flex; /* Torna a área de input um flex container para seus filhos */
    align-items: flex-end; /* Alinha o textarea e o botão na parte inferior */
}

.chat-input-area textarea.form-control {
    resize: vertical; /* Permite redimensionar verticalmente */
    min-height: 40px;
    max-height: 180px; /* Aumenta a altura máxima para expansão */
    background-color: var(--matrix-dark); /* Fundo do input escuro */
    color: var(--matrix-light-gray); /* Texto do input claro */
    border: 1px solid var(--matrix-orange); /* Borda laranja para destaque */
    border-radius: 0.5rem; /* Bordas arredondadas */
    font-family: 'Roboto', sans-serif; /* Fonte legível para o input */
    font-size: 1rem; /* Tamanho da fonte */
    flex-grow: 1; /* Permite que o textarea ocupe o máximo de espaço possível */
    padding-right: 1rem; /* Padding para o texto não ficar colado na borda */
    transition: border-color 0.2s, box-shadow 0.2s;
    margin-right: 0.5rem; /* Espaçamento entre o textarea e o botão */
}
.chat-input-area textarea.form-control:focus {
    border-color: var(--matrix-yellow); /* Borda amarela no foco */
    box-shadow: 0 0 0 0.25rem rgba(255,165,0,.25); /* Sombra de foco */
    background-color: var(--matrix-black); /* Fundo mais escuro no foco */
}
.chat-input-area textarea.form-control::placeholder {
    color: var(--matrix-medium-gray); /* Cor do placeholder */
    font-family: 'Roboto', sans-serif; /* Garante que o placeholder também use Roboto */
}

/* Botão de Enviar (não precisa de send-button-container mais) */
.chat-input-area .btn {
    background-color: var(--matrix-orange); /* Botões em laranja */
    border-color: var(--matrix-orange);
    color: var(--matrix-dark);
    font-size: 0.9rem; /* Botões um pouco maiores */
    padding: 0.5rem 1rem;
    border-radius: 0.5rem; /* Bordas arredondadas */
    transition: background-color 0.2s, border-color 0.2s, color 0.2s;
    /* Removido margin-left: auto; pois o flex-grow no textarea já faz o trabalho */
    flex-shrink: 0; /* Impede que o botão encolha */
}
.chat-input-area .btn:hover {
    background-color: var(--matrix-yellow); /* Amarelo no hover */
    border-color: var(--matrix-yellow);
    color: var(--matrix-dark);
}

/* Removido .chat-toggle-icon, pois a funcionalidade foi movida para o FAB */

/* Estilos para as mensagens do chat */
.chat-message {
    max-width: 85%;
    padding: .8rem 1.2rem; /* Padding ligeiramente maior */
    border-radius: 1.2rem; /* Bordas mais arredondadas */
    margin-bottom: .8rem; /* Espaçamento maior entre mensagens */
    word-wrap: break-word;
    box-shadow: 0 2px 5px rgba(0,0,0,.4); /* Sombra mais pronunciada */
    font-size: 0.95rem; /* Tamanho da fonte das mensagens */
    font-family: 'Roboto', sans-serif; /* Garante Roboto nas mensagens */
}

.chat-message.user {
    background-color: rgba(255, 165, 0, 0.2); /* Laranja sutil e transparente (ajustado para mais transparência) */
    color: var(--matrix-yellow); /* Texto em amarelo */
    align-self: flex-end;
    border-bottom-right-radius: .4rem; /* Canto inferior direito menos arredondado */
    border: 1px solid var(--matrix-orange); /* Borda laranja */
}

.chat-message.model {
    background-color: rgba(50, 50, 50, 0.6); /* Cinza escuro semi-transparente (ajustado para mais transparência) */
    color: var(--matrix-light-gray); /* Texto cinza claro */
    align-self: flex-start;
    border-bottom-left-radius: .4rem; /* Canto inferior esquerdo menos arredondado */
    border: 1px solid var(--matrix-medium-gray); /* Borda cinza */
}

/* Estilo para markdown dentro das mensagens */
.chat-message p:last-child {
    margin-bottom: 0;
}
.chat-message pre {
    background-color: rgba(255,255,0,0.1); /* Fundo de código levemente amarelado */
    padding: 0.6rem; /* Padding ajustado */
    border-radius: 0.4rem; /* Bordas arredondadas */
    overflow-x: auto;
    color: var(--matrix-yellow); /* Cor do código em amarelo */
    border: 1px solid rgba(255,165,0,0.5); /* Borda sutil */
    font-family: 'Consolas', 'Monaco', monospace; /* Fonte monoespaçada para código */
    font-size: 0.85em;
}
.chat-message code {
    font-family: 'Consolas', 'Monaco', monospace; /* Fonte monoespaçada para código inline */
    font-size: 0.9em;
    color: var(--matrix-orange); /* Cor laranja para código inline */
}

/* Ajuste para o padding-bottom do body quando o chat está expandido */
body.chat-expanded {
    padding-bottom: calc(80px + 500px); /* 80px (footer) + 500px (chat max-height) */
}

/* Estilos para o novo botão flutuante (FAB) */
.chat-fab-button {
    position: fixed;
    bottom: 90px; /* Acima do footer */
    right: 20px;
    width: 60px;
    height: 60px;
    font-size: 1.5rem;
    background-color: var(--matrix-orange); /* Cor principal do FAB */
    border-color: var(--matrix-orange);
    color: var(--matrix-dark);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1060; /* Acima do chat container */
    transition: all 0.3s ease-in-out;
}

.chat-fab-button:hover {
    background-color: var(--matrix-yellow);
    border-color: var(--matrix-yellow);
    color: var(--matrix-dark);
    transform: scale(1.05); /* Pequeno efeito de escala no hover */
}

/* Badge de nova mensagem no FAB */
.chat-fab-button .badge {
    font-size: 0.7em;
    padding: 0.3em 0.6em;
    top: -5px;
    right: -5px;
    border: 2px solid var(--matrix-dark); /* Borda para contraste */
}

/* Estilos para exibir/ocultar a mensagem colapsada (agora no FAB) */
/* Por padrão, oculta-o. Será exibido pelo JS se o chat estiver oculto e houver mensagem. */
.collapsed-message-display {
    position: absolute; /* Posição absoluta dentro do FAB */
    bottom: 100%; /* Acima do FAB */
    right: 0;
    width: 200px; /* Largura da mensagem colapsada */
    background-color: rgba(10, 10, 10, 0.9);
    color: var(--matrix-light-gray);
    padding: 0.5rem 1rem;
    border-radius: 0.5rem;
    border: 1px solid var(--matrix-medium-gray);
    box-shadow: 0 2px 5px rgba(0,0,0,.4);
    display: none; /* Controlado por JS */
    opacity: 0;
    transition: opacity 0.3s ease-in-out;
    white-space: nowrap; /* Mantém o texto em uma linha */
    overflow: hidden; /* Esconde o excesso */
    text-overflow: ellipsis; /* Adiciona reticências */
    transform: translateY(-10px); /* Pequeno deslocamento para cima */
}

/* Exibe a mensagem colapsada APENAS quando o chat está no modo FAB e há conteúdo */
.chat-fab-button:not(.d-none) + .floating-chat-container .collapsed-message-display {
    display: block; /* Mostra o display quando o FAB está visível */
    opacity: 1;
    transform: translateY(0);
}


/* Modal de Configurações da IA e Modal de Confirmação */
.modal-content {
    background-color: var(--matrix-dark); /* Fundo escuro */
    color: var(--matrix-light-gray);
    border: 1px solid var(--matrix-yellow); /* Borda de destaque */
    border-radius: 0.75rem; /* Bordas mais arredondadas para o modal */
}
.modal-header {
    border-bottom: 1px solid var(--matrix-medium-gray);
    background-color: var(--matrix-black);
    color: var(--matrix-yellow);
    border-top-left-radius: 0.75rem; /* Arredondar cantos do header */
    border-top-right-radius: 0.75rem;
}
.modal-title {
    color: var(--matrix-yellow);
    font-family: 'Orbitron', sans-serif; /* Mantém Orbitron para o título do modal */
    font-size: 1.2rem; /* Tamanho ligeiramente maior */
}
.modal-body .form-label {
    color: var(--matrix-light-gray);
    font-size: 0.9rem;
}
.modal-body .form-control {
    background-color: var(--matrix-black);
    color: var(--matrix-yellow);
    border: 1px solid var(--matrix-medium-gray);
    font-family: 'Roboto', sans-serif; /* Fonte legível para inputs do modal */
    font-size: 0.9rem;
    border-radius: 0.3rem;
}
.modal-body .form-control:focus {
    border-color: var(--matrix-orange);
    box-shadow: 0 0 0 0.25rem rgba(255,165,0,.25);
}
.modal-body .form-text {
    color: var(--matrix-medium-gray);
    font-size: 0.8rem;
}
.modal-footer {
    border-top: 1px solid var(--matrix-medium-gray);
    background-color: var(--matrix-black);
    border-bottom-left-radius: 0.75rem; /* Arredondar cantos do footer */
    border-bottom-right-radius: 0.75rem;
}
.modal-footer .btn {
    background-color: var(--matrix-orange);
    border-color: var(--matrix-orange);
    color: var(--matrix-dark);
    font-size: 0.85rem;
    border-radius: 0.4rem;
}
.modal-footer .btn-secondary {
    background-color: var(--matrix-medium-gray);
    border-color: var(--matrix-medium-gray);
    color: var(--matrix-dark);
}
.modal-footer .btn-danger { /* Estilo para o botão de "Limpar Conversa" no modal */
    background-color: #dc3545; /* Vermelho padrão do Bootstrap */
    border-color: #dc3545;
    color: white;
}
.modal-footer .btn:hover {
    background-color: var(--matrix-yellow);
    border-color: var(--matrix-yellow);
}
.modal-footer .btn-secondary:hover {
    background-color: var(--matrix-light-gray);
    border-color: var(--matrix-light-gray);
}
.modal-footer .btn-danger:hover {
    background-color: #c82333; /* Vermelho mais escuro no hover */
    border-color: #bd2130;
}
.modal .btn-close {
    filter: invert(1); /* Fecha o botão com cor clara */
}

/* Estilos para carrosséis na página inicial (index.html) */
.home-gallery-carousel {
    background-color: rgba(10, 10, 10, 0.5); /* Fundo sutil para o carrossel */
    border-radius: 0.75rem;
    border: 1px solid var(--matrix-orange); /* Borda de destaque */
    padding: 1rem;
    margin-bottom: 2rem;
    box-shadow: 0 4px 15px rgba(255,165,0,0.1); /* Sombra sutil */
}

.home-gallery-carousel .carousel-inner {
    border-radius: 0.5rem;
}

.home-gallery-carousel .carousel-item {
    text-align: center; /* Centraliza o conteúdo */
}

.home-gallery-carousel .carousel-item img,
.home-gallery-carousel .carousel-item video {
    max-height: 400px; /* Altura máxima para imagens/vídeos */
    width: auto; /* Largura automática para manter proporção */
    object-fit: contain; /* Garante que a mídia caiba sem cortar */
    border-radius: 0.5rem;
    border: 1px solid var(--matrix-medium-gray);
    box-shadow: 0 4px 10px rgba(0,0,0,0.5);
    background-color: var(--matrix-black); /* Fundo preto para mídias com transparência */
}

.home-gallery-carousel .carousel-caption {
    background-color: rgba(0, 0, 0, 0.7);
    border-radius: 0.5rem;
    padding: 0.5rem 1rem;
    color: var(--matrix-light-gray);
    font-size: 0.9rem;
    bottom: 10px;
    left: 10%;
    right: 10%;
    width: 80%;
    margin: 0 auto;
}

.home-gallery-carousel .carousel-caption h5 {
    color: var(--matrix-yellow);
    font-family: 'Orbitron', sans-serif;
    margin-bottom: 0.2rem;
}

.home-gallery-carousel .carousel-control-prev-icon,
.home-gallery-carousel .carousel-control-next-icon {
    background-image: none;
}

.home-gallery-carousel .carousel-control-prev-icon::before,
.home-gallery-carousel .carousel-control-next-icon::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: 2.5rem;
    color: var(--matrix-orange);
    text-shadow: 0 0 10px rgba(255,165,0,0.7);
}

.home-gallery-carousel .carousel-control-prev-icon::before {
    content: "\f104";
}

.home-gallery-carousel .carousel-control-next-icon::before {
    content: "\f105";
}

/* Estilo para o botão de tela cheia no carrossel de vídeos */
.fullscreen-btn {
    background-color: rgba(0, 0, 0, 0.5); /* Fundo semi-transparente */
    border: 1px solid var(--matrix-medium-gray);
    color: var(--matrix-light-gray);
    border-radius: 0.5rem;
    padding: 0.5rem 0.8rem;
    font-size: 1rem;
    transition: background-color 0.2s, color 0.2s;
}

.fullscreen-btn:hover {
    background-color: var(--matrix-orange);
    color: var(--matrix-dark);
    border-color: var(--matrix-orange);
}


/* Media queries para telas menores (responsividade) */
@media (max-width: 768px) {
    .floating-chat-container.chat-visible {
        bottom: 0;
        max-height: 60vh;
        border-radius: .3rem .3rem 0 0;
        left: 0; /* Ocupa 100% da largura em telas pequenas */
        right: 0;
        width: 100%;
    }
    body.chat-expanded {
        padding-bottom: calc(80px + 60vh);
    }
    /* Ajustes para o header do chat em telas pequenas */
    .floating-chat-container .card-header {
        flex-direction: column; /* Empilha os elementos */
        align-items: flex-start; /* Alinha à esquerda */
        padding-bottom: 0.75rem; /* Mais espaço abaixo */
        border-top-left-radius: 0.3rem; /* Ajuste para mobile */
        border-top-right-radius: 0.3rem; /* Ajuste para mobile */
    }
    .chat-header-right {
        width: 100%; /* Ocupa toda a largura */
        justify-content: flex-end; /* Alinha botões à direita */
        margin-top: 0.5rem; /* Espaço entre o texto e os botões */
    }
    .chat-greeting {
        white-space: normal; /* Permite quebra de linha */
        text-overflow: unset; /* Remove reticências */
    }
    /* Ajusta a área de input para mobile */
    .chat-input-area {
        flex-direction: column; /* Volta a empilhar em telas pequenas */
        align-items: flex-end; /* Alinha o botão à direita */
    }
    .chat-input-area textarea.form-control {
        font-size: 0.9rem;
        margin-right: 0; /* Remove margem em mobile */
        margin-bottom: 0.5rem; /* Adiciona margem abaixo do textarea */
    }
    .chat-input-area .btn {
        font-size: 0.8rem;
        padding: 0.4rem 0.8rem;
    }
    .chat-message {
        font-size: 0.9rem;
    }

    /* FAB em mobile */
    .chat-fab-button {
        bottom: 90px;
        right: 15px;
        width: 50px;
        height: 50px;
        font-size: 1.2rem;
    }
    .collapsed-message-display {
        width: 180px; /* Largura menor em mobile */
        right: 0;
    }

    /* Ajustes para carrosséis na página inicial em telas menores */
    .home-gallery-carousel .carousel-item img,
    .home-gallery-carousel .carousel-item video {
        max-height: 250px; /* Altura menor para mobile */
    }

    .fullscreen-btn {
        padding: 0.3rem 0.6rem;
        font-size: 0.8rem;
        margin: 0.5rem !important; /* Ajusta margem em mobile */
    }
}

