/* CSS: Cotação - Seção CAPA */

#cotacao #capa-cotacao .capa-hero {
    line-height: 0;
}

/* Media queries para capa - removidas por estarem vazias */


/* CSS: Seção Cotação (layout igual ao print) */
#cotacao-detalhes .quote-panel {
    background-color: #ffffff;
    border: 2px solid #e16f2b; /* laranja do print */
    border-radius: 10px;
}

#cotacao-detalhes .quote-logo {
    max-width: 320px;
}

#cotacao-detalhes .quote-bar {
    background-color: #f17e2f; /* barra laranja */
    color: #ffffff;
    border-radius: 4px;
    text-align: center;
    padding: 6px 8px;
}

#cotacao-detalhes .quote-bar-title {
    font-weight: 600;
}

#cotacao-detalhes .quote-info {
    background-color: #efefef;
    border-radius: 4px;
    padding: 6px 10px;
    text-align: center;
}

#cotacao-detalhes .quote-table {
    border-collapse: separate;
    border-spacing: 0;
}

#cotacao-detalhes .quote-table thead th {
    background-color: #f17e2f;
    color: #ffffff;
    font-weight: 600;
    vertical-align: middle;
}

#cotacao-detalhes .quote-table th,
#cotacao-detalhes .quote-table td {
    border: 1px solid #e5e5e5;
    background-color: #f7f7f7;
}

#cotacao-detalhes .quote-table td:first-child {
    background-color: #ffffff;
    width: 40%;
}

#cotacao-detalhes .quote-finance {
    background-color: #efefef;
    border: 1px solid #e5e5e5;
    border-radius: 4px;
    padding: 10px 12px;
}

#cotacao-detalhes .text-muted {
    color: #6c757d !important;
}

@media (max-width: 575.98px) {
    #cotacao-detalhes .quote-logo {
        max-width: 220px;
    }
}

/* ===== NOVA ESTRUTURA (print azul/amarelo/verde) ===== */
#cotacao-detalhes .quote-header .quote-header-label {
    background-color: #3b82c4; /* azul */
    color: #ffffff;
    padding: 6px 10px;
    border: 1px solid #2e6aa2;
    font-weight: 600;
}

#cotacao-detalhes .quote-header .quote-header-value {
    background-color: #a0c6e6; /* azul claro */
    color: #000000;
    padding: 6px 10px;
    border: 1px solid #2e6aa2;
}

#cotacao-detalhes .quote-attention {
    background-color: #ffec66; /* amarelo claro */
    border: 1px solid #e0c54a;
    padding: 4px 8px;
    font-weight: 600;
}

#cotacao-detalhes .quote-green-bar {
    background-color: #9bd25b; /* verde */
    border: 1px solid #78a943;
    padding: 6px 8px;
    font-weight: 600;
}

#cotacao-detalhes .quote-table-benefits thead th {
    background-color: #e7f0fa; /* cabeçalho benefícios */
    color: #000000;
}

/* Cores específicas para cada plano */
#cotacao-detalhes .quote-table-benefits thead th:nth-child(2) {
    background-color: #ffc107; /* SOFT - amarelo */
    color: #000000;
}

#cotacao-detalhes .quote-table-benefits thead th:nth-child(3) {
    background-color: #8b4513; /* MAIS - marrom */
    color: #ffffff;
}

#cotacao-detalhes .quote-table-benefits thead th:nth-child(4) {
    background-color: #28a745; /* MASTER - verde */
    color: #ffffff;
}

#cotacao-detalhes .quote-table-benefits thead th:nth-child(5) {
    background-color: #17a2b8; /* PREVILLEG - azul claro */
    color: #ffffff;
}

#cotacao-detalhes .quote-table-benefits thead th:nth-child(6) {
    background-color: #fd7e14; /* VIP - laranja */
    color: #ffffff;
}

#cotacao-detalhes .quote-table-benefits .benefits-col {
    width: 32%;
}

#cotacao-detalhes .quote-table-benefits td:first-child {
    background-color: #ffffff;
}

#cotacao-detalhes .quote-table-benefits tbody tr.plan-fee td {
    background-color: #fff7e8;
    font-weight: 600;
}

#cotacao-detalhes .quote-bar-finance {
    background-color: #ffc107;
    border: 1px solid #e0a800;
    padding: 6px 8px;
    font-weight: 700;
}

#cotacao-detalhes .quote-events {
    background-color: #f2f2f2;
    border: 1px solid #e0e0e0;
    padding: 8px 10px;
}

#cotacao-detalhes .quote-total {
    font-weight: 700;
}

#cotacao-detalhes .quote-adhesion {
    border: 2px solid #3b82c4;
    border-radius: 6px;
    overflow: hidden;
}

#cotacao-detalhes .quote-adhesion-title {
    background-color: #3b82c4;
    color: #ffffff;
    font-weight: 700;
    padding: 6px 10px;
}

#cotacao-detalhes .quote-adhesion-value {
    font-weight: 800;
    font-size: 1.4rem;
    padding: 10px;
}

