@charset "UTF-8";
/*
  Sistema visual moderno do site público — tipografia, links, títulos,
  botões, formulários e cards. Sobrescreve o visual antigo (geral_legacy.css,
  estrutura_legacy.css, cursos_legacy.css, Bootstrap 3) mantendo a paleta
  azul/navy e o logo. Carregado no <head> e religado no fim do body
  (rodape.php) para garantir prioridade sobre CSS específico de página
  (ex: cursos_legacy.css, que é carregado inline dentro da view).
*/

:root{
  /* Nunca estavam definidas — todo background/color que usava var(--kr-blue),
     var(--kr-blue-bright) ou var(--kr-navy) neste arquivo (botões, links,
     títulos, o traço embaixo de .titulos) ficava inválido e era descartado
     pelo navegador, sem pintar nada. --kr-blue é o mesmo azul do botão
     "Detalhes"/"Inscrever-se" dos cards da Home; --kr-navy é o azul escuro
     do hero e dos títulos da Home. */
  --kr-blue: #1256b8;
  --kr-blue-bright: #2f7fe0;
  --kr-navy: #0a2b5e;
  --kr-ink: #182238;
  --kr-muted: #667085;
  --kr-surface: #F5F7FB;
  --kr-border: #E4E9F2;
  --kr-radius: 14px;
  --kr-radius-sm: 8px;
  --kr-shadow-sm: 0 2px 10px rgba(0,12,62,.07);
  --kr-shadow-md: 0 10px 28px rgba(0,12,62,.12);
  --kr-shadow-lg: 0 18px 44px rgba(0,12,62,.18);
}

/* ---------- Base ---------- */
*{ font-size:16px; color:var(--kr-ink); line-height:1.7; }
body{ color:var(--kr-ink); }

/* Escopado ao conteúdo das páginas — header/rodapé/drawer têm suas próprias
   cores (texto branco/cinza sobre navy) definidas em site_header_footer.css. */
#paginas a:link, #paginas a:visited{ color:var(--kr-blue); text-decoration:none; transition:color .15s ease; }
#paginas a:hover, #paginas a:focus-visible{ color:var(--kr-blue-bright); }

hr{ border:none; border-top:1px solid var(--kr-border); }

