/* ==================================
 * === MENTOR-IA.CSS (v3.0 - Refatoração Práxis/Dark Mode) ===
 * (DEPENDE do styles.css e praxis-styles.css)
 * ================================== */

/* ==================================
 * === (v3.1) PATCH - VARIÁVEIS FALTANTES ===
 * Adiciona variáveis do praxis-styles.css para standalone
 * ================================== */
:root {
    --praxis-primary: #9b59b6;
    --praxis-primary-dark: #8e44ad;
    --praxis-secondary: #3498db;
    --praxis-secondary-dark: #2980b9;
    --mentor-color: #0077b6;
    --mentor-color-dark: #023e8a;
    --mentor-color-faded: rgba(0, 119, 182, 0.1);
}

/* --- Estilos de Botão Faltantes --- */
.btn-praxis-primary {
    background: linear-gradient(
        135deg,
        var(--praxis-primary),
        var(--praxis-primary-dark)
    );
    color: white;
    box-shadow: var(--shadow-md);
}
.btn-praxis-primary:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow-lg);
}

.btn-small {
    padding: var(--spacing-2) var(--spacing-3);
    font-size: var(--font-size-xs);
    min-height: 32px;
}

/* --- Correção Botão Criar Novo (Item 3 e 5) --- */
#mentor-criar-novo-btn {
    width: 100%; /* Garante largura total */
    margin-top: 1rem;
    padding: var(--spacing-4);
    font-size: var(--font-size-lg);
    background: var(--praxis-secondary);
}
#mentor-criar-novo-btn:hover {
    background: var(--praxis-secondary-dark);
}

/* * O container principal agora é #main-content,
 * então usamos um wrapper para centralizar
 * o conteúdo das Fases 1 e 2.
 */
.mentor-wrapper {
    max-width: 900px;
    margin: 0 auto;
    padding: var(--spacing-6);
    background-color: var(--card-bg);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-sm);
}

/* Loader inicial (substituído pelo JS) */
#mentor-loader-initial {
    padding-top: 5rem;
}

/* --- Header Padrão --- */
.mentor-header {
    text-align: center;
    border-bottom: 1px solid var(--border-color);
    padding-bottom: 1.5rem;
    margin-bottom: 2rem;
}
.mentor-header h2 {
    margin-top: 0;
    font-size: 1.8rem;
    color: var(--mentor-color);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
}
.mentor-header p {
    font-size: var(--font-size-lg);
    color: var(--text-muted);
    margin-bottom: 0;
}
.mentor-header p strong {
    color: var(--text-primary);
    font-weight: 600;
}

/* --- Loader (Usado pelo mentor.js) --- */
#mentor-loader {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem;
    color: var(--text-muted);
}
#mentor-loader .loader-icon {
    font-size: 3rem;
    color: var(--mentor-color);
    margin-bottom: 1rem;
}

/* ==================================
 * === (v3.0) Dashboard (Etapa 8) ===
 * ================================== */
.mentor-dashboard-lista {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    margin-bottom: 2rem;
}
.mentor-plano-card {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    padding: 1.5rem;
    border-radius: var(--radius-lg);
    gap: 1rem;
    transition: all var(--transition-fast);
}
.mentor-plano-card:hover {
    border-color: var(--mentor-color);
    box-shadow: var(--shadow-md);
    transform: translateY(-2px);
}
.mentor-plano-card-info {
    flex-grow: 1;
}
.mentor-plano-card-info h4 {
    margin: 0 0 0.25rem 0;
    font-size: 1.25rem;
    color: var(--text-primary);
}
.mentor-plano-card-info p {
    margin: 0;
    color: var(--text-muted);
    font-size: 0.9rem;
}

/* --- Correção da Barra de Progresso (Item 4) --- */
.mentor-plano-progresso {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-top: 1rem;
}
.mentor-plano-progresso span {
    font-size: 0.9rem;
    font-weight: 500;
    color: var(--text-muted);
    white-space: nowrap;
}
.progress-bar-container {
    width: 100%;
    max-width: 150px;
    height: 10px;
    background-color: var(--border-color);
    border-radius: var(--radius-sm);
    overflow: hidden;
}
/* --- Correção da Barra de Progresso (Item 4) --- */
.progress-bar-fill {
    height: 100%;
    background: linear-gradient(
        90deg,
        var(--mentor-color),
        var(--praxis-secondary)
    );
    border-radius: var(--radius-sm);
    transition: width 0.5s ease;
    min-width: 0; /* Define a base como 0 */
}
/* Se a style tag NÃO FOR (exatamente) 'width: 0%;', aplica min-width. */
.progress-bar-fill:not([style='width: 0%;']) {
    min-width: 8px; /* Mostra um mínimo para valores pequenos (ex: 2%) */
}

.mentor-plano-card-actions {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-shrink: 0;
}
/* Botões de Ação no Card */
.mentor-plano-card-actions .btn-secondary {
    background-color: var(--bg-tertiary);
}
.mentor-plano-card-actions .btn-secondary:hover {
    background-color: var(--error-color);
    border-color: var(--error-color);
    color: white;
}
.mentor-plano-card-actions .btn-praxis-primary {
    /* Estilo do Práxis */
    background: linear-gradient(
        135deg,
        var(--praxis-primary),
        var(--praxis-primary-dark)
    );
}

/* Botão Criar Novo (usando estilo Práxis) */
#mentor-criar-novo-btn {
    width: 100%;
    margin-top: 1rem;
    padding: var(--spacing-4);
    font-size: var(--font-size-lg);
    background: var(--praxis-secondary);
}
#mentor-criar-novo-btn:hover {
    background: var(--praxis-secondary-dark);
}

/* ==================================
 * === (v3.0) Fase 1: Entrada (Item 5) ===
 * ================================== */
.mentor-fase1-opcoes {
    display: grid;
    grid-template-columns: 1fr;
    max-width: 500px;
    margin: 2rem auto 0;
}
/* Card de "Colar" estilizado como Módulo Práxis */
.mentor-card-opcao {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-xl);
    padding: 2.5rem 2rem;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    box-shadow: var(--shadow-sm);
    transition: all var(--transition-fast);
}
.mentor-card-opcao:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-lg);
    border-color: var(--mentor-color);
}
.mentor-card-opcao .icon {
    font-size: 3rem;
    color: var(--mentor-color);
    margin-bottom: 1.5rem;
}
.mentor-card-opcao h3 {
    margin-top: 0;
    margin-bottom: 0.75rem;
    font-size: var(--font-size-xl);
    color: var(--text-primary);
}
.mentor-card-opcao p {
    color: var(--text-muted);
    flex-grow: 1;
    margin-bottom: 2rem;
}
.mentor-card-opcao .btn {
    width: 100%;
    padding: var(--spacing-3);
    font-size: var(--font-size-lg);
}

/* ==================================
 * === (v3.0) Fase 2: Config (Item 5) ===
 * ================================== */

