/* ============================================================================
   Citatorios (iteracion 1) — GLOBAL a proposito.
   1) Colores de estado compartidos por la agenda, el panel de detalle, el alta y
      el formato (cada uno con CSS scoped propio; los estados viven aqui una vez).
   2) Impresion del formato: el CSS scoped no alcanza al shell, asi que la regla
      vive aqui guardada por body:has(.citfmt-page), como Boletas (T-085).
   Contraste AA: cada -ink se midio sobre su -bg (>= 4.5:1).
   ============================================================================ */
:root {
    --cit-pend-bg: #FEF3C7; --cit-pend-ink: #8A5510;
    --cit-conf-bg: #D8F0F0; --cit-conf-ink: #1F5E60;
    --cit-rep-bg:  #DDE9F6; --cit-rep-ink:  #215681;
    --cit-ok-bg:   #DCFCE7; --cit-ok-ink:   #0B6449;
    --cit-no-bg:   #FBE4E4; --cit-no-ink:   #8E2424;
    --cit-can-bg:  #EEEAE2; --cit-can-ink:  #5C6068;
    --cit-clase-a: #E4DED2; --cit-clase-b: #F3EFE7;
    --cit-wa:      #1FA855; --cit-wa-head: #0B6B5B; --cit-wa-bg: #EFE7DC;
}

/* Doble selector: ".v2-scope button" (base.css) pone fondo transparente a todo boton y le
   ganaria a una sola clase; con ".v2-scope .cit-st-x" el estado pinta tambien los bloques. */
.cit-st-pend, .v2-scope .cit-st-pend { background: var(--cit-pend-bg); color: var(--cit-pend-ink); }
.cit-st-conf, .v2-scope .cit-st-conf { background: var(--cit-conf-bg); color: var(--cit-conf-ink); }
.cit-st-rep, .v2-scope .cit-st-rep { background: var(--cit-rep-bg);  color: var(--cit-rep-ink); }
.cit-st-ok, .v2-scope .cit-st-ok { background: var(--cit-ok-bg);   color: var(--cit-ok-ink); }
.cit-st-no, .v2-scope .cit-st-no { background: var(--cit-no-bg);   color: var(--cit-no-ink); }
.cit-st-can, .v2-scope .cit-st-can { background: var(--cit-can-bg);  color: var(--cit-can-ink); }

.cit-pill {
    display: inline-flex; align-items: center; gap: 4px;
    padding: 3px 10px; border-radius: 999px;
    font: 600 12px/1.3 var(--font-sans); white-space: nowrap;
}
.cit-pill .msr { font-size: 15px; }

.cit-av {
    display: inline-grid; place-items: center; flex: none;
    width: 30px; height: 30px; border-radius: 50%;
    color: #fff; font: 700 11px/1 var(--font-sans); letter-spacing: .02em;
}

@media print {
    @page { size: letter; margin: 0; }
    body:has(.citfmt-page) * { visibility: hidden !important; }
    body:has(.citfmt-page) .citfmt-paper,
    body:has(.citfmt-page) .citfmt-paper * { visibility: visible !important; }
    body:has(.citfmt-page) .citfmt-paper {
        position: absolute; left: 0; top: 0; width: 100%; margin: 0;
        padding: 14mm 16mm; box-shadow: none; border: none; border-radius: 0;
        print-color-adjust: exact; -webkit-print-color-adjust: exact;
    }
    body:has(.citfmt-page) .citfmt-noprint { display: none !important; }
}