/**
 * ERT Bauru — Portal do Aluno depois do login ("Nave").
 *
 * Carregada só nas telas do painel do Tutor LMS (ver ert_is_tutor_dashboard_screen()
 * no functions.php do tema filho). Não altera markup nem lógica do plugin: quase tudo
 * aqui é redefinição dos design tokens do Tutor 4 (--tutor-*), que o próprio plugin
 * já usa em toda a folha dele. Para reverter, basta desenfileirar este arquivo.
 */

/* ============================================================
   1. Paleta e tipografia da escola aplicadas aos tokens do Tutor
   ============================================================ */
body.tutor-screen-frontend-dashboard {
	--ert-vinho: #6A2128;
	--ert-vinho-escuro: #3E181C;
	--ert-vinho-profundo: #530101;
	--ert-carvao: #282523;
	--ert-dourado: #7E5433;
	--ert-dourado-claro: #AB7940;
	--ert-dourado-luz: #D9B282;
	--ert-offwhite: #F7F7F7;
	--ert-fio: #E7E1DC;
	--ert-fundo: #F4F1EE;

	/* Fontes da marca (o Tutor lê estes dois tokens em toda a folha dele). */
	--tutor-font-family-body: 'PT Sans';
	--tutor-font-family-heading: 'Source Serif 4';

	/* Superfícies */
	--tutor-surface-base: #F4F1EE;
	--tutor-surface-l1: #FFFFFF;
	--tutor-surface-l1-hover: #FBF9F7;
	--tutor-surface-l2: #EFEAE5;
	--tutor-surface-l3: #F4F1EE;
	--tutor-surface-brand-dark: #3E181C;
	--tutor-surface-brand-secondary: #F4EDE9;
	--tutor-surface-brand-tertiary: #FBF7F5;
	--tutor-surface-brand-quaternary: #F4EDE9;

	/* Texto */
	--tutor-text-primary: #282523;
	--tutor-text-secondary: #4A443F;
	--tutor-text-subdued: #7A736D;
	--tutor-text-brand: #6A2128;
	--tutor-text-brand-hover: #8A2E36;

	/* Bordas e ícones */
	--tutor-border-idle: #E7E1DC;
	--tutor-border-idle2: #E7E1DC;
	--tutor-border-hover: #D6CCC3;
	--tutor-border-brand: #6A2128;
	--tutor-border-brand-secondary: #EADFD8;
	--tutor-icon-brand: #6A2128;
	--tutor-icon-subdued: #9A938D;
	--tutor-icon-hover: #282523;

	/* Abas / itens de menu */
	--tutor-tab-l3: #F4EDE9;
	--tutor-tab-l3-active: #F4EDE9;
	--tutor-tab-l3-hover: #EFE5E0;
	--tutor-tab-sidebar-l2: transparent;
	--tutor-tab-sidebar-l2-active: #F4EDE9;
	--tutor-tab-sidebar-l2-hover: #EFEAE5;

	/* Ações */
	--tutor-actions-brand-primary: #6A2128;
	--tutor-actions-brand-secondary: #F4EDE9;
	--tutor-actions-brand-tertiary: #F4EDE9;
	--tutor-actions-gray-empty: #F4F1EE;
	--tutor-actions-gray-secondary: #EFEAE5;
	--tutor-actions-gray-tertiary: #E7E1DC;

	font-family: 'PT Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	background-color: var(--ert-fundo);
}

/* O cabeçalho público da ERT foi desligado nestas telas (ver functions.php):
   ele duplicava a navegação que a própria barra lateral do painel já faz. Com
   isso a lateral e o cabeçalho do painel voltam a grudar no topo da janela —
   o posicionamento nativo do Tutor, que já trata a barra de admin sozinho. */

/* ============================================================
   2. A nave — barra lateral em vinho
   ============================================================ */