/* --- Seleção de Cargo --- */
.mentor-cargo-lista {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    margin-bottom: 2rem;
}
.mentor-cargo-item {
    display: block;
    width: 100%;
    padding: 1rem 1.5rem;
    font-size: var(--font-size-lg);
    font-weight: 600;
    text-align: left;
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
    border-radius: var(--radius-md);
    cursor: pointer;
    transition: all var(--transition-fast);
}
.mentor-cargo-item:hover {
    background-color: var(--bg-tertiary);
    border-color: var(--mentor-color);
    color: var(--mentor-color);
}

/* --- Configuração Principal --- */
#mentor-fase2-main h3 {
    font-size: 1.5rem;
    color: var(--mentor-color);
    border-bottom: 1px solid var(--border-color);
    padding-bottom: 0.75rem;
    margin-top: 2.5rem;
    margin-bottom: 0.5rem;
}
#mentor-fase2-main .text-muted {
    color: var(--text-muted);
    margin-top: 0;
}

/* Tópicos (Fieldset) */
.mentor-topicos-container {
    max-height: 400px;
    overflow-y: auto;
    border: 1px solid var(--border-color);
    border-radius: var(--radius-lg);
    padding: 1rem 1.5rem;
    background-color: var(--bg-secondary);
}
.config-group {
    border: none;
    padding: 0;
    margin: 0;
}
.mentor-topic-bloco {
    border: none;
    padding: 1rem 0;
    margin: 0;
}
.mentor-topic-bloco:not(:last-child) {
    border-bottom: 1px dashed var(--border-color);
}
.mentor-topic-bloco legend {
    font-size: 1.2rem;
    font-weight: 600;
    color: var(--text-primary);
    padding: 0;
    margin-bottom: 1rem;
}
.mentor-topic-bloco legend label {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    cursor: pointer;
}
.mentor-subtema-list {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    padding-left: 2rem;
}
.mentor-subtema-label {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    color: var(--text-secondary);
    font-weight: 500;
    cursor: pointer;
}
.mentor-subtema-label:hover span {
    color: var(--text-primary);
}
.mentor-subtema-label input[type='checkbox'] {
    margin-top: 0.25rem;
}

/* Disponibilidade (Fieldset) */
.mentor-config-grid {
    display: grid;
    grid-template-columns: 1fr 1.5fr;
    gap: 1.5rem;
    margin-bottom: 1rem;
}
.config-group fieldset {
    border: 1px solid var(--border-color);
    background: var(--bg-secondary);
    border-radius: var(--radius-lg);
    padding: 1.5rem;
    height: 100%;
}
.config-group legend {
    font-weight: 600;
    color: var(--text-primary);
    padding: 0 0.5rem;
    margin-left: 0.5rem;
    font-size: 1rem;
}
.checkbox-group-horizontal,
.checkbox-group-vertical {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    margin-top: 0.5rem;
}
.checkbox-group-vertical {
    flex-direction: column;
}
/* Inputs e Selects */
label input[type='checkbox'] {
    accent-color: var(--mentor-color);
    transform: scale(1.1);
    margin-right: 0.5rem;
}
.form-control {
    width: 100%;
}
/* Ações do Formulário */
.mentor-form-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 3rem;
    border-top: 1px solid var(--border-color);
    padding-top: 1.5rem;
}
#mentor-gerar-plano-btn {
    background: var(--praxis-primary);
}

/* ==================================
 * === (v3.0) FASE 3: Plano Vivo ===
 * (Responsividade Mobile Inclusa - Item 3)
 * ================================== */

.mentor-plano-container {
    display: flex;
    flex-direction: column;
    /* Ocupa 100% da altura do main-content (menos o padding) */
    height: calc(100vh - (var(--spacing-6) * 2));
    max-width: 100%;
    margin: 0 auto;
}

/* --- Header do Plano --- */
.mentor-plano-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 1rem;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid var(--border-color);
    flex-shrink: 0;
}
.mentor-header-info h2 {
    margin: 0;
    color: var(--mentor-color);
    font-size: 1.8rem;
}
.mentor-header-info p {
    margin: 0;
    color: var(--text-muted);
    font-weight: 500;
}
.mentor-plano-actions {
    display: flex;
    gap: 1rem;
}
/* Botão "Meus Planos" */
#mentor-plano-voltar-btn {
    background-color: var(--bg-tertiary);
    border-color: var(--border-color);
}
#mentor-plano-voltar-btn:hover {
    background-color: var(--gray-700);
}

/* --- NOVO: Calendário Mobile (Item 3) --- */
#mentor-plano-dia-select-mobile {
    display: none; /* Oculto no desktop */
}
.mentor-mobile-week-view {
    display: none; /* Oculto no desktop */
    margin-top: 1.5rem;
    flex-shrink: 0;
}
.mobile-week-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
    padding: 0 0.5rem;
}
.mobile-week-header h3 {
    margin: 0;
    font-size: 1.25rem;
}
.mobile-week-nav button {
    background: none;
    border: none;
    color: var(--text-primary);
    font-size: 1.25rem;
    cursor: pointer;
    padding: 0.5rem;
}
/* Container rolável */
.mobile-week-days {
    display: flex;
    overflow-x: auto;
    gap: 0.75rem;
    padding: 0.5rem;
    /* Esconde a barra de rolagem */
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none; /* IE/Edge */
}
.mobile-week-days::-webkit-scrollbar {
    display: none; /* Chrome/Safari */
}
/* Card de cada dia */
.mobile-day-card {
    flex: 0 0 65px; /* Largura fixa para cada dia */
    padding: 0.75rem 0.5rem;
    border-radius: var(--radius-lg);
    border: 2px solid var(--border-color);
    background-color: var(--bg-secondary);
    text-align: center;
    cursor: pointer;
    transition: all var(--transition-fast);
}
.mobile-day-card.no-tasks {
    background-color: var(--bg-primary);
    opacity: 0.7;
    cursor: default;
}
.mobile-day-card .day-name {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--text-muted);
    text-transform: uppercase;
}
.mobile-day-card .day-number {
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0.25rem 0;
}
.mobile-day-card .day-status {
    font-size: 1rem;
    line-height: 1;
}
/* Estados do card */
.mobile-day-card.active {
    border-color: var(--mentor-color);
    background-color: var(--mentor-color-faded);
}
.mobile-day-card.active .day-name,
.mobile-day-card.active .day-number {
    color: var(--mentor-color);
}
.mobile-day-card.today .day-number {
    color: var(--mentor-color);
}
.mobile-day-card.concluido .day-status {
    color: var(--success-color);
}
.mobile-day-card.vencido .day-status {
    color: var(--error-color);
}
/* --- FIM: Calendário Mobile --- */

/* --- Layout Principal (Mestre-Detalhe) --- */
.mentor-plano-layout {
    display: flex;
    flex-grow: 1;
    overflow: hidden;
    margin-top: 1.5rem;
    gap: 1.5rem;
}

