/*
  Visual "Modelo 6" (céu claro + azul-marinho + dourado, com a marca original) para a ENTRADA
  e as telas de escolha (área e módulos) do /painel/. Carregado por último em index.html, então
  só sobrescreve. Não mexe no Busca Diário em si nem no cadastro.
*/
:root {
  --m6-fundo: #eef3fb;
  --m6-azul: #152c67;
  --m6-azul-2: #2b3f73;
  --m6-texto-suave: #4b5b7a;
  --m6-ouro: #e8b04a;
  --m6-borda: #b9c7e3;
  --m6-painel-claro: #e3ecfa;
}

body.modo-autenticacao,
body.modo-painel {
  font-family: 'Mulish', 'Inter', system-ui, sans-serif;
  color: var(--m6-azul);
}
body.modo-autenticacao {
  background-color: var(--m6-fundo);
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='1280' height='800' viewBox='0 0 1280 800'><ellipse cx='170' cy='650' rx='260' ry='90' fill='white' fill-opacity='0.75'/><ellipse cx='310' cy='700' rx='200' ry='70' fill='white' fill-opacity='0.75'/><ellipse cx='1130' cy='140' rx='230' ry='80' fill='white' fill-opacity='0.75'/><ellipse cx='1000' cy='190' rx='170' ry='60' fill='white' fill-opacity='0.75'/><circle cx='1150' cy='640' r='70' fill='%23e8b04a' fill-opacity='0.22'/></svg>");
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
}
body.modo-painel { background: var(--m6-fundo); }
/* A tela de entrada tem o seu próprio fundo fixo (véu + foto): troca pelo céu claro. */
.tela-autenticacao-moderna {
  background-color: var(--m6-fundo);
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='1280' height='800' viewBox='0 0 1280 800' preserveAspectRatio='xMidYMid slice'><ellipse cx='170' cy='650' rx='260' ry='90' fill='white' fill-opacity='0.75'/><ellipse cx='310' cy='700' rx='200' ry='70' fill='white' fill-opacity='0.75'/><ellipse cx='1130' cy='140' rx='230' ry='80' fill='white' fill-opacity='0.75'/><ellipse cx='1000' cy='190' rx='170' ry='60' fill='white' fill-opacity='0.75'/><circle cx='1150' cy='640' r='70' fill='%23e8b04a' fill-opacity='0.22'/></svg>");
  background-size: cover; background-position: center; background-repeat: no-repeat;
}
body.modo-painel .veu-foto, body.modo-painel .foto, body.modo-painel .orbe { display: none; }

:focus-visible { outline: 3px solid var(--m6-ouro); outline-offset: 2px; }

/* ---------- Barra de cima da entrada: só o link "Sala Virtual" (a marca fica no cartão) ---------- */
body.modo-autenticacao .barra-topo-login { background: transparent; box-shadow: none; border: 0; }
body.modo-autenticacao .barra-topo-login-logo { display: none; }
body.modo-autenticacao .barra-topo-login .botao-acesso-corporativo {
  background: #ffffff; color: var(--m6-azul); border: 1.5px solid var(--m6-borda);
  border-radius: 12px; font: 800 14px 'Mulish', sans-serif; letter-spacing: 0; text-transform: none; box-shadow: none;
}

/* ---------- Cartão de entrada ---------- */
.tela-autenticacao-moderna .cartao-auth {
  width: 500px; max-width: calc(100vw - 32px); box-sizing: border-box;
  background: #ffffff; border: 0; border-radius: 28px;
  padding: 36px 40px 40px; box-shadow: 0 24px 60px rgba(21, 44, 103, 0.14);
  display: flex; flex-direction: column; gap: 4px;
}
.marca-cartao-auth { justify-content: center; margin: 0 0 14px; }
.marca-cartao-auth-logo { width: 224px; max-width: 70%; height: auto; display: block; margin: 0 auto; }
.tela-autenticacao-moderna .cartao-auth h1 {
  font-family: 'Mulish', sans-serif; font-size: 28px; font-weight: 800; letter-spacing: -0.6px;
  color: var(--m6-azul); text-align: center; margin: 0;
}
.tela-autenticacao-moderna .cartao-auth h1::after {
  content: ""; display: block; width: 44px; height: 4px; border-radius: 2px;
  background: var(--m6-ouro); margin: 10px auto 0;
}
.tela-autenticacao-moderna .cartao-auth .subtitulo {
  font-size: 15px; color: var(--m6-texto-suave); text-align: center; margin: 10px 0 18px;
}
.tela-autenticacao-moderna .cartao-auth label { font-size: 14px; font-weight: 800; color: var(--m6-azul); }
.tela-autenticacao-moderna .cartao-auth input[type="email"],
.tela-autenticacao-moderna .cartao-auth input[type="password"],
.tela-autenticacao-moderna .cartao-auth input[type="text"],
.tela-autenticacao-moderna .cartao-auth select {
  height: 54px; box-sizing: border-box; padding: 0 16px; border: 1.5px solid #7f90b3;
  border-radius: 12px; background: #ffffff; font: 500 16px 'Mulish', sans-serif; color: var(--m6-azul);
}
.tela-autenticacao-moderna .cartao-auth input:focus,
.tela-autenticacao-moderna .cartao-auth select:focus {
  border-color: var(--m6-azul); box-shadow: 0 0 0 3px rgba(232, 176, 74, 0.45); outline: none;
}
.tela-autenticacao-moderna .cartao-auth button.primario {
  height: 56px; border: 0; border-radius: 14px; background: var(--m6-azul); color: #ffffff;
  font: 800 17px 'Mulish', sans-serif; box-shadow: 0 8px 18px rgba(21, 44, 103, 0.28);
}
.tela-autenticacao-moderna .cartao-auth button.primario:hover { background: #0c1d4a; }
.tela-autenticacao-moderna .cartao-auth button.secundario,
.tela-autenticacao-moderna .cartao-auth a.secundario {
  height: 48px; border-radius: 12px; font: 800 15px 'Mulish', sans-serif;
  color: var(--m6-azul); border: 1.5px solid var(--m6-borda); background: #ffffff;
}
.tela-autenticacao-moderna .cartao-auth a { color: var(--m6-azul); font-weight: 800; }
.tela-autenticacao-moderna .cartao-auth .linha-opcoes-auth { font-size: 14px; margin: 6px 0 14px; }
.tela-autenticacao-moderna .cartao-auth #link-sem-cadastro {
  height: auto !important; line-height: 1.4 !important; margin: 16px 0 0 !important; padding: 0 !important;
  border: 0; background: transparent; font-size: 15px; font-weight: 800; color: var(--m6-azul);
}

