/* Convertime · diálogos, avisos con «Deshacer» y estados de acciones (pedido del socio del 09-10). Lo usan las páginas
   públicas (/ui.js) y la consola (web/src/ui.jsx). Identidad de Convertime: petróleo y marfil, Plex, radios cero, bordes
   de tabla de 1.5 px, durazno solo como señal (nunca texto durazno sobre claro). Los cinco estados de acción tienen el
   mismo color en todo el sitio:
   inicial: el del botón · en curso: petróleo medio con franja que avanza · listo: petróleo claro con tilde ·
   error: durazno con borde tinta, «Reintentar» y el motivo debajo · deshabilitado: gris con el motivo debajo. */
@font-face{font-family:Plex;src:url('/fonts/plex-sans-400.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:Plex;src:url('/fonts/plex-sans-600.woff2') format('woff2');font-weight:600;font-display:swap}
@font-face{font-family:PlexMono;src:url('/fonts/plex-mono-500.woff2') format('woff2');font-weight:500;font-display:swap}
:root{--cv-petroleo:#123C3A;--cv-marfil:#F7F5EF;--cv-durazno:#F3B58B;--cv-tinta:#172521;--cv-blanco:#FFFFFF;--cv-texto-2:#4B5A55;--cv-linea:#D3D8D2;--cv-linea-fuerte:#5B6B66;--cv-petroleo-claro:#E6ECE9;--cv-durazno-claro:#FBE6D6;--cv-sobre-petroleo:#C9D3CF;--cv-curso:#3C5F5C;--cv-sans:Plex,'IBM Plex Sans',Arial,sans-serif;--cv-mono:PlexMono,'IBM Plex Mono',ui-monospace,monospace}

/* ---- Diálogo: una ficha de tabla, sin sombras ni esquinas redondas ---- */
.cv-dialog{width:min(500px,calc(100vw - 32px));max-width:none;max-height:calc(100dvh - 48px);margin:auto;padding:0;border:1.5px solid var(--cv-tinta);border-top:6px solid var(--cv-petroleo);border-radius:0;background:var(--cv-marfil);color:var(--cv-tinta);font:400 16px/1.55 var(--cv-sans);overflow:auto;overscroll-behavior:contain}
.cv-dialog--danger{border-top-color:var(--cv-durazno)}
.cv-dialog::backdrop{background:rgba(23,37,33,.62)}
.cv-dialog[open]{animation:cv-in .16s ease-out}
.cv-dialog[open]::backdrop{animation:cv-fade .16s ease-out}
@keyframes cv-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes cv-fade{from{opacity:0}to{opacity:1}}
.cv-dialog-body{display:grid;gap:12px;padding:24px 26px 6px}
.cv-dialog-kicker{display:flex;align-items:center;gap:8px;margin:0;font:600 12px/1.2 var(--cv-sans);letter-spacing:.08em;text-transform:uppercase;color:var(--cv-texto-2)}
.cv-dialog--danger .cv-dialog-kicker{color:var(--cv-tinta)}
.cv-dialog--danger .cv-dialog-kicker svg{flex:none;width:18px;height:18px;padding:2px;background:var(--cv-durazno);color:var(--cv-tinta)}
.cv-dialog-title{margin:0;font:600 clamp(1.4rem,4.6vw,1.75rem)/1.12 var(--cv-sans);letter-spacing:-.02em;text-wrap:balance;color:var(--cv-tinta)}
.cv-dialog-desc{display:grid;gap:10px}
.cv-dialog-detail{margin:0;padding:10px 12px;background:var(--cv-blanco);border:1.5px solid var(--cv-linea);border-left:4px solid var(--cv-petroleo);font:500 14px/1.4 var(--cv-mono);overflow-wrap:anywhere}
.cv-dialog--danger .cv-dialog-detail{border-left-color:var(--cv-tinta)}
.cv-dialog-text{margin:0;font-size:16px;color:var(--cv-tinta);max-width:54ch}
.cv-dialog-text+.cv-dialog-text{color:var(--cv-texto-2);font-size:15px}
.cv-dialog-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:10px;margin-top:18px;padding:16px 26px 24px;border-top:1px solid var(--cv-linea)}
.cv-dbtn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:12px 20px;border:1.5px solid transparent;border-radius:0;font:600 16px/1.2 var(--cv-sans);cursor:pointer;transition:background-color .15s,color .15s,border-color .15s}
.cv-dbtn:focus-visible{outline:3px solid var(--cv-petroleo);outline-offset:3px}
.cv-dbtn--cancel{background:var(--cv-blanco);color:var(--cv-petroleo);border-color:var(--cv-petroleo)}
.cv-dbtn--cancel:hover{background:var(--cv-petroleo-claro)}
.cv-dbtn--primary{background:var(--cv-petroleo);color:var(--cv-marfil);border-color:var(--cv-petroleo)}
.cv-dbtn--primary:hover{background:var(--cv-tinta);border-color:var(--cv-tinta)}
.cv-dbtn--danger{background:var(--cv-durazno);color:var(--cv-tinta);border-color:var(--cv-tinta)}
.cv-dbtn--danger:hover{background:var(--cv-tinta);color:var(--cv-marfil)}
/* Palabra de confirmación (acciones que no se deshacen): el botón se habilita al escribirla. */
.cv-dialog-word{display:grid;gap:6px;margin-top:4px}
.cv-dialog-word-label{font:600 15px/1.4 var(--cv-sans);color:var(--cv-tinta)}
.cv-dialog-word-key{display:inline-block;padding:0 6px;background:var(--cv-blanco);border:1.5px solid var(--cv-tinta);font:500 14px/1.6 var(--cv-mono);letter-spacing:.06em}
.cv-dialog-word-input{width:100%;min-height:48px;padding:10px 12px;border:1.5px solid var(--cv-tinta);border-radius:0;background:var(--cv-blanco);color:var(--cv-tinta);font:500 18px/1.2 var(--cv-mono);letter-spacing:.08em;text-transform:uppercase}
.cv-dialog-word-input:focus-visible{outline:3px solid var(--cv-petroleo);outline-offset:2px}
.cv-dialog-word-hint{margin:0;font:400 14px/1.4 var(--cv-sans);color:var(--cv-texto-2)}
.cv-dialog-word-hint[data-ok="1"]{color:var(--cv-petroleo);font-weight:600}
.cv-dbtn:disabled{background:var(--cv-linea);color:var(--cv-texto-2);border-color:var(--cv-linea);cursor:not-allowed}
.cv-dbtn:disabled:hover{background:var(--cv-linea);color:var(--cv-texto-2)}
@media(max-width:599px){
 .cv-dialog{width:100vw;max-height:88dvh;margin:auto 0 0;border-left:0;border-right:0;border-bottom:0}
 .cv-dialog[open]{animation-name:cv-up}
 .cv-dialog-body{padding:22px 16px 4px}
 .cv-dialog-actions{flex-direction:column-reverse;padding:14px 16px calc(16px + env(safe-area-inset-bottom))}
 .cv-dbtn{width:100%;min-height:52px}
}
@keyframes cv-up{from{transform:translateY(24px);opacity:.4}to{transform:none;opacity:1}}

/* ---- Aviso breve con «Deshacer» ---- */
.cv-toasts{position:fixed;left:24px;bottom:24px;z-index:2147483000;display:grid;gap:8px;width:min(460px,calc(100vw - 32px));pointer-events:none}
.cv-toast{position:relative;display:flex;align-items:center;gap:14px;padding:12px 10px 14px 16px;background:var(--cv-tinta);color:var(--cv-marfil);border-left:6px solid var(--cv-petroleo);font:400 15px/1.4 var(--cv-sans);pointer-events:auto;animation:cv-in .16s ease-out;overflow:hidden}
.cv-toast--error{border-left-color:var(--cv-durazno)}
.cv-toast-text{flex:1;min-width:0;overflow-wrap:anywhere}
.cv-toast-action{flex:none;min-height:40px;padding:8px 14px;border:0;border-radius:0;background:var(--cv-durazno);color:var(--cv-tinta);font:600 14px/1 var(--cv-sans);cursor:pointer}
.cv-toast-action:hover{background:var(--cv-marfil)}
.cv-toast-action:focus-visible,.cv-toast-close:focus-visible{outline:3px solid var(--cv-durazno);outline-offset:2px}
.cv-toast-close{flex:none;display:grid;place-items:center;width:36px;height:36px;border:0;background:none;color:var(--cv-marfil);cursor:pointer;font-size:20px;line-height:1}
.cv-toast-time{position:absolute;left:0;bottom:0;height:3px;width:100%;background:var(--cv-durazno);transform-origin:left;animation:cv-time linear forwards}
.cv-toast:hover .cv-toast-time,.cv-toast:focus-within .cv-toast-time{animation-play-state:paused}
@keyframes cv-time{from{transform:scaleX(1)}to{transform:scaleX(0)}}
/* En el celular, arriba (debajo del encabezado): abajo taparía la barra con la acción principal. */
@media(max-width:599px){.cv-toasts{left:16px;right:16px;top:calc(var(--top-h,60px) + 8px);bottom:auto;width:auto}}

/* ---- Estados de acciones ---- */
.cv-act{position:relative;overflow:hidden}
.cv-act-icon{display:inline-grid;place-items:center;flex:none;width:18px;height:18px}
.cv-act-icon+.cv-act-label{margin-left:8px}
.cv-act-icon svg{width:18px;height:18px}
.cv-act[data-state=busy]{background:var(--cv-curso)!important;color:var(--cv-marfil)!important;border-color:var(--cv-curso)!important;text-decoration:none!important;cursor:progress!important;opacity:1!important}
.cv-act[data-state=busy]::after{content:'';position:absolute;left:0;right:0;bottom:0;height:4px;background:repeating-linear-gradient(-45deg,var(--cv-durazno) 0 8px,transparent 8px 16px);background-size:22.6px 4px;animation:cv-run .7s linear infinite}
.cv-act[data-state=busy] .cv-act-icon svg{animation:cv-spin 1.1s linear infinite}
.cv-act[data-state=done]{background:var(--cv-petroleo-claro)!important;color:var(--cv-petroleo)!important;border-color:var(--cv-petroleo)!important;text-decoration:none!important;opacity:1!important}
.cv-act[data-state=error]{background:var(--cv-durazno)!important;color:var(--cv-tinta)!important;border-color:var(--cv-tinta)!important;text-decoration:none!important;opacity:1!important}
.cv-act[data-state=error]:hover{background:var(--cv-marfil)!important}
.cv-act[data-state=off],.cv-act:disabled:not([data-state=busy]):not([data-state=done]){background:var(--cv-linea)!important;color:var(--cv-texto-2)!important;border-color:var(--cv-linea)!important;text-decoration:none!important;opacity:1!important;cursor:not-allowed!important}
.cv-act[aria-disabled=true]{pointer-events:none}
.cv-act.link-btn[data-state],.cv-act.icon-btn[data-state]{display:inline-flex;align-items:center;width:auto;min-height:32px;padding:4px 10px;border:1.5px solid transparent}
@keyframes cv-run{from{background-position:0 0}to{background-position:22.6px 0}}
@keyframes cv-spin{to{transform:rotate(360deg)}}
.cv-act-reason{margin:8px 0 0;font:600 14px/1.4 var(--cv-sans);color:var(--cv-texto-2);max-width:60ch}
.cv-act-reason--error{padding:8px 12px;background:var(--cv-durazno-claro);border-left:4px solid var(--cv-tinta);color:var(--cv-tinta)}
.cv-act-reason:empty{display:none}
.paybar-action:has(.cv-act-reason:not(:empty)){flex-wrap:wrap}
.paybar .cv-act-reason{color:var(--cv-sobre-petroleo);flex:1 1 100%;margin-top:0}
.paybar .cv-act-reason--error{color:var(--cv-tinta)}
.paybar .cv-act[data-state=busy]{border-color:var(--cv-sobre-petroleo)!important}
@media(prefers-reduced-motion:reduce){
 .cv-dialog[open],.cv-dialog[open]::backdrop,.cv-toast{animation:none}
 .cv-act[data-state=busy]::after{animation:none}
 .cv-act[data-state=busy] .cv-act-icon svg{animation:none}
 .cv-toast-time{animation:none;display:none}
}