/* --- CALENDÁRIO (Desktop) --- */
.mentor-calendar-container {
    width: 420px;
    flex-shrink: 0;
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-lg);
    overflow: hidden;
    display: flex;
    flex-direction: column;
}
.mentor-calendar-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem 1.5rem;
    border-bottom: 1px solid var(--border-color);
}
.mentor-calendar-header h3 {
    margin: 0;
    font-size: 1.25rem;
}
.calendar-nav button {
    background: none;
    border: none;
    color: var(--text-primary);
    font-size: 1.25rem;
    cursor: pointer;
    padding: 0.5rem;
    border-radius: var(--radius-md);
}
.calendar-nav button:hover {
    background-color: var(--bg-tertiary);
}
.calendar-weekdays {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    text-align: center;
    padding: 0.75rem 0.5rem;
    border-bottom: 1px solid var(--border-color);
}
.calendar-weekdays div {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--text-muted);
    text-transform: uppercase;
}
.calendar-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 1px;
    background-color: var(--border-color);
    flex-grow: 1;
}
/* Bloco Corrigido (Altura reduzida para 50px) */
.calendar-day {
    position: relative;
    padding: 0.5rem;
    min-height: 50px; /* <--- Reduzimos de 60px para 50px */
    background-color: var(--bg-secondary);
    color: var(--text-muted);
    font-weight: 600;
    transition: all var(--transition-fast);

    /* --- (PATCH) Bug #6: Centraliza o número do dia --- */
    text-align: center;
}
.calendar-day.other-month {
    background-color: var(--bg-primary);
    opacity: 0.5;
}
.calendar-day.has-tasks {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
    cursor: pointer;
    box-shadow: inset 0 0 0 1px var(--mentor-color-faded);
}
.calendar-day.has-tasks:hover {
    background-color: var(--bg-secondary);
    box-shadow: inset 0 0 0 2px var(--mentor-color);
}
.calendar-day.active {
    background-color: var(--mentor-color-faded);
    box-shadow: inset 0 0 0 2px var(--mentor-color);
}
.calendar-day .day-status-icon {
    position: absolute;
    bottom: 5px;
    right: 5px;
    font-size: 1rem;
}
.calendar-day .day-status-icon.concluido {
    color: var(--success-color);
}
.calendar-day .day-status-icon.vencido {
    color: var(--error-color);
}
.calendar-day.today .day-number {
    background-color: var(--mentor-color);
    color: var(--bg-primary);
    border-radius: 50%;
    width: 24px;
    height: 24px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* --- Conteúdo do Dia (Detalhe) --- */
.mentor-dia-conteudo {
    flex-grow: 1;
    overflow-y: auto;
    padding-right: 0.5rem;
}
/* Scrollbar estilo Práxis */
.mentor-dia-conteudo::-webkit-scrollbar {
    width: 8px;
}
.mentor-dia-conteudo::-webkit-scrollbar-track {
    background: var(--bg-secondary);
    border-radius: var(--radius-sm);
}
.mentor-dia-conteudo::-webkit-scrollbar-thumb {
    background: var(--border-color);
    border-radius: var(--radius-sm);
}
.mentor-dia-conteudo::-webkit-scrollbar-thumb:hover {
    background: var(--text-muted);
}

.mentor-dia-conteudo-header {
    padding: 0.75rem 1.25rem;
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-lg);
    margin-bottom: 1.5rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.mentor-dia-conteudo-header h3 {
    margin: 0;
    font-size: 1.5rem;
}
.mentor-dia-conteudo-header span {
    font-size: 1.1rem;
    color: var(--text-muted);
    font-weight: 500;
}

.mentor-turno-card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-lg);
    margin-bottom: 1.5rem;
    overflow: hidden; /* Garante que o header arredondado funcione */
}
.mentor-turno-header {
    font-size: 1.1rem;
    padding: 0.75rem 1.25rem;
    margin: 0;
    border-bottom: 1px solid var(--border-color);
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

/* Tarefas (Estilo "Todoist") */
.mentor-tarefa-item {
    display: flex;
    gap: 1rem;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid var(--border-color);
    transition: background-color var(--transition-fast);
}
.mentor-tarefa-item:last-child {
    border-bottom: none;
}
.mentor-task-checkbox {
    flex-shrink: 0;
    padding-top: 0.2rem;
}
.mentor-task-checkbox input[type='checkbox'] {
    transform: scale(1.3);
    accent-color: var(--mentor-color);
    cursor: pointer;
}
.mentor-tarefa-content {
    flex-grow: 1;
}
.mentor-tarefa-titulo {
    font-size: 1rem;
    font-weight: 600;
    color: var(--text-primary);
    margin-bottom: 0.25rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
.mentor-tarefa-titulo i {
    color: var(--mentor-color);
    font-size: 0.9rem;
}
.mentor-tarefa-desc {
    font-size: 0.9rem;
    color: var(--text-muted);
    margin: 0 0 0.75rem 0;
}
.mentor-tarefa-link {
    font-size: 0.85rem;
    font-weight: 500;
    color: var(--mentor-color);
    text-decoration: none;
    background-color: var(--mentor-color-faded);
    padding: 0.25rem 0.5rem;
    border-radius: var(--radius-sm);
    cursor: pointer;
    transition: all var(--transition-fast);
}
.mentor-tarefa-link:hover {
    background-color: var(--mentor-color);
    color: white;
}
.mentor-tarefa-anotacao {
    flex-shrink: 0;
}
.btn-anotacao {
    padding: 0.3rem 0.6rem;
    font-size: 0.8rem;
    background-color: var(--bg-tertiary);
}
.btn-anotacao i.fa-comment-dots {
    color: var(--mentor-color);
}
.mentor-tarefa-item.tarefa-concluida {
    background-color: var(--bg-tertiary);
}
.mentor-tarefa-item.tarefa-concluida .mentor-tarefa-content {
    opacity: 0.6;
}
.mentor-tarefa-item.tarefa-concluida .mentor-tarefa-titulo {
    text-decoration: line-through;
}

/* Stats de Questões */
.mentor-questao-stats {
    margin-top: 1rem;
    background: var(--bg-primary);
    border-top: 1px dashed var(--border-color);
    padding: 1rem 0 0.5rem 0;
}
.mentor-questao-stats p {
    font-size: 0.9rem;
    color: var(--text-muted);
    font-weight: 500;
    margin: 0 0 0.5rem 0;
}
.mentor-questao-stats strong {
    color: var(--text-primary);
    font-size: 1rem;
}
.mentor-questao-stats .stat-acertos {
    color: var(--success-color);
}
.mentor-questao-stats .stat-erros {
    color: var(--error-color);
}
.mentor-questao-stats .stat-percentual {
    color: var(--mentor-color);
}
.mentor-stats-historico {
    margin-top: 0.5rem;
    font-size: 0.8rem;
    color: var(--text-muted);
}

/* Modal de Ação/Stats */
#mentor-acao-modal .modal-content {
    max-width: 700px;
}
.mentor-stats-form {
    display: flex;
    gap: 1rem;
    align-items: center;
}
.mentor-stats-form .form-group {
    flex-grow: 1;
}
#mentor-stats-feedback {
    margin-top: 1rem;
    font-weight: 600;
    font-size: 1.1rem;
    text-align: center;
}