/* ---------- Cabeçalho depois de entrar ---------- */
header.topo.topo-cliente {
  background: transparent; border: 0; padding: 14px 56px; height: auto; min-height: 84px;
}
header.topo.topo-cliente .marca {
  background: #ffffff; border-radius: 16px; padding: 8px 18px; width: fit-content;
  box-shadow: 0 4px 14px rgba(21, 44, 103, 0.08);
}
header.topo.topo-cliente .marca img { height: 44px; width: auto; }
header.topo.topo-cliente .titulo-topo { font-family: 'Mulish', sans-serif; font-weight: 800; color: var(--m6-azul); }
header.topo.topo-cliente button#btn-sair,
header.topo.topo-cliente button#btn-trocar-area {
  height: 44px; padding: 0 20px; border-radius: 12px; border: 1.5px solid var(--m6-borda);
  background: #ffffff; color: var(--m6-azul); font: 800 15px 'Mulish', sans-serif; cursor: pointer; margin-left: 8px;
}
header.topo.topo-cliente button#btn-sair { color: var(--m6-azul) !important; border-color: var(--m6-borda) !important; background: #ffffff !important; }
header.topo.topo-cliente button#btn-sair:hover,
header.topo.topo-cliente button#btn-trocar-area:hover { background: var(--m6-painel-claro); }

/* ---------- Escolha de área e de módulos ---------- */
.eyebrow-acesso { display: none; }
.titulo-escolha-modulo {
  font-family: 'Mulish', sans-serif; font-size: 36px; font-weight: 800; letter-spacing: -1px;
  color: var(--m6-azul); text-align: left; margin: 0 0 8px;
}
.titulo-escolha-modulo::after { display: none; }
.subtitulo-escolha-area {
  display: flex; align-items: center; gap: 14px; text-align: left; font-size: 17px;
  color: var(--m6-texto-suave); margin: 0 0 28px;
}
.subtitulo-escolha-area::before {
  content: ""; width: 44px; height: 4px; border-radius: 2px; background: var(--m6-ouro); flex: none;
}
#tela-escolha-area, #tela-escolha-modulo {
  width: 100% !important; max-width: 1100px !important; margin-left: auto !important; margin-right: auto !important;
  box-sizing: border-box; padding: 8px 56px 40px !important; align-items: stretch !important;
}
.container-escolha-modulo .titulo-escolha-modulo + .grade-modulos { margin-top: 32px; }