.tutor-dashboard-sidebar {
	/* Tokens redefinidos SÓ dentro da lateral: o resto do painel segue claro. */
	--tutor-surface-sidebar-l1: transparent;
	--tutor-text-primary: rgba(247, 247, 247, .80);
	--tutor-text-brand: #F7F7F7;
	--tutor-text-secondary: rgba(247, 247, 247, .68);
	--tutor-icon-brand: var(--ert-dourado-luz);
	--tutor-icon-subdued: rgba(247, 247, 247, .6);
	--tutor-tab-sidebar-l2-hover: rgba(247, 247, 247, .09);
	--tutor-tab-sidebar-l2-active: rgba(247, 247, 247, .13);
	--tutor-border-idle: rgba(247, 247, 247, .15);

	background: linear-gradient(180deg, #6A2128 0%, #4A1A1F 55%, #3E181C 100%);
	border-inline-end: none;
}

/* O "Explorar cursos" vem do Tutor como position:absolute; bottom:24px — em
   janela baixa ele subia por cima do último item do menu. Em coluna flex ele
   passa a ser empurrado para o fim sem sobrepor nada.

   O min-width é essencial: abaixo de 769px o Tutor esconde a lateral com
   display:none, e um display:flex solto AQUI ganharia dele (mesma
   especificidade, e esta folha carrega depois) — a lateral reaparecia no
   celular ocupando a largura toda e empurrando o painel para baixo. */
@media (min-width: 769px) {
	.tutor-dashboard-sidebar {
		display: flex;
		flex-direction: column;
	}

	.tutor-dashboard-sidebar .tutor-see-all-courses {
		position: static;
		width: auto;
		margin: auto 16px 24px;
	}
}

/* Logo horizontal da escola no lugar do brasão + nome do site.
   O <img> continua no DOM (o alt segue valendo para leitores de tela);
   só a imagem desenhada é trocada. */
.tutor-dashboard-sidebar .tutor-dashboard-sidebar-logo {
	height: 88px;
	padding: 18px 22px;
	border-bottom: 1px solid rgba(247, 247, 247, .16);
}

.tutor-dashboard-sidebar .tutor-dashboard-sidebar-logo img {
	content: url('ert-logo-horizontal.webp');
	width: auto;
	max-width: 100%;
	height: 52px;
	max-height: 100%;
}

/* Caso o site não tenha logo definido, o Tutor imprime o nome em texto. */
.tutor-dashboard-sidebar .tutor-dashboard-sidebar-logo .site-title {
	font-family: 'Source Serif 4', Georgia, serif;
	font-weight: 700;
	font-size: 17px;
	color: var(--ert-offwhite);
}

.tutor-dashboard-sidebar .tutor-dashboard-sidebar-nav ul li a {
	font-weight: 700;
	border-radius: 3px;
}

.tutor-dashboard-sidebar .tutor-dashboard-sidebar-nav ul li a.active {
	box-shadow: inset 3px 0 0 var(--ert-dourado-luz);
}

.tutor-dashboard-sidebar .tutor-dashboard-sidebar-nav ul li a:focus-visible {
	outline: 2px solid var(--ert-dourado-luz) !important;
	outline-offset: -2px;
}

.tutor-dashboard-sidebar .tutor-see-all-courses {
	border-radius: 3px;
	border: 1px solid rgba(247, 247, 247, .22);
	font-weight: 700;
	justify-content: space-between;
}

/* Barra inferior do celular, no mesmo vinho da lateral. */
.tutor-dashboard-nav-mobile {
	--tutor-surface-sidebar-l1: transparent;
	--tutor-text-primary: rgba(247, 247, 247, .72);
	--tutor-text-brand: #F7F7F7;
	--tutor-border-idle: rgba(247, 247, 247, .15);

	background: linear-gradient(180deg, #6A2128 0%, #4A1A1F 100%);
}

.tutor-dashboard-nav-mobile-list > li > a.active,
.tutor-dashboard-nav-mobile-list > li > button.active {
	font-weight: 700;
}

/* O menu "Mais" abre DENTRO da barra inferior e herdava dela o texto quase
   branco — sobre o fundo branco do próprio menu, virava texto invisível.
   Aqui os tokens voltam ao normal só dentro do menu. */
.tutor-dashboard-nav-mobile-more-popover {
	--tutor-text-primary: #282523;
	--tutor-text-secondary: #4A443F;
	--tutor-text-brand: #6A2128;
	--tutor-border-idle: #E7E1DC;

	background: #FFFFFF;
	border-radius: 4px;
	box-shadow: 0 12px 30px rgba(40, 37, 35, .18);
}

.tutor-dashboard-nav-mobile-more-popover ul li a {
	color: #282523;
}

.tutor-dashboard-nav-mobile-more-popover ul li a:hover,
.tutor-dashboard-nav-mobile-more-popover ul li a.active,
.tutor-dashboard-nav-mobile-more-popover ul li a.active span {
	color: #6A2128;
	background: #F4EDE9;
}

.tutor-dashboard-nav-mobile-more-popover [class*='tutor-icon-'] {
	color: #7E5433;
}

/* ============================================================
   3. Miolo do painel
   ============================================================ */

/* O Kit do Elementor pinta TODO h1..h6 do site (48px, "Calisto MT"). Dentro
   do painel isso atropelava os títulos do Tutor — por isso o functions.php
   tira a classe elementor-kit-* do <body> só nestas telas. As linhas abaixo
   só reforçam o que o Tutor já define, caso algum outro tema entre no meio. */
body.tutor-screen-frontend-dashboard .tutor-dashboard-layout :is(h1, h2, h3, h4, h5, h6) {
	font-family: inherit;
	letter-spacing: normal;
}

.tutor-dashboard-header {
	background-color: #FAF8F6;
}

.tutor-dashboard-header .tutor-h5 {
	font-family: 'Source Serif 4', Georgia, serif;
	font-size: 20px;
	font-weight: 600;
	color: var(--ert-carvao);
}

.tutor-dashboard-header .tutor-h5 .tutor-text-subdued {
	color: #7A736D;
}

/* Cartões: cantos discretos, como o resto da identidade (2–4px). */
.tutor-dashboard-layout .tutor-stat-card,
.tutor-dashboard-layout .tutor-progress-card,
.tutor-dashboard-layout .tutor-dashboard-page-card,
.tutor-dashboard-layout .tutor-dashboard-page-card-body,
.tutor-dashboard-layout .tutor-dashboard-page-card-header,
.tutor-dashboard-layout .tutor-card {
	border-radius: 4px;
}

.tutor-dashboard-layout .tutor-stat-card {
	border-top: 3px solid var(--ert-fio);
}

.tutor-dashboard-layout .tutor-stat-card-header {
	gap: 10px;
}

.tutor-dashboard-layout .tutor-stat-card-icon {
	flex: 0 0 auto;
}

.tutor-dashboard-layout .tutor-stat-card-title {
	color: #6F6862;
	font-size: .8125rem;
	letter-spacing: .04em;
	text-transform: uppercase;
	font-weight: 700;
	min-width: 0;
}

.tutor-dashboard-layout .tutor-stat-card-value {
	font-family: 'Source Serif 4', Georgia, serif;
	font-weight: 700;
	font-variant-numeric: tabular-nums;
}

/* Os números/ícones vinham em roxo, azul-piscina, amarelo e rosa (padrão do
   Tutor). Aqui passam a andar dentro da paleta da escola. */
.tutor-dashboard-layout .tutor-stat-card-enrolled { border-top-color: var(--ert-vinho); }
.tutor-dashboard-layout .tutor-stat-card-active { border-top-color: var(--ert-dourado-claro); }
.tutor-dashboard-layout .tutor-stat-card-completed { border-top-color: var(--ert-dourado); }
.tutor-dashboard-layout .tutor-stat-card-time-spent { border-top-color: #9A938D; }

.tutor-dashboard-layout .tutor-stat-card-active .tutor-stat-card-icon,
.tutor-dashboard-layout .tutor-stat-card-active .tutor-stat-card-value,
.tutor-dashboard-layout .tutor-stat-card-book-2 .tutor-stat-card-icon,
.tutor-dashboard-layout .tutor-stat-card-book-2 .tutor-stat-card-value,
.tutor-dashboard-layout .tutor-stat-card-exception1 .tutor-stat-card-icon,
.tutor-dashboard-layout .tutor-stat-card-exception1 .tutor-stat-card-value {
	color: var(--ert-dourado-claro);
}

.tutor-dashboard-layout .tutor-stat-card-completed .tutor-stat-card-icon,
.tutor-dashboard-layout .tutor-stat-card-completed .tutor-stat-card-value,
.tutor-dashboard-layout .tutor-stat-card-courses .tutor-stat-card-icon,
.tutor-dashboard-layout .tutor-stat-card-courses .tutor-stat-card-value,
.tutor-dashboard-layout .tutor-stat-card-success .tutor-stat-card-icon,
.tutor-dashboard-layout .tutor-stat-card-success .tutor-stat-card-value {
	color: var(--ert-dourado);
}

.tutor-dashboard-layout .tutor-stat-card-time-spent .tutor-stat-card-icon,
.tutor-dashboard-layout .tutor-stat-card-time-spent .tutor-stat-card-value,
.tutor-dashboard-layout .tutor-stat-card-exception4 .tutor-stat-card-icon,
.tutor-dashboard-layout .tutor-stat-card-exception4 .tutor-stat-card-value {
	color: #6F6862;
}

.tutor-dashboard-layout .tutor-stat-card-progress .tutor-stat-card-icon,
.tutor-dashboard-layout .tutor-stat-card-progress .tutor-stat-card-value,
.tutor-dashboard-layout .tutor-stat-card-qa .tutor-stat-card-icon,
.tutor-dashboard-layout .tutor-stat-card-qa .tutor-stat-card-value,
.tutor-dashboard-layout .tutor-stat-card-exception5 .tutor-stat-card-icon,
.tutor-dashboard-layout .tutor-stat-card-exception5 .tutor-stat-card-value {
	color: var(--ert-vinho);
}

.tutor-dashboard-layout .tutor-stat-card-star-line .tutor-stat-card-icon,
.tutor-dashboard-layout .tutor-stat-card-star-fill .tutor-stat-card-icon,
.tutor-dashboard-layout .tutor-stat-card-reviews .tutor-stat-card-icon,
.tutor-dashboard-layout .tutor-stat-card-star-line .tutor-stat-card-value,
.tutor-dashboard-layout .tutor-stat-card-star-fill .tutor-stat-card-value,
.tutor-dashboard-layout .tutor-stat-card-reviews .tutor-stat-card-value {
	color: var(--ert-dourado-claro);
}

/* Cartão de curso em andamento */
.tutor-dashboard-layout .tutor-progress-card-title {
	font-family: 'Source Serif 4', Georgia, serif;
	font-size: 1rem;
	font-weight: 600;
}

.tutor-dashboard-layout .tutor-progress-card-thumbnail {
	border-radius: 3px;
}

.tutor-dashboard-layout .tutor-progress-bar-fill {
	background: linear-gradient(90deg, var(--ert-dourado), var(--ert-dourado-claro));
}

/* Botões */
.tutor-dashboard-layout .tutor-btn-primary {
	background-color: var(--ert-vinho);
	border-color: var(--ert-vinho);
	border-radius: 3px;
	font-weight: 700;
}

.tutor-dashboard-layout .tutor-btn-primary:hover:not(:disabled),
.tutor-dashboard-layout .tutor-btn-primary:focus:not(:disabled) {
	background-color: #7E282F;
	border-color: #7E282F;
}

.tutor-dashboard-layout .tutor-btn-secondary,
.tutor-dashboard-layout .tutor-btn-outline {
	border-radius: 3px;
}

/* Gráfico "Taxa de conclusão" (visão de instrutor). As bolinhas da legenda são
   ::before pintados por token, então basta redefinir os tokens DENTRO do
   gráfico — assim o roxo/verde/amarelo/vermelho do Tutor não vaza para os
   avisos de sucesso e erro do resto do painel, que precisam continuar
   verde e vermelho. */
.tutor-dashboard-home-chart {
	--tutor-actions-exception5: var(--ert-vinho);        /* matriculado */
	--tutor-actions-success-primary: var(--ert-dourado); /* concluído */
	--tutor-actions-caution: var(--ert-dourado-claro);   /* em progresso */
	--tutor-surface-l2-hover: #D8D2CC;                   /* sem atividade */
	--tutor-actions-critical-primary: #A33A32;           /* cancelado */
}

/* Capa do perfil. O Tutor traz uma foto azul genérica como padrão, colocada
   inline no elemento — por isso o seletor pelo [style]: assim a faixa da ERT
   só substitui a capa PADRÃO, e a capa que o aluno subir continua aparecendo. */
.tutor-account-cover-photo[style*="assets/images/cover-photo"],
.tutor-profile-cover-photo[style*="assets/images/cover-photo"],
.tutor-profile-header-cover[style*="assets/images/cover-photo"] {
	background-image: linear-gradient(120deg, var(--ert-vinho) 0%, #4A1A1F 48%, var(--ert-carvao) 100%) !important;
}

/* ============================================================
   4. Responsivo
   ============================================================ */
/* Faixa de tela em que a lateral ainda aparece (abaixo de 769px o Tutor
   troca o grid para uma coluna só — por isso o min-width aqui: sem ele esta
   regra vazaria para o celular e espremeria o conteúdo). */
@media (min-width: 769px) and (max-width: 1200px) {
	.tutor-dashboard-layout {
		grid-template-columns: 232px 1fr;
	}

	.tutor-dashboard-sidebar .tutor-dashboard-sidebar-logo {
		padding: 18px 16px;
	}

	.tutor-dashboard-sidebar .tutor-dashboard-sidebar-logo img {
		height: 44px;
	}

	.tutor-dashboard-sidebar .tutor-dashboard-sidebar-nav ul li a {
		padding-inline: 16px;
	}
}

@media (max-width: 768px) {
	/* Abaixo de 768px o Tutor esconde a lateral e usa a barra inferior. */
	body.tutor-screen-frontend-dashboard .tutor-dashboard-header {
		padding-inline: 16px;
	}

	.tutor-dashboard-header .tutor-h5 {
		font-size: 17px;
	}

	.tutor-dashboard-layout .tutor-stat-card-title {
		font-size: .75rem;
	}
}

@media (max-width: 576px) {
	/* Em tela estreita o rótulo em caixa alta quebrava em três linhas e
	   encostava no ícone; aqui ele volta ao normal e ganha espaço. */
	.tutor-dashboard-layout .tutor-stat-card-title {
		text-transform: none;
		letter-spacing: normal;
		font-size: .8125rem;
		line-height: 1.25rem;
	}

	.tutor-dashboard-layout .tutor-stat-card {
		height: auto;
		min-height: 122px;
		gap: 10px;
	}

	.tutor-dashboard-layout .tutor-stat-card-value {
		font-size: 1.625rem;
	}
}

@media (prefers-reduced-motion: reduce) {
	.tutor-dashboard-layout * {
		transition-duration: .01ms !important;
	}
}