#cotacao-detalhes .quote-validity {
    font-weight: 700;
}

/* ===== MELHORIAS MOBILE PARA TABELA DE PLANOS ===== */

/* Container com scroll horizontal para mobile */
.plan-grid-wrapper {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    margin: 0 -15px;
    padding: 0 15px;
}

/* Tabela de planos responsiva */
.plan-grid {
    display: table;
    width: 100%;
    min-width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    border: 1px solid #e5e5e5;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    background-color: #ffffff;
    table-layout: fixed;
}

/* Linhas da tabela */
.plan-row {
    display: table-row;
}

.plan-row--head {
    background-color: #f17e2f;
    color: #ffffff;
    font-weight: 600;
}

.plan-row--data:nth-child(even) {
    background-color: #f8f9fa;
}

.plan-row--data:nth-child(odd) {
    background-color: #ffffff;
}

.plan-row--fee {
    background-color: #fff7e8 !important;
    font-weight: 600;
    border-top: 2px solid #f17e2f;
}

.plan-row--fee-details {
    background-color: #f0f8ff !important;
    font-size: 0.85rem;
}

/* Células da tabela */
.plan-cell {
    display: table-cell;
    padding: 12px 8px;
    border-right: 1px solid #e5e5e5;
    border-bottom: 1px solid #e5e5e5;
    vertical-align: middle;
    min-height: 44px;
}

/* Coluna de benefícios com largura maior e quebra de linha */
.plan-cell--sticky {
    position: sticky;
    left: 0;
    background-color: inherit;
    z-index: 10;
    min-width: 300px;
    max-width: 300px;
    width: 300px;
    white-space: normal;
    word-wrap: break-word;
    line-height: 1.4;
}

/* Garantir que não há colunas extras */
.plan-grid .plan-row {
    display: table-row;
}

.plan-grid .plan-row > * {
    display: table-cell;
}

/* Largura específica para colunas de planos */
.col-plan-1, .col-plan-2, .col-plan-3, .col-plan-4, .col-plan-5 {
    width: auto;
    min-width: 120px;
    text-align: center;
}

.plan-cell:last-child {
    border-right: none;
}

/* Check mark */
.check {
    color: #28a745;
    font-weight: bold;
    font-size: 1.2rem;
}

/* Detalhamento de taxas */
.fee-breakdown {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.fee-line {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 2px 0;
}

.fee-label {
    font-size: 0.8rem;
    color: #6c757d;
    flex: 1;
}

.fee-value {
    font-weight: 600;
    color: #495057;
    font-size: 0.8rem;
}

/* Responsividade mobile */
@media (max-width: 767.98px) {
    .plan-grid-wrapper {
        margin: 0 -10px;
        padding: 0 10px;
    }
    
    .plan-grid {
        min-width: 800px; /* Largura mínima maior para mobile */
    }
    
    .plan-cell {
        padding: 8px 6px;
        font-size: 0.9rem;
        min-height: 40px;
    }
    
    .plan-cell--sticky {
        min-width: 400px; /* Largura muito maior para mobile */
        max-width: 400px;
        width: 400px;
        white-space: normal;
        word-wrap: break-word;
        line-height: 1.3;
        font-size: 0.85rem;
    }
    
    .fee-breakdown {
        gap: 2px;
    }
    
    .fee-label,
    .fee-value {
        font-size: 0.75rem;
    }
}

/* Scrollbar customizada para mobile */
.plan-grid-wrapper::-webkit-scrollbar {
    height: 8px;
}

.plan-grid-wrapper::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 4px;
}

.plan-grid-wrapper::-webkit-scrollbar-thumb {
    background: #f17e2f;
    border-radius: 4px;
}

.plan-grid-wrapper::-webkit-scrollbar-thumb:hover {
    background: #e16f2b;
}

/* Indicador visual de scroll para mobile */
@media (max-width: 767.98px) {
    .plan-grid-wrapper::after {
        content: "← Deslize para ver mais planos →";
        display: block;
        text-align: center;
        padding: 8px;
        background: #f8f9fa;
        color: #6c757d;
        font-size: 0.8rem;
        border-top: 1px solid #e5e5e5;
    }
    
    /* Forçar quebra de linha em textos longos no mobile */
    .plan-cell--sticky {
        overflow-wrap: break-word;
        hyphens: auto;
        -webkit-hyphens: auto;
        -ms-hyphens: auto;
        word-break: break-word;
    }
}

/* Debug: Garantir estrutura correta da tabela */
.plan-grid {
    border-collapse: collapse;
}

.plan-grid .plan-row--head .plan-cell {
    background-color: #f17e2f !important;
    color: #ffffff !important;
    font-weight: 600;
}

/* Remover qualquer espaçamento extra */
.plan-grid .plan-row {
    margin: 0;
    padding: 0;
}

.plan-grid .plan-cell {
    margin: 0;
    padding: 12px 8px;
}

/* Garantir que não há elementos invisíveis criando colunas */
.plan-grid * {
    box-sizing: border-box;
}

.plan-grid .plan-row > *:empty {
    display: none;
}