:root {
  color-scheme: light;
  --crm-bg: #eceef2;
  --crm-surface: #ffffff;
  --crm-inset: #f5f6f8;
  --crm-text: #161b22;
  --crm-secondary: #4a5567;
  --crm-muted: #657184;
  --crm-line: #dfe3e9;
  --crm-line-strong: #c9cfd8;
  --crm-primary: #2360d4;
  --crm-primary-hover: #1b4dae;
  --crm-primary-text: #2360d4;
  --crm-primary-soft: #e8effb;
  --crm-primary-line: #c6d8f5;
  --crm-success: #16704e;
  --crm-success-button: #16704e;
  --crm-success-soft: #e3f2ea;
  --crm-success-line: #c2e0d1;
  --crm-warning: #8a5510;
  --crm-warning-button: #966016;
  --crm-warning-soft: #fbf0dd;
  --crm-warning-line: #ecd9b8;
  --crm-danger: #c02626;
  --crm-danger-button: #c02626;
  --crm-danger-soft: #fdeaea;
  --crm-danger-line: #f3c9c9;
  --crm-purple: #7044b4;
  --crm-purple-button: #7044b4;
  --crm-purple-soft: #f0eafa;
  --crm-purple-line: #d9caef;
  --crm-chat-bg: #efeae2;
  --crm-chat-in: #ffffff;
  --crm-chat-out: #d9fdd3;
  --crm-solid-ink: var(--crm-text);
  --crm-shadow: 0 1px 3px rgb(22 27 34 / .04);
  --crm-overlay-shadow: 0 8px 28px rgb(22 27 34 / .13);
  --crm-menu: 216px;
  --crm-control-radius: 6px;
  --crm-card-radius: 10px;
  --crm-font: "Archivo", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
}

:root[data-tema="oscuro"] {
  color-scheme: dark;
  --crm-bg: #0f141b;
  --crm-surface: #161d26;
  --crm-inset: #1b232e;
  --crm-text: #e7edf5;
  --crm-secondary: #a4b2c4;
  --crm-muted: #91a0b3;
  --crm-line: #27313e;
  --crm-line-strong: #36424f;
  --crm-primary: #356fd4;
  --crm-primary-hover: #326bd0;
  --crm-primary-text: #7ba8f7;
  --crm-primary-soft: #17263f;
  --crm-primary-line: #2d4670;
  --crm-success: #4fbd8c;
  --crm-success-button: #1d7a56;
  --crm-success-soft: #12291f;
  --crm-success-line: #24473a;
  --crm-warning: #dda44e;
  --crm-warning-button: #966016;
  --crm-warning-soft: #2a2214;
  --crm-warning-line: #4b3b1e;
  --crm-danger: #f08585;
  --crm-danger-button: #bb3030;
  --crm-danger-soft: #2c1718;
  --crm-danger-line: #55282a;
  --crm-purple: #b69ae9;
  --crm-purple-button: #7950bb;
  --crm-purple-soft: #251c34;
  --crm-purple-line: #48345f;
  --crm-chat-bg: #0b141a;
  --crm-chat-in: #202c33;
  --crm-chat-out: #005c4b;
  --crm-shadow: 0 1px 3px rgb(0 0 0 / .15);
  --crm-overlay-shadow: 0 10px 34px rgb(0 0 0 / .5);
}

:root[data-tema] { scrollbar-color: var(--crm-line-strong) var(--crm-bg); }

body.crm-ui {
  --bg: var(--crm-bg);
  --bg-2: var(--crm-inset);
  --ink: var(--crm-text);
  --muted: var(--crm-muted);
  --brand: var(--crm-primary);
  --card: var(--crm-surface);
  --line: var(--crm-line);
  --font: var(--crm-font);
  margin: 0;
  background: var(--crm-bg);
  color: var(--crm-text);
  font: 13px/1.45 var(--crm-font);
  -webkit-font-smoothing: antialiased;
  scrollbar-color: var(--crm-line-strong) var(--crm-bg);
}

.crm-ui *, .crm-ui *::before, .crm-ui *::after { box-sizing: border-box; }
.crm-ui [hidden] { display: none !important; }
.crm-ui ::selection { background: var(--crm-primary-soft); color: var(--crm-primary-text); }
.crm-ui ::-webkit-scrollbar { width: 8px; height: 8px; }
.crm-ui ::-webkit-scrollbar-track { background: var(--crm-bg); }
.crm-ui ::-webkit-scrollbar-thumb { background: var(--crm-line-strong); border: 2px solid var(--crm-bg); border-radius: 99px; }
.crm-ui :where(button, input, select, textarea) { font-family: var(--crm-font); }
.crm-ui :where(a, button, input, select, textarea, [tabindex]):focus-visible { outline: 2px solid var(--crm-primary); outline-offset: 2px; }
.crm-ui :where(input, textarea)::placeholder { color: var(--crm-muted); opacity: 1; }
.crm-ui :where(input, select, textarea) { accent-color: var(--crm-primary); }
.crm-ui :where(input, select, textarea):focus { --tw-ring-color: var(--crm-primary-soft); border-color: var(--crm-primary); }
.crm-ui :where(input, select, textarea) option { background: var(--crm-surface); color: var(--crm-text); }

