:root{--brand:#4f46e5;--brand-dark:#4338ca}
html{scroll-behavior:smooth}
body{-webkit-font-smoothing:antialiased}
.badge{display:inline-block;padding:.15rem .55rem;border-radius:9999px;font-size:.72rem;font-weight:600;line-height:1.4}
.badge-pendiente{background:#fef3c7;color:#92400e}
.badge-aprobado{background:#d1fae5;color:#065f46}
.badge-rechazado{background:#fee2e2;color:#991b1b}
.badge-reembolsado{background:#e5e7eb;color:#374151}
.badge-activa{background:#d1fae5;color:#065f46}
.badge-borrador{background:#e5e7eb;color:#374151}
.badge-cancelada{background:#fee2e2;color:#991b1b}
.badge-sorteada{background:#ede9fe;color:#5b21b6}
.card{background:#fff;border:1px solid #e5e7eb;border-radius:.75rem}
/* Panel legible para TEXTOS SUELTOS sobre el fondo del sitio publico.
   Fondo blanco translucido con desenfoque suave: el texto se lee bien sin tapar del todo la imagen de fondo. */
.text-panel{background:rgba(255,255,255,.86);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.6);border-radius:.9rem;padding:1.1rem 1.25rem;box-shadow:0 2px 10px rgba(0,0,0,.07)}
.btn{display:inline-flex;align-items:center;gap:.4rem;padding:.5rem .9rem;border-radius:var(--btn-radius,.5rem);font-weight:600;font-size:.875rem;cursor:pointer;border:0}
.btn-primary{background:var(--brand);color:#fff}
.btn-primary:hover{background:var(--brand-dark)}
.btn-danger{background:#dc2626;color:#fff}
.btn-danger:hover{background:#b91c1c}
.btn-ghost{background:#f3f4f6;color:#374151}
.btn-ghost:hover{background:#e5e7eb}
.input{width:100%;padding:.55rem .7rem;border:1px solid #d1d5db;border-radius:.5rem;font-size:.9rem}
.input:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px rgba(79,70,229,.15)}
.label{display:block;font-size:.8rem;font-weight:600;color:#374151;margin-bottom:.25rem}
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.table-row:hover{background:#f9fafb}
.nav-link.active{background:rgba(255,255,255,.15);color:#fff}

/* Selector de pais (codigo telefonico): desplegable propio, sin JavaScript.
   En el boton se ve solo el codigo (ej +57); en la lista se ve el nombre. */
.ccpais{position:relative;min-width:6rem}
.ccpais .ccradio{position:absolute;opacity:0;width:0;height:0;margin:0;pointer-events:none}
.ccpais .ccsel{position:relative}
.ccpais .ccsummary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:.35rem;padding:.55rem .7rem;border:1px solid #d1d5db;border-radius:.5rem;font-size:.9rem;font-weight:600;background:#fff;cursor:pointer;white-space:nowrap}
.ccpais .ccsummary::-webkit-details-marker{display:none}
.ccpais .ccsel[open] .ccsummary{border-color:var(--brand);box-shadow:0 0 0 3px rgba(79,70,229,.15)}
.ccpais .ccarrow{color:#6b7280;font-size:.72rem}
.ccpais .ccsel[open] .ccarrow{transform:rotate(180deg)}
.ccpais .ccopts{position:absolute;top:calc(100% + 4px);left:0;z-index:40;min-width:12rem;max-height:15rem;overflow-y:auto;background:#fff;border:1px solid #e5e7eb;border-radius:.5rem;box-shadow:0 10px 25px rgba(0,0,0,.12);padding:.25rem}
.ccpais .ccopts label{display:block;padding:.55rem .6rem;border-radius:.375rem;font-size:.9rem;cursor:pointer;white-space:nowrap}
.ccpais .ccopts label:hover{background:#f3f4f6}