/* Bora Doutor: rules used only on the atestados page(s). Loaded after base.css. */

/* ===========================================================================
   Atestados e declarações (template-cholo-atestados.php) — prefix at-

   Not another card grid: what a person needs here is a translation. They
   arrive holding a situation in their own words ("a academia pediu liberação")
   and need to know which document that is. So the centre of the page is that
   mapping, read left to right, one row per situation.
   =========================================================================== */


/* The verdict card. A physical-activity clearance resolves to one word, so
   that word is the whole card. */
.at-card {
  background: #fff;
  border: 1px solid var(--color-rule);
  border-radius: var(--radius-md);
  padding: 28px;
  box-shadow: 0 22px 48px rgba(16, 40, 64, 0.12);
  text-align: center;
}
.at-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding-bottom: 16px;
  border-bottom: 2px solid var(--color-dark);
  margin-bottom: 26px;
  text-align: left;
}
.at-card-head b { font-size: 0.9rem; color: var(--color-dark); }
.at-verdict {
  font-family: var(--font-serif);
  font-size: 4.2rem;
  line-height: 1;
  font-weight: 600;
  color: #15803D;
  letter-spacing: 0.02em;
}
.at-verdict-sub {
  margin: 10px 0 26px;
  color: var(--color-text-muted);
  font-weight: 300;
  font-size: 0.92rem;
}
.at-card-fields { text-align: left; border-top: 1px solid var(--color-rule); padding-top: 18px; }
.at-card-fields div { display: flex; justify-content: space-between; gap: 14px; padding: 7px 0; font-size: 0.85rem; }
.at-card-fields dt, .at-card-fields span:first-child { color: var(--color-text-muted); font-weight: 300; }
.at-card-fields span:last-child { color: var(--color-dark); font-weight: 600; }
.at-card-sign { margin: 18px 0 0; padding-top: 16px; border-top: 1px solid var(--color-rule); text-align: left; font-size: 0.78rem; color: var(--color-text-muted); font-weight: 300; line-height: 1.5; }
.at-card-sign strong { color: var(--color-dark); font-weight: 600; }

/* The mapping — the signature */
.at-map { padding: var(--section-y) 0; }
/* Situação → documento. Every Brazilian medical document is identified by a
   coloured band, and the receita page already encodes that (--rx-edge). This is
   the same device: a tarja down the left of each row, coloured by what KIND of
   document the situation produces — an atestado attests, a declaração records
   attendance, a relatório reports, an encaminhamento refers. Four families, so
   the two rows that both produce "aptidão física" now visibly rhyme instead of
   looking like a duplicate.

   The measure is 780px, not 900: at 900 the situation and the document sat at
   opposite ends of the row and stopped reading as one statement. The arrow that
   used to float in the gap is gone — the band and the tag do that work. */
.at-map-list { max-width: 780px; margin: 0 auto; display: flex; flex-direction: column; gap: 10px; }
.at-map-row {
  --at-edge: var(--color-primary-strong);
  --at-tint: #E6F4F8;
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 24px;
  padding: 17px 22px 17px 26px;
  background: var(--color-bg);
  border: 1px solid var(--color-rule);
  border-radius: var(--radius-md);
  transition: border-color 0.25s var(--ease-snap), transform 0.25s var(--ease-snap);
}
.at-map-row::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 4px;
  background: var(--at-edge);
  border-radius: var(--radius-md) 0 0 var(--radius-md);
}
.at-map-row:hover { border-color: #DCE3EF; transform: translateX(2px); }
.at-map-row--declaracao    { --at-edge: var(--color-text-muted); --at-tint: #EEF1F7; }
.at-map-row--relatorio     { --at-edge: var(--rx-special); --at-tint: #EDF0F4; }
.at-map-row--encaminhamento{ --at-edge: var(--color-brand-deep); --at-tint: #E8EEFF; }
.at-map-need { margin: 0; font-size: 1.02rem; font-weight: 400; color: var(--color-dark); line-height: 1.5; }
.at-map-doc {
  margin: 0;
  justify-self: end;
  white-space: nowrap;
  font-size: 0.8rem;
  font-weight: 600;
  letter-spacing: 0.01em;
  color: var(--at-edge);
  background: var(--at-tint);
  padding: 6px 13px;
  border-radius: 999px;
}
@media (max-width: 767px) {
  .at-map-row { grid-template-columns: 1fr; gap: 12px; padding: 16px 18px 16px 22px; }
  .at-map-doc { justify-self: start; }
}
.at-map-note {
  max-width: 70ch;
  margin: 28px auto 0;
  text-align: center;
  color: var(--color-text-muted);
  font-size: 0.85rem;
  font-weight: 300;
  line-height: 1.6;
}

/* Aptidao fisica */
.at-fit { padding: var(--section-y) 0; }
.at-fit-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 64px; align-items: start; }
.at-fit-list { display: flex; flex-direction: column; gap: 4px; margin-top: 24px; }
.at-fit-list li { display: flex; gap: 16px; padding: 18px 0; border-bottom: 1px solid var(--color-rule); }
.at-fit-list li:last-child { border-bottom: 0; }
.at-fit-list b { display: block; font-weight: 600; color: var(--color-dark); margin-bottom: 3px; }
.at-fit-list span { color: var(--color-text-muted); font-weight: 300; font-size: 0.93rem; }
.at-fit-aside {
  background: var(--color-bg-soft);
  border-radius: var(--radius-lg);
  padding: 32px;
  margin-top: 24px;
}
.at-fit-aside h3 { font-size: 1.08rem; margin-bottom: 10px; }
.at-fit-aside p { color: var(--color-text-muted); font-weight: 300; font-size: 0.95rem; margin: 0 0 14px; }
.at-fit-aside p:last-child { margin-bottom: 0; }
.at-sports { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; }
.at-sports li {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 9px 16px 9px 9px;
  background: #fff;
  border: 1px solid var(--color-rule);
  border-radius: 999px;
  font-size: 0.9rem;
  font-weight: 500;
  color: var(--color-dark);
}
.at-sports-icon {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: rgba(0, 209, 255, 0.1);
  color: var(--color-primary-strong);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.at-sports-icon svg { width: 15px; height: 15px; }@media (max-width: 1024px) {
.at-map, .at-fit { padding: 80px 0; }.at-fit-grid { grid-template-columns: 1fr; gap: 40px; }
}@media (max-width: 767px) {
.at-map, .at-fit { padding: 56px 0; }.at-card { padding: 20px; }
  .at-verdict { font-size: 3.2rem; }
}

/* The verdict seal on /cholo-atestado/. APTO's glyphs measure 145px at
   4.2rem, so 210 clears the word with room to spare while still reading as a
   stamp. It grazes the header rule above it by about 20px, which is right — a
   real stamp sits over the document rather than politely avoiding its rules.
   Do not enlarge it much past this: at 300 it swallows the rule and the
   subtitle both and stops looking like a stamp at all. */
.at-verdict-wrap { position: relative; }
.at-verdict-anim {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 210px;
  height: 210px;
  transform: translate(-50%, -50%);
  z-index: 0;
  pointer-events: none;
}
.at-verdict { position: relative; z-index: 1; }