.crm-shell { min-height: 100dvh; }
.crm-workspace { min-width: 0; flex: 1; }
.crm-ui .crm-content { padding: 18px 20px 32px; }
.crm-ui .crm-dashboard { max-width: 1440px; margin: 0 auto; }
.crm-ui .text-white { color: var(--crm-solid-ink); }
.crm-ui .bg-white { background-color: var(--crm-surface); --crm-solid-ink: var(--crm-text); }
.crm-ui .text-gray-400, .crm-ui .text-slate-400, .crm-ui .text-gray-500 { color: var(--crm-muted); }
.crm-ui .bg-slate-50, .crm-ui .bg-gray-50, .crm-ui .bg-slate-800, .crm-ui .bg-gray-800 { background-color: var(--crm-inset); --crm-solid-ink: var(--crm-text); }
.crm-ui .bg-slate-900, .crm-ui .bg-gray-900 { background-color: var(--crm-surface); --crm-solid-ink: var(--crm-text); }
.crm-ui .border-gray-700, .crm-ui .border-slate-700 { border-color: var(--crm-line-strong); }
.crm-ui .text-slate-800, .crm-ui .text-slate-700, .crm-ui .text-slate-600 { color: var(--crm-text); }
.crm-ui .border-slate-200, .crm-ui .border-slate-100 { border-color: var(--crm-line); }
.crm-ui .bg-emerald-600 { background-color: var(--crm-primary); --crm-solid-ink: #fff; }
.crm-ui [class~="hover:bg-emerald-700"]:hover { background-color: var(--crm-primary-hover); }
.crm-ui .bg-slate-50.min-h-screen { background-color: var(--crm-bg); }
.crm-ui .rounded-2xl, .crm-ui .rounded-xl { border-radius: var(--crm-card-radius); }
.crm-ui :is(button, input, select, textarea, a).rounded-2xl,
.crm-ui :is(button, input, select, textarea, a).rounded-xl,
.crm-ui :is(button, input, select, textarea, a).rounded-lg { border-radius: var(--crm-control-radius); }
.crm-ui .shadow-lg, .crm-ui .shadow-xl { box-shadow: var(--crm-shadow); }
.crm-ui :is([role="dialog"], .modal-card, #notifMenu, #userDropdown) { box-shadow: var(--crm-overlay-shadow); }
.crm-ui [class~="hover:scale-[1.02]"]:hover { transform: none; }
.crm-ui .crm-content > .space-y-6 > form { border: 1px solid var(--crm-line); box-shadow: none; }
.crm-ui [data-lead-card] { border-color: var(--crm-line); box-shadow: none; }
.crm-ui [data-lead-card]:hover { border-color: var(--crm-line-strong); }
.crm-ui [data-lead-card][data-almost="1"] { border-color: var(--crm-success-line); background: var(--crm-success-soft); }

.crm-ui #adminSidebar {
  background: var(--crm-surface);
  color: var(--crm-text);
  border-right: 1px solid var(--crm-line);
  scrollbar-width: thin;
}
.crm-ui #adminSidebar > div:first-of-type { padding: 14px 12px 12px; }
.crm-ui #adminSidebar .brand-text { font-size: 14px; font-weight: 750; letter-spacing: -.2px; }
.crm-ui #adminSidebar nav { gap: 2px; padding: 0 10px 18px; }
.crm-ui #adminSidebar nav > .px-3 { padding-left: 0; padding-right: 0; }
.crm-ui #adminSidebar nav a, .crm-ui #adminSidebar nav button {
  gap: 9px;
  min-height: 34px;
  padding: 7px 9px;
  border-radius: var(--crm-control-radius);
  color: var(--crm-secondary);
  font-size: 12.5px;
  font-weight: 550;
  box-shadow: none;
}
.crm-ui #adminSidebar nav a:not(.nav-on):hover, .crm-ui #adminSidebar nav button:hover {
  background: var(--crm-inset);
  color: var(--crm-text);
  box-shadow: none;
}
.crm-ui #adminSidebar nav > a:not(.nav-on) { background: transparent; }
.crm-ui #adminSidebar :is(.nav-on, .sub-on) {
  color: var(--crm-primary-text) !important;
  background: var(--crm-primary-soft) !important;
  box-shadow: none;
  font-weight: 650;
}
.crm-ui #adminSidebar .nav-icon svg { width: 17px; height: 17px; }
.crm-ui #adminSidebar .submenu { margin-left: 16px; margin-top: 2px; gap: 1px; }
.crm-ui #adminSidebar .submenu a { font-size: 12px; min-height: 31px; padding: 6px 9px; }
.crm-ui #sidebarToggle, .crm-ui #mobileSidebarOpen {
  border: 1px solid var(--crm-line);
  background: var(--crm-surface);
  color: var(--crm-secondary);
  border-radius: var(--crm-control-radius);
  width: 30px;
  height: 30px;
}
.crm-ui #availabilityToggle { border-radius: var(--crm-control-radius); padding: 7px 9px; }
.crm-ui .nav-badge { background: var(--crm-inset); color: var(--crm-secondary); border-color: var(--crm-line); }
.crm-ui .nav-badge.hot { background: var(--crm-primary-soft); color: var(--crm-primary-text); border-color: var(--crm-primary-line); }