/* Modal de Anotação */
#mentor-anotacao-modal .modal-content {
    max-width: 600px;
}
#mentor-anotacao-modal textarea {
    width: 100%;
    min-height: 250px;
    resize: vertical;
}

/* ==================================
 * === (v3.0) Responsividade Mobile ===
 * ================================== */

/* Tablets e Mobile (Ativa a sidebar mobile do praxis.js) */
@media (max-width: 1024px) {
    #main-content {
        padding: var(--spacing-6);
        /* A lógica de margin-left é controlada pelo praxis.js */
    }
}

/* Mobile (Ativa o Calendário de Semana) */
@media (max-width: 900px) {
    .mentor-plano-container {
        height: auto; /* Altura automática em mobile */
    }
    .mentor-plano-layout {
        flex-direction: column;
        overflow: visible;
        margin-top: 0;
    }

    /* Esconde Calendário Desktop */
    .mentor-calendar-container {
        display: none;
    }
    /* Mostra Calendário Mobile */
    .mentor-mobile-week-view {
        display: block;
    }

    /* Conteúdo do Dia */
    .mentor-dia-conteudo {
        margin-left: 0;
        margin-top: 1.5rem;
        padding-right: 0;
        overflow-y: visible; /* Remove scroll interno */
    }

    /* Fases 1 e 2 */
    .mentor-wrapper {
        padding: var(--spacing-4);
    }
    .mentor-fase1-opcoes {
        grid-template-columns: 1fr;
    }
    .mentor-config-grid {
        grid-template-columns: 1fr;
    }
    .mentor-form-actions {
        flex-direction: column;
        gap: 1rem;
    }
    .mentor-form-actions button {
        width: 100%;
    }
}

@media (max-width: 600px) {
    .mentor-plano-header {
        flex-direction: column;
        align-items: flex-start;
    }
    .mentor-plano-actions {
        width: 100%;
        justify-content: space-between;
    }
    .mentor-dia-conteudo-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }
    .mentor-stats-form {
        flex-direction: column;
        align-items: stretch;
    }
}

/* ==================================
 * === (v3.1) PATCH - CORREÇÕES FINAIS ===
 * ================================== */

/* --- Estilos para Modal de Colar Texto (Item 7) --- */
#mentor-colar-modal .modal-content {
    max-width: 700px; /* Largura do modal */
}
#mentor-texto-input {
    width: 100%;
    min-height: 300px; /* Altura mínima */
    max-height: 60vh; /* Altura máxima (scroll) */
    padding: var(--spacing-3);
    font-size: var(--font-size-sm);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-md);
    background-color: var(--bg-primary);
    color: var(--text-primary);
    resize: vertical; /* Permite redimensionar verticalmente */
    line-height: 1.6;
    font-family: var(--font-family);
}

/* --- Correção Layout Card Mobile (Item 3) --- */
@media (max-width: 600px) {
    .mentor-plano-card {
        flex-direction: column; /* Empilha info e ações */
        align-items: stretch; /* Ocupa largura total */
    }
    .mentor-plano-card-actions {
        flex-direction: column; /* Empilha botões */
        gap: 0.5rem;
        margin-top: 1rem;
    }
    .mentor-plano-card-actions .btn {
        width: 100%; /* Botões ocupam 100% */
        justify-content: center;
    }
    .mentor-plano-card-actions .btn-secondary {
        /* No mobile, o botão delete vira "Excluir" */
        background-color: var(--error-color);
        border-color: var(--error-color);
        color: white;
    }
}

/* ==================================
 * === (PATCH) Correções de Bugs (2, 3) ===
 * ================================== */

/* --- Correção Bug #2: Botão "X" do Modal --- */
.modal-header {
    /* Necessário para o posicionamento absoluto do 'x' */
    position: relative;
    /* Espaço para o botão */
    padding-right: 3.5rem;
}

.btn-close {
    position: absolute;
    top: 0.75rem;
    right: 0.75rem;
    padding: 0.5rem 0.75rem;
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1;
    color: var(--text-muted);
    background-color: transparent;
    border: none;
    border-radius: var(--radius-md);
    cursor: pointer;
    opacity: 0.7;
    transition: all var(--transition-fast);
}
.btn-close:hover {
    color: var(--text-primary);
    background-color: var(--bg-tertiary);
    opacity: 1;
}

/* --- Correção Bug #3: Espaçamento Ícone-Botão --- */
.btn > i,
.btn > svg {
    /* Adiciona espaço entre o ícone e o texto */
    margin-right: 0.5rem;
    vertical-align: middle;
    /* Correção de alinhamento do FontAwesome */
    vertical-align: -0.125em;
}

/* Overrides para botões que são APENAS ícones */
.btn-small > i,
.btn-anotacao > i,
.calendar-nav > button > i,
.mobile-week-nav > button > i,
.btn-close {
    /* Remove a margem para botões que só têm ícone */
    margin-right: 0;
}

/* ==================================
 * === (MELHORIA) Nivelamento de Conhecimento ===
 * ================================== */
.mentor-subtema-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
}

.mentor-subtema-label {
    /* Ajusta a label para não ocupar 100% */
    flex-grow: 1;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    color: var(--text-secondary);
    font-weight: 500;
    cursor: pointer;
}

.mentor-subtema-nivel {
    display: flex;
    gap: 0.25rem;
    flex-shrink: 0;
}

/* Esconde o radio button original */
.mentor-subtema-nivel input[type='radio'] {
    display: none;
}

/* Estiliza a label do radio como um botão */
.mentor-subtema-nivel label {
    display: inline-block;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    cursor: pointer;
    border: 2px solid var(--border-color);
    background-color: var(--bg-tertiary);
    transition: all var(--transition-fast);
    font-size: 0.8rem;
    line-height: 24px;
    text-align: center;
    color: var(--text-muted);
    font-weight: 700;
}

/* Estilos de seleção (COM MELHOR DESTAQUE) */
.mentor-subtema-nivel input[type='radio']:checked + label {
    transform: scale(1.15); /* Mais destaque */
    color: var(--bg-primary);
    box-shadow: 0 0 10px 2px var(--border-color); /* Destaque com sombra */
}

/* Nível 1: Não Sei (SELETOR CORRIGIDO) */
.mentor-subtema-nivel input[value='nao-sei']:checked + label {
    background-color: var(--error-color);
    border-color: var(--error-color);
    box-shadow: 0 0 10px 2px var(--error-color); /* Sombra da cor */
}
.mentor-subtema-nivel label.nivel-nao-sei:hover {
    border-color: var(--error-color);
}

/* Nível 2: Razoável (SELETOR CORRIGIDO) */
.mentor-subtema-nivel input[value='razoavel']:checked + label {
    background-color: var(--warning-color);
    border-color: var(--warning-color);
    box-shadow: 0 0 10px 2px var(--warning-color); /* Sombra da cor */
}
.mentor-subtema-nivel label.nivel-razoavel:hover {
    border-color: var(--warning-color);
}

