/* ── Paces Minimal Official Design System ──────────────────────── */

:root {
  --theme-font-sans-serif: 'Hanken Grotesk', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --bg-main: #f1f1f5;
  --bg-surface: #f1f1f5;
  --bg-card: #ffffff;
  --bg-sidebar: #f1f1f5;
  --border-light: #dce0e3;
  --border-subtle: #e8e9ef;
  --border-focus: #4557a3;
  --text-dark: #1e293b;
  --text-muted: #526270;
  --text-dim: #6c757d;
  --color-primary: #4557a3;
  --color-primary-rgb: 69, 87, 163;
  --color-primary-hover: #34417a;
  --color-primary-light: rgba(69, 87, 163, 0.12);
  --color-secondary: #C1785A;
  --color-success: #8abe9f;
  --color-warning: #ffaa40;
  --color-danger: #e5513e;
  --color-purple: #6B3F69;
  --color-info: #6acfc9;
  --color-dark-chart: #396699;
  --radius-xs: 6px;
  --radius-sm: 8px;
  --radius-md: 10px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-pill: 9999px;
  --shadow-sm: none;
  --shadow-card: none;
  --shadow-hover: 0 4px 12px rgba(0, 0, 0, 0.04);
}

body {
  display: flex;
  flex-direction: column;
  height: 100vh;
  min-height: 100vh;
  overflow: hidden;
  background-color: #f1f1f5 !important;
  color: #1e293b;
  font-family: 'Hanken Grotesk', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  letter-spacing: -0.01em;
  -webkit-font-smoothing: antialiased;
}

/* ── Top Header (Paces Minimal Oficial) ──────────────────────── */
.dash-header {
  background: #f1f1f5 !important;
  border-bottom: 1px solid #eef2f7 !important;
  padding: 0 1.75rem !important;
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: sticky;
  top: 0;
  z-index: 100;
  margin-left: 250px;
  box-shadow: none !important;
  transition: margin-left 0.28s cubic-bezier(0.4, 0, 0.2, 1);
  height: 68px !important;
  min-height: 68px !important;
}

.dash-header-left, .dash-header-right {
  display: flex;
  align-items: center;
}

.dash-header-left {
  gap: 1.5rem;
  flex: 1;
  min-width: 0;
}

.dash-header-right {
  gap: 0.75rem;
  flex-shrink: 0;
}

/* ── Paces Minimal Quick Search Pill ─────────────────────────── */
.header-search-pill {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  background: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: var(--radius-pill, 9999px) !important;
  padding: 0 1.15rem !important;
  color: #526270;
  cursor: pointer;
  transition: all 0.18s ease;
  width: 275px;
  max-width: 290px;
  height: 42px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03);
}

.header-search-pill:hover {
  background: #ffffff !important;
  border-color: #cbd5e1 !important;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
}

.header-search-icon {
  width: 18px;
  height: 18px;
  color: #94a3b8;
  stroke-width: 1.8;
  flex-shrink: 0;
}

.header-search-placeholder {
  font-size: 0.875rem;
  font-weight: 400;
  color: #94a3b8;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  flex: 1;
}

/* ── Paces Mega Menu & Apps Navigation Links ──────────────────── */
.paces-topbar-link {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.875rem;
  font-weight: 500;
  color: #526270;
  text-decoration: none;
  cursor: pointer;
  padding: 0.35rem 0.25rem;
  transition: color 0.15s ease;
  user-select: none;
}

.paces-topbar-link:hover {
  color: #1e293b;
}

.paces-header-dropdown {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  position: relative;
}

.paces-topbar-dropdown-trigger {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.875rem;
  font-weight: 500;
  color: #526270;
  cursor: pointer;
  padding: 0.35rem 0.25rem;
  transition: color 0.15s ease;
  position: relative;
  user-select: none;
}

.paces-topbar-dropdown-trigger:hover {
  color: #1e293b;
}

.paces-header-select {
  position: absolute;
  inset: 0;
  opacity: 0;
  width: 100%;
  height: 100%;
  cursor: pointer;
  z-index: 2;
  border: none;
}

.dropdown-chevron {
  width: 15px;
  height: 15px;
  color: #878a99;
  stroke-width: 2;
  margin-left: 0.1rem;
  flex-shrink: 0;
}

.paces-header-dropdown .plan-badge {
  display: none !important;
}

/* ── Paces Header Icon Buttons & Group ───────────────────────── */
.header-actions-group {
  display: flex;
  align-items: center;
  gap: 0.45rem;
}

.header-icon-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  border: none;
  background: transparent;
  color: #526270;
  cursor: pointer;
  transition: all 0.15s ease;
  text-decoration: none;
  position: relative;
}

.header-icon-btn:hover {
  background: #e9eaf0;
  color: #1e293b;
}

.header-icon-btn i,
.header-icon-btn svg {
  width: 20px;
  height: 20px;
  stroke-width: 1.85;
  pointer-events: none;
}

.header-icon-btn.has-badge {
  position: relative;
}

.header-badge-count {
  position: absolute;
  top: 0;
  right: 0;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #ef4444;
  color: #ffffff;
  font-size: 0.65rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  border: 2px solid #f1f1f5;
}

.header-badge-dot {
  position: absolute;
  top: 5px;
  right: 5px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #ea580c;
  border: 1.5px solid #f1f1f5;
}

.paces-lang-badge {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.85rem;
  font-weight: 600;
  color: #526270;
  padding: 0.25rem 0.4rem;
  border-radius: 6px;
  cursor: pointer;
  user-select: none;
}

.paces-lang-badge .lang-flag {
  font-size: 1.25rem;
  line-height: 1;
}

.header-divider {
  width: 1px;
  height: 24px;
  background: #dce0e3;
  margin: 0 0.85rem;
}

.btn-logout-icon {
  display: none !important;
}

/* ── Theme Mode Direct Toggle Button ─────────────────────────── */
#themeToggleBtn {
  position: relative;
  transition: transform 0.2s cubic-bezier(0.34, 1.56, 0.64, 1), background-color 0.15s ease, color 0.15s ease;
}

#themeToggleBtn:hover {
  transform: scale(1.1);
}

#themeToggleBtn:active {
  transform: scale(0.9);
}

#themeToggleBtn i,
#themeToggleBtn svg {
  transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
}

#themeToggleBtn:hover i,
#themeToggleBtn:hover svg {
  transform: rotate(15deg);
}

html[data-theme="dark"] #themeToggleBtn {
  color: #fbbf24 !important; /* Warm golden sun color in dark mode */
}

html[data-theme="dark"] #themeToggleBtn:hover {
  color: #fde047 !important;
  background: rgba(251, 191, 36, 0.14) !important;
}

html[data-theme="light"] #themeToggleBtn {
  color: #475569;
}

html[data-theme="light"] #themeToggleBtn:hover {
  color: #4f46e5;
  background: rgba(79, 70, 229, 0.08);
}


/* ── Paces Sidebar Brand & Pin Button ────────────────────────── */
.sidebar-brand {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0 1.25rem !important;
  border-bottom: 1px solid #eef2f7 !important;
  height: 68px !important;
  min-height: 68px !important;
  box-sizing: border-box;
}

.sidebar-brand-content {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  min-width: 0;
}

.sidebar-brand-logo {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  flex-shrink: 0;
}

.paces-logo-mark {
  width: 26px;
  height: 26px;
}

.sidebar-brand-title {
  font-size: 1.18rem;
  font-weight: 800;
  letter-spacing: -0.03em;
  color: #1e293b;
  margin: 0;
  white-space: nowrap;
}

.btn-sidebar-pin {
  border: none !important;
  background: transparent !important;
  color: #94a3b8 !important;
}

.btn-sidebar-pin:hover {
  color: #4557a3 !important;
}

.btn-sidebar-pin i,
.btn-sidebar-pin svg {
  width: 18px;
  height: 18px;
  stroke-width: 1.8;
}