::selection{ background:var(--kr-blue-bright); color:#fff; }

/* ---------- Títulos ---------- */
h1, h2, h3, h4, .titulos{
  color:var(--kr-navy);
  font-weight:800;
  letter-spacing:-0.01em;
  line-height:1.25;
  border-bottom:none !important;
  padding-bottom:0 !important;
}

.titulos{
  border-bottom:none !important;
  font-size:32px;
  padding:0 0 20px 0 !important;
  margin:0 0 32px 0 !important;
  position:relative;
}
.titulos::after{
  content:"";
  position:absolute;
  left:0; bottom:0;
  width:56px; height:4px;
  border-radius:4px;
  background:linear-gradient(90deg, var(--kr-blue), var(--kr-blue-bright));
}
@media screen and (max-width:768px){
  .titulos{ text-align:left !important; font-size:26px; }
}

/* ---------- Fundos de seção (Bootstrap 4-simile usado em várias views) ---------- */
.bg-gray{ background:var(--kr-surface) !important; }
.bg-white{ background:#fff !important; }

/* ---------- Botões ---------- */
button,
input[type="submit"],
input[type="button"],
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:12px 26px;
  border:none;
  border-radius:var(--kr-radius-sm);
  background:var(--kr-blue);
  color:#fff !important;
  font-weight:700;
  font-size:15px;
  line-height:1.2;
  cursor:pointer;
  transition:transform .15s ease, box-shadow .15s ease, background-color .15s ease;
  box-shadow:var(--kr-shadow-sm);
}
button:hover, input[type="submit"]:hover, input[type="button"]:hover, .btn:hover,
button:focus-visible, input[type="submit"]:focus-visible, .btn:focus-visible{
  background:var(--kr-blue-bright);
  color:#fff !important;
  transform:translateY(-2px);
  box-shadow:var(--kr-shadow-md);
}
.btn-secondary, .btn-light{
  background:#fff;
  color:var(--kr-blue) !important;
  border:1.5px solid var(--kr-border);
  box-shadow:none;
}
.btn-secondary:hover, .btn-light:hover{
  background:var(--kr-surface);
  color:var(--kr-blue-bright) !important;
  border-color:var(--kr-blue-bright);
  box-shadow:none;
}
.btn-dark{ background:var(--kr-navy); }
.btn-dark:hover{ background:#141b4d; }
.btn-info{ background:var(--kr-blue-bright); }
.btn-sm{ padding:8px 18px; font-size:13px; }
.btn-block{ display:flex; width:100%; }
.btn-primary{ background:var(--kr-blue); color:#fff !important; border:none; }
.btn-primary:hover{ background:var(--kr-blue-bright); }
/* bootstrap-theme.css marca .disabled com opacity:.65, deixando o texto quase
   ilegível — a lib de validação (assets/validator) só reavalia campos completos
   em eventos de digitação, então autofill do navegador pode deixar essa classe
   "grudada" mesmo com o formulário preenchido (o clique ainda funciona, valida
   de novo no submit). Mantemos legível em vez de escurecer o botão. */
.btn.disabled, .btn:disabled, button.disabled, button:disabled{
  opacity:1;
  cursor:not-allowed;
  box-shadow:none;
}

/* ---------- Formulários ---------- */
input[type="text"], input[type="password"], input[type="number"], input[type="file"],
input[type="email"], input[type="tel"], textarea, select{
  padding:11px 14px;
  border:1.5px solid var(--kr-border);
  border-radius:var(--kr-radius-sm);
  font-size:15px;
  transition:border-color .15s ease, box-shadow .15s ease;
}
input[type="text"]:focus, input[type="password"]:focus, input[type="number"]:focus,
input[type="email"]:focus, input[type="tel"]:focus, textarea:focus, select:focus{
  border-color:var(--kr-blue-bright);
  box-shadow:0 0 0 3px rgba(0,153,255,.15);
  outline:none;
}
label{ font-weight:600; color:var(--kr-navy); }

/* ---------- Cards genéricos (.card, bridge Bootstrap 4) ---------- */
.card{
  border:none !important;
  border-radius:var(--kr-radius) !important;
  box-shadow:var(--kr-shadow-sm);
  overflow:hidden;
  transition:box-shadow .2s ease, transform .2s ease;
}
.card:hover{ box-shadow:var(--kr-shadow-md); }

/* ---------- Cards de curso (.curso / .curso_completo, cursos_legacy.css) ---------- */
.curso{
  background:#fff !important;
  border-radius:var(--kr-radius) !important;
  box-shadow:var(--kr-shadow-sm) !important;
  overflow:hidden;
  padding:0 !important;
  transition:box-shadow .25s ease, transform .25s ease !important;
}
.curso:hover{ box-shadow:var(--kr-shadow-lg) !important; transform:translateY(-6px) !important; }
.curso .imagem{ background-color:var(--kr-surface); }
.curso .dados{ width:auto !important; margin:14px 18px 18px !important; }
.curso .dados .titulo{ color:var(--kr-navy) !important; font-weight:700 !important; font-size:16px !important; }
.curso .dados .manchete{ color:var(--kr-muted) !important; font-size:13px !important; }
.curso .borda{ background:linear-gradient(90deg, var(--kr-blue), var(--kr-blue-bright)) !important; }

.curso_completo{
  background:#fff !important;
  border:none !important;
  border-radius:var(--kr-radius) !important;
  box-shadow:var(--kr-shadow-sm) !important;
}
.curso_completo .dados .titulo{ color:var(--kr-navy) !important; font-weight:700 !important; }
.curso_completo .borda{ background:linear-gradient(90deg, var(--kr-blue), var(--kr-blue-bright)) !important; }
.curso_completo .dados_menores{
  background:none !important;
  border-left:3px solid var(--kr-blue-bright) !important;
  padding:2px 0 2px 12px !important;
  color:var(--kr-ink) !important;
}

/* ---------- Cards de produto (.product-item — sem estilo próprio no bundle atual) ---------- */
.product-item{
  position:relative;
  background:#fff;
  border-radius:var(--kr-radius);
  box-shadow:var(--kr-shadow-sm);
  overflow:hidden;
  height:100%;
  display:flex;
  flex-direction:column;
  transition:box-shadow .25s ease, transform .25s ease;
}
.product-item:hover{ box-shadow:var(--kr-shadow-lg); transform:translateY(-6px); }
.product-item-image{ background:var(--kr-surface); padding:24px; }
.product-item-image img{ max-height:220px; width:auto; margin:0 auto; mix-blend-mode:multiply; }
.product-item-content{ padding:18px 20px 22px; }
.product-item-content h5{ font-size:16px; color:var(--kr-navy); font-weight:700; }
.product-item .price{ margin:8px 0 0; font-weight:800; color:var(--kr-blue); font-size:18px; }
.product-item .ajax-quick-view-popup{
  position:absolute; top:14px; right:14px;
  width:38px; height:38px;
  display:flex; align-items:center; justify-content:center;
  background:#fff; border-radius:50%; box-shadow:var(--kr-shadow-sm);
  color:var(--kr-blue) !important;
}
.product-item .ajax-quick-view-popup:hover{ background:var(--kr-blue); color:#fff !important; }

@media (prefers-reduced-motion: reduce){
  .curso, .curso:hover, .product-item, .product-item:hover, .card, .card:hover,
  button, .btn, input[type="submit"]{ transition:none !important; }
}