/* MyFullStaff · tema novo: cores e fontes únicas para o painel e o celular (o portal tem uma cópia igual).
   Paleta Violeta (a partir do logo): violeta como cor principal, laranja só para destaque.
   Modo: automático pelo aparelho; data-tema="claro" ou "escuro" no <html> força um dos dois (botão no topo). */

@font-face { font-family: "Inter"; font-weight: 400; font-style: normal; font-display: swap; src: url("fontes/Inter-Regular.ttf") format("truetype"); }
@font-face { font-family: "Inter"; font-weight: 500; font-style: normal; font-display: swap; src: url("fontes/Inter-Medium.ttf") format("truetype"); }
@font-face { font-family: "Inter"; font-weight: 600; font-style: normal; font-display: swap; src: url("fontes/Inter-SemiBold.ttf") format("truetype"); }
@font-face { font-family: "Inter"; font-weight: 700; font-style: normal; font-display: swap; src: url("fontes/Inter-Bold.ttf") format("truetype"); }
@font-face { font-family: "Inter"; font-weight: 800; font-style: normal; font-display: swap; src: url("fontes/Inter-ExtraBold.ttf") format("truetype"); }
/* Manrope (títulos): arquivo variável único, pesos 200 a 800 */
@font-face { font-family: "Manrope"; font-weight: 200 800; font-style: normal; font-display: swap; src: url("fontes/Manrope.ttf") format("truetype"); }

:root {
  --fonte-texto: "Inter", -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --fonte-titulo: "Manrope", "Inter", -apple-system, "Segoe UI", Arial, sans-serif;

  --marca: #5B3FA8;
  --marca-forte: #4A3190;
  --marca-suave: #EEEAFB;
  --marca-texto: #4A2F9A;
  --sobre-marca: #FFFFFF;
  --destaque: #F28C28;
  --destaque-suave: #FFF1E2;
  --destaque-texto: #9A4A0B;

  --fundo: #F6F5FA;
  --superficie: #FFFFFF;
  --superficie-2: #FAF9FD;
  --linha: #E7E4F0;
  --linha-forte: #D3CEE3;
  --texto: #1E1B2E;
  --texto-2: #5D5873;
  --texto-3: #8C88A0;

  --sucesso: #1E6B34; --sucesso-suave: #E6F5EA; --sucesso-cheio: #2E9E4F;
  --erro: #A12A2A;    --erro-suave: #FDECEC;    --erro-cheio: #C93636;
  --aviso: #8A5A00;   --aviso-suave: #FFF4D6;   --aviso-cheio: #E0A100;
  --info: #23589C;    --info-suave: #E7F0FB;    --info-cheio: #3A78C9;

  /* Gráficos: sequência de cores que combina com a paleta (lida pelo graficos.js) */
  --grafico-1: #5B3FA8; --grafico-2: #F28C28; --grafico-3: #2E9E4F; --grafico-4: #3A78C9;
  --grafico-5: #C2477A; --grafico-6: #1F9C9C; --grafico-7: #9D87F0; --grafico-8: #E0A100;
  --grafico-grade: #ECEAF3; --grafico-texto: #5D5873;

  --raio: 10px;
  --raio-p: 6px;
  --sombra: 0 1px 2px rgba(30, 27, 46, .06), 0 2px 8px rgba(30, 27, 46, .05);
  --sombra-alta: 0 12px 32px rgba(30, 27, 46, .18);
  --foco: 0 0 0 3px rgba(91, 63, 168, .28);
  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-tema="claro"]) {
    --marca: #9D87F0; --marca-forte: #B5A3F5; --marca-suave: #2C2546; --marca-texto: #C9BCFF; --sobre-marca: #14121C;
    --destaque: #F5A04F; --destaque-suave: #47300F; --destaque-texto: #FFC98A;
    --fundo: #14121C; --superficie: #1E1B2A; --superficie-2: #191723; --linha: #2E2A3E; --linha-forte: #3D3852;
    --texto: #ECEAF4; --texto-2: #B3AECB; --texto-3: #7F7A96;
    --sucesso: #9FE0B0; --sucesso-suave: #173A22; --sucesso-cheio: #3FB565;
    --erro: #F7B4B4; --erro-suave: #4A1F22; --erro-cheio: #E05252;
    --aviso: #FFD68A; --aviso-suave: #3D2F0E; --aviso-cheio: #F0B429;
    --info: #A9CBF5; --info-suave: #17304F; --info-cheio: #5B93DB;
    --grafico-1: #9D87F0; --grafico-2: #F5A04F; --grafico-3: #3FB565; --grafico-4: #5B93DB;
    --grafico-5: #E07AA5; --grafico-6: #3FC1C1; --grafico-7: #C9BCFF; --grafico-8: #F0B429;
    --grafico-grade: #2E2A3E; --grafico-texto: #B3AECB;
    --sombra: 0 1px 2px rgba(0, 0, 0, .4); --sombra-alta: 0 12px 32px rgba(0, 0, 0, .55);
    --foco: 0 0 0 3px rgba(157, 135, 240, .35);
    color-scheme: dark;
  }
}
:root[data-tema="escuro"] {
  --marca: #9D87F0; --marca-forte: #B5A3F5; --marca-suave: #2C2546; --marca-texto: #C9BCFF; --sobre-marca: #14121C;
  --destaque: #F5A04F; --destaque-suave: #47300F; --destaque-texto: #FFC98A;
  --fundo: #14121C; --superficie: #1E1B2A; --superficie-2: #191723; --linha: #2E2A3E; --linha-forte: #3D3852;
  --texto: #ECEAF4; --texto-2: #B3AECB; --texto-3: #7F7A96;
  --sucesso: #9FE0B0; --sucesso-suave: #173A22; --sucesso-cheio: #3FB565;
  --erro: #F7B4B4; --erro-suave: #4A1F22; --erro-cheio: #E05252;
  --aviso: #FFD68A; --aviso-suave: #3D2F0E; --aviso-cheio: #F0B429;
  --info: #A9CBF5; --info-suave: #17304F; --info-cheio: #5B93DB;
  --grafico-1: #9D87F0; --grafico-2: #F5A04F; --grafico-3: #3FB565; --grafico-4: #5B93DB;
  --grafico-5: #E07AA5; --grafico-6: #3FC1C1; --grafico-7: #C9BCFF; --grafico-8: #F0B429;
  --grafico-grade: #2E2A3E; --grafico-texto: #B3AECB;
  --sombra: 0 1px 2px rgba(0, 0, 0, .4); --sombra-alta: 0 12px 32px rgba(0, 0, 0, .55);
  --foco: 0 0 0 3px rgba(157, 135, 240, .35);
  color-scheme: dark;
}

