/* ================= Login ================= */
.login-body{
  background:linear-gradient(135deg,#142133 0%,#1F3046 60%,#2a3f5c 100%);
  min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px;
}
.login-wrap{width:100%;max-width:430px;}
.login-card{background:#fff;border-radius:16px;box-shadow:0 20px 60px rgba(31,48,70,.45);padding:34px 32px;}
.login-brand{margin-bottom:26px;}
.login-brand .brand-badge{
  background:#1F3046;color:#AD9271;
  border:2px solid #AD9271;
}
.login-brand .brand-text h1{color:#1F3046;}
.login-brand .brand-text span{color:#6b7c8f;}
.login-card .form-field{margin-bottom:16px;}
.login-error{
  background:#fce8e6;border:1px solid #f5c6c2;color:#c5221f;
  padding:10px 12px;border-radius:8px;font-size:13px;margin-bottom:14px;
}
.codigo-2fa{font-size:24px;letter-spacing:10px;text-align:center;font-weight:700;color:#1F3046;}
.login-footer{text-align:center;color:#9aa7b4;font-size:12px;margin-top:22px;}

/* ================= Cabecera de usuario ================= */
.user-area{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.user-chip{
  display:flex;align-items:center;gap:10px;background:rgba(255,255,255,.12);
  border:1px solid rgba(173,146,113,.5);padding:6px 14px;border-radius:999px;
}
.user-chip .user-info{display:flex;flex-direction:column;line-height:1.15;text-align:left;}
.user-chip .user-info strong{font-size:13px;color:#fff;}
.user-chip .user-info small{font-size:10.5px;opacity:.85;max-width:240px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#AD9271;}
.user-avatar{font-size:18px;}
.btn-salir:hover{background:#b3261e;border-color:#b3261e;color:#fff;}
.btn-admin{background:#AD9271;color:#142133;border-color:#AD9271;}
.btn-admin:hover{background:#8C7358;color:#fff;}

/* ================= Modal 2FA ================= */
.modal-overlay{
  position:fixed;inset:0;background:rgba(20,33,51,.65);backdrop-filter:blur(3px);
  display:flex;align-items:center;justify-content:center;z-index:100;padding:18px;
}
.modal-overlay[hidden]{display:none;}
.modal{
  background:#fff;border-radius:16px;max-width:540px;width:100%;
  padding:26px 28px;box-shadow:0 24px 70px rgba(20,33,51,.45);
}
.modal h2{color:#1F3046;font-size:18px;margin-bottom:10px;display:flex;align-items:center;gap:8px;}
.qr-centro{
  display:flex;justify-content:center;padding:16px;background:#F7F4EF;
  border:1.5px dashed #AD9271;border-radius:12px;margin:14px 0;
}
.pasos-2fa{margin:6px 0 10px 18px;font-size:13.5px;color:#6b7c8f;display:flex;flex-direction:column;gap:6px;}
.btn-danger{background:#d93025;color:#fff;}
.btn-danger:hover{background:#b3261e;}

/* ================= Panel admin ================= */
.check-line{display:flex;align-items:center;gap:9px;font-size:13.5px;margin:10px 0;cursor:pointer;}
.check-line input{width:16px;height:16px;accent-color:#AD9271;cursor:pointer;}
.zona-fieldset{border:1.5px solid #E5E1DA;border-radius:10px;padding:12px 14px;margin:12px 0;}
.zona-fieldset:disabled{opacity:.5;}
.zona-fieldset legend{
  font-size:12px;font-weight:700;color:#8C7358;text-transform:uppercase;letter-spacing:.4px;padding:0 6px;
}
.zona-checks{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:6px 12px;max-height:190px;overflow-y:auto;}
.zona-checks .check-line{margin:0;}
.ayuda-admin{margin-top:16px;background:#F7F4EF;border:1px solid #AD9271;border-radius:10px;padding:10px 14px;color:#1F3046;}
.badge{display:inline-block;padding:2px 9px;border-radius:999px;font-size:11.5px;font-weight:700;}
.badge-ok{background:#F7F4EF;color:#1F3046;}
.badge-off{background:#fce8e6;color:#c5221f;}
.btn-print{background:#e8eaf6;}
/* ---------- Modalidad de pago ---------- */
.subtitulo{font-size:15px;color:var(--verde-osc);margin:22px 0 12px;
           padding-bottom:6px;border-bottom:2px solid var(--claro);}
.subtitulo em{color:var(--rojo);font-style:normal;}
.aviso-ley{margin-top:14px;background:#fff8e1;border:1.5px solid #ffe082;border-left:5px solid #f9a825;
           border-radius:10px;padding:12px 16px;font-size:13px;color:#7a5c00;}
.aviso-ley p{margin-bottom:8px;}
.check-acuerdo{display:flex;align-items:center;gap:9px;font-weight:600;cursor:pointer;}
.check-acuerdo input{width:16px;height:16px;accent-color:#f9a825;cursor:pointer;}
.modalidad-resumen{margin-top:14px;}
.mod-bloque{display:flex;flex-direction:column;min-width:150px;gap:2px;}
.mod-bloque>span{font-size:11px;text-transform:uppercase;letter-spacing:.5px;color:var(--verde-osc);font-weight:700;}
.mod-bloque div{font-size:13.5px;font-variant-numeric:tabular-nums;}
.mod-bloque b{color:var(--verde-osc);}
.mod-bloque strong{font-size:15px;}
.badge-warn{background:#fff8e1;color:#b06000;}
.btn-cert{background:#e8f0fe;}

 
 /* ---------- Overlay de carga (spinner global) ---------- */
.overlay-carga{
  position:fixed; top:0; left:0; right:0; bottom:0; z-index:9998;
  background:rgba(31,48,70,.55);
  display:flex; align-items:center; justify-content:center;
  backdrop-filter:blur(2px);
  -webkit-backdrop-filter:blur(2px);
}
.overlay-carga[hidden]{ display:none; }

.tarjeta-carga{
  background:#fff; border-radius:14px; padding:28px 38px;
  display:flex; flex-direction:column; align-items:center; gap:14px;
  box-shadow:0 12px 40px rgba(31,48,70,.35);
  max-width:340px; margin:0 16px; text-align:center;
  border:1px solid var(--borde);
  border-top:3px solid var(--dorado);
}

.spinner-carga{
  width:46px; height:46px; flex-shrink:0;
  border:5px solid var(--dorado-claro);
  border-top-color:var(--dorado);
  border-radius:50%;
  animation:girarCarga .8s linear infinite;
}
@keyframes girarCarga{ to{ transform:rotate(360deg); } }

.mensaje-carga{
  margin:0; font-size:14px; font-weight:600;
  color:var(--azul-marino);
  letter-spacing:.3px;
}

.submensaje-carga{
  margin:0; font-size:12px; color:var(--texto-suave);
  font-weight:400;
}

body.cargando{ overflow:hidden; }

@media (prefers-reduced-motion: reduce){
  .spinner-carga{ animation-duration:1.8s; }
}



/* ---------- Filtros del historial y badge anulada ---------- */
.barra-filtros-os{
  display:flex; gap:10px; flex-wrap:wrap;
  align-items:center; margin-bottom:16px;
}
.barra-filtros-os .form-input{
  width:auto; min-width:135px;
}
.barra-filtros-os .barra-busqueda{
  flex:1; min-width:220px; margin:0; max-width:none;
}

/* Badge de estado "Anulada" */
.badge-anulada{
  display:inline-block;
  background:var(--crema);
  color:var(--texto-suave);
  border:1px solid var(--borde);
  padding:3px 10px;
  border-radius:6px;
  font-size:11px;
  font-weight:700;
  letter-spacing:.4px;
  text-transform:uppercase;
  white-space:nowrap;
}

/* ---------- Modal Anular ---------- */
.aviso-anular{background:#fce8e6;border:1.5px solid #f5c6c2;border-left:5px solid #c5221f;
              border-radius:10px;padding:10px 14px;font-size:12.5px;color:#8a2018;
              margin-bottom:14px;line-height:1.5;}