/* Nível 3: Domino (SELETOR CORRIGIDO) */
.mentor-subtema-nivel input[value='domino']:checked + label {
    background-color: var(--success-color);
    border-color: var(--success-color);
    box-shadow: 0 0 10px 2px var(--success-color); /* Sombra da cor */
}
.mentor-subtema-nivel label.nivel-domino:hover {
    border-color: var(--success-color);
}

/* ==================================
 * === (MELHORIA) Dashboard de Desempenho ===
 * ================================== */
.mentor-desempenho-wrapper {
    max-width: 900px;
    margin: 0 auto;
    padding: var(--spacing-6);
}

.desempenho-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 1.5rem;
    margin-top: 2rem;
}

.desempenho-card {
    background-color: var(--card-bg);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-lg);
    padding: 1.5rem;
    box-shadow: var(--shadow-sm);
}
.desempenho-card h4 {
    margin: 0 0 1rem 0;
    font-size: 1.2rem;
    color: var(--text-primary);
    border-bottom: 1px solid var(--border-color);
    padding-bottom: 0.75rem;
}
.desempenho-stats {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 1.5rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
}
.desempenho-stats .percentual {
    color: var(--mentor-color);
}
.desempenho-stats .fracao {
    font-size: 1rem;
    color: var(--text-muted);
}
.desempenho-barra-container {
    width: 100%;
    height: 12px;
    background-color: var(--bg-tertiary);
    border-radius: var(--radius-sm);
    overflow: hidden;
}
.desempenho-barra-fill {
    height: 100%;
    background: linear-gradient(
        90deg,
        var(--mentor-color),
        var(--praxis-secondary)
    );
    border-radius: var(--radius-sm);
    transition: width 0.5s ease;
}

/* ==================================
 * === (MELHORIA) Drill-down Desempenho ===
 * ================================== */

.desempenho-card.clickable {
    cursor: pointer;
    transition: all var(--transition-fast);
}
.desempenho-card.clickable:hover {
    border-color: var(--mentor-color);
    transform: translateY(-2px);
    box-shadow: var(--shadow-md);
}
.desempenho-card h4 .fas {
    float: right;
    opacity: 0.5;
    font-size: 1rem;
    margin-top: 0.25rem;
    transition: all var(--transition-fast);
}
.desempenho-card.clickable:hover h4 .fas {
    opacity: 1;
    color: var(--mentor-color);
    transform: translateX(4px);
}

/* ==================================
 * === (MELHORIA) Chat Mentor Widget ===
 * ================================== */

.chat-mentor-fab {
    position: fixed;
    bottom: 25px;
    right: 25px;
    width: 60px;
    height: 60px;
    background: linear-gradient(
        135deg,
        var(--praxis-primary),
        var(--praxis-primary-dark)
    );
    color: white;
    border-radius: 50%;
    border: none;
    font-size: 1.8rem;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: var(--shadow-lg);
    z-index: 998;
    transition: all var(--transition-fast);
}
.chat-mentor-fab:hover {
    transform: scale(1.1);
    box-shadow: var(--shadow-xl);
}

.chat-mentor-widget {
    position: fixed;
    bottom: 100px;
    right: 25px;
    width: 370px;
    height: 500px;
    max-height: calc(100vh - 120px);
    background-color: var(--card-bg);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-xl);
    z-index: 999;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    /* Animação */
    transform: translateY(20px);
    opacity: 0;
    visibility: hidden;
    transition: all var(--transition-fast);
}
.chat-mentor-widget.active {
    transform: translateY(0);
    opacity: 1;
    visibility: visible;
}

.chat-mentor-header {
    padding: 1rem 1.5rem;
    background-color: var(--bg-secondary);
    border-bottom: 1px solid var(--border-color);
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-shrink: 0;
}
.chat-mentor-header h4 {
    margin: 0;
    color: var(--mentor-color);
    font-size: 1.2rem;
}
.chat-mentor-header .btn-close {
    /* Reutiliza o estilo do modal */
    position: static;
    font-size: 1.2rem;
    padding: 0.25rem 0.5rem;
}

.chat-mentor-messages {
    flex-grow: 1;
    overflow-y: auto;
    padding: 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}
.message-bubble {
    padding: 0.75rem 1rem;
    border-radius: var(--radius-lg);
    max-width: 80%;
    line-height: 1.5;
}
.message-bubble.bot {
    background-color: var(--bg-secondary);
    border-bottom-left-radius: var(--radius-sm);
    align-self: flex-start;
    color: var(--text-primary);
}
.message-bubble.user {
    background-color: var(--mentor-color);
    border-bottom-right-radius: var(--radius-sm);
    align-self: flex-end;
    color: white;
}
.message-bubble.typing {
    background-color: var(--bg-secondary);
    border-bottom-left-radius: var(--radius-sm);
    align-self: flex-start;
    color: var(--text-muted);
    font-style: italic;
}

.chat-mentor-input {
    border-top: 1px solid var(--border-color);
    padding: 0.75rem;
    display: flex;
    gap: 0.5rem;
    background-color: var(--bg-primary);
}
/* Bloco Corrigido (Substitua o anterior por este) */
.chat-mentor-input input {
    flex-grow: 1;
    border: 1px solid var(--border-color);
    border-radius: var(--radius-md);
    padding: 0.75rem;
    background-color: var(--bg-secondary);
    color: var(--text-primary);

    /* ADIÇÃO: Permite que o input encolha corretamente */
    min-width: 0;
}
.chat-mentor-input input:focus {
    outline: none;
    border-color: var(--mentor-color);
}
.chat-mentor-input button {
    padding: 0 1rem;
    font-size: 1.1rem;
    flex-shrink: 0;

    /* ADIÇÃO: Impede que o botão cresça e "esmague" o input */
    flex-grow: 0;
}

/* Responsividade do Chat */
@media (max-width: 600px) {
    .chat-mentor-widget {
        width: calc(100vw - 2rem);
        height: calc(100vh - 9rem);
        max-height: 600px;
        bottom: 80px;
        right: 1rem;
    }
    .chat-mentor-fab {
        bottom: 1rem;
        right: 1rem;
    }
}

/* ==================================
 * === (MELHORIA) Chat Nudge (Proativo) ===
 * ================================== */
.chat-mentor-nudge {
    position: fixed;
    bottom: 100px;
    right: 25px;
    width: 320px;
    background-color: var(--card-bg);
    border: 1px solid var(--mentor-color);
    padding: 1rem 1.25rem;
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-xl);
    z-index: 997;
    cursor: pointer;

    /* Animação */
    transform: translateY(20px);
    opacity: 0;
    visibility: hidden;
    transition: all 0.4s ease;
}
.chat-mentor-nudge.active {
    transform: translateY(0);
    opacity: 1;
    visibility: visible;
}
.chat-mentor-nudge p {
    margin: 0;
    color: var(--text-primary);
    line-height: 1.5;
}
.chat-mentor-nudge p strong {
    color: var(--mentor-color);
}
.chat-mentor-nudge .close-nudge {
    position: absolute;
    top: 5px;
    right: 5px;
    background: none;
    border: none;
    color: var(--text-muted);
    cursor: pointer;
    font-size: 1rem;
    padding: 0.25rem 0.5rem;
}