.btn-sidebar-collapse {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 6px;
  border: 1px solid var(--border-light, #e9ecef);
  background: #ffffff;
  color: var(--text-muted, #64748b);
  cursor: pointer;
  transition: all 0.18s ease;
  flex-shrink: 0;
  padding: 0;
}

.btn-sidebar-collapse:hover {
  background: #f8fafc;
  color: var(--color-primary, #4557a3);
  border-color: #cbd5e1;
}

@media (min-width: 993px) {
  body:not(.sidebar-collapsed) #headerSidebarToggleBtn {
    display: none !important;
  }
}

.btn-sidebar-collapse * {
  pointer-events: none !important;
}

.btn-sidebar-collapse i,
.btn-sidebar-collapse svg {
  width: 16px;
  height: 16px;
  transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}

.workspace-picker {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  background: #f7f8fd;
  padding: 0.25rem 0.65rem;
  border-radius: var(--radius-pill, 9999px);
  border: 1px solid #e8e9ef;
  max-width: 250px;
  flex-shrink: 1;
}

.workspace-picker label {
  font-size: 0.7rem;
  font-weight: 700;
  color: var(--text-muted, #64748b);
  display: flex;
  align-items: center;
  gap: 0.25rem;
}

.workspace-picker label i,
.workspace-picker label svg {
  width: 14px;
  height: 14px;
  stroke-width: 1.8;
}

.dash-select {
  border: none;
  background: transparent;
  font-family: inherit;
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--text-dark, #1e293b);
  cursor: pointer;
  outline: none;
  max-width: 145px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.dash-select:hover {
  color: var(--color-primary, #4557a3);
}

.plan-badge {
  font-size: 0.62rem;
  font-weight: 700;
  padding: 0.12rem 0.45rem;
  border-radius: var(--radius-pill, 9999px);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  flex-shrink: 0;
}

.plan-badge.starter, .plan-badge.free { background: #f1f5f9; color: #475569; border: 1px solid #e2e8f0; }
.plan-badge.pro { background: #dbeafe; color: #1e40af; border: 1px solid #bfdbfe; }
.plan-badge.enterprise { background: #fef3c7; color: #92400e; border: 1px solid #fde68a; }

.user-profile-wrapper {
  position: relative;
  display: inline-flex;
  align-items: center;
}

.user-pill {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  padding: 0.25rem 0.5rem;
  border-radius: var(--radius-sm, 8px);
  cursor: pointer;
  background: transparent;
  border: none;
  font-family: inherit;
  transition: background 0.15s ease;
  user-select: none;
  outline: none;
}

.user-pill:hover,
.user-profile-wrapper.open .user-pill {
  background: rgba(0, 0, 0, 0.04);
}

.user-avatar {
  width: 40px;
  height: 40px;
  background: linear-gradient(135deg, #f97316, #ea580c);
  color: #fff;
  font-weight: 700;
  font-size: 0.95rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12);
  flex-shrink: 0;
  overflow: hidden;
  position: relative;
}

.user-avatar-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 50%;
  display: block;
}

.user-info {
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: left;
}

.user-name {
  font-size: 0.88rem;
  font-weight: 600;
  color: #1e293b;
  line-height: 1.25;
  white-space: nowrap;
}

.user-email {
  font-size: 0.74rem;
  font-weight: 400;
  color: #878a99;
  line-height: 1.25;
  white-space: nowrap;
}

.user-pill-chevron {
  width: 16px;
  height: 16px;
  color: #878a99;
  stroke-width: 2;
  margin-left: 0.2rem;
  flex-shrink: 0;
  transition: transform 0.2s cubic-bezier(0.16, 1, 0.3, 1), color 0.15s ease;
}

.user-profile-wrapper.open .user-pill-chevron {
  transform: rotate(180deg);
  color: #475569;
}

/* ── Menú Flotante Dropdown de Perfil ─────────────────────────── */
.user-dropdown-menu {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  min-width: 215px;
  background: #ffffff;
  border-radius: 12px;
  box-shadow: 0 12px 32px -4px rgba(15, 23, 42, 0.12), 0 4px 12px -2px rgba(15, 23, 42, 0.05), 0 0 0 1px rgba(0, 0, 0, 0.05);
  padding: 14px 0 8px 0;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-8px) scale(0.97);
  transform-origin: top right;
  transition: opacity 0.18s cubic-bezier(0.16, 1, 0.3, 1), transform 0.18s cubic-bezier(0.16, 1, 0.3, 1), visibility 0.18s;
  z-index: 1050;
  user-select: none;
}

.user-profile-wrapper.open .user-dropdown-menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0) scale(1);
}

.user-dropdown-header {
  padding: 2px 18px 12px 18px;
}

.user-dropdown-header-admin {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.badge-role-root {
  font-size: 0.62rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  padding: 2px 7px;
  background: linear-gradient(135deg, #4f46e5, #7c3aed);
  color: #ffffff;
  border-radius: 9999px;
  box-shadow: 0 1px 3px rgba(79, 70, 229, 0.3);
  display: inline-block;
}

.user-dropdown-welcome {
  font-size: 0.94rem;
  font-weight: 700;
  color: #1e293b;
  display: flex;
  align-items: center;
  gap: 0.35rem;
}

.user-dropdown-body {
  display: flex;
  flex-direction: column;
}

.user-dropdown-item {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  padding: 8.5px 18px;
  background: transparent;
  border: none;
  font-family: inherit;
  font-size: 0.88rem;
  font-weight: 500;
  color: #334155;
  text-align: left;
  cursor: pointer;
  transition: background-color 0.15s ease, color 0.15s ease;
  outline: none;
}

.user-dropdown-item:hover,
.user-dropdown-item:focus-visible {
  background-color: #f8fafc;
  color: #0f172a;
}

.user-dropdown-icon {
  width: 18px;
  height: 18px;
  color: #475569;
  stroke-width: 1.9;
  flex-shrink: 0;
  transition: color 0.15s ease;
}

.user-dropdown-item:hover .user-dropdown-icon,
.user-dropdown-item:focus-visible .user-dropdown-icon {
  color: #0f172a;
}

.user-dropdown-label {
  flex: 1;
  line-height: 1.4;
}

.user-dropdown-divider {
  height: 1px;
  background: #f1f5f9;
  margin: 6px 0;
}

.user-dropdown-footer {
  display: flex;
  flex-direction: column;
}

.user-dropdown-item-logout {
  color: #334155;
}

.user-dropdown-item-logout:hover,
.user-dropdown-item-logout:focus-visible {
  background-color: #fef2f2;
  color: #dc2626;
}

.user-dropdown-item-logout:hover .user-dropdown-icon,
.user-dropdown-item-logout:focus-visible .user-dropdown-icon {
  color: #dc2626;
}

/* Adaptación a Modo Oscuro */
html[data-theme="dark"] .user-pill:hover,
body.dark-mode .user-pill:hover,
html[data-theme="dark"] .user-profile-wrapper.open .user-pill,
body.dark-mode .user-profile-wrapper.open .user-pill {
  background: rgba(255, 255, 255, 0.06);
}

html[data-theme="dark"] .user-name,
body.dark-mode .user-name {
  color: #f1f5f9;
}

html[data-theme="dark"] .user-email,
body.dark-mode .user-email {
  color: #94a3b8;
}

html[data-theme="dark"] .user-dropdown-menu,
body.dark-mode .user-dropdown-menu {
  background: #1e222d;
  box-shadow: 0 16px 36px rgba(0, 0, 0, 0.5), 0 0 0 1px rgba(255, 255, 255, 0.08);
}

html[data-theme="dark"] .user-dropdown-welcome,
body.dark-mode .user-dropdown-welcome {
  color: #f8fafc;
}

html[data-theme="dark"] .user-dropdown-item,
body.dark-mode .user-dropdown-item {
  color: #cbd5e1;
}

html[data-theme="dark"] .user-dropdown-icon,
body.dark-mode .user-dropdown-icon {
  color: #94a3b8;
}

html[data-theme="dark"] .user-dropdown-item:hover,
html[data-theme="dark"] .user-dropdown-item:focus-visible,
body.dark-mode .user-dropdown-item:hover,
body.dark-mode .user-dropdown-item:focus-visible {
  background-color: rgba(255, 255, 255, 0.06);
  color: #ffffff;
}

html[data-theme="dark"] .user-dropdown-item:hover .user-dropdown-icon,
html[data-theme="dark"] .user-dropdown-item:focus-visible .user-dropdown-icon,
body.dark-mode .user-dropdown-item:hover .user-dropdown-icon,
body.dark-mode .user-dropdown-item:focus-visible .user-dropdown-icon {
  color: #ffffff;
}

html[data-theme="dark"] .user-dropdown-divider,
body.dark-mode .user-dropdown-divider {
  background: rgba(255, 255, 255, 0.08);
}

html[data-theme="dark"] .user-dropdown-item-logout:hover,
html[data-theme="dark"] .user-dropdown-item-logout:focus-visible,
body.dark-mode .user-dropdown-item-logout:hover,
body.dark-mode .user-dropdown-item-logout:focus-visible {
  background-color: rgba(239, 68, 68, 0.15);
  color: #f87171;
}

.user-dropdown-item-highlight {
  background: rgba(79, 70, 229, 0.05);
  color: #4f46e5;
  font-weight: 600;
  border-radius: 6px;
  margin: 2px 10px;
  width: calc(100% - 20px);
}

.user-dropdown-item-highlight:hover,
.user-dropdown-item-highlight:focus-visible {
  background-color: rgba(79, 70, 229, 0.12);
  color: #4338ca;
}

.user-dropdown-item-highlight .user-dropdown-icon {
  color: #4f46e5;
}

.user-dropdown-item-highlight:hover .user-dropdown-icon,
.user-dropdown-item-highlight:focus-visible .user-dropdown-icon {
  color: #4338ca;
}

html[data-theme="dark"] .user-dropdown-item-highlight,
body.dark-mode .user-dropdown-item-highlight {
  background-color: rgba(99, 102, 241, 0.12);
  color: #a5b4fc;
}

html[data-theme="dark"] .user-dropdown-item-highlight:hover,
html[data-theme="dark"] .user-dropdown-item-highlight:focus-visible,
body.dark-mode .user-dropdown-item-highlight:hover,
body.dark-mode .user-dropdown-item-highlight:focus-visible {
  background-color: rgba(99, 102, 241, 0.22);
  color: #c7d2fe;
}

html[data-theme="dark"] .user-dropdown-item-highlight .user-dropdown-icon,
body.dark-mode .user-dropdown-item-highlight .user-dropdown-icon {
  color: #a5b4fc;
}

html[data-theme="dark"] .user-dropdown-item-highlight:hover .user-dropdown-icon,
html[data-theme="dark"] .user-dropdown-item-highlight:focus-visible .user-dropdown-icon,
body.dark-mode .user-dropdown-item-highlight:hover .user-dropdown-icon,
body.dark-mode .user-dropdown-item-highlight:focus-visible .user-dropdown-icon {
  color: #c7d2fe;
}

.btn-secondary-sm {
  background: #ffffff;
  border: 1px solid var(--border-light, #e9ecef);
  color: var(--text-dark, #1e293b);
  font-size: 0.78rem;
  font-weight: 600;
  padding: 0.35rem 0.75rem;
  border-radius: var(--radius-sm, 8px);
  text-decoration: none;
  transition: all 0.2s;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
}

.btn-secondary-sm:hover {
  background: #f8fafc;
  border-color: #cbd5e1;
  color: var(--color-primary, #2563eb);
}

.btn-secondary-sm i,
.btn-secondary-sm svg {
  width: 14px;
  height: 14px;
  stroke-width: 1.8;
}

.btn-danger-sm {
  background: #fff5f5;
  border: 1px solid #fed7d7;
  color: #c53030;
  font-size: 0.78rem;
  font-weight: 600;
  padding: 0.35rem 0.75rem;
  border-radius: var(--radius-sm, 8px);
  cursor: pointer;
  transition: all 0.2s;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
}

.btn-danger-sm:hover {
  background: #fee2e2;
  color: #9b2c2c;
  border-color: #feb2b2;
}

.btn-danger-sm i,
.btn-danger-sm svg {
  width: 14px;
  height: 14px;
  stroke-width: 1.8;
}

.plan-actions-cell {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

/* ── Layout & Sidebar (Paces Minimal) ────────────────────────── */
.dash-layout {
  display: flex;
  flex: 1;
  min-width: 0;
  min-height: 0;
  margin-left: 250px;
  padding: 0 !important;
  transition: margin-left 0.28s cubic-bezier(0.4, 0, 0.2, 1);
}

.dash-sidebar {
  position: fixed;
  top: 0;
  left: 0;
  width: 250px;
  height: 100vh;
  z-index: 110;
  background: #f1f1f5 !important;
  border-right: 1px solid #eef2f7 !important;
  box-shadow: none !important;
  padding: 0 0.85rem 1rem 0.85rem !important;
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
  overflow-y: auto;
  overflow-x: hidden;
  transition: width 0.28s cubic-bezier(0.4, 0, 0.2, 1);
}

.dash-nav {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}

.nav-item {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.62rem 0.8rem;
  border-radius: var(--radius-sm, 8px);
  border: none;
  background: transparent;
  color: #526270 !important;
  font-family: inherit;
  font-size: 0.96rem;
  font-weight: 500;
  cursor: pointer;
  text-align: left;
  transition: all 0.18s ease;
  line-height: 1.35;
}

.nav-item:hover {
  background: rgba(69, 87, 163, 0.06) !important;
  color: #4557a3 !important;
}

.nav-item.active {
  background: rgba(69, 87, 163, 0.12) !important;
  color: #4557a3 !important;
  font-weight: 600 !important;
}

.nav-item .nav-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  color: #6c757d;
  transition: color 0.18s ease;
  flex-shrink: 0;
}

.nav-item:hover .nav-icon,
.nav-item.active .nav-icon {
  color: #4557a3 !important;
}

.nav-item .nav-icon i,
.nav-item .nav-icon svg {
  width: 19px;
  height: 19px;
  stroke-width: 1.85;
}

/* ── Categorías Generales Expandibles / Colapsables ────────── */
.nav-category-group {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}

.nav-category-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  background: transparent;
  border: none;
  cursor: pointer;
  padding: 0.35rem 0.75rem;
  border-radius: var(--radius-xs, 6px);
  transition: all 0.15s ease;
  user-select: none;
  position: relative;
}

.nav-category-toggle * {
  pointer-events: none !important;
}

.nav-category-toggle:hover {
  background: #f1f5f9;
  color: var(--text-dark, #0f172a);
}

.nav-category-toggle .category-chevron {
  width: 18px;
  height: 18px;
  min-width: 18px;
  min-height: 18px;
  color: #94a3b8;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1), color 0.2s ease;
}

.nav-category-toggle:hover .category-chevron {
  color: var(--color-primary, #0067FF);
}

.nav-category-group.is-collapsed .category-chevron {
  transform: rotate(-90deg) !important;
}

.nav-category-items {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  overflow: hidden;
  transition: max-height 0.28s ease, opacity 0.2s ease;
}

.nav-category-group.is-collapsed .nav-category-items {
  display: none !important;
}

.nav-section-label {
  font-size: 0.76rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #8b95a5;
  padding: 0;
  margin-top: 0.65rem;
  margin-bottom: 0.25rem;
  font-family: inherit;
}

.nav-section-label:first-child {
  margin-top: 0.15rem;
}

.admin-nav-section {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  margin-top: 0.6rem;
  padding-top: 0.6rem;
  border-top: 1px solid var(--border-light, #e9ecef);
}

.nav-section-label.admin-label {
  color: #6b7280;
}

.sidebar-footer-card {
  margin-top: auto;
  background: #f8fafc;
  border: 1px solid var(--border-light, #e9ecef);
  border-radius: var(--radius-sm, 8px);
  padding: 0.85rem;
  transition: opacity 0.2s ease, transform 0.2s ease;
}

/* Ocultamiento estable y sin parpadeos para Super-Admin / Enterprise */
html.hide-plan-quota .sidebar-footer-card,
body.hide-plan-quota .sidebar-footer-card {
  display: none !important;
}

/* Pre-render colapsado para evitar saltos durante la carga */
html.sidebar-collapsed-init .dash-sidebar {
  width: 76px !important;
  padding: 1.25rem 0.5rem !important;
}

html.sidebar-collapsed-init .dash-header,
html.sidebar-collapsed-init .dash-layout {
  margin-left: 76px !important;
}

html.sidebar-collapsed-init .sidebar-brand-title,
html.sidebar-collapsed-init .nav-section-label,
html.sidebar-collapsed-init .sidebar-footer-card,
html.sidebar-collapsed-init .version-label,
html.sidebar-collapsed-init .version-tag {
  display: none !important;
}

html.sidebar-collapsed-init .nav-item > span:not(.nav-icon) {
  display: none !important;
}

html.sidebar-collapsed-init .btn-sidebar-collapse i,
html.sidebar-collapsed-init .btn-sidebar-collapse svg {
  transform: rotate(180deg);
}

.sidebar-footer-card h4 {
  font-size: 0.8rem;
  font-weight: 700;
  color: var(--text-dark, #0f172a);
  margin-bottom: 0.65rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.quota-bar-container {
  margin-bottom: 0.6rem;
}

.quota-label {
  display: flex;
  justify-content: space-between;
  font-size: 0.75rem;
  color: var(--text-muted, #64748b);
  margin-bottom: 0.2rem;
}

.progress-bar {
  background: #e2e8f0;
  height: 6px;
  border-radius: 3px;
  overflow: hidden;
}

.progress-fill {
  background: var(--color-primary, #0067FF);
  height: 100%;
  transition: width 0.3s ease;
}

.btn-upgrade-sm {
  display: block;
  text-align: center;
  background: var(--grad-azul-neiva, linear-gradient(135deg, #0067FF, #2a72ed));
  color: #fff;
  font-size: 0.75rem;
  font-weight: 700;
  padding: 0.4rem;
  border-radius: var(--radius-sm, 8px);
  text-decoration: none;
  margin-top: 0.5rem;
  transition: opacity 0.2s ease, transform 0.2s ease;
}

.btn-upgrade-sm:hover {
  opacity: 0.95;
  transform: translateY(-1px);
}

/* ── Sidebar Footer: Versión de Arranque 1.0.0 ──────────────── */
.sidebar-footer-version {
  margin-top: auto;
  padding-top: 0.75rem;
  border-top: 1px solid var(--border-light, #e2e8f0);
}

.version-indicator {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.35rem 0.6rem;
  background: #f1f5f9;
  border: 1px solid #e2e8f0;
  border-radius: var(--radius-sm, 8px);
  cursor: default;
}

.version-label {
  font-size: 0.76rem;
  font-weight: 700;
  font-family: 'JetBrains Mono', monospace;
  color: #64748b;
  letter-spacing: 0.02em;
}

/* ── Reglas de Colapso del Menú Lateral (.sidebar-collapsed) ─── */
body.sidebar-collapsed .dash-sidebar {
  width: 76px;
  padding: 1.25rem 0.5rem;
}

body.sidebar-collapsed .dash-header {
  margin-left: 76px;
}

body.sidebar-collapsed .dash-layout {
  margin-left: 76px;
}

body.sidebar-collapsed .sidebar-brand {
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.5rem !important;
  padding-bottom: 0.75rem !important;
}

body.sidebar-collapsed .sidebar-brand-content {
  justify-content: center !important;
}

body.sidebar-collapsed .sidebar-brand-title {
  display: none !important;
}

body.sidebar-collapsed .btn-sidebar-collapse {
  width: 28px;
  height: 28px;
  margin: 0 auto !important;
}

body.sidebar-collapsed .btn-sidebar-collapse i,
body.sidebar-collapsed .btn-sidebar-collapse svg {
  transform: rotate(180deg);
}

body.sidebar-collapsed .nav-section-label {
  display: none !important;
}

body.sidebar-collapsed .nav-item {
  justify-content: center;
  padding: 0.7rem 0;
  position: relative;
}

body.sidebar-collapsed .nav-item > span:not(.nav-icon) {
  display: none !important;
}

body.sidebar-collapsed .nav-item .nav-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0;
}

body.sidebar-collapsed .nav-item .nav-icon i,
body.sidebar-collapsed .nav-item .nav-icon svg {
  width: 20px;
  height: 20px;
}

body.sidebar-collapsed .sidebar-footer-card {
  display: none !important;
}

body.sidebar-collapsed .sidebar-footer-version {
  padding-top: 0.5rem;
}

body.sidebar-collapsed .version-indicator {
  padding: 0.4rem;
  justify-content: center;
}

body.sidebar-collapsed .version-label,
body.sidebar-collapsed .version-tag {
  display: none !important;
}

body.sidebar-collapsed .admin-nav-section {
  padding-top: 0.5rem;
  margin-top: 0.5rem;
}

/* ── Content Area & Panels ───────────────────────────────────── */
.dash-content {
  flex: 1;
  min-width: 0;
  padding: 0 1.5rem 1.5rem 1.5rem !important;
  overflow-y: auto;
}

/* ── Navegación móvil/tablet (< 993px): sidebar como drawer ──────
   El layout de escritorio reserva 250px (o 76px colapsado) a la izquierda
   para el sidebar fijo; en móvil eso dejaba ~140px de contenido a 390px.
   Por debajo de 993px (mismo corte que oculta el botón ☰ en escritorio) el
   sidebar sale del flujo como drawer off-canvas y el contenido usa todo el
   ancho. Excepción consciente a mobile-first: el layout, las ~30 reglas de
   colapso y el CSS crítico inline del dashboard están escritos
   desktop-first; invertirlos es un refactor aparte. El estado "colapsado"
   no llega a móvil porque el JS solo lo aplica en escritorio. */
.sidebar-backdrop {
  display: none;
}

@media (max-width: 992px) {
  .dash-header,
  .dash-layout,
  html.sidebar-collapsed-init .dash-header,
  html.sidebar-collapsed-init .dash-layout {
    margin-left: 0 !important;
  }

  .dash-header {
    padding: 0 1rem !important;
  }

  .dash-content {
    padding: 0 1rem 1rem 1rem !important;
  }

  .dash-sidebar {
    width: min(280px, 85vw);
    box-shadow: 0 10px 40px rgba(15, 23, 42, 0.25) !important;
    transform: translateX(-100%);
    /* visibility saca los enlaces del orden de tabulación mientras está
       cerrado; el retardo deja terminar la animación de salida. */
    visibility: hidden;
    transition: transform 0.28s cubic-bezier(0.4, 0, 0.2, 1), visibility 0s linear 0.28s;
  }

  body.sidebar-mobile-open .dash-sidebar {
    transform: translateX(0);
    visibility: visible;
    transition: transform 0.28s cubic-bezier(0.4, 0, 0.2, 1), visibility 0s;
  }

  .sidebar-backdrop {
    display: block;
    position: fixed;
    inset: 0;
    z-index: 105;
    background: rgba(15, 23, 42, 0.45);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.28s ease;
  }

  body.sidebar-mobile-open .sidebar-backdrop {
    opacity: 1;
    pointer-events: auto;
  }

  /* Evita que el contenido de fondo se desplace con el drawer abierto. */
  body.sidebar-mobile-open .dash-content {
    overflow: hidden;
  }
}

@media (max-width: 992px) and (prefers-reduced-motion: reduce) {
  .dash-sidebar,
  body.sidebar-mobile-open .dash-sidebar,
  .sidebar-backdrop {
    transition: none;
  }
}

.tab-panel {
  display: none;
}

.tab-panel.active {
  display: block;
  animation: fadeIn 0.25s ease-in-out;
}

@keyframes fadeIn {
  from { opacity: 0; transform: translateY(4px); }
  to { opacity: 1; transform: translateY(0); }
}

.pago-exitoso-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  background: rgba(29, 170, 97, 0.12);
  border: 1px solid rgba(29, 170, 97, 0.3);
  color: #1daa61;
  font-weight: 600;
  font-size: 0.92rem;
  padding: 0.85rem 1.25rem;
  border-radius: var(--radius-md, 12px);
  margin-bottom: 1.5rem;
  animation: fadeIn 0.3s ease-in-out;
}

.pago-exitoso-banner button {
  background: transparent;
  border: none;
  font-size: 1.2rem;
  color: inherit;
  cursor: pointer;
  line-height: 1;
}

.panel-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 1.5rem;
  gap: 1rem;
}

.panel-header h2 {
  font-size: 1.45rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: var(--text-dark, #0f172a);
}

.panel-header p {
  font-size: 0.9rem;
  color: var(--text-muted, #64748b);
  margin-top: 0.2rem;
}

.panel-header h3 {
  font-size: 1.15rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: var(--text-dark, #0f172a);
}

/* ── Gestión de Usuarios: subtabs internos (Clientes + Administradores) ── */
.admin-users-subtabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 1.5rem;
  border-bottom: 1px solid var(--border-light, #e2e8f0);
  padding-bottom: 0.75rem;
}

.admin-users-subtab-btn {
  background: transparent;
  border: 1px solid var(--border-light, #e2e8f0);
  border-radius: var(--radius-pill, 9999px);
  padding: 0.5rem 1rem;
  font-family: inherit;
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--text-muted, #64748b);
  cursor: pointer;
  transition: var(--transition-smooth, all 0.2s ease);
}

.admin-users-subtab-btn:hover {
  border-color: var(--color-primary, #0067FF);
  color: var(--color-primary, #0067FF);
}

.admin-users-subtab-btn.active {
  background: var(--color-primary, #0067FF);
  border-color: var(--color-primary, #0067FF);
  color: #fff;
}

.admin-users-subpanel {
  display: none;
}

.admin-users-subpanel.active {
  display: block;
}

.admin-staff-password-row {
  display: flex;
  gap: 0.5rem;
  align-items: center;
}

.admin-staff-password-row .dash-input {
  flex: 1;
}

/* ── Configuraciones: subtabs internos (Planes + Documentos Legales) ── */
.config-subtabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 1.5rem;
  border-bottom: 1px solid var(--border-light, #e2e8f0);
  padding-bottom: 0.75rem;
}

.config-subtab-btn {
  background: transparent;
  border: 1px solid var(--border-light, #e2e8f0);
  border-radius: var(--radius-pill, 9999px);
  padding: 0.5rem 1rem;
  font-family: inherit;
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--text-muted, #64748b);
  cursor: pointer;
  transition: var(--transition-smooth, all 0.2s ease);
}

.config-subtab-btn:hover {
  border-color: var(--color-primary, #0067FF);
  color: var(--color-primary, #0067FF);
}

.config-subtab-btn.active {
  background: var(--color-primary, #0067FF);
  border-color: var(--color-primary, #0067FF);
  color: #fff;
}

.config-subpanel {
  display: none;
}

.config-subpanel.active {
  display: block;
}

/* ── Navegación interna del menú "⚖️ Información Legal" ─────────── */
.legal-subtabs-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  background: #f1f5f9;
  padding: 0.4rem;
  border-radius: var(--radius-md, 12px);
  margin-bottom: 1.5rem;
}

.legal-subtab-btn {
  background: transparent;
  border: none;
  border-radius: var(--radius-sm, 8px);
  padding: 0.55rem 1rem;
  font-family: inherit;
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--text-muted, #64748b);
  cursor: pointer;
  transition: var(--transition-smooth, all 0.2s ease);
}

.legal-subtab-btn:hover {
  color: var(--color-primary, #0067FF);
}

.legal-subtab-btn.active {
  background: #ffffff;
  color: var(--color-primary, #0067FF);
  font-weight: 700;
  box-shadow: 0 2px 6px rgba(15, 23, 42, 0.08);
}

.legal-doc-panel {
  display: none;
}

.legal-doc-panel.active {
  display: block;
}

.legal-editor-header {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 1rem;
}

.legal-editor-header h3 {
  font-size: 1.1rem;
  font-weight: 800;
  color: var(--text-dark, #0f172a);
}

.legal-updated-at {
  font-size: 0.78rem;
  color: var(--text-muted, #64748b);
}

.legal-editor-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem;
  padding: 0.5rem;
  border: 1px solid var(--border-subtle, #e2e8f0);
  border-bottom: none;
  border-radius: var(--radius-md, 12px) var(--radius-md, 12px) 0 0;
  background: var(--bg-surface, #f8fafc);
}

.legal-toolbar-btn {
  min-width: 2rem;
  height: 2rem;
  padding: 0 0.5rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  border: 1px solid transparent;
  border-radius: var(--radius-sm, 8px);
  color: var(--text-main, #0f172a);
  font-size: 0.85rem;
  cursor: pointer;
  transition: var(--transition-fast, all 0.2s ease);
}

.legal-toolbar-btn:hover {
  background: var(--bg-card, #ffffff);
  border-color: var(--border-subtle, #e2e8f0);
}

.legal-toolbar-btn.active {
  background: var(--color-primary, #0067ff);
  border-color: var(--color-primary, #0067ff);
  color: #ffffff;
}

.legal-toolbar-select {
  height: 2rem;
  padding: 0 0.5rem;
  border: 1px solid var(--border-subtle, #e2e8f0);
  border-radius: var(--radius-sm, 8px);
  background: var(--bg-card, #ffffff);
  color: var(--text-main, #0f172a);
  font-size: 0.8rem;
  font-weight: 600;
  cursor: pointer;
}

.legal-toolbar-sep {
  width: 1px;
  height: 1.4rem;
  background: var(--border-subtle, #e2e8f0);
  margin: 0 0.15rem;
}

.legal-editor-content {
  width: 100%;
  min-height: 320px;
  max-height: 480px;
  overflow-y: auto;
  padding: 1rem;
  border: 1px solid var(--border-subtle, #e2e8f0);
  border-radius: 0 0 var(--radius-md, 12px) var(--radius-md, 12px);
  background: var(--bg-card, #ffffff);
  font-family: inherit;
  font-size: 0.9rem;
  line-height: 1.7;
  color: var(--text-main, #0f172a);
}

.legal-editor-content:focus {
  outline: none;
  border-color: var(--border-focus, #0067ff);
}

.legal-editor-content h2 {
  font-size: 1.3rem;
  font-weight: 800;
  margin: 0.75rem 0 0.5rem;
}

.legal-editor-content h3 {
  font-size: 1.05rem;
  font-weight: 700;
  margin: 0.6rem 0 0.4rem;
}

.legal-editor-content p {
  margin-bottom: 0.75rem;
}

.legal-editor-content ul,
.legal-editor-content ol {
  margin: 0 0 0.75rem 1.25rem;
}

.legal-editor-content blockquote {
  margin: 0.75rem 0;
  padding: 0.6rem 1rem;
  border-left: 3px solid var(--color-primary, #0067ff);
  background: var(--bg-surface, #f8fafc);
  color: var(--text-muted, #64748b);
}

.legal-editor-content a {
  color: var(--color-primary, #0067ff);
  text-decoration: underline;
}

.legal-editor-content hr {
  border: none;
  border-top: 1px solid var(--border-subtle, #e2e8f0);
  margin: 1rem 0;
}

.panel-actions {
  display: flex;
  gap: 0.75rem;
}

.btn-primary-action,
.btn-primary {
  background: var(--color-primary, #2563eb);
  color: #ffffff;
  border: none;
  padding: 0.5rem 1rem;
  border-radius: var(--radius-sm, 8px);
  font-weight: 600;
  font-size: 0.82rem;
  cursor: pointer;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  box-shadow: 0 1px 2px 0 rgba(37, 99, 235, 0.2);
  transition: all 0.18s ease;
  font-family: inherit;
}

.btn-primary-action:hover,
.btn-primary:hover {
  background: var(--color-primary-hover, #1d4ed8);
  box-shadow: 0 2px 4px 0 rgba(37, 99, 235, 0.3);
  transform: translateY(-1px);
}

.btn-action {
  background: #ffffff;
  border: 1px solid var(--border-light, #e9ecef);
  color: var(--text-dark, #1e293b);
  padding: 0.5rem 0.85rem;
  border-radius: var(--radius-sm, 8px);
  font-weight: 500;
  font-size: 0.82rem;
  cursor: pointer;
  transition: all 0.18s ease;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
}

.btn-action:hover {
  border-color: #cbd5e1;
  background: #f8fafc;
  color: var(--color-primary, #2563eb);
}

.btn-action i,
.btn-action svg {
  width: 14px;
  height: 14px;
  stroke-width: 1.8;
}
/* ── Kanban Board (Tablero de Seguimiento Pro) ────────────────────────── */
.kanban-summary-bar {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
  margin-bottom: 1.25rem;
}

@media (max-width: 1024px) {
  .kanban-summary-bar {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .kanban-summary-bar {
    grid-template-columns: minmax(0, 1fr);
  }
}

.kanban-summary-card {
  background: #ffffff;
  border: 1px solid var(--border-light, #e2e8f0);
  border-radius: var(--radius-md, 12px);
  padding: 0.9rem 1.1rem;
  display: flex;
  align-items: center;
  gap: 0.9rem;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03);
  transition: all 0.2s ease;
}

.kanban-summary-card:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
  border-color: #cbd5e1;
}

.kanban-summary-icon {
  width: 42px;
  height: 42px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.kanban-summary-icon.icon-blue {
  background: rgba(59, 130, 246, 0.12);
  color: #2563eb;
}

.kanban-summary-icon.icon-indigo {
  background: rgba(99, 102, 241, 0.12);
  color: #4f46e5;
}

.kanban-summary-icon.icon-green {
  background: rgba(16, 185, 129, 0.12);
  color: #059669;
}

.kanban-summary-icon.icon-amber {
  background: rgba(245, 158, 11, 0.12);
  color: #d97706;
}

.kanban-summary-info {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.kanban-summary-label {
  font-size: 0.72rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--text-muted, #64748b);
  margin-bottom: 0.2rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.kanban-summary-value {
  font-size: 1.15rem;
  font-weight: 800;
  color: var(--text-dark, #0f172a);
  letter-spacing: -0.02em;
  line-height: 1.2;
}

.kanban-summary-value.text-green {
  color: #059669;
}

.kanban-summary-value.text-amber {
  color: #d97706;
}

/* ── Toolbar de Búsqueda y Filtros ────────────────────────── */
.kanban-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1.25rem;
}

.kanban-search-box {
  position: relative;
  flex: 1;
  max-width: 480px;
}

.kanban-search-icon {
  position: absolute;
  left: 0.9rem;
  top: 50%;
  transform: translateY(-50%);
  width: 16px;
  height: 16px;
  color: var(--text-dim, #94a3b8);
  pointer-events: none;
}

.kanban-search-input {
  width: 100%;
  padding: 0.55rem 2.2rem 0.55rem 2.4rem;
  font-size: 0.85rem;
  border-radius: var(--radius-md, 10px);
  border: 1px solid var(--border-light, #e2e8f0);
  background: #ffffff;
  color: var(--text-dark, #0f172a);
  transition: all 0.2s ease;
}

.kanban-search-input:focus {
  outline: none;
  border-color: var(--color-primary, #0067FF);
  box-shadow: 0 0 0 3px rgba(0, 103, 255, 0.12);
}

.kanban-search-clear {
  position: absolute;
  right: 0.75rem;
  top: 50%;
  transform: translateY(-50%);
  background: none;
  border: none;
  font-size: 1.1rem;
  line-height: 1;
  color: var(--text-dim, #94a3b8);
  cursor: pointer;
}

.kanban-search-clear:hover {
  color: var(--text-dark, #0f172a);
}

.kanban-filter-select {
  padding: 0.5rem 2rem 0.5rem 0.85rem;
  font-size: 0.82rem;
  border-radius: var(--radius-md, 10px);
  min-width: 180px;
}

/* ── Tablero y Columnas ────────────────────────────────────── */
.kanban-board {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.15rem;
  align-items: start;
}

@media (max-width: 1280px) {
  .kanban-board {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 720px) {
  .kanban-board {
    grid-template-columns: 1fr;
  }
}

.kanban-column {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  padding: 0.85rem;
  min-height: 480px;
  display: flex;
  flex-direction: column;
  transition: background 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
  position: relative;
}

.kanban-column.drag-over {
  background: rgba(239, 246, 255, 0.8);
  border-color: #3b82f6;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.2);
}

.column-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 0.35rem;
  padding-bottom: 0.4rem;
}

.column-header-left {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.column-icon-dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  display: inline-block;
  flex-shrink: 0;
}

.column-icon-dot.dot-guardada { background: #3b82f6; }
.column-icon-dot.dot-postulando { background: #f59e0b; }
.column-icon-dot.dot-ganada { background: #10b981; }
.column-icon-dot.dot-descartada { background: #94a3b8; }

.column-title {
  font-size: 0.86rem;
  font-weight: 700;
  color: var(--text-dark, #0f172a);
  display: flex;
  align-items: center;
  gap: 0.35rem;
}

.column-counter {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  font-size: 0.75rem;
  font-weight: 800;
  padding: 0.15rem 0.55rem;
  border-radius: 20px;
  color: #334155;
}

.col-guardada .column-counter { color: #2563eb; background: rgba(59, 130, 246, 0.1); border-color: rgba(59, 130, 246, 0.2); }
.col-postulando .column-counter { color: #d97706; background: rgba(245, 158, 11, 0.1); border-color: rgba(245, 158, 11, 0.2); }
.col-ganada .column-counter { color: #059669; background: rgba(16, 185, 129, 0.1); border-color: rgba(16, 185, 129, 0.2); }
.col-descartada .column-counter { color: #64748b; background: rgba(100, 116, 139, 0.1); border-color: rgba(100, 116, 139, 0.2); }

.column-subtotal-bar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 0.72rem;
  color: var(--text-muted, #64748b);
  padding: 0.3rem 0.4rem;
  margin-bottom: 0.75rem;
  background: rgba(255, 255, 255, 0.7);
  border-radius: 6px;
  border: 1px solid rgba(226, 232, 240, 0.6);
}

.column-subtotal-bar .subtotal-value {
  font-weight: 700;
  color: var(--text-dark, #0f172a);
}

.cards-container {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  flex: 1;
  min-height: 120px;
}

/* ── Tarjetas Kanban (Rediseño Ejecutivo) ─────────────────── */
.kanban-card {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  padding: 0.95rem;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
  cursor: grab;
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
}

.kanban-card:active {
  cursor: grabbing;
}

.kanban-card:hover {
  border-color: #93c5fd;
  box-shadow: 0 8px 20px rgba(0, 103, 255, 0.09);
  transform: translateY(-2px);
}

.kanban-card.dragging {
  opacity: 0.45;
  transform: scale(0.98);
}

.kanban-card-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0.5rem;
}

.kanban-card-badges {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  flex-wrap: wrap;
}

.card-badge {
  font-size: 0.68rem;
  font-weight: 800;
  padding: 0.18rem 0.45rem;
  border-radius: 5px;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
}

.card-badge.secop2 { background: #dbeafe; color: #1e40af; border: 1px solid #bfdbfe; }
.card-badge.secop1 { background: #fef3c7; color: #92400e; border: 1px solid #fde68a; }
.card-badge.internacional { background: #ede9fe; color: #5b21b6; border: 1px solid #ddd6fe; }

.card-badge-urgencia {
  font-size: 0.68rem;
  font-weight: 700;
  padding: 0.18rem 0.45rem;
  border-radius: 5px;
  background: #fef2f2;
  color: #dc2626;
  border: 1px solid #fecaca;
  display: inline-flex;
  align-items: center;
  gap: 0.2rem;
}

.btn-remove-card {
  width: 24px;
  height: 24px;
  border-radius: 6px;
  border: none;
  background: transparent;
  color: #94a3b8;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.15s ease;
  font-size: 0.95rem;
}

.btn-remove-card:hover {
  background: #fee2e2;
  color: #ef4444;
}

.kanban-card-title {
  font-size: 0.92rem;
  font-weight: 700;
  color: var(--text-dark, #0f172a);
  line-height: 1.35;
  margin: 0;
  cursor: pointer;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  transition: color 0.15s ease;
}

.kanban-card-title:hover {
  color: var(--color-primary, #0067FF);
}

.kanban-card-meta {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  font-size: 0.77rem;
  color: var(--text-muted, #64748b);
}

.kanban-card-meta-item {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.kanban-card-meta-item svg {
  width: 13px;
  height: 13px;
  flex-shrink: 0;
  color: #94a3b8;
}

.kanban-card-meta-item span {
  overflow: hidden;
  text-overflow: ellipsis;
}

.kanban-card-price-box {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  padding: 0.45rem 0.65rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.kanban-card-price-label {
  font-size: 0.7rem;
  color: #64748b;
  text-transform: uppercase;
  font-weight: 600;
}

.kanban-card-price-val {
  font-size: 0.92rem;
  font-weight: 800;
  color: #059669;
  letter-spacing: -0.01em;
}

.kanban-card-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  padding-top: 0.5rem;
  border-top: 1px solid #f1f5f9;
}

.kanban-card-actions-left {
  display: flex;
  align-items: center;
  gap: 0.4rem;
}

.btn-kanban-ai {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  padding: 0.35rem 0.65rem;
  border-radius: 7px;
  border: 1px solid rgba(99, 102, 241, 0.3);
  background: linear-gradient(135deg, #4f46e5, #6366f1);
  color: #ffffff;
  font-size: 0.74rem;
  font-weight: 700;
  cursor: pointer;
  box-shadow: 0 2px 6px rgba(79, 70, 229, 0.25);
  transition: all 0.2s ease;
}

.btn-kanban-ai:hover {
  background: linear-gradient(135deg, #4338ca, #4f46e5);
  box-shadow: 0 4px 12px rgba(79, 70, 229, 0.35);
  transform: translateY(-1px);
}

.btn-kanban-ai svg {
  width: 12px;
  height: 12px;
}

.btn-kanban-view {
  width: 28px;
  height: 28px;
  border-radius: 7px;
  border: 1px solid #e2e8f0;
  background: #ffffff;
  color: #64748b;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.15s ease;
}

.btn-kanban-view:hover {
  background: #f1f5f9;
  color: #0f172a;
  border-color: #cbd5e1;
}

.btn-kanban-view svg {
  width: 14px;
  height: 14px;
}

.kanban-status-select {
  padding: 0.3rem 1.6rem 0.3rem 0.5rem;
  font-size: 0.72rem;
  border-radius: 7px;
  border: 1px solid #cbd5e1;
  background-color: #ffffff;
  color: #334155;
  font-weight: 600;
}

/* ── Empty State Moderno por Columna ────────────────────────── */
.kanban-empty-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 2.2rem 1rem;
  text-align: center;
  border: 1.5px dashed #cbd5e1;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.5);
  margin-top: 0.25rem;
}

.kanban-empty-state-icon {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: #f1f5f9;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #94a3b8;
  margin-bottom: 0.6rem;
}

.kanban-empty-state-icon svg {
  width: 18px;
  height: 18px;
}

.kanban-empty-state-title {
  font-size: 0.82rem;
  font-weight: 700;
  color: #475569;
  margin-bottom: 0.25rem;
}

.kanban-empty-state-desc {
  font-size: 0.73rem;
  color: #94a3b8;
  line-height: 1.35;
  max-width: 220px;
}

.kanban-empty-state-action {
  margin-top: 0.65rem;
  font-size: 0.73rem;
  color: #2563eb;
  font-weight: 700;
  background: none;
  border: none;
  cursor: pointer;
  text-decoration: underline;
}

.kanban-empty-state-action:hover {
  color: #1d4ed8;
}

/* ── Modo Oscuro (Dark Theme) para Seguimiento ─────────────── */
[data-theme="dark"] .kanban-summary-card {
  background: #1e293b;
  border-color: #334155;
}

[data-theme="dark"] .kanban-summary-value {
  color: #f1f5f9;
}

[data-theme="dark"] .kanban-search-input {
  background: #1e293b;
  border-color: #334155;
  color: #f1f5f9;
}

[data-theme="dark"] .kanban-column {
  background: #0f172a;
  border-color: #1e293b;
}

[data-theme="dark"] .kanban-column.drag-over {
  background: rgba(30, 58, 138, 0.3);
  border-color: #3b82f6;
}

[data-theme="dark"] .column-subtotal-bar {
  background: rgba(30, 41, 59, 0.7);
  border-color: #334155;
}

[data-theme="dark"] .column-subtotal-bar .subtotal-value {
  color: #f1f5f9;
}

[data-theme="dark"] .kanban-card {
  background: #1e293b;
  border-color: #334155;
}

[data-theme="dark"] .kanban-card:hover {
  border-color: #60a5fa;
}

[data-theme="dark"] .kanban-card-title {
  color: #f1f5f9;
}

[data-theme="dark"] .kanban-card-price-box {
  background: #0f172a;
  border-color: #334155;
}

[data-theme="dark"] .kanban-card-footer {
  border-top-color: #334155;
}

[data-theme="dark"] .btn-kanban-view {
  background: #0f172a;
  border-color: #334155;
  color: #94a3b8;
}

[data-theme="dark"] .kanban-status-select {
  background-color: #0f172a;
  border-color: #334155;
  color: #e2e8f0;
}

[data-theme="dark"] .kanban-empty-state {
  border-color: #334155;
  background: rgba(15, 23, 42, 0.4);
}

[data-theme="dark"] .kanban-empty-state-icon {
  background: #1e293b;
  color: #64748b;
}

[data-theme="dark"] .kanban-empty-state-title {
  color: #cbd5e1;
}

/* ── Cards & Tables (Paces Minimal) ──────────────────────────── */
.dash-card {
  background: #ffffff !important;
  border: none !important;
  border-radius: 10px !important;
  padding: 1.25rem;
  box-shadow: none !important;
  margin-bottom: 1.25rem;
  /* Las tarjetas casi siempre son hijas de grids que en móvil colapsan a
     "1fr" = minmax(auto, 1fr): con min-width:auto la columna no puede ser
     más angosta que el contenido más ancho de la tarjeta (una tabla, un
     texto nowrap, una fila de botones) y ensancha TODAS las tarjetas de ese
     grid por encima del viewport. min-width:0 deja que el track se ajuste
     al ancho disponible y el contenido se acomoda dentro. */
  min-width: 0;
}

/* Tablas: se desplazan dentro de su tarjeta en vez de ensanchar la página.
   Cubre las tablas que son hijas directas de una tarjeta sin envoltorio. */
.dash-card:has(> .dash-table) {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

/* Hijos de grids que no son .dash-card: mismo motivo que arriba. */
.simulator-body > *,
.simulator-results > *,
.kanban-summary-bar > *,
.paces-card-header > *,
.figure-kpis-matrix > *,
.strategic-bcg-grid > *,
.sim-control-row > * {
  min-width: 0;
}

/* Filas de cabecera/acciones: en pantallas angostas los botones bajan de
   línea en vez de empujar el ancho de la página. */
@media (max-width: 992px) {
  .panel-header,
  .panel-actions,
  .newsletter-toolbar-actions,
  .table-header-tools,
  .strategic-card-header,
  .paces-card-header,
  .paces-report-metrics-row {
    flex-wrap: wrap;
    gap: 0.75rem;
  }

  .panel-header > *,
  .strategic-card-header > * {
    min-width: 0;
  }
}

.dash-card h3 {
  font-size: 0.95rem;
  font-weight: 600;
  margin-bottom: 0.85rem;
  color: var(--text-dark, #1e293b);
  letter-spacing: -0.01em;
}

.dash-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.84rem;
}

.dash-table th {
  text-align: left;
  padding: 0.65rem 0.85rem;
  background: #f8fafc;
  color: #64748b;
  font-size: 0.72rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  border-bottom: 1px solid var(--border-light, #e9ecef);
}

.dash-table td {
  padding: 0.75rem 0.85rem;
  border-bottom: 1px solid #f1f5f9;
  color: var(--text-dark, #1e293b);
  vertical-align: middle;
}

.dash-table tr:hover td {
  background: #fafbfc;
}

.dash-table tr:last-child td {
  border-bottom: none;
}

.role-pill {
  font-size: 0.68rem;
  font-weight: 600;
  padding: 0.15rem 0.5rem;
  border-radius: var(--radius-pill, 9999px);
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

.role-pill.owner { background: #eff6ff; color: #1e40af; border: 1px solid #dbeafe; }
.role-pill.admin { background: #fef3c7; color: #92400e; border: 1px solid #fde68a; }
.role-pill.member { background: #f1f5f9; color: #475569; border: 1px solid #e2e8f0; }

/* ── Aviso de rol para colaboradores (Equipo & Roles) ────────────── */
.team-role-notice {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  background: #eff6ff;
  border: 1px solid #bfdbfe;
  border-radius: var(--radius-md, 12px);
  padding: 0.9rem 1.1rem;
  margin-bottom: 1.25rem;
}

.team-role-notice-icon {
  font-size: 1.15rem;
  line-height: 1;
}

.team-role-notice p {
  font-size: 0.85rem;
  color: #1e40af;
  line-height: 1.5;
  margin: 0;
}

.member-action-readonly {
  color: var(--text-dim, #94a3b8);
  font-size: 0.85rem;
}

/* ── Soporte / Tickets (Neiva Move) ─────────────────────────────── */
.status-badge {
  font-size: 0.75rem;
  font-weight: 700;
  padding: 0.2rem 0.6rem;
  border-radius: var(--radius-xl, 24px);
  text-transform: capitalize;
  white-space: nowrap;
}

.status-badge.estado-abierto { background: rgba(255, 100, 0, 0.12); color: #ff6400; }
.status-badge.estado-en_proceso { background: rgba(253, 181, 19, 0.15); color: #92650a; }
.status-badge.estado-respondido { background: rgba(0, 103, 255, 0.12); color: #0067FF; }
.status-badge.estado-cerrado { background: rgba(29, 170, 97, 0.12); color: #1daa61; }

.soporte-metrics-row {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.5rem;
}

.soporte-metric-card {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  align-items: flex-start;
}

.soporte-metric-label {
  font-size: 0.78rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--text-muted, #64748b);
}

.soporte-metric-value {
  font-size: 1.8rem;
  font-weight: 800;
}

.soporte-metric-value.estado-abierto { color: #ff6400; }
.soporte-metric-value.estado-en_proceso { color: #92650a; }
.soporte-metric-value.estado-respondido { color: #0067FF; }
.soporte-metric-value.estado-cerrado { color: #1daa61; }

.ticket-detail-block {
  padding-bottom: 1rem;
  margin-bottom: 1rem;
  border-bottom: 1px solid var(--border-light, #e2e8f0);
}

.ticket-detail-block:last-child {
  border-bottom: none;
  margin-bottom: 0;
}

.ticket-detail-row {
  margin-bottom: 0.5rem;
  font-size: 0.9rem;
  color: var(--text-dark, #0f172a);
}

.ticket-detail-message p,
.ticket-detail-block p {
  margin-top: 0.4rem;
  font-size: 0.92rem;
  line-height: 1.5;
  color: var(--text-dark, #0f172a);
  white-space: pre-wrap;
}

.ticket-detail-meta {
  font-size: 0.8rem;
  color: var(--text-muted, #64748b);
  margin-top: 0.5rem;
}

.soporte-pendientes-badge {
  display: inline-block;
  margin-left: 0.6rem;
  padding: 0.15rem 0.6rem;
  border-radius: var(--radius-xl, 24px);
  background: rgba(255, 100, 0, 0.12);
  color: #ff6400;
  font-size: 0.75rem;
  font-weight: 700;
  vertical-align: middle;
}

.ticket-thread {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  max-height: 320px;
  overflow-y: auto;
  padding-right: 0.25rem;
}

.ticket-thread-empty {
  font-size: 0.85rem;
  color: var(--text-muted, #64748b);
  font-style: italic;
}

.ticket-thread-msg {
  max-width: 85%;
  padding: 0.6rem 0.9rem;
  border-radius: 12px;
  font-size: 0.88rem;
  line-height: 1.45;
  white-space: pre-wrap;
}

.ticket-thread-msg.autor-admin {
  align-self: flex-start;
  background: rgba(0, 103, 255, 0.08);
  border: 1px solid rgba(0, 103, 255, 0.18);
}

.ticket-thread-msg.autor-usuario {
  align-self: flex-end;
  background: rgba(29, 170, 97, 0.08);
  border: 1px solid rgba(29, 170, 97, 0.18);
}

.ticket-responder-como {
  font-size: 0.8rem;
  font-weight: 700;
  color: var(--text-muted, #64748b);
  margin: 0 0 0.75rem;
}

#ticketResponderForm {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.ticket-lifecycle-actions {
  display: flex;
  gap: 0.6rem;
  margin-top: 0.75rem;
}

.ticket-closed-notice {
  margin: 0;
  padding: 0.75rem 1rem;
  border-radius: var(--radius-sm, 8px);
  background: rgba(29, 170, 97, 0.1);
  color: #1daa61;
  font-size: 0.85rem;
  font-weight: 600;
}

.adjunto-download-link {
  display: inline-block;
  margin-top: 0.4rem;
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--color-primary, #0067FF);
  text-decoration: none;
}

.adjunto-download-link:hover {
  text-decoration: underline;
}

.ticket-sender-name {
  font-weight: 600;
  color: var(--text-dark, #0f172a);
}

.ticket-sender-email {
  display: block;
  margin-top: 0.1rem;
  font-size: 0.8rem;
  color: var(--text-muted, #64748b);
}

.ticket-adjunto-indicator {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  margin-top: 0.3rem;
  padding: 0.1rem 0.5rem;
  border-radius: var(--radius-xl, 24px);
  background: rgba(0, 103, 255, 0.1);
  color: #0067FF;
  font-size: 0.72rem;
  font-weight: 700;
}

.ticket-thread-msg-meta {
  display: block;
  font-size: 0.72rem;
  font-weight: 700;
  color: var(--text-muted, #64748b);
  margin-bottom: 0.25rem;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

.adjunto-thumb {
  display: block;
  margin-top: 0.5rem;
  max-width: 220px;
  max-height: 160px;
  border-radius: 8px;
  border: 1px solid var(--border-light, #e2e8f0);
  cursor: zoom-in;
}

.adjunto-doc-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  margin-top: 0.5rem;
  padding: 0.45rem 0.75rem;
  border-radius: var(--radius-md, 8px);
  border: 1px solid var(--border-light, #e2e8f0);
  background: var(--bg-surface-elev, #f8fafc);
  font-size: 0.82rem;
  text-decoration: none;
  color: var(--text-dark, #0f172a);
}

.adjunto-doc-badge:hover {
  border-color: #0067FF;
}

.adjunto-lightbox {
  position: fixed;
  inset: 0;
  margin: auto;
  padding: 0;
  border: none;
  background: transparent;
  max-width: 100vw;
  max-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: zoom-out;
}

.adjunto-lightbox::backdrop {
  background: rgba(15, 23, 42, 0.85);
}

.adjunto-lightbox img {
  max-width: 90vw;
  max-height: 90vh;
  border-radius: 8px;
}

@media (max-width: 768px) {
  .soporte-metrics-row {
    grid-template-columns: repeat(2, 1fr);
  }
}
.role-pill.active-pill { background: #dcfce7; color: #15803d; }
.role-pill.inactive-pill { background: #f1f5f9; color: #64748b; }

/* ── Newsletter ──────────────────────────────────────────────── */
.newsletter-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 1rem;
}

.newsletter-stat {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
}

.newsletter-stat-label {
  font-size: 0.78rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--text-muted, #64748b);
}

.newsletter-stat-value {
  font-size: 2rem;
  font-weight: 800;
  color: var(--text-dark, #0f172a);
}

.newsletter-toolbar-actions {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.table-toolbar {
  display: flex;
  align-items: center;
}

.table-search-box {
  position: relative;
  display: flex;
  align-items: center;
  flex: 1;
  min-width: 220px;
  max-width: 360px;
}

.search-icon {
  position: absolute;
  left: 0.75rem;
  font-size: 0.85rem;
  color: var(--text-muted, #64748b);
  pointer-events: none;
}

.table-search-input {
  width: 100%;
  padding: 0.6rem 2.1rem 0.6rem 2.15rem;
  border: 1px solid var(--border-light, #e2e8f0);
  border-radius: var(--radius-sm, 8px);
  font-family: inherit;
  font-size: 0.85rem;
  outline: none;
  background: #ffffff;
  color: var(--text-dark, #0f172a);
  transition: all 0.2s;
}

.table-search-input::placeholder {
  color: var(--text-muted, #94a3b8);
}

.table-search-input:focus {
  border-color: var(--color-primary, #0067FF);
  box-shadow: 0 0 0 3px rgba(0, 103, 255, 0.12);
}

.btn-clear-search {
  position: absolute;
  right: 0.5rem;
  background: transparent;
  border: none;
  font-size: 1.1rem;
  line-height: 1;
  color: var(--text-muted, #64748b);
  cursor: pointer;
  padding: 0.2rem 0.35rem;
  border-radius: 50%;
}

.btn-clear-search:hover {
  background: #f1f5f9;
  color: var(--text-dark, #0f172a);
}

.pagination-controls {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  padding-top: 1.25rem;
}

.pagination-indicator {
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--text-muted, #64748b);
}

/* ── Form & Grids ────────────────────────────────────────────── */
/* Mobile-first: una columna en móvil, dos desde 641px. */
.dash-grid-2 {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 1.5rem;
}

@media (min-width: 641px) {
  .dash-grid-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.dash-form {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.form-group {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.form-group label {
  font-size: 0.82rem;
  font-weight: 700;
  color: var(--text-dark, #0f172a);
}

.dash-input {
  padding: 0.65rem 0.85rem;
  border: 1px solid var(--border-light, #e2e8f0);
  border-radius: var(--radius-sm, 8px);
  font-family: inherit;
  font-size: 0.88rem;
  outline: none;
  background: #ffffff;
  transition: all 0.2s;
}

.dash-input:focus {
  border-color: var(--color-primary, #0067FF);
  box-shadow: 0 0 0 3px rgba(0, 103, 255, 0.12);
}

/* Mobile-first: una columna en móvil y dos desde 641px. minmax(0, 1fr)
   evita que el ancho mínimo intrínseco de los inputs desborde la fila. */
.form-row-2 {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 1rem;
}

@media (min-width: 641px) {
  .form-row-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Tablas de Configuraciones: en móvil se desplazan dentro de su tarjeta en
   vez de ensanchar toda la página. Es region enfocable (tabindex=0) para
   que el scroll horizontal también sea operable con teclado. */
.config-table-scroll {
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.config-table-scroll:focus-visible {
  outline: 2px solid #0067FF;
  outline-offset: 2px;
}

.btn-full {
  width: 100%;
  justify-content: center;
  padding: 0.85rem;
  font-size: 0.95rem;
}

.bullet-list {
  padding-left: 1.25rem;
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
  font-size: 0.88rem;
  color: var(--text-muted, #64748b);
  line-height: 1.5;
}

.status-notice {
  margin-top: 1rem;
  padding: 0.75rem 1rem;
  border-radius: var(--radius-sm, 8px);
  font-size: 0.85rem;
  font-weight: 600;
}

.status-notice.success { background: #dcfce7; color: #15803d; border: 1px solid #bbf7d0; }
.status-notice.error { background: #fee2e2; color: #b91c1c; border: 1px solid #fecaca; }

/* ── Gestor de Plantillas de Correo (Configuraciones → Plantillas) ──── */
.email-template-toolbar {
  display: flex;
  flex-direction: column;
  gap: 1.1rem;
}

.email-template-hint {
  font-weight: 400;
  color: var(--text-muted, #64748b);
  text-transform: none;
  letter-spacing: normal;
}

/* ── Configuraciones → Mi Perfil: datos + intereses de notificación ──
   Colores del Design System (CLAUDE.md), en tokens propios del panel. */
.config-subpanel[data-config-panel="perfil"] {
  --pi-primary: #0067FF;
  --pi-primary-soft: rgba(0, 103, 255, 0.08);
  --pi-success: #1daa61;
  --pi-success-soft: rgba(29, 170, 97, 0.12);
  --pi-alert: #ff6400;
  --pi-alert-soft: rgba(255, 100, 0, 0.1);
  --pi-muted: #64748b;
  --pi-border: #e2e8f0;
  --pi-bg: #f8fafc;
}

/* Mobile-first: una columna; desde 1200px datos e intereses lado a lado,
   así el panel aprovecha todo el ancho en vez de dejar media vista vacía. */
.perfil-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 1.25rem;
  align-items: start;
}

@media (min-width: 1200px) {
  .perfil-layout {
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
  }
}

.perfil-layout > .dash-card {
  margin-bottom: 0;
}

.perfil-intereses-header {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
  padding-bottom: 1rem;
  margin-bottom: 1rem;
  border-bottom: 1px solid var(--pi-border);
}

.perfil-intereses-header h4 {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin: 0 0 0.25rem;
  font-size: 1.05rem;
  font-weight: 700;
  color: #0f172a;
}

.perfil-intereses-header h4 svg,
.perfil-intereses-header h4 i {
  width: 18px;
  height: 18px;
  color: var(--pi-primary);
}

.perfil-intereses-header p {
  margin: 0;
  font-size: 0.85rem;
  color: var(--pi-muted);
}

.perfil-intereses-lista {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
}

.perfil-intereses-vacio,
.perfil-coincidencias-vacio,
.perfil-intereses-nota {
  margin: 0;
  font-size: 0.85rem;
  color: var(--pi-muted);
}

.perfil-interes,
.perfil-interes-editor {
  border: 1px solid var(--pi-border);
  border-radius: 10px;
  padding: 1rem;
  background: var(--pi-bg);
  min-width: 0;
}

.perfil-interes-editor {
  margin-bottom: 1rem;
  background: #ffffff;
  border-color: var(--pi-primary);
}

.perfil-interes-top {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  margin-bottom: 0.75rem;
}

.perfil-interes h5,
.perfil-interes-editor h5 {
  margin: 0;
  font-size: 0.95rem;
  font-weight: 700;
  color: #0f172a;
  overflow-wrap: anywhere;
}

.perfil-interes-editor h5 {
  margin-bottom: 0.75rem;
}

.perfil-estado {
  font-size: 0.72rem;
  font-weight: 700;
  padding: 0.2rem 0.55rem;
  border-radius: 999px;
  background: #e2e8f0;
  color: var(--pi-muted);
  white-space: nowrap;
}

.perfil-estado[data-estado="activa"] {
  background: var(--pi-success-soft);
  color: #13804a; /* success oscurecido: contraste AA sobre su fondo */
}

.perfil-estado[data-estado="no-notifica"] {
  background: var(--pi-alert-soft);
  color: #b84700; /* alert oscurecido: contraste AA sobre su fondo */
}

.perfil-interes-criterios {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0.6rem;
  margin: 0;
}

@media (min-width: 641px) {
  .perfil-interes-criterios {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.perfil-interes-criterios > div {
  min-width: 0;
}

.perfil-interes-criterios dt {
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--pi-muted);
  margin-bottom: 0.25rem;
}

.perfil-interes-criterios dd {
  display: flex;
  flex-wrap: wrap;
  gap: 0.3rem;
  margin: 0;
  font-size: 0.86rem;
  color: #0f172a;
}

.perfil-chip {
  display: inline-block;
  max-width: 100%;
  padding: 0.15rem 0.55rem;
  border-radius: 999px;
  background: var(--pi-primary-soft);
  color: #0052cc;
  font-size: 0.78rem;
  font-weight: 600;
  overflow-wrap: anywhere;
}

.perfil-chip-muted {
  background: #eef2f7;
  color: var(--pi-muted);
}

.perfil-interes-motivo {
  margin: 0.75rem 0 0;
  padding: 0.55rem 0.75rem;
  border-radius: 8px;
  background: var(--pi-alert-soft);
  color: #8a3a00;
  font-size: 0.8rem;
  line-height: 1.45;
}

.perfil-editor-error {
  margin: 0.5rem 0 0;
  color: #b91c1c;
  font-size: 0.82rem;
}

.perfil-interes-acciones {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 0.85rem;
}

.perfil-interes-editor .perfil-interes-acciones {
  justify-content: flex-end;
}

.perfil-coincidencias {
  margin-top: 0.85rem;
  padding-top: 0.85rem;
  border-top: 1px dashed var(--pi-border);
}

.perfil-coincidencias-total,
.perfil-coincidencias-mas {
  margin: 0 0 0.5rem;
  font-size: 0.84rem;
  color: #334155;
}

.perfil-coincidencias-lista {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.perfil-coincidencias-lista li {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  padding: 0.55rem 0.7rem;
  border-radius: 8px;
  background: #ffffff;
  border: 1px solid var(--pi-border);
  min-width: 0;
}

.perfil-coincidencia-titulo {
  font-size: 0.85rem;
  font-weight: 600;
  color: #0f172a;
  overflow-wrap: anywhere;
}

.perfil-coincidencia-titulo a {
  color: var(--pi-primary);
  text-decoration: none;
}

.perfil-coincidencia-titulo a:hover,
.perfil-coincidencia-titulo a:focus-visible {
  text-decoration: underline;
}

.perfil-coincidencia-meta {
  font-size: 0.76rem;
  color: var(--pi-muted);
  overflow-wrap: anywhere;
}

.link-button {
  background: none;
  border: none;
  padding: 0;
  font: inherit;
  color: var(--pi-primary, #0067FF);
  font-weight: 600;
  text-decoration: underline;
  cursor: pointer;
}

/* Selector de plantilla como pestañas segmentadas: son pocas plantillas
   fijas, así que verlas todas de un vistazo evita abrir un menú. Antes era
   un <select> con .dash-select, que es el estilo compacto del selector de
   workspace del header (transparente y con max-width de 145px), por eso
   el nombre de la plantilla quedaba cortado. */
/* Tokens del Design System Neiva Move (CLAUDE.md): el gestor de plantillas
   usa los colores oficiales y no el --color-primary propio del dashboard.
   Viven en el subpanel porque el selector y el tabpanel del editor son
   hermanos y ambos los consumen. */
.config-subpanel[data-config-panel="email-templates"] {
  --tpl-primary: #0067FF;
  --tpl-primary-ring: rgba(0, 103, 255, 0.12);
  --tpl-primary-soft: rgba(0, 103, 255, 0.06);
  --tpl-primary-border: rgba(0, 103, 255, 0.2);
}

.email-template-picker {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
  min-width: 0;
}

.email-template-picker-label {
  font-size: 0.85rem;
  font-weight: 700;
  color: #0f172a;
}

/* Las pestañas de plantillas reutilizan el estilo de las pestañas de
   Información Legal (.legal-subtabs-nav / .legal-subtab-btn, incluido su
   modo oscuro) para que Configuraciones se vea consistente. Aquí solo va lo
   propio: el selector también se usa con teclado (patrón ARIA tabs), así
   que necesita un foco visible, que las pestañas legales no tenían. */
.email-template-tabs {
  margin-bottom: 0;
}

.legal-subtab-btn:focus-visible {
  outline: 2px solid var(--color-primary, #0067FF);
  outline-offset: 2px;
}

.email-template-description {
  display: flex;
  align-items: flex-start;
  gap: 0.6rem;
  font-size: 0.85rem;
  color: #64748b;
  background: var(--tpl-primary-soft);
  border: 1px solid var(--tpl-primary-border);
  border-radius: 8px;
  padding: 0.7rem 0.9rem;
  line-height: 1.5;
}

.email-template-description svg,
.email-template-description i {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  margin-top: 0.15rem;
  color: var(--tpl-primary);
}

.email-template-description p {
  margin: 0;
  min-width: 0;
  overflow-wrap: anywhere;
}

.email-template-variables-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  min-height: 2.25rem;
  align-items: center;
}

.variable-chip {
  display: inline-flex;
  align-items: center;
  background: rgba(0, 103, 255, 0.08);
  color: var(--color-primary, #0067FF);
  border: 1px solid rgba(0, 103, 255, 0.18);
  border-radius: 20px;
  padding: 0.3rem 0.75rem;
  font-family: 'JetBrains Mono', monospace;
  font-size: 0.78rem;
  font-weight: 700;
  cursor: pointer;
  transition: all 0.2s;
}

.variable-chip:hover {
  background: var(--color-primary, #0067FF);
  color: #ffffff;
  border-color: var(--color-primary, #0067FF);
  transform: translateY(-1px);
}

.email-template-split-view {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.5rem;
  align-items: stretch;
  margin-bottom: 1.5rem;
}

.email-template-editor-panel,
.email-template-preview-panel {
  display: flex;
  flex-direction: column;
  margin-bottom: 0;
}

.code-editor-textarea {
  width: 100%;
  min-height: 450px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 0.85rem;
  line-height: 1.6;
  color: #1e293b;
  background: #f8fafc;
  border: 1px solid var(--border-light, #e2e8f0);
  border-radius: var(--radius-sm, 8px);
  padding: 1rem;
  resize: vertical;
  overflow-y: auto;
}

.code-editor-textarea:focus {
  outline: none;
  border-color: var(--color-primary, #0067FF);
  box-shadow: 0 0 0 3px rgba(0, 103, 255, 0.12);
}

.email-preview-frame {
  flex: 1;
  display: flex;
  flex-direction: column;
  background: #f1f5f9;
  border: 1px solid var(--border-light, #e2e8f0);
  border-radius: var(--radius-md, 12px);
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.04);
  overflow: hidden;
  min-height: 450px;
}

.email-preview-inbox-bar {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  background: #e2e8f0;
  padding: 0.6rem 0.85rem;
  border-bottom: 1px solid #cbd5e1;
  flex-shrink: 0;
}

.email-preview-dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #cbd5e1;
}

.email-preview-dot:nth-child(1) { background: #ef4444; }
.email-preview-dot:nth-child(2) { background: #fbbf24; }
.email-preview-dot:nth-child(3) { background: #22c55e; }

.email-preview-subject {
  /* Ítem flex con texto nowrap: sin min-width:0 su ancho mínimo es el
     asunto completo y ensanchaba toda la tarjeta de vista previa. */
  flex: 1;
  min-width: 0;
  margin-left: 0.5rem;
  font-size: 0.78rem;
  font-weight: 600;
  color: #475569;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.email-preview-iframe {
  flex: 1;
  width: 100%;
  min-height: 400px;
  border: none;
  background: #ffffff;
}

.email-template-actions-bar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  flex-wrap: wrap;
}

.email-template-actions-bar .status-notice {
  margin-top: 0;
  flex: 1;
  min-width: 200px;
}

.email-template-actions-buttons {
  display: flex;
  gap: 0.75rem;
  margin-left: auto;
}

@media (max-width: 900px) {
  .email-template-split-view {
    grid-template-columns: 1fr;
  }
}

/* ── Identidad de Marca / White-Label (Configuraciones → Marca) ─────── */
.branding-split-view {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 2rem;
  align-items: start;
}

.branding-form-panel form h3 {
  margin-top: 1.5rem;
  padding-top: 1rem;
  border-top: 1px solid var(--border-light, #e2e8f0);
}

.branding-form-panel form h3:first-child {
  margin-top: 0;
  padding-top: 0;
  border-top: none;
}

.color-picker-group {
  display: flex;
  align-items: center;
  gap: 0.6rem;
}

.color-picker-group input[type="color"] {
  width: 42px;
  height: 42px;
  flex-shrink: 0;
  padding: 2px;
  border: 1px solid var(--border-light, #e2e8f0);
  border-radius: var(--radius-sm, 8px);
  cursor: pointer;
  background: none;
}

.color-picker-group .dash-input {
  flex: 1;
  /* Sin esto el ancho mínimo intrínseco del input desborda la columna. */
  min-width: 0;
  font-family: 'JetBrains Mono', monospace;
  text-transform: uppercase;
}

.branding-actions-bar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  flex-wrap: wrap;
  margin-top: 1.5rem;
  padding-top: 1.25rem;
  border-top: 1px solid var(--border-light, #e2e8f0);
}

.branding-actions-bar .status-notice {
  margin-top: 0;
  flex: 1;
  min-width: 200px;
}

.branding-actions-buttons {
  display: flex;
  gap: 0.75rem;
  margin-left: auto;
}

.brand-preview-card {
  position: sticky;
  top: 1rem;
  /* Variables del simulador: las fija updateBrandLivePreview() desde el
     formulario, así el simulador refleja toda la paleta sin tocar la
     plataforma hasta guardar. Valores por defecto = Design System. */
  --pv-primario: #0067FF;
  --pv-primario-hover: #0052cc;
  --pv-secundario: #2a72ed;
  --pv-acento: #0f172a;
  --pv-exito: #1daa61;
  --pv-advertencia: #fdb513;
  --pv-alerta: #ff6400;
  --pv-info: #3fd0c2;
  --pv-innovacion: #903393;
  --pv-fondo: #f8fafc;
  --pv-superficie: #ffffff;
  --pv-borde: #e2e8f0;
  --pv-texto: #0f172a;
  --pv-texto-secundario: #64748b;
  --pv-texto-atenuado: #94a3b8;
}

.brand-preview-window {
  display: flex;
  min-height: 340px;
  background: var(--pv-fondo);
  border: 1px solid var(--pv-borde);
  border-radius: var(--radius-lg, 16px);
  box-shadow: 0 4px 16px rgba(15, 23, 42, 0.06);
  overflow: hidden;
}

.brand-preview-sidebar {
  width: 150px;
  flex-shrink: 0;
  background: var(--pv-acento);
  padding: 1.1rem 0.85rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  transition: background-color 0.2s ease, color 0.2s ease;
}

.brand-preview-logo,
.brand-preview-logo-light {
  display: flex;
  align-items: center;
  min-height: 28px;
  font-weight: 800;
  font-size: 0.72rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.brand-preview-logo {
  color: #ffffff;
  opacity: 0.9;
  margin-bottom: 0.6rem;
}

.brand-preview-logo-light {
  color: var(--pv-texto);
}

.brand-preview-logo img,
.brand-preview-logo-light img {
  max-height: 28px;
  max-width: 120px;
  object-fit: contain;
}

.brand-preview-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-bottom: 0.6rem;
  border-bottom: 1px solid var(--pv-borde);
}

.brand-preview-favicon {
  width: 20px;
  height: 20px;
  border-radius: 4px;
  background: var(--pv-superficie);
  border: 1px solid var(--pv-borde);
  overflow: hidden;
}

.brand-preview-favicon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.brand-preview-nav-item {
  color: rgba(255, 255, 255, 0.7);
  font-size: 0.75rem;
  font-weight: 600;
  padding: 0.45rem 0.55rem;
  border-radius: 6px;
  transition: background-color 0.2s ease, color 0.2s ease;
}

.brand-preview-nav-item.active {
  background: rgba(255, 255, 255, 0.14);
  color: #ffffff;
  font-weight: 700;
}

.brand-preview-content {
  flex: 1;
  padding: 1.25rem;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  min-width: 0;
}

.brand-preview-content h4 {
  font-size: 1.15rem;
  font-weight: 800;
  color: var(--pv-texto);
  margin: 0;
  transition: color 0.2s ease;
}

.brand-preview-content p {
  font-size: 0.82rem;
  color: var(--pv-texto-secundario);
  margin: 0 0 0.25rem 0;
}

.brand-preview-buttons,
.brand-preview-states {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.brand-preview-btn-primary,
.brand-preview-btn-secondary {
  border: none;
  border-radius: var(--radius-sm, 8px);
  padding: 0.55rem 0.95rem;
  font-family: inherit;
  font-size: 0.78rem;
  font-weight: 700;
  color: #ffffff;
  cursor: default;
  transition: background-color 0.2s ease, color 0.2s ease;
}

.brand-preview-btn-primary {
  background: var(--pv-primario);
}

.brand-preview-btn-primary.is-hover {
  background: var(--pv-primario-hover);
}

.brand-preview-btn-secondary {
  background: var(--pv-secundario);
}

.brand-preview-state {
  padding: 0.25rem 0.6rem;
  border-radius: 999px;
  font-size: 0.7rem;
  font-weight: 700;
  color: #ffffff;
}

.brand-preview-state[data-estado="exito"] { background: var(--pv-exito); }
.brand-preview-state[data-estado="advertencia"] { background: var(--pv-advertencia); color: #1e293b; }
.brand-preview-state[data-estado="alerta"] { background: var(--pv-alerta); }
.brand-preview-state[data-estado="info"] { background: var(--pv-info); color: #1e293b; }
.brand-preview-state[data-estado="innovacion"] { background: var(--pv-innovacion); }

.brand-preview-surface {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  padding: 0.75rem 0.9rem;
  border-radius: var(--radius-sm, 8px);
  background: var(--pv-superficie);
  border: 1px solid var(--pv-borde);
  font-size: 0.8rem;
}

.brand-preview-surface strong {
  color: var(--pv-texto);
}

.brand-preview-text-secondary {
  color: var(--pv-texto-secundario);
}

.brand-preview-text-dim {
  color: var(--pv-texto-atenuado);
  font-size: 0.74rem;
}

.brand-preview-badge {
  display: inline-flex;
  align-self: flex-start;
  background: color-mix(in srgb, var(--pv-primario) 12%, transparent);
  color: var(--pv-primario);
  border-radius: var(--radius-pill, 9999px);
  padding: 0.3rem 0.75rem;
  font-size: 0.72rem;
  font-weight: 700;
  transition: background-color 0.2s ease, color 0.2s ease;
}

/* ── Formulario de marca: paleta por grupos y activos gráficos ──── */
.brand-section-hint {
  margin: -0.25rem 0 0.75rem;
  font-size: 0.8rem;
  color: var(--text-muted, #64748b);
}

.brand-color-group {
  border: 1px solid var(--border-light, #e2e8f0);
  border-radius: var(--radius-sm, 8px);
  padding: 0.75rem 0.9rem 0.9rem;
  margin: 0 0 0.85rem;
  min-width: 0;
}

.brand-color-group legend {
  padding: 0 0.35rem;
  font-size: 0.78rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--text-muted, #64748b);
}

/* Mobile-first: una columna; dos o más según el ancho disponible. */
.brand-color-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(170px, 100%), 1fr));
  gap: 0.75rem;
}

.brand-color-field {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  min-width: 0;
}

.brand-color-field label {
  font-size: 0.8rem;
  font-weight: 600;
}

.color-picker-group .dash-input.is-invalid {
  border-color: #dc2626;
  box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.12);
}

.brand-asset-field {
  margin-bottom: 1rem;
}

.brand-asset-label {
  display: block;
  font-size: 0.85rem;
  font-weight: 600;
  margin-bottom: 0.4rem;
}

.brand-asset-row {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  min-width: 0;
}

.brand-asset-thumb {
  width: 72px;
  height: 56px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px dashed var(--border-light, #e2e8f0);
  border-radius: var(--radius-sm, 8px);
  /* Cuadrícula de transparencia: deja ver logos con fondo transparente. */
  background: repeating-conic-gradient(#f1f5f9 0% 25%, #ffffff 0% 50%) 50% / 12px 12px;
  color: #94a3b8;
  overflow: hidden;
}

[data-brand-asset="logo_oscuro"] .brand-asset-thumb {
  background: #0f172a;
}

.brand-asset-thumb img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

.brand-asset-info {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  min-width: 0;
}

.brand-asset-name {
  font-size: 0.82rem;
  font-weight: 600;
  overflow-wrap: anywhere;
}

.brand-asset-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
}

.brand-asset-choose {
  cursor: pointer;
  /* Contiene al <input type=file> oculto (position: absolute). Sin esto el
     input se posiciona respecto al documento, fuera del área con scroll, y
     al devolverle el foco tras el diálogo de archivos el navegador desplaza
     el documento entero: la vista quedaba en blanco (header incluido). */
  position: relative;
}

/* .btn-secondary-sm fija display; sin esto el atributo hidden no oculta
   «Quitar» cuando no hay archivo que quitar. */
.brand-asset-actions [hidden] {
  display: none !important;
}

.brand-asset-choose:focus-within {
  outline: 2px solid #0067FF;
  outline-offset: 2px;
}

/* Oculta el input de archivo sin sacarlo del árbol de accesibilidad: se
   activa con su <label>, que sí es visible y enfocable. */
.visually-hidden {
  position: absolute !important;
  top: 0;
  left: 0;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

@media (max-width: 900px) {
  .branding-split-view {
    grid-template-columns: minmax(0, 1fr);
  }

  .brand-preview-card {
    position: static;
  }
}

/* ── Modals ──────────────────────────────────────────────────── */
.dash-modal {
  border: none;
  border-radius: var(--radius-lg, 16px);
  padding: 0;
  background: transparent;
  max-width: 500px;
  width: 90%;
  margin: auto;
}

.dash-modal::backdrop {
  background: rgba(15, 23, 42, 0.6);
  backdrop-filter: blur(4px);
}

.modal-box {
  background: #ffffff;
  border-radius: var(--radius-lg, 16px);
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.2);
  overflow: hidden;
}

.modal-header {
  padding: 1.25rem 1.5rem;
  border-bottom: 1px solid var(--border-light, #e2e8f0);
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.modal-header h3 {
  font-size: 1.15rem;
  font-weight: 800;
  color: var(--text-dark, #0f172a);
}

.modal-close {
  background: transparent;
  border: none;
  font-size: 1.5rem;
  color: var(--text-muted, #64748b);
  cursor: pointer;
}

.modal-body {
  padding: 1.5rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.modal-footer {
  display: flex;
  justify-content: flex-end;
  gap: 0.75rem;
  margin-top: 1rem;
}

/* ── Footer ──────────────────────────────────────────────────── */
.dash-footer {
  background: var(--bg-surface, #ffffff);
  border-top: 1px solid var(--border-light, #e2e8f0);
  padding: 1.25rem 2rem;
  margin-left: 250px;
  text-align: center;
  font-size: 0.85rem;
  color: var(--text-muted, #64748b);
}

.dash-footer a {
  color: var(--color-primary, #0067FF);
  font-weight: 700;
  text-decoration: none;
}

.dash-footer a:hover {
  text-decoration: underline;
}

/* El footer vive fuera de .dash-layout, así que debe seguir el ancho del
   sidebar por su cuenta: 76px colapsado en escritorio y 0 en móvil. */
@media (min-width: 993px) {
  body.sidebar-collapsed .dash-footer,
  html.sidebar-collapsed .dash-footer {
    margin-left: 76px;
  }
}

@media (max-width: 992px) {
  .dash-footer {
    margin-left: 0;
    padding: 0.75rem 1rem;
  }
}

/* Header en teléfonos: la búsqueda queda como botón de ícono y el usuario
   solo con su avatar, para que ☰, acciones y perfil quepan sin solaparse. */
@media (max-width: 640px) {
  .dash-header-left,
  .dash-header-right {
    gap: 0.35rem;
    min-width: 0;
  }

  .header-search-pill {
    width: 42px;
    padding: 0 !important;
    justify-content: center;
    flex-shrink: 0;
  }

  .header-search-placeholder,
  .header-divider,
  .user-info,
  .user-pill-chevron {
    display: none;
  }

  .user-pill {
    padding: 0.15rem;
  }
}

/* ── Asistente de Pliegos & RFP Copilot AI ───────────────────── */
.btn-ai-analyze {
  background: linear-gradient(135deg, #eff6ff, #f3e8ff);
  color: #6b21a8;
  border: 1px solid #d8b4fe;
  padding: 0.35rem 0.65rem;
  border-radius: var(--radius-sm, 8px);
  font-size: 0.78rem;
  font-weight: 700;
  cursor: pointer;
  transition: var(--transition-smooth, all 0.2s ease);
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
}

.btn-ai-analyze:hover {
  background: linear-gradient(135deg, #0067FF, #903393);
  color: #ffffff;
  border-color: transparent;
  transform: translateY(-1px);
  box-shadow: 0 4px 10px rgba(107, 33, 168, 0.25);
}

.modal-large {
  max-width: 960px !important;
  width: 95% !important;
}

.modal-box-lg {
  max-height: 90vh;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.modal-box-lg .modal-body {
  overflow-y: auto;
  max-height: calc(90vh - 140px);
}

.modal-title-group {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.badge-ai-gradient {
  background: linear-gradient(135deg, #0067FF, #903393);
  color: #ffffff;
  font-size: 0.75rem;
  font-weight: 800;
  padding: 0.25rem 0.65rem;
  border-radius: 6px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.ai-loading-state {
  text-align: center;
  padding: 3rem 1rem;
}

.ai-spinner {
  width: 48px;
  height: 48px;
  border: 4px solid #e2e8f0;
  border-top-color: var(--color-primary, #0067FF);
  border-radius: 50%;
  margin: 0 auto 1.25rem;
  animation: spin 1s linear infinite;
}

@keyframes spin {
  to { transform: rotate(360deg); }
}

.is-spinning {
  animation: spin 0.8s linear infinite !important;
  display: inline-block;
}

.proposal-hero-card {
  background: linear-gradient(135deg, #f8fafc, #eff6ff);
  border: 1px solid #bfdbfe;
  border-radius: var(--radius-md, 12px);
  padding: 1.25rem;
  display: flex;
  gap: 1.5rem;
  align-items: center;
  margin-bottom: 1rem;
}

.score-radial-wrapper {
  display: flex;
  flex-direction: column;
  align-items: center;
  min-width: 100px;
}

.score-circle-badge {
  width: 84px;
  height: 84px;
  border-radius: 50%;
  background: #ffffff;
  border: 4px solid #0067FF;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 14px rgba(0, 103, 255, 0.15);
}

.score-circle-badge span:first-child {
  font-size: 1.45rem;
  font-weight: 800;
  color: var(--color-primary, #0067FF);
  line-height: 1.1;
}

.score-label {
  font-size: 0.68rem;
  font-weight: 700;
  color: var(--text-muted, #64748b);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.score-semaforo-badge {
  font-size: 0.78rem;
  font-weight: 700;
  padding: 0.25rem 0.6rem;
  border-radius: 20px;
  margin-top: 0.5rem;
}

.score-semaforo-badge.verde { background: #dcfce7; color: #15803d; border: 1px solid #bbf7d0; }
.score-semaforo-badge.amarillo { background: #fef9c3; color: #a16207; border: 1px solid #fef08a; }
.score-semaforo-badge.rojo { background: #fee2e2; color: #b91c1c; border: 1px solid #fecaca; }

.proposal-meta-tags {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
  margin-bottom: 0.5rem;
}

.meta-tag-item {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  padding: 0.2rem 0.5rem;
  border-radius: 6px;
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--text-dark, #0f172a);
}

.meta-tag-item.highlight {
  background: #eff6ff;
  border-color: #93c5fd;
  color: #1d4ed8;
  font-weight: 800;
}

.proposal-summary-text {
  font-size: 0.88rem;
  color: var(--text-dark, #0f172a);
  line-height: 1.5;
}

.proposal-subtabs {
  display: flex;
  gap: 0.5rem;
  border-bottom: 1px solid var(--border-light, #e2e8f0);
  margin-bottom: 1rem;
}

.subtab-btn {
  background: transparent;
  border: none;
  padding: 0.65rem 1rem;
  font-size: 0.88rem;
  font-weight: 700;
  color: var(--text-muted, #64748b);
  cursor: pointer;
  border-bottom: 2px solid transparent;
  transition: all 0.2s;
}

.subtab-btn:hover {
  color: var(--color-primary, #0067FF);
}

.subtab-btn.active {
  color: var(--color-primary, #0067FF);
  border-bottom-color: var(--color-primary, #0067FF);
}

.req-section-group {
  margin-bottom: 1.25rem;
}

.req-group-title {
  font-size: 0.95rem;
  font-weight: 800;
  color: var(--text-dark, #0f172a);
  margin-bottom: 0.5rem;
}

.table-reqs td {
  font-size: 0.84rem;
}

.draft-actions-bar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.75rem;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: var(--radius-sm, 8px);
  padding: 0.75rem 1rem;
  margin-bottom: 1rem;
}

.draft-actions-left {
  display: flex;
  gap: 0.5rem;
}

.draft-pill {
  background: #ffffff;
  border: 1px solid #cbd5e1;
  padding: 0.25rem 0.6rem;
  border-radius: 6px;
  font-size: 0.75rem;
  font-weight: 600;
}

.draft-preview-container {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.draft-sub-block h5 {
  font-size: 0.88rem;
  font-weight: 700;
  color: var(--text-dark, #0f172a);
  margin-bottom: 0.4rem;
}

.code-preview-box {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: var(--radius-sm, 8px);
  padding: 1rem;
  font-family: 'JetBrains Mono', monospace;
  font-size: 0.82rem;
  line-height: 1.5;
  color: #1e293b;
  max-height: 280px;
  overflow-y: auto;
  white-space: pre-wrap;
  word-break: break-word;
}

/* ── Explorador de Convocatorias ─────────────────────────────── */
.explorar-filters-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 1.25rem;
}

.explorar-search-box {
  flex: 2;
  min-width: 240px;
  max-width: none;
}

.explorar-filter-select {
  flex: 1;
  min-width: 170px;
}

.btn-toggle-ia {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.6rem 1rem;
  border: 1px solid var(--border-light, #e2e8f0);
  border-radius: var(--radius-pill, 999px);
  background: #ffffff;
  color: var(--text-muted, #64748b);
  font-family: inherit;
  font-size: 0.85rem;
  font-weight: 700;
  cursor: pointer;
  white-space: nowrap;
  transition: all 0.2s;
}

.btn-toggle-ia:hover {
  border-color: var(--color-primary, #0067FF);
  color: var(--color-primary, #0067FF);
}

.btn-toggle-ia .ia-icon {
  font-size: 0.95rem;
  transition: filter 0.2s;
}

.btn-toggle-ia.active {
  background: rgba(0, 103, 255, 0.1);
  border-color: var(--color-primary, #0067FF);
  color: var(--color-primary, #0067FF);
}

.btn-toggle-ia.active .ia-icon {
  filter: drop-shadow(0 0 4px rgba(0, 103, 255, 0.7));
}

.similarity-row {
  margin-top: -0.15rem;
}

.badge-similarity {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  font-size: 0.75rem;
  font-weight: 700;
  padding: 0.2rem 0.55rem;
  border-radius: 999px;
  background: linear-gradient(135deg, #eff6ff, #f3e8ff);
  color: #4c1d95;
  border: 1px solid #ddd6fe;
  white-space: nowrap;
}

.explorar-results-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 0.75rem;
}

.explorar-results-count {
  font-size: 0.85rem;
  font-weight: 700;
  color: var(--text-muted, #64748b);
}

.cards-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
  gap: 1.25rem;
}

@media (max-width: 768px) {
  .cards-grid {
    grid-template-columns: 1fr;
  }
}

.explorer-card {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  padding: 1.25rem 1.25rem 1.15rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 0.85rem;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 1px 2px rgba(0, 0, 0, 0.02);
  transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
  position: relative;
}

.explorer-card:hover {
  border-color: #93c5fd;
  box-shadow: 0 12px 24px -4px rgba(0, 103, 255, 0.12), 0 4px 6px -2px rgba(0, 103, 255, 0.04);
  transform: translateY(-3px);
}

.explorer-card-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0.5rem;
}

.badge-estado {
  font-size: 0.7rem;
  font-weight: 700;
  padding: 0.2rem 0.6rem;
  border-radius: 999px;
  white-space: nowrap;
  letter-spacing: 0.01em;
}

.badge-estado.abierto { background: #ecfdf5; color: #059669; border: 1px solid #a7f3d0; }
.badge-estado.publicado { background: #eff6ff; color: #0067FF; border: 1px solid #bfdbfe; }
.badge-estado.en_evaluacion { background: #fffbeb; color: #d97706; border: 1px solid #fde68a; }
.badge-estado.adjudicado { background: #f5f3ff; color: #7c3aed; border: 1px solid #ddd6fe; }
.badge-estado.en_ejecucion { background: #f0fdfa; color: #0d9488; border: 1px solid #99f6e4; }
.badge-estado.cerrado { background: #f1f5f9; color: #64748b; border: 1px solid #e2e8f0; }
.badge-estado.desierto,
.badge-estado.cancelado { background: #fee2e2; color: #991b1b; border: 1px solid #fecaca; }
.badge-estado.antigua { background: #fefce8; color: #a16207; border: 1px solid #fef08a; }
.badge-estado.desconocido { background: #f1f5f9; color: #64748b; border: 1px solid #e2e8f0; }

.explorer-card-header {
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
}

.explorer-card-title {
  font-size: 0.96rem;
  font-weight: 700;
  color: #0f172a;
  line-height: 1.4;
  min-height: 2.7rem;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  margin: 0;
}

.explorer-card-entity {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  font-size: 0.79rem;
  color: #64748b;
}

.entity-item {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.entity-item i {
  width: 14px;
  height: 14px;
  flex-shrink: 0;
  color: #94a3b8;
}

.entity-name {
  font-weight: 600;
  color: #334155;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.explorer-card-middle {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}

.explorer-schedule-box {
  background: #f8fafc;
  border: 1px solid #f1f5f9;
  border-radius: 8px;
  padding: 0.55rem 0.75rem;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.5rem;
}

.schedule-item {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  overflow: hidden;
}

.schedule-label {
  font-size: 0.66rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  color: #94a3b8;
  display: flex;
  align-items: center;
  gap: 0.3rem;
}

.schedule-label i {
  width: 12px;
  height: 12px;
  color: #64748b;
}

.schedule-val {
  font-size: 0.78rem;
  font-weight: 600;
  color: #1e293b;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.explorer-extra-badges {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem;
}

.badge-contrato-tipo {
  background: #f1f5f9;
  color: #334155;
  border: 1px solid #cbd5e1;
  font-size: 0.68rem;
  font-weight: 600;
  padding: 0.14rem 0.5rem;
  border-radius: 6px;
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
}

.badge-engagement {
  background: #ecfeff;
  color: #0891b2;
  border: 1px solid #a5f3fc;
  font-size: 0.68rem;
  font-weight: 600;
  padding: 0.14rem 0.5rem;
  border-radius: 6px;
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
}

.text-danger { color: #dc2626 !important; }
.text-warning { color: #d97706 !important; }
.font-bold { font-weight: 700; }

.explorer-card-bottom {
  margin-top: auto;
  padding-top: 0.75rem;
  border-top: 1px solid #f1f5f9;
  display: flex;
  flex-direction: column;
  gap: 0.7rem;
}

.explorer-val-container {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
}

.explorer-val-label {
  font-size: 0.7rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: #94a3b8;
}

.explorer-card-value {
  font-size: 1.15rem;
  font-weight: 800;
  color: #059669;
  font-family: 'Outfit', -apple-system, sans-serif;
  letter-spacing: -0.01em;
}

.explorer-card-actions {
  display: flex;
  align-items: center;
  gap: 0.55rem;
}

.btn-view-ficha {
  flex: 1;
  height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  padding: 0 0.75rem;
  border-radius: 8px;
  border: 1px solid #cbd5e1;
  background: #ffffff;
  font-size: 0.8rem;
  font-weight: 600;
  color: #334155;
  cursor: pointer;
  transition: all 0.2s ease;
  white-space: nowrap;
  font-family: inherit;
}

.btn-view-ficha:hover {
  background: #f8fafc;
  border-color: #0067FF;
  color: #0067FF;
}

.btn-save-pipeline {
  flex: 1;
  height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  padding: 0 0.75rem;
  border-radius: 8px;
  border: none;
  background: #0067FF;
  font-size: 0.8rem;
  font-weight: 600;
  color: #ffffff;
  cursor: pointer;
  transition: all 0.2s ease;
  white-space: nowrap;
  font-family: inherit;
}

.btn-save-pipeline:hover {
  background: #0052cc;
}

.badge-in-pipeline {
  flex: 1;
  height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  padding: 0 0.75rem;
  border-radius: 8px;
  background: #ecfdf5;
  border: 1px solid #a7f3d0;
  font-size: 0.8rem;
  font-weight: 700;
  color: #059669;
  white-space: nowrap;
}

/* ── Modal de Licitación Profesional (Visor de Ficha Oficial) ── */
.modal-licitacion-pro {
  max-width: 880px !important;
  width: 95vw;
  border-radius: 16px !important;
  padding: 0 !important;
  overflow: hidden;
  box-shadow: 0 25px 60px -12px rgba(15, 23, 42, 0.25) !important;
  border: 1px solid #e2e8f0 !important;
}

.modal-header-pro {
  padding: 1.4rem 1.75rem 1.1rem;
  border-bottom: 1px solid #f1f5f9;
  background: #ffffff;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1rem;
}

.modal-badges-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 0.4rem;
}

.modal-proceso-id {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: 0.74rem;
  font-weight: 700;
  color: #475569;
  background: #f1f5f9;
  padding: 0.15rem 0.55rem;
  border-radius: 6px;
  border: 1px solid #cbd5e1;
}

.modal-licitacion-title {
  font-size: 1.22rem !important;
  font-weight: 800 !important;
  color: #0f172a !important;
  line-height: 1.35 !important;
  margin: 0.25rem 0 0.4rem !important;
}

.modal-entity-sub {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.45rem 0.65rem;
  font-size: 0.82rem;
  color: #475569;
}

.modal-entity-name {
  font-weight: 700;
  color: #1e293b;
}

.modal-nit-badge,
.modal-loc-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  padding: 0.12rem 0.5rem;
  border-radius: 6px;
  font-size: 0.74rem;
  color: #475569;
}

.modal-body-pro {
  padding: 1.4rem 1.75rem !important;
  max-height: 72vh;
  overflow-y: auto;
  background: #ffffff;
}

/* KPI Banner */
.modal-kpi-banner {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0.75rem;
  margin-bottom: 1.25rem;
}

@media (max-width: 768px) {
  .modal-kpi-banner {
    grid-template-columns: repeat(2, 1fr);
  }
}

.modal-kpi-card {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  padding: 0.85rem 0.95rem;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.kpi-card-presupuesto {
  background: linear-gradient(135deg, #f0fdf4 0%, #dcfce7 100%);
  border-color: #86efac;
}

.kpi-card-presupuesto .modal-kpi-label {
  color: #15803d;
}

.kpi-card-presupuesto .modal-kpi-val {
  color: #166534;
  font-size: 1.12rem;
  font-weight: 800;
}

.modal-kpi-label {
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: #64748b;
  display: flex;
  align-items: center;
  gap: 0.35rem;
}

.modal-kpi-val {
  font-size: 0.92rem;
  font-weight: 700;
  color: #0f172a;
}

.kpi-val-date {
  font-size: 0.86rem;
  font-weight: 600;
  color: #1e293b;
}

/* Ficha Técnica Grid */
.modal-technical-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.75rem;
  margin-bottom: 1.25rem;
}

@media (max-width: 640px) {
  .modal-technical-grid {
    grid-template-columns: 1fr;
  }
}

.tech-item {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  padding: 0.75rem 0.9rem;
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}

.tech-label {
  font-size: 0.7rem;
  font-weight: 700;
  color: #64748b;
  display: flex;
  align-items: center;
  gap: 0.3rem;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}

.tech-value {
  font-size: 0.88rem;
  font-weight: 600;
  color: #1e293b;
}

/* Secciones organizadas del Modal */
.modal-pro-sections {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.modal-pro-section {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}

.pro-section-title {
  font-size: 0.82rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #475569;
  display: flex;
  align-items: center;
  gap: 0.4rem;
  margin: 0;
  padding-bottom: 0.25rem;
  border-bottom: 1px dashed #e2e8f0;
}

.badge-fase-pro {
  font-size: 0.72rem;
  font-weight: 600;
  color: #0369a1;
  background: #e0f2fe;
  border: 1px solid #bae6fd;
  padding: 0.12rem 0.5rem;
  border-radius: 6px;
  display: inline-flex;
  align-items: center;
}

.modal-proceso-ref {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: 0.74rem;
  font-weight: 700;
  color: #0f172a;
  background: #f8fafc;
  padding: 0.15rem 0.55rem;
  border-radius: 6px;
  border: 1px solid #cbd5e1;
}

/* Tarjeta de Adjudicación */
.modal-adjudicacion-card {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  padding: 0.8rem 1rem;
}

.adjudicacion-status-header {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.adjudicacion-badge {
  font-size: 0.78rem;
  font-weight: 600;
  color: #475569;
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
}

.adjudicacion-badge.adjudicado {
  color: #15803d;
  background: #dcfce7;
  border: 1px solid #86efac;
  padding: 0.2rem 0.6rem;
  border-radius: 6px;
}

.adjudicacion-details {
  margin-top: 0.65rem;
  padding-top: 0.65rem;
  border-top: 1px solid #e2e8f0;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.75rem;
}

@media (max-width: 640px) {
  .adjudicacion-details {
    grid-template-columns: 1fr;
  }
}

.adj-item {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
}

.adj-label {
  font-size: 0.68rem;
  font-weight: 600;
  color: #64748b;
  text-transform: uppercase;
}

.adj-value {
  font-size: 0.85rem;
  color: #0f172a;
}

.text-success {
  color: #166534 !important;
}

/* Trazabilidad Oficial Chips */
.modal-traceability-card {
  background: #f1f5f9;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  padding: 0.85rem 1rem;
}

.trace-title {
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: #475569;
  margin: 0 0 0.5rem;
  display: flex;
  align-items: center;
  gap: 0.35rem;
}

.trace-chips-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
}

.trace-chip {
  background: #ffffff;
  border: 1px solid #cbd5e1;
  border-radius: 6px;
  padding: 0.35rem 0.65rem;
  font-size: 0.74rem;
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
}

.trace-chip-label {
  color: #64748b;
  font-weight: 600;
}

.trace-chip-val {
  color: #0f172a;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-weight: 700;
}

/* Objeto y Descripción */
.modal-description-card {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  padding: 1.05rem 1.2rem;
  margin-bottom: 1.15rem;
}

.desc-card-title {
  font-size: 0.86rem;
  font-weight: 700;
  color: #0f172a;
  margin: 0 0 0.5rem;
  display: flex;
  align-items: center;
  gap: 0.4rem;
}

.desc-card-text {
  font-size: 0.88rem;
  color: #334155;
  line-height: 1.6;
  white-space: pre-line;
  margin: 0;
}

/* Enlace a SECOP */
.modal-official-link-row {
  margin-bottom: 0.5rem;
}

.btn-secop-official {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  font-size: 0.84rem;
  font-weight: 600;
  color: #0067FF;
  background: #eff6ff;
  border: 1px solid #bfdbfe;
  padding: 0.55rem 1rem;
  border-radius: 8px;
  text-decoration: none;
  transition: all 0.2s;
}

.btn-secop-official:hover {
  background: #dbeafe;
  border-color: #93c5fd;
  color: #0052cc;
}

.modal-footer-pro {
  padding: 1rem 1.75rem;
  border-top: 1px solid #f1f5f9;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 0.75rem;
  background: #ffffff;
}

.badge-en-seguimiento {
  background: #ecfdf5 !important;
  color: #059669 !important;
  border: 1px solid #a7f3d0 !important;
  font-weight: 700 !important;
  padding: 0.55rem 1.1rem !important;
  border-radius: 8px !important;
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.85rem !important;
}

.btn-save-seguimiento {
  padding: 0.55rem 1.25rem !important;
  border-radius: 8px !important;
  font-weight: 700 !important;
  font-size: 0.88rem !important;
}

/* ── Toasts de Retroalimentación ──────────────────────────────── */
.dash-toast-container {
  position: fixed;
  bottom: 1.5rem;
  right: 1.5rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  z-index: 9999;
}

.dash-toast {
  background: #0f172a;
  color: #fff;
  padding: 0.75rem 1.1rem;
  border-radius: var(--radius-sm, 8px);
  font-size: 0.85rem;
  font-weight: 600;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.25);
  animation: dashToastIn 0.25s ease;
}

.dash-toast.success { background: #15803d; }
.dash-toast.error { background: #b91c1c; }

@keyframes dashToastIn {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}

/* ── Scheduler de Sincronización Automática (Configuraciones -> Fuentes) ── */
.sync-scheduler-card {
  background: #ffffff;
  border: 1px solid var(--border-light, #e2e8f0);
  border-radius: var(--radius-md, 12px);
  padding: 1.5rem;
  margin-bottom: 1.5rem;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.02);
}

.sync-scheduler-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1rem;
  margin-bottom: 1.25rem;
}

.sync-scheduler-title {
  font-size: 1.05rem;
  font-weight: 800;
  color: var(--text-dark, #0f172a);
  margin: 0 0 0.3rem 0;
}

.sync-scheduler-subtitle {
  font-size: 0.85rem;
  color: var(--text-muted, #64748b);
  margin: 0;
  max-width: 46ch;
}

.badge-status-active,
.badge-status-paused {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  font-size: 0.78rem;
  font-weight: 700;
  padding: 0.35rem 0.75rem;
  border-radius: 999px;
  white-space: nowrap;
}

.badge-status-active {
  background: #dcfce7;
  color: #15803d;
  border: 1px solid #bbf7d0;
}

.badge-status-paused {
  background: #f1f5f9;
  color: #64748b;
  border: 1px solid #e2e8f0;
}

.sync-time-metrics {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
  margin-bottom: 1.5rem;
}

.time-metric-box {
  background: #f8fafc;
  border: 1px solid var(--border-light, #e2e8f0);
  border-radius: var(--radius-sm, 8px);
  padding: 0.9rem 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
}

.time-metric-label {
  font-size: 0.7rem;
  font-weight: 700;
  color: var(--text-muted, #64748b);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.time-metric-val {
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--text-dark, #0f172a);
}

.sync-scheduler-controls {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1.25rem;
}

.control-group {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  min-width: 220px;
}

.control-group label {
  font-size: 0.82rem;
  font-weight: 700;
  color: var(--text-dark, #0f172a);
}

.control-group-toggle {
  display: flex;
  align-items: center;
}

.switch-label {
  display: inline-flex;
  align-items: center;
  gap: 0.65rem;
  cursor: pointer;
  user-select: none;
}

.switch-label input[type="checkbox"] {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}

.switch-slider {
  position: relative;
  display: inline-block;
  width: 42px;
  height: 24px;
  background: #cbd5e1;
  border-radius: 999px;
  transition: background 0.2s;
  flex-shrink: 0;
}

.switch-slider::before {
  content: "";
  position: absolute;
  width: 18px;
  height: 18px;
  left: 3px;
  top: 3px;
  background: #ffffff;
  border-radius: 50%;
  transition: transform 0.2s;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
}

.switch-label input[type="checkbox"]:checked + .switch-slider {
  background: var(--color-primary, #0067FF);
}

.switch-label input[type="checkbox"]:checked + .switch-slider::before {
  transform: translateX(18px);
}

.switch-text {
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--text-dark, #0f172a);
}

.feedback-msg {
  font-size: 0.85rem;
  font-weight: 700;
  color: #15803d;
}

.feedback-msg.error {
  color: #b91c1c;
}

/* ── Auditoría Zero-Trust: fecha/hora e IP ────────────────────── */
#tab-audit .dash-card {
  overflow-x: auto;
}

.audit-detalles-cell {
  max-width: 320px;
  word-break: break-word;
  overflow-wrap: break-word;
  line-height: 1.3;
}

.audit-date {
  font-size: 0.8rem;
  color: #334155;
  font-weight: 600;
}

.ip-badge {
  display: inline-block;
  font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace;
  font-size: 0.8rem;
  font-weight: 600;
  color: #475569;
  background: #f1f5f9;
  border: 1px solid #cbd5e1;
  padding: 0.25rem 0.6rem;
  border-radius: 6px;
  white-space: nowrap;
  letter-spacing: 0.02em;
}

/* ── Diálogo modal personalizado (reemplaza confirm()/alert() nativos) ── */
.custom-dialog-modal {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  margin: 0;
  padding: 0;
  border: none;
  border-radius: 16px;
  background: transparent;
  z-index: 99999;
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
}

.custom-dialog-modal::backdrop {
  background: rgba(15, 23, 42, 0.6);
  backdrop-filter: blur(4px);
}

.custom-dialog-box {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  padding: 28px 24px;
  max-width: 420px;
  width: 90vw;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
}

.custom-dialog-icon-wrapper {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  background: rgba(0, 103, 255, 0.1);
  color: #0067FF;
}

.custom-dialog-icon-wrapper.danger {
  background: rgba(239, 68, 68, 0.1);
  color: #ef4444;
}

.custom-dialog-title {
  font-family: 'Outfit', sans-serif;
  font-size: 1.2rem;
  font-weight: 700;
  color: #0f172a;
  margin: 0 0 8px 0;
}

.custom-dialog-message {
  font-size: 0.92rem;
  color: #475569;
  line-height: 1.5;
  margin: 0;
}

.custom-dialog-actions {
  display: flex;
  gap: 12px;
  width: 100%;
  margin-top: 8px;
}

.btn-dialog-cancel,
.btn-dialog-confirm {
  flex: 1;
  padding: 10px 16px;
  border-radius: 8px;
  font-size: 0.9rem;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s ease;
}

.btn-dialog-cancel {
  background: #f1f5f9;
  border: 1px solid #cbd5e1;
  color: #475569;
}

.btn-dialog-cancel:hover {
  background: #e2e8f0;
}

.btn-dialog-confirm {
  background: #0067FF;
  border: 1px solid #0067FF;
  color: #ffffff;
}

.btn-dialog-confirm:hover {
  background: #0052cc;
}

.btn-dialog-confirm.danger {
  background: #ef4444;
  border-color: #ef4444;
}

.btn-dialog-confirm.danger:hover {
  background: #dc2626;
}

/* ── Consola Ejecutiva (Super-Admin Dashboard) ───────────────── */
.badge-superadmin {
  display: inline-flex;
  align-items: center;
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #b45309;
  background: #fef3c7;
  border: 1px solid #fde68a;
  padding: 0.2rem 0.55rem;
  border-radius: var(--radius-pill, 9999px);
  vertical-align: middle;
  margin-left: 0.5rem;
}

.admin-kpi-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 1.25rem;
  margin-bottom: 1.5rem;
}

.admin-kpi-card {
  background: var(--bg-card, #ffffff);
  border: 1px solid var(--border-light, #e2e8f0);
  border-radius: var(--radius-md, 12px);
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.02);
  padding: 1.25rem;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  transition: all 0.2s;
}

.admin-kpi-card:hover {
  border-color: var(--color-primary, #0067FF);
  box-shadow: 0 6px 14px rgba(0, 103, 255, 0.08);
  transform: translateY(-2px);
}

.admin-kpi-card .kpi-icon {
  font-size: 1.25rem;
}

.admin-kpi-card .kpi-label {
  font-size: 0.78rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--text-muted, #64748b);
}

.admin-kpi-card .kpi-value {
  font-family: 'JetBrains Mono', monospace;
  font-size: 1.85rem;
  font-weight: 700;
  color: var(--text-dark, #0f172a);
  line-height: 1.15;
}

.admin-kpi-card .kpi-breakdown {
  font-size: 0.78rem;
  color: var(--text-muted, #64748b);
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
}

.kpi-breakdown-item {
  font-weight: 600;
}

.kpi-breakdown-item span {
  font-family: 'JetBrains Mono', monospace;
  color: var(--text-dark, #0f172a);
  font-weight: 700;
}

.kpi-breakdown-secondary {
  margin-top: 0.35rem;
  padding-top: 0.35rem;
  border-top: 1px dashed var(--border-light, #e2e8f0);
}

.admin-kpi-card .kpi-breakdown.kpi-breakdown-urgente {
  color: var(--color-alert, #ff6400);
  font-weight: 600;
}

/* Apiladas en una sola columna a lo ancho completo: estos widgets tienen
   contenido de altura muy dispar (la Distribución por Planes son 3 líneas,
   el Radar de Mercado son 2 subsecciones con listas dinámicas) — un grid de
   varias columnas obliga a todos los items de una misma fila a compartir la
   altura de la card más alta, dejando un hueco visible bajo las más cortas
   incluso sin `stretch`. Apilar verticalmente hace que cada card ocupe
   exactamente su propio contenido y la siguiente empiece justo debajo. */
.admin-secondary-grid {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.admin-widget {
  margin-bottom: 0;
}

.plan-dist-row {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  margin-bottom: 0.85rem;
}

.plan-dist-row:last-child {
  margin-bottom: 0;
}

.plan-dist-label {
  display: flex;
  justify-content: space-between;
  font-size: 0.82rem;
  color: var(--text-dark, #0f172a);
}

.plan-dist-label .plan-dist-count {
  font-family: 'JetBrains Mono', monospace;
  font-weight: 700;
  color: var(--text-muted, #64748b);
}

/* Mismos colores que `.plan-badge` (Gestión de Clientes) para que un plan
   se identifique por color de forma consistente en toda la plataforma. */
.progress-fill.plan-fill-free { background: #0369a1; }
.progress-fill.plan-fill-pro { background: #15803d; }
.progress-fill.plan-fill-enterprise { background: #b45309; }

.admin-widget-roi .roi-highlight {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 0.3rem;
  padding: 0.75rem 0.5rem 1.25rem;
  border-bottom: 1px solid var(--border-light, #e2e8f0);
  margin-bottom: 1rem;
}

.roi-highlight-value {
  font-family: 'JetBrains Mono', monospace;
  font-size: 2rem;
  font-weight: 800;
  color: #15803d;
  line-height: 1;
}

.roi-highlight-label {
  font-size: 0.78rem;
  color: var(--text-muted, #64748b);
  max-width: 26rem;
}

.pipeline-funnel {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.75rem;
}

.pipeline-funnel-stage {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 0.2rem;
  background: #f8fafc;
  border: 1px solid var(--border-light, #e2e8f0);
  border-radius: var(--radius-md, 12px);
  padding: 0.85rem 0.5rem;
  transition: transform 0.2s, box-shadow 0.2s;
}

.pipeline-funnel-stage:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.08);
}

.pipeline-funnel-icon {
  font-size: 1.1rem;
}

.pipeline-funnel-value {
  font-family: 'JetBrains Mono', monospace;
  font-size: 1.5rem;
  font-weight: 800;
  color: var(--text-dark, #0f172a);
  line-height: 1.2;
}

.pipeline-funnel-label {
  font-size: 0.75rem;
  color: var(--text-muted, #64748b);
  font-weight: 600;
}

.pipeline-funnel-stage-success {
  background: #f0fdf4;
  border-color: #bbf7d0;
}

.pipeline-funnel-stage-success .pipeline-funnel-value {
  color: #15803d;
}

/* ── Radar de Mercado y Contratación Pública ────────────────────── */
.radar-subblock {
  margin-bottom: 1.25rem;
}

.radar-subblock:last-child {
  margin-bottom: 0;
}

.radar-subblock h4 {
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: var(--text-muted, #64748b);
  margin: 0 0 0.65rem;
}

.fuentes-dist-row {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  margin-bottom: 0.7rem;
}

.fuentes-dist-row:last-child {
  margin-bottom: 0;
}

.fuentes-dist-label {
  display: flex;
  justify-content: space-between;
  font-size: 0.8rem;
  color: var(--text-dark, #0f172a);
}

.fuentes-dist-label .fuentes-dist-pct {
  font-family: 'JetBrains Mono', monospace;
  font-weight: 700;
  color: var(--text-muted, #64748b);
}

.fuentes-dist-bar {
  background: #e2e8f0;
  height: 6px;
  border-radius: 3px;
  overflow: hidden;
}

.fuentes-dist-fill {
  height: 100%;
  border-radius: 3px;
  background: var(--color-primary, #0067FF); /* SECOP II: fuente predominante */
}

.fuentes-dist-fill.secop_i { background: #0ea5e9; }
.fuentes-dist-fill.banco_mundial { background: #8b5cf6; }

.top-departamento-row {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  padding: 0.5rem 0.1rem;
  border-bottom: 1px solid var(--border-light, #f1f5f9);
}

.top-departamento-row:last-child {
  border-bottom: none;
}

.top-departamento-rank {
  width: 1.6rem;
  height: 1.6rem;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: #f1f5f9;
  font-size: 0.72rem;
  font-weight: 800;
  color: var(--text-muted, #64748b);
}

.top-departamento-rank.top-1 {
  background: #fef3c7;
  color: #b45309;
}

.top-departamento-info {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.05rem;
}

.top-departamento-nombre {
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--text-dark, #0f172a);
}

.top-departamento-count {
  font-size: 0.72rem;
  color: var(--text-muted, #64748b);
}

.top-departamento-monto {
  font-family: 'JetBrains Mono', monospace;
  font-weight: 700;
  font-size: 0.82rem;
  color: var(--text-dark, #0f172a);
  white-space: nowrap;
  flex-shrink: 0;
}

/* ── Encabezado de widget con badge de total (ej. "Distribución por Planes") ── */
.admin-widget-header-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 0.4rem 0.75rem;
  margin-bottom: 0.85rem;
}

.admin-widget-header-row h3 {
  margin-bottom: 0;
  flex: 1 1 auto;
  min-width: 0;
}

.admin-widget-header-total {
  font-size: 0.72rem;
  font-weight: 700;
  color: var(--text-muted, #64748b);
  background: #f1f5f9;
  border-radius: 999px;
  padding: 0.2rem 0.65rem;
  white-space: nowrap;
  flex-shrink: 0;
  margin-left: auto;
}

/* ── Estado vacío unificado para widgets sin datos (evita 2-3 mensajes
   sueltos y desalineados dentro de la misma tarjeta) ────────────── */
.admin-empty-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 0.4rem;
  padding: 1.75rem 1rem;
  color: var(--text-dim, #94a3b8);
}

.admin-empty-state [data-lucide] {
  width: 28px;
  height: 28px;
  stroke-width: 1.5;
  color: var(--text-dim, #cbd5e1);
  margin-bottom: 0.25rem;
}

.admin-empty-state-title {
  font-size: 0.88rem;
  font-weight: 700;
  color: var(--text-muted, #64748b);
}

.admin-empty-state-hint {
  font-size: 0.8rem;
  max-width: 32rem;
  line-height: 1.45;
}

/* Variante compacta: usada como aviso puntual DENTRO de un widget que ya
   muestra su resumen numérico (p. ej. Inteligencia de Demanda), no como
   reemplazo de toda la card. */
.admin-empty-state-inline {
  flex-direction: row;
  justify-content: flex-start;
  text-align: left;
  padding: 0.6rem 0.75rem;
  gap: 0.5rem;
}

.admin-empty-state-inline [data-lucide] {
  width: 18px;
  height: 18px;
  margin-bottom: 0;
  flex-shrink: 0;
}

.admin-empty-state-inline .admin-empty-state-title {
  font-size: 0.8rem;
  font-weight: 600;
}

/* ── Inteligencia de Demanda: Qué Buscan los Clientes ───────────── */

.demanda-summary {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1.25rem;
  padding-bottom: 1rem;
  margin-bottom: 1rem;
  border-bottom: 1px solid var(--border-light, #e2e8f0);
}

.demanda-summary-item {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
}

.demanda-summary-value {
  font-family: 'JetBrains Mono', monospace;
  font-size: 1.6rem;
  font-weight: 800;
  color: var(--text-dark, #0f172a);
  line-height: 1;
}

.demanda-summary-label {
  font-size: 0.75rem;
  color: var(--text-muted, #64748b);
}

.demanda-canales-text {
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--text-dark, #0f172a);
}

.demanda-keywords-cloud {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
}

.demanda-keyword-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  background: rgba(0, 103, 255, 0.08);
  border-radius: var(--radius-xl, 24px);
  padding: 0.35rem 0.55rem 0.35rem 0.85rem;
  transition: transform 0.15s, background 0.15s;
}

.demanda-keyword-pill:hover {
  background: rgba(0, 103, 255, 0.15);
  transform: translateY(-1px);
}

.demanda-keyword-text {
  font-family: 'Outfit', sans-serif;
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--color-primary, #0067FF);
  text-transform: capitalize;
}

.demanda-keyword-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.35rem;
  height: 1.35rem;
  padding: 0 0.3rem;
  border-radius: 50%;
  background: var(--color-primary, #0067FF);
  color: #fff;
  font-size: 0.7rem;
  font-weight: 800;
}

/* ── Eficiencia de IA y Salud de Ingesta Automática ─────────────── */

.ia-subblock {
  margin-bottom: 1.25rem;
  padding-bottom: 1.25rem;
  border-bottom: 1px solid var(--border-light, #e2e8f0);
}

.ia-subblock:last-child {
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: none;
}

.ia-subblock h4 {
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: var(--text-muted, #64748b);
  margin: 0 0 0.65rem;
}

.ia-dedup-row {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  flex-wrap: wrap;
}

.ia-dedup-value {
  font-family: 'JetBrains Mono', monospace;
  font-size: 1.7rem;
  font-weight: 800;
  color: var(--text-dark, #0f172a);
}

.ia-dedup-badge {
  font-size: 0.75rem;
  font-weight: 700;
  background: #dcfce7;
  color: #15803d;
  padding: 0.25rem 0.6rem;
  border-radius: var(--radius-xl, 24px);
}

.scheduler-status-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.85rem;
  font-weight: 700;
  color: var(--text-dark, #0f172a);
  margin-bottom: 0.65rem;
}

.pulse-dot-green,
.pulse-dot-red {
  width: 0.55rem;
  height: 0.55rem;
  border-radius: 50%;
  background: #22c55e;
  position: relative;
  flex-shrink: 0;
}

.pulse-dot-green::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: #22c55e;
  animation: pulse-dot-ring 1.8s ease-out infinite;
}

.pulse-dot-red {
  background: #ef4444;
}

@keyframes pulse-dot-ring {
  0% { transform: scale(1); opacity: 0.6; }
  100% { transform: scale(2.4); opacity: 0; }
}

.ia-scheduler-times {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  margin-bottom: 0.75rem;
}

.ia-mono-text {
  font-family: 'JetBrains Mono', monospace;
  font-size: 0.8rem;
  color: var(--text-muted, #64748b);
}

.ia-conectores-list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.ia-conector-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.78rem;
  font-weight: 600;
  background: #f8fafc;
  border: 1px solid var(--border-light, #e2e8f0);
  border-radius: var(--radius-sm, 8px);
  padding: 0.3rem 0.6rem;
}

.ia-conector-chip.ok { color: #15803d; }
.ia-conector-chip.fail { color: #b91c1c; }

.ia-vectores-row {
  display: flex;
  align-items: baseline;
  gap: 0.6rem;
}

.ia-vectores-value {
  font-family: 'JetBrains Mono', monospace;
  font-size: 1.4rem;
  font-weight: 800;
  color: var(--color-primary, #0067FF);
}

.ia-vectores-label {
  font-size: 0.78rem;
  color: var(--text-muted, #64748b);
}

@media (prefers-reduced-motion: reduce) {
  .pulse-dot-green::after {
    animation: none;
  }
}

/* ── Consola Ejecutiva: Patrones Horarios de Publicación ─────────── */

.admin-widget-horarios-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
  margin-bottom: 1.1rem;
}

.admin-widget-subtitle {
  font-size: 0.82rem;
  color: var(--text-muted, #64748b);
  margin-top: 0.25rem;
  max-width: 48ch;
}

.horarios-controls {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex-wrap: wrap;
}

.horarios-controls .explorar-filter-select {
  min-width: 190px;
  border: 1px solid var(--border-light, #e2e8f0);
  border-radius: var(--radius-sm, 8px);
  padding: 0.5rem 0.75rem;
  background: #fff;
}

.horarios-intervalo-pills {
  display: inline-flex;
  gap: 0.4rem;
}

.horarios-pill-btn {
  background: transparent;
  border: 1px solid var(--border-light, #e2e8f0);
  border-radius: var(--radius-pill, 9999px);
  padding: 0.45rem 0.9rem;
  font-family: inherit;
  font-size: 0.8rem;
  font-weight: 700;
  color: var(--text-muted, #64748b);
  cursor: pointer;
  transition: var(--transition-smooth, all 0.2s ease);
}

.horarios-pill-btn:hover {
  border-color: var(--color-primary, #0067FF);
  color: var(--color-primary, #0067FF);
}

.horarios-pill-btn.active {
  background: var(--color-primary, #0067FF);
  border-color: var(--color-primary, #0067FF);
  color: #fff;
}

.horarios-recomendacion-box {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  background: #eff6ff;
  border: 1px solid #bfdbfe;
  border-radius: var(--radius-md, 12px);
  padding: 0.85rem 1.1rem;
  margin-bottom: 1.25rem;
}

.horarios-recomendacion-icon {
  font-size: 1.25rem;
  flex-shrink: 0;
  line-height: 1.4;
}

.horarios-recomendacion-box p {
  margin: 0;
  font-size: 0.85rem;
  line-height: 1.5;
  color: #1e3a8a;
}

.horarios-table-wrap {
  overflow-x: auto;
}

.horarios-table th:nth-child(3),
.horarios-table th:nth-child(4),
.horarios-table td:nth-child(3),
.horarios-table td:nth-child(4) {
  text-align: right;
  font-family: 'JetBrains Mono', monospace;
}

.horarios-rank {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.9rem;
  height: 1.9rem;
  border-radius: 50%;
  background: #f1f5f9;
  color: var(--text-muted, #64748b);
  font-weight: 800;
  font-size: 0.85rem;
}

.horarios-rank.top-1 {
  background: linear-gradient(135deg, #f59e0b, #f97316);
  color: #fff;
}

.horarios-franja-cell {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
}

.horarios-pico-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  font-size: 0.7rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  background: linear-gradient(135deg, #f59e0b, #f97316);
  color: #fff;
  padding: 0.2rem 0.55rem;
  border-radius: var(--radius-xl, 24px);
}

.horarios-intensidad-track {
  width: 100%;
  min-width: 90px;
  height: 0.5rem;
  background: #eef2f7;
  border-radius: var(--radius-pill, 9999px);
  overflow: hidden;
}

.horarios-intensidad-fill {
  height: 100%;
  border-radius: var(--radius-pill, 9999px);
  background: var(--color-primary, #0067FF);
  transition: width 0.3s ease;
}

.horarios-intensidad-fill.top-1 {
  background: linear-gradient(90deg, #f59e0b, #f97316);
}

@media (max-width: 640px) {
  .admin-widget-horarios-header {
    flex-direction: column;
    align-items: stretch;
  }
  .horarios-controls {
    flex-direction: column;
    align-items: stretch;
  }
  .horarios-controls .explorar-filter-select {
    width: 100%;
  }
  .horarios-intervalo-pills {
    justify-content: stretch;
  }
  .horarios-intervalo-pills .horarios-pill-btn {
    flex: 1;
    text-align: center;
  }
}

.quick-access-list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.6rem;
}

@media (max-width: 720px) {
  .quick-access-list {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 480px) {
  .quick-access-list {
    grid-template-columns: 1fr;
  }
}

.quick-access-btn {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  width: 100%;
  background: #f8fafc;
  border: 1px solid var(--border-light, #e2e8f0);
  border-radius: var(--radius-md, 12px);
  padding: 0.65rem 0.85rem;
  font-family: inherit;
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--text-dark, #0f172a);
  cursor: pointer;
  transition: all 0.2s;
  text-align: left;
}

.quick-access-btn:hover {
  border-color: var(--color-primary, #0067FF);
  background: #eff6ff;
  color: var(--color-primary, #0067FF);
  transform: translateX(2px);
}

/* ── Gestión de Clientes (Super-Admin) ───────────────────────── */
#tab-admin-clients .dash-card {
  overflow-x: auto;
}

.admin-client-org-cell {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}

.tipo-persona-tag {
  display: inline-block;
  width: fit-content;
  font-size: 0.68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: var(--text-muted, #64748b);
  background: #f1f5f9;
  padding: 0.1rem 0.4rem;
  border-radius: var(--radius-sm, 8px);
}

.modality-badge {
  font-size: 0.75rem;
  font-weight: 700;
  padding: 0.2rem 0.55rem;
  border-radius: var(--radius-xl, 24px);
  white-space: nowrap;
}

.modality-badge.cortesia { background: #ede9fe; color: #5b21b6; }
.modality-badge.pago { background: #dcfce7; color: #15803d; }

.account-status-badge {
  font-size: 0.75rem;
  font-weight: 700;
  padding: 0.2rem 0.55rem;
  border-radius: var(--radius-xl, 24px);
  white-space: nowrap;
}

.account-status-badge.activo { background: #dbeafe; color: #1e40af; }
.account-status-badge.suspendido { background: #fee2e2; color: #b91c1c; }

.admin-client-quota {
  font-family: 'JetBrains Mono', monospace;
  font-size: 0.85rem;
  color: var(--text-dark, #0f172a);
}

.admin-client-actions {
  display: flex;
  gap: 0.5rem;
}

.btn-icon-action {
  width: 2rem;
  height: 2rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  border: 1px solid var(--border-light, #e2e8f0);
  border-radius: var(--radius-sm, 8px);
  font-size: 0.9rem;
  cursor: pointer;
  transition: all 0.2s;
  flex-shrink: 0;
}

.btn-icon-action:hover {
  border-color: var(--color-primary, #0067FF);
  background: #eff6ff;
}

.btn-icon-action.suspender:hover {
  border-color: #ef4444;
  background: #fef2f2;
}

.admin-client-edit-nombre {
  font-size: 1rem;
  font-weight: 800;
  color: var(--text-dark, #0f172a);
  margin-right: 0.6rem;
}

.type-toggle-group {
  display: flex;
  gap: 0.5rem;
  background: #f1f5f9;
  padding: 0.35rem;
  border-radius: var(--radius-md, 12px);
  margin-bottom: 1.25rem;
}

.type-toggle-btn {
  flex: 1;
  background: transparent;
  border: none;
  border-radius: var(--radius-sm, 8px);
  padding: 0.55rem 1rem;
  font-family: inherit;
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--text-muted, #64748b);
  cursor: pointer;
  transition: all 0.2s;
}

.type-toggle-btn:hover {
  color: var(--color-primary, #0067FF);
}

.type-toggle-btn.active {
  background: #ffffff;
  color: var(--color-primary, #0067FF);
  font-weight: 700;
  box-shadow: 0 2px 6px rgba(15, 23, 42, 0.08);
}

.admin-client-type-fields {
  margin-bottom: 1rem;
}

.admin-client-quota-clickable {
  cursor: pointer;
  border-bottom: 1px dashed var(--border-light, #cbd5e1);
}

.admin-client-quota-clickable:hover {
  color: var(--color-primary, #0067FF);
  border-bottom-color: var(--color-primary, #0067FF);
}

/* ── Modal de Inspección de Equipo y Colaboradores ──────────────── */
.tenant-members-header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.6rem 1rem;
  padding-bottom: 1rem;
  margin-bottom: 1.1rem;
  border-bottom: 1px solid var(--border-light, #e2e8f0);
}

.tenant-members-org {
  display: flex;
  align-items: center;
  gap: 0.55rem;
}

.tenant-members-org h4 {
  font-size: 1.05rem;
  font-weight: 800;
  color: var(--text-dark, #0f172a);
  margin: 0;
}

.tenant-members-doc {
  font-size: 0.82rem;
  color: var(--text-muted, #64748b);
}

.tenant-members-badges {
  display: flex;
  gap: 0.4rem;
  margin-left: auto;
}

.tenant-quota-meter {
  background: #f8fafc;
  border: 1px solid var(--border-light, #e2e8f0);
  border-radius: var(--radius-md, 12px);
  padding: 0.9rem 1rem;
  margin-bottom: 1.1rem;
}

.tenant-quota-meter-label {
  display: flex;
  justify-content: space-between;
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--text-dark, #0f172a);
  margin-bottom: 0.4rem;
}

.tenant-quota-bar {
  background: #e2e8f0;
  height: 8px;
  border-radius: 4px;
  overflow: hidden;
}

.tenant-quota-fill {
  height: 100%;
  border-radius: 4px;
  transition: width 0.3s ease, background 0.3s ease;
  background: #16a34a; /* holgado */
}

.tenant-quota-fill.warning { background: #f59e0b; }
.tenant-quota-fill.danger { background: #dc2626; }

.tenant-quota-meter-hint {
  font-size: 0.75rem;
  color: var(--text-muted, #64748b);
  margin: 0.5rem 0 0;
}

.tenant-owner-card {
  background: linear-gradient(135deg, #fffbeb 0%, #fefce8 100%);
  border: 1px solid #fde68a;
  border-left: 4px solid #d4a017;
  border-radius: var(--radius-md, 12px);
  padding: 0.9rem 1.1rem;
  margin-bottom: 1.25rem;
}

.tenant-owner-tag {
  display: inline-block;
  font-size: 0.7rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: #92400e;
  margin-bottom: 0.35rem;
}

.tenant-owner-name {
  font-size: 1rem;
  font-weight: 800;
  color: var(--text-dark, #0f172a);
  margin-bottom: 0.3rem;
}

.tenant-owner-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.3rem 1rem;
  font-size: 0.82rem;
  color: var(--text-muted, #64748b);
}

.tenant-collaborators-section {
  margin-bottom: 1.1rem;
}

.tenant-collaborators-section h4 {
  font-size: 0.85rem;
  font-weight: 700;
  color: var(--text-dark, #0f172a);
  margin: 0 0 0.6rem;
}

.tenant-collaborators-empty {
  font-size: 0.85rem;
  color: var(--text-muted, #64748b);
  background: #f8fafc;
  border: 1px dashed var(--border-light, #cbd5e1);
  border-radius: var(--radius-md, 12px);
  padding: 0.9rem 1rem;
  text-align: center;
  margin: 0;
}

.tenant-collaborator-row {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.65rem 0.2rem;
  border-bottom: 1px solid var(--border-light, #f1f5f9);
}

.tenant-collaborator-row:last-child {
  border-bottom: none;
}

.tenant-collaborator-info {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
}

.tenant-collaborator-info strong {
  font-size: 0.88rem;
  color: var(--text-dark, #0f172a);
}

.tenant-collaborator-info small {
  font-size: 0.75rem;
  color: var(--text-muted, #64748b);
}

.tenant-collaborator-rol-tag {
  font-size: 0.68rem;
  font-weight: 700;
  text-transform: uppercase;
  color: var(--text-muted, #64748b);
  background: #f1f5f9;
  padding: 0.15rem 0.45rem;
  border-radius: var(--radius-sm, 8px);
  flex-shrink: 0;
}

.quota-limit-banner {
  display: flex;
  align-items: flex-start;
  gap: 0.6rem;
  background: #fef2f2;
  border: 1px solid #fecaca;
  border-radius: var(--radius-md, 12px);
  padding: 0.85rem 1rem;
  font-size: 0.85rem;
  color: #b91c1c;
  line-height: 1.45;
}

.tenant-add-collaborator-form {
  display: flex;
  gap: 0.6rem;
}

.tenant-add-collaborator-form .dash-input {
  flex: 1;
}

@media (max-width: 1024px) {
  .admin-kpi-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 640px) {
  .admin-kpi-grid {
    grid-template-columns: 1fr;
  }
}

/* ═══════════════════════════════════════════════════════════════
   Iconografía Vectorial (Lucide Icons)
   Reemplaza los emojis Unicode en sidebar, botones, tarjetas y
   tablas. Los iconos heredan `currentColor` para adoptar el color
   de texto del elemento padre y transicionan suavemente en hover.
   ═══════════════════════════════════════════════════════════════ */

[data-lucide] {
  stroke: currentColor;
  transition: color 0.15s ease, stroke 0.15s ease;
  vertical-align: middle;
  flex-shrink: 0;
}

/* Sidebar: navegación principal y sección de super-admin */
.nav-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.nav-icon [data-lucide] {
  width: 18px;
  height: 18px;
  stroke-width: 1.75;
}
.nav-item {
  color: #64748b;
}
.nav-item:hover,
.nav-item.active {
  color: var(--color-primary, #0067FF);
}

/* Metadatos discretos en tarjetas (entidad, ubicación, fecha) */
.card-meta [data-lucide],
.explorer-card-meta [data-lucide] {
  width: 14px;
  height: 14px;
  stroke-width: 1.75;
  color: #94a3b8;
  margin-right: 2px;
}
.card-meta > div,
.explorer-card-meta > div {
  display: flex;
  align-items: center;
  gap: 0.35rem;
}

/* Botones primarios/secundarios y acciones de tabla */
.btn-primary-action,
.btn-secondary-sm,
.btn-danger-sm,
.btn-action,
.btn-outline-sm,
.btn-upgrade-sm,
.quick-access-btn,
.type-toggle-btn,
.config-subtab-btn,
.legal-subtab-btn,
.admin-users-subtab-btn,
.subtab-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.btn-primary-action [data-lucide],
.btn-secondary-sm [data-lucide],
.btn-danger-sm [data-lucide],
.btn-action [data-lucide],
.btn-outline-sm [data-lucide],
.btn-upgrade-sm [data-lucide],
.quick-access-btn .nav-icon [data-lucide],
.type-toggle-btn [data-lucide],
.config-subtab-btn [data-lucide],
.legal-subtab-btn [data-lucide],
.admin-users-subtab-btn [data-lucide],
.subtab-btn [data-lucide] {
  width: 16px;
  height: 16px;
  stroke-width: 1.75;
}

/* Iconos de acción compactos en filas de tabla (editar/eliminar/etc.) */
.btn-icon-action [data-lucide] {
  width: 16px;
  height: 16px;
  stroke-width: 1.9;
}

/* Icono junto a la etiqueta "Workspace:" en el header superior */
.label-icon {
  width: 15px;
  height: 15px;
  stroke-width: 1.75;
  margin-right: 4px;
  color: #94a3b8;
}

/* Puntos de estado tipo semáforo (activo/inactivo/favorable/riesgoso) */
.status-dot {
  display: inline-block;
  width: 0.55rem;
  height: 0.55rem;
  border-radius: 50%;
  vertical-align: middle;
  flex-shrink: 0;
}
.status-dot-green { background: #22c55e; }
.status-dot-yellow { background: #eab308; }
.status-dot-red { background: #ef4444; }

/* Icono giratorio para estados de carga (ej. "Actualizando...") */
.icon-spin {
  animation: icon-spin-rotate 0.9s linear infinite;
}
@keyframes icon-spin-rotate {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

/* ═══════════════════════════════════════════════════════════════
   Paces Minimal Hero Banner & Spacious KPI Cards
   ═══════════════════════════════════════════════════════════════ */

.paces-panel-header {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  margin-top: 0 !important;
  margin-bottom: 1.25rem !important;
  gap: 1rem !important;
  background: #e9eaf0 !important;
  border-radius: 8px !important;
  padding: 0.85rem 1.35rem !important;
  min-height: 48px !important;
  box-sizing: border-box !important;
}

.paces-page-header-left {
  display: flex;
  align-items: center;
}

.paces-page-title {
  font-size: 0.95rem !important;
  font-weight: 700 !important;
  color: #1e293b !important;
  margin: 0 !important;
  letter-spacing: -0.01em;
  line-height: 1.2;
}

.paces-page-header-right {
  display: flex;
  align-items: center;
  gap: 1rem;
}

.paces-breadcrumb {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.8125rem;
  color: #64748b;
  font-weight: 500;
}

.paces-breadcrumb i,
.paces-breadcrumb svg {
  width: 12px;
  height: 12px;
  stroke-width: 2;
  color: #94a3b8;
}

.paces-breadcrumb .active {
  color: #8795ab !important;
  font-weight: 500 !important;
}

.paces-btn-refresh {
  display: none !important;
}

/* ── Paces Minimal Hero Grid: Espacioso y Proporcionado ── */
.paces-hero-grid {
  display: grid;
  grid-template-columns: 1.35fr 1fr 1.15fr 1.15fr;
  gap: 1.25rem;
  margin-bottom: 1.5rem;
  align-items: stretch;
}

@media (max-width: 1120px) {
  .paces-hero-grid {
    grid-template-columns: 1.25fr 1fr;
    gap: 1.25rem;
  }
}

@media (max-width: 640px) {
  .paces-hero-grid {
    grid-template-columns: 1fr;
  }
}

/* ── 1. Welcome Banner Hero Card (Organizada, Moderna y Ejecutiva) ── */
.paces-welcome-card {
  background: linear-gradient(135deg, #ffffff 0%, #f7f9fe 55%, #eff4ff 100%) !important;
  border: 1px solid rgba(226, 232, 240, 0.95) !important;
  border-radius: 16px !important;
  padding: 1.5rem 1.75rem !important;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  position: relative;
  overflow: hidden;
  box-shadow: 0 4px 20px -2px rgba(67, 97, 238, 0.06), 0 2px 6px -1px rgba(0, 0, 0, 0.03) !important;
  margin-bottom: 0;
  min-height: 224px;
  transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}

.paces-welcome-card:hover {
  box-shadow: 0 10px 30px -4px rgba(67, 97, 238, 0.12), 0 4px 10px -2px rgba(0, 0, 0, 0.04) !important;
  border-color: rgba(199, 210, 254, 0.8) !important;
}

.paces-welcome-card::before {
  content: '';
  position: absolute;
  bottom: -40px;
  left: -20px;
  width: 140px;
  height: 140px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(16, 185, 129, 0.08) 0%, rgba(255, 255, 255, 0) 70%);
  pointer-events: none;
}

.paces-welcome-card::after {
  content: '';
  position: absolute;
  top: -25%;
  right: -8%;
  width: 260px;
  height: 260px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(79, 70, 229, 0.1) 0%, rgba(255, 255, 255, 0) 70%);
  pointer-events: none;
}

.paces-welcome-body {
  flex: 1;
  min-width: 0;
  z-index: 2;
  display: flex;
  flex-direction: column;
}

.paces-welcome-header-tag {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin-bottom: 0.45rem;
}

.paces-welcome-live-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #10b981;
  box-shadow: 0 0 0 3px rgba(16, 185, 129, 0.25);
  display: inline-block;
  flex-shrink: 0;
  animation: paces-pulse-dot 2s infinite ease-in-out;
}

@keyframes paces-pulse-dot {
  0%, 100% { transform: scale(1); opacity: 1; box-shadow: 0 0 0 3px rgba(16, 185, 129, 0.25); }
  50% { transform: scale(1.18); opacity: 0.9; box-shadow: 0 0 0 5px rgba(16, 185, 129, 0.12); }
}

.paces-welcome-greeting {
  font-size: 0.74rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.085em;
  color: #3730a3;
  display: inline-block;
}

.paces-welcome-user {
  font-size: 1.65rem;
  font-weight: 800;
  color: #0f172a;
  margin: 0 0 0.25rem 0;
  letter-spacing: -0.03em;
  line-height: 1.22;
  font-family: 'Outfit', -apple-system, BlinkMacSystemFont, sans-serif;
}

.paces-welcome-role {
  font-size: 0.84rem;
  font-weight: 500;
  color: #475569;
  margin: 0 0 1.05rem 0;
  line-height: 1.35;
}

.paces-welcome-meta-stack {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.65rem;
}

.paces-meta-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.38rem 0.8rem;
  border-radius: 9999px;
  background: rgba(255, 255, 255, 0.85);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border: 1px solid #e2e8f0;
  font-size: 0.78rem;
  font-weight: 600;
  color: #334155;
  white-space: nowrap;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03);
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
}

.paces-meta-pill:hover {
  background: #ffffff;
  border-color: #cbd5e1;
  box-shadow: 0 3px 8px -1px rgba(0, 0, 0, 0.06);
  transform: translateY(-1px);
}

.paces-meta-pill i,
.paces-meta-pill svg {
  width: 14.5px;
  height: 14.5px;
  color: #4f46e5;
  stroke-width: 2;
  flex-shrink: 0;
}

.paces-meta-time {
  border-color: rgba(99, 102, 241, 0.2);
  background: rgba(248, 250, 255, 0.95);
}

.paces-live-clock {
  font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-variant-numeric: tabular-nums;
  font-feature-settings: 'tnum';
  letter-spacing: -0.02em;
  font-weight: 600;
  color: #1e293b;
  display: inline-flex;
  align-items: center;
}

.paces-clock-sec-badge {
  font-weight: 700;
  color: #2563eb;
  display: inline-block;
  min-width: 22px;
  font-variant-numeric: tabular-nums;
  margin-right: 2px;
}

.paces-clock-ampm {
  font-size: 0.72rem;
  font-weight: 700;
  color: #64748b;
  text-transform: uppercase;
}

.paces-welcome-illustration {
  flex-shrink: 0;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  perspective: 600px;
}

.paces-hero-svg {
  width: 125px;
  height: 110px;
  filter: drop-shadow(0 8px 20px rgba(59, 130, 246, 0.12));
  transition: transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.paces-welcome-card:hover .paces-hero-svg {
  transform: translateY(-4px) scale(1.03);
}

/* Micro-animaciones para el SVG */
.paces-anim-device {
  transform-origin: center;
  animation: paces-device-float 4s ease-in-out infinite;
}

.paces-anim-float-l {
  transform-origin: center;
  animation: paces-avatar-l 3.5s ease-in-out infinite;
}

.paces-anim-float-r {
  transform-origin: center;
  animation: paces-avatar-r 3.8s ease-in-out infinite;
}

@keyframes paces-device-float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-3px); }
}

@keyframes paces-avatar-l {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-4px); }
}

@keyframes paces-avatar-r {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(4px); }
}

/* ── 2. Columna de 2 Métricas en Fila 1 (Grandes y Legibles) ── */
.paces-metrics-column {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  justify-content: space-between;
}

.paces-stat-card {
  background: #ffffff !important;
  border: none !important;
  border-radius: 10px !important;
  padding: 1.1rem 1.35rem !important;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  margin-bottom: 0;
  box-shadow: none !important;
  transition: transform 0.18s ease, box-shadow 0.18s ease;
  flex: 1;
  min-height: 110px;
}

.paces-stat-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 12px 0 rgba(0, 0, 0, 0.04) !important;
}

.paces-stat-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 0.35rem;
}

.paces-stat-title {
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #64748b;
}

.paces-stat-icon-wrap {
  width: 36px;
  height: 36px;
  border-radius: 9px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.paces-stat-icon-wrap i,
.paces-stat-icon-wrap svg {
  width: 17px;
  height: 17px;
  stroke-width: 1.8;
}

.paces-stat-icon-wrap.icon-blue { background: rgba(69, 87, 163, 0.12); color: #4557a3; }
.paces-stat-icon-wrap.icon-emerald { background: rgba(138, 190, 159, 0.20); color: #2e6945; }
.paces-stat-icon-wrap.icon-indigo { background: rgba(69, 87, 163, 0.12); color: #4557a3; }
.paces-stat-icon-wrap.icon-purple { background: rgba(107, 63, 105, 0.14); color: #6B3F69; }

.paces-stat-value {
  font-family: 'Outfit', -apple-system, sans-serif;
  font-size: 1.75rem;
  font-weight: 800;
  color: #1e293b;
  line-height: 1.1;
  margin-bottom: 0.35rem;
  letter-spacing: -0.02em;
}

.paces-stat-footer {
  display: flex;
  align-items: center;
  gap: 0.55rem;
}

.paces-trend-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  font-size: 0.72rem;
  font-weight: 700;
  padding: 0.15rem 0.5rem;
  border-radius: var(--radius-pill, 9999px);
}

.paces-trend-badge.trend-up {
  background: rgba(138, 190, 159, 0.20);
  color: #2e6945;
}

.paces-trend-badge.trend-neutral {
  background: #f1f5f9;
  color: #475569;
}

.paces-trend-badge i,
.paces-trend-badge svg {
  width: 12px;
  height: 12px;
  stroke-width: 2.2;
}

.paces-stat-caption {
  font-size: 0.75rem;
  color: #94a3b8;
}

/* ── 3. Donut Card ("Store Performance Analytics" Style) ── */
.paces-donut-card {
  background: #ffffff !important;
  border: none !important;
  border-radius: 10px !important;
  padding: 1.35rem 1.6rem !important;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  margin-bottom: 0;
  box-shadow: none !important;
  min-height: 240px;
}

.paces-card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  /* La acción de la cabecera baja de línea si no cabe junto al título,
     en cualquier ancho (en escritorio también desbordaba la tarjeta). */
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-bottom: 0.85rem;
}

.paces-card-title {
  font-size: 0.98rem;
  font-weight: 700;
  color: #1e293b;
  margin: 0;
}

.paces-btn-refresh-sm {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
  padding: 0.3rem 0.6rem;
  font-size: 0.8rem;
  color: #64748b;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: all 0.15s ease;
}

.paces-btn-refresh-sm:hover {
  background: rgba(69, 87, 163, 0.08);
  color: #4557a3;
  border-color: #dce0e3;
}

.paces-btn-refresh-sm i,
.paces-btn-refresh-sm svg {
  width: 14px;
  height: 14px;
}

.paces-donut-wrap {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.65rem 0;
}

.paces-donut-svg {
  width: 155px;
  height: 155px;
  transform: rotate(-90deg);
}

.paces-donut-center {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  max-width: 95px;
  text-align: center;
  pointer-events: none;
}

.donut-center-label {
  font-size: 0.68rem;
  font-weight: 700;
  color: #94a3b8;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-bottom: 2px;
}

.donut-center-value {
  font-size: 1.15rem;
  font-weight: 800;
  color: #1e293b;
  line-height: 1.1;
  letter-spacing: -0.02em;
  white-space: nowrap;
}

.paces-donut-footer {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.45rem;
  margin-top: 0.65rem;
}

.paces-donut-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  background: rgba(255, 170, 64, 0.18) !important;
  color: #b45309 !important;
  font-size: 0.82rem;
  font-weight: 800;
  padding: 0.35rem 0.95rem;
  border-radius: var(--radius-pill, 9999px);
}

.paces-donut-badge i,
.paces-donut-badge svg {
  width: 14px;
  height: 14px;
  fill: #b45309 !important;
  color: #b45309 !important;
}

.paces-donut-subtext {
  font-size: 0.78rem;
  color: #94a3b8;
}

/* ── 4. Alertas Estratégicas & Inteligencia de Mercado (Reemplazo de Rangos de Cuantía) ── */
.paces-strategic-card {
  background: #ffffff !important;
  border: 1px solid #eef2f7 !important;
  border-radius: 12px !important;
  padding: 1.35rem 1.5rem !important;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  margin-bottom: 0;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.02) !important;
  min-height: 220px;
}

.paces-card-title-group {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.paces-strategic-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  border-radius: 6px;
  background: rgba(69, 87, 163, 0.1);
  color: #4557a3;
}

.paces-strategic-icon [data-lucide],
.paces-strategic-icon svg {
  width: 15px;
  height: 15px;
}

.paces-badge-pulse {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 0.2rem 0.55rem;
  border-radius: 20px;
  background: #ecfdf5;
  color: #059669;
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.paces-badge-pulse::before {
  content: '';
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #10b981;
  display: inline-block;
}

.paces-strategic-body {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
  margin-top: 0.6rem;
}

.strategic-metric-block {
  padding: 0.65rem 0.8rem;
  border-radius: 8px;
  transition: all 0.15s ease;
}

.strategic-metric-block.urgent-block {
  background: #fffbeb;
  border: 1px solid #fef3c7;
}

.strategic-metric-block.record-block {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
}

.strategic-metric-info {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
}

.strategic-metric-label {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.76rem;
  font-weight: 700;
  color: #64748b;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.strategic-metric-label [data-lucide],
.strategic-metric-label svg {
  width: 14px;
  height: 14px;
  color: #ea580c;
}

.strategic-metric-block.record-block .strategic-metric-label [data-lucide],
.strategic-metric-block.record-block .strategic-metric-label svg {
  color: #4557a3;
}

.strategic-metric-row {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.strategic-metric-num {
  font-family: 'Outfit', sans-serif;
  font-size: 1.15rem;
  font-weight: 800;
  color: #0f172a;
}

.strategic-metric-tag.urgent {
  font-size: 0.7rem;
  font-weight: 700;
  padding: 0.15rem 0.45rem;
  border-radius: 4px;
  background: #ea580c;
  color: #ffffff;
  text-transform: uppercase;
}

.strategic-metric-desc {
  font-size: 0.72rem;
  color: #94a3b8;
  margin: 0.2rem 0 0 0;
  line-height: 1.25;
}

.strategic-entity-wrap {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  margin-top: 0.25rem;
}

.strategic-entity-badge {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  font-size: 0.7rem;
  font-weight: 600;
  color: #64748b;
  background: #eef2f6;
  padding: 0.1rem 0.4rem;
  border-radius: 4px;
  white-space: nowrap;
}

.strategic-entity-badge [data-lucide],
.strategic-entity-badge svg {
  width: 12px;
  height: 12px;
}

.strategic-entity-name {
  font-size: 0.75rem;
  font-weight: 600;
  color: #334155;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 150px;
}

/* Jurisdicción Progress Bar */
.strategic-jurisdiction-block {
  padding-top: 0.2rem;
}

.jurisdiction-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 0.3rem;
}

.jurisdiction-title {
  font-size: 0.73rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #64748b;
}

.jurisdiction-progress-bar {
  display: flex;
  width: 100%;
  height: 7px;
  border-radius: 4px;
  overflow: hidden;
  background: #e2e8f0;
}

.jurisdiction-fill.territorial {
  background: #3b82f6;
}

.jurisdiction-fill.nacional {
  background: #8b5cf6;
}

.jurisdiction-labels {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  margin-top: 0.35rem;
}

.jurisdiction-legend {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 0.72rem;
  color: #64748b;
}

.legend-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  display: inline-block;
}

.legend-dot.territorial { background: #3b82f6; }
.legend-dot.nacional { background: #8b5cf6; }

/* ── 5. Fila 3: Cifras y Métricas Relevantes del Mercado ── */
.paces-figures-grid {
  display: grid;
  grid-template-columns: 1.15fr 1.15fr 1fr;
  gap: 1.25rem;
  margin-top: 1.25rem;
  align-items: stretch;
}

@media (max-width: 1200px) {
  .paces-figures-grid {
    grid-template-columns: 1fr;
  }
}

.paces-figure-card {
  background: #ffffff !important;
  border: 1px solid #eef2f7 !important;
  border-radius: 12px !important;
  padding: 1.5rem !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.02) !important;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.figure-title-wrap {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.figure-icon-box {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 10px;
  flex-shrink: 0;
}

.figure-icon-box [data-lucide],
.figure-icon-box svg {
  width: 20px;
  height: 20px;
}

.figure-icon-box.icon-indigo { background: rgba(69, 87, 163, 0.1); color: #4557a3; }
.figure-icon-box.icon-rose { background: rgba(225, 29, 72, 0.1); color: #e11d48; }
.figure-icon-box.icon-cyan { background: rgba(8, 145, 178, 0.1); color: #0891b2; }

.figure-pill-badge {
  display: inline-flex;
  align-items: center;
  padding: 0.25rem 0.65rem;
  border-radius: 20px;
  background: #f1f5f9;
  border: 1px solid #e2e8f0;
  font-size: 0.75rem;
  font-weight: 700;
  color: #334155;
}

/* Lista de Cuantías */
.figure-cuantia-list {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
  margin-top: 1rem;
}

.figure-cuantia-item {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.figure-cuantia-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.figure-cuantia-left {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 0.8rem;
  font-weight: 600;
  color: #334155;
}

.figure-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
}

.figure-dot.dot-emerald { background: #10b981; }
.figure-dot.dot-blue { background: #3b82f6; }
.figure-dot.dot-amber { background: #f59e0b; }
.figure-dot.dot-purple { background: #8b5cf6; }

.figure-cuantia-right {
  display: flex;
  align-items: baseline;
  gap: 8px;
}

.figure-cuantia-val {
  font-size: 0.85rem;
  font-weight: 800;
  color: #0f172a;
  font-family: 'Outfit', sans-serif;
}

.figure-cuantia-sub {
  font-size: 0.72rem;
  color: #64748b;
}

.figure-progress-track {
  width: 100%;
  height: 6px;
  background: #f1f5f9;
  border-radius: 3px;
  overflow: hidden;
}

.figure-progress-bar {
  height: 100%;
  border-radius: 3px;
  transition: width 0.4s ease;
}

.figure-progress-bar.bar-emerald { background: #10b981; }
.figure-progress-bar.bar-blue { background: #3b82f6; }
.figure-progress-bar.bar-amber { background: #f59e0b; }
.figure-progress-bar.bar-purple { background: #8b5cf6; }

/* Grid de Urgencias */
.figure-urgency-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.75rem;
  margin-top: 1rem;
}

.figure-urgency-box {
  border-radius: 10px;
  padding: 0.85rem;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  border: 1px solid transparent;
}

.figure-urgency-box.urgency-critical { background: #fef2f2; border-color: #fee2e2; }
.figure-urgency-box.urgency-warning { background: #fffbeb; border-color: #fef3c7; }
.figure-urgency-box.urgency-optimal { background: #f0fdf4; border-color: #dcfce7; }
.figure-urgency-box.urgency-future { background: #f8fafc; border-color: #e2e8f0; }

.urgency-box-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.urgency-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 0.7rem;
  font-weight: 700;
  border-radius: 4px;
  padding: 2px 6px;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

.urgency-badge [data-lucide],
.urgency-badge svg {
  width: 12px;
  height: 12px;
}

.urgency-badge.critical { background: #dc2626; color: #ffffff; }
.urgency-badge.warning { background: #ea580c; color: #ffffff; }
.urgency-badge.optimal { background: #059669; color: #ffffff; }
.urgency-badge.future { background: #475569; color: #ffffff; }

.urgency-count {
  font-size: 0.73rem;
  font-weight: 700;
  color: #475569;
}

.urgency-box-value {
  font-size: 1.15rem;
  font-weight: 800;
  color: #0f172a;
  font-family: 'Outfit', sans-serif;
  letter-spacing: -0.02em;
}

.urgency-box-desc {
  font-size: 0.7rem;
  color: #64748b;
  line-height: 1.25;
}

/* Matriz de Mini KPIs */
.figure-kpis-matrix {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
  margin-top: 1rem;
}

.figure-mini-kpi {
  background: #f8fafc;
  border: 1px solid #eef2f7;
  border-radius: 10px;
  padding: 0.85rem;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.figure-mini-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 0.35rem;
}

.figure-mini-label {
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
  color: #64748b;
  letter-spacing: 0.04em;
}

.figure-mini-tag {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  font-size: 0.68rem;
  font-weight: 600;
  border-radius: 4px;
  padding: 1px 5px;
}

.figure-mini-tag [data-lucide],
.figure-mini-tag svg {
  width: 11px;
  height: 11px;
}

.figure-mini-tag.free-tag { background: #ecfdf5; color: #059669; }
.figure-mini-tag.map-tag { background: #eff6ff; color: #2563eb; }
.figure-mini-tag.alert-tag { background: #fef3c7; color: #d97706; }
.figure-mini-tag.median-tag { background: #f3e8ff; color: #7e22ce; }

.figure-mini-val {
  font-size: 1.15rem;
  font-weight: 800;
  color: #0f172a;
  font-family: 'Outfit', sans-serif;
  letter-spacing: -0.02em;
}

.figure-mini-sub {
  font-size: 0.72rem;
  color: #64748b;
  line-height: 1.25;
}

/* ── Botón de Acción en Tarjeta de Cifras ── */
.btn-figure-action,
.btn-primary-sm {
  display: inline-flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.45rem !important;
  background: #4557a3 !important;
  color: #ffffff !important;
  border: 1px solid #4557a3 !important;
  border-radius: 20px !important;
  padding: 0.35rem 0.85rem !important;
  font-size: 0.76rem !important;
  font-weight: 600 !important;
  font-family: inherit !important;
  cursor: pointer !important;
  white-space: nowrap !important;
  line-height: 1.2 !important;
  text-decoration: none !important;
  box-shadow: 0 1px 3px rgba(69, 87, 163, 0.2) !important;
  transition: all 0.18s cubic-bezier(0.4, 0, 0.2, 1) !important;
  flex-shrink: 0;
}

.btn-figure-action:hover,
.btn-primary-sm:hover {
  background: #34417a !important;
  border-color: #34417a !important;
  color: #ffffff !important;
  transform: translateY(-1px);
  box-shadow: 0 3px 8px rgba(69, 87, 163, 0.3) !important;
}

.btn-figure-action:active,
.btn-primary-sm:active {
  transform: translateY(0);
}

.btn-figure-action i,
.btn-figure-action svg,
.btn-primary-sm i,
.btn-primary-sm svg {
  width: 14px !important;
  height: 14px !important;
  stroke-width: 2.2 !important;
  display: inline-block !important;
  vertical-align: middle !important;
  transition: transform 0.15s ease !important;
}

.btn-figure-action:hover i,
.btn-figure-action:hover svg,
.btn-primary-sm:hover i,
.btn-primary-sm:hover svg {
  transform: translateX(2px) !important;
}

/* ── Compatibilidad con Live Feed previo ── */
.paces-live-feed-card {
  background: #ffffff !important;
  border: 1px solid #eef2f7 !important;
  border-radius: 12px !important;
  padding: 1.5rem !important;
  margin-top: 1.25rem !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.02) !important;
}

.paces-feed-title-wrap {
  display: flex;
  align-items: center;
  gap: 0.85rem;
}

.paces-feed-icon-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 10px;
  background: rgba(69, 87, 163, 0.1);
  color: #4557a3;
  flex-shrink: 0;
}

.paces-feed-icon-wrap [data-lucide],
.paces-feed-icon-wrap svg {
  width: 20px;
  height: 20px;
}

.paces-feed-header-actions {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.paces-feed-count-badge {
  display: inline-flex;
  align-items: center;
  padding: 0.3rem 0.65rem;
  border-radius: 20px;
  background: #f1f5f9;
  border: 1px solid #e2e8f0;
  font-size: 0.75rem;
  font-weight: 700;
  color: #475569;
}

.paces-table-responsive {
  width: 100%;
  overflow-x: auto;
  margin-top: 1rem;
}

.paces-live-table {
  width: 100%;
  border-collapse: collapse;
  text-align: left;
}

.paces-live-table thead th {
  background: #f8fafc;
  color: #64748b;
  font-size: 0.76rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  padding: 0.85rem 1rem;
  border-top: 1px solid #eef2f7;
  border-bottom: 1px solid #e2e8f0;
  white-space: nowrap;
}

.paces-live-table tbody td {
  padding: 1rem 1rem;
  border-bottom: 1px solid #f1f5f9;
  vertical-align: middle;
  font-size: 0.85rem;
}

.paces-live-table tbody tr {
  transition: background 0.15s ease;
}

.paces-live-table tbody tr:hover {
  background: #f8fafc;
}

.paces-feed-main-col {
  max-width: 440px;
}

.feed-entity-name {
  display: flex;
  align-items: center;
  gap: 6px;
  font-weight: 700;
  color: #0f172a;
  font-size: 0.88rem;
  line-height: 1.3;
  margin-bottom: 0.25rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 420px;
}

.feed-entity-name [data-lucide],
.feed-entity-name svg {
  width: 15px;
  height: 15px;
  color: #4557a3;
  flex-shrink: 0;
}

.feed-tender-desc {
  font-size: 0.8rem;
  color: #475569;
  line-height: 1.45;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

.feed-tender-id {
  display: inline-block;
  font-size: 0.72rem;
  color: #94a3b8;
  font-family: 'JetBrains Mono', monospace;
  margin-top: 0.3rem;
}

.feed-location {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: 0.82rem;
  color: #475569;
  font-weight: 600;
  white-space: nowrap;
}

.feed-location [data-lucide],
.feed-location svg {
  width: 14px;
  height: 14px;
  color: #94a3b8;
}

.feed-modality-pill {
  display: inline-block;
  padding: 0.25rem 0.55rem;
  border-radius: 6px;
  background: #f1f5f9;
  border: 1px solid #e2e8f0;
  font-size: 0.74rem;
  font-weight: 600;
  color: #475569;
  white-space: nowrap;
}

.paces-feed-val-col {
  white-space: nowrap;
}

.feed-val-currency {
  font-family: 'Outfit', sans-serif;
  font-size: 1rem;
  font-weight: 800;
  color: #059669;
}

.feed-badges-stack {
  display: flex;
  flex-direction: column;
  gap: 5px;
  align-items: flex-start;
}

.feed-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 0.2rem 0.5rem;
  border-radius: 4px;
  font-size: 0.72rem;
  font-weight: 600;
  white-space: nowrap;
}

.feed-badge [data-lucide],
.feed-badge svg {
  width: 12px;
  height: 12px;
}

.feed-badge.rup-free {
  background: #ecfdf5;
  color: #047857;
  border: 1px solid #d1fae5;
}

.feed-badge.rup-req {
  background: #f8fafc;
  color: #64748b;
  border: 1px solid #e2e8f0;
}

.feed-badge.vence-urgent {
  background: #fef2f2;
  color: #b91c1c;
  border: 1px solid #fecaca;
  font-weight: 700;
}

.feed-badge.vence-normal {
  background: #f8fafc;
  color: #475569;
  border: 1px solid #e2e8f0;
}

.paces-feed-actions-col {
  text-align: right;
  white-space: nowrap;
}

.feed-actions-group {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  justify-content: flex-end;
}

.btn-feed-action {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 0.4rem 0.75rem;
  border-radius: 6px;
  font-size: 0.78rem;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.15s ease;
  text-decoration: none;
}

.btn-feed-action [data-lucide],
.btn-feed-action svg {
  width: 14px;
  height: 14px;
}

.btn-feed-secop {
  background: #f8fafc;
  border: 1px solid #cbd5e1;
  color: #334155;
}

.btn-feed-secop:hover {
  background: #f1f5f9;
  color: #0f172a;
  border-color: #94a3b8;
}

.btn-feed-track {
  background: #4557a3;
  border: 1px solid #4557a3;
  color: #ffffff;
}

.btn-feed-track:hover {
  background: #34417a;
  border-color: #34417a;
}

.range-dot.start { left: -3px; }
.range-dot.end { right: -3px; }

.paces-range-num {
  font-size: 0.8rem;
  font-weight: 700;
  color: #1e293b;
  min-width: 44px;
  text-align: right;
}

.paces-range-ticks {
  display: flex;
  justify-content: space-between;
  padding: 0 0.5rem;
  font-size: 0.72rem;
  color: #94a3b8;
  border-top: 1px dashed #e2e8f0;
  padding-top: 0.45rem;
  margin-top: 0.25rem;
}

/* ── Fila 2 de Paces Minimal: 2 Columnas Generosas (Sales Report + Products) ── */
.paces-bottom-grid {
  display: grid;
  grid-template-columns: 1.45fr 1fr;
  gap: 1.25rem;
  margin-bottom: 1.5rem;
  align-items: stretch;
}

@media (max-width: 1080px) {
  .paces-bottom-grid {
    grid-template-columns: 1fr;
  }
}

.paces-report-card,
.paces-products-card {
  background: #ffffff !important;
  border: none !important;
  border-radius: 10px !important;
  padding: 1.5rem 1.75rem !important;
  margin-bottom: 0;
  box-shadow: none !important;
}

.paces-report-title-wrap {
  display: flex;
  align-items: baseline;
  gap: 0.5rem;
}

.paces-report-count {
  font-size: 0.82rem;
  color: #94a3b8;
  font-weight: 600;
}

.paces-tabs-nav {
  display: flex;
  align-items: center;
  gap: 0.35rem;
}

.paces-tab-btn {
  background: transparent;
  border: none;
  font-size: 0.84rem;
  font-weight: 600;
  color: #64748b;
  padding: 0.4rem 0.85rem;
  cursor: pointer;
  border-radius: 4px;
  position: relative;
  transition: all 0.15s ease;
}

.paces-tab-btn:hover {
  color: #4557a3;
}

.paces-tab-btn.active {
  color: #4557a3;
  border-bottom: 2.5px solid #4557a3;
  border-radius: 0;
}

.paces-report-metrics-row {
  display: flex;
  align-items: center;
  justify-content: space-around;
  padding: 1.35rem 0;
  border-bottom: 1px solid #f1f5f9;
  margin-bottom: 1.35rem;
}

.report-metric-item {
  display: flex;
  align-items: center;
  gap: 0.85rem;
}

.metric-icon-wrap {
  width: 44px;
  height: 44px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.metric-icon-wrap.icon-emerald { background: rgba(138, 190, 159, 0.20); color: #2e6945; }
.metric-icon-wrap.icon-blue { background: rgba(69, 87, 163, 0.12); color: #4557a3; }
.metric-icon-wrap.icon-amber { background: rgba(255, 170, 64, 0.20); color: #b45309; }

.metric-icon-wrap i,
.metric-icon-wrap svg {
  width: 22px;
  height: 22px;
}

.metric-sublabel {
  font-size: 0.76rem;
  font-weight: 600;
  color: #94a3b8;
  display: block;
}

.metric-main-val {
  font-size: 1.4rem;
  font-weight: 800;
  color: #1e293b;
  letter-spacing: -0.01em;
}

.paces-report-charts-subgrid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.25rem;
}

@media (max-width: 640px) {
  .paces-report-charts-subgrid {
    grid-template-columns: 1fr;
  }
}

.paces-subchart-block h5 {
  font-size: 0.82rem;
  font-weight: 700;
  color: #334155;
  margin: 0 0 0.5rem 0;
  display: flex;
  align-items: center;
  gap: 0.35rem;
}

.paces-subchart-block h5 i,
.paces-subchart-block h5 svg {
  width: 14px;
  height: 14px;
  color: #4557a3;
}

.paces-card-subtitle {
  font-size: 0.78rem;
  color: #94a3b8;
  margin: -0.35rem 0 1rem 0;
}

.btn-export-sm {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
  padding: 0.3rem 0.65rem;
  font-size: 0.75rem;
  font-weight: 600;
  color: #475569;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  transition: all 0.15s ease;
}

.btn-export-sm:hover {
  background: #f8fafc;
  color: #1e293b;
  border-color: #cbd5e1;
}

.btn-export-sm i,
.btn-export-sm svg {
  width: 13px;
  height: 13px;
}

/* ── Paces Topbar Extras ── */
.paces-topbar-links {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-left: 0.5rem;
}

.paces-dropdown-link {
  font-size: 0.82rem;
  font-weight: 600;
  color: #475569;
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  cursor: pointer;
  transition: color 0.15s ease;
}

.paces-dropdown-link:hover {
  color: #4557a3;
}

.paces-dropdown-link i,
.paces-dropdown-link svg {
  width: 13px;
  height: 13px;
  color: #94a3b8;
}

.paces-lang-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.75rem;
  font-weight: 700;
  color: #475569;
  padding: 0.2rem 0.45rem;
  border-radius: 4px;
  cursor: pointer;
}

.lang-flag {
  font-size: 0.95rem;
}

.header-badge-dot {
  position: absolute;
  top: 6px;
  right: 6px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #ef4444;
  border: 1.5px solid #ffffff;
}

.user-pill-chevron {
  width: 13px;
  height: 13px;
  color: #94a3b8;
  margin-left: 0.2rem;
}

@media (max-width: 992px) {
  .d-none-mobile {
    display: none !important;
  }
}

/* Barra de filtros retirada del dashboard principal según requerimiento */
.radar-filters-bar {
  display: none !important;
}

.radar-search-box {
  flex: 1.5;
  min-width: 220px;
  max-width: none;
}

.radar-range-group {
  display: flex;
  align-items: center;
  gap: 0.4rem;
}

.radar-range-input {
  width: 9rem;
  padding: 0.6rem 0.65rem;
}

.radar-range-sep {
  color: var(--text-muted, #94a3b8);
  font-weight: 700;
}

/* Toggle tipo switch — misma metáfora visual en toda la barra de filtros
   para "Sin RUP" y "Coincide con mis alertas". */
.radar-toggle {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  cursor: pointer;
  user-select: none;
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--text-dark, #0f172a);
  white-space: nowrap;
}

.radar-toggle input[type="checkbox"] {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}

.radar-toggle-track {
  position: relative;
  width: 2.1rem;
  height: 1.15rem;
  background: #cbd5e1;
  border-radius: var(--radius-pill, 999px);
  transition: background 0.2s;
  flex-shrink: 0;
}

.radar-toggle-thumb {
  position: absolute;
  top: 2px;
  left: 2px;
  width: 0.95rem;
  height: 0.95rem;
  background: #ffffff;
  border-radius: 50%;
  transition: transform 0.2s;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}

.radar-toggle input[type="checkbox"]:checked + .radar-toggle-track {
  background: var(--color-primary, #0067FF);
}

.radar-toggle input[type="checkbox"]:checked + .radar-toggle-track .radar-toggle-thumb {
  transform: translateX(0.95rem);
}

.radar-toggle input[type="checkbox"]:focus-visible + .radar-toggle-track {
  box-shadow: 0 0 0 3px rgba(0, 103, 255, 0.25);
}

.radar-toggle-disabled,
.radar-toggle:has(input:disabled) {
  cursor: not-allowed;
  opacity: 0.5;
}

.radar-charts-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.25rem;
  margin-bottom: 1.5rem;
}

@media (max-width: 1200px) {
  .radar-charts-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
  .radar-charts-grid { grid-template-columns: 1fr; }
}

.radar-chart-card {
  min-height: 0;
  display: flex;
  flex-direction: column;
}

.radar-card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 0.95rem;
  padding-bottom: 0.55rem;
  border-bottom: 1px solid #f1f5f9;
}

.radar-card-header h3 {
  font-size: 0.88rem;
  font-weight: 600;
  color: #1e293b;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  margin: 0;
}

.radar-card-header h3 i,
.radar-card-header h3 svg {
  width: 16px;
  height: 16px;
  color: var(--color-primary, #2563eb);
  stroke-width: 1.8;
}

.radar-header-badge {
  font-size: 0.65rem;
  font-weight: 600;
  padding: 0.15rem 0.5rem;
  border-radius: var(--radius-pill, 9999px);
  background: #f1f5f9;
  color: #64748b;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.radar-bars-list {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
}

.radar-bar-row {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.radar-bar-row.radar-bar-clickable {
  cursor: pointer;
  padding: 0.2rem 0.35rem;
  border-radius: var(--radius-xs, 6px);
  transition: background 0.15s ease;
}

.radar-bar-row.radar-bar-clickable:hover {
  background: #f8fafc;
}

.radar-bar-label {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  font-size: 0.78rem;
  color: #334155;
}

.radar-bar-label .radar-bar-count {
  font-family: 'JetBrains Mono', monospace;
  font-weight: 600;
  font-size: 0.72rem;
  color: #64748b;
}

.radar-bar-track {
  background: #f1f5f9;
  height: 6px;
  border-radius: 3px;
  overflow: hidden;
}

.radar-bar-fill {
  background: #4557a3;
  height: 100%;
  border-radius: 3px;
  transition: width 0.35s ease;
}

.radar-bar-row.radar-bar-clickable:hover .radar-bar-fill {
  background: #34417a;
}

.radar-bar-row.radar-bar-active .radar-bar-label span:first-child {
  color: var(--color-primary, #4557a3);
  font-weight: 600;
}

/* Top Entities list styling */
.radar-top-entity-list {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.radar-entity-item {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  padding: 0.45rem 0.6rem;
  border-radius: var(--radius-sm, 8px);
  background: #f8fafc;
  border: 1px solid #f1f5f9;
  transition: all 0.15s ease;
}

.radar-entity-item:hover {
  background: #ffffff;
  border-color: #e2e8f0;
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.03);
}

.radar-entity-rank {
  width: 24px;
  height: 24px;
  border-radius: 6px;
  background: #e2e8f0;
  color: #334155;
  font-weight: 800;
  font-size: 0.75rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.radar-entity-rank.rank-1 { background: #fef3c7; color: #b45309; }
.radar-entity-rank.rank-2 { background: #e0f2fe; color: #0369a1; }
.radar-entity-rank.rank-3 { background: #f1f5f9; color: #475569; }

.radar-entity-info {
  flex: 1;
  min-width: 0;
}

.radar-entity-name {
  font-size: 0.78rem;
  font-weight: 600;
  color: #1e293b;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.radar-entity-meta {
  font-size: 0.68rem;
  color: #64748b;
}

.radar-entity-monto {
  font-family: 'Outfit', sans-serif;
  font-weight: 700;
  font-size: 0.8rem;
  color: #059669;
  text-align: right;
  white-space: nowrap;
  flex-shrink: 0;
}

/* Skeleton de carga: 4 barras "fantasma" con shimmer, del mismo alto que
   una gráfica real, para que nunca se vea un hueco en blanco mientras
   llega la respuesta del backend. */
.radar-skeleton-bar {
  height: 34px;
  border-radius: 6px;
  margin-bottom: 0.7rem;
  background: linear-gradient(90deg, #eef1f5 25%, #f8fafc 37%, #eef1f5 63%);
  background-size: 400% 100%;
  animation: radar-shimmer 1.4s ease infinite;
}

.radar-skeleton-bar:last-child { margin-bottom: 0; }

@keyframes radar-shimmer {
  0% { background-position: 100% 50%; }
  100% { background-position: 0 50%; }
}

.radar-table-wrap {
  overflow-x: auto;
}

.radar-table {
  font-size: 12px;
}

.radar-sortable-th {
  cursor: pointer;
  user-select: none;
  white-space: nowrap;
}

.radar-sortable-th:hover {
  color: var(--text-dark, #0f172a);
}

.radar-sortable-th .radar-sort-icon {
  width: 12px;
  height: 12px;
  margin-left: 0.25rem;
  vertical-align: -1px;
  opacity: 0.4;
}

.radar-sortable-th.radar-sort-active .radar-sort-icon {
  opacity: 1;
  color: var(--color-primary, #0067FF);
}

.rup-pill {
  font-size: 0.72rem;
  font-weight: 700;
  padding: 0.2rem 0.55rem;
  border-radius: var(--radius-xl, 24px);
  white-space: nowrap;
}

.rup-pill.rup-requiere { background: #fef3c7; color: #b45309; }
.rup-pill.rup-sin-rup { background: #ecfdf5; color: #059669; }

.radar-vence-cell.radar-vence-vencido { color: var(--text-muted, #94a3b8); }
.radar-vence-cell.radar-vence-urgente { color: var(--color-alert, #ff6400); font-weight: 700; }

.radar-descripcion-cell {
  display: -webkit-box;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
  overflow: hidden;
  max-width: 480px;
  margin-top: 0.25rem;
  font-size: 12px;
  color: var(--text-muted, #64748b);
  line-height: 1.4;
  white-space: normal;
}

.radar-table td.radar-empty-cell {
  padding: 1.5rem 1rem;
}

/* ══════════════════════════════════════════════════════════════════════════════
   DARK MODE SYSTEM PALETTE (Paces Minimal Dark)
   ══════════════════════════════════════════════════════════════════════════════ */
:root[data-theme="dark"],
[data-theme="dark"] body,
body.dark-mode {
  --bg-main: #0d111a;
  --bg-surface: #0f131d;
  --bg-card: #151924;
  --bg-sidebar: #11141e;
  --border-light: #22283a;
  --border-subtle: #1c2130;
  --border-focus: #5367b8;
  --text-dark: #f8fafc;
  --text-muted: #94a3b8;
  --text-dim: #64748b;
  --shadow-hover: 0 4px 14px rgba(0, 0, 0, 0.4);
}

html[data-theme="dark"] body,
body.dark-mode {
  background-color: #0d111a !important;
  color: #f1f5f9 !important;
}

/* Header & Sidebar */
html[data-theme="dark"] .dash-header,
body.dark-mode .dash-header {
  background: #11141e !important;
  border-bottom: 1px solid #1d2232 !important;
}

html[data-theme="dark"] .dash-sidebar,
body.dark-mode .dash-sidebar {
  background: #11141e !important;
  border-right: 1px solid #1d2232 !important;
}

html[data-theme="dark"] .sidebar-brand,
body.dark-mode .sidebar-brand {
  border-bottom: 1px solid #1d2232 !important;
}

html[data-theme="dark"] .sidebar-brand-name,
body.dark-mode .sidebar-brand-name {
  color: #ffffff !important;
}

/* Header Search Pill */
html[data-theme="dark"] .header-search-pill,
body.dark-mode .header-search-pill {
  background: #181d2b !important;
  border: 1px solid #252d40 !important;
  color: #94a3b8 !important;
}

html[data-theme="dark"] .header-search-pill:hover,
body.dark-mode .header-search-pill:hover {
  border-color: #384562 !important;
  background: #1c2233 !important;
}

html[data-theme="dark"] .header-search-placeholder,
body.dark-mode .header-search-placeholder {
  color: #64748b !important;
}

html[data-theme="dark"] .header-search-icon,
body.dark-mode .header-search-icon {
  color: #64748b !important;
}

/* Header Buttons */
html[data-theme="dark"] .header-icon-btn,
body.dark-mode .header-icon-btn {
  color: #94a3b8 !important;
}

html[data-theme="dark"] .header-icon-btn:hover,
body.dark-mode .header-icon-btn:hover {
  background: #1d2334 !important;
  color: #ffffff !important;
}

html[data-theme="dark"] .btn-sidebar-collapse,
body.dark-mode .btn-sidebar-collapse {
  color: #94a3b8 !important;
}

html[data-theme="dark"] .btn-sidebar-collapse:hover,
body.dark-mode .btn-sidebar-collapse:hover {
  background: #1d2334 !important;
  color: #ffffff !important;
}

html[data-theme="dark"] .header-divider,
body.dark-mode .header-divider {
  background: #252d40 !important;
}

/* Sidebar Nav Items */
html[data-theme="dark"] .nav-item,
body.dark-mode .nav-item {
  color: #94a3b8 !important;
}

html[data-theme="dark"] .nav-item:hover,
body.dark-mode .nav-item:hover {
  background: rgba(255, 255, 255, 0.05) !important;
  color: #ffffff !important;
}

html[data-theme="dark"] .nav-item.active,
body.dark-mode .nav-item.active {
  background: #242c3e !important;
  color: #ffffff !important;
}

html[data-theme="dark"] .nav-category-title,
body.dark-mode .nav-category-title {
  color: #64748b !important;
}

html[data-theme="dark"] .nav-category-badge,
body.dark-mode .nav-category-badge {
  background: #202636 !important;
  color: #94a3b8 !important;
}

html[data-theme="dark"] .nav-category-chevron,
body.dark-mode .nav-category-chevron {
  color: #64748b !important;
}

/* Dashboard Cards & Surfaces */
html[data-theme="dark"] .card,
body.dark-mode .card,
html[data-theme="dark"] .stat-card,
body.dark-mode .stat-card,
html[data-theme="dark"] .dash-card,
body.dark-mode .dash-card,
html[data-theme="dark"] .paces-card,
body.dark-mode .paces-card,
html[data-theme="dark"] .explorer-card,
body.dark-mode .explorer-card,
html[data-theme="dark"] .legal-card,
body.dark-mode .legal-card,
html[data-theme="dark"] .radar-card,
body.dark-mode .radar-card,
html[data-theme="dark"] .config-card,
body.dark-mode .config-card,
html[data-theme="dark"] .pipeline-stage-card,
body.dark-mode .pipeline-stage-card,
html[data-theme="dark"] .pipeline-tender-card,
body.dark-mode .pipeline-tender-card,
html[data-theme="dark"] .table-card,
body.dark-mode .table-card {
  background: #141824 !important;
  border-color: #21283a !important;
  color: #f1f5f9;
}

html[data-theme="dark"] .card-title,
body.dark-mode .card-title,
html[data-theme="dark"] .stat-card-value,
body.dark-mode .stat-card-value,
html[data-theme="dark"] .dash-card-title,
body.dark-mode .dash-card-title,
html[data-theme="dark"] .section-title,
body.dark-mode .section-title,
html[data-theme="dark"] .radar-entity-name,
body.dark-mode .radar-entity-name {
  color: #f8fafc !important;
}

html[data-theme="dark"] .card-subtitle,
body.dark-mode .card-subtitle,
html[data-theme="dark"] .stat-card-label,
body.dark-mode .stat-card-label,
html[data-theme="dark"] .radar-entity-meta,
body.dark-mode .radar-entity-meta {
  color: #94a3b8 !important;
}

/* Welcome Banner Hero Dark */
html[data-theme="dark"] .paces-welcome-card,
body.dark-mode .paces-welcome-card {
  background: linear-gradient(135deg, #131724 0%, #171e2e 55%, #1a2235 100%) !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
  box-shadow: 0 10px 30px -8px rgba(0, 0, 0, 0.5) !important;
}

html[data-theme="dark"] .paces-welcome-card:hover,
body.dark-mode .paces-welcome-card:hover {
  border-color: rgba(99, 102, 241, 0.35) !important;
  box-shadow: 0 16px 40px -8px rgba(0, 0, 0, 0.65) !important;
}

html[data-theme="dark"] .paces-welcome-card::after,
body.dark-mode .paces-welcome-card::after {
  background: radial-gradient(circle, rgba(99, 102, 241, 0.15) 0%, rgba(20, 24, 36, 0) 70%) !important;
}

html[data-theme="dark"] .paces-welcome-card::before,
body.dark-mode .paces-welcome-card::before {
  background: radial-gradient(circle, rgba(16, 185, 129, 0.12) 0%, rgba(20, 24, 36, 0) 70%) !important;
}

html[data-theme="dark"] .paces-welcome-greeting,
body.dark-mode .paces-welcome-greeting {
  color: #a5b4fc !important;
}

html[data-theme="dark"] .paces-welcome-user,
body.dark-mode .paces-welcome-user {
  color: #f8fafc !important;
}

html[data-theme="dark"] .paces-welcome-role,
body.dark-mode .paces-welcome-role {
  color: #94a3b8 !important;
}

html[data-theme="dark"] .paces-meta-pill,
body.dark-mode .paces-meta-pill {
  background: rgba(25, 32, 48, 0.9) !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
  color: #cbd5e1 !important;
}

html[data-theme="dark"] .paces-meta-pill:hover,
body.dark-mode .paces-meta-pill:hover {
  background: #20293d !important;
  border-color: rgba(255, 255, 255, 0.15) !important;
}

html[data-theme="dark"] .paces-meta-pill i,
html[data-theme="dark"] .paces-meta-pill svg,
body.dark-mode .paces-meta-pill i,
body.dark-mode .paces-meta-pill svg {
  color: #818cf8 !important;
}

html[data-theme="dark"] .paces-live-clock,
body.dark-mode .paces-live-clock {
  color: #f1f5f9 !important;
}

html[data-theme="dark"] .paces-clock-sec-badge,
body.dark-mode .paces-clock-sec-badge {
  color: #38bdf8 !important;
}

html[data-theme="dark"] .paces-clock-ampm,
body.dark-mode .paces-clock-ampm {
  color: #94a3b8 !important;
}

/* Tables & Rows */
html[data-theme="dark"] table,
body.dark-mode table,
html[data-theme="dark"] .paces-table,
body.dark-mode .paces-table,
html[data-theme="dark"] .radar-table,
body.dark-mode .radar-table {
  color: #cbd5e1 !important;
}

html[data-theme="dark"] table th,
body.dark-mode table th,
html[data-theme="dark"] .paces-table th,
body.dark-mode .paces-table th,
html[data-theme="dark"] .radar-sortable-th,
body.dark-mode .radar-sortable-th {
  background: #171c2a !important;
  color: #94a3b8 !important;
  border-bottom: 1px solid #22293b !important;
}

html[data-theme="dark"] table td,
body.dark-mode table td,
html[data-theme="dark"] .paces-table td,
body.dark-mode .paces-table td,
html[data-theme="dark"] .radar-table td,
body.dark-mode .radar-table td {
  border-bottom: 1px solid #1c2232 !important;
  color: #cbd5e1 !important;
}

html[data-theme="dark"] table tr:hover td,
body.dark-mode table tr:hover td,
html[data-theme="dark"] .paces-table tr:hover td,
body.dark-mode .paces-table tr:hover td,
html[data-theme="dark"] .radar-table tr:hover td,
body.dark-mode .radar-table tr:hover td {
  background: #191e2e !important;
}

/* Form Controls & Inputs */
html[data-theme="dark"] input.form-control,
body.dark-mode input.form-control,
html[data-theme="dark"] select.form-control,
body.dark-mode select.form-control,
html[data-theme="dark"] .form-input,
body.dark-mode .form-input,
html[data-theme="dark"] .form-select,
body.dark-mode .form-select,
html[data-theme="dark"] .explorer-search-input,
body.dark-mode .explorer-search-input,
html[data-theme="dark"] .filter-select,
body.dark-mode .filter-select,
html[data-theme="dark"] textarea,
body.dark-mode textarea {
  background: #151926 !important;
  border: 1px solid #262f44 !important;
  color: #f8fafc !important;
}

html[data-theme="dark"] input::placeholder,
body.dark-mode input::placeholder,
html[data-theme="dark"] textarea::placeholder,
body.dark-mode textarea::placeholder {
  color: #64748b !important;
}

/* Tabs & Filter Pills */
html[data-theme="dark"] .subtab-btn,
body.dark-mode .subtab-btn,
html[data-theme="dark"] .config-subtab-btn,
body.dark-mode .config-subtab-btn,
html[data-theme="dark"] .legal-subtab-btn,
body.dark-mode .legal-subtab-btn,
html[data-theme="dark"] .admin-users-subtab-btn,
body.dark-mode .admin-users-subtab-btn {
  color: #94a3b8 !important;
}

html[data-theme="dark"] .subtab-btn:hover,
body.dark-mode .subtab-btn:hover,
html[data-theme="dark"] .config-subtab-btn:hover,
body.dark-mode .config-subtab-btn:hover {
  color: #ffffff !important;
  background: rgba(255, 255, 255, 0.06) !important;
}

html[data-theme="dark"] .subtab-btn.active,
body.dark-mode .subtab-btn.active,
html[data-theme="dark"] .config-subtab-btn.active,
body.dark-mode .config-subtab-btn.active {
  color: #ffffff !important;
  background: #242c3e !important;
}

/* Modals & Dialogs */
html[data-theme="dark"] .custom-dialog-box,
body.dark-mode .custom-dialog-box {
  background: #161a26 !important;
  border: 1px solid #262f44 !important;
}

html[data-theme="dark"] .custom-dialog-title,
body.dark-mode .custom-dialog-title {
  color: #ffffff !important;
}

html[data-theme="dark"] .custom-dialog-message,
body.dark-mode .custom-dialog-message {
  color: #94a3b8 !important;
}

html[data-theme="dark"] .btn-dialog-cancel,
body.dark-mode .btn-dialog-cancel {
  background: #202636 !important;
  border-color: #2b3348 !important;
  color: #cbd5e1 !important;
}

/* Footer */
html[data-theme="dark"] .dash-footer,
body.dark-mode .dash-footer {
  background: #0d111a !important;
  border-top: 1px solid #1c2232 !important;
  color: #64748b !important;
}

/* Strategic Card & Live Feed Dark */
html[data-theme="dark"] .paces-strategic-card,
body.dark-mode .paces-strategic-card,
html[data-theme="dark"] .paces-live-feed-card,
body.dark-mode .paces-live-feed-card,
html[data-theme="dark"] .paces-figure-card,
body.dark-mode .paces-figure-card {
  background: #141824 !important;
  border-color: #21283a !important;
}

html[data-theme="dark"] .btn-figure-action,
body.dark-mode .btn-figure-action,
html[data-theme="dark"] .btn-primary-sm,
body.dark-mode .btn-primary-sm {
  background: #4f62b8 !important;
  border-color: #4f62b8 !important;
  color: #ffffff !important;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.4) !important;
}

html[data-theme="dark"] .btn-figure-action:hover,
body.dark-mode .btn-figure-action:hover,
html[data-theme="dark"] .btn-primary-sm:hover,
body.dark-mode .btn-primary-sm:hover {
  background: #6377cf !important;
  border-color: #6377cf !important;
}

html[data-theme="dark"] .figure-pill-badge,
body.dark-mode .figure-pill-badge {
  background: #1c2333 !important;
  border-color: #2b354d !important;
  color: #94a3b8 !important;
}

html[data-theme="dark"] .figure-cuantia-left,
body.dark-mode .figure-cuantia-left {
  color: #cbd5e1 !important;
}

html[data-theme="dark"] .figure-cuantia-val,
body.dark-mode .figure-cuantia-val,
html[data-theme="dark"] .urgency-box-value,
body.dark-mode .urgency-box-value,
html[data-theme="dark"] .figure-mini-val,
body.dark-mode .figure-mini-val {
  color: #f8fafc !important;
}

html[data-theme="dark"] .figure-progress-track,
body.dark-mode .figure-progress-track {
  background: #1c2333 !important;
}

html[data-theme="dark"] .figure-urgency-box.urgency-critical,
body.dark-mode .figure-urgency-box.urgency-critical {
  background: #2b1114 !important;
  border-color: #4a1c22 !important;
}

html[data-theme="dark"] .figure-urgency-box.urgency-warning,
body.dark-mode .figure-urgency-box.urgency-warning {
  background: #2b1c0d !important;
  border-color: #4a2f14 !important;
}

html[data-theme="dark"] .figure-urgency-box.urgency-optimal,
body.dark-mode .figure-urgency-box.urgency-optimal {
  background: #0d261b !important;
  border-color: #15452f !important;
}

html[data-theme="dark"] .figure-urgency-box.urgency-future,
body.dark-mode .figure-urgency-box.urgency-future {
  background: #161c28 !important;
  border-color: #232c3f !important;
}

html[data-theme="dark"] .figure-mini-kpi,
body.dark-mode .figure-mini-kpi {
  background: #161c28 !important;
  border-color: #232c3f !important;
}

html[data-theme="dark"] .strategic-metric-block.urgent-block,
body.dark-mode .strategic-metric-block.urgent-block {
  background: #23190e !important;
  border-color: #422a10 !important;
}

html[data-theme="dark"] .strategic-metric-block.record-block,
body.dark-mode .strategic-metric-block.record-block {
  background: #171d2b !important;
  border-color: #232b3c !important;
}

html[data-theme="dark"] .strategic-metric-num,
body.dark-mode .strategic-metric-num,
html[data-theme="dark"] .feed-entity-name,
body.dark-mode .feed-entity-name {
  color: #f8fafc !important;
}

html[data-theme="dark"] .strategic-entity-name,
body.dark-mode .strategic-entity-name,
html[data-theme="dark"] .feed-tender-desc,
body.dark-mode .feed-tender-desc {
  color: #94a3b8 !important;
}

html[data-theme="dark"] .paces-live-table thead th,
body.dark-mode .paces-live-table thead th {
  background: #171c2a !important;
  color: #94a3b8 !important;
  border-color: #22293b !important;
}

html[data-theme="dark"] .paces-live-table tbody td,
body.dark-mode .paces-live-table tbody td {
  border-color: #1c2232 !important;
  color: #cbd5e1 !important;
}

html[data-theme="dark"] .paces-live-table tbody tr:hover,
body.dark-mode .paces-live-table tbody tr:hover {
  background: #191e2e !important;
}

html[data-theme="dark"] .feed-modality-pill,
body.dark-mode .feed-modality-pill {
  background: #1a2233 !important;
  border-color: #283348 !important;
  color: #93c5fd !important;
}

html[data-theme="dark"] .btn-feed-secop,
body.dark-mode .btn-feed-secop {
  background: #1b2130 !important;
  border-color: #293448 !important;
  color: #cbd5e1 !important;
}

html[data-theme="dark"] .btn-feed-secop:hover,
body.dark-mode .btn-feed-secop:hover {
  background: #252e42 !important;
  color: #ffffff !important;
}



/* ══════════════════════════════════════════════════════════════════════
   DASHBOARD DE MÉTRICAS ESTRATÉGICAS (TAB-METRICAS)
   ══════════════════════════════════════════════════════════════════════ */
.badge-pill-strategic {
  display: inline-flex;
  align-items: center;
  font-size: 0.62rem;
  font-weight: 800;
  padding: 0.15rem 0.45rem;
  border-radius: 999px;
  background: linear-gradient(135deg, rgba(99, 102, 241, 0.15), rgba(168, 85, 247, 0.15));
  color: #6366f1;
  border: 1px solid rgba(99, 102, 241, 0.3);
  margin-left: 0.4rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  vertical-align: middle;
}

.strategic-panel-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1.5rem;
  margin-bottom: 1.5rem;
  flex-wrap: wrap;
}

.strategic-breadcrumbs {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.8rem;
  color: #64748b;
  margin-bottom: 0.35rem;
}

.strategic-breadcrumbs .crumb-link {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  color: #3b82f6;
  text-decoration: none;
  font-weight: 600;
  transition: color 0.15s;
}

.strategic-breadcrumbs .crumb-link:hover {
  color: #2563eb;
  text-decoration: underline;
}

.strategic-breadcrumbs .crumb-sep {
  width: 14px;
  height: 14px;
  color: #94a3b8;
}

.strategic-breadcrumbs .crumb-current {
  color: #1e293b;
  font-weight: 600;
}

.badge-live-pulse {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.15rem 0.5rem;
  border-radius: 999px;
  background: rgba(16, 185, 129, 0.12);
  color: #059669;
  font-size: 0.65rem;
  font-weight: 700;
  border: 1px solid rgba(16, 185, 129, 0.25);
  margin-left: 0.5rem;
}

.pulse-indicator {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #10b981;
  box-shadow: 0 0 0 2px rgba(16, 185, 129, 0.3);
  animation: pulseLive 2s infinite ease-in-out;
}

@keyframes pulseLive {
  0% { transform: scale(0.95); opacity: 0.8; }
  50% { transform: scale(1.3); opacity: 1; box-shadow: 0 0 8px #10b981; }
  100% { transform: scale(0.95); opacity: 0.8; }
}

.strategic-header-actions {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  flex-wrap: wrap;
}

.strategic-period-pills {
  display: inline-flex;
  background: #f1f5f9;
  padding: 0.2rem;
  border-radius: 8px;
  border: 1px solid #e2e8f0;
}

.period-pill {
  border: none;
  background: transparent;
  padding: 0.35rem 0.75rem;
  font-size: 0.78rem;
  font-weight: 600;
  color: #64748b;
  border-radius: 6px;
  cursor: pointer;
  transition: all 0.15s ease;
}

.period-pill:hover {
  color: #1e293b;
}

.period-pill.active {
  background: #ffffff;
  color: #2563eb;
  box-shadow: 0 1px 3px rgba(0,0,0,0.08);
}

/* Barra de Segmentación */
.strategic-toolbar {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)) auto;
  gap: 1rem;
  padding: 1rem 1.25rem;
  margin-bottom: 1.5rem;
  align-items: flex-end;
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
}

.strategic-filter-item {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.strategic-filter-item label {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  font-size: 0.74rem;
  font-weight: 700;
  color: #64748b;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

.strategic-filter-item label i {
  width: 13px;
  height: 13px;
}

.strategic-select {
  width: 100%;
  padding: 0.5rem 0.75rem;
  border: 1px solid #d1d5db;
  border-radius: 8px;
  background: #f8fafc;
  color: #1e293b;
  font-size: 0.82rem;
  font-weight: 500;
  outline: none;
  transition: all 0.15s;
}

.strategic-select:focus {
  border-color: #3b82f6;
  background: #ffffff;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.15);
}

.btn-strategic-reset {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.52rem 0.9rem;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #f8fafc;
  color: #64748b;
  font-size: 0.8rem;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.15s;
  height: 38px;
}

.btn-strategic-reset:hover {
  background: #e2e8f0;
  color: #0f172a;
}

/* 6 KPI Cards */
.strategic-kpi-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 1rem;
  margin-bottom: 1.5rem;
}

.strategic-kpi-card {
  padding: 1.15rem;
  border-radius: 12px;
  background: #ffffff;
  border: 1px solid #e2e8f0;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  transition: transform 0.15s, box-shadow 0.15s;
}

.strategic-kpi-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.05);
}

.strategic-kpi-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  margin-bottom: 0.4rem;
}

.strategic-kpi-label {
  font-size: 0.74rem;
  font-weight: 700;
  color: #64748b;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}

.strategic-kpi-icon {
  width: 32px;
  height: 32px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.strategic-kpi-icon i {
  width: 16px;
  height: 16px;
}

.strategic-kpi-value {
  font-size: 1.65rem;
  font-weight: 800;
  font-family: "Hanken Grotesk", "Outfit", sans-serif;
  color: #0f172a;
  letter-spacing: -0.02em;
  line-height: 1.1;
  margin-bottom: 0.5rem;
}

.strategic-kpi-footer {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}

.strategic-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  font-size: 0.68rem;
  font-weight: 700;
  padding: 0.15rem 0.45rem;
  border-radius: 4px;
  width: fit-content;
}

.strategic-badge.badge-green { background: rgba(16, 185, 129, 0.12); color: #059669; }
.strategic-badge.badge-blue { background: rgba(59, 130, 246, 0.12); color: #2563eb; }
.strategic-badge.badge-cyan { background: rgba(6, 182, 212, 0.12); color: #0891b2; }
.strategic-badge.badge-amber { background: rgba(245, 158, 11, 0.12); color: #d97706; }
.strategic-badge.badge-purple { background: rgba(168, 85, 247, 0.12); color: #9333ea; }
.strategic-badge.badge-rose { background: rgba(244, 63, 94, 0.12); color: #e11d48; }

.strategic-kpi-desc {
  font-size: 0.72rem;
  color: #94a3b8;
}

/* Fila de Inteligencia (2 Columnas) */
.strategic-intelligence-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.25rem;
  margin-bottom: 1.5rem;
}

@media (max-width: 1080px) {
  .strategic-intelligence-row {
    grid-template-columns: 1fr;
  }
}

.strategic-card {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  padding: 1.35rem;
  display: flex;
  flex-direction: column;
}

.strategic-card-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1.25rem;
}

.strategic-card-header .header-text {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
}

.card-icon-tag {
  width: 38px;
  height: 38px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.card-icon-tag i {
  width: 19px;
  height: 19px;
}

.strategic-card-header h3 {
  font-size: 1.05rem;
  font-weight: 700;
  color: #0f172a;
  margin: 0 0 0.2rem 0;
}

.strategic-card-header p {
  font-size: 0.78rem;
  color: #64748b;
  margin: 0;
}

.strategic-live-tag {
  font-size: 0.68rem;
  font-weight: 700;
  color: #3b82f6;
  background: rgba(59, 130, 246, 0.1);
  padding: 0.2rem 0.5rem;
  border-radius: 6px;
  border: 1px solid rgba(59, 130, 246, 0.2);
}

.strategic-stat-total {
  font-size: 0.88rem;
  font-weight: 800;
  color: #0f172a;
  background: #f8fafc;
  padding: 0.25rem 0.65rem;
  border-radius: 6px;
  border: 1px solid #e2e8f0;
}

/* BCG Matrix Grid */
.strategic-bcg-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.85rem;
}

.bcg-quadrant {
  padding: 1rem;
  border-radius: 10px;
  border: 1px solid #e2e8f0;
  background: #f8fafc;
  display: flex;
  flex-direction: column;
  transition: all 0.15s;
}

.bcg-quadrant:hover {
  background: #ffffff;
  border-color: #cbd5e1;
  box-shadow: 0 4px 12px rgba(0,0,0,0.04);
}

.bcg-quadrant.quadrant-star { border-left: 4px solid #10b981; }
.bcg-quadrant.quadrant-cow { border-left: 4px solid #3b82f6; }
.bcg-quadrant.quadrant-speed { border-left: 4px solid #f59e0b; }
.bcg-quadrant.quadrant-dog { border-left: 4px solid #64748b; }

.bcg-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  /* En cuadrantes angostos la etiqueta baja de línea en vez de desbordar. */
  flex-wrap: wrap;
  gap: 0.35rem;
  margin-bottom: 0.35rem;
}

.bcg-label {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
  color: #475569;
}

.bcg-label i { width: 13px; height: 13px; }

.bcg-badge {
  font-size: 0.65rem;
  font-weight: 700;
  padding: 0.1rem 0.35rem;
  border-radius: 4px;
}

.bcg-title {
  font-size: 0.82rem;
  font-weight: 700;
  color: #1e293b;
  margin-bottom: 0.25rem;
}

.bcg-stat {
  font-size: 1.15rem;
  font-weight: 800;
  color: #0f172a;
  margin-bottom: 0.35rem;
}

.bcg-desc {
  font-size: 0.73rem;
  color: #64748b;
  line-height: 1.35;
}

/* Sector Progress Bars */
.strategic-sector-bars {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.strat-sector-row {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.strat-sector-info {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 0.78rem;
}

.strat-sector-name {
  font-weight: 600;
  color: #334155;
  display: flex;
  align-items: center;
  gap: 0.35rem;
}

.strat-sector-nums {
  color: #64748b;
  font-weight: 700;
}

.strat-bar-track {
  width: 100%;
  height: 7px;
  background: #f1f5f9;
  border-radius: 999px;
  overflow: hidden;
}

.strat-bar-fill {
  height: 100%;
  border-radius: 999px;
  transition: width 0.6s ease-out;
}

/* Comparative Modalities Table */
.strategic-table-wrapper {
  overflow-x: auto;
}

.strategic-matrix-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.8rem;
}

.strategic-matrix-table th {
  text-align: left;
  padding: 0.65rem 0.85rem;
  background: #f8fafc;
  color: #64748b;
  font-weight: 700;
  border-bottom: 1px solid #e2e8f0;
  font-size: 0.74rem;
  text-transform: uppercase;
}

.strategic-matrix-table td {
  padding: 0.75rem 0.85rem;
  border-bottom: 1px solid #f1f5f9;
  color: #334155;
}

.strategic-matrix-table tr:hover td {
  background: #f8fafc;
}

/* Top Entities List */
.strategic-entities-list {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}

.strat-entity-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.65rem 0.85rem;
  background: #f8fafc;
  border: 1px solid #f1f5f9;
  border-radius: 8px;
  transition: all 0.15s;
}

.strat-entity-item:hover {
  background: #ffffff;
  border-color: #cbd5e1;
  transform: translateX(2px);
}

.strat-entity-left {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.strat-entity-rank {
  width: 24px;
  height: 24px;
  border-radius: 6px;
  background: #e2e8f0;
  color: #475569;
  font-weight: 800;
  font-size: 0.72rem;
  display: flex;
  align-items: center;
  justify-content: center;
}

.strat-entity-name {
  font-size: 0.82rem;
  font-weight: 700;
  color: #1e293b;
  max-width: 260px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.strat-entity-meta {
  font-size: 0.7rem;
  color: #64748b;
}

.strat-entity-monto {
  font-size: 0.88rem;
  font-weight: 800;
  color: #0f172a;
  text-align: right;
}

/* Simulador Comercial */
.strategic-simulator-card {
  background: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%);
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  padding: 1.5rem;
  margin-bottom: 1.5rem;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.03);
}

.simulator-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  margin-bottom: 1.5rem;
}

.sim-header-left {
  display: flex;
  align-items: center;
  gap: 0.85rem;
}

.sim-icon-glow {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: linear-gradient(135deg, #3b82f6, #6366f1);
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 12px rgba(99, 102, 241, 0.25);
}

.sim-icon-glow i { width: 22px; height: 22px; }

.simulator-header h3 {
  font-size: 1.15rem;
  font-weight: 800;
  color: #0f172a;
  margin: 0 0 0.2rem 0;
}

.simulator-header p {
  font-size: 0.82rem;
  color: #64748b;
  margin: 0;
}

.sim-badge-pro {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.72rem;
  font-weight: 800;
  background: linear-gradient(135deg, #6366f1, #a855f7);
  color: #ffffff;
  padding: 0.35rem 0.75rem;
  border-radius: 999px;
  box-shadow: 0 2px 8px rgba(168, 85, 247, 0.3);
}

.sim-badge-pro i { width: 13px; height: 13px; }

.simulator-body {
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: 1.5rem;
}

@media (max-width: 900px) {
  .simulator-body {
    grid-template-columns: 1fr;
  }
}

.simulator-controls {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  padding: 1.25rem;
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
}

.sim-control-group {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.sim-label-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 0.8rem;
  font-weight: 700;
  color: #475569;
}

.sim-label-row label {
  display: flex;
  align-items: center;
  gap: 0.35rem;
}

.sim-label-row label i { width: 14px; height: 14px; }

.sim-range-val {
  color: #2563eb;
  font-weight: 800;
  font-size: 0.95rem;
}

.sim-range-slider {
  width: 100%;
  accent-color: #3b82f6;
  cursor: pointer;
  height: 6px;
}

.range-marks {
  display: flex;
  justify-content: space-between;
  font-size: 0.65rem;
  color: #94a3b8;
  font-weight: 600;
}

.sim-control-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.85rem;
}

@media (max-width: 600px) {
  .sim-control-row {
    grid-template-columns: minmax(0, 1fr);
  }
}

.sim-control-item {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.sim-control-item label {
  display: flex;
  align-items: center;
  gap: 0.3rem;
  font-size: 0.72rem;
  font-weight: 700;
  color: #64748b;
  text-transform: uppercase;
}

.sim-control-item label i { width: 13px; height: 13px; }

.sim-select {
  padding: 0.55rem 0.75rem;
  border: 1px solid #d1d5db;
  border-radius: 8px;
  background: #f8fafc;
  color: #1e293b;
  font-size: 0.8rem;
  font-weight: 500;
  outline: none;
}

.simulator-results {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.85rem;
}

/* En teléfonos angostos dos tarjetas por fila dejan ~95px por valor y
   palabras como "Convocatorias" (fuente grande) no caben: una columna. */
@media (max-width: 480px) {
  .simulator-results {
    grid-template-columns: minmax(0, 1fr);
  }
}

.sim-result-card {
  padding: 1.15rem;
  border-radius: 12px;
  background: #ffffff;
  border: 1px solid #e2e8f0;
  display: flex;
  flex-direction: column;
}

.sim-res-label {
  font-size: 0.7rem;
  font-weight: 700;
  color: #64748b;
  text-transform: uppercase;
  margin-bottom: 0.25rem;
}

.sim-res-val {
  overflow-wrap: anywhere;
  font-size: 1.45rem;
  font-weight: 800;
  color: #0f172a;
  line-height: 1.2;
  margin-bottom: 0.25rem;
  font-family: "Hanken Grotesk", "Outfit", sans-serif;
}

.sim-result-card.result-tam .sim-res-val { color: #2563eb; }
.sim-result-card.result-opps .sim-res-val { color: #059669; }
.sim-result-card.result-winrate .sim-res-val { color: #7c3aed; }

.sim-res-sub {
  font-size: 0.7rem;
  color: #94a3b8;
}

.sim-result-recommendation {
  grid-column: 1 / -1;
  display: flex;
  align-items: flex-start;
  gap: 0.65rem;
  padding: 0.9rem 1.1rem;
  background: rgba(59, 130, 246, 0.08);
  border: 1px solid rgba(59, 130, 246, 0.2);
  border-radius: 10px;
  color: #1e3a8a;
  font-size: 0.78rem;
  line-height: 1.45;
}

.sim-result-recommendation .rec-icon {
  width: 18px;
  height: 18px;
  color: #3b82f6;
  flex-shrink: 0;
  margin-top: 2px;
}

/* Strategic Live Table */
.strategic-table-card {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  padding: 1.35rem;
}

.table-header-tools {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.search-input-pill {
  position: relative;
  display: flex;
  align-items: center;
}

.search-input-pill i {
  position: absolute;
  left: 10px;
  width: 14px;
  height: 14px;
  color: #94a3b8;
}

.search-input-pill input {
  padding: 0.45rem 0.75rem 0.45rem 2rem;
  border: 1px solid #d1d5db;
  border-radius: 8px;
  background: #f8fafc;
  font-size: 0.8rem;
  color: #1e293b;
  outline: none;
  width: 220px;
  transition: width 0.2s, border-color 0.2s;
}

.search-input-pill input:focus {
  border-color: #3b82f6;
  width: 270px;
  background: #ffffff;
}

.strategic-live-table-wrap {
  overflow-x: auto;
  margin-top: 1rem;
}

.strategic-live-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.8rem;
}

.strategic-live-table th {
  padding: 0.75rem 1rem;
  text-align: left;
  background: #f8fafc;
  color: #64748b;
  font-weight: 700;
  border-bottom: 1px solid #e2e8f0;
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

.strategic-live-table td {
  padding: 0.85rem 1rem;
  border-bottom: 1px solid #f1f5f9;
  color: #334155;
  vertical-align: middle;
}

.strategic-live-table tr:hover td {
  background: #f8fafc;
}

.tender-title-cell {
  max-width: 320px;
}

.tender-title-link {
  font-weight: 700;
  color: #0f172a;
  text-decoration: none;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  line-height: 1.35;
}

.tender-title-link:hover {
  color: #2563eb;
}

.tender-code-sub {
  font-size: 0.7rem;
  color: #64748b;
  font-family: "JetBrains Mono", monospace;
  margin-top: 0.2rem;
}

.tender-val-amount {
  font-weight: 800;
  color: #0f172a;
  font-size: 0.85rem;
}

.badge-modality-pill {
  display: inline-flex;
  padding: 0.15rem 0.5rem;
  border-radius: 999px;
  font-size: 0.7rem;
  font-weight: 600;
  background: #f1f5f9;
  color: #475569;
}

.badge-rup-tag {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  font-size: 0.68rem;
  font-weight: 700;
  padding: 0.15rem 0.45rem;
  border-radius: 4px;
}

.badge-rup-tag.no-rup {
  background: rgba(16, 185, 129, 0.12);
  color: #059669;
}

.badge-rup-tag.req-rup {
  background: rgba(245, 158, 11, 0.12);
  color: #d97706;
}

.tender-table-actions {
  display: flex;
  align-items: center;
  gap: 0.35rem;
}

.btn-table-icon {
  width: 30px;
  height: 30px;
  border-radius: 6px;
  border: 1px solid #e2e8f0;
  background: #ffffff;
  color: #64748b;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.15s;
}

.btn-table-icon:hover {
  background: #f1f5f9;
  color: #0f172a;
  border-color: #cbd5e1;
}

.btn-table-icon.btn-star-track:hover {
  color: #f59e0b;
}

/* ══════════════════════════════════════════════════════════════════════
   DARK MODE OVERRIDES PARA MÉTRICAS ESTRATÉGICAS
   ══════════════════════════════════════════════════════════════════════ */
html[data-theme="dark"] .strategic-card,
body.dark-mode .strategic-card,
html[data-theme="dark"] .strategic-kpi-card,
body.dark-mode .strategic-kpi-card,
html[data-theme="dark"] .strategic-toolbar,
body.dark-mode .strategic-toolbar,
html[data-theme="dark"] .strategic-table-card,
body.dark-mode .strategic-table-card,
html[data-theme="dark"] .strategic-simulator-card,
body.dark-mode .strategic-simulator-card {
  background: #151923 !important;
  border-color: #232a3b !important;
}

html[data-theme="dark"] .strategic-breadcrumbs .crumb-current,
body.dark-mode .strategic-breadcrumbs .crumb-current,
html[data-theme="dark"] .strategic-kpi-value,
body.dark-mode .strategic-kpi-value,
html[data-theme="dark"] .strategic-card-header h3,
body.dark-mode .strategic-card-header h3,
html[data-theme="dark"] .simulator-header h3,
body.dark-mode .simulator-header h3,
html[data-theme="dark"] .sim-res-val,
body.dark-mode .sim-res-val,
html[data-theme="dark"] .tender-title-link,
body.dark-mode .tender-title-link,
html[data-theme="dark"] .tender-val-amount,
body.dark-mode .tender-val-amount,
html[data-theme="dark"] .strat-entity-monto,
body.dark-mode .strat-entity-monto,
html[data-theme="dark"] .bcg-stat,
body.dark-mode .bcg-stat {
  color: #f8fafc !important;
}

html[data-theme="dark"] .strategic-period-pills,
body.dark-mode .strategic-period-pills {
  background: #1a202c !important;
  border-color: #2d3748 !important;
}

html[data-theme="dark"] .period-pill.active,
body.dark-mode .period-pill.active {
  background: #2b3548 !important;
  color: #60a5fa !important;
}

html[data-theme="dark"] .strategic-select,
body.dark-mode .strategic-select,
html[data-theme="dark"] .sim-select,
body.dark-mode .sim-select,
html[data-theme="dark"] .search-input-pill input,
body.dark-mode .search-input-pill input,
html[data-theme="dark"] .btn-strategic-reset,
body.dark-mode .btn-strategic-reset {
  background: #1a202c !important;
  border-color: #2d3748 !important;
  color: #f1f5f9 !important;
}

html[data-theme="dark"] .bcg-quadrant,
body.dark-mode .bcg-quadrant,
html[data-theme="dark"] .strat-entity-item,
body.dark-mode .strat-entity-item,
html[data-theme="dark"] .simulator-controls,
body.dark-mode .simulator-controls,
html[data-theme="dark"] .sim-result-card,
body.dark-mode .sim-result-card {
  background: #1a202c !important;
  border-color: #2d3748 !important;
}

html[data-theme="dark"] .strategic-live-table th,
body.dark-mode .strategic-live-table th,
html[data-theme="dark"] .strategic-matrix-table th,
body.dark-mode .strategic-matrix-table th {
  background: #171c26 !important;
  border-color: #283348 !important;
  color: #94a3b8 !important;
}

html[data-theme="dark"] .strategic-live-table td,
body.dark-mode .strategic-live-table td,
html[data-theme="dark"] .strategic-matrix-table td,
body.dark-mode .strategic-matrix-table td {
  border-color: #1f2737 !important;
  color: #cbd5e1 !important;
}

html[data-theme="dark"] .strategic-live-table tr:hover td,
body.dark-mode .strategic-live-table tr:hover td,
html[data-theme="dark"] .strategic-matrix-table tr:hover td,
body.dark-mode .strategic-matrix-table tr:hover td {
  background: #1a2233 !important;
}

html[data-theme="dark"] .sim-result-recommendation,
body.dark-mode .sim-result-recommendation {
  background: rgba(30, 58, 138, 0.25) !important;
  border-color: rgba(59, 130, 246, 0.3) !important;
  color: #93c5fd !important;
}

html[data-theme="dark"] .strat-entity-rank,
body.dark-mode .strat-entity-rank,
html[data-theme="dark"] .badge-modality-pill,
body.dark-mode .badge-modality-pill,
html[data-theme="dark"] .btn-table-icon,
body.dark-mode .btn-table-icon {
  background: #252e42 !important;
  border-color: #334155 !important;
  color: #cbd5e1 !important;
}


/* ════════════════════════════════════════════════════════════════════
   EXPLORAR · filtros, fechas, resultados y paginación (29-sep-2026)
   Bloque acotado a #tab-explorar: no toca otras pestañas. Usa el primario
   oficial (--color-primary #4557a3) en vez del #0067FF que se había colado,
   y tokens propios para que el tema oscuro no dependa de !important.
   ════════════════════════════════════════════════════════════════════ */
#tab-explorar {
  --xp-surface: #ffffff;
  --xp-surface-2: #f6f7fa;
  --xp-border: #dfe3ea;
  --xp-border-strong: #c3cad8;
  --xp-text: #1e293b;
  --xp-muted: #526270;
  --xp-accent: var(--color-primary, #4557a3);
  --xp-accent-hover: var(--color-primary-hover, #34417a);
  --xp-accent-soft: rgba(69, 87, 163, 0.09);
  --xp-accent-line: rgba(69, 87, 163, 0.45);
  --xp-focus: rgba(69, 87, 163, 0.28);
  --xp-danger: #b42318;
  --xp-skel: #e9ecf2;
  --xp-skel-shine: #f5f6f9;
  --xp-ease: cubic-bezier(0.16, 1, 0.3, 1);
}
html[data-theme="dark"] #tab-explorar,
body.dark-mode #tab-explorar {
  --xp-surface: #141824;
  --xp-surface-2: #10141e;
  --xp-border: #262e42;
  --xp-border-strong: #36415c;
  --xp-text: #e6ebf3;
  --xp-muted: #98a6ba;
  --xp-accent: #8d9cec;
  --xp-accent-hover: #b2bdf4;
  --xp-accent-soft: rgba(141, 156, 236, 0.13);
  --xp-accent-line: rgba(141, 156, 236, 0.5);
  --xp-focus: rgba(141, 156, 236, 0.36);
  --xp-danger: #f19a8f;
  --xp-skel: #1c2232;
  --xp-skel-shine: #252c3f;
  color-scheme: dark;
}

/* ── Panel de filtros ─────────────────────────────────────────────── */
#tab-explorar .xp-filters {
  background: var(--xp-surface);
  border: 1px solid var(--xp-border);
  border-radius: 12px;
  padding: 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.9rem;
  margin-bottom: 1.1rem;
}
/* El boton Actualizar hereda un estilo global que en oscuro queda blanco sin texto. */
#tab-explorar .panel-header .btn-action {
  background: var(--xp-surface);
  border-color: var(--xp-border);
  color: var(--xp-text);
}
#tab-explorar .panel-header .btn-action:hover { border-color: var(--xp-accent); color: var(--xp-accent); }
#tab-explorar .xp-row { display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem; }
#tab-explorar .xp-row-search .explorar-search-box { flex: 1 1 320px; min-width: 0; max-width: none; }
#tab-explorar .table-search-input { background: var(--xp-surface); color: var(--xp-text); border-color: var(--xp-border); height: 40px; }
#tab-explorar .table-search-input:focus { border-color: var(--xp-accent); box-shadow: 0 0 0 3px var(--xp-focus); }
#tab-explorar .btn-clear-search:hover { background: var(--xp-surface-2); color: var(--xp-text); }
#tab-explorar .explorar-search-box .search-icon { left: 0.85rem; display: inline-grid; place-items: center; color: var(--xp-muted); }
#tab-explorar .explorar-search-box .search-icon svg,
#tab-explorar .explorar-search-box .search-icon [data-lucide] { width: 16px; height: 16px; }
#tab-explorar .explorar-search-box .table-search-input { padding-left: 2.5rem; }

#tab-explorar .btn-toggle-ia {
  height: 40px;
  background: var(--xp-surface);
  border-color: var(--xp-border);
  color: var(--xp-muted);
}
#tab-explorar .btn-toggle-ia:hover { border-color: var(--xp-accent); color: var(--xp-accent); }
#tab-explorar .btn-toggle-ia.active {
  background: var(--xp-accent-soft);
  border-color: var(--xp-accent);
  color: var(--xp-accent);
}
#tab-explorar .btn-toggle-ia.active .ia-icon { filter: none; }

#tab-explorar .xp-facets {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(168px, 1fr));
  gap: 0.75rem;
  align-items: end;
}
#tab-explorar .xp-field { display: flex; flex-direction: column; gap: 0.35rem; min-width: 0; }
#tab-explorar .xp-field-label {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: var(--xp-muted);
}
#tab-explorar .xp-field-label [data-lucide],
#tab-explorar .xp-field-label svg { width: 13px; height: 13px; }

#tab-explorar .xp-select,
#tab-explorar .xp-date {
  width: 100%;
  height: 40px;
  padding: 0 0.75rem;
  font-weight: 600;
  font-size: 0.84rem;
  line-height: 1;
  font-family: inherit;
  color: var(--xp-text);
  background: var(--xp-surface);
  border: 1px solid var(--xp-border);
  border-radius: 8px;
  cursor: pointer;
  transition: border-color 160ms var(--xp-ease), background-color 160ms var(--xp-ease), box-shadow 160ms var(--xp-ease);
  min-width: 0;
  max-width: none;
  text-overflow: ellipsis;
}
#tab-explorar .xp-select:hover,
#tab-explorar .xp-date:hover { border-color: var(--xp-border-strong); }
#tab-explorar .xp-select:focus-visible,
#tab-explorar .xp-date:focus-visible {
  outline: none;
  border-color: var(--xp-accent);
  box-shadow: 0 0 0 3px var(--xp-focus);
}
/* Un filtro aplicado se ve aplicado sin tener que leerlo. */
#tab-explorar .xp-select.is-set {
  border-color: var(--xp-accent-line);
  background: var(--xp-accent-soft);
  color: var(--xp-accent-hover);
}

#tab-explorar .xp-range {
  padding: 0.7rem 0.85rem;
  border-radius: 8px;
  background: var(--xp-surface-2);
  border: 1px dashed var(--xp-border-strong);
  gap: 0.6rem;
}
#tab-explorar .xp-range[hidden] { display: none; }
#tab-explorar .xp-range-title { font-size: 0.82rem; font-weight: 700; color: var(--xp-text); }
#tab-explorar .xp-range-sep { font-size: 0.82rem; color: var(--xp-muted); }
#tab-explorar .xp-range .xp-date { width: auto; min-width: 150px; flex: 0 1 170px; cursor: text; }
#tab-explorar .xp-range-error {
  margin: -0.35rem 0 0;
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--xp-danger);
}

/* ── Barra de resultados ──────────────────────────────────────────── */
#tab-explorar .xp-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem 1.25rem;
  margin-bottom: 0.9rem;
}
#tab-explorar .xp-summary { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 0.6rem; min-width: 0; }
#tab-explorar .xp-count {
  font-size: 0.92rem;
  font-weight: 600;
  color: var(--xp-muted);
  font-variant-numeric: tabular-nums;
}
#tab-explorar .xp-count strong { color: var(--xp-text); font-weight: 800; }
#tab-explorar .xp-chips { display: flex; flex-wrap: wrap; gap: 0.4rem; }
#tab-explorar .xp-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  height: 28px;
  padding: 0 0.35rem 0 0.7rem;
  border-radius: 999px;
  border: 1px solid var(--xp-accent-line);
  background: var(--xp-accent-soft);
  color: var(--xp-accent-hover);
  font-weight: 600;
  font-size: 0.76rem;
  line-height: 1;
  font-family: inherit;
  cursor: pointer;
  transition: background-color 160ms var(--xp-ease), border-color 160ms var(--xp-ease);
}
#tab-explorar .xp-chip:hover { border-color: var(--xp-accent); }
#tab-explorar .xp-chip:focus-visible { outline: 2px solid var(--xp-accent); outline-offset: 2px; }
#tab-explorar .xp-chip b { font-weight: 700; color: var(--xp-muted); }
#tab-explorar .xp-chip .xp-chip-x {
  display: inline-grid;
  place-items: center;
  width: 20px;
  height: 20px;
  border-radius: 50%;
}
#tab-explorar .xp-chip:hover .xp-chip-x { background: var(--xp-accent-soft); }
#tab-explorar .xp-chip .xp-chip-x svg,
#tab-explorar .xp-chip .xp-chip-x [data-lucide] { width: 12px; height: 12px; }
#tab-explorar .xp-clear {
  border: 0;
  background: none;
  padding: 0.25rem 0.1rem;
  font-weight: 700;
  font-size: 0.78rem;
  line-height: 1;
  font-family: inherit;
  color: var(--xp-accent);
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 3px;
}
#tab-explorar .xp-clear:hover { color: var(--xp-accent-hover); }
#tab-explorar .xp-clear[hidden] { display: none; }
#tab-explorar .xp-sort { display: inline-flex; align-items: center; gap: 0.5rem; font-size: 0.8rem; font-weight: 600; color: var(--xp-muted); }
#tab-explorar .xp-select-inline { width: auto; height: 36px; }

/* ── Tarjetas ─────────────────────────────────────────────────────── */
#tab-explorar .explorer-card {
  background: var(--xp-surface);
  border-color: var(--xp-border);
  border-radius: 12px;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
  transition: border-color 180ms var(--xp-ease), box-shadow 180ms var(--xp-ease);
}
#tab-explorar .explorer-card:hover {
  transform: none;
  border-color: var(--xp-accent-line);
  box-shadow: 0 8px 20px -10px rgba(35, 45, 90, 0.28);
}
#tab-explorar .explorer-card:focus-visible {
  outline: 2px solid var(--xp-accent);
  outline-offset: 2px;
}
#tab-explorar .explorer-card-title { color: var(--xp-text); font-size: 0.95rem; text-wrap: pretty; }
#tab-explorar .explorer-card-entity { color: var(--xp-muted); }
#tab-explorar .entity-name { color: var(--xp-text); }
#tab-explorar .explorer-schedule-box { background: var(--xp-surface-2); border-color: var(--xp-border); }
#tab-explorar .schedule-label { color: var(--xp-muted); }
#tab-explorar .schedule-val { color: var(--xp-text); }
#tab-explorar .explorer-card-bottom { border-top-color: var(--xp-border); }
#tab-explorar .explorer-val-label { color: var(--xp-muted); }
#tab-explorar .explorer-card-value { font-variant-numeric: tabular-nums; }
#tab-explorar .btn-view-ficha {
  background: var(--xp-surface);
  border-color: var(--xp-border-strong);
  color: var(--xp-text);
}
#tab-explorar .btn-view-ficha:hover { background: var(--xp-accent-soft); border-color: var(--xp-accent); color: var(--xp-accent-hover); }
#tab-explorar .btn-view-ficha:focus-visible,
#tab-explorar .btn-save-pipeline:focus-visible { outline: 2px solid var(--xp-accent); outline-offset: 2px; }

/* ── Estados de carga y vacío ─────────────────────────────────────── */
#tab-explorar .xp-skel-card {
  background: var(--xp-surface);
  border: 1px solid var(--xp-border);
  border-radius: 12px;
  padding: 1.25rem;
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
  min-height: 300px;
}
#tab-explorar .xp-skel {
  border-radius: 6px;
  background: linear-gradient(90deg, var(--xp-skel) 0%, var(--xp-skel-shine) 50%, var(--xp-skel) 100%);
  background-size: 200% 100%;
  animation: xp-shimmer 1.3s linear infinite;
}
#tab-explorar .xp-skel.w-20 { width: 22%; height: 20px; }
#tab-explorar .xp-skel.w-90 { width: 92%; height: 16px; }
#tab-explorar .xp-skel.w-70 { width: 68%; height: 16px; }
#tab-explorar .xp-skel.w-50 { width: 50%; height: 12px; }
#tab-explorar .xp-skel.box { width: 100%; height: 56px; }
#tab-explorar .xp-skel.btn { width: 100%; height: 38px; margin-top: auto; }
@keyframes xp-shimmer { from { background-position: 100% 0; } to { background-position: -100% 0; } }

#tab-explorar .xp-empty {
  grid-column: 1 / -1;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 0.55rem;
  padding: 3rem 1.25rem;
  background: var(--xp-surface);
  border: 1px dashed var(--xp-border-strong);
  border-radius: 12px;
  color: var(--xp-muted);
}
#tab-explorar .xp-empty-icon {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: var(--xp-accent-soft);
  color: var(--xp-accent);
  margin-bottom: 0.25rem;
}
#tab-explorar .xp-empty h3 { margin: 0; font-size: 1.02rem; font-weight: 700; color: var(--xp-text); }
#tab-explorar .xp-empty p { margin: 0; max-width: 46ch; font-size: 0.86rem; line-height: 1.5; }
#tab-explorar .xp-empty .xp-empty-action {
  margin-top: 0.6rem;
  height: 36px;
  padding: 0 1rem;
  border-radius: 8px;
  border: 1px solid var(--xp-accent);
  background: var(--xp-accent);
  color: #ffffff;
  font-weight: 700;
  font-size: 0.8rem;
  line-height: 1;
  font-family: inherit;
  cursor: pointer;
}
html[data-theme="dark"] #tab-explorar .xp-empty .xp-empty-action,
body.dark-mode #tab-explorar .xp-empty .xp-empty-action { color: #0e1220; }
#tab-explorar .xp-empty .xp-empty-action:hover { background: var(--xp-accent-hover); border-color: var(--xp-accent-hover); }

/* ── Paginación ───────────────────────────────────────────────────── */
#tab-explorar .xp-pagination {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem 1rem;
  padding-top: 1.25rem;
}
#tab-explorar .xp-page-info { font-size: 0.82rem; font-weight: 600; color: var(--xp-muted); font-variant-numeric: tabular-nums; }
#tab-explorar .xp-pages { display: flex; align-items: center; gap: 0.3rem; }
#tab-explorar .xp-page-list { display: flex; align-items: center; gap: 0.3rem; }
#tab-explorar .xp-page-btn {
  min-width: 36px;
  height: 36px;
  padding: 0 0.5rem;
  display: inline-grid;
  place-items: center;
  border-radius: 8px;
  border: 1px solid var(--xp-border);
  background: var(--xp-surface);
  color: var(--xp-text);
  font-weight: 700;
  font-size: 0.82rem;
  line-height: 1;
  font-family: inherit;
  font-variant-numeric: tabular-nums;
  cursor: pointer;
  transition: border-color 160ms var(--xp-ease), background-color 160ms var(--xp-ease);
}
#tab-explorar .xp-page-btn svg,
#tab-explorar .xp-page-btn [data-lucide] { width: 16px; height: 16px; }
#tab-explorar .xp-page-btn:hover:not(:disabled):not([aria-current="page"]) { border-color: var(--xp-accent); color: var(--xp-accent); }
#tab-explorar .xp-page-btn:focus-visible { outline: 2px solid var(--xp-accent); outline-offset: 2px; }
#tab-explorar .xp-page-btn[aria-current="page"] {
  background: var(--xp-accent);
  border-color: var(--xp-accent);
  color: #ffffff;
  cursor: default;
}
html[data-theme="dark"] #tab-explorar .xp-page-btn[aria-current="page"],
body.dark-mode #tab-explorar .xp-page-btn[aria-current="page"] { color: #0e1220; }
#tab-explorar .xp-page-btn:disabled { opacity: 0.4; cursor: not-allowed; }
#tab-explorar .xp-page-gap { padding: 0 0.2rem; color: var(--xp-muted); font-weight: 700; }

/* ── Pantallas estrechas ──────────────────────────────────────────── */
@media (max-width: 640px) {
  #tab-explorar .xp-facets { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #tab-explorar .xp-row-search .btn-toggle-ia { flex: 1 1 100%; justify-content: center; }
  #tab-explorar .xp-range .xp-date { flex: 1 1 130px; min-width: 0; }
  #tab-explorar .xp-toolbar { flex-direction: column; align-items: stretch; }
  #tab-explorar .xp-sort { justify-content: space-between; }
  #tab-explorar .xp-pagination { justify-content: center; }
  #tab-explorar .xp-page-info { width: 100%; text-align: center; }
}

@media (prefers-reduced-motion: reduce) {
  #tab-explorar .xp-skel { animation: none; }
  #tab-explorar .explorer-card,
  #tab-explorar .xp-select,
  #tab-explorar .xp-chip,
  #tab-explorar .xp-page-btn { transition: none; }
}

/* Ficha: dato que la fuente no informa. Se distingue de un dato real sin
   competir con el. */
#explorarDetailModal .ficha-sin-dato {
  color: var(--text-muted, #526270) !important;
  font-weight: 500 !important;
}
html[data-theme="dark"] #explorarDetailModal .ficha-sin-dato,
body.dark-mode #explorarDetailModal .ficha-sin-dato {
  color: #98a6ba !important;
}

/* Explorar · nota de frescura de los datos (29-sep). Informativa, no alarma:
   explica por que no hay convocatorias de hoy. */
#tab-explorar .xp-fresh {
  display: flex;
  gap: 0.75rem;
  align-items: flex-start;
  padding: 0.8rem 1rem;
  margin-bottom: 1rem;
  border: 1px solid var(--xp-border);
  border-radius: 12px;
  background: var(--xp-surface-2);
  color: var(--xp-text);
}
#tab-explorar .xp-fresh-icon {
  display: inline-grid;
  place-items: center;
  flex: 0 0 32px;
  height: 32px;
  border-radius: 8px;
  background: var(--xp-accent-soft);
  color: var(--xp-accent);
}
#tab-explorar .xp-fresh-icon svg,
#tab-explorar .xp-fresh-icon [data-lucide] { width: 17px; height: 17px; }
#tab-explorar .xp-fresh-body { min-width: 0; display: flex; flex-direction: column; gap: 0.35rem; }
#tab-explorar .xp-fresh-main { margin: 0; font-size: 0.88rem; line-height: 1.5; max-width: 90ch; }
#tab-explorar .xp-fresh-main strong { font-weight: 700; }
#tab-explorar .xp-fresh-details summary {
  cursor: pointer;
  width: fit-content;
  font-size: 0.8rem;
  font-weight: 700;
  color: var(--xp-accent);
  text-decoration: underline;
  text-underline-offset: 3px;
}
#tab-explorar .xp-fresh-details summary:focus-visible { outline: 2px solid var(--xp-accent); outline-offset: 2px; border-radius: 4px; }
#tab-explorar .xp-fresh-details[open] summary { margin-bottom: 0.5rem; }
#tab-explorar .xp-fresh-details p {
  margin: 0 0 0.6rem;
  max-width: 80ch;
  font-size: 0.82rem;
  line-height: 1.55;
  color: var(--xp-muted);
}
#tab-explorar .xp-fresh-list {
  list-style: none;
  margin: 0 0 0.6rem;
  padding: 0;
  display: grid;
  gap: 0.35rem;
}
#tab-explorar .xp-fresh-list li {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem 0.75rem;
  font-size: 0.8rem;
  color: var(--xp-muted);
  font-variant-numeric: tabular-nums;
}
#tab-explorar .xp-fresh-list li b { color: var(--xp-text); font-weight: 700; min-width: 7.5rem; }
#tab-explorar .xp-fresh-sync { font-size: 0.78rem !important; margin: 0 !important; }


/* Subpestañas de plataforma ocultas para quien no es super-admin (30-sep). */
.config-subtab-btn[hidden] { display: none !important; }

/* Estado de la ingesta (Explorar y Configuraciones > Fuentes), 30-sep. */
.ingesta-estado {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin: 0 0 0.35rem;
  font-size: 0.82rem;
  line-height: 1.4;
  color: var(--text-secondary, #64748b);
}
.ingesta-estado[hidden] { display: none; }
.ingesta-estado strong { color: var(--text-primary, #0f172a); font-weight: 700; }
.ingesta-estado--panel {
  padding: 0.7rem 0.9rem;
  margin-bottom: 1rem;
  border: 1px solid var(--border-light, #e2e8f0);
  border-radius: 12px;
  background: var(--bg-surface, #fff);
}
.ingesta-estado-punto {
  flex: 0 0 auto;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #94a3b8;
}
.ingesta-estado.is-activa .ingesta-estado-punto {
  background: #16a34a;
  box-shadow: 0 0 0 0 rgba(22, 163, 74, 0.45);
  animation: ingesta-pulso 1.6s ease-out infinite;
}
@keyframes ingesta-pulso {
  to { box-shadow: 0 0 0 7px rgba(22, 163, 74, 0); }
}
@media (prefers-reduced-motion: reduce) {
  .ingesta-estado.is-activa .ingesta-estado-punto { animation: none; }
}
[data-theme="dark"] .ingesta-estado strong { color: #f1f5f9; }
[data-theme="dark"] .ingesta-estado--panel { background: rgba(255, 255, 255, 0.03); border-color: rgba(255, 255, 255, 0.1); }

/* Documentos de la empresa (Capacidad Habilitante), 30-sep. */
.docs-emp { margin-top: 1.25rem; }
.docs-emp-head { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0.75rem 1.5rem; align-items: flex-start; margin-bottom: 1rem; }
.docs-emp-head h3 { display: flex; align-items: center; gap: 0.5rem; margin: 0 0 0.3rem; font-size: 1.05rem; }
.docs-emp-head h3 svg { width: 18px; height: 18px; }
.docs-emp-head p { margin: 0; max-width: 70ch; font-size: 0.85rem; color: var(--text-secondary, #64748b); line-height: 1.5; }
.docs-emp-resumen { display: flex; flex-wrap: wrap; gap: 0.4rem; margin: 0; }
.docs-emp-chip { display: inline-flex; align-items: center; gap: 0.3rem; padding: 0.2rem 0.6rem; border-radius: 999px; font-size: 0.75rem; font-weight: 700; background: rgba(100, 116, 139, 0.12); color: var(--text-primary, #0f172a); font-variant-numeric: tabular-nums; }
.docs-emp-chip.is-alerta { background: rgba(217, 119, 6, 0.14); color: #b45309; }
.docs-emp-chip.is-error { background: rgba(220, 38, 38, 0.12); color: #b91c1c; }

.docs-emp-form { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.75rem 1rem; padding: 1rem; margin-bottom: 1.25rem; border: 1px dashed var(--border-light, #cbd5e1); border-radius: 12px; }
.docs-emp-form[hidden] { display: none; }
.docs-emp-campo { display: flex; flex-direction: column; gap: 0.3rem; min-width: 0; }
.docs-emp-campo--ancho { grid-column: span 3; }
.docs-emp-campo label { font-size: 0.8rem; font-weight: 700; }
.docs-emp-opcional { font-weight: 400; color: var(--text-secondary, #64748b); }
.docs-emp-ayuda { font-size: 0.75rem; color: var(--text-secondary, #64748b); }
.docs-emp-acciones { grid-column: span 3; display: flex; justify-content: flex-end; }
.docs-emp-form .status-notice { grid-column: span 3; }
.docs-emp-solo-lectura { font-size: 0.82rem; color: var(--text-secondary, #64748b); margin: 0 0 1rem; }

.docs-emp-lista { display: grid; gap: 0.6rem; }
.docs-emp-cat { border: 1px solid var(--border-light, #e2e8f0); border-radius: 12px; overflow: hidden; }
.docs-emp-cat-head { display: flex; justify-content: space-between; align-items: baseline; gap: 0.75rem; padding: 0.6rem 0.9rem; background: rgba(100, 116, 139, 0.06); }
.docs-emp-cat-head strong { font-size: 0.86rem; }
.docs-emp-cat-head span { font-size: 0.74rem; color: var(--text-secondary, #64748b); text-align: right; }
.docs-emp-cat.is-falta .docs-emp-cat-head strong::after { content: " · falta"; font-weight: 600; color: var(--text-secondary, #94a3b8); }
.docs-emp-doc { display: flex; align-items: center; gap: 0.75rem; padding: 0.65rem 0.9rem; border-top: 1px solid var(--border-light, #e2e8f0); }
.docs-emp-doc-icon { flex: 0 0 34px; height: 34px; display: grid; place-items: center; border-radius: 8px; background: rgba(59, 130, 246, 0.1); color: #2563eb; }
.docs-emp-doc-icon svg { width: 17px; height: 17px; }
.docs-emp-doc-info { flex: 1; min-width: 0; }
.docs-emp-doc-nombre { font-weight: 700; font-size: 0.86rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.docs-emp-doc-meta { font-size: 0.74rem; color: var(--text-secondary, #64748b); overflow-wrap: anywhere; }
.docs-emp-badge { flex: 0 0 auto; padding: 0.15rem 0.55rem; border-radius: 999px; font-size: 0.72rem; font-weight: 700; white-space: nowrap; }
.docs-emp-badge.vigente { background: rgba(22, 163, 74, 0.12); color: #15803d; }
.docs-emp-badge.por_vencer { background: rgba(217, 119, 6, 0.14); color: #b45309; }
.docs-emp-badge.vencido { background: rgba(220, 38, 38, 0.12); color: #b91c1c; }
.docs-emp-doc-btns { display: flex; gap: 0.35rem; flex: 0 0 auto; }
.docs-emp-btn { display: inline-grid; place-items: center; width: 34px; height: 34px; border-radius: 8px; border: 1px solid var(--border-light, #e2e8f0); background: transparent; color: inherit; cursor: pointer; }
.docs-emp-btn:hover { background: rgba(100, 116, 139, 0.1); }
.docs-emp-btn:focus-visible { outline: 2px solid #2563eb; outline-offset: 2px; }
.docs-emp-btn.is-peligro:hover { background: rgba(220, 38, 38, 0.1); color: #b91c1c; }
.docs-emp-btn svg { width: 16px; height: 16px; }
.docs-emp-btn:disabled { opacity: 0.5; cursor: wait; }
.docs-emp-vacio { margin: 0; padding: 0.4rem 0; font-size: 0.85rem; color: var(--text-secondary, #64748b); }

[data-theme="dark"] .docs-emp-chip { color: #e2e8f0; }
[data-theme="dark"] .docs-emp-cat, [data-theme="dark"] .docs-emp-doc, [data-theme="dark"] .docs-emp-btn { border-color: rgba(255, 255, 255, 0.1); }
[data-theme="dark"] .docs-emp-form { border-color: rgba(255, 255, 255, 0.18); }
[data-theme="dark"] .docs-emp-cat-head { background: rgba(255, 255, 255, 0.04); }
[data-theme="dark"] .docs-emp-doc-icon { color: #93c5fd; background: rgba(59, 130, 246, 0.16); }
[data-theme="dark"] .docs-emp-badge.vigente { color: #4ade80; }
[data-theme="dark"] .docs-emp-badge.por_vencer, [data-theme="dark"] .docs-emp-chip.is-alerta { color: #fbbf24; }
[data-theme="dark"] .docs-emp-badge.vencido, [data-theme="dark"] .docs-emp-chip.is-error { color: #f87171; }

@media (max-width: 720px) {
  .docs-emp-form { grid-template-columns: 1fr; }
  .docs-emp-campo--ancho, .docs-emp-acciones, .docs-emp-form .status-notice { grid-column: auto; }
  .docs-emp-doc { flex-wrap: wrap; }
  .docs-emp-doc-info { flex-basis: calc(100% - 50px); }
}
[data-theme="dark"] .docs-emp-form input[type="file"] { color: #0f172a; }

/* Marca del menú lateral (30-sep): el nombre viene de Identidad de Marca y
   puede ser largo ("Plataforma de Convocatorias"). Antes no se ajustaba y el
   botón de fijar el menú quedaba encima del texto; ahora pasa a dos líneas. */
.sidebar-brand-content { flex: 1 1 auto; }
.sidebar-brand-title {
  min-width: 0;
  overflow: hidden;
  white-space: normal;
  font-size: 1.02rem;
  line-height: 1.15;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
#sidebarCollapseBtn { flex-shrink: 0; }

/* Parámetros de ingesta (PERSIST-04), 30-sep. */
.sync-params { margin-top: 1rem; border-top: 1px solid var(--border-light, #e2e8f0); padding-top: 0.75rem; }
.sync-params summary { cursor: pointer; width: fit-content; font-size: 0.85rem; font-weight: 700; }
.sync-params summary:focus-visible { outline: 2px solid #2563eb; outline-offset: 2px; border-radius: 4px; }
.sync-params-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; margin-top: 0.75rem; }
.sync-params-grid .control-group { min-width: 0; }
.sync-params-ayuda { display: block; margin-top: 0.3rem; font-size: 0.74rem; line-height: 1.4; color: var(--text-secondary, #64748b); }
[data-theme="dark"] .sync-params { border-top-color: rgba(255, 255, 255, 0.1); }
@media (max-width: 900px) { .sync-params-grid { grid-template-columns: 1fr; } }



/* ==========================================================================
   BÓVEDA DOCUMENTAL SECOP II — ESTILOS MODERNOS (PACES STYLE)
   ========================================================================== */
.boveda-stats-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 1rem;
  margin-bottom: 1.5rem;
}

.boveda-stat-card {
  background: var(--card-bg, #ffffff);
  border: 1px solid var(--border-color, #e2e8f0);
  border-radius: 12px;
  padding: 1.15rem 1.25rem;
  display: flex;
  align-items: center;
  gap: 1rem;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.boveda-stat-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
}

.stat-icon-wrapper {
  width: 48px;
  height: 48px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(59, 130, 246, 0.08);
  flex-shrink: 0;
}

.stat-icon-wrapper i,
.stat-icon-wrapper svg {
  width: 24px;
  height: 24px;
}

.stat-icon-wrapper.text-primary {
  background: rgba(59, 130, 246, 0.1);
  color: #2563eb;
}

.stat-icon-wrapper.text-success {
  background: rgba(16, 185, 129, 0.1);
  color: #059669;
}

.stat-icon-wrapper.text-warning {
  background: rgba(245, 158, 11, 0.1);
  color: #d97706;
}

.stat-icon-wrapper.text-danger {
  background: rgba(239, 68, 68, 0.1);
  color: #dc2626;
}

.stat-info {
  display: flex;
  flex-direction: column;
}

.stat-value {
  font-size: 1.45rem;
  font-weight: 700;
  color: var(--text-primary, #0f172a);
  line-height: 1.2;
}

.stat-label {
  font-size: 0.8125rem;
  color: var(--text-secondary, #64748b);
  margin-top: 0.2rem;
  font-weight: 500;
}

/* Barra de Progreso de Habilitación */
.boveda-progress-card {
  margin-bottom: 1.5rem;
  padding: 1.25rem 1.5rem;
}

.boveda-progress-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 0.85rem;
}

.boveda-card-title {
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--text-primary, #0f172a);
  margin: 0;
}

.boveda-card-sub {
  font-size: 0.85rem;
  color: var(--text-secondary, #64748b);
  margin: 0.25rem 0 0 0;
}

.boveda-progress-percent {
  font-size: 1.5rem;
  font-weight: 800;
  color: #2563eb;
}

.boveda-progress-bar-bg {
  width: 100%;
  height: 10px;
  background: var(--bg-hover, #f1f5f9);
  border-radius: 999px;
  overflow: hidden;
}

.boveda-progress-bar-fill {
  height: 100%;
  background: linear-gradient(90deg, #3b82f6, #10b981);
  border-radius: 999px;
  transition: width 0.4s ease;
}

/* Filtros en chips */
.boveda-filter-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 1.5rem;
}

.chip-filter {
  padding: 0.45rem 1rem;
  border-radius: 999px;
  font-size: 0.825rem;
  font-weight: 600;
  border: 1px solid var(--border-color, #e2e8f0);
  background: var(--card-bg, #ffffff);
  color: var(--text-secondary, #64748b);
  cursor: pointer;
  transition: all 0.15s ease;
}

.chip-filter:hover {
  background: var(--bg-hover, #f8fafc);
  color: var(--text-primary, #0f172a);
}

.chip-filter.active {
  background: #0f172a;
  color: #ffffff;
  border-color: #0f172a;
}

/* Grid de Tarjetas de Documentos */
.boveda-docs-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
  gap: 1.25rem;
}

.boveda-doc-card {
  background: var(--card-bg, #ffffff);
  border: 1px solid var(--border-color, #e2e8f0);
  border-radius: 12px;
  padding: 1.25rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03);
  transition: all 0.2s ease;
  position: relative;
}

.boveda-doc-card:hover {
  border-color: #cbd5e1;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.06);
}

.boveda-doc-card.has-file {
  border-left: 4px solid #10b981;
}

.boveda-doc-card.is-warning {
  border-left: 4px solid #f59e0b;
}

.boveda-doc-card.is-empty {
  border-left: 4px solid #cbd5e1;
}

.doc-card-header {
  display: flex;
  align-items: flex-start;
  gap: 0.85rem;
  margin-bottom: 0.85rem;
}

.doc-card-icon {
  width: 40px;
  height: 40px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #f1f5f9;
  color: #334155;
  flex-shrink: 0;
}

.doc-card-icon i,
.doc-card-icon svg {
  width: 20px;
  height: 20px;
}

.doc-card-title-group {
  flex: 1;
  min-width: 0;
}

.doc-card-title {
  font-size: 0.975rem;
  font-weight: 700;
  color: var(--text-primary, #0f172a);
  margin: 0 0 0.25rem 0;
  line-height: 1.3;
}

.doc-category-badge {
  display: inline-block;
  font-size: 0.7rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  padding: 0.15rem 0.5rem;
  border-radius: 4px;
  background: #f1f5f9;
  color: #475569;
}

.doc-status-pill {
  font-size: 0.75rem;
  font-weight: 600;
  padding: 0.2rem 0.6rem;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
}

.doc-status-pill.status-ok {
  background: rgba(16, 185, 129, 0.12);
  color: #047857;
}

.doc-status-pill.status-warn {
  background: rgba(245, 158, 11, 0.12);
  color: #b45309;
}

.doc-status-pill.status-empty {
  background: rgba(100, 116, 139, 0.1);
  color: #64748b;
}

.doc-card-desc {
  font-size: 0.8125rem;
  color: var(--text-secondary, #64748b);
  margin: 0 0 1rem 0;
  line-height: 1.4;
}

.doc-card-file-info {
  background: var(--bg-hover, #f8fafc);
  border: 1px solid var(--border-color, #e2e8f0);
  border-radius: 8px;
  padding: 0.75rem;
  margin-bottom: 1rem;
}

.file-info-row {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--text-primary, #0f172a);
  margin-bottom: 0.35rem;
  word-break: break-all;
}

.file-info-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  font-size: 0.75rem;
  color: var(--text-secondary, #64748b);
}

.doc-card-actions {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
  align-items: center;
  padding-top: 0.75rem;
  border-top: 1px solid var(--border-color, #e2e8f0);
}

.btn-doc-action {
  font-size: 0.785rem;
  font-weight: 600;
  padding: 0.35rem 0.65rem;
  border-radius: 6px;
  border: 1px solid var(--border-color, #cbd5e1);
  background: var(--card-bg, #ffffff);
  color: var(--text-primary, #1e293b);
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  cursor: pointer;
  transition: all 0.15s ease;
}

.btn-doc-action:hover {
  background: var(--bg-hover, #f1f5f9);
}

.btn-doc-action.btn-doc-ai {
  background: linear-gradient(135deg, rgba(99, 102, 241, 0.1), rgba(236, 72, 153, 0.1));
  border-color: rgba(99, 102, 241, 0.3);
  color: #4f46e5;
}

.btn-doc-action.btn-doc-ai:hover {
  background: linear-gradient(135deg, rgba(99, 102, 241, 0.18), rgba(236, 72, 153, 0.18));
}

.btn-doc-action.btn-doc-delete {
  color: #dc2626;
  border-color: transparent;
  padding: 0.35rem 0.5rem;
  margin-left: auto;
}

.btn-doc-action.btn-doc-delete:hover {
  background: rgba(239, 68, 68, 0.08);
}

.btn-doc-action.btn-doc-upload-first {
  width: 100%;
  justify-content: center;
  padding: 0.55rem 1rem;
  background: #0f172a;
  color: #ffffff;
  border-color: #0f172a;
}

.btn-doc-action.btn-doc-upload-first:hover {
  background: #1e293b;
}

/* File Dropzone */
.file-dropzone {
  border: 2px dashed var(--border-color, #cbd5e1);
  border-radius: 10px;
  padding: 1.5rem 1rem;
  text-align: center;
  background: var(--bg-hover, #f8fafc);
  cursor: pointer;
  transition: all 0.2s ease;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.35rem;
}

.file-dropzone:hover,
.file-dropzone.dragover {
  border-color: #2563eb;
  background: rgba(37, 99, 235, 0.04);
}

.dropzone-icon {
  width: 36px;
  height: 36px;
  color: #64748b;
  margin-bottom: 0.25rem;
}

.dropzone-title {
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--text-primary, #0f172a);
}

.dropzone-hint {
  font-size: 0.75rem;
  color: var(--text-secondary, #64748b);
}

.file-selected-info {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  background: #ffffff;
  border: 1px solid #10b981;
  border-radius: 8px;
  padding: 0.5rem 0.75rem;
  width: 100%;
  max-width: 400px;
  margin-top: 0.5rem;
}

.file-meta {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-width: 0;
  text-align: left;
}

.file-name {
  font-size: 0.8125rem;
  color: #0f172a;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.file-size {
  font-size: 0.725rem;
  color: #64748b;
}

.btn-remove-file {
  background: none;
  border: none;
  font-size: 1.25rem;
  line-height: 1;
  color: #64748b;
  cursor: pointer;
  padding: 0.2rem 0.4rem;
}

.btn-remove-file:hover {
  color: #dc2626;
}

/* Modales Bóveda */
.boveda-upload-modal-box,
.boveda-audit-modal-box {
  max-width: 580px;
  width: 95%;
  border-radius: 14px;
}

.boveda-modal-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  padding-bottom: 1rem;
  border-bottom: 1px solid var(--border-color, #e2e8f0);
  margin-bottom: 1.25rem;
}

.boveda-modal-title-group {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.modal-icon-badge {
  width: 42px;
  height: 42px;
  border-radius: 10px;
  background: rgba(59, 130, 246, 0.1);
  display: flex;
  align-items: center;
  justify-content: center;
}

.modal-icon-badge.text-accent {
  background: rgba(99, 102, 241, 0.1);
  color: #4f46e5;
}

.boveda-modal-title {
  font-size: 1.15rem;
  font-weight: 700;
  color: var(--text-primary, #0f172a);
  margin: 0;
}

.boveda-modal-sub {
  font-size: 0.825rem;
  color: var(--text-secondary, #64748b);
  margin: 0.2rem 0 0 0;
}

.spinner-ai {
  width: 40px;
  height: 40px;
  border: 3px solid rgba(99, 102, 241, 0.15);
  border-top-color: #6366f1;
  border-radius: 50%;
  animation: spin 0.8s linear infinite;
  margin: 1.5rem auto 1rem;
}

.ia-loading-text {
  text-align: center;
  font-size: 0.875rem;
  color: #6366f1;
  font-weight: 600;
}

.ia-audit-result {
  max-height: 420px;
  overflow-y: auto;
  padding-right: 0.5rem;
}

.ia-audit-item {
  background: var(--bg-hover, #f8fafc);
  border: 1px solid var(--border-color, #e2e8f0);
  border-radius: 10px;
  padding: 1rem;
  margin-bottom: 0.85rem;
}

.ia-audit-item h4 {
  font-size: 0.95rem;
  font-weight: 700;
  margin: 0 0 0.4rem 0;
  display: flex;
  align-items: center;
  gap: 0.4rem;
}

.ia-audit-item p {
  font-size: 0.825rem;
  color: var(--text-secondary, #475569);
  margin: 0;
  line-height: 1.45;
}

/* Dark mode overrides para Bóveda */
html[data-theme="dark"] .boveda-stat-card,
body.dark-mode .boveda-stat-card,
html[data-theme="dark"] .boveda-doc-card,
body.dark-mode .boveda-doc-card,
html[data-theme="dark"] .boveda-progress-card,
body.dark-mode .boveda-progress-card {
  background: #171c26 !important;
  border-color: #283348 !important;
}

html[data-theme="dark"] .doc-card-file-info,
body.dark-mode .doc-card-file-info,
html[data-theme="dark"] .file-dropzone,
body.dark-mode .file-dropzone,
html[data-theme="dark"] .ia-audit-item,
body.dark-mode .ia-audit-item {
  background: #1f2737 !important;
  border-color: #2b364c !important;
}

html[data-theme="dark"] .stat-value,
body.dark-mode .stat-value,
html[data-theme="dark"] .boveda-card-title,
body.dark-mode .boveda-card-title,
html[data-theme="dark"] .doc-card-title,
body.dark-mode .doc-card-title,
html[data-theme="dark"] .boveda-modal-title,
body.dark-mode .boveda-modal-title,
html[data-theme="dark"] .file-name,
body.dark-mode .file-name {
  color: #f1f5f9 !important;
}

html[data-theme="dark"] .chip-filter,
body.dark-mode .chip-filter,
html[data-theme="dark"] .btn-doc-action,
body.dark-mode .btn-doc-action {
  background: #1f2737 !important;
  border-color: #334155 !important;
  color: #cbd5e1 !important;
}

html[data-theme="dark"] .chip-filter.active,
body.dark-mode .chip-filter.active {
  background: #3b82f6 !important;
  border-color: #3b82f6 !important;
  color: #ffffff !important;
}

html[data-theme="dark"] .doc-card-icon,
body.dark-mode .doc-card-icon {
  background: #252e42 !important;
  color: #94a3b8 !important;
}

html[data-theme="dark"] .file-selected-info,
body.dark-mode .file-selected-info {
  background: #171c26 !important;
  border-color: #059669 !important;
}


/* ── Estado de error al cargar una vista (mostrarErrorCarga en dashboard.js) ──
   Sustituye al "Cargando…" cuando la API falla: explica el motivo y ofrece
   reintentar, en vez de dejar la tabla cargando para siempre. */
.load-error-state {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.6rem 0.85rem;
  padding: 1.5rem 1rem;
  text-align: center;
  color: var(--text-muted, #64748b);
}

.load-error-state p {
  margin: 0;
  max-width: 60ch;
  font-size: 0.88rem;
  line-height: 1.5;
  overflow-wrap: anywhere;
}

.load-error-state > svg,
.load-error-state > i {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
  color: #ff6400; /* alerta del Design System */
}

.load-error-retrying {
  margin: 0;
  padding: 1.5rem 1rem;
  text-align: center;
  color: var(--text-muted, #64748b);
}

/* ── Auditoría: KPIs, filtros, paginación y detalle (port de Ariel-DEV) ── */
.audit-header-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
}

.audit-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  align-items: center;
}

.audit-toolbar .table-search-box {
  flex: 1 1 260px;
}

.audit-toolbar .dash-select {
  flex: 0 1 280px;
  min-width: 0;
}

.audit-accion-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  font-weight: 600;
}

.audit-accion-pill svg,
.audit-accion-pill i {
  width: 12px;
  height: 12px;
  flex-shrink: 0;
}

.audit-detail-summary {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 0.75rem;
  margin: 0 0 1.25rem;
  padding: 0.9rem;
  background: var(--bg-card-alt, #f8fafc);
  border: 1px solid var(--border-color, #e2e8f0);
  border-radius: 8px;
}

.audit-detail-summary dt {
  font-size: 0.75rem;
  color: var(--text-muted, #64748b);
}

.audit-detail-summary dd {
  margin: 0.15rem 0 0;
  font-size: 0.85rem;
  font-weight: 600;
  overflow-wrap: anywhere;
}

.audit-detail-mono {
  font-family: 'JetBrains Mono', Consolas, monospace;
}

.audit-detail-label {
  margin: 0 0 0.4rem;
  font-weight: 600;
}

.audit-detail-payload {
  margin: 0;
  padding: 1rem;
  max-height: 280px;
  overflow: auto;
  background: #0f172a;
  color: #e2e8f0;
  border-radius: 8px;
  font-family: 'JetBrains Mono', Consolas, monospace;
  font-size: 0.82rem;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

#modalAuditDetail .modal-header h3 svg {
  width: 20px;
  height: 20px;
  vertical-align: -3px;
  color: #0067FF;
}

.dash-table th.text-right,
.dash-table td.text-right {
  text-align: right;
  white-space: nowrap;
}

/* ── Equipo: barra de licencia y cupos (port de Ariel-DEV) ── */
.team-license-bar {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 1rem;
  margin-bottom: 1.25rem;
}

.team-license-card {
  display: flex;
  align-items: center;
  gap: 0.95rem;
  padding: 0.95rem 1.15rem;
  background: var(--bg-card, #ffffff);
  border: 1px solid var(--border-light, #e2e8f0);
  border-radius: var(--radius-md, 12px);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03);
  min-width: 0;
}

.team-license-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 42px;
  height: 42px;
  border-radius: 10px;
}

.team-license-icon svg {
  width: 20px;
  height: 20px;
}

/* Colores del Design System: primario, innovación y success. */
.team-license-icon.icon-plan {
  background: rgba(0, 103, 255, 0.1);
  color: #0067FF;
}

.team-license-icon.icon-seats {
  background: rgba(144, 51, 147, 0.1);
  color: #903393;
}

.team-license-icon.icon-status {
  background: rgba(29, 170, 97, 0.12);
  color: #1daa61;
}

.team-license-info {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  min-width: 0;
}

.team-license-lbl {
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: var(--text-muted, #64748b);
}

.team-license-val {
  font-size: 1.05rem;
  font-weight: 800;
  color: var(--text-dark, #0f172a);
  overflow-wrap: anywhere;
}

/* Verde/naranja oscurecidos para contraste AA sobre fondo blanco. */
.team-license-val.text-green {
  color: #13804a;
}

.team-license-val.text-amber {
  color: #c24c00;
  font-size: 0.92rem;
}

#openInviteModalBtn:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}

html[data-theme="dark"] .team-license-card,
body.dark-mode .team-license-card {
  background: #1e293b;
  border-color: #334155;
}

html[data-theme="dark"] .team-license-val,
body.dark-mode .team-license-val {
  color: #f1f5f9;
}

html[data-theme="dark"] .team-license-val.text-green,
body.dark-mode .team-license-val.text-green {
  color: #4ade80;
}

html[data-theme="dark"] .team-license-val.text-amber,
body.dark-mode .team-license-val.text-amber {
  color: #ff8a3d;
}

/* ── Kanban: proponente y salida de tarjeta (port de Ariel-DEV) ── */
.kanban-card-proponente {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  margin-top: -0.15rem;
  font-size: 0.75rem;
  font-weight: 600;
  color: #903393; /* innovation del Design System */
  min-width: 0;
}

.kanban-card-proponente svg {
  width: 13px;
  height: 13px;
  flex-shrink: 0;
}

.kanban-card-proponente span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.kanban-card-saliendo {
  opacity: 0.4;
  transform: scale(0.97);
  pointer-events: none;
  transition: opacity 0.2s ease, transform 0.2s ease;
}

@media (prefers-reduced-motion: reduce) {
  .kanban-card-saliendo {
    transition: none;
  }
}

html[data-theme="dark"] .kanban-card-proponente,
body.dark-mode .kanban-card-proponente {
  color: #d08ad2;
}