.crm-ui .crm-topbar {
  position: sticky;
  top: 0;
  z-index: 35;
  min-height: 48px;
  padding: 7px 16px;
  gap: 8px;
  background: var(--crm-surface);
  color: var(--crm-text);
  border-bottom: 1px solid var(--crm-line);
}
.crm-ui .crm-topbar > div:first-child > div { font-size: 13px; font-weight: 650; }
.crm-ui .crm-topbar input, .crm-ui .crm-topbar select { padding: 5px 7px; font-size: 12px; background-color: var(--crm-surface); }
.crm-ui .crm-topbar button { min-height: 32px; font-size: 12px; }
.crm-ui .crm-topbar form button[type="submit"] { padding: 6px 11px; background: var(--crm-primary); color: #fff; }
.crm-ui .crm-topbar #userMenuButton { padding: 5px 8px; }
.crm-theme-toggle {
  width: 32px;
  height: 32px;
  display: inline-grid;
  place-items: center;
  flex: none;
  border: 1px solid var(--crm-line-strong);
  border-radius: var(--crm-control-radius);
  background: var(--crm-surface);
  color: var(--crm-secondary);
  cursor: pointer;
}
.crm-theme-toggle:hover { background: var(--crm-inset); }
.crm-theme-toggle svg { width: 17px; height: 17px; }
.crm-theme-toggle .crm-theme-sun { display: none; }
.crm-ui .crm-login-theme { position: fixed; top: 16px; right: 16px; z-index: 50; }
.crm-ui .login-page { min-height: 100dvh; padding: 24px; background: var(--crm-bg); color: var(--crm-text); }
.crm-ui .login-card { background: var(--crm-surface); border: 1px solid var(--crm-line); border-radius: var(--crm-card-radius); box-shadow: var(--crm-shadow); }
.crm-ui .login-header h1 { font-size: 23px; font-weight: 700; letter-spacing: -.3px; margin: 14px 0 6px; }
.crm-ui .login-badge { background: var(--crm-primary-soft); color: var(--crm-primary-text); border-color: var(--crm-primary-line); }
.crm-ui .login-sub, .crm-ui .login-foot, .crm-ui .login-remember { color: var(--crm-secondary); }
.crm-ui .login-field { color: var(--crm-text); }
.crm-ui .login-field input { background: var(--crm-surface); color: var(--crm-text); border: 1px solid var(--crm-line-strong); border-radius: var(--crm-control-radius); }
.crm-ui .login-field input:focus { outline: 2px solid var(--crm-primary-soft); border-color: var(--crm-primary); }
.crm-ui .login-btn { background: var(--crm-primary); color: #fff; border-radius: var(--crm-control-radius); }
.crm-ui .login-btn:hover { background: var(--crm-primary-hover); opacity: 1; }
.crm-ui .login-link { color: var(--crm-primary-text); }
:root[data-tema="oscuro"] .crm-theme-toggle .crm-theme-sun { display: block; }
:root[data-tema="oscuro"] .crm-theme-toggle .crm-theme-moon { display: none; }

.crm-ui .crm-card, .crm-ui .crm-kpi {
  background: var(--crm-surface);
  border: 1px solid var(--crm-line);
  border-radius: var(--crm-card-radius);
  box-shadow: var(--crm-shadow);
}
.crm-ui .crm-card { padding: 16px 18px; }
.crm-ui .crm-kpi { padding: 13px 14px; min-height: 104px; }
.crm-kpi-heading { display: flex; align-items: flex-start; gap: 8px; justify-content: space-between; color: var(--crm-secondary); font-size: 12px; font-weight: 550; }
.crm-kpi-value { color: var(--crm-text); font-size: 25px; font-weight: 750; letter-spacing: -.4px; margin-top: 10px; line-height: 1.2; font-variant-numeric: tabular-nums; }
.crm-kpi-delta { font-size: 12px; color: var(--crm-muted); margin-top: 6px; }
.crm-kpi-tone { width: 7px; height: 7px; flex: none; margin-top: 5px; border-radius: 99px; background: var(--crm-primary); }
.crm-kpi-tone--success { background: var(--crm-success); }
.crm-kpi-tone--warning { background: var(--crm-warning); }
.crm-kpi-tone--danger { background: var(--crm-danger); }
.crm-ui .crm-content :is(.gap-8, .gap-6) { gap: 14px; }
.crm-ui .crm-content .space-y-6 > :not([hidden]) ~ :not([hidden]) { margin-top: 16px; }
.crm-ui .crm-content table { font-size: 12.5px; }
.crm-ui .crm-content thead th { background: var(--crm-inset); color: var(--crm-secondary); font-size: 11px; font-weight: 650; letter-spacing: .04em; border-color: var(--crm-line); }
.crm-ui .crm-content tbody tr { border-color: var(--crm-line); }
.crm-ui .crm-content tbody td { border-color: var(--crm-line); }
.crm-ui .crm-content tbody tr:hover { background-color: var(--crm-inset); }
.crm-ui .sale-pipeline-dot, .crm-ui .sale-pipeline-connector { border-color: var(--crm-line-strong); }
.crm-ui .sale-pipeline-connector { background: var(--crm-line-strong); }
.crm-ui .sale-pipeline-dot.completed, .crm-ui .sale-pipeline-connector.completed { background: var(--crm-success); border-color: var(--crm-success); }
.crm-ui .sale-pipeline-dot.current { background: var(--crm-primary); border-color: var(--crm-primary); }
.crm-ui .sale-pipeline-label { color: var(--crm-muted); font-size: 8px; }
.crm-ui .sale-pipeline-step.current .sale-pipeline-label { color: var(--crm-primary-text); }
.crm-ui .sale-pipeline-step.completed .sale-pipeline-label { color: var(--crm-success); }

.crm-ui #attendModal .attend-field { color: var(--crm-text) !important; }
.crm-ui #attendModal .attend-field::placeholder { color: var(--crm-primary-text) !important; }
.crm-ui #attendModal .attend-date-input { color-scheme: inherit !important; color: var(--crm-text) !important; }
.crm-ui #attendModal .attend-date-input::-webkit-calendar-picker-indicator { filter: none !important; }
.crm-ui #attendModal .attend-date-input::-webkit-datetime-edit,
.crm-ui #attendModal .attend-date-input::-webkit-datetime-edit-fields-wrapper,
.crm-ui #attendModal .attend-date-input::-webkit-datetime-edit-text,
.crm-ui #attendModal .attend-date-input::-webkit-datetime-edit-month-field,
.crm-ui #attendModal .attend-date-input::-webkit-datetime-edit-day-field,
.crm-ui #attendModal .attend-date-input::-webkit-datetime-edit-year-field { color: var(--crm-text) !important; }
.crm-ui #attendModal select { color: var(--crm-text) !important; }
.crm-ui #attendModal select option { background: var(--crm-surface) !important; color: var(--crm-text) !important; }
.crm-ui #attend_envio_card { --crm-courier: var(--crm-primary-text); }
.crm-ui #attend_envio_card[data-courier="SHALOM"] { --crm-courier: var(--crm-danger); }
.crm-ui #attend_envio_card[data-courier="OLVA"], .crm-ui #attend_envio_card[data-courier="DINSIDES"] { --crm-courier: var(--crm-warning); }
.crm-ui #attend_envio_card[data-courier="PRIVADO"] { --crm-courier: var(--crm-purple); }
.crm-ui #attend_envio_card[data-courier] #attend_courier_inline { color: var(--crm-courier) !important; }
.crm-ui #attend_envio_card[data-courier] #attend_envio_header { color: var(--crm-courier); }
.crm-ui #newLeadModal select option, .crm-ui #callPanelDialog select option { background: var(--crm-surface); color: var(--crm-text); }

.crm-ui .causa-riel:not([hidden]) { background: var(--crm-surface); border-color: var(--crm-line); }
.crm-ui .causa-riel a, .crm-ui .causa-riel button { color: var(--crm-muted); }
.crm-ui .causa-riel a:hover, .crm-ui .causa-riel button:hover { background: var(--crm-inset); color: var(--crm-text); }
.crm-ui .causa-riel .causa-marca, .crm-ui .causa-riel a.on, .crm-ui .causa-riel a.on:hover { background: var(--crm-primary); color: #fff; }
.crm-ui .causa-sep { background: var(--crm-line); }
.crm-ui .causa-riel a.causa-sub.on, .crm-ui .causa-riel a.causa-sub.on:hover { background: var(--crm-primary-soft); color: var(--crm-primary-text); }
.crm-ui .causa-marco:not([hidden]), .crm-ui .causa-marco iframe, .crm-ui .causa-aviso:not([hidden]) { background: var(--crm-bg); color: var(--crm-text); }
.crm-ui .causa-aviso button { background: var(--crm-primary); color: #fff; border-radius: var(--crm-control-radius); }
.crm-ui .causa-toast:not([hidden]) { background: var(--crm-surface); color: var(--crm-text); border: 1px solid var(--crm-line); border-radius: var(--crm-card-radius); box-shadow: var(--crm-overlay-shadow); }

@media (min-width: 768px) {
  .crm-ui #adminSidebar { position: sticky; top: 0; height: 100dvh; min-height: 100dvh; max-height: 100dvh; overflow-y: auto; align-self: flex-start; }
  .sidebar-collapsed .crm-ui #adminSidebar nav > a,
  .sidebar-collapsed .crm-ui #adminSidebar nav > div > button { justify-content: center; gap: 0; padding: 8px; }
  .sidebar-collapsed .crm-ui #adminSidebar .submenu,
  .sidebar-collapsed .crm-ui #adminSidebar .arr { display: none; }
}
@media (min-width: 1024px) {
  .crm-ui #adminSidebar, .sidebar-expanded .crm-ui #adminSidebar { width: var(--crm-menu); }
  .sidebar-collapsed .crm-ui #adminSidebar { width: 56px; }
  .sidebar-collapsed .crm-ui #adminSidebar > div:first-of-type { padding: 14px 10px 12px; }
}
@media (min-width: 768px) and (max-width: 1023px) {
  .crm-ui #adminSidebar { width: 56px; }
  .sidebar-expanded .crm-ui #adminSidebar { width: var(--crm-menu); }
  .crm-ui #adminSidebar > div:first-of-type { padding-left: 10px; padding-right: 10px; }
}
@media (max-width: 767px) {
  .crm-ui .crm-content { padding: 14px 12px 28px; }
  .crm-ui #adminSidebar { width: min(280px, 86vw); }
  .sidebar-collapsed .crm-ui #adminSidebar .nav-text,
  .sidebar-collapsed .crm-ui #adminSidebar .brand-text { display: inline; }
  .sidebar-collapsed .crm-ui #adminSidebar .collapse-label { display: block; }
  .crm-ui .crm-topbar { padding: 8px 10px; gap: 7px; }
  .crm-ui .crm-topbar > div:last-child { gap: 6px; }
  .crm-ui .crm-topbar #userMenuButton { max-width: 110px; }
  .crm-ui .crm-kpi { min-height: 96px; padding: 12px; }
  .crm-ui .crm-dashboard > div:first-child > .grid:first-child { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .crm-ui .crm-card { padding: 14px; }
  .crm-ui .sales-table-wrapper tbody tr { background: var(--crm-surface); border-color: var(--crm-line); border-radius: var(--crm-card-radius); }
  .crm-ui :is(button, [role="button"]) { touch-action: manipulation; }
  .crm-ui .crm-topbar button, .crm-ui #mobileSidebarOpen, .crm-ui #crmThemeToggle { min-width: 36px; min-height: 36px; }
}
@media (max-width: 420px) {
  .crm-ui .crm-topbar > div:first-child { width: calc(100% - 72px); }
  .crm-ui .crm-topbar > form.sm\:hidden { margin-left: auto; }
  .crm-ui .crm-topbar > div:last-child { margin-left: auto; }
}
@media (prefers-reduced-motion: reduce) {
  .crm-ui *, .crm-ui *::before, .crm-ui *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}
@media print {
  body.crm-ui { background: #fff; color: #161b22; padding: 0 !important; }
  .crm-ui #adminSidebar, .crm-ui .crm-topbar, .crm-ui .causa-riel { display: none !important; }
  .crm-ui .crm-content { padding: 0; }
}
.crm-ui [class~="bg-[#005c4b]"] { background-color: var(--crm-chat-out); --crm-solid-ink: var(--crm-text); }

.crm-ui [class~="bg-[#020617]/80"],
.crm-ui [class~="bg-[#080C14]"],
.crm-ui [class~="bg-[#0B1220]"],
.crm-ui [class~="bg-[#0B1220]/80"],
.crm-ui [class~="bg-[#0E1621]"],
.crm-ui [class~="bg-[#0F172A]"],
.crm-ui [class~="bg-[#334155]"],
.crm-ui [class~="bg-[#334155]/40"],
.crm-ui [class~="bg-[#334155]/50"],
.crm-ui [class~="bg-[#374151]"],
.crm-ui [class~="bg-[#374151]/40"],
.crm-ui [class~="bg-[#374151]/60"],
.crm-ui [class~="bg-[#6B7280]"],
.crm-ui [class~="bg-[#6B7280]/10"],
.crm-ui [class~="bg-[#6B7280]/15"],
.crm-ui [class~="bg-[#6B7280]/20"],
.crm-ui [class~="bg-[#9CA3AF]/20"],
.crm-ui [class~="hover:bg-[#1E293B]"]:hover,
.crm-ui [class~="hover:bg-[#334155]"]:hover,
.crm-ui [class~="hover:bg-[#334155]/70"]:hover,
.crm-ui [class~="hover:bg-[#374151]"]:hover,
.crm-ui [class~="hover:bg-[#475569]"]:hover,
.crm-ui [class~="hover:bg-[#4b5563]"]:hover,
.crm-ui [class~="hover:bg-[#6B7280]/25"]:hover,
.crm-ui [class~="hover:bg-[#6B7280]/30"]:hover,
.crm-ui [class~="hover:bg-[#F3F4F6]"]:hover { background-color: var(--crm-inset); --crm-solid-ink: var(--crm-text); }

.crm-ui [class~="bg-[#0369A1]"],
.crm-ui [class~="bg-[#0EA5E9]"],
.crm-ui [class~="bg-[#1D4ED8]"],
.crm-ui [class~="bg-[#38BDF8]"],
.crm-ui [class~="bg-[#3B82F6]"],
.crm-ui [class~="hover:bg-[#0284C7]"]:hover,
.crm-ui [class~="hover:bg-[#1E3A8A]"]:hover,
.crm-ui [class~="hover:bg-[#2563EB]"]:hover,
.crm-ui [class~="hover:bg-[#3B82F6]"]:hover { background-color: var(--crm-primary); --crm-solid-ink: #fff; }

.crm-ui [class~="bg-[#0369A1]/10"],
.crm-ui [class~="bg-[#0369A1]/20"],
.crm-ui [class~="bg-[#06B6D4]/10"],
.crm-ui [class~="bg-[#06B6D4]/15"],
.crm-ui [class~="bg-[#06B6D4]/20"],
.crm-ui [class~="bg-[#0c4a6e]"],
.crm-ui [class~="bg-[#0EA5E9]/10"],
.crm-ui [class~="bg-[#0EA5E9]/15"],
.crm-ui [class~="bg-[#0EA5E9]/20"],
.crm-ui [class~="bg-[#1877F2]/20"],
.crm-ui [class~="bg-[#1D4ED8]/20"],
.crm-ui [class~="bg-[#1E3A8A]/40"],
.crm-ui [class~="bg-[#3B82F6]/10"],
.crm-ui [class~="bg-[#3B82F6]/15"],
.crm-ui [class~="bg-[#3B82F6]/20"],
.crm-ui [class~="bg-[#3B82F6]/30"],
.crm-ui [class~="hover:bg-[#06B6D4]/30"]:hover,
.crm-ui [class~="hover:bg-[#0EA5E9]/20"]:hover,
.crm-ui [class~="hover:bg-[#0EA5E9]/30"]:hover,
.crm-ui [class~="hover:bg-[#3B82F6]/10"]:hover,
.crm-ui [class~="hover:bg-[#3B82F6]/25"]:hover,
.crm-ui [class~="hover:bg-[#3B82F6]/30"]:hover,
.crm-ui [class~="hover:bg-[#3B82F6]/50"]:hover { background-color: var(--crm-primary-soft); --crm-solid-ink: var(--crm-text); }

.crm-ui [class~="bg-[#052E16]"],
.crm-ui [class~="bg-[#0B3B2E]"],
.crm-ui [class~="bg-[#0F2417]"],
.crm-ui [class~="bg-[#0f2a1b]"],
.crm-ui [class~="bg-[#10B981]/10"],
.crm-ui [class~="bg-[#10B981]/15"],
.crm-ui [class~="bg-[#10B981]/20"],
.crm-ui [class~="bg-[#14532D]/40"],
.crm-ui [class~="bg-[#14B8A6]/15"],
.crm-ui [class~="bg-[#16A34A]/20"],
.crm-ui [class~="bg-[#22C55E]/10"],
.crm-ui [class~="bg-[#22C55E]/15"],
.crm-ui [class~="bg-[#22C55E]/20"],
.crm-ui [class~="bg-[#22C55E]/25"],
.crm-ui [class~="bg-[#22C55E]/30"],
.crm-ui [class~="bg-[#25D366]/15"],
.crm-ui [class~="bg-[#25D366]/20"],
.crm-ui [class~="bg-[#34A853]/20"],
.crm-ui [class~="hover:bg-[#16A34A]/30"]:hover,
.crm-ui [class~="hover:bg-[#22C55E]/20"]:hover,
.crm-ui [class~="hover:bg-[#22C55E]/25"]:hover,
.crm-ui [class~="hover:bg-[#22C55E]/30"]:hover,
.crm-ui [class~="hover:bg-[#25D366]/25"]:hover,
.crm-ui [class~="hover:bg-[#25D366]/30"]:hover { background-color: var(--crm-success-soft); --crm-solid-ink: var(--crm-text); }

.crm-ui [class~="bg-[#065F46]"],
.crm-ui [class~="bg-[#10B981]"],
.crm-ui [class~="bg-[#22C55E]"],
.crm-ui [class~="bg-[#25D366]"],
.crm-ui [class~="hover:bg-[#059669]"]:hover,
.crm-ui [class~="hover:bg-[#16A34A]"]:hover,
.crm-ui [class~="hover:bg-[#1EA855]"]:hover,
.crm-ui [class~="hover:bg-[#22C55E]"]:hover { background-color: var(--crm-success-button); --crm-solid-ink: #fff; }

.crm-ui [class~="bg-[#0b141a]"] { background-color: var(--crm-chat-bg); --crm-solid-ink: var(--crm-text); }

.crm-ui [class~="bg-[#111827]"],
.crm-ui [class~="bg-[#111827]/60"],
.crm-ui [class~="bg-[#11202b]"],
.crm-ui [class~="bg-[#1F2937]"],
.crm-ui [class~="focus:bg-[#111827]"]:focus,
.crm-ui [class~="hover:bg-[#111827]"]:hover,
.crm-ui [class~="hover:bg-[#111827]/50"]:hover,
.crm-ui [class~="hover:bg-[#111827]/60"]:hover,
.crm-ui [class~="hover:bg-[#1F2937]"]:hover,
.crm-ui [class~="hover:bg-[#1F2937]/40"]:hover,
.crm-ui [class~="hover:bg-[#1F2937]/50"]:hover { background-color: var(--crm-surface); --crm-solid-ink: var(--crm-text); }

.crm-ui [class~="bg-[#1F2C34]"],
.crm-ui [class~="bg-[#202c33]"] { background-color: var(--crm-chat-in); --crm-solid-ink: var(--crm-text); }

.crm-ui [class~="bg-[#2a1111]"],
.crm-ui [class~="bg-[#7F1D1D]/20"],
.crm-ui [class~="bg-[#7F1D1D]/40"],
.crm-ui [class~="bg-[#EF4444]/10"],
.crm-ui [class~="bg-[#EF4444]/15"],
.crm-ui [class~="bg-[#EF4444]/20"],
.crm-ui [class~="bg-[#F43F5E]/20"],
.crm-ui [class~="bg-[#FF0000]/20"],
.crm-ui [class~="hover:bg-[#EF4444]/10"]:hover,
.crm-ui [class~="hover:bg-[#EF4444]/15"]:hover,
.crm-ui [class~="hover:bg-[#EF4444]/20"]:hover,
.crm-ui [class~="hover:bg-[#EF4444]/25"]:hover,
.crm-ui [class~="hover:bg-[#EF4444]/30"]:hover { background-color: var(--crm-danger-soft); --crm-solid-ink: var(--crm-text); }

.crm-ui [class~="bg-[#2a1f0f]"],
.crm-ui [class~="bg-[#78350F]/40"],
.crm-ui [class~="bg-[#7C2D12]/30"],
.crm-ui [class~="bg-[#F59E0B]/10"],
.crm-ui [class~="bg-[#F59E0B]/15"],
.crm-ui [class~="bg-[#F59E0B]/20"],
.crm-ui [class~="bg-[#F59E0B]/30"],
.crm-ui [class~="bg-[#F59E0B]/5"],
.crm-ui [class~="bg-[#F97316]/20"],
.crm-ui [class~="bg-[#FEF3C7]/10"],
.crm-ui [class~="hover:bg-[#F59E0B]/25"]:hover,
.crm-ui [class~="hover:bg-[#F59E0B]/30"]:hover,
.crm-ui [class~="hover:bg-[#F59E0B]/40"]:hover,
.crm-ui [class~="hover:bg-[#FBBF24]/10"]:hover { background-color: var(--crm-warning-soft); --crm-solid-ink: var(--crm-text); }

.crm-ui [class~="bg-[#4C1D95]/30"],
.crm-ui [class~="bg-[#6D28D9]/10"],
.crm-ui [class~="bg-[#7C3AED]/10"],
.crm-ui [class~="bg-[#8B5CF6]/15"],
.crm-ui [class~="bg-[#8B5CF6]/20"],
.crm-ui [class~="bg-[#A78BFA]/10"],
.crm-ui [class~="bg-[#A78BFA]/20"],
.crm-ui [class~="bg-[#A855F7]/20"],
.crm-ui [class~="bg-[#EC4899]/15"],
.crm-ui [class~="bg-[#EC4899]/20"],
.crm-ui [class~="hover:bg-[#8B5CF6]/25"]:hover,
.crm-ui [class~="hover:bg-[#8B5CF6]/30"]:hover,
.crm-ui [class~="hover:bg-[#8B5CF6]/35"]:hover,
.crm-ui [class~="hover:bg-[#A78BFA]/30"]:hover,
.crm-ui [class~="hover:bg-[#EC4899]/25"]:hover,
.crm-ui [class~="hover:bg-[#EC4899]/30"]:hover { background-color: var(--crm-purple-soft); --crm-solid-ink: var(--crm-text); }

.crm-ui [class~="bg-[#6366F1]"],
.crm-ui [class~="bg-[#7C3AED]"],
.crm-ui [class~="bg-[#8B5CF6]"],
.crm-ui [class~="hover:bg-[#6D28D9]"]:hover,
.crm-ui [class~="hover:bg-[#7C3AED]"]:hover { background-color: var(--crm-purple-button); --crm-solid-ink: #fff; }

.crm-ui [class~="bg-[#991B1B]"],
.crm-ui [class~="bg-[#DC2626]"],
.crm-ui [class~="bg-[#EF4444]"],
.crm-ui [class~="hover:bg-[#DC2626]"]:hover,
.crm-ui [class~="hover:bg-[#EF4444]"]:hover { background-color: var(--crm-danger-button); --crm-solid-ink: #fff; }

.crm-ui [class~="bg-[#F59E0B]"],
.crm-ui [class~="bg-[#FBBF24]"],
.crm-ui [class~="hover:bg-[#D97706]"]:hover,
.crm-ui [class~="hover:bg-[#F59E0B]"]:hover { background-color: var(--crm-warning-button); --crm-solid-ink: #fff; }

.crm-ui [class~="border-[#06B6D4]/40"],
.crm-ui [class~="border-[#0EA5E9]"],
.crm-ui [class~="border-[#0EA5E9]/30"],
.crm-ui [class~="border-[#0EA5E9]/40"],
.crm-ui [class~="border-[#38BDF8]"],
.crm-ui [class~="border-[#38BDF8]/30"],
.crm-ui [class~="border-[#3B82F6]"],
.crm-ui [class~="border-[#3B82F6]/20"],
.crm-ui [class~="border-[#3B82F6]/30"],
.crm-ui [class~="border-[#3B82F6]/40"],
.crm-ui [class~="border-[#3B82F6]/50"],
.crm-ui [class~="focus:border-[#3B82F6]"]:focus,
.crm-ui [class~="hover:border-[#38BDF8]/60"]:hover,
.crm-ui [class~="hover:border-[#3B82F6]"]:hover,
.crm-ui [class~="hover:border-[#60A5FA]"]:hover { border-color: var(--crm-primary-line); }

.crm-ui [class~="border-[#10B981]"],
.crm-ui [class~="border-[#10B981]/30"],
.crm-ui [class~="border-[#10B981]/40"],
.crm-ui [class~="border-[#10B981]/50"],
.crm-ui [class~="border-[#14532d]"],
.crm-ui [class~="border-[#14B8A6]/60"],
.crm-ui [class~="border-[#166534]"],
.crm-ui [class~="border-[#16A34A]/40"],
.crm-ui [class~="border-[#177245]"],
.crm-ui [class~="border-[#22C55E]"],
.crm-ui [class~="border-[#22C55E]/20"],
.crm-ui [class~="border-[#22C55E]/30"],
.crm-ui [class~="border-[#22C55E]/40"],
.crm-ui [class~="border-[#22C55E]/50"],
.crm-ui [class~="border-[#22C55E]/60"],
.crm-ui [class~="border-[#25D366]/40"],
.crm-ui [class~="focus:border-[#22C55E]"]:focus,
.crm-ui [class~="hover:border-[#22C55E]"]:hover,
.crm-ui [class~="hover:border-[#22C55E]/60"]:hover,
.crm-ui [class~="hover:border-[#4ADE80]"]:hover { border-color: var(--crm-success-line); }

.crm-ui [class~="border-[#111827]"],
.crm-ui [class~="border-[#1c2a35]"],
.crm-ui [class~="border-[#1c2b33]"],
.crm-ui [class~="border-[#1F2937]"],
.crm-ui [class~="border-[#232B3A]"],
.crm-ui [class~="border-[#29343d]"],
.crm-ui [class~="border-[#334155]"],
.crm-ui [class~="border-[#334155]/50"],
.crm-ui [class~="border-[#374151]"],
.crm-ui [class~="border-[#374151]/30"],
.crm-ui [class~="border-[#374151]/40"],
.crm-ui [class~="border-[#374151]/50"],
.crm-ui [class~="border-[#374151]/60"],
.crm-ui [class~="border-[#475569]"],
.crm-ui [class~="border-[#475569]/40"],
.crm-ui [class~="border-[#4B5563]"],
.crm-ui [class~="border-[#64748B]"],
.crm-ui [class~="border-[#6B7280]/40"],
.crm-ui [class~="divide-[#1F2937]"] > :not([hidden]) ~ :not([hidden]),
.crm-ui [class~="divide-[#374151]"] > :not([hidden]) ~ :not([hidden]),
.crm-ui [class~="hover:border-[#374151]/70"]:hover,
.crm-ui [class~="hover:border-[#6B7280]"]:hover { border-color: var(--crm-line); }

.crm-ui [class~="border-[#78350f]"],
.crm-ui [class~="border-[#F59E0B]"],
.crm-ui [class~="border-[#F59E0B]/20"],
.crm-ui [class~="border-[#F59E0B]/30"],
.crm-ui [class~="border-[#F59E0B]/40"],
.crm-ui [class~="border-[#F59E0B]/50"],
.crm-ui [class~="border-[#F59E0B]/60"],
.crm-ui [class~="border-[#F59E0B]/70"],
.crm-ui [class~="border-[#F97316]"],
.crm-ui [class~="border-[#FBBF24]"],
.crm-ui [class~="hover:border-[#FBBF24]"]:hover { border-color: var(--crm-warning-line); }

.crm-ui [class~="border-[#7C3AED]"],
.crm-ui [class~="border-[#7C3AED]/40"],
.crm-ui [class~="border-[#8B5CF6]/40"],
.crm-ui [class~="border-[#A78BFA]"],
.crm-ui [class~="border-[#A78BFA]/20"],
.crm-ui [class~="border-[#A78BFA]/30"],
.crm-ui [class~="border-[#A78BFA]/40"],
.crm-ui [class~="border-[#A855F7]/20"],
.crm-ui [class~="border-[#A855F7]/30"],
.crm-ui [class~="border-[#EC4899]/40"],
.crm-ui [class~="focus:border-[#8B5CF6]"]:focus,
.crm-ui [class~="hover:border-[#A78BFA]"]:hover { border-color: var(--crm-purple-line); }

.crm-ui [class~="border-[#7f1d1d]"],
.crm-ui [class~="border-[#EF4444]"],
.crm-ui [class~="border-[#EF4444]/30"],
.crm-ui [class~="border-[#EF4444]/40"],
.crm-ui [class~="border-[#EF4444]/50"],
.crm-ui [class~="border-[#EF4444]/60"],
.crm-ui [class~="hover:border-[#EF4444]/60"]:hover,
.crm-ui [class~="hover:border-[#F87171]"]:hover { border-color: var(--crm-danger-line); }

.crm-ui [class~="focus:ring-[#22C55E]"]:focus,
.crm-ui [class~="focus:ring-[#38BDF8]"]:focus,
.crm-ui [class~="focus:ring-[#3B82F6]"]:focus,
.crm-ui [class~="focus:ring-[#6366F1]"]:focus,
.crm-ui [class~="focus:ring-[#8B5CF6]"]:focus,
.crm-ui [class~="focus:ring-[#EF4444]"]:focus,
.crm-ui [class~="focus:ring-[#F59E0B]"]:focus,
.crm-ui [class~="ring-[#22C55E]"],
.crm-ui [class~="ring-[#EF4444]"],
.crm-ui [class~="ring-[#F59E0B]"],
.crm-ui [class~="ring-[#F59E0B]/40"],
.crm-ui [class~="ring-[#F59E0B]/50"],
.crm-ui [class~="ring-[#F97316]"] { --tw-ring-color: var(--crm-primary); }

.crm-ui [class~="hover:text-[#22C55E]"]:hover,
.crm-ui [class~="hover:text-[#86EFAC]"]:hover,
.crm-ui [class~="text-[#04140A]"],
.crm-ui [class~="text-[#06240f]"],
.crm-ui [class~="text-[#10B981]"],
.crm-ui [class~="text-[#15803D]"],
.crm-ui [class~="text-[#22C55E]"],
.crm-ui [class~="text-[#25D366]"],
.crm-ui [class~="text-[#34D399]"],
.crm-ui [class~="text-[#4ADE80]"],
.crm-ui [class~="text-[#7fd1a3]"],
.crm-ui [class~="text-[#86EFAC]"],
.crm-ui [class~="text-[#A7F3D0]"],
.crm-ui [class~="text-[#B7F0CC]"],
.crm-ui [class~="text-[#BBF7D0]"],
.crm-ui [class~="text-[#D1FAE5]"] { color: var(--crm-success); }

.crm-ui [class~="hover:text-[#3B82F6]"]:hover,
.crm-ui [class~="hover:text-[#60A5FA]"]:hover,
.crm-ui [class~="hover:text-[#BAE6FD]"]:hover,
.crm-ui [class~="text-[#06B6D4]"],
.crm-ui [class~="text-[#082f49]"],
.crm-ui [class~="text-[#0EA5E9]"],
.crm-ui [class~="text-[#22D3EE]"],
.crm-ui [class~="text-[#38BDF8]"],
.crm-ui [class~="text-[#3B82F6]"],
.crm-ui [class~="text-[#60A5FA]"],
.crm-ui [class~="text-[#67E8F9]"],
.crm-ui [class~="text-[#7DD3FC]"],
.crm-ui [class~="text-[#93C5FD]"],
.crm-ui [class~="text-[#BAE6FD]"],
.crm-ui [class~="text-[#BFDBFE]"] { color: var(--crm-primary-text); }

.crm-ui [class~="hover:text-[#9CA3AF]"]:hover,
.crm-ui [class~="placeholder-[#6B7280]"]::placeholder,
.crm-ui [class~="text-[#374151]"],
.crm-ui [class~="text-[#475569]"],
.crm-ui [class~="text-[#4B5563]"],
.crm-ui [class~="text-[#64748B]"],
.crm-ui [class~="text-[#6B7280]"],
.crm-ui [class~="text-[#8aa0ad]"],
.crm-ui [class~="text-[#9CA3AF]"],
.crm-ui [class~="text-[#F3F4F6]"] { color: var(--crm-muted); }

.crm-ui [class~="hover:text-[#A78BFA]"]:hover,
.crm-ui [class~="text-[#4C1D95]"],
.crm-ui [class~="text-[#8B5CF6]"],
.crm-ui [class~="text-[#A78BFA]"],
.crm-ui [class~="text-[#A855F7]"],
.crm-ui [class~="text-[#C4B5FD]"],
.crm-ui [class~="text-[#E9D5FF]"],
.crm-ui [class~="text-[#EC4899]"],
.crm-ui [class~="text-[#F472B6]"] { color: var(--crm-purple); }

.crm-ui [class~="hover:text-[#EF4444]"]:hover,
.crm-ui [class~="text-[#9F1239]"],
.crm-ui [class~="text-[#EF4444]"],
.crm-ui [class~="text-[#EF4444]/60"],
.crm-ui [class~="text-[#EF4444]/80"],
.crm-ui [class~="text-[#F87171]"],
.crm-ui [class~="text-[#FB7185]"],
.crm-ui [class~="text-[#FCA5A5]"] { color: var(--crm-danger); }

.crm-ui [class~="hover:text-[#F9FAFB]"]:hover,
.crm-ui [class~="text-[#0B1220]"],
.crm-ui [class~="text-[#111827]"],
.crm-ui [class~="text-[#CBD5E1]"],
.crm-ui [class~="text-[#D1D5DB]"],
.crm-ui [class~="text-[#E2E8F0]"],
.crm-ui [class~="text-[#E5E7EB]"],
.crm-ui [class~="text-[#e9edef]"],
.crm-ui [class~="text-[#F9FAFB]"] { color: var(--crm-solid-ink); }

.crm-ui [class~="hover:text-[#FBBF24]"]:hover,
.crm-ui [class~="text-[#EAB308]"],
.crm-ui [class~="text-[#F59E0B]"],
.crm-ui [class~="text-[#F97316]"],
.crm-ui [class~="text-[#FBBF24]"],
.crm-ui [class~="text-[#FCD34D]"],
.crm-ui [class~="text-[#FDBA74]"],
.crm-ui [class~="text-[#FDE68A]"] { color: var(--crm-warning); }

.crm-ui :is(button[type="submit"], #openFreeSaleModal)[class~="bg-[#22C55E]"],
.crm-ui .crm-primary-action { background-color: var(--crm-primary); color: #fff; --crm-solid-ink: #fff; }
.crm-ui :is(button[type="submit"], #openFreeSaleModal)[class~="bg-[#22C55E]"]:hover,
.crm-ui .crm-primary-action:hover { background-color: var(--crm-primary-hover); }

/* ===== Legibilidad (2-nov-2026): colores fijos pensados solo para fondo oscuro ===== */
/* Botones solidos con letra oscura: el tema cambia el fondo y la letra quedaba igual a el. */
.crm-ui :is([class~="bg-[#22C55E]"],[class~="bg-[#38BDF8]"],[class~="bg-[#0EA5E9]"],[class~="bg-[#25D366]"]):is([class~="text-[#04140A]"],[class~="text-[#06240f]"],[class~="text-[#082f49]"],[class~="text-[#052E16]"],[class~="text-[#0B1220]"]) { color: #fff !important; }
/* Pestanas y botones verdes con letra blanca: verde mas oscuro para que se lea. */
.crm-ui .conn-btn-save, .crm-ui .prod-tab.active, .crm-ui .prof-tab.active { background: #15803D !important; border-color: #15803D !important; color: #fff !important; }
.crm-ui .conn-btn-test { color: var(--crm-primary) !important; border-color: var(--crm-primary) !important; }
.crm-ui .conn-btn-docs { color: var(--crm-secondary) !important; border-color: var(--crm-line-strong, #9CA3AF) !important; }
.crm-ui .conn-info code { color: var(--crm-primary) !important; }
/* Tienda Online tenia tema propio solo oscuro: en claro usa los colores del CRM. */
:root:not([data-tema="oscuro"]) .tema-tienda {
  --t-bg: var(--crm-bg); --t-card: var(--crm-surface); --t-card2: var(--crm-inset); --t-line: var(--crm-line-strong, #D5DAE1);
  --t-ink: var(--crm-text); --t-muted: var(--crm-secondary); --t-dim: var(--crm-secondary);
  --t-ac: var(--crm-primary); --t-ac-d: var(--crm-primary); --t-ac-soft: var(--crm-primary-soft); --t-ac-ink: #fff;
  --t-ok: #15803D; --t-warn: #B45309; --t-bad: #B91C1C;
}
/* Encabezados con degradado oscuro fijo: texto siempre claro, en ambos modos. */
.crm-ui .crm-hero, .crm-ui .crm-hero :is(div, p, span, b, strong, h1, h2, a) { color: #fff !important; }