@media (max-width: 600px) {
    .chat-mentor-nudge {
        width: calc(100vw - 2rem);
        bottom: 80px;
        right: 1rem;
    }
}

/* ==================================
 * === (PATCH URGENTE) Correção Nivelamento ===
 * ================================== */

/* 1. Nova Legenda (para Mobile) */
.mentor-nivel-legenda {
    display: flex;
    justify-content: center;
    gap: 1.5rem;
    background-color: var(--bg-secondary);
    padding: 0.75rem 1rem;
    border-radius: var(--radius-md);
    margin: 1rem 0;
    flex-wrap: wrap;
}
.mentor-nivel-legenda span {
    font-size: 0.9rem;
    font-weight: 500;
    color: var(--text-muted);
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
/* Bolinhas da legenda */
.mentor-nivel-legenda span::before {
    content: '';
    display: inline-block;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    border: 2px solid var(--border-color);
}
.mentor-nivel-legenda span.legenda-nao-sei::before {
    background-color: var(--error-color);
    content: '?';
    font-size: 0.8rem;
    font-weight: 700;
    line-height: 17px;
    text-align: center;
    color: white;
}
.mentor-nivel-legenda span.legenda-razoavel::before {
    background-color: var(--warning-color);
    content: '!';
    font-size: 0.8rem;
    font-weight: 700;
    line-height: 17px;
    text-align: center;
    color: white;
}
.mentor-nivel-legenda span.legenda-domino::before {
    background-color: var(--success-color);
    content: '✓';
    font-size: 0.8rem;
    font-weight: 700;
    line-height: 17px;
    text-align: center;
    color: white;
}

/* 2. Estilo do Tópico Desabilitado */
.mentor-subtema-item.disabled-topic .mentor-subtema-label {
    opacity: 0.5;
    text-decoration: line-through;
    color: var(--text-muted);
}
.mentor-subtema-item.disabled-topic .mentor-subtema-nivel {
    opacity: 0.4;
    pointer-events: none;
}
.mentor-subtema-item.disabled-topic .mentor-subtema-nivel label {
    cursor: not-allowed;
}

/* ==================================
 * === (MELHORIA) Gerar Apostila ===
 * ================================== */

/* 1. Novo Botão de Ação (Apostila) */
.btn-apostila {
    font-size: 0.85rem;
    font-weight: 500;
    color: var(--praxis-secondary);
    text-decoration: none;
    background-color: rgba(52, 152, 219, 0.1);
    padding: 0.25rem 0.5rem;
    border-radius: var(--radius-sm);
    cursor: pointer;
    transition: all var(--transition-fast);
    border: none;
    margin-left: 0.5rem; /* Espaço ao lado do "Abrir Link" */
}
.btn-apostila:hover {
    background-color: var(--praxis-secondary);
    color: white;
}
.btn-apostila i {
    margin-right: 0.3rem;
}
/* Estado de "Ler" (quando já gerou) */
.btn-apostila[data-action='ler-apostila'] {
    color: var(--success-color);
    background-color: rgba(16, 185, 129, 0.1);
}
.btn-apostila[data-action='ler-apostila']:hover {
    background-color: var(--success-color);
    color: white;
}

/* 2. Modal da Apostila (Grande) */
#mentor-apostila-modal .modal-content {
    max-width: 900px;
    width: 90vw;
    height: 85vh; /* Modal alto */
    display: flex;
    flex-direction: column;
}
#mentor-apostila-modal .modal-body {
    overflow-y: auto; /* Permite scroll no conteúdo */
    padding: 0 2rem; /* Mais espaço lateral */
    flex-grow: 1;
}

/* 3. Estilos do Conteúdo da Apostila (HTML Gerado) */
.apostila-content {
    line-height: 1.7;
    color: var(--text-secondary);
}
.apostila-content h2 {
    font-size: 1.8rem;
    color: var(--text-primary);
    margin-top: 0;
    margin-bottom: 1rem;
    border-bottom: 2px solid var(--mentor-color);
    padding-bottom: 0.5rem;
}
.apostila-content h3 {
    font-size: 1.4rem;
    color: var(--text-primary);
    margin-top: 2rem;
    margin-bottom: 0.75rem;
}
.apostila-content p {
    font-size: 1rem;
    margin-bottom: 1rem;
}
.apostila-content ul {
    padding-left: 1.5rem;
    margin-bottom: 1rem;
}
.apostila-content li {
    margin-bottom: 0.5rem;
}
.apostila-content strong {
    color: var(--mentor-color);
    font-weight: 700;
}
.apostila-content code {
    background-color: var(--bg-tertiary);
    padding: 0.2rem 0.4rem;
    border-radius: var(--radius-sm);
    font-family: var(--font-family-mono);
}

/* ==================================
 * === (PATCH) Apostila Loader ===
 * ================================== */
.apostila-loading {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 200px;
    color: var(--text-muted);
}
.apostila-loading .fas {
    font-size: 2.5rem;
    color: var(--mentor-color);
    margin-bottom: 1rem;
}

/* ==================================
 * === (PATCH URGENTE) Correção Scroll Horizontal Apostila ===
 * ================================== */

/* Força a quebra de linha em texto pré-formatado (lei) */
.apostila-content pre,
.apostila-content code {
    white-space: pre-wrap; /* CSS moderno para quebrar <pre> */
    word-wrap: break-word; /* Fallback para browsers antigos */
    word-break: break-all;
}

/* ==================================
 * === (MELHORIA) Painel de Quotas (v2.0 - Compacto) ===
 * ================================== */
#mentor-usage-panel {
    /* --- Regras Comuns (Mobile e Desktop) --- */
    padding: 0.75rem 1rem;
    border-radius: var(--radius-md);
    font-size: 0.85rem;
    font-weight: 500;
    text-align: center;
    border: 1px solid var(--border-color);
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.5rem 1.5rem; /* Aumentei o gap para espaçar mais */
}

/* --- Regras Desktop (Telas > 900px) --- */
@media (min-width: 900.01px) {
    #mentor-usage-panel {
        flex-grow: 1; /* Ocupa o espaço vago no header */
        margin-left: 1.5rem; /* Espaço do título */
        margin-right: 1.5rem; /* Espaço dos botões */
        /* Remove margem vertical, pois está na linha do header */
        margin-top: 0;
        margin-bottom: 0;
    }
}

/* --- Regras Mobile (Telas <= 900px) --- */
@media (max-width: 900px) {
    .mentor-plano-header {
        /* Garante que o painel fique abaixo do título */
        flex-wrap: wrap;
    }
    #mentor-usage-panel {
        /* Força a quebra de linha no mobile */
        order: 3;
        flex-basis: 100%;
        width: 100%; /* Garante que ocupe a largura toda no mobile */
        margin-top: 1rem; /* Adiciona a margem vertical de volta */
    }
}

