@import url('https://fonts.googleapis.com/css2?family=Special+Elite&family=Courier+Prime:wght@400;700&display=swap');

:root {
  --paper: #E9E0C7;
  --paper-dark: #DACBA0;
  --desk: #C7B98C;
  --ink: #26221A;
  --ink-soft: #5B5541;
  --line: #B9A876;
  --danger: #A1332A;
  --danger-bg: #F1DAD3;
  --warn: #9C7414;
  --warn-bg: #F1E5C4;
  --safe: #3C6B47;
  --safe-bg: #DCE7D4;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  min-height: 100vh;
  background: var(--desk);
  background-image:
    radial-gradient(circle at 20% 10%, rgba(0,0,0,0.05), transparent 40%),
    radial-gradient(circle at 80% 90%, rgba(0,0,0,0.06), transparent 45%);
  font-family: 'Courier Prime', 'Courier New', monospace;
  color: var(--ink);
  display: flex;
  justify-content: center;
  padding: 48px 16px 96px;
}

.folder {
  width: 100%;
  max-width: 720px;
  background: var(--paper);
  border: 1px solid var(--line);
  box-shadow: 0 18px 40px rgba(20, 16, 8, 0.35), 0 2px 0 rgba(255,255,255,0.4) inset;
  position: relative;
}

.tab {
  position: absolute;
  top: -30px;
  left: 32px;
  background: var(--paper-dark);
  border: 1px solid var(--line);
  border-bottom: none;
  padding: 6px 20px 10px;
  font-family: 'Special Elite', monospace;
  font-size: 0.75rem;
  letter-spacing: 0.12em;
  color: var(--ink-soft);
  clip-path: polygon(6% 0, 94% 0, 100% 100%, 0 100%);
}

.folder-inner {
  padding: 52px 40px 40px;
}

.masthead {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  border-bottom: 2px solid var(--ink);
  padding-bottom: 14px;
  margin-bottom: 6px;
}

.masthead h1 {
  font-family: 'Special Elite', monospace;
  font-size: 1.5rem;
  letter-spacing: 0.03em;
  margin: 0;
}

.masthead .case-no {
  font-size: 0.7rem;
  color: var(--ink-soft);
  text-align: right;
  line-height: 1.5;
}

.subtitle {
  font-size: 0.78rem;
  color: var(--ink-soft);
  margin: 0 0 30px;
}

form.intake label {
  display: block;
  font-size: 0.72rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ink-soft);
  margin-bottom: 8px;
}

.intake-row {
  display: flex;
  gap: 10px;
}

.intake-row input[type="text"] {
  flex: 1;
  background: #fbf7ea;
  border: 1px solid var(--ink);
  padding: 12px 14px;
  font-family: 'Courier Prime', monospace;
  font-size: 0.95rem;
  color: var(--ink);
}

.intake-row input[type="text"]:focus {
  outline: 3px solid #7a6a2f;
  outline-offset: 1px;
}

button.stamp-btn {
  font-family: 'Special Elite', monospace;
  background: var(--ink);
  color: var(--paper);
  border: 1px solid var(--ink);
  padding: 0 22px;
  font-size: 0.85rem;
  letter-spacing: 0.08em;
  cursor: pointer;
}

button.stamp-btn:hover { background: #3a3325; }
button.stamp-btn:focus-visible { outline: 3px solid #7a6a2f; outline-offset: 2px; }

.error-note {
  margin-top: 14px;
  color: var(--danger);
  font-size: 0.82rem;
}

.perforation {
  border: none;
  border-top: 2px dashed var(--line);
  margin: 38px 0 30px;
}

.report-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 22px;
  flex-wrap: wrap;
}

.report-meta { font-size: 0.82rem; line-height: 1.9; }
.report-meta .k { color: var(--ink-soft); }
.report-meta .v { word-break: break-all; }

.stamp {
  font-family: 'Special Elite', monospace;
  display: inline-block;
  padding: 10px 18px;
  border: 4px solid currentColor;
  border-radius: 6px;
  transform: rotate(-7deg);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-size: 1rem;
  opacity: 0.92;
  white-space: nowrap;
}

.stamp.alto { color: var(--danger); }
.stamp.moderado { color: var(--warn); }
.stamp.bajo { color: var(--safe); }

.meter-row {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 0.78rem;
  color: var(--ink-soft);
  margin-bottom: 26px;
}

.meter {
  flex: 1;
  height: 10px;
  background: #d9cba0;
  border: 1px solid var(--ink);
  overflow: hidden;
}

.meter-fill {
  height: 100%;
}
.meter-fill.alto { background: var(--danger); }
.meter-fill.moderado { background: var(--warn); }
.meter-fill.bajo { background: var(--safe); }

.evidence-heading {
  font-family: 'Special Elite', monospace;
  font-size: 0.85rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-soft);
  margin: 0 0 14px;
}

.evidence {
  list-style: none;
  margin: 0;
  padding: 0;
}

