/* header.css */

/* ── Top bar ─────────────────────────────────────────── */
.top-bar {
  display: grid;
  grid-template-columns: 1fr 220px;
  border-bottom: 3px solid var(--c-accent);
}

/* ── Patient block ───────────────────────────────────── */
.patient-block {
  display: flex; flex-direction: column;
  border-right: 1px solid var(--c-line-md);
  border-bottom: none;
}

.prow { display: grid; border-bottom: none; }
.prow:last-child { border-bottom: none; }
.prow-a { grid-template-columns: 2.2fr 1.4fr; }
.prow-b { grid-template-columns: 0.7fr 1.4fr 1.2fr 1.6fr; }
.prow-c { grid-template-columns: 1.6fr 1fr 1.6fr; }
.prow-d { grid-template-columns: 1fr 1fr; }

.fg {
  padding: 7px 13px;
  
  display: flex; flex-direction: column; gap: 2px; min-width: 0;
  border-bottom: none;
}
.fg:last-child { border-right: none; }

.fg__label {
  font-family: var(--ff-title);
  font-size: 8px; font-weight: 700;
  letter-spacing: 0.10em; text-transform: uppercase;
  color: var(--c-accent-dk);
}
.fg__input {
  background: transparent; border: none; outline: none;
  border-bottom: 1.5px solid var(--c-ink-3);
  padding: 2px 0 2px; width: 100%;
  font-family: var(--ff-body); font-size: 12.5px;
  color: var(--c-ink); transition: border-color 0.15s;
  
}
.fg__input:focus { border-bottom-color: var(--c-accent); }
.fg__input::placeholder { color: var(--c-ink-4); font-size: 11px; }
.fg__input[readonly] { color: var(--c-ink-3); cursor: default; }
#fechaNacimiento { color-scheme: light; }

/* ── Logo + Fecha ────────────────────────────────────── */
.logo-fecha {
  display: flex; flex-direction: column;
}
.logo-box {
  flex: 1; display: flex; align-items: center; justify-content: center;
  padding: 14px 16px;
  border-bottom: 1px solid var(--c-line);
  background: var(--c-accent-lt);
}
.logo-box img {
  width: 100%;
  height: 100%;
  object-fit: cover; /* 🔥 esto hace el zoom */
}
.logo-placeholder {
  width: 100%; height: 46px;
  border: 2px dashed var(--c-accent-md);
  border-radius: var(--r-sm);
}
.fecha-box {
  padding: 7px 13px;
  display: flex; flex-direction: column; gap: 3px;
}
.fecha-box .fecha-lbl {
  font-family: var(--ff-title);
  font-size: 8px; font-weight: 700;
  letter-spacing: 0.10em; text-transform: uppercase;
  color: var(--c-accent-dk);
}
.fecha-box input[type="date"] {
  background: transparent; border: none; outline: none;
  border-bottom: 1.5px solid var(--c-line);
  font-family: var(--ff-body); font-size: 12px;
  color: var(--c-ink); width: 100%; color-scheme: light; padding: 2px 0;
}