/* --- Estilos de Cor (Sem alteração) --- */
#mentor-usage-panel.trial {
    background-color: var(--warning-color-faded, #fffbeb);
    border-color: var(--warning-color, #f59e0b);
    color: var(--warning-color-dark, #b45309);
}

#mentor-usage-panel.active {
    background-color: var(--bg-secondary);
    color: var(--text-muted);
}

/* --- Estilos de Conteúdo (Sem alteração) --- */
#mentor-usage-panel strong {
    color: var(--text-primary);
    margin-right: 0.5rem;
}

#mentor-usage-panel span {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}
#mentor-usage-panel i {
    opacity: 0.7;
}

/* (A regra de responsividade @media (max-width: 900px) anterior foi dividida
   para maior controle entre desktop e mobile) */

/* ==================================
 * === (NOVO) Estilos do Quiz (Importado do Lexia) ===
 * ================================== */

/* --- Contêiner do Quiz --- */
.quiz-container-mentor {
    max-width: 900px;
    margin: 0 auto;
    background-color: var(--card-bg);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-lg);
    overflow: hidden;
    /* Adicionado para se encaixar no layout do mentor */
    margin-top: var(--spacing-6);
}

.quiz-header-mentor {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--spacing-4) var(--spacing-6);
    border-bottom: 1px solid var(--border-color);
    background-color: var(--bg-secondary);
}

.quiz-header-mentor h2 {
    font-size: var(--font-size-xl);
    color: var(--mentor-color);
    margin: 0;
}

.quiz-progress-mentor {
    font-size: var(--font-size-sm);
    color: var(--text-muted);
    font-weight: 500;
}

/* --- Enunciado da Questão --- */
.quiz-question-mentor {
    padding: var(--spacing-6);
}

.question-text-container-mentor {
    margin-bottom: var(--spacing-6);
}

.question-text-mentor {
    font-size: var(--font-size-lg);
    line-height: 1.6;
    color: var(--text-primary);
    white-space: pre-wrap; /* Mantém quebras de linha do enunciado */
}

/* --- Opções do Quiz (Com Tesoura ✂️) --- */
.quiz-options-mentor {
    list-style: none;
    margin: 0;
    padding: 0;
    padding-left: 52px; /* Espaço para o botão ✂️ */
    position: relative;
}

.quiz-options-mentor li {
    position: relative;
    padding: var(--spacing-4) var(--spacing-5);
    padding-left: var(--spacing-10);
    margin-bottom: var(--spacing-3);
    background-color: var(--card-bg);
    border: 2px solid var(--border-color);
    border-radius: var(--radius-lg);
    cursor: pointer;
    transition: all var(--transition-fast);
    font-size: var(--font-size-base);
    overflow: visible;
    min-height: 52px;
}
.quiz-options-mentor li:not(.answered):hover {
    border-color: var(--mentor-color);
    background-color: var(--mentor-color-faded);
    transform: translateX(4px);
}
.quiz-options-mentor li.selected {
    border-color: var(--mentor-color);
    background-color: var(--mentor-color-faded);
    color: var(--mentor-color);
    font-weight: 500;
}

/* Botão Descartar ✂️ */
.discard-option-btn-mentor {
    position: absolute;
    left: -46px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;
    padding: var(--spacing-2);
    font-size: var(--font-size-lg);
    color: var(--text-muted);
    background-color: var(--bg-primary);
    border: 1px solid var(--border-color);
    cursor: pointer;
    border-radius: 50%;
    transition: all var(--transition-fast);
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: var(--shadow-sm);
}
.discard-option-btn-mentor:hover {
    color: var(--error-color);
    background-color: rgba(239, 68, 68, 0.1);
    border-color: rgba(239, 68, 68, 0.3);
}

/* Conteúdo da Opção (Letra + Texto) */
.option-content-mentor {
    display: flex;
    align-items: flex-start;
    gap: var(--spacing-3);
    width: 100%;
}
.option-letter-mentor {
    font-weight: 700;
    color: var(--mentor-color);
    font-size: var(--font-size-lg);
    min-width: 24px;
    text-align: center;
    flex-shrink: 0;
    margin-top: 1px;
}
.option-text-mentor {
    flex: 1;
    line-height: 1.5;
    color: var(--text-secondary);
}
li.selected .option-text-mentor {
    color: var(--mentor-color);
}

/* Opção Descartada */
li.option-discarded-mentor {
    opacity: 0.6;
    background-color: var(--bg-secondary);
}
li.option-discarded-mentor .option-content-mentor {
    text-decoration: line-through;
    text-decoration-color: var(--error-color);
}
li.option-discarded-mentor:hover {
    transform: none;
    background-color: var(--bg-secondary);
}
li.option-discarded-mentor .discard-option-btn-mentor {
    color: var(--error-color);
}

/* Estado Respondido */
.quiz-options-mentor.answered .discard-option-btn-mentor {
    display: none;
}
.quiz-options-mentor.answered {
    padding-left: 0;
}
.quiz-options-mentor.answered li {
    margin-left: 0;
    padding-left: var(--spacing-10);
    cursor: default;
    pointer-events: none;
    overflow: hidden;
    display: block;
    min-height: auto;
    padding-bottom: var(--spacing-3);
}
.quiz-options-mentor.answered li .option-letter-mentor {
    position: static;
    transform: none;
}
.quiz-options-mentor.answered li.correct {
    border-color: var(--success-color);
    background-color: rgba(16, 185, 129, 0.08);
}
.quiz-options-mentor.answered li.incorrect.user-selected {
    border-color: var(--error-color);
    background-color: rgba(239, 68, 68, 0.08);
}
.quiz-options-mentor.answered li.user-selected:not(.correct) {
    box-shadow: inset 0 0 0 2px var(--border-color);
}
.quiz-options-mentor.answered li:not(.correct):not(.user-selected) {
    opacity: 0.7;
    background-color: var(--bg-secondary);
}

/* Explicações (Feedback) */
.option-explanation-mentor {
    margin-top: var(--spacing-3);
    padding-top: var(--spacing-3);
    border-top: 1px dashed var(--border-color);
    font-size: var(--font-size-sm);
    line-height: 1.5;
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: max-height 0.5s ease-out, opacity 0.5s ease-out;
    width: 100%;
    color: var(--text-secondary); /* Cor base do feedback */
}
.quiz-options-mentor.answered .option-explanation-mentor {
    max-height: 500px; /* Permite que o feedback apareça */
    opacity: 1;
}
.quiz-options-mentor.answered li.correct .option-explanation-mentor {
    color: var(--success-color); /* Feedback correto */
}
.quiz-options-mentor.answered
    li.incorrect.user-selected
    .option-explanation-mentor {
    color: var(--error-color); /* Feedback da errada que o usuário marcou */
}
.option-explanation-mentor p {
    margin: 0;
}

