/**
 * ✅ CEAPP: Estilos do UserControl Reservas.ascx
 * 
 * Funcionalidade: Estilos específicos do controle de reservas
 * - Container do UserControl
 * - Mensagens de status
 * 
 * Integração CEAPP:
 * - Estilos separados do HTML para melhor organização
 * - Facilita manutenção e reutilização
 */

/* Container do UserControl */
#reservasUserControlContainer {
    width: 100%;
    min-height: 100%;
    padding: 0;
    margin: 0;
}

/* Cabeçalho compacto */
#reservasUserControlContainer h5 {
    font-size: 1.1rem;
    font-weight: 600;
}

/* Card de filtros compacto */
#reservasUserControlContainer .card-body.p-2 {
    padding: 0.5rem !important;
}

#reservasUserControlContainer .form-label.small {
    font-size: 0.8rem;
    margin-bottom: 0.25rem;
}

#reservasUserControlContainer .form-control-sm,
#reservasUserControlContainer .form-select-sm {
    font-size: 0.875rem;
    padding: 0.25rem 0.5rem;
}

#reservasUserControlContainer .btn-sm {
    font-size: 0.875rem;
    padding: 0.25rem 0.5rem;
}

/* Card header compacto */
#reservasUserControlContainer .card-header.py-2 {
    padding-top: 0.5rem !important;
    padding-bottom: 0.5rem !important;
}

#reservasUserControlContainer .card-header h6.small {
    font-size: 0.875rem;
    font-weight: 600;
}

/* Mensagem de status (inicialmente oculta - controlada por JavaScript) */
#reservasMensagem {
    display: none;
}

#reservasMensagem.mostrar {
    display: block;
}

/* ✅ CEAPP: Estilos para árvore de reservas */
.status-node {
    margin-bottom: 4px;
}

.status-header {
    transition: all 0.2s ease;
}

.status-header:hover {
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.status-header .card-header {
    padding: 0.25rem 0.5rem !important;
}

.status-header .card-header strong {
    font-weight: 600;
}

.status-icon {
    transition: transform 0.3s ease;
}

.status-reservas-container {
    margin-left: 15px;
    margin-top: 5px;
    padding-left: 8px;
    border-left: 2px solid #dee2e6;
}

.status-reservas-container .reserva-card {
    margin-bottom: 8px;
    border: 1px solid #dee2e6;
}

/* ✅ Layout compacto para cards de reserva */
.reserva-card {
    font-size: 0.875rem;
}

.reserva-card .card-body {
    padding: 0.5rem !important;
}

.reserva-card .btn-sm {
    padding: 0.25rem 0.5rem;
    font-size: 0.75rem;
    line-height: 1.2;
}

.reserva-card .d-flex.flex-column {
    gap: 2px;
}

.reserva-card .d-flex.flex-column .btn {
    margin-bottom: 0;
}

.reserva-card small {
    font-size: 0.75rem;
}

.reserva-card .badge {
    font-size: 0.7rem;
    padding: 0.25em 0.5em;
}

/* Scrollbar customizada para árvore */
#arvoreReservas::-webkit-scrollbar {
    width: 8px;
}

#arvoreReservas::-webkit-scrollbar-track {
    background: #f1f1f1;
}

#arvoreReservas::-webkit-scrollbar-thumb {
    background: #888;
    border-radius: 4px;
}

#arvoreReservas::-webkit-scrollbar-thumb:hover {
    background: #555;
}