.evidence li {
  display: grid;
  grid-template-columns: 92px 74px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  padding: 12px 0;
  border-top: 1px solid var(--line);
  font-size: 0.86rem;
}

.evidence li > span:last-child {
  overflow-wrap: anywhere;
  word-break: break-word;
  min-width: 0;
}

.evidence li:last-child { border-bottom: 1px solid var(--line); }

.evidence .tag-no {
  font-family: 'Special Elite', monospace;
  color: var(--ink-soft);
  font-size: 0.72rem;
  letter-spacing: 0.05em;
}

.badge {
  display: inline-block;
  font-size: 0.62rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 3px 6px;
  border: 1px solid currentColor;
  white-space: nowrap;
  justify-self: start;
}

.badge.grave { color: var(--danger); background: var(--danger-bg); }
.badge.atencion { color: var(--warn); background: var(--warn-bg); }
.badge.info { color: var(--ink-soft); background: var(--paper-dark); }
.badge.confirmado { color: var(--paper); background: var(--danger); border-color: var(--ink); font-weight: bold; }

.no-findings {
  font-size: 0.88rem;
  color: var(--ink-soft);
  padding: 14px 0;
}

.disclaimer {
  margin-top: 34px;
  font-size: 0.72rem;
  color: var(--ink-soft);
  border-top: 1px solid var(--line);
  padding-top: 14px;
}

/* ---------- Bandeja de revisión (/admin) ---------- */

.admin-link {
  display: block;
  text-align: center;
  font-size: 0.7rem;
  color: var(--ink-soft);
  margin-top: 18px;
  text-decoration: none;
  letter-spacing: 0.05em;
}
.admin-link:hover { color: var(--ink); }

.kofi-tab {
  position: absolute;
  bottom: 28px;
  right: -14px;
  background: var(--paper-dark);
  border: 1px solid var(--line);
  border-right: none;
  padding: 9px 20px 9px 16px;
  font-family: 'Special Elite', monospace;
  font-size: 0.72rem;
  letter-spacing: 0.04em;
  color: var(--ink-soft);
  text-decoration: none;
  box-shadow: -3px 3px 8px rgba(20, 16, 8, 0.15);
  transform: rotate(2deg);
  transition: transform 0.15s ease, color 0.15s ease;
}
.kofi-tab:hover {
  color: var(--ink);
  transform: rotate(0deg);
}

.tray-heading {
  font-family: 'Special Elite', monospace;
  font-size: 0.85rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--ink-soft);
  margin: 0 0 4px;
}

.tray-sub {
  font-size: 0.78rem;
  color: var(--ink-soft);
  margin: 0 0 26px;
}

.proposal {
  border: 1px solid var(--line);
  background: #fbf7ea;
  padding: 16px 18px;
  margin-bottom: 16px;
}

.proposal-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  margin-bottom: 8px;
}

.proposal-valor {
  font-family: 'Special Elite', monospace;
  font-size: 0.95rem;
}

.proposal-fecha {
  font-size: 0.7rem;
  color: var(--ink-soft);
  white-space: nowrap;
}

.proposal-justificacion {
  font-size: 0.84rem;
  margin: 0 0 8px;
}

.proposal-fuente {
  font-size: 0.76rem;
  margin: 0 0 14px;
}
.proposal-fuente a { color: var(--ink-soft); }

.proposal-actions {
  display: flex;
  gap: 10px;
}

.proposal-actions button {
  font-family: 'Special Elite', monospace;
  font-size: 0.75rem;
  letter-spacing: 0.05em;
  padding: 8px 16px;
  border: 2px solid currentColor;
  background: transparent;
  cursor: pointer;
  text-transform: uppercase;
}

.proposal-actions .aprobar { color: var(--safe); }
.proposal-actions .aprobar:hover { background: var(--safe-bg); }
.proposal-actions .rechazar { color: var(--danger); }
.proposal-actions .rechazar:hover { background: var(--danger-bg); }

.empty-tray {
  font-size: 0.85rem;
  color: var(--ink-soft);
  padding: 20px 0;
}

.login-box label {
  display: block;
  font-size: 0.72rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ink-soft);
  margin-bottom: 8px;
}

.login-box input[type="password"] {
  width: 100%;
  background: #fbf7ea;
  border: 1px solid var(--ink);
  padding: 12px 14px;
  font-family: 'Courier Prime', monospace;
  font-size: 0.95rem;
  color: var(--ink);
  margin-bottom: 14px;
}

@media (max-width: 560px) {
  .folder-inner { padding: 46px 20px 30px; }
  .intake-row { flex-direction: column; }
  button.stamp-btn { padding: 12px; }
  .evidence li { grid-template-columns: minmax(0, 1fr); }
  .masthead { flex-direction: column; gap: 6px; }
  .masthead .case-no { text-align: left; }
  .proposal-actions { flex-direction: column; }
  .kofi-tab {
    position: static;
    display: block;
    width: fit-content;
    margin: 24px auto 0;
    border-right: 1px solid var(--line);
    transform: none;
    box-shadow: none;
  }
}