/* Controles do Quiz (Pular, Voltar, Confirmar) */
.quiz-controls-mentor {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: var(--spacing-4);
    margin-top: var(--spacing-6);
    padding: var(--spacing-4) var(--spacing-6);
    border-top: 1px solid var(--border-color);
    background-color: var(--bg-secondary);
}
.quiz-controls-mentor-center {
    display: flex;
    gap: var(--spacing-4);
    justify-content: center;
    flex-grow: 1;
}
.quiz-controls-mentor .btn {
    width: auto;
    flex-grow: 1;
}
.quiz-controls-mentor .btn-nav {
    max-width: 150px;
    flex-grow: 0;
    flex-shrink: 0;
}
.quiz-controls-mentor #mentor-quiz-confirm {
    max-width: 250px;
}

/* Responsividade do Quiz */
@media (max-width: 480px) {
    .quiz-options-mentor {
        padding-left: 44px;
    }
    .quiz-options-mentor li {
        padding-left: var(--spacing-8);
        min-height: 48px;
    }
    .discard-option-btn-mentor {
        left: -38px;
        width: 32px;
        height: 32px;
    }
    .option-letter-mentor {
        font-size: var(--font-size-base);
        min-width: 20px;
    }
    .quiz-options-mentor.answered {
        padding-left: 0;
    }
    .quiz-options-mentor.answered li {
        padding-left: var(--spacing-8);
    }

    .quiz-controls-mentor {
        flex-direction: column;
    }
    .quiz-controls-mentor-center {
        width: 100%;
        order: -1; /* Botões centrais primeiro */
    }
    .quiz-controls-mentor .btn,
    .quiz-controls-mentor .btn-nav {
        width: 100%;
        max-width: none;
    }
    .quiz-controls-mentor .btn-nav:first-child {
        margin-top: var(--spacing-2);
    }
}

/* ==================================
 * === CORREÇÕES DE ESTILO (BUGS 1 e 2) - v4.0 (Definitivo) ===
 * ================================== */

/* 1. Correção Bug Chat (Mobile)
 * Define regras explícitas de flexbox para o input e o botão
 * para forçar o layout correto em navegadores mobile.
 */
.chat-mentor-input input {
    /* O input deve crescer (1) e encolher (1) a partir de 0 (basis 0%) */
    flex: 1 1 0;

    /* Correção crítica para permitir encolhimento */
    min-width: 0;

    /* (Estilos originais - mantenha-os) */
    border: 1px solid var(--border-color);
    border-radius: var(--radius-md);
    padding: 0.75rem;
    background-color: var(--bg-secondary);
    color: var(--text-primary);
}

.chat-mentor-input button {
    /* O botão NÃO deve crescer (0), NÃO deve encolher (0) e seu tamanho é 'auto' */
    flex: 0 0 auto;

    /* (Estilos originais - mantenha-os) */
    padding: 0 1rem;
    font-size: 1.1rem;
}

/* 2. Correção Espaçamento Botões (Tarefas) - Mantida */
.mentor-tarefa-link {
    display: inline-block;
    vertical-align: middle;
    margin-bottom: 0.5rem; /* Margem para quebra de linha */
}

.btn-apostila {
    vertical-align: middle;
    margin-bottom: 0.5rem; /* Margem para quebra de linha */
}

.chat-mentor-input {
    border-top: 1px solid var(--border-color);
    padding: 0.75rem;
    display: flex;
    gap: 0.5rem;
    background-color: var(--bg-primary);
}

.chat-mentor-input input {
    flex: 1 1 auto; /* cresce + encolhe proporcionalmente */
    min-width: 0; /* evita esmagar layout */
    border: 1px solid var(--border-color);
    border-radius: var(--radius-md);
    padding: 0.75rem;
    background-color: var(--bg-secondary);
    color: var(--text-primary);
}

.chat-mentor-input button {
    flex: 0 0 48px; /* TAMANHO FIXO E ELEGANTE */
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    font-size: 1.1rem;
}

/* ==================================
 * === (v3.4) Layout Compacto de Tarefas ===
 * ================================== */

/* Container dos botões */
.mentor-task-toolbar {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: 0.75rem;
    margin-bottom: 0.5rem;
}

/* Estilo Base dos Botões Compactos */
.mentor-btn-compact {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    padding: 0.35rem 0.75rem;
    font-size: 0.85rem;
    font-weight: 500;
    border-radius: var(--radius-sm);
    border: 1px solid transparent;
    cursor: pointer;
    text-decoration: none;
    transition: all 0.2s ease;
    /* Garante altura uniforme */
    line-height: 1.2;
}

/* Cores Específicas */
.btn-action {
    background-color: var(--bg-tertiary);
    color: var(--text-secondary);
    border-color: var(--border-color);
}
.btn-action:hover {
    background-color: var(--mentor-color);
    color: white;
    border-color: var(--mentor-color);
}

.btn-bizu {
    background-color: rgba(16, 185, 129, 0.1); /* Verde suave */
    color: var(--success-color);
}
.btn-bizu:hover {
    background-color: var(--success-color);
    color: white;
}

.btn-bizu-generate {
    background-color: rgba(52, 152, 219, 0.1); /* Azul suave */
    color: var(--praxis-secondary);
}
.btn-bizu-generate:hover {
    background-color: var(--praxis-secondary);
    color: white;
}

.btn-quiz-generate {
    background-color: rgba(155, 89, 182, 0.1); /* Roxo suave */
    color: var(--praxis-primary);
}
.btn-quiz-generate:hover {
    background-color: var(--praxis-primary);
    color: white;
}

/* Barra de Status Unificada (Resultado + Revisar) */
.mentor-stats-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background-color: var(--bg-primary);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-sm);
    padding: 0.4rem 0.75rem;
    margin-top: 0.5rem;
    font-size: 0.85rem;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.mentor-stats-bar.manual {
    background-color: var(--bg-secondary);
    border-style: dashed;
}

.stats-score {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--text-secondary);
}
.stats-score i {
    color: var(--mentor-color);
}
.stats-score strong {
    color: var(--text-primary);
}

/* Botão de Revisar Erros (dentro da barra) */
.mentor-btn-revisar {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    color: var(--error-color);
    font-weight: 600;
    font-size: 0.8rem;
    cursor: pointer;
    text-decoration: none;
    padding: 0.2rem 0.5rem;
    border-radius: var(--radius-sm);
    background-color: rgba(239, 68, 68, 0.05);
    transition: background 0.2s;
}
.mentor-btn-revisar:hover {
    background-color: rgba(239, 68, 68, 0.15);
    text-decoration: underline;
}

/* Ajuste para Mobile: Botões ocupam largura maior para toque fácil */
@media (max-width: 600px) {
    .mentor-task-toolbar {
        gap: 0.5rem;
    }
    .mentor-btn-compact {
        flex-grow: 1; /* Botões crescem para preencher a linha */
        padding: 0.5rem; /* Mais área de toque */
    }
    /* Mantém o botão de Revisar alinhado à direita ou quebra se necessário */
    .mentor-stats-bar {
        flex-direction: row;
    }
}