/* =========================================================
   Central de downloads IpChronus
   Para alinhar com o site, troque só as cores abaixo.
   ========================================================= */
:root {
  --tinta: #0E1B2C;          /* fundo do topo / textos principais */
  --tinta-suave: #4A5A70;    /* textos secundários */
  --hero-texto: #C9D4E3;     /* texto de apoio sobre fundo escuro */
  --papel: #EEF2F6;          /* fundo da página */
  --superficie: #FFFFFF;     /* painéis */
  --azul: #1A56DB;           /* botões e links */
  --azul-escuro: #123E9E;
  --sinal: #14C08F;          /* linha de sinal do topo e progresso */
  --linha: #D6DEE8;          /* bordas */
  --alerta: #B42318;
  --sucesso: #0B6650;
  --fonte: "Manrope", "Segoe UI", system-ui, -apple-system, sans-serif;
  --raio: 12px;
  --largura: 1080px;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  font-family: var(--fonte);
  font-size: 16px;
  line-height: 1.55;
  color: var(--tinta);
  background: var(--papel);
  -webkit-font-smoothing: antialiased;
}

a { color: var(--azul); }
:focus-visible { outline: 3px solid var(--sinal); outline-offset: 2px; border-radius: 4px; }
code { font-size: .9em; background: var(--papel); padding: .1em .35em; border-radius: 4px; overflow-wrap: anywhere; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---------- Topo ---------- */
.topo {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
  padding: 1rem max(1rem, calc((100% - var(--largura)) / 2));
  background: var(--tinta);
  color: #fff;
}
.marca { display: flex; align-items: baseline; gap: .4rem; color: #fff; text-decoration: none; }
.marca img { display: block; height: 38px; width: auto; }
.marca-nome { font-size: 1.4rem; font-weight: 800; letter-spacing: -.02em; }
.marca-sub { font-weight: 500; color: var(--hero-texto); }

.topo nav { display: flex; align-items: center; gap: .35rem; flex-wrap: wrap; }
.topo nav a {
  display: inline-flex; align-items: center; gap: .45rem;
  padding: .5rem .9rem;
  border-radius: 999px;
  color: #fff;
  font-size: .95rem;
  font-weight: 600;
  text-decoration: none;
}
.topo nav a:hover { background: rgba(255, 255, 255, .08); }
.topo nav .btn-restrito { border: 1px solid rgba(255, 255, 255, .3); }

/* ---------- Hero ---------- */
.hero {
  background: var(--tinta);
  color: #fff;
  padding: clamp(2rem, 5vw, 3.5rem) 0 clamp(4rem, 8vw, 5.5rem);
}
.hero-inner { width: min(var(--largura), calc(100% - 2rem)); margin: 0 auto; }
.hero h1 {
  margin: 0 0 .75rem;
  font-size: clamp(2.3rem, 6vw, 4rem);
  font-weight: 800;
  line-height: 1.02;
  letter-spacing: -.035em;
}
.hero p { margin: 0; max-width: 56ch; font-size: 1.1rem; color: var(--hero-texto); }
.hero-compacto h1 { font-size: clamp(2rem, 5vw, 3rem); }

/* Linha de sinal: o único movimento da página, desenhado uma vez ao carregar */
.pulso { display: block; width: 100%; height: 56px; margin-top: 2.25rem; }
.pulso path {
  fill: none;
  stroke: var(--sinal);
  stroke-width: 2.5;
  stroke-linejoin: round;
  stroke-dasharray: 1500;
  stroke-dashoffset: 1500;
  animation: desenhar 1.6s ease-out .15s forwards;
}
@keyframes desenhar { to { stroke-dashoffset: 0; } }

/* ---------- Conteúdo ---------- */
.conteudo {
  width: min(var(--largura), calc(100% - 2rem));
  margin: -2.75rem auto 0;
  padding-bottom: 4rem;
  display: grid;
  gap: 1.75rem;
}

.area {
  background: var(--superficie);
  border: 1px solid var(--linha);
  border-radius: var(--raio);
  overflow: hidden;
}
.area-cab {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 1rem;
  padding: 1.5rem 1.5rem 1.1rem;
  border-bottom: 1px solid var(--linha);
}
.area-cab h2 { margin: 0; font-size: 1.45rem; font-weight: 800; letter-spacing: -.015em; }
.area-cab p { margin: .2rem 0 0; color: var(--tinta-suave); }
.area-total { color: var(--tinta-suave); font-size: .9rem; white-space: nowrap; }

.arquivos { list-style: none; margin: 0; padding: 0; }
.arquivo {
  display: grid;
  grid-template-columns: 3.25rem 1fr auto auto;
  align-items: center;
  gap: 1rem;
  padding: .9rem 1.5rem;
  border-top: 1px solid var(--linha);
}
.arquivo:first-child { border-top: 0; }
.arquivo:hover { background: #F7F9FC; }

.tipo {
  display: grid;
  place-items: center;
  height: 2.5rem;
  border-radius: 8px;
  font-size: .68rem;
  font-weight: 800;
  letter-spacing: .02em;
  background: #E2EAF9;
  color: var(--azul-escuro);
}
.tipo-zip { background: #FCEFD9; color: #8A4B06; }
.tipo-pdf { background: #FCE4E0; color: #9F2618; }
.tipo-img { background: #DCF4EC; color: #0B6650; }

.arquivo-info { display: flex; flex-direction: column; min-width: 0; }
.arquivo-nome { font-weight: 700; overflow-wrap: anywhere; color: var(--tinta); }
a.arquivo-nome { text-decoration: none; }
a.arquivo-nome:hover { text-decoration: underline; }
.arquivo-desc { font-size: .92rem; color: var(--tinta-suave); }
.arquivo-tam {
  font-size: .9rem;
  color: var(--tinta-suave);
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
.vazio { margin: 0; padding: 1.5rem; color: var(--tinta-suave); }

/* ---------- Botões ---------- */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .45rem;
  padding: .6rem 1.05rem;
  border: 0;
  border-radius: 8px;
  background: var(--azul);
  color: #fff;
  font: inherit;
  font-weight: 700;
  text-decoration: none;
  cursor: pointer;
}
.btn:hover { background: var(--azul-escuro); }
.btn:disabled { opacity: .45; cursor: not-allowed; }
.btn-claro { background: #fff; color: var(--tinta); }
.btn-claro:hover { background: #E2EAF9; }
.btn-secundario { background: transparent; color: var(--tinta); border: 1px solid var(--linha); }
.btn-secundario:hover { background: var(--papel); }
.btn-perigo { background: transparent; color: var(--alerta); border: 1px solid #F1C4BE; }
.btn-perigo:hover { background: #FDECEA; }
.btn-largo { width: 100%; padding: .8rem 1rem; }
.btn-pequeno { padding: .4rem .8rem; font-size: .9rem; }

/* ---------- Faixa de acesso restrito ---------- */
.faixa-restrita {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1.25rem;
  flex-wrap: wrap;
  padding: 1.75rem 1.5rem;
  border-radius: var(--raio);
  background: var(--tinta);
  color: #fff;
}
.faixa-restrita h2 { margin: 0; font-size: 1.35rem; font-weight: 800; }
.faixa-restrita p { margin: .2rem 0 0; color: var(--hero-texto); }

/* ---------- Formulários ---------- */
.login {
  width: 100%;
  max-width: 440px;
  padding: 2rem 1.5rem;
  background: var(--superficie);
  border: 1px solid var(--linha);
  border-radius: var(--raio);
}
label { display: block; margin-bottom: .4rem; font-weight: 700; }
.opcional { font-weight: 500; color: var(--tinta-suave); font-size: .9rem; }
input[type="password"],
input[type="text"],
select {
  width: 100%;
  padding: .7rem .9rem;
  border: 1px solid #B5C2D3;
  border-radius: 8px;
  background: #fff;
  color: var(--tinta);
  font: inherit;
}
input[type="password"]:focus,
input[type="text"]:focus,
select:focus { border-color: var(--azul); outline: 3px solid rgba(26, 86, 219, .2); }
.login input[type="password"] { margin-bottom: 1rem; }
.login-ajuda { margin: 1rem 0 0; font-size: .9rem; color: var(--tinta-suave); }

.aviso,
.sucesso {
  margin: 0;
  padding: .75rem 1rem;
  border-radius: 8px;
  font-weight: 600;
}
.aviso { background: #FDECEA; color: var(--alerta); }
.sucesso { background: #DCF4EC; color: var(--sucesso); }
.login .aviso { margin-bottom: 1rem; }

.barra-sessao {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  flex-wrap: wrap;
  padding: .75rem 1rem;
  background: var(--superficie);
  border: 1px solid var(--linha);
  border-radius: var(--raio);
}
.barra-sessao form { margin: 0; }
.barra-sessao a { font-weight: 600; }

/* ---------- Administração: envio ---------- */
.envio { display: grid; gap: 1.25rem; padding: 1.5rem; }
.envio-campos { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.envio-acoes { display: flex; gap: .75rem; flex-wrap: wrap; }

.soltar {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  margin: 0;
  padding: 2rem 1rem;
  border: 2px dashed #B5C2D3;
  border-radius: var(--raio);
  background: #F7F9FC;
  color: var(--tinta-suave);
  font-weight: 500;
  text-align: center;
  cursor: pointer;
}
.soltar strong { color: var(--tinta); }
.soltar svg { color: var(--azul); }
.soltar:hover,
.soltar.arrastando { border-color: var(--azul); background: #EAF0FD; }
.soltar input[type="file"] { position: absolute; width: 1px; height: 1px; opacity: 0; }
.soltar:focus-within { outline: 3px solid var(--sinal); outline-offset: 2px; }

.fila { list-style: none; margin: 0; padding: 0; display: grid; gap: .6rem; }
.fila:empty { display: none; }
.fila-item { padding: .75rem 1rem; border: 1px solid var(--linha); border-radius: 8px; }
.fila-topo { display: flex; justify-content: space-between; gap: 1rem; flex-wrap: wrap; margin-bottom: .5rem; }
.fila-nome { font-weight: 700; overflow-wrap: anywhere; }
.fila-status { color: var(--tinta-suave); font-size: .9rem; font-variant-numeric: tabular-nums; }
.barra { height: 6px; border-radius: 999px; background: var(--papel); overflow: hidden; }
.barra span { display: block; height: 100%; width: 0; background: var(--azul); transition: width .2s linear; }
.fila-item[data-estado="ok"] .barra span { background: var(--sinal); }
.fila-item[data-estado="ok"] .fila-status { color: var(--sucesso); font-weight: 700; }
.fila-item[data-estado="erro"] { border-color: #F1C4BE; }
.fila-item[data-estado="erro"] .fila-status { color: var(--alerta); font-weight: 700; }
.fila-item[data-estado="ignorado"] .fila-status { font-style: italic; }

/* ---------- Administração: lista ---------- */
.arquivo-admin { grid-template-columns: 3.25rem 1fr auto; align-items: start; }
.arquivo-admin .tipo { margin-top: .15rem; }
.arquivo-admin .form-excluir { margin: 0; }
.form-descricao { display: flex; gap: .5rem; margin: .6rem 0 0; }
.form-descricao input[type="text"] { padding: .45rem .7rem; font-size: .92rem; }

/* ---------- Rodapé ---------- */
.rodape { border-top: 1px solid var(--linha); background: var(--superficie); }
.rodape-inner {
  width: min(var(--largura), calc(100% - 2rem));
  margin: 0 auto;
  padding: 1.75rem 0;
  display: flex;
  justify-content: space-between;
  gap: 1.5rem;
  flex-wrap: wrap;
  color: var(--tinta-suave);
  font-size: .95rem;
}
.rodape p { margin: 0; }
.rodape strong { color: var(--tinta); }

/* ---------- Celular ---------- */
@media (max-width: 640px) {
  .area-cab { flex-direction: column; align-items: flex-start; }
  .arquivo { grid-template-columns: 2.75rem 1fr; padding: 1rem; }
  .arquivo-tam { grid-column: 2; }
  .arquivo .btn { grid-column: 1 / -1; }
  .arquivo-admin .form-excluir { grid-column: 1 / -1; }
  .arquivo-admin .form-excluir .btn { width: 100%; }
  .envio-campos { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  .pulso path { animation: none; stroke-dashoffset: 0; }
  .barra span { transition: none; }
}