#tela-escolha-area .grade-modulos:not([hidden]),
#tela-escolha-modulo .grade-modulos:not([hidden]) {
  display: grid !important; width: 100% !important; box-sizing: border-box !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 22px !important; max-width: none !important;
  margin-left: 0 !important; margin-right: 0 !important; padding: 0 !important;
}
#tela-escolha-area .grade-modulos .cartao-modulo,
#tela-escolha-modulo .grade-modulos .cartao-modulo {
  aspect-ratio: auto !important; width: auto !important; min-height: 190px !important; max-width: none !important; flex: none !important; display: grid !important; grid-template-columns: 190px 1fr !important;
  grid-template-rows: 1fr auto auto 1fr !important; column-gap: 0 !important; row-gap: 6px !important; align-items: start !important;
  text-align: left !important; padding: 0 !important; overflow: hidden !important; background: #ffffff !important; border: 0 !important; border-radius: 24px !important;
  box-shadow: 0 10px 30px rgba(21, 44, 103, 0.09) !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
}
#tela-escolha-area .grade-modulos .cartao-modulo:hover,
#tela-escolha-modulo .grade-modulos .cartao-modulo:hover { transform: translateY(-2px) !important; box-shadow: 0 14px 34px rgba(21, 44, 103, 0.15) !important; }
#tela-escolha-area .grade-modulos .cartao-modulo .icone-modulo,
#tela-escolha-modulo .grade-modulos .cartao-modulo .icone-modulo {
  grid-column: 1 !important; grid-row: 1 / -1 !important; width: auto !important; height: auto !important; margin: 0 !important; border: 0 !important; border-radius: 0 !important;
  background: var(--m6-painel-claro) !important; box-shadow: none !important; color: var(--m6-azul) !important; align-self: stretch !important; transform: none !important;
}
#tela-escolha-area .grade-modulos .cartao-modulo .icone-modulo svg,
#tela-escolha-modulo .grade-modulos .cartao-modulo .icone-modulo svg { width: 110px !important; height: 110px !important; }
#tela-escolha-area .grade-modulos .cartao-modulo .nome-modulo,
#tela-escolha-modulo .grade-modulos .cartao-modulo .nome-modulo {
  grid-column: 2 !important; grid-row: 2 !important; padding: 0 24px !important; font-family: 'Mulish', sans-serif !important; font-size: 24px !important; font-weight: 800 !important;
  text-transform: none !important; letter-spacing: -0.3px !important; color: var(--m6-azul) !important; overflow-wrap: normal !important;
}
#tela-escolha-area .grade-modulos .cartao-modulo .descricao-modulo,
#tela-escolha-modulo .grade-modulos .cartao-modulo .descricao-modulo {
  grid-column: 2 !important; grid-row: 3 !important; padding: 0 24px !important; font-size: 16px !important; line-height: 1.45 !important; color: var(--m6-texto-suave) !important;
}
#tela-escolha-area .grade-modulos .cartao-modulo::after,
#tela-escolha-modulo .grade-modulos .cartao-modulo::after {
  content: "Abrir" !important; position: static !important; grid-column: 2 !important; grid-row: 4 !important; z-index: auto !important; margin: 6px 24px 22px !important;
  width: 132px !important; height: 48px !important; display: flex !important; align-items: center !important; justify-content: center !important;
  border-radius: 12px !important; background: var(--m6-azul) !important; color: #ffffff !important; font: 800 16px 'Mulish', sans-serif !important;
}
#tela-escolha-area .grade-modulos .cartao-modulo .selo-principal,
#tela-escolha-modulo .grade-modulos .cartao-modulo .selo-principal {
  top: 12px !important; left: auto !important; right: 12px !important; background: var(--m6-ouro) !important; color: var(--m6-azul) !important; border: 0 !important;
  font-size: 10px !important; font-weight: 800 !important;
}
@media (max-width: 760px) {
  #tela-escolha-area .grade-modulos:not([hidden]),
#tela-escolha-modulo .grade-modulos:not([hidden]) { grid-template-columns: minmax(0, 1fr) !important; }
  header.topo.topo-cliente { padding: 12px 16px; }
  .titulo-escolha-modulo { font-size: 28px; }
}



/* ===== 3 por linha: cabe em 100% da tela ===== */
#tela-escolha-area, #tela-escolha-modulo { max-width: 1360px !important; padding: 8px 32px 28px !important; }
#tela-escolha-area .grade-modulos:not([hidden]),
#tela-escolha-modulo .grade-modulos:not([hidden]) { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 18px !important; }
#tela-escolha-area .grade-modulos .cartao-modulo,
#tela-escolha-modulo .grade-modulos .cartao-modulo { grid-template-columns: 120px 1fr !important; min-height: 168px !important; border-radius: 20px !important; }
#tela-escolha-area .grade-modulos .cartao-modulo .icone-modulo svg,
#tela-escolha-modulo .grade-modulos .cartao-modulo .icone-modulo svg { width: 84px !important; height: 84px !important; }
#tela-escolha-area .grade-modulos .cartao-modulo .nome-modulo,
#tela-escolha-modulo .grade-modulos .cartao-modulo .nome-modulo { font-size: 19px !important; padding: 0 16px !important; }
#tela-escolha-area .grade-modulos .cartao-modulo .descricao-modulo,
#tela-escolha-modulo .grade-modulos .cartao-modulo .descricao-modulo { font-size: 13.5px !important; padding: 0 16px !important; line-height: 1.4 !important; }
#tela-escolha-area .grade-modulos .cartao-modulo::after,
#tela-escolha-modulo .grade-modulos .cartao-modulo::after { margin: 4px 16px 16px !important; width: 104px !important; height: 40px !important; font-size: 14px !important; }
.titulo-escolha-modulo { font-size: 30px !important; }
.container-escolha-modulo .titulo-escolha-modulo + .grade-modulos { margin-top: 18px !important; }
@media (max-width: 1100px) {
  #tela-escolha-area .grade-modulos:not([hidden]),
  #tela-escolha-modulo .grade-modulos:not([hidden]) { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (max-width: 760px) {
  #tela-escolha-area .grade-modulos:not([hidden]),
  #tela-escolha-modulo .grade-modulos:not([hidden]) { grid-template-columns: minmax(0, 1fr) !important; }
}