/* ============================================================
   DataProtektor | Manual de Marca - Sistema de Estilos Global
   (Bootstrap-only base)
   ============================================================ */

/* Fuente corporativa (si prefieres, impórtala en el HTML) */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600;700;800&display=swap');

/* ----------------------------
   Tokens de marca
   ---------------------------- */
:root {
  --protektor-primary: #25316A;     /* Azul institucional */
  --protektor-secondary: #307BBF;   /* Azul medio */
  --protektor-accent: #63C3D1;      /* Azul claro */
  --protektor-success: #85BE57;     /* Verde éxito */
  --protektor-warning: #FBBF69;     /* Amarillo advertencia */
  --protektor-danger: #E94256;      /* Rojo alerta */
  --protektor-energy: #EE7326;      /* Naranja energía */
  --protektor-text: #25316A;
  --protektor-muted: #5C6B99;

  /* UI */
  --ink: #25316A;
  --primary: #307BBF;
  --accent: #E94256;
  --warm: #EE7326;
  --info: #63C3D1;
  --success: #85BE57;
  --warn: #FBBF69;
  --surface: #FFFFFF;
  --surface-alt: #F7F8FA;
  --border: rgba(37,49,106,.12);
  --shadow: 0 6px 18px rgba(37,49,106,.12);
  --radius: 16px;
}

/* ----------------------------
   Base tipográfica y fondo
   ---------------------------- */