/* Botão de tema (claro / escuro / automático), igual nos três sistemas. */
.troca-tema { display: inline-flex; background: var(--superficie-2); border: 1px solid var(--linha); border-radius: 999px; padding: 2px; gap: 2px; vertical-align: middle; }
.troca-tema button { border: 0; background: transparent; color: var(--texto-2); width: 30px; height: 26px; border-radius: 999px; cursor: pointer; font-size: 13px; line-height: 1; padding: 0; }
.troca-tema button[aria-pressed="true"] { background: var(--superficie); color: var(--marca-texto); box-shadow: var(--sombra); }
.troca-tema button:focus-visible { outline: none; box-shadow: var(--foco); }

/* Formulário de avaliação (mobile/pesquisa-form.js, painel e celular): o script injeta cores fixas; aqui, as do tema. */
html .pf-obrig { color: var(--erro); }
html .pf-nota, html .pf-opcao, html .pf-pergunta textarea { background: var(--superficie); border-color: var(--linha-forte); color: var(--texto); }
html .pf-nota small { color: var(--texto-3); }
html .pf-nota.escolhida, html .pf-opcao.escolhida { background: var(--marca); border-color: var(--marca); color: var(--sobre-marca); }
html .pf-nota.escolhida small { color: var(--sobre-marca); opacity: .8; }
html .pf-pergunta textarea:focus { outline: none; border-color: var(--marca); box-shadow: var(--foco); }

/* Logo F (porta da UH sob o arco): cores pelas variáveis, acompanha claro e escuro. */
.logo-mfs { display: inline-block; vertical-align: middle; }
.logo-mfs .arco { fill: none; stroke: var(--destaque); stroke-width: 5; stroke-linecap: round; }
.logo-mfs .porta { fill: none; stroke: var(--marca); stroke-width: 4.5; stroke-linecap: round; stroke-linejoin: round; }
.logo-mfs .macaneta { fill: var(--marca); }
.nome-mfs { font-family: var(--fonte-titulo); font-weight: 800; letter-spacing: -.03em; }
.nome-mfs .a { color: var(--marca); } .nome-mfs .b { color: var(--destaque); }