html, body { height: 100%; }
body {
  font-family: 'Montserrat', system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  color: var(--ink);
  background: linear-gradient(180deg, #E8F1F9 0%, #F4F7FB 45%, #FFFFFF 100%) !important;
  background-attachment: fixed;
  line-height: 1.55;
}

h1, h2, h3, h4, h5, h6 {
  color: var(--protektor-primary);
  font-weight: 700;
  letter-spacing: .3px;
}

/* ----------------------------
   Bootstrap extendido (botones)
   ---------------------------- */
.btn-primary { background-color: var(--protektor-secondary); border-color: var(--protektor-secondary); color:#fff; }
.btn-primary:hover, .btn-primary:focus { background-color: var(--protektor-primary); border-color: var(--protektor-primary); }
.btn-secondary { background-color: var(--protektor-primary); border-color: var(--protektor-primary); color:#fff; }
.btn-secondary:hover, .btn-secondary:focus { background-color: var(--protektor-secondary); border-color: var(--protektor-secondary); }

.btn-accent { background-color: var(--protektor-accent); border: none; color: #fff; }
.btn-accent:hover { background-color: var(--protektor-secondary); }
.btn-warning { background-color: var(--protektor-warning); border: none; color: #4a3a00; }
.btn-success { background-color: var(--protektor-success); border: none; color: #fff; }
.btn-danger  { background-color: var(--protektor-danger);  border: none; color: #fff; }

/* ----------------------------
   Badges
   ---------------------------- */
.badge-success { background-color: var(--protektor-success); color:#0b2e13; }
.badge-warning { background-color: var(--protektor-warning); color:#4a3a00; }
.badge-info    { background-color: var(--protektor-accent);  color:#08333a; }
.badge-danger  { background-color: var(--protektor-danger);  color:#fff; }

/* ----------------------------
   Tablas y cards
   ---------------------------- */
.table thead th {
  background-color: var(--protektor-primary) !important;
  color: #fff !important;
  border: none;
  font-weight: 600;
  text-transform: uppercase;
}
.table tbody tr:nth-child(even) { background-color: rgba(48,123,191,.04); }
.table tbody tr:hover { background-color: rgba(48,123,191,.10); }

.card {
  background:#fff;
  border: 1px solid rgba(37,49,106,.08) !important;
  box-shadow: 0 10px 26px rgba(48,123,191,.10) !important;
  border-radius: 16px !important;
}

/* Scroll horizontal seguro para tablas */
.table-responsive { overflow-x: auto !important; -webkit-overflow-scrolling: touch; }
.table-card { width:100%; overflow: visible !important; }  /* visible para tooltips */

/* Evita cortar el scroll en la grilla */
.container-fluid, .row, .col-12, .col-lg-10 { overflow-x: visible !important; }

/* ----------------------------
   Barra de progreso
   ---------------------------- */
.progress { background-color: rgba(48,123,191,.15); border-radius: 999px; height: .75rem; }
.progress-bar { border-radius: 999px; transition: width .5s ease; background-color: var(--protektor-secondary); }
.progress-compact{ height:.7rem; }
.pb-primary{ background: var(--primary) !important; }
.pb-success{ background: var(--success) !important; }
.pb-warn{ background: var(--warn) !important; }
.pb-accent{ background: var(--accent) !important; }
.progress-click{ cursor:pointer; }

/* ----------------------------
   Navbar
   ---------------------------- */
.bg-protektor-secondary { background-color:#25316A !important; }
.navbar.bg-protektor-secondary { box-shadow: 0 6px 16px rgba(37,49,106,.15); }
.navbar.bg-protektor-secondary .navbar-brand,
.navbar.bg-protektor-secondary .nav-link,
.navbar.bg-protektor-secondary .dropdown-toggle { color:#fff !important; }
.navbar.bg-protektor-secondary .dropdown-menu { background-color:#1e2954; border:0; }
.navbar.bg-protektor-secondary .dropdown-item { color:#fff; }
.navbar.bg-protektor-secondary .dropdown-item:hover { background-color:#25316A; color:#fff; }
.navbar .navbar-brand img { height:32px; width:auto; display:block; }

/* ----------------------------
   Sidebar Protektor (compacto)
   ---------------------------- */
.sidebar-protektor{
  background:#25316A; color:#fff;
  width:220px; min-height:100vh;
  display:flex; flex-direction:column; justify-content:space-between;
  box-shadow:4px 0 16px rgba(37,49,106,.12);
  padding:1rem .75rem; transition: width .3s ease;
}
.sidebar-protektor:hover{ width:240px; }

.sidebar-protektor .sp-title{ font-weight:700; letter-spacing:.02em; font-size:.95rem; color:#fff; padding-left:.5rem; margin-bottom:.75rem; }
.sidebar-protektor .sp-nav .nav{ display:flex; flex-direction:column; gap:.3rem; }
.sidebar-protektor .sp-item{ display:flex; align-items:center; gap:.55rem; padding:.55rem .6rem; border-radius:.6rem; color:#E9EEF7; font-weight:500; font-size:.9rem; transition: background .18s ease, transform .08s ease; }
.sidebar-protektor .sp-ico{ font-size:1rem; width:1.2rem; text-align:center; }
.sidebar-protektor .sp-item:hover{ background:rgba(99,195,209,.18); color:#fff; text-decoration:none; }
.sidebar-protektor .sp-item.active{ background:linear-gradient(90deg, #307BBF, #63C3D1); color:#fff; transform: translateY(-1px); box-shadow:0 4px 10px rgba(48,123,191,.25); }
.sidebar-protektor .sp-item.active::before{ content:""; width:3px; height:60%; background:#FBBF69; border-radius:0 3px 3px 0; margin-right:.4rem; }
.sidebar-protektor .sp-foot-text{ color:rgba(255,255,255,.75); font-size:.8rem; text-align:center; margin-top:auto; padding-top:.75rem; border-top:1px solid rgba(255,255,255,.1); }

/* Compacto en móviles */
@media (max-width: 992px){
  .sidebar-protektor{ width:64px; padding:1rem .5rem; }
  .sidebar-protektor .sp-text{ display:none; }
  .sidebar-protektor:hover{ width:200px; }
  .sidebar-protektor:hover .sp-text{ display:inline-block; }
}

/* ----------------------------
   Ribbon / search / tabla (Histórico)
   ---------------------------- */
.compliance-ribbon{ background:var(--ink); color:#fff; border-radius:var(--radius); padding:.75rem 1rem; box-shadow:var(--shadow); display:flex; align-items:center; justify-content:space-between; gap:.75rem; }
.tag{ display:inline-flex; align-items:center; gap:.5rem; font-weight:700; letter-spacing:.02em; border-radius:999px; padding:.35rem .75rem; background:rgba(255,255,255,.12); color:#fff; border:1px solid rgba(255,255,255,.18); font-size:.82rem; backdrop-filter: blur(2px); }
.tag-accent{ background:var(--accent); border-color:var(--accent); }
.tag-info{ background:var(--primary); border-color:var(--primary); }
.tag-warn{ background:#2b365f; border-color:#2b365f; }

.searchbar{ position:sticky; top:.5rem; z-index:1030; background:var(--surface); padding:.75rem; border:1px solid var(--border); border-radius:var(--radius); box-shadow:var(--shadow); }
.searchbar .form-control{ border-color:var(--border); box-shadow:none; }
.searchbar .form-control:focus{ border-color:var(--primary); box-shadow:0 0 0 .2rem rgba(48,123,191,.15); }
.hint{ color:#5c6b99; font-size:.8rem; }
.count-pill{ background:rgba(37,49,106,.08); color:var(--ink); border-radius:999px; padding:.2rem .6rem; font-weight:600; }

.table-card{ background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); box-shadow:var(--shadow); margin-top:.75rem; }
.table-card thead th{ background:var(--ink); color:#fff !important; font-weight:700; font-size:.9rem; letter-spacing:.02em; border-bottom:0 !important; }
.table-card tbody tr:nth-child(even){ background:#FBFDFE; }
.table-card tbody tr:hover{ background:rgba(48,123,191,.06); }
.table-card tbody td, .table-card tbody th{ vertical-align:middle; border-color:var(--border); }
.td-trunc{ max-width:280px; }
.col-progress{ min-width:220px; max-width:320px; width:28ch; }
.name-cell{ font-weight:700; font-size:1.05rem; color:var(--ink); }

/* Badges de estado */
.status-badge{ text-transform:lowercase; font-weight:700; border:0; }
.badge-finished{ background:var(--success) !important; color:#0b2e13 !important; }
.badge-finished-pending{ background:var(--info) !important; color:#08333a !important; }
.badge-pending{ background:var(--warn) !important; color:#4a3a00 !important; }
.badge-error{ background:var(--accent) !important; color:#fff !important; }

/* Botones Opciones */
.btn-pdf{ background:var(--primary); color:#fff; border:0; }
.btn-pdf:hover{ background:#2467a3; color:#fff; }
.btn-json{ background:var(--ink); color:#fff; border:0; }
.btn-json:hover{ background:#1e2954; color:#fff; }
.btn-reproc{ background:var(--warm); color:#fff; border:0; }
.btn-reproc:hover{ background:#d1601b; color:#fff; }
.icon-btn svg{ vertical-align:-2px; margin-right:.35rem; }

/* Responsive acciones */
@media (max-width: 576px){
  .col-progress{ min-width:180px; max-width:260px; }
  .td-trunc{ max-width:180px; }
  .btn-group.desktop-actions{ display:none; }
  .dropdown.mobile-actions{ display:inline-block; }
}
@media (min-width: 577px){ .dropdown.mobile-actions{ display:none; } }

/* Spinner reproceso */
.update-btn{ position:relative; }
.update-btn .spinner{ display:none; width:16px; height:16px; border:2px solid rgba(0,0,0,.2); border-top-color: currentColor; border-radius:50%; animation: spin .8s linear infinite; margin-left:.4rem; vertical-align:-2px; }
.update-btn.loading .spinner{ display:inline-block; }
.update-btn.loading{ opacity:.75; cursor:wait; }
@keyframes spin { to { transform: rotate(360deg); } }

/* Pills físicas ocultas (si existieran) */
.pill-col{ display:none !important; }

/* ----------------------------
   Tooltip (visible sobre cards/tablas)
   ---------------------------- */
.tooltip { z-index:1080 !important; }
.tooltip-inner {
  background-color: var(--protektor-primary);
  color:#fff; font-size:.85rem; font-weight:500;
  padding:.4rem .6rem; border-radius:.4rem;
}
.bs-tooltip-top .tooltip-arrow::before,
.bs-tooltip-auto[data-popper-placement^="top"] .tooltip-arrow::before { border-top-color: var(--protektor-primary); }
.bs-tooltip-bottom .tooltip-arrow::before,
.bs-tooltip-auto[data-popper-placement^="bottom"] .tooltip-arrow::before { border-bottom-color: var(--protektor-primary); }

/* ----------------------------
   Footer
   ---------------------------- */
.footer-compliance { font-size:.85rem; color:var(--protektor-muted); border-top:1px solid rgba(37,49,106,.1); padding-top:1rem; text-align:center; }
/* ============================================================
   DataProtektor | UX Moderno (overrides y utilidades)
   Pega esto al final de protektor.css
   ============================================================ */

/* ---------- Animaciones suaves y accesibles ---------- */
:root{
  --elev-1: 0 4px 10px rgba(37,49,106,.10);
  --elev-2: 0 10px 26px rgba(48,123,191,.14);
  --elev-3: 0 18px 42px rgba(37,49,106,.18);
  --radius-lg: 18px;
  --radius-md: 12px;
  --radius-sm: 10px;
  --focus-ring: 0 0 0 .22rem rgba(48,123,191,.22);
}
*{ outline: none; }
:focus-visible{ box-shadow: var(--focus-ring) !important; border-radius: 10px; }
@media (prefers-reduced-motion: no-preference){
  .animate { transition: all .22s ease; }
  .animate-fast { transition: all .12s ease; }
}

/* ---------- Contenedores “glass card” ---------- */
.card,
.table-card,
.searchbar,
.compliance-ribbon{
  border-radius: var(--radius-lg) !important;
  box-shadow: var(--elev-2) !important;
  backdrop-filter: saturate(1.2) blur(3px);
}

/* Hover sutil en tarjetas */
.card:hover,
.table-card:hover { box-shadow: var(--elev-3) !important; transform: translateY(-1px); }

/* ---------- Buscador con ícono y chips ---------- */
.searchbar{ position: sticky; top:.75rem; }
.searchbar .input-group{
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  overflow: hidden;
}
.searchbar .form-control{
  border: 0; padding-left: 2.2rem; /* espacio para el icono */
}
.searchbar .form-control::placeholder{ color: rgba(37,49,106,.55); }
.searchbar .input-group::before{
  content: "\F52A"; /* bi-search */
  font-family: "bootstrap-icons";
  position: absolute; left: .85rem; top: 50%; transform: translateY(-50%);
  font-size: 1rem; color: var(--primary);
  opacity: .85;
}
.searchbar .btn{ border-top-left-radius: 0; border-bottom-left-radius: 0; }

/* Filtros (chips opcionales) */
.chips{ display:flex; flex-wrap:wrap; gap:.35rem; margin-top:.5rem; }
.chip{
  background: rgba(48,123,191,.10);
  color: var(--ink);
  border: 1px solid rgba(48,123,191,.18);
  border-radius: 999px;
  font-weight: 600;
  padding: .25rem .6rem;
  cursor: pointer;
}
.chip:hover{ background: rgba(48,123,191,.18); }

/* ---------- Tabla moderna ---------- */
/* Cabecera sticky para tablas muy largas */
.table-sticky thead th{
  position: sticky; top: 0; z-index: 2;
  background: linear-gradient(180deg, #25316A 0%, #223064 100%);
}
.table tbody tr{ transition: background .12s ease; }
.table tbody tr:hover{
  background: linear-gradient(90deg, rgba(48,123,191,.10), rgba(99,195,209,.08));
}

/* Columna nombre más legible en pantallas densas */
.name-cell{
  display: flex; align-items: center; gap: .5rem;
}
.name-cell::before{
  content:"\F4E1"; /* bi-person-circle */
  font-family: "bootstrap-icons";
  opacity:.7;
}

/* Estados con “pills” y micro sombras */
.status-badge{
  border-radius: 999px;
  padding: .35rem .6rem;
  box-shadow: 0 3px 8px rgba(0,0,0,.06);
}

/* ---------- Progreso con gradiente y rayas para 'pending' ---------- */
.progress-compact{ background: rgba(48,123,191,.16); }
.pb-primary{
  background-image: linear-gradient(90deg, #307BBF, #63C3D1);
}
.pb-warn{
  background-image: linear-gradient(90deg, #FBBF69, #EEA23D);
}
.pb-accent{
  background-image: linear-gradient(90deg, #E94256, #F06C7B);
}
/* Anímalo si está pendiente */
.tr-pending .progress-bar{
  background-size: 1rem 1rem;
  background-image:
    linear-gradient(45deg, rgba(255,255,255,.20) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.20) 50%, rgba(255,255,255,.20) 75%, transparent 75%, transparent);
  animation: barberpole 1.2s linear infinite;
}
@keyframes barberpole { from{ background-position: 0 0; } to{ background-position: 1rem 0; } }

/* ---------- Botones sólidos y 'ghost' suaves ---------- */
.btn-pdf, .btn-json, .btn-reproc{ border-radius: 10px; }
.btn-soft{
  background: rgba(48,123,191,.08);
  border: 1px solid rgba(48,123,191,.15);
  color: var(--ink);
}
.btn-soft:hover{ background: rgba(48,123,191,.14); }

/* Botón icon-only para móviles */
.btn-icon{
  width: 36px; height: 36px; display: inline-flex; align-items:center; justify-content:center;
  border-radius: 10px;
  border: 1px solid rgba(37,49,106,.14);
  background: rgba(255,255,255,.75);
}
.btn-icon i{ font-size: 1rem; }

/* ---------- Tooltip con fade/slide sutil ---------- */
.tooltip.show{ opacity:1; }
.bs-tooltip-auto[data-popper-placement^=top] .tooltip-inner,
.bs-tooltip-top .tooltip-inner{
  animation: tip-fade-up .16s ease-out;
}
@keyframes tip-fade-up{
  from{ transform: translateY(4px); opacity: .3;}
  to{ transform: translateY(0); opacity: 1;}
}

/* ---------- Paginación moderna ---------- */
.pagination .page-link{
  border-radius: 10px;
  border: 1px solid rgba(37,49,106,.14);
  color: var(--ink);
}
.pagination .page-item.active .page-link{
  background: linear-gradient(90deg, #307BBF, #63C3D1);
  border-color: transparent; color: #fff;
  box-shadow: 0 6px 14px rgba(48,123,191,.25);
}

/* ---------- Sidebar más limpio visualmente ---------- */
.sidebar-protektor{
  border-right: 1px solid rgba(255,255,255,.12);
}
.sidebar-protektor .sp-item{
  letter-spacing: .01em;
}
.sidebar-protektor .sp-item i{
  opacity: .9;
}
.sidebar-protektor .sp-item:hover i{ transform: translateY(-1px); }

/* ---------- Utilidades ---------- */
.shadow-1{ box-shadow: var(--elev-1) !important; }
.shadow-2{ box-shadow: var(--elev-2) !important; }
.rounded-lg{ border-radius: var(--radius-lg) !important; }
.rounded-md{ border-radius: var(--radius-md) !important; }

/* ============================================================
   DataProtektor | Consulta (módulo) — estilos movidos del template
   ============================================================ */

/* ---- Helpers previos del módulo ---- */
.disabled-overlay{pointer-events:none;opacity:.6}
.progress-sticky{position:sticky;top:.5rem;z-index:1020}
.link-disabled{pointer-events:none;opacity:.8}
.pdf-icon{vertical-align:-2px}
.req-asterisk::after{content:" *"; color:var(--protektor-danger); font-weight:700}
.label-help{cursor:help}
.input-hint{font-size:.8rem}
.badge-tight{letter-spacing:.02em}

/* Tarjetas/secciones del formulario */
.section-card{
  border-radius: var(--radius);
  border:1px solid var(--border);
  background: var(--surface);
  box-shadow: var(--shadow);
}

/* ---- Botones (usa tokens existentes) ---- */
.btn-primary{
  background-color: var(--protektor-secondary);
  border-color: var(--protektor-secondary);
  color:#fff;
  border-radius:.75rem;
  box-shadow: 0 8px 18px rgba(48,123,191,.15);
}
.btn-primary:hover,
.btn-primary:focus{
  background-color: var(--protektor-primary);
  border-color: var(--protektor-primary);
}
.btn-outline-secondary{
  color: var(--ink);
  border-color: rgba(37,49,106,.28);
  border-radius:.75rem;
}
.btn-outline-secondary:hover{
  background: #f2f4f8;
  border-color: rgba(37,49,106,.45);
}
.btn-success{
  background-color: var(--protektor-success);
  border-color: var(--protektor-success);
  color:#fff;
  border-radius:.75rem;
  box-shadow: 0 8px 18px rgba(47,191,113,.18);
}

/* Botón flotante (FAB) para reabrir modal */
#fabOpenStatus{
  width:3rem;height:3rem;
  display:none;
  position:fixed; right:1rem; bottom:1rem; z-index:1090;
  background: var(--protektor-secondary);
  border-color: var(--protektor-secondary);
  color:#fff;
  border-radius:50%;
  box-shadow: 0 10px 24px rgba(48,123,191,.18);
}
#fabOpenStatus:hover{ background: var(--protektor-primary); border-color: var(--protektor-primary); }

/* ---- Alerts con marca ---- */
.alert-info{
  background: linear-gradient(180deg,#e8f3fb,#f5f9fe);
  border:1px solid rgba(48,123,191,.25);
  color:#1e4466;
  box-shadow: var(--shadow);
}
.alert-success{
  background:#eff8ef; border:1px solid rgba(133,190,87,.35); color:#0b3b1f;
}
.alert-danger{
  background:#fff1f3; border:1px solid rgba(233,66,86,.35); color:#6f1420;
}

/* ---- Progress ---- */
.progress{ height:.75rem; background: rgba(48,123,191,.15); border-radius:999px; }
.progress-bar{
  border-radius:999px;
  background-image: linear-gradient(90deg, var(--protektor-secondary), var(--protektor-accent));
  transition: width .5s ease;
  font-size:.75rem; line-height:.75rem;
}
.progress-bar.progress-bar-striped.progress-bar-animated{
  background-size: 1rem 1rem;
}

/* ---- Modal ---- */
.modal-content{
  border-radius: var(--radius);
  border:1px solid var(--border);
  box-shadow: 0 12px 32px rgba(37,49,106,.18);
}
.modal-header{
  background: linear-gradient(90deg,#25316A,#1e2954);
  color:#fff; border-bottom:none;
}
.modal-footer{ background:#fafcff; border-top:1px solid var(--border); }

/* ---- Toasts (compat con .text-bg-*) ---- */
.text-bg-success{ background-color: var(--protektor-success)!important; }
.text-bg-warning{ background-color: var(--protektor-warning)!important; color:#1e293b!important; }

/* ---- Inputs ---- */
.input-group-text{
  background:#f6f9fc; color: var(--protektor-primary);
  border-color: var(--border);
}
.form-control, .form-select{ border-color: var(--border); }
.form-control:focus, .form-select:focus{
  border-color: var(--protektor-secondary);
  box-shadow: 0 0 0 .2rem rgba(48,123,191,.15);
}

/* ---- Mini etiqueta “oficial de cumplimiento” ---- */
.oc-tag{
  display:inline-flex; align-items:center; gap:.35rem;
  background:#fff7e8; color:#6b4a00;
  border:1px solid #ffe1ad;
  border-radius:.5rem; padding:.2rem .5rem;
  font-size:.75rem; font-weight:600;
}

/* ---- Lista de pendientes en el modal ---- */
#pendingList{ margin:0; padding-left:1rem; }

/* ---- Accesibilidad y tooltips (ya tenías parte) ---- */
.tooltip { z-index:1080 !important; }
/* ============================================================
   DataProtektor | Histórico (módulo) — estilos movidos del template
   ============================================================ */

/* Cabecera ribbon: ya usas .compliance-ribbon y .tag del base */

/* Buscador (reutiliza .searchbar del base) */
.searchbar .count-pill{ background:rgba(37,49,106,.08); color:var(--ink); border-radius:999px; padding:.2rem .6rem; font-weight:600; }

/* Tabla (reutiliza .table-card, .td-trunc, .col-progress del base) */
.table-card.table-sm thead th{ font-size:.82rem; }
.name-cell{ display:flex; align-items:center; gap:.5rem; }
.name-cell::before{ content:"\F4E1"; font-family:"bootstrap-icons"; opacity:.7; }

/* Anchos “semánticos” para evitar style="" en el HTML */
.th-idx{ width:48px; }
.th-idtype{ width:90px; }
.th-doc{ width:170px; }
.th-state{ width:120px; }
.th-actions{ width:260px; text-align:center; }
.th-date{ width:180px; }

/* Progreso (usa las utilidades globales) */
.progress-compact{ height:.7rem; }
.progress-click{ cursor:pointer; }

/* Acciones (ya tienes responsive en el base) */
.btn-group.desktop-actions .btn{ border-radius:10px; }

/* Footer línea (usa .footer-compliance global si la quieres) */
.historic-footer{ color:var(--protektor-muted); font-size:.85rem; }

/* ============================================================
   DataProtektor | Búsqueda masiva (módulo)
   ============================================================ */

/* ---- Título de página ---- */
.page-title{
  font-weight: 800; letter-spacing:.2px; display:flex; align-items:center; gap:.6rem;
  color: var(--protektor-primary);
}
.page-title .badge{
  background: linear-gradient(90deg, var(--protektor-primary), var(--protektor-secondary));
  box-shadow: 0 8px 18px rgba(48,123,191,.30);
}

/* ---- Alerta informativa (usa base .alert-info y refuerza acciones) ---- */
.alert-info .btn{
  border-color: var(--protektor-accent);
  color: var(--protektor-primary);
}
.alert-info .btn:hover{
  background: var(--protektor-accent);
  color:#0b2239;
}

/* ---- Tarjeta de “buenas prácticas” ---- */
.card.compliance{
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--elev-2);
  overflow: hidden;
}
.card.compliance .card-header{
  background: linear-gradient(90deg, var(--protektor-primary), #1e2954);
  color:#fff; font-weight:700;
}
.compliance .tip{
  display:flex; gap:.8rem; align-items:flex-start;
  padding:.8rem 1rem; border:1px dashed var(--border); border-radius:.8rem; background:#fff; margin:.5rem 0;
}
.compliance .tip i{ color: var(--protektor-secondary); font-size:1.1rem; margin-top:.15rem; }

/* Chips semánticas */
.chip{
  display:inline-flex; align-items:center; gap:.35rem;
  padding:.2rem .55rem; border-radius:999px; font-size:.74rem;
  border:1px solid var(--border); background:#fff; color: var(--ink);
}
.chip--pii{   background:#fff8db; border-color: var(--warn); }
.chip--kyc{   background:#eaf6ff; border-color: var(--info); }
.chip--risk{  background:#fff1e8; border-color: var(--warm); }
.chip--ok{    background:#f0fff4; border-color: var(--success); }
.chip--warn{  background:#fff0f3; border-color: var(--accent); }

/* ---- Dropzone ---- */
#dropzone{
  background:#fff;
  border:2px dashed var(--info);
  border-radius: var(--radius);
  transition: all .25s ease;
  box-shadow: 0 2px 12px rgba(0,0,0,.05);
}
#dropzone:hover, #dropzone.dragover{
  background:#f0faff;
  border-color: var(--protektor-secondary);
  box-shadow: 0 10px 28px rgba(48,123,191,.14);
}
#file-picker.btn{ border-radius:999px; }
#file-meta{
  padding:.35rem .75rem; border:1px solid var(--border); border-radius:999px;
  display:inline-block; background:#fff; color: var(--protektor-muted);
}

/* ---- Progreso (sube tamaño en listados) ---- */
.progress{ height: 12px; background: rgba(48,123,191,.12); border-radius:999px; }
.progress-lg{ height:20px; }
.progress-bar{
  background: linear-gradient(90deg, var(--protektor-secondary), var(--info));
  border-radius:999px; transition: width .28s ease;
  font-size:.72rem; line-height:12px;
}

/* Estados visuales de progress en “Pendientes” */
.pg-pending  { background: linear-gradient(90deg,#98a2b3,#cbd5e1) !important; color:#111; }
.pg-approved { background: linear-gradient(90deg,var(--protektor-secondary),var(--info)) !important; }
.pg-scheduled{ background: linear-gradient(90deg,var(--protektor-secondary),var(--info)) !important; }
.pg-running  { background: linear-gradient(90deg,var(--warn),var(--warm)) !important; color:#111; }
.pg-done     { background: linear-gradient(90deg,var(--info),var(--success)) !important; }
.pg-failed   { background: linear-gradient(90deg,var(--accent),#b4232a) !important; }
.pg-unknown  { background: linear-gradient(90deg,#e2e8f0,#cbd5e1) !important; color:#111; }

/* ---- Cards/tablas (apoyado en base) ---- */
.card{ border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--elev-1); }
.card-header.bg-primary{
  background: linear-gradient(90deg, var(--protektor-primary), var(--protektor-secondary)) !important;
}
.card-header.bg-dark{
  background: linear-gradient(90deg, #141b2e, #0c1224) !important;
}
.list-group-item{ border-color:#edf1f7; }
.list-group-item:hover{ background:#f8fbff; }
.table thead th{ border-bottom:1px solid var(--border)!important; color:#334155; }
.table tbody tr{ transition: background .12s ease; }
.table tbody tr:hover{ background:#f0faff; }

/* ---- Botones (añadimos outline-primary que faltaba) ---- */
.btn{ border-radius:.8rem; }
.btn-outline-primary{
  --bs-btn-color: var(--protektor-secondary);
  --bs-btn-border-color: var(--protektor-secondary);
  --bs-btn-hover-bg: rgba(48,123,191,.08);
  --bs-btn-hover-border-color: var(--protektor-secondary);
}

/* ---- Utilidades ---- */
.muted{ color: var(--protektor-muted); }
.kbd{
  background:#111827; color:#fff; padding:.1rem .35rem;
  border-radius:.4rem; font-size:.75rem;
}
.cursor-pointer{ cursor:pointer; }

/* ============================================================
   DataProtektor | Resumen de actividad (módulo)
   ============================================================ */

/* ---- Página / títulos ---- */
.page-title{
  font-weight: 800; letter-spacing:.2px; display:flex; align-items:center; gap:.6rem;
  color: var(--ink);
}
.page-title .badge{
  background:linear-gradient(90deg, var(--protektor-primary), var(--protektor-accent));
  box-shadow:0 6px 16px rgba(48,123,191,.28);
}

/* ---- Cards / headers ---- */
.card{
  border:1px solid var(--border);
  border-radius: var(--radius);
  overflow:hidden;
  box-shadow: var(--elev-1);
}
.card-header.bg-primary{
  background:linear-gradient(90deg,var(--protektor-secondary),var(--protektor-accent))!important;
  color: var(--surface) !important;
}
.card-header.bg-dark{
  background:linear-gradient(90deg,var(--protektor-accent),#151b28)!important;
}
.card-header h5{ font-weight:700; }

/* ---- Alertas KPI / orientación ---- */
.alert-kpi{
  border-left:4px solid var(--info);
  background:#f8fbfc;
}

/* ---- Chips ---- */
.chip{
  display:inline-flex; align-items:center; gap:.35rem;
  font-size:.775rem; padding:.25rem .6rem;
  border-radius:999px; border:1px solid rgba(48,123,191,.16);
  background:#f8fafc; color:#334155; white-space:nowrap;
}
.chip i{ font-size:.9rem; }

/* variantes semánticas */
.chip-risk{ border-color:#fcd34d; background:#fff7ed; color:#92400e; }
.chip-sla { border-color:#bae6fd; background:#ecfeff; color:#075985; }
.chip-kyc { border-color:#bbf7d0; background:#f0fdf4; color:#065f46; }
.chip-warn{ border-color:#fed7aa; background:#fff7ed; color:#9a3412; }

/* ---- Listas / tablas ---- */
.list-group-item{ border-color:#edf1f7; }
.list-group-item:hover{ background:#f8fbff; }
.table thead th{ border-bottom:1px solid var(--border)!important; color:#334155; font-weight:600; }
.table tbody tr{ transition: background .12s ease; }
.table tbody tr:hover{ background:#f8fbff; }

/* ---- Progreso ---- */
.progress{ height:14px; background:#eef1f6; border-radius:999px; }
.progress-md{ height:18px; }
.progress-lg{ height:20px; }  /* por si lo necesitas en otros listados */
.progress-bar{ border-radius:999px; transition:width .25s ease; font-size:.7rem; }

/* estados (coinciden con “Búsqueda masiva”) */
.pb-pending   { background: linear-gradient(90deg,#98a2b3,#cbd5e1); color:#111; }
.pb-approved  { background: linear-gradient(90deg,var(--protektor-secondary),var(--info)); }
.pb-scheduled { background: linear-gradient(90deg,var(--protektor-secondary),var(--info)); }
.pb-running   { background: linear-gradient(90deg,var(--warn),var(--warm)); color:#111; }
.pb-done      { background: linear-gradient(90deg,var(--info),var(--success)); }
.pb-failed    { background: linear-gradient(90deg,var(--accent),#b4232a); }

/* ---- Leyenda de estados (badges) ---- */
.legend-badge{ border:1px solid rgba(255,255,255,.35); font-weight:600; }
.lg-pending  { background:linear-gradient(90deg,#98a2b3,#cbd5e1); }
.lg-approval { background:linear-gradient(90deg,var(--protektor-secondary),var(--info)); } /* Aprobada/Programada */
.lg-running  { background:linear-gradient(90deg,var(--warn),var(--warm)); }
.lg-done     { background:linear-gradient(90deg,var(--info),var(--success)); }
.lg-failed   { background:linear-gradient(90deg,var(--accent),#b4232a); }

/* ---- Utilidades ---- */
.muted{ color: var(--protektor-muted); }
.cursor-pointer{ cursor:pointer; }