:root{--bg:#f4f7fb;--card:#fff;--primary:#2f63ff;--text:#1c2434;--muted:#6d7788;--border:#e5e9f2}*{box-sizing:border-box}body{margin:0;font-family:Arial,sans-serif;color:var(--text);background:var(--bg)}.layout{display:flex;min-height:100vh}.sidebar{width:240px;background:#101828;color:#fff;padding:18px}.sidebar .brand{font-size:1.3rem;font-weight:700;margin-bottom:20px}.sidebar nav{display:flex;flex-direction:column;gap:8px}.sidebar a{color:#d7e0f5;text-decoration:none;padding:8px 10px;border-radius:8px}.sidebar a:hover{background:#1f314f}.content{flex:1;padding:22px}.topbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;margin-bottom:14px}.card{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:14px}.card h3{margin:0 0 8px;color:var(--muted);font-size:.9rem}.card p{margin:0;font-size:1.6rem;font-weight:700}.panel-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.panel{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:14px;margin-bottom:12px;overflow:auto}table{width:100%;border-collapse:collapse}th,td{border-bottom:1px solid var(--border);padding:9px;font-size:.9rem;text-align:left}.btn{background:var(--primary);color:#fff;border:none;border-radius:8px;padding:9px 12px;cursor:pointer;text-decoration:none;display:inline-block}.grid-form{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px}.grid-form label{display:flex;flex-direction:column;gap:6px;font-size:.9rem}input,select,textarea{width:100%;border:1px solid var(--border);border-radius:8px;padding:9px;background:#fff}textarea{min-height:90px;resize:vertical}.check{flex-direction:row!important;align-items:center;gap:8px!important}.filters{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:8px;margin-bottom:10px}.thumb{width:100px;border-radius:10px}.sim-output{white-space:pre-wrap;border:1px dashed var(--border);padding:10px;border-radius:10px;background:#fafcff}.login-body{display:grid;place-items:center;min-height:100vh}.login-card{width:min(420px,90%);background:#fff;border:1px solid var(--border);border-radius:14px;padding:22px}.alert.error{background:#ffe2e2;color:#8c1818;border-radius:8px;padding:10px;margin-bottom:8px}@media (max-width:960px){.layout{flex-direction:column}.sidebar{width:100%}.panel-grid{grid-template-columns:1fr}}
.landing-body{background:linear-gradient(180deg,#f8fbff 0%,#eef3ff 100%)}.landing-container{width:min(1120px,92%);margin:0 auto}.landing-header{position:sticky;top:0;background:rgba(255,255,255,.88);backdrop-filter:blur(8px);border-bottom:1px solid var(--border);z-index:50}.nav-wrap{display:flex;justify-content:space-between;align-items:center;padding:12px 0}.logo{font-weight:800;font-size:1.2rem;color:#1a2a57}.nav-cta{display:flex;gap:10px}.btn.ghost{background:#fff;color:#1f3f9e;border:1px solid #c8d4ff}.hero{padding:56px 0 30px}.hero-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:24px;align-items:start}.pill{display:inline-block;background:#e3ebff;color:#2749b3;padding:8px 12px;border-radius:999px;font-size:.85rem;font-weight:700}.hero h1{font-size:clamp(1.8rem,4vw,3rem);line-height:1.1;margin:14px 0}.hero p{font-size:1.05rem;color:#455067;max-width:62ch}.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:18px}.btn.large{padding:12px 16px;font-weight:700}.hero-card{background:#fff;border:1px solid var(--border);border-radius:16px;padding:18px;box-shadow:0 10px 25px rgba(26,42,87,.08)}.hero-card h3{margin-top:0}.hero-card ul{margin:0;padding-left:18px;display:grid;gap:9px}.landing-section{padding:28px 0}.landing-section h2{margin:0 0 14px}.steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.step-card{background:#fff;border:1px solid var(--border);border-radius:14px;padding:16px}.step-card span{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#dfe8ff;color:#2647b1;font-weight:700}.step-card h3{margin:10px 0 6px}.step-card p{margin:0;color:#556077}.landing-section.alt{background:#ffffff85;border-top:1px solid #e9efff;border-bottom:1px solid #e9efff}.benefits{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.benefit{background:#fff;border:1px solid var(--border);border-radius:12px;padding:12px;font-weight:700;color:#2c3750}.landing-cta{padding:36px 0 56px}.cta-box{background:#1a2a57;color:#fff;border-radius:18px;padding:30px;text-align:center}.cta-box p{color:#d8e2ff;max-width:700px;margin:8px auto 20px}.cta-box .btn{background:#4f86ff}.cta-box .btn:hover{background:#3f79fc}@media (max-width:960px){.hero-grid,.steps,.benefits{grid-template-columns:1fr}.hero{padding-top:36px}.nav-wrap{gap:8px}.nav-cta{flex-wrap:wrap;justify-content:flex-end}}
.landing-body{position:relative;background:radial-gradient(circle at 10% 10%,#dce8ff 0%,#f6f9ff 38%,#edf3ff 100%)}.landing-body:before,.landing-body:after{content:"";position:fixed;border-radius:50%;filter:blur(50px);z-index:-1;opacity:.7}.landing-body:before{width:280px;height:280px;background:#aac2ff;top:90px;left:-80px}.landing-body:after{width:340px;height:340px;background:#d7a7ff;bottom:-80px;right:-100px}.logo{font-size:1.35rem;letter-spacing:.2px}.hero{padding:64px 0 34px}.hero-copy h1{font-size:clamp(2.1rem,4.6vw,3.5rem);color:#102145;max-width:15ch}.hero-copy p{font-size:1.08rem;line-height:1.65}.hero-actions .btn{box-shadow:0 10px 24px rgba(47,99,255,.2)}.hero-actions .btn.ghost{box-shadow:none}.social-proof{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:18px;max-width:680px}.social-proof div{background:#ffffffd4;border:1px solid #dbe5ff;border-radius:12px;padding:10px}.social-proof strong{display:block;font-size:1.25rem;color:#18367e}.social-proof span{font-size:.85rem;color:#56617a}.hero-visual{position:relative;min-height:480px}.orb{position:absolute;border-radius:50%;filter:blur(4px)}.orb-a{width:190px;height:190px;background:linear-gradient(145deg,#7ea8ff,#b5c8ff);top:-20px;right:30px}.orb-b{width:120px;height:120px;background:linear-gradient(145deg,#e9b7ff,#cfa8ff);bottom:20px;left:0}.mockup-card{position:relative;background:linear-gradient(160deg,#ffffff,#f3f7ff);border:1px solid #d8e3ff;border-radius:22px;padding:14px;box-shadow:0 28px 55px rgba(18,41,108,.18);z-index:2}.mockup-top{display:flex;gap:6px;padding:4px 2px 12px}.dot{width:9px;height:9px;border-radius:50%;background:#c7d6ff}.agent-row{display:flex;gap:12px;align-items:center;background:#edf3ff;border:1px solid #d9e5ff;padding:10px;border-radius:14px}.agent-avatar{width:68px;height:68px;flex-shrink:0}.agent-row h3{margin:0;color:#11224b}.agent-row p{margin:4px 0 0;font-size:.85rem;color:#4f5b74}.chat-bubble{margin-top:10px;padding:10px 12px;border-radius:12px;font-size:.9rem;line-height:1.4}.chat-bubble.in{background:#ffffff;border:1px solid #dce7ff}.chat-bubble.out{background:linear-gradient(140deg,#315fdc,#5779ea);color:#fff}.floating-kpi{position:absolute;background:#fff;border:1px solid #d7e2ff;border-radius:12px;padding:10px 12px;box-shadow:0 12px 25px rgba(29,56,128,.18);font-size:.82rem;z-index:3}.floating-kpi strong{display:block;font-size:1.12rem;color:#18367e}.kpi-one{left:-24px;top:95px}.kpi-two{right:-16px;bottom:34px}.sales-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.sales-card{background:linear-gradient(160deg,#fff,#f6f9ff);border:1px solid #dbe4ff;border-radius:14px;padding:16px;box-shadow:0 8px 20px rgba(22,44,108,.08)}.sales-card h3{margin:0 0 6px;color:#15295a}.sales-card p{margin:0;color:#57637b}.benefit{position:relative;overflow:hidden}.benefit:before{content:"";position:absolute;width:68px;height:68px;border-radius:50%;background:#eef3ff;right:-20px;top:-28px}.cta-box{background:linear-gradient(135deg,#172a5d,#2e4ca1)}.cta-box .btn{font-size:1rem;padding:12px 20px;border-radius:10px}@media (max-width:960px){.hero{padding-top:40px}.social-proof,.sales-grid{grid-template-columns:1fr}.hero-visual{min-height:auto}.kpi-one,.kpi-two{position:static;margin-top:10px;display:inline-block}.mockup-card{margin-top:8px}}
.channel-tags{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}.channel-tags span{display:inline-block;padding:6px 10px;border-radius:999px;background:#eef3ff;color:#29448d;font-size:.75rem;font-weight:700}.channel-tags .wa{background:#e8ffef;color:#0f8a43}
.whatsapp-section{padding-top:12px}.whatsapp-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:14px}.whatsapp-card{background:linear-gradient(145deg,#0f8a43,#19a653);color:#fff;border-radius:18px;padding:22px;box-shadow:0 20px 45px rgba(11,113,53,.35)}.wa-icon{width:58px;height:58px;background:#fff;border-radius:14px;display:grid;place-items:center;margin-bottom:10px}.wa-icon svg{width:40px;height:40px}.whatsapp-card h2{margin:0 0 8px;font-size:clamp(1.5rem,3vw,2rem)}.whatsapp-card p{color:#e7ffef}.wa-points{display:grid;gap:8px;margin:14px 0}.wa-points span{background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.25);padding:9px;border-radius:10px;font-weight:700}.wa-btn{background:#fff;color:#0f8a43;font-weight:800}.wa-flow{background:#fff;border:1px solid #dce7ff;border-radius:18px;padding:18px;box-shadow:0 12px 28px rgba(15,57,133,.1)}.wa-flow h3{margin:0 0 10px;color:#173470}.flow-step{display:flex;gap:8px;align-items:flex-start;background:#f7faff;border:1px solid #e4ecff;border-radius:10px;padding:10px;margin-bottom:8px;color:#3f4f6f}.flow-step strong{color:#18367e}
.floating-whatsapp{position:fixed;right:16px;bottom:16px;background:linear-gradient(140deg,#14a34f,#25d366);color:#fff;text-decoration:none;padding:12px 16px;border-radius:999px;font-weight:800;box-shadow:0 14px 28px rgba(17,127,65,.45);z-index:60}
.floating-whatsapp-card{
  position:fixed;
  right:16px;
  bottom:72px;
  display:flex;
  align-items:center;
  gap:10px;
  text-decoration:none;
  color:#0f8a43;
  background:#fff;
  border:1px solid #b8efcf;
  border-radius:16px;
  padding:10px 12px;
  max-width:290px;
  box-shadow:0 14px 30px rgba(17,127,65,.24);
  z-index:60;
}
.wa-badge-icon{
  width:44px;
  height:44px;
  display:grid;
  place-items:center;
  border-radius:12px;
  background:#ecfff4;
  flex-shrink:0;
}
.wa-badge-icon svg{
  width:28px;
  height:28px;
}
.wa-copy{display:grid;gap:2px}
.floating-whatsapp-card strong{
  font-size:.82rem;
  line-height:1.15;
  color:#0d6b39;
  display:flex;
  align-items:center;
  gap:6px;
}
.floating-whatsapp-card strong::before{
  content:"";
  width:8px;
  height:8px;
  border-radius:50%;
  background:#25d366;
  box-shadow:0 0 0 0 rgba(37,211,102,.75);
  animation:waOnlinePulse 1.4s infinite;
}
.floating-whatsapp-card small{font-size:.76rem;color:#245e40;line-height:1.2}
@media (max-width:960px){.whatsapp-grid{grid-template-columns:1fr}.floating-whatsapp{right:12px;bottom:12px}}
@media (max-width:960px){.floating-whatsapp-card{right:12px;bottom:66px;max-width:250px}}

@keyframes waOnlinePulse{
  0%{box-shadow:0 0 0 0 rgba(37,211,102,.65)}
  70%{box-shadow:0 0 0 8px rgba(37,211,102,0)}
  100%{box-shadow:0 0 0 0 rgba(37,211,102,0)}
}
.wa-btn-inline{background:linear-gradient(145deg,#14a34f,#25d366);border:1px solid #18b459}
.wa-chat-demo{margin-top:10px;background:#eef7ff;border:1px solid #dae9ff;border-radius:12px;padding:10px}
.wa-msg{max-width:88%;padding:8px 10px;border-radius:10px;margin-bottom:7px;font-size:.86rem}
.wa-msg.in{background:#fff;border:1px solid #d5e3ff;color:#30415f}
.wa-msg.out{margin-left:auto;background:#d8ffe7;border:1px solid #b8efcf;color:#175637}
.logos-section{padding-top:8px}
.logos-title{margin:0 0 10px;color:#5a6885;font-weight:700}
.logos-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}
.logos-grid div{background:#fff;border:1px solid #dce6ff;border-radius:10px;padding:10px;text-align:center;font-weight:800;color:#283a66}
.testimonials-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.testimonial-card{background:#fff;border:1px solid #dbe5ff;border-radius:14px;padding:16px;box-shadow:0 8px 18px rgba(24,50,120,.09)}
.testimonial-card p{margin:0 0 10px;color:#334463;line-height:1.55}
.testimonial-card .who{font-weight:800;color:#1e356d;font-size:.9rem}
@media (max-width:960px){.logos-grid,.testimonials-grid{grid-template-columns:1fr}}

/* Refuerzo visual: bordes y sombras mas notorios */
.social-proof div,
.sales-card,
.testimonial-card,
.logos-grid div,
.benefit,
.wa-flow,
.flow-step,
.mockup-card,
.floating-kpi {
  border-color: #c9d8ff !important;
}

.social-proof div { box-shadow: 0 10px 22px rgba(27,56,126,.10) !important; }
.mockup-card { box-shadow: 0 30px 60px rgba(18,41,108,.22) !important; }
.floating-kpi { box-shadow: 0 14px 28px rgba(29,56,128,.20) !important; }
.sales-card { box-shadow: 0 12px 24px rgba(22,44,108,.12) !important; }
.benefit { box-shadow: 0 8px 18px rgba(28,54,126,.08) !important; }
.wa-flow { box-shadow: 0 14px 30px rgba(15,57,133,.14) !important; }
.flow-step { box-shadow: 0 5px 12px rgba(25,56,126,.07) !important; }
.logos-grid div { box-shadow: 0 8px 16px rgba(24,48,112,.09) !important; }
.testimonial-card { box-shadow: 0 14px 26px rgba(24,50,120,.13) !important; }

/* Modo elegante: hover suave premium */
.social-proof div,
.sales-card,
.testimonial-card,
.logos-grid div,
.benefit,
.wa-flow,
.flow-step,
.mockup-card {
  transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease;
}

.social-proof div:hover,
.sales-card:hover,
.testimonial-card:hover,
.logos-grid div:hover,
.benefit:hover,
.wa-flow:hover,
.flow-step:hover,
.mockup-card:hover {
  transform: translateY(-4px);
  border-color: #b5c9ff !important;
}

.sales-card:hover,
.testimonial-card:hover,
.wa-flow:hover {
  box-shadow: 0 18px 34px rgba(24,50,120,.18) !important;
}

.mockup-card:hover {
  box-shadow: 0 34px 66px rgba(18,41,108,.27) !important;
}

/* Registro de clientes (prueba 7 dias) */
.register-body {
  margin: 0;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  padding: 20px;
  background: radial-gradient(circle at 10% 10%, #dce8ff 0%, #f6f9ff 38%, #edf3ff 100%);
}
.register-topbar,
.register-footer { width: 100%; }
.register-topbar-inner,
.register-footer-inner {
  width: min(1120px, 96%);
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.register-topbar-inner { margin-bottom: 12px; }
.register-footer-inner { margin-top: 12px; color: #4f5c7b; font-size: .9rem; }
.register-back {
  text-decoration: none;
  font-weight: 700;
  color: #1e3c95;
  background: #ffffffc7;
  border: 1px solid #c9d8ff;
  padding: 8px 12px;
  border-radius: 10px;
}
.register-shell {
  width: min(1120px, 96%);
  display: grid;
  grid-template-columns: .95fr 1.05fr;
  gap: 14px;
  margin: auto;
}
.register-brand-card,
.register-form-card {
  background: #fff;
  border: 1px solid #c9d8ff;
  border-radius: 18px;
  box-shadow: 0 18px 36px rgba(21, 46, 109, .16);
}
.register-brand-card { padding: 26px; background: linear-gradient(155deg, #ffffff, #eef4ff); }
.register-pill {
  display: inline-block;
  margin: 0 0 10px;
  padding: 7px 11px;
  border-radius: 999px;
  font-size: .82rem;
  font-weight: 700;
  background: #e2ebff;
  color: #2348ae;
}
.register-brand-card h1 { margin: 0 0 10px; color: #14295d; font-size: clamp(1.5rem, 3vw, 2.15rem); }
.register-lead { margin: 0 0 12px; color: #4b5876; line-height: 1.6; }
.register-points { margin: 0; padding-left: 18px; display: grid; gap: 8px; color: #2f426e; }
.register-form-card { padding: 26px; }
.register-form-card h2 { margin: 0 0 6px; color: #11244e; }
.register-form-card p { margin: 0 0 12px; color: #5f6a85; }
.register-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.register-grid label { font-size: .88rem; color: #263558; display: grid; gap: 6px; }
.register-grid input {
  border: 1px solid #c9d8ff;
  border-radius: 10px;
  padding: 10px 11px;
  box-shadow: 0 4px 10px rgba(25, 57, 132, .05);
}
.register-grid button { grid-column: 1 / -1; margin-top: 8px; padding: 12px 14px; border-radius: 10px; font-weight: 700; }
.register-form-card small { display: block; margin-top: 10px; color: #516286; }
.alert.success { background: #e6ffef; color: #0b7d3b; border-radius: 8px; padding: 10px; margin-bottom: 8px; }
@media (max-width: 920px) {
  .register-shell { grid-template-columns: 1fr; }
  .register-footer-inner,
  .register-topbar-inner { flex-wrap: wrap; }
}
@media (max-width: 760px) {
  .register-grid { grid-template-columns: 1fr; }
  .register-brand-card, .register-form-card { padding: 18px; }
}

/* Login comercial */
.login-shell { grid-template-columns: 1fr 1fr; }
.login-form-card { align-self: center; }
.login-form-grid { display: grid; gap: 10px; }
.login-form-grid label { font-size: .9rem; color: #263558; display: grid; gap: 6px; }
.login-form-grid input {
  border: 1px solid #c9d8ff;
  border-radius: 10px;
  padding: 10px 11px;
  box-shadow: 0 4px 10px rgba(25, 57, 132, .05);
}
.login-form-grid button { margin-top: 8px; padding: 12px 14px; border-radius: 10px; font-weight: 700; }
@media (max-width: 920px) { .login-shell { grid-template-columns: 1fr; } }

/* Onboarding comercial para clientes */
.onboarding-panel { border: 1px solid #c9d8ff; box-shadow: 0 14px 30px rgba(24,50,120,.12); }
.onboarding-panel h3 { margin-top: 0; }
.onboarding-panel p { color: #4f5d7e; }
.onboarding-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px,1fr)); gap: 10px; margin-top: 10px; }
.onboarding-card {
  background: linear-gradient(155deg, #fff, #f3f7ff);
  border: 1px solid #c9d8ff;
  border-radius: 12px;
  padding: 12px;
  box-shadow: 0 10px 20px rgba(23,53,130,.08);
}
.onboarding-card.done {
  border-color: #9ad9b3;
  background: linear-gradient(155deg, #ffffff, #eefbf3);
}
.onboarding-card h4 { margin: 0 0 6px; color: #1a3169; }
.onboarding-card p { margin: 0 0 8px; font-size: .9rem; }
.onboarding-card a { font-weight: 700; color: #1f4cc8; text-decoration: none; }

/* Dashboard comercial del cliente */
.client-hero {
  display: grid;
  grid-template-columns: 1.2fr .8fr;
  gap: 14px;
  border: 1px solid #c9d8ff;
  background: linear-gradient(145deg, #f9fbff, #eef4ff);
  box-shadow: 0 18px 36px rgba(21,46,109,.14);
}
.client-hero h3 { margin: 0 0 8px; color: #132a63; font-size: 1.25rem; }
.client-hero p { margin: 0 0 6px; color: #4c5c80; }
.client-hero-cta {
  background: #fff;
  border: 1px solid #c9d8ff;
  border-radius: 12px;
  padding: 12px;
  display: grid;
  gap: 6px;
  align-content: center;
  box-shadow: 0 10px 24px rgba(25,53,125,.10);
}
.client-hero-cta--detail {
  align-content: start;
  gap: 8px;
}
.client-hero-cta span { font-size: .85rem; color: #5b6a87; }
.client-hero-cta strong { font-size: 1.4rem; color: #1742b0; }
.client-activation-detail {
  margin-top: 4px;
  padding-top: 8px;
  border-top: 1px solid #e2e8f0;
  text-align: left;
}
.client-activation-detail-kicker {
  margin: 0 0 6px;
  font-size: 0.72rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.client-activation-detail-kicker--ok { color: #0f6b3a; }
.client-activation-detail-kicker--pending { color: #9a3412; }
.client-activation-list {
  list-style: none;
  margin: 0 0 10px;
  padding: 0;
  display: grid;
  gap: 6px;
  font-size: 0.82rem;
  line-height: 1.4;
  color: #334155;
}
.client-activation-list:last-child { margin-bottom: 0; }
.client-activation-list--ok li {
  display: flex;
  align-items: flex-start;
  gap: 6px;
  color: #1e4b2d;
}
.client-activation-check {
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  margin-top: 1px;
  border-radius: 4px;
  background: #dcfce7
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%2315803d' stroke-width='2'%3E%3Cpath d='M3 8l3 3 7-7'/%3E%3C/svg%3E")
    center / 12px no-repeat;
}
.client-activation-list--pending li {
  display: grid;
  gap: 2px;
  padding: 8px 10px;
  border-radius: 10px;
  background: #fffbeb;
  border: 1px solid #fde68a;
}
.client-activation-li-main { font-weight: 700; color: #1e293b; }
.client-activation-li-sub { font-size: 0.8rem; color: #64748b; }
.client-activation-li-link {
  font-size: 0.8rem;
  font-weight: 800;
  color: #1d4ed8;
  text-decoration: none;
  margin-top: 2px;
  width: fit-content;
}
.client-activation-li-link:hover { text-decoration: underline; }
.client-activation-all-done {
  margin: 6px 0 0;
  font-size: 0.85rem;
  font-weight: 700;
  color: #0f6b3a;
  line-height: 1.45;
}
.client-plan-days { font-size: .82rem; color: #2f426e; font-weight: 700; }
.client-plan-days-warn { color: #8a6400; }
.progress-bar {
  width: 100%;
  height: 10px;
  border-radius: 999px;
  background: #e6eeff;
  overflow: hidden;
}
.progress-bar span {
  display: block;
  height: 100%;
  background: linear-gradient(145deg, #2463ff, #35c77a);
  border-radius: 999px;
}
.client-cards .card {
  border: 1px solid #c9d8ff;
  box-shadow: 0 10px 20px rgba(24,50,120,.10);
  background: linear-gradient(155deg, #fff, #f3f7ff);
}
@media (max-width: 920px) {
  .client-hero { grid-template-columns: 1fr; }
}
.dashboard-wa-pending {
  color: #8a6400;
}
.dashboard-wa-public-link {
  margin-top: 14px;
  padding: 14px 16px;
  border-radius: 12px;
  border: 1px solid #c9d8ff;
  background: #f8faff;
}
.dashboard-wa-public-link p { margin: 0 0 8px; color: #1c2434; }
.dashboard-wa-public-link .dashboard-wa-hint {
  margin: 10px 0 0;
  font-size: 13px;
  color: #5b6a87;
  line-height: 1.45;
}
.dashboard-wa-url-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin: 0 !important;
}
.dashboard-wa-url {
  font-size: 14px;
  word-break: break-all;
  color: #1a56d6;
  font-weight: 600;
}
.dashboard-wa-copy.copied { color: #0b7d3b; }

/* WhatsApp Embedded Signup (dashboard cliente) */
.wa-embed-panel {
  border: 1px solid #c9e8d4;
  background: linear-gradient(165deg, #f6fff9 0%, #ffffff 55%);
  box-shadow: 0 12px 32px rgba(18, 120, 70, 0.08);
}
.wa-embed-head { margin-bottom: 20px; }
.wa-embed-step2-kicker {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 12px 0 0;
  font-size: 0.95rem;
  font-weight: 700;
  color: #0d3d2e;
  letter-spacing: 0.02em;
}
.wa-embed-step-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  border-radius: 50%;
  font-size: 1rem;
  font-weight: 800;
  background: linear-gradient(145deg, #128c7e, #25d366);
  color: #fff;
  flex-shrink: 0;
  box-shadow: 0 4px 12px rgba(18, 140, 90, 0.35);
}
.wa-embed-step-badge--sm {
  width: 1.65rem;
  height: 1.65rem;
  font-size: 0.85rem;
}
.wa-embed-scope {
  margin-bottom: 28px;
}
.wa-embed-scope-card {
  position: relative;
  padding: 22px 24px 20px;
  border-radius: 16px;
  border: 1px solid #b8e6ce;
  background: linear-gradient(180deg, #ffffff 0%, #f3fcf7 100%);
  box-shadow: 0 8px 28px rgba(18, 120, 70, 0.1);
}
.wa-embed-scope-card--step1::before {
  content: "";
  position: absolute;
  left: 0;
  top: 14px;
  bottom: 14px;
  width: 4px;
  border-radius: 4px;
  background: linear-gradient(180deg, #25d366, #128c7e);
}
.wa-embed-scope-card-top {
  display: flex;
  gap: 16px;
  align-items: flex-start;
  margin-bottom: 18px;
}
.wa-embed-scope-heading {
  margin: 0 0 8px;
  font-size: 1.2rem;
  color: #0a2f24;
  line-height: 1.3;
}
.wa-embed-scope-lead {
  margin: 0;
  font-size: 14px;
  color: #3d5a66;
  line-height: 1.6;
  max-width: 48rem;
}
.wa-embed-scope-status {
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px dashed #c5e8d6;
}
.wa-embed-scope-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 14px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 600;
}
.wa-embed-scope-pill--ok {
  background: #e8f8ee;
  color: #0b5c2e;
  border: 1px solid #9fd9b5;
}
.wa-embed-scope-pill--pending {
  background: #fff8e6;
  color: #7a5a08;
  border: 1px solid #edd08a;
}
.wa-embed-scope-pill--off {
  background: #f0f4fa;
  color: #3d4f63;
  border: 1px solid #c5d3e5;
}
.wa-embed-scope-ribbon {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 18px 0 6px;
  padding: 0 8px;
}
.wa-embed-scope-ribbon-line {
  flex: 1;
  height: 2px;
  border-radius: 2px;
  background: linear-gradient(90deg, transparent, #7dd3a0, transparent);
  opacity: 0.85;
}
.wa-embed-scope-ribbon-text {
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: #1a7a5c;
}
.wa-embed-agent-picker {
  margin: 0;
  padding: 0;
  border: none;
  background: transparent;
}
.wa-embed-agent-picker label {
  display: block;
  font-weight: 700;
  margin-bottom: 8px;
  color: #0d3d2e;
  font-size: 0.9rem;
}
.wa-embed-agent-picker-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
}
.wa-embed-agent-select {
  flex: 1;
  min-width: 220px;
  max-width: 100%;
  padding: 12px 14px;
  border-radius: 10px;
  border: 2px solid #c5e8d6;
  background: #fff;
  font-size: 15px;
  font-weight: 600;
  color: #0d3d2e;
  cursor: pointer;
  transition: border-color 0.15s, box-shadow 0.15s;
}
.wa-embed-agent-select:hover,
.wa-embed-agent-select:focus {
  border-color: #25d366;
  outline: none;
  box-shadow: 0 0 0 3px rgba(37, 211, 102, 0.2);
}
.wa-embed-agent-picker-saving {
  font-size: 13px;
  color: #1a7a5c;
  font-weight: 600;
}
.wa-embed-agent-hint {
  margin: 12px 0 0;
  font-size: 13px;
  color: #4c5c80;
  line-height: 1.5;
}
.wa-embed-no-agent {
  padding: 18px 20px;
  background: #fffbeb;
  border: 1px solid #f5e0a8;
  border-radius: 10px;
  color: #7a5f08;
}
.wa-embed-no-agent a { font-weight: 600; }
.wa-embed-no-agent--panel {
  display: flex;
  gap: 18px;
  align-items: flex-start;
  padding: 24px 26px;
  border-radius: 16px;
  border: 1px solid #f0d78a;
  background: linear-gradient(165deg, #fffdf6 0%, #fff8e8 100%);
  box-shadow: 0 8px 24px rgba(180, 140, 30, 0.12);
}
.wa-embed-no-agent-icon {
  width: 48px;
  height: 48px;
  border-radius: 12px;
  flex-shrink: 0;
  background: linear-gradient(145deg, #f0d78a, #e8b84a);
  opacity: 0.9;
}
.wa-embed-no-agent-title {
  display: block;
  font-size: 1.1rem;
  margin-bottom: 8px;
  color: #5c4510;
}
.wa-embed-no-agent--panel p {
  margin: 0 0 16px;
  line-height: 1.55;
  color: #6a550f;
  max-width: 36rem;
}
.wa-embed-no-agent-cta {
  display: inline-block;
}
/* Hero: contexto agente + WhatsApp */
.client-hero-wa-context {
  display: flex;
  gap: 14px;
  align-items: flex-start;
  margin: 14px 0 18px;
  padding: 14px 16px;
  border-radius: 12px;
  background: #f0faf4;
  border: 1px solid #c5e8d6;
}
.client-hero-wa-context-icon {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  flex-shrink: 0;
  background: linear-gradient(145deg, #128c7e, #25d366);
  box-shadow: 0 4px 12px rgba(18, 140, 90, 0.25);
}
.client-hero-wa-context-label {
  display: block;
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #1a7a5c;
  margin-bottom: 4px;
}
.client-hero-wa-context-main {
  margin: 0 0 6px;
  font-size: 1rem;
  color: #0d3d2e;
  line-height: 1.4;
}
.client-hero-wa-context-sep {
  color: #8aa99a;
  font-weight: 400;
  margin: 0 4px;
}
.client-hero-wa-context-num {
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.02em;
}
.client-hero-wa-context-pending {
  color: #8a6400;
  font-weight: 600;
}
.client-hero-wa-context-hint {
  margin: 0;
  font-size: 13px;
  color: #4a6b5c;
  line-height: 1.45;
}
.client-hero-wa-context-hint a {
  font-weight: 700;
  color: #0d6b4d;
}
.wa-embed-pill {
  background: linear-gradient(145deg, #128c7e, #25d366);
  color: #fff !important;
  border: none;
}
.wa-embed-title {
  margin: 10px 0 8px;
  font-size: 1.35rem;
  color: #0d3d2e;
}
.wa-embed-sub {
  margin: 0;
  color: #415176;
  max-width: 52rem;
  line-height: 1.55;
}
.wa-embed-choice-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 18px;
  margin-bottom: 16px;
}
.wa-embed-choice-card {
  padding: 18px 20px;
  border-radius: 14px;
  border: 1px solid #e2efe8;
  background: #fff;
  box-shadow: 0 6px 20px rgba(18, 120, 70, 0.06);
}
.wa-embed-choice-card--own {
  border-left: 4px solid #2463ff;
}
.wa-embed-choice-card--platform {
  border-left: 4px solid #25d366;
}
.wa-embed-choice-title {
  margin: 0 0 10px;
  font-size: 1.05rem;
  color: #0d3d2e;
}
.wa-embed-choice-card p {
  margin: 0 0 10px;
  font-size: 14px;
  color: #4c5c80;
  line-height: 1.55;
}
.wa-embed-choice-ok {
  color: #0b7d3b !important;
  font-weight: 600;
}
.wa-embed-choice-warn {
  color: #8a6400 !important;
}
.wa-embed-pool-active {
  padding: 8px 4px 4px;
  max-width: 40rem;
}
.wa-embed-steps {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.wa-embed-step {
  display: flex;
  gap: 14px;
  align-items: flex-start;
  padding: 16px 18px;
  border-radius: 14px;
  border: 1px solid #e2efe8;
  background: #fff;
}
.wa-embed-step--active {
  border-color: #25d366;
  box-shadow: 0 0 0 1px rgba(37, 211, 102, 0.25);
}
.wa-embed-step--done {
  border-color: #b8e6cc;
  background: #fbfffc;
}
.wa-embed-step-num {
  flex-shrink: 0;
  width: 32px;
  height: 32px;
  border-radius: 999px;
  background: linear-gradient(145deg, #128c7e, #25d366);
  color: #fff;
  font-weight: 800;
  font-size: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.wa-embed-step p { margin: 6px 0 0; color: #4c5c80; font-size: 14px; line-height: 1.5; }
.wa-embed-config-missing { color: #8a6400; }
.wa-embed-btn-wa {
  margin-top: 12px;
  background: linear-gradient(180deg, #25d366 0%, #128c7e 100%) !important;
  border: none !important;
  color: #fff !important;
  font-weight: 700;
  padding: 12px 22px;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  box-shadow: 0 10px 24px rgba(18, 140, 126, 0.35);
}
.wa-embed-btn-wa:hover { filter: brightness(1.05); }
.wa-embed-btn-wa--locked,
.wa-embed-btn-wa:disabled {
  opacity: 0.55;
  cursor: not-allowed;
  filter: grayscale(0.35);
  box-shadow: none;
}
.wa-embed-btn-wa--locked:hover,
.wa-embed-btn-wa:disabled:hover {
  filter: grayscale(0.35);
}
.wa-embed-num-hint {
  font-size: 14px;
  color: #3d4a63;
  line-height: 1.5;
  margin: 0 0 10px;
  padding: 10px 12px;
  background: #f0f4ff;
  border-radius: 10px;
  border-left: 4px solid #2463ff;
}
.wa-embed-btn-icon {
  width: 22px;
  height: 22px;
  border-radius: 6px;
  background: rgba(255,255,255,0.25) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 01-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 01-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 012.893 6.994c-.003 5.45-4.435 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0012.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 005.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893a11.821 11.821 0 00-3.48-8.413z'/%3E%3C/svg%3E") center/14px no-repeat;
}
.wa-embed-status { margin-top: 8px; }
.wa-embed-status-ok { color: #0b7d3b; font-weight: 600; margin: 0 0 8px; display: flex; align-items: center; gap: 8px; }
.wa-embed-status-reconnect { color: #8a6400; font-weight: 700; margin: 0 0 8px; display: flex; align-items: center; gap: 8px; }
.wa-embed-status-off { color: #6d7788; margin: 0 0 8px; display: flex; align-items: center; gap: 8px; }
.wa-embed-dot {
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: #c5ced9;
}
.wa-embed-dot--ok { background: #25d366; box-shadow: 0 0 0 3px rgba(37, 211, 102, 0.25); }
.wa-embed-phone-line { margin: 0 0 6px; font-size: 1.05rem; }
.wa-embed-meta-id { margin: 0; color: #6d7788; }
.wa-embed-actions { margin-top: 12px; display: flex; flex-wrap: wrap; gap: 10px; }
.wa-embed-btn-danger { color: #b42318 !important; border-color: #f5c4c0 !important; }
.wa-embed-loader {
  display: none;
  align-items: center;
  gap: 10px;
  margin-top: 12px;
  color: #2463ff;
  font-weight: 600;
}
.wa-embed-loader:not([hidden]) {
  display: flex;
}
.wa-embed-spinner {
  width: 22px;
  height: 22px;
  border: 3px solid #dbe4ff;
  border-top-color: #2463ff;
  border-radius: 50%;
  animation: wa-spin 0.8s linear infinite;
}
@keyframes wa-spin { to { transform: rotate(360deg); } }
.wa-embed-feedback { margin-top: 10px; font-size: 14px; min-height: 1.2em; }
.wa-embed-feedback--ok { color: #0b7d3b; }
.wa-embed-feedback--error { color: #b42318; }
@media (max-width: 640px) {
  .wa-embed-step { flex-direction: column; }
  .wa-embed-scope-card-top { flex-direction: column; }
  .wa-embed-step-badge { align-self: flex-start; }
  .client-hero-wa-context { flex-direction: column; }
  .wa-embed-no-agent--panel { flex-direction: column; }
}
.plan-alert {
  border: 1px solid #c9d8ff;
  border-left-width: 6px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
}
.plan-alert h3 { margin: 0 0 6px; color: #132a63; }
.plan-alert p { margin: 0; color: #415176; }
.plan-alert-ok { border-left-color: #0b7d3b; background: linear-gradient(180deg, #f5fff9, #ffffff); }
.plan-alert-warn { border-left-color: #8a6400; background: linear-gradient(180deg, #fffaf0, #ffffff); }
.plan-alert-error { border-left-color: #b42318; background: linear-gradient(180deg, #fff4f3, #ffffff); }
.plan-alert-actions { display: flex; align-items: center; }
@media (max-width: 760px) {
  .plan-alert { flex-direction: column; align-items: flex-start; }
}

/* Panel administrativo: tipografia y fondo (rutas CSS resueltas con includes/paths.php) */
.admin-app {
  font-family: "DM Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  -webkit-font-smoothing: antialiased;
}
.admin-app .sidebar {
  background: linear-gradient(180deg, #0a101c 0%, #101828 38%, #141d2e 100%);
  border-right: 1px solid rgba(255, 255, 255, 0.07);
  box-shadow: 6px 0 28px rgba(0, 0, 0, 0.14);
}
.admin-app .sidebar .brand {
  font-size: 1.35rem;
  letter-spacing: -0.02em;
  padding-bottom: 6px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  margin-bottom: 16px;
}
.admin-app .sidebar nav a {
  border-radius: 10px;
  font-weight: 600;
  font-size: 0.92rem;
}
.admin-app .sidebar nav a:hover {
  background: rgba(79, 134, 255, 0.18);
  color: #fff;
}
.admin-app .content {
  background: linear-gradient(165deg, #e8edf8 0%, #f0f4fc 35%, #f4f7fb 100%);
  min-height: 100vh;
}

/* Modulos del panel (sidebar): mismo layout que productos */
.admin-module,
.products-page {
  display: flex;
  flex-direction: column;
  gap: 20px;
  max-width: 1240px;
}
.admin-module > .panel,
.admin-module > section.panel,
.products-page > .panel,
.products-page > section.panel {
  margin-bottom: 0;
}
.admin-module .panel-grid {
  margin-bottom: 0;
  gap: 20px;
}
.admin-module .panel-grid > .panel {
  margin-bottom: 0;
}
.admin-module > .cards {
  margin-bottom: 0;
}
.admin-module > .cards .card {
  border: 1px solid #c9d8ff;
  box-shadow: 0 10px 20px rgba(24, 50, 120, 0.1);
  background: linear-gradient(155deg, #fff, #f3f7ff);
}
.admin-form-shell {
  border: 1px solid #c9d8ff;
  box-shadow: 0 14px 30px rgba(24, 50, 120, 0.12);
  background: linear-gradient(180deg, #ffffff 0%, #fafcff 100%);
  padding: 18px;
}
.admin-form-shell h3 {
  margin-top: 0;
  color: #132a63;
}
.admin-form-shell > p {
  color: #4c5c80;
  line-height: 1.5;
  margin-top: 0;
}
.admin-module .grid-form .field-span-full {
  grid-column: 1 / -1;
}

/* Formulario crear/editar agente IA (guía para el cliente) */
.agente-form-page .agent-form {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.agent-form-intro {
  border: 1px solid #b8d4a8;
  background: linear-gradient(165deg, #f4fcf2 0%, #ffffff 70%);
  box-shadow: 0 10px 28px rgba(40, 120, 60, 0.08);
  padding: 20px 22px;
}
.agent-form-intro-title {
  margin: 0 0 12px;
  font-size: 1.15rem;
  color: #0d3d2e;
}
.agent-form-intro-steps {
  margin: 0;
  padding-left: 1.25rem;
  color: #3d5a4a;
  line-height: 1.65;
  font-size: 14px;
}
.agent-form-intro-steps li {
  margin-bottom: 8px;
}
.agent-form-intro-steps li:last-child {
  margin-bottom: 0;
}
.agent-form-intro-ia {
  margin: 14px 0 0;
  padding: 12px 14px;
  border-radius: 10px;
  background: #f3f7ff;
  border: 1px solid #c9d8ff;
  font-size: 14px;
  color: #334463;
  line-height: 1.55;
}
.agent-form-field-head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px 14px;
  margin-bottom: 8px;
}
.agent-form-field-head > label {
  margin-bottom: 0;
  flex: 1;
  min-width: 140px;
}
.agent-form-ia-status {
  margin: 10px 0 0;
  font-size: 13px;
  line-height: 1.45;
  padding: 8px 12px;
  border-radius: 8px;
  background: #e8f8ee;
  color: #0b5c2e;
  border: 1px solid #9fd9b5;
}
.agent-form-ia-status--error {
  background: #fff4f3;
  color: #b42318;
  border-color: #f5c4c0;
}
.agent-form-ia-status--ok {
  background: #e8f8ee;
  color: #0b5c2e;
  border-color: #9fd9b5;
}
.agent-form-section {
  border: 1px solid #c9d8ff;
  background: linear-gradient(180deg, #ffffff 0%, #fafcff 100%);
  box-shadow: 0 10px 26px rgba(24, 50, 120, 0.08);
  padding: 22px 24px;
  margin: 0;
}
.agent-form-section--highlight {
  border-color: #9cb9ff;
  background: linear-gradient(180deg, #f8faff 0%, #ffffff 55%);
  box-shadow: 0 14px 34px rgba(47, 99, 255, 0.12);
}
.agent-form-legend {
  display: block;
  width: 100%;
  padding: 0;
  margin: 0 0 6px;
  font-size: 1.12rem;
  font-weight: 800;
  color: #132a63;
}
.agent-form-section-lead {
  margin: 0 0 18px;
  font-size: 14px;
  color: #4c5c80;
  line-height: 1.55;
  max-width: 52rem;
}
.agent-form-field {
  margin-bottom: 18px;
}
.agent-form-field:last-child {
  margin-bottom: 0;
}
.agent-form-field > label {
  display: block;
  font-weight: 700;
  font-size: 0.92rem;
  color: #1c2434;
  margin-bottom: 8px;
}
.agent-form-req {
  color: #b42318;
  font-weight: 800;
}
.agent-form-control {
  width: 100%;
  max-width: 100%;
  padding: 11px 14px;
  border: 1px solid #c9d4e8;
  border-radius: 10px;
  font-size: 15px;
  font-family: inherit;
  color: #1c2434;
  background: #fff;
  transition: border-color 0.15s, box-shadow 0.15s;
}
.agent-form-control:focus {
  outline: none;
  border-color: #2f63ff;
  box-shadow: 0 0 0 3px rgba(47, 99, 255, 0.2);
}
.agent-form-textarea {
  min-height: 88px;
  resize: vertical;
  line-height: 1.5;
}
.agent-form-textarea--large {
  min-height: 220px;
  font-size: 14px;
}
.agent-form-hint {
  margin: 8px 0 0;
  font-size: 13px;
  color: #6d7788;
  line-height: 1.5;
  max-width: 48rem;
}
.agent-form-grid-2 {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 18px;
}
.agent-form-grid-2--stack {
  grid-template-columns: 1fr;
}
@media (min-width: 768px) {
  .agent-form-grid-2--stack {
    grid-template-columns: 1fr 1fr;
  }
}
.agent-form-readonly-box {
  padding: 12px 14px;
  border-radius: 10px;
  background: #f0f4fc;
  border: 1px solid #d8e0f2;
  margin-bottom: 18px;
}
.agent-form-readonly-label {
  display: block;
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #5a6b8a;
  margin-bottom: 4px;
}
.agent-form-callout {
  margin-top: 16px;
  padding: 14px 16px;
  border-radius: 12px;
  font-size: 13px;
  line-height: 1.55;
  color: #3d4f63;
}
.agent-form-callout--tone {
  background: #f3f7ff;
  border: 1px solid #c9d8ff;
}
.agent-form-callout--tone strong {
  display: block;
  margin-bottom: 8px;
  color: #132a63;
  font-size: 0.95rem;
}
.agent-form-tone-list {
  margin: 0;
  padding-left: 1.2rem;
}
.agent-form-tone-list li {
  margin-bottom: 6px;
}
.agent-form-tone-list li:last-child {
  margin-bottom: 0;
}
.agent-form-footer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 18px 22px;
  border: 1px solid #c9d8ff;
  background: #fff;
  box-shadow: 0 8px 22px rgba(24, 50, 120, 0.08);
}
.agent-form-check {
  display: flex;
  align-items: center;
  gap: 10px;
  font-weight: 600;
  color: #334463;
  cursor: pointer;
}
.agent-form-check input {
  width: 18px;
  height: 18px;
  accent-color: #2f63ff;
}
.agent-form-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
}
fieldset.agent-form-section {
  border: none;
}
@media (max-width: 640px) {
  .agent-form-footer {
    flex-direction: column;
    align-items: stretch;
  }
  .agent-form-actions {
    justify-content: stretch;
  }
  .agent-form-actions .btn {
    flex: 1;
    text-align: center;
    justify-content: center;
  }
}

.admin-sim-output-label {
  margin: 16px 0 8px;
  color: #132a63;
  font-weight: 700;
}
.sim-imagenes {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 14px;
}
.sim-imagen-fig {
  margin: 0;
  max-width: 220px;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 8px 18px rgba(24, 50, 120, 0.1);
}
.sim-imagen-fig img {
  display: block;
  width: 100%;
  height: auto;
  max-height: 200px;
  object-fit: cover;
}
.sim-imagen-fig figcaption {
  padding: 8px 10px;
  font-size: 0.82rem;
  font-weight: 700;
  color: #334463;
}

/* Catalogo de productos / servicios (admin) */
.products-page .products-hero,
.admin-hero.panel {
  display: grid;
  grid-template-columns: 1.25fr 0.75fr;
  gap: 18px;
  align-items: stretch;
  border: 1px solid #c9d8ff;
  background: linear-gradient(145deg, #f9fbff 0%, #e8f0ff 55%, #f3f7ff 100%);
  box-shadow: 0 20px 44px rgba(21, 46, 109, 0.14);
  padding: 22px 22px 20px;
}
.admin-hero--compact {
  grid-template-columns: 1fr;
}
.products-pill,
.admin-pill {
  display: inline-block;
  padding: 6px 12px;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.02em;
  background: #e2ebff;
  color: #2348ae;
  margin-bottom: 10px;
}
.products-title,
.admin-title {
  margin: 0 0 8px;
  font-size: clamp(1.35rem, 2.4vw, 1.75rem);
  color: #132a63;
  line-height: 1.2;
}
.products-lead,
.admin-lead {
  margin: 0 0 16px;
  color: #4c5c80;
  line-height: 1.55;
  max-width: 56ch;
}
.products-hero-actions,
.admin-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}
.products-cta-primary,
.admin-cta-primary {
  font-weight: 800;
  padding: 12px 18px;
  border-radius: 12px;
  box-shadow: 0 12px 28px rgba(47, 99, 255, 0.28);
}
.btn-outline-light {
  background: #fff;
  color: #1f4cc8;
  border: 1px solid #c9d8ff;
  font-weight: 700;
}
.btn-outline-light:hover {
  border-color: #9fb6ff;
}
.products-hero-stats,
.admin-hero-side {
  display: grid;
  gap: 10px;
  align-content: start;
}
.products-stat,
.admin-stat {
  background: #fff;
  border: 1px solid #c9d8ff;
  border-radius: 14px;
  padding: 14px 16px;
  box-shadow: 0 10px 22px rgba(25, 53, 125, 0.1);
}
.products-stat strong,
.admin-stat strong {
  display: block;
  font-size: 1.65rem;
  color: #1742b0;
  line-height: 1.1;
}
.products-stat span,
.admin-stat span {
  font-size: 0.82rem;
  color: #5b6a87;
}
.products-stat-hint,
.admin-stat-hint {
  background: linear-gradient(155deg, #ffffff, #f3f7ff);
}
.products-stat-note,
.admin-stat-note {
  font-size: 0.88rem;
  color: #3f4f6f;
  line-height: 1.45;
}

/* Superadmin: metricas de servicio (graficos + umbrales) */
.svc-ref-legend {
  background: linear-gradient(155deg, #f8fbff, #eef3ff);
  border: 1px solid #d5e3ff;
  border-radius: 12px;
  padding: 12px 14px;
  margin-bottom: 16px;
}
.svc-ref-legend-title {
  font-weight: 700;
  font-size: 0.82rem;
  color: #1e356d;
  margin-bottom: 8px;
}
.svc-ref-list {
  margin: 0;
  padding-left: 0;
  list-style: none;
  display: grid;
  gap: 8px;
  font-size: 0.82rem;
  color: #3f4f6f;
  line-height: 1.45;
}
.svc-ref-list li {
  padding-left: 18px;
  position: relative;
}
.svc-dot {
  position: absolute;
  left: 0;
  top: 0.35em;
  width: 10px;
  height: 10px;
  border-radius: 50%;
}
.svc-dot--ok {
  background: #2e7d32;
}
.svc-dot--warn {
  background: #f57c00;
}
.svc-dot--crit {
  background: #c62828;
}
.svc-badge {
  display: inline-block;
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  padding: 3px 8px;
  border-radius: 999px;
  vertical-align: middle;
}
.svc-badge--ok {
  background: #e8f5e9;
  color: #1b5e20;
}
.svc-badge--warn {
  background: #fff3e0;
  color: #e65100;
}
.svc-badge--crit {
  background: #ffebee;
  color: #b71c1c;
}
.svc-badge--na {
  background: #eceff1;
  color: #546e7a;
}
.svc-charts-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 14px;
  margin-bottom: 18px;
}
.svc-chart-card {
  background: #fff;
  border: 1px solid #dce7ff;
  border-radius: 12px;
  padding: 12px 14px 8px;
}
.svc-chart-title {
  margin: 0 0 4px;
  font-size: 0.95rem;
  color: #15295a;
}
.svc-chart-hint {
  margin: 0 0 8px;
  font-size: 0.78rem;
  color: #5b6a87;
  line-height: 1.35;
}
.svc-chart-canvas-wrap {
  position: relative;
  height: 240px;
}

.products-toolbar,
.admin-toolbar {
  border: 1px solid #c9d8ff;
  box-shadow: 0 12px 26px rgba(24, 50, 120, 0.1);
}
.products-filters,
.admin-filters {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 12px 14px;
  align-items: end;
}
.products-filter-field span {
  display: block;
  font-size: 0.82rem;
  font-weight: 700;
  color: #334463;
  margin-bottom: 6px;
}
.products-filter-grow {
  grid-column: span 1;
}
@media (min-width: 900px) {
  .products-filter-grow {
    grid-column: span 2;
  }
}
.products-filter-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.btn-outline {
  background: #fff;
  color: var(--primary);
  border: 1px solid #b8c9ff;
  font-weight: 700;
}
.btn-outline:hover {
  border-color: var(--primary);
}
.btn-sm {
  padding: 8px 12px;
  font-size: 0.88rem;
  font-weight: 700;
}
.products-table-panel,
.admin-table-panel {
  border: 1px solid #c9d8ff;
  box-shadow: 0 14px 30px rgba(24, 50, 120, 0.12);
  padding: 0;
  overflow: hidden;
}
.products-table-head,
.admin-table-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 16px 18px;
  border-bottom: 1px solid var(--border);
  background: linear-gradient(180deg, #fafcff, #fff);
}
.products-table-head h3,
.admin-table-head h3 {
  margin: 0;
  font-size: 1.05rem;
  color: #132a63;
}
.table-responsive {
  overflow-x: auto;
}
.products-table th,
.admin-table th {
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #5b6a87;
  background: linear-gradient(180deg, #f0f4ff, #f7f9ff);
  border-bottom: 2px solid #dbe4ff;
}
.products-table tbody tr,
.admin-table tbody tr {
  transition: background 0.15s ease;
}
.products-table tbody tr:hover,
.admin-table tbody tr:hover {
  background: rgba(47, 99, 255, 0.06);
}
.products-table td,
.admin-table td {
  vertical-align: middle;
}
.products-td-name {
  font-weight: 700;
  color: #1c2434;
}
.products-name {
  display: inline-block;
  vertical-align: middle;
}
.products-mini-thumb-wrap {
  display: inline-block;
  vertical-align: middle;
  margin-left: 8px;
}
.products-mini-thumb {
  width: 36px;
  height: 36px;
  object-fit: cover;
  border-radius: 8px;
  border: 1px solid var(--border);
}
.products-td-price {
  font-weight: 700;
  color: #1742b0;
}
.status-pill {
  display: inline-block;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 800;
}
.status-pill-ok {
  background: #e6ffef;
  color: #0b7d3b;
  border: 1px solid #b8efcf;
}
.status-pill-off {
  background: #f0f2f6;
  color: #5b6478;
  border: 1px solid #e0e4ed;
}
.status-pill-warn {
  background: #fff6df;
  color: #8a6400;
  border: 1px solid #f2d999;
}
.products-th-actions,
.products-td-actions {
  white-space: nowrap;
}
.link-action {
  font-weight: 700;
  color: var(--primary);
  text-decoration: none;
  margin-right: 12px;
}
.link-action:hover {
  text-decoration: underline;
}
.link-danger {
  color: #b42318;
}

/* Listado agentes: acciones y modal prompt */
.admin-table--agentes .admin-table-col-actions {
  width: 1%;
  min-width: 220px;
  vertical-align: middle;
}
.agentes-td-actions {
  vertical-align: middle;
  padding: 12px 14px !important;
}
.agentes-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  justify-content: flex-end;
}
.agentes-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 7px 12px;
  border-radius: 8px;
  font-size: 0.82rem;
  font-weight: 700;
  text-decoration: none;
  border: 1px solid transparent;
  cursor: pointer;
  font-family: inherit;
  line-height: 1.2;
  transition: background 0.15s, border-color 0.15s, color 0.15s;
}
.agentes-action--edit {
  background: #e8f0ff;
  color: #1f4cc8;
  border-color: #b8ceff;
}
.agentes-action--edit:hover {
  background: #d6e4ff;
  color: #153a9e;
}
.agentes-action--prompt {
  background: linear-gradient(145deg, #f0f7f2, #e4f4ea);
  color: #0d5c36;
  border-color: #9fd9b5;
}
.agentes-action--prompt:hover {
  background: #d8f0e2;
  color: #08422a;
}
.agentes-action--toggle {
  background: #fff;
  color: #5b6478;
  border-color: #d5dbe8;
}
.agentes-action--toggle:hover {
  background: #f4f6fb;
  color: #334463;
}
.agentes-tono-pill {
  display: inline-block;
  padding: 4px 10px;
  border-radius: 8px;
  font-size: 0.78rem;
  font-weight: 700;
  background: #f0f4fc;
  color: #3d4a63;
  border: 1px solid #dde4f2;
  text-transform: capitalize;
}
.agentes-td-muted {
  color: #6d7788;
  font-size: 0.92rem;
  max-width: 14rem;
}
.agentes-modal {
  position: fixed;
  inset: 0;
  z-index: 10050;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  box-sizing: border-box;
}
.agentes-modal[hidden] {
  display: none !important;
}
.agentes-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(16, 24, 40, 0.55);
  backdrop-filter: blur(4px);
}
.agentes-modal-dialog {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 720px;
  max-height: min(88vh, 900px);
  display: flex;
  flex-direction: column;
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 28px 80px rgba(16, 24, 40, 0.35);
  border: 1px solid #e2e8f0;
  overflow: hidden;
}
.agentes-modal-header {
  position: relative;
  padding: 20px 48px 16px 22px;
  border-bottom: 1px solid #e8ecf4;
  background: linear-gradient(180deg, #fafbff 0%, #fff 100%);
}
.agentes-modal-title {
  margin: 0 0 6px;
  font-size: 1.2rem;
  color: #132a63;
}
.agentes-modal-subtitle {
  margin: 0;
  font-size: 0.88rem;
  color: #5a6b8a;
  font-weight: 600;
}
.agentes-modal-close {
  position: absolute;
  top: 14px;
  right: 14px;
  width: 40px;
  height: 40px;
  border: none;
  background: #f0f2f6;
  border-radius: 10px;
  font-size: 1.5rem;
  line-height: 1;
  color: #5b6478;
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
}
.agentes-modal-close:hover {
  background: #e4e7ee;
  color: #1c2434;
}
.agentes-modal-body-wrap {
  flex: 1;
  min-height: 120px;
  overflow: auto;
  padding: 16px 22px;
}
.agentes-modal-loading {
  margin: 0;
  color: #5a6b8a;
  font-size: 0.95rem;
}
.agentes-modal-error {
  margin: 0;
  padding: 12px 14px;
  border-radius: 10px;
  background: #fff4f3;
  color: #b42318;
  border: 1px solid #f5c4c0;
  font-size: 0.9rem;
}
.agentes-modal-pre {
  margin: 0;
  padding: 14px 16px;
  border-radius: 12px;
  background: #f4f7fb;
  border: 1px solid #e2e8f0;
  font-size: 12px;
  line-height: 1.55;
  white-space: pre-wrap;
  word-break: break-word;
  max-height: min(52vh, 520px);
  overflow: auto;
  font-family: ui-monospace, "Cascadia Code", "Segoe UI Mono", Consolas, monospace;
  color: #1c2434;
}
.agentes-modal-footer {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-end;
  align-items: center;
  padding: 14px 22px 18px;
  border-top: 1px solid #e8ecf4;
  background: #fafbff;
}
body.agentes-modal-open {
  overflow: hidden;
}
@media (max-width: 640px) {
  .agentes-actions {
    justify-content: flex-start;
  }
  .admin-table--agentes .admin-table-col-actions {
    min-width: auto;
  }
}

.products-empty {
  padding: 36px 22px;
  text-align: center;
  color: #4c5c80;
}
.products-empty p {
  margin: 0 0 16px;
  max-width: 52ch;
  margin-left: auto;
  margin-right: auto;
  line-height: 1.55;
}
@media (max-width: 960px) {
  .products-page .products-hero,
  .admin-hero.panel {
    grid-template-columns: 1fr;
  }
}

/* Chips verificacion WhatsApp (antes inline en whatsapp_numeros.php) */
.v-chip {
  display: inline-block;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 700;
}
.v-ok { background: #e6ffef; color: #0b7d3b; }
.v-error { background: #ffe8e8; color: #b21919; }
.v-warn { background: #fff6df; color: #8a6400; }
.v-pending { background: #ecf2ff; color: #1f4cc8; }

/* Formulario producto / servicio */
.product-form-page-head {
  margin-bottom: 16px;
}
.product-form-back {
  display: inline-block;
  font-weight: 700;
  color: #1f4cc8;
  text-decoration: none;
  font-size: 0.9rem;
  margin-bottom: 8px;
}
.product-form-back:hover {
  text-decoration: underline;
}
.product-form-page-title {
  margin: 0 0 8px;
  font-size: clamp(1.35rem, 2.2vw, 1.65rem);
  color: #132a63;
}
.product-form-page-lead {
  margin: 0;
  color: #4c5c80;
  line-height: 1.55;
  max-width: 70ch;
}
.product-form-layout {
  display: grid;
  grid-template-columns: minmax(260px, 0.95fr) minmax(0, 1.4fr);
  gap: 16px;
  align-items: start;
}
.product-form-aside {
  border: 1px solid #c9d8ff;
  background: linear-gradient(155deg, #ffffff, #f3f7ff);
  box-shadow: 0 14px 28px rgba(24, 50, 120, 0.1);
}
.product-aside-title {
  margin: 0 0 10px;
  font-size: 1rem;
  color: #132a63;
}
.product-aside-list {
  margin: 0 0 14px;
  padding-left: 18px;
  color: #3f4f6f;
  line-height: 1.5;
  font-size: 0.92rem;
}
.product-ia-hint {
  background: #fff;
  border: 1px dashed #9fb6ff;
  border-radius: 12px;
  padding: 12px 14px;
}
.product-ia-hint strong {
  display: block;
  color: #1742b0;
  margin-bottom: 6px;
  font-size: 0.95rem;
}
.product-ia-hint p {
  margin: 0;
  font-size: 0.88rem;
  color: #4f5d7e;
  line-height: 1.45;
}
.product-form-card {
  border: 2px solid #b8c9ff;
  box-shadow: 0 22px 48px rgba(21, 46, 109, 0.16);
  background: linear-gradient(180deg, #ffffff 0%, #fafcff 100%);
}
.product-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px 18px;
}
.product-field-span-2 {
  grid-column: 1 / -1;
}
.product-field-full {
  grid-column: 1 / -1;
}
.product-desc-block {
  background: #f6f8ff;
  border: 1px solid #d5e0ff;
  border-radius: 14px;
  padding: 14px 16px 16px;
}
.product-desc-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 6px;
}
.product-desc-label {
  font-weight: 800;
  color: #132a63;
  font-size: 0.95rem;
}
.product-ia-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.btn-ai {
  background: linear-gradient(145deg, #6b4dff, #2f63ff);
  color: #fff;
  border: none;
  font-weight: 800;
  font-size: 0.82rem;
  padding: 9px 14px;
  border-radius: 10px;
  cursor: pointer;
  box-shadow: 0 8px 20px rgba(47, 99, 255, 0.28);
}
.btn-ai:hover {
  filter: brightness(1.05);
}
.btn-ai:disabled {
  opacity: 0.65;
  cursor: not-allowed;
}
.btn-ai-secondary {
  background: linear-gradient(145deg, #ffffff, #eef2ff);
  color: #1f3a8a;
  border: 1px solid #c9d8ff;
  box-shadow: 0 6px 14px rgba(25, 53, 125, 0.1);
}
.product-ia-microcopy {
  margin: 0 0 10px;
  font-size: 0.8rem;
  color: #5b6a87;
}
.product-desc-textarea {
  min-height: 140px;
  font-size: 0.95rem;
  line-height: 1.45;
  border: 1px solid #c9d8ff;
  box-shadow: inset 0 1px 3px rgba(25, 53, 125, 0.06);
}
.product-ia-status {
  margin: 10px 0 0;
  font-size: 0.86rem;
  color: #0b7d3b;
}
.product-ia-status-error {
  color: #8c1818;
}
.product-preview-row {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
}
.product-preview-label {
  font-weight: 700;
  color: #334463;
  font-size: 0.88rem;
}
.product-preview-img {
  max-width: 140px;
  border: 1px solid var(--border);
}
.product-form-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  padding-top: 6px;
  border-top: 1px solid var(--border);
  margin-top: 4px;
}
.product-save-btn {
  font-weight: 800;
  padding: 12px 20px;
  border-radius: 12px;
  box-shadow: 0 12px 26px rgba(47, 99, 255, 0.25);
}
.pagos-env-note {
  font-size: 0.88rem;
  line-height: 1.55;
  color: #475569;
  margin: 0 0 14px;
  padding: 12px 14px;
  background: #f1f5f9;
  border-radius: 10px;
  border-left: 4px solid #64748b;
}
.pagos-env-note code {
  font-size: 0.85em;
}

.wompi-pay-form {
  gap: 12px 16px;
}
.wompi-cta-btn {
  width: 100%;
  min-height: 56px;
  font-size: 1.05rem;
  font-weight: 800;
  border-radius: 14px;
  border: 1px solid #1658d4;
  background: linear-gradient(145deg, #1f7aff, #2f63ff 52%, #0f46d0);
  color: #fff;
  box-shadow: 0 18px 34px rgba(24, 88, 214, 0.32);
}
.wompi-cta-btn:hover {
  filter: brightness(1.04);
  transform: translateY(-1px);
}
.wompi-cta-btn:disabled {
  opacity: 0.78;
  cursor: wait;
  transform: none;
}
.wompi-cta-hint {
  margin: 8px 0 0;
  font-size: 0.85rem;
  color: #4f5f82;
}
.wompi-checkout-ready {
  margin-top: 14px;
  padding: 14px;
  border: 1px solid #c9d8ff;
  border-radius: 12px;
  background: linear-gradient(180deg, #f8fbff, #eff4ff);
}
.wompi-pay-launcher button {
  width: 100%;
  margin-top: 8px;
}

.auth-reset-card.auth-reset-form-card {
  border: 2px solid #b8c9ff;
  box-shadow: 0 22px 48px rgba(21, 46, 109, 0.14);
}
.auth-reset-user-hint {
  margin: 0 0 14px;
  padding: 12px 14px;
  background: linear-gradient(180deg, #f6f8ff, #eef2ff);
  border: 1px solid #d5e0ff;
  border-radius: 12px;
  font-size: 0.9rem;
  color: #334463;
}
.auth-reset-fallback {
  margin: 16px 0;
}
.login-form-card small {
  display: block;
  margin-top: 10px;
}
@media (max-width: 920px) {
  .product-form-layout {
    grid-template-columns: 1fr;
  }
  .product-form-grid {
    grid-template-columns: 1fr;
  }
  .product-field-span-2,
  .product-field-full {
    grid-column: 1;
  }
}

/* Navegacion movil del sidebar (mejor UX en celular) */
@media (max-width: 960px) {
  .admin-app .sidebar {
    position: sticky;
    top: 0;
    z-index: 55;
    width: 100%;
    padding: 10px 12px 12px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.14);
  }
  .admin-app .sidebar .brand {
    margin: 0 0 8px;
    padding-bottom: 0;
    border-bottom: 0;
    font-size: 1.05rem;
  }
  .admin-app .sidebar nav {
    flex-direction: row;
    gap: 8px;
    overflow-x: auto;
    overflow-y: hidden;
    white-space: nowrap;
    padding-bottom: 2px;
    scrollbar-width: thin;
  }
  .admin-app .sidebar nav::-webkit-scrollbar {
    height: 6px;
  }
  .admin-app .sidebar nav::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.28);
    border-radius: 999px;
  }
  .admin-app .sidebar nav a {
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.12);
    color: #f2f6ff;
    padding: 8px 12px;
    border-radius: 999px;
    font-size: 0.82rem;
    flex: 0 0 auto;
  }
  .admin-app .sidebar nav a:hover {
    background: rgba(79, 134, 255, 0.28);
    border-color: rgba(159, 190, 255, 0.65);
    text-decoration: none;
  }
  .admin-app .content {
    padding: 14px;
  }
}

/* --- Lead detalle: layout tipo WhatsApp + CRM --- */
.lead-detalle-page {
  --lead-wa-header: #075e54;
  --lead-wa-header-2: #128c7e;
  --lead-chat-bg: #e5ddd5;
  --lead-bubble-in: #fff;
  --lead-bubble-out: #dcf8c6;
  --lead-bubble-sys: rgba(255, 255, 255, 0.92);
  --lead-crm-bg: #f0f4f8;
  --lead-crm-card: #fff;
  --lead-crm-border: #e2e8f0;
}

.lead-page-toolbar {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
  margin-bottom: 14px;
  padding: 12px 16px;
  background: linear-gradient(135deg, #1a2f4a 0%, #243b55 100%);
  border-radius: 14px;
  color: #f1f5ff;
  box-shadow: 0 10px 28px rgba(17, 36, 71, 0.18);
}

.lead-toolbar-back {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 14px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.12);
  border: 1px solid rgba(255, 255, 255, 0.2);
  color: #fff;
  text-decoration: none;
  font-size: 0.88rem;
  font-weight: 700;
  transition: background 0.15s ease;
}

.lead-toolbar-back:hover {
  background: rgba(255, 255, 255, 0.2);
  color: #fff;
}

.lead-toolbar-back-icon {
  width: 8px;
  height: 8px;
  border-left: 2px solid #fff;
  border-bottom: 2px solid #fff;
  transform: rotate(45deg);
  margin-right: 2px;
}

.lead-toolbar-meta {
  flex: 1;
  min-width: 160px;
}

.lead-toolbar-title {
  margin: 0;
  font-size: 1.15rem;
  font-weight: 800;
  letter-spacing: -0.02em;
}

.lead-toolbar-sub {
  margin: 4px 0 0;
  font-size: 0.82rem;
  opacity: 0.88;
}

.lead-toolbar-pill.lead-toolbar-status {
  margin-left: auto;
  background: rgba(255, 255, 255, 0.95);
  color: #1a365d;
  border: none;
  font-weight: 700;
}

.lead-workspace {
  display: grid;
  grid-template-columns: 1fr minmax(300px, 400px);
  gap: 0;
  /* Altura fija al viewport: el chat hace scroll interno y el compositor no queda debajo del fold */
  height: calc(100vh - 172px);
  max-height: calc(100vh - 172px);
  min-height: 320px;
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid var(--lead-crm-border);
  box-shadow: 0 16px 40px rgba(15, 35, 71, 0.12);
  background: var(--lead-crm-card);
}

.lead-wa-shell {
  display: flex;
  flex-direction: column;
  min-height: 0;
  height: 100%;
  overflow: hidden;
  background: var(--lead-chat-bg);
  background-image: repeating-linear-gradient(
      -45deg,
      transparent,
      transparent 8px,
      rgba(0, 0, 0, 0.02) 8px,
      rgba(0, 0, 0, 0.02) 16px
    ),
    radial-gradient(circle at 20% 20%, rgba(255, 255, 255, 0.35) 0%, transparent 45%),
    radial-gradient(circle at 80% 60%, rgba(18, 140, 126, 0.08) 0%, transparent 40%);
}

.lead-wa-header {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 16px;
  background: linear-gradient(90deg, var(--lead-wa-header) 0%, var(--lead-wa-header-2) 100%);
  color: #fff;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}

.lead-wa-avatar {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.22);
  display: grid;
  place-items: center;
  font-weight: 800;
  font-size: 1.1rem;
  flex-shrink: 0;
}

.lead-wa-header-text {
  flex: 1;
  min-width: 0;
}

.lead-wa-name {
  display: block;
  font-size: 1rem;
  font-weight: 700;
}

.lead-wa-phone {
  display: block;
  font-size: 0.8rem;
  opacity: 0.9;
  margin-top: 2px;
}

.lead-wa-badge {
  font-size: 0.72rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.2);
  border: 1px solid rgba(255, 255, 255, 0.35);
}

.lead-wa-chat-wrap {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 16px 14px 12px;
  scroll-behavior: smooth;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}

.lead-wa-empty {
  max-width: 320px;
  margin: 48px auto;
  text-align: center;
  padding: 24px;
  background: rgba(255, 255, 255, 0.65);
  border-radius: 16px;
  border: 1px dashed rgba(7, 94, 84, 0.25);
  color: #334155;
  font-size: 0.9rem;
  line-height: 1.5;
}

.lead-wa-empty-icon {
  width: 48px;
  height: 48px;
  margin: 0 auto 12px;
  border-radius: 12px;
  background: linear-gradient(145deg, #25d366, #128c7e);
  opacity: 0.85;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 01-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 01-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 012.893 6.994c-.003 5.45-4.435 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0012.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 005.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893a11.821 11.821 0 00-3.48-8.413z'/%3E%3C/svg%3E")
    center / 28px 28px no-repeat;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 01-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 01-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 012.893 6.994c-.003 5.45-4.435 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0012.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 005.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893a11.821 11.821 0 00-3.48-8.413z'/%3E%3C/svg%3E")
    center / 28px 28px no-repeat;
  background-color: #128c7e;
}

.lead-wa-messages {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.lead-bubble-row {
  display: flex;
  width: 100%;
}

.lead-bubble-row--in {
  justify-content: flex-start;
}

.lead-bubble-row--out {
  justify-content: flex-end;
}

.lead-bubble-row--sistema {
  justify-content: center;
}

.lead-bubble {
  max-width: min(82%, 420px);
  padding: 8px 12px 6px;
  border-radius: 10px;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.06);
  position: relative;
}

.lead-bubble-row--in .lead-bubble {
  background: var(--lead-bubble-in);
  border-radius: 4px 12px 12px 12px;
}

.lead-bubble-row--out .lead-bubble {
  background: var(--lead-bubble-out);
  border-radius: 12px 4px 12px 12px;
}

.lead-bubble-row--sistema .lead-bubble {
  background: var(--lead-bubble-sys);
  max-width: min(92%, 480px);
  border-radius: 10px;
  border: 1px solid rgba(0, 0, 0, 0.06);
  text-align: center;
}

.lead-bubble-label {
  display: block;
  font-size: 0.68rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #128c7e;
  margin-bottom: 4px;
}

.lead-bubble-row--in .lead-bubble-label {
  color: #546e7a;
}

.lead-bubble-row--sistema .lead-bubble-label {
  color: #64748b;
}

.lead-bubble-text {
  font-size: 0.92rem;
  line-height: 1.45;
  color: #111827;
  word-break: break-word;
}

.lead-bubble-foot {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 6px;
  flex-wrap: wrap;
}

.lead-bubble-time {
  font-size: 0.68rem;
  color: #64748b;
}

.lead-bubble-row--sistema .lead-bubble-foot {
  justify-content: center;
}

.lead-bubble-row--in .lead-bubble-foot {
  justify-content: flex-start;
}

.lead-wa-ticks {
  display: inline-flex;
  align-items: center;
  line-height: 1;
  user-select: none;
}

.lead-wa-tick {
  font-size: 0.72rem;
  letter-spacing: -2px;
  font-weight: 700;
}

.lead-wa-tick--sent {
  color: #8696a0;
}

.lead-wa-tick--dbl.lead-wa-tick--delivered {
  color: #8696a0;
}

.lead-wa-tick--dbl.lead-wa-tick--read {
  color: #53bdeb;
}

.lead-wa-tick--fail {
  color: #dc2626;
  letter-spacing: 0;
  font-size: 0.78rem;
}

.lead-wa-tick--pending {
  color: #cbd5e1;
  letter-spacing: 0;
  font-size: 0.65rem;
}

.lead-wa-composer {
  flex: 0 0 auto;
  padding: 12px 14px 14px;
  background: #f0f2f5;
  border-top: 1px solid rgba(0, 0, 0, 0.06);
}

.lead-wa-composer-hint {
  margin: 0 0 8px;
  font-size: 0.75rem;
  color: #64748b;
  line-height: 1.35;
}

.lead-wa-composer-row {
  display: flex;
  gap: 10px;
  align-items: flex-end;
}

.lead-wa-input {
  flex: 1;
  border: 1px solid #cfd8dc;
  border-radius: 24px;
  padding: 10px 16px;
  font-size: 0.92rem;
  resize: none;
  min-height: 44px;
  max-height: 120px;
  font-family: inherit;
  background: #fff;
}

.lead-wa-input:focus {
  outline: none;
  border-color: #128c7e;
  box-shadow: 0 0 0 3px rgba(18, 140, 126, 0.15);
}

.lead-wa-send {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 10px 18px;
  border: none;
  border-radius: 999px;
  background: linear-gradient(145deg, #25d366, #128c7e);
  color: #fff;
  font-weight: 800;
  font-size: 0.88rem;
  cursor: pointer;
  box-shadow: 0 4px 12px rgba(18, 140, 126, 0.35);
  transition: transform 0.1s ease, box-shadow 0.15s ease;
}

.lead-wa-send:hover {
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(18, 140, 126, 0.4);
}

.lead-wa-send:disabled {
  opacity: 0.65;
  cursor: not-allowed;
  transform: none;
}

.lead-wa-send-icon {
  width: 18px;
  height: 18px;
  background: #fff;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M2.01 21L23 12 2.01 3 2 10l15 2-15 2z'/%3E%3C/svg%3E") center / contain no-repeat;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M2.01 21L23 12 2.01 3 2 10l15 2-15 2z'/%3E%3C/svg%3E") center / contain no-repeat;
}

.lead-detalle-wa-status {
  margin: 8px 0 0;
  font-size: 0.82rem;
  font-weight: 600;
}

.lead-detalle-wa-status--ok {
  color: #0f766e;
}

.lead-detalle-wa-status--err {
  color: #b91c1c;
}

.lead-crm-panel {
  background: var(--lead-crm-bg);
  min-height: 0;
  height: 100%;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 14px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.lead-crm-section--card {
  background: var(--lead-crm-card);
  border: 1px solid var(--lead-crm-border);
  border-radius: 14px;
  padding: 14px 16px;
  box-shadow: 0 4px 14px rgba(15, 35, 71, 0.06);
}

.lead-crm-section--warn {
  border-color: #fcd34d;
  background: #fffbeb;
}

.lead-crm-h {
  margin: 0 0 12px;
  font-size: 0.95rem;
  font-weight: 800;
  color: #0f172a;
  letter-spacing: -0.02em;
}

.lead-crm-subh {
  margin: 18px 0 10px;
  font-size: 0.82rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #64748b;
}

.lead-crm-muted {
  margin: 0 0 10px;
  font-size: 0.82rem;
  color: #64748b;
  line-height: 1.4;
}

.lead-crm-dl {
  margin: 0;
}

.lead-crm-dl-row {
  display: grid;
  grid-template-columns: 100px 1fr;
  gap: 8px 12px;
  padding: 8px 0;
  border-bottom: 1px solid #f1f5f9;
  font-size: 0.88rem;
}

.lead-crm-dl-row:last-child {
  border-bottom: none;
}

.lead-crm-dl-row dt {
  margin: 0;
  font-weight: 700;
  color: #64748b;
}

.lead-crm-dl-row dd {
  margin: 0;
  color: #0f172a;
  word-break: break-word;
}

.lead-crm-dl-row--block {
  grid-template-columns: 1fr;
}

.lead-crm-dl-row--block dt {
  margin-bottom: 4px;
}

.lead-pipeline {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.lead-pipeline-chip {
  display: inline-block;
  padding: 8px 12px;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 700;
  text-decoration: none;
  color: #334155;
  background: #f1f5f9;
  border: 1px solid #e2e8f0;
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.lead-pipeline-chip:hover {
  background: #e2e8f0;
  color: #0f172a;
}

.lead-pipeline-chip--active {
  background: linear-gradient(135deg, #2f63ff, #5b8cff);
  color: #fff;
  border-color: transparent;
  box-shadow: 0 4px 12px rgba(47, 99, 255, 0.35);
}

.lead-crm-form {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.lead-crm-form--nested {
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px dashed #e2e8f0;
}

.lead-crm-label {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: 0.78rem;
  font-weight: 700;
  color: #475569;
}

.lead-crm-input {
  width: 100%;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  padding: 9px 11px;
  font-size: 0.88rem;
  font-family: inherit;
}

.lead-crm-input:focus {
  outline: none;
  border-color: #2f63ff;
  box-shadow: 0 0 0 3px rgba(47, 99, 255, 0.12);
}

.lead-crm-btn-primary {
  border: none;
  border-radius: 10px;
  padding: 10px 16px;
  font-weight: 800;
  font-size: 0.88rem;
  cursor: pointer;
  background: linear-gradient(135deg, #2f63ff, #5b8cff);
  color: #fff;
  box-shadow: 0 4px 12px rgba(47, 99, 255, 0.25);
}

.lead-crm-btn-primary--sm {
  padding: 8px 12px;
  font-size: 0.82rem;
}

.lead-crm-btn-ghost {
  border: 1px solid #e2e8f0;
  background: #fff;
  border-radius: 8px;
  padding: 6px 12px;
  font-size: 0.78rem;
  font-weight: 700;
  cursor: pointer;
  color: #334155;
}

.lead-crm-btn-ghost:hover {
  background: #f8fafc;
}

.lead-crm-timeline {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.lead-crm-task {
  padding: 12px;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  background: #fafbfc;
}

.lead-crm-task--realizado {
  opacity: 0.75;
  border-color: #bbf7d0;
  background: #f0fdf4;
}

.lead-crm-task--cancelado {
  opacity: 0.65;
  border-color: #fecaca;
  background: #fef2f2;
}

.lead-crm-task-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
}

.lead-crm-task-badge {
  font-size: 0.65rem;
  font-weight: 800;
  text-transform: uppercase;
  padding: 4px 8px;
  border-radius: 6px;
  background: #e2e8f0;
  color: #475569;
}

.lead-crm-task--pendiente .lead-crm-task-badge {
  background: #dbeafe;
  color: #1d4ed8;
}

.lead-crm-task-when {
  display: block;
  font-size: 0.78rem;
  color: #64748b;
  margin-top: 6px;
}

.lead-crm-task-desc {
  margin: 8px 0 0;
  font-size: 0.85rem;
  line-height: 1.45;
  color: #334155;
}

.lead-crm-task-user {
  display: block;
  margin-top: 6px;
  color: #94a3b8;
}

.lead-crm-task-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin-top: 10px;
}

.lead-crm-inline {
  display: inline;
  margin: 0;
}

.lead-crm-details summary {
  cursor: pointer;
  font-size: 0.8rem;
  font-weight: 700;
  color: #2f63ff;
}

.lead-crm-warn {
  margin: 0;
  font-size: 0.88rem;
  color: #92400e;
  line-height: 1.45;
}

@media (max-width: 1024px) {
  .lead-workspace {
    grid-template-columns: 1fr;
    height: auto;
    max-height: none;
    min-height: 0;
  }

  .lead-wa-shell {
    height: min(58vh, 520px);
    max-height: min(58vh, 520px);
    min-height: 280px;
    border-right: none;
    border-bottom: 1px solid var(--lead-crm-border);
  }

  .lead-crm-panel {
    height: auto;
    max-height: none;
    overflow-y: visible;
  }
}

@media (max-width: 600px) {
  .lead-page-toolbar {
    flex-direction: column;
    align-items: flex-start;
  }

  .lead-toolbar-pill.lead-toolbar-status {
    margin-left: 0;
  }

  .lead-wa-send-text {
    display: none;
  }

  .lead-wa-send {
    padding: 12px 14px;
    border-radius: 50%;
  }
}

/* --- Leads: listado (pipeline) --- */
.leads-module-page .leads-page-hero.admin-hero.panel {
  border-color: #b8d4e8;
  background: linear-gradient(135deg, #f5f9fc 0%, #e8f4f8 35%, #eef6ff 100%);
  box-shadow: 0 18px 40px rgba(15, 60, 90, 0.12);
}

.leads-module-page .leads-page-pill.admin-pill {
  background: linear-gradient(135deg, #0f766e, #14b8a6);
  color: #ecfeff;
  border: 1px solid rgba(255, 255, 255, 0.35);
}

.leads-stat-card.admin-stat {
  position: relative;
  overflow: hidden;
  border-color: #b8d4e8;
  background: linear-gradient(165deg, #fff 0%, #f0f9ff 100%);
}

.leads-stat-card.admin-stat::after {
  content: "";
  position: absolute;
  right: -20px;
  top: -20px;
  width: 80px;
  height: 80px;
  border-radius: 50%;
  background: rgba(20, 184, 166, 0.12);
  pointer-events: none;
}

.leads-stat-hint {
  display: block;
  margin-top: 8px;
  font-size: 0.72rem;
  color: #64748b;
  font-weight: 600;
}

.leads-hint-card {
  display: flex;
  gap: 16px;
  align-items: flex-start;
  padding: 16px 18px;
  margin-bottom: 14px;
  background: linear-gradient(90deg, #fffbeb 0%, #fff 45%);
  border: 1px solid #fde68a;
  border-radius: 14px;
  box-shadow: 0 8px 22px rgba(146, 64, 14, 0.08);
}

.leads-hint-icon {
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background-color: #ea580c;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-6h2v6zm0-8h-2V7h2v2z'/%3E%3C/svg%3E")
    center / 26px 26px no-repeat;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-6h2v6zm0-8h-2V7h2v2z'/%3E%3C/svg%3E")
    center / 26px 26px no-repeat;
}

.leads-hint-title {
  margin: 0 0 8px;
  font-size: 1rem;
  font-weight: 800;
  color: #78350f;
}

.leads-hint-body p {
  margin: 0;
  font-size: 0.9rem;
  line-height: 1.55;
  color: #57534e;
}

.leads-filter-card {
  border: 1px solid #c9d8ff;
  border-radius: 14px;
  box-shadow: 0 10px 24px rgba(24, 50, 120, 0.08);
  margin-bottom: 14px;
}

.leads-filter-title {
  margin: 0 0 12px;
  font-size: 1rem;
  color: #132a63;
}

.leads-filter-form {
  align-items: end;
}

.leads-filter-btn {
  border-radius: 10px;
  font-weight: 800;
}

.leads-filter-form--extended {
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
}
.leads-filter-actions--row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: end;
}
.leads-filter-hint {
  margin: 10px 0 0;
  font-size: 0.82rem;
  color: #64748b;
  line-height: 1.4;
}
.leads-filter-reset {
  text-align: center;
  font-weight: 700;
}
.leads-pagination {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 12px 18px;
  padding: 14px 12px 4px;
  border-top: 1px solid #e2e8f0;
  background: linear-gradient(180deg, #fafbfd 0%, #fff 100%);
}
.leads-page-btn {
  font-weight: 700;
  font-size: 0.88rem;
  color: #1e40af;
  text-decoration: none;
  padding: 8px 14px;
  border-radius: 10px;
  border: 1px solid #bfdbfe;
  background: #fff;
}
.leads-page-btn:hover:not(.is-disabled) {
  background: #eff6ff;
  border-color: #93c5fd;
}
.leads-page-btn.is-disabled {
  color: #94a3b8;
  border-color: #e2e8f0;
  cursor: not-allowed;
  pointer-events: none;
}
.leads-page-info {
  font-size: 0.88rem;
  font-weight: 700;
  color: #475569;
}

.leads-table-panel.admin-table-panel {
  border-radius: 16px;
  border-color: #c5d8f0;
  box-shadow: 0 16px 36px rgba(19, 42, 99, 0.1);
}

.leads-table-head.admin-table-head {
  background: linear-gradient(180deg, #f8fafc 0%, #fff 100%);
  border-bottom-color: #e2e8f0;
}

.leads-table-head h3 {
  margin: 0 0 4px;
}

.leads-table-sub {
  margin: 0;
  font-size: 0.82rem;
  color: #64748b;
  font-weight: 600;
}

.leads-table-scroll {
  max-height: min(68vh, 720px);
  overflow: auto;
}

.leads-table.admin-table thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: linear-gradient(180deg, #eef2ff 0%, #f8fafc 100%);
  box-shadow: 0 1px 0 #dbe4ff;
}

.leads-table.admin-table tbody tr.leads-row {
  border-left: 3px solid transparent;
}

.leads-table.admin-table tbody tr.leads-row:hover {
  border-left-color: #14b8a6;
  background: rgba(20, 184, 166, 0.06);
}

.leads-person {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.leads-person-avatar {
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  border-radius: 10px;
  display: grid;
  place-items: center;
  font-size: 0.95rem;
  font-weight: 800;
  color: #fff;
  background: linear-gradient(145deg, #2f63ff, #6366f1);
  box-shadow: 0 4px 12px rgba(47, 99, 255, 0.3);
}

.leads-person-name {
  font-weight: 800;
  color: #0f172a;
  font-size: 0.92rem;
  line-height: 1.25;
}

.leads-chat-badge {
  display: inline-block;
  max-width: 140px;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 700;
  color: #14532d;
  background: #dcfce7;
  border: 1px solid #bbf7d0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: middle;
}

.leads-cell-empresa {
  font-weight: 600;
  color: #334155;
  font-size: 0.88rem;
}

.leads-mono {
  font-family: ui-monospace, "Cascadia Mono", "Segoe UI Mono", monospace;
  font-size: 0.84rem;
  color: #475569;
}

.leads-cell-email {
  font-size: 0.86rem;
  color: #475569;
  word-break: break-all;
}

.leads-time {
  font-size: 0.82rem;
  font-weight: 600;
  color: #64748b;
}

.leads-cell-muted {
  color: #94a3b8;
  font-size: 0.88rem;
}

.leads-td-interes {
  max-width: 220px;
}

.leads-interes-text,
.leads-obs-text {
  margin: 0;
  font-size: 0.82rem;
  line-height: 1.4;
  color: #334155;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.leads-obs-text {
  margin-top: 4px;
  font-size: 0.76rem;
  color: #64748b;
  -webkit-line-clamp: 1;
}

.leads-stage-pill {
  display: inline-flex;
  align-items: center;
  padding: 6px 12px;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  white-space: nowrap;
}

.leads-stage-pill--nuevo {
  background: #e0e7ff;
  color: #3730a3;
  border: 1px solid #c7d2fe;
}

.leads-stage-pill--contactado {
  background: #dbeafe;
  color: #1e40af;
  border: 1px solid #bfdbfe;
}

.leads-stage-pill--en_seguimiento {
  background: #ffedd5;
  color: #9a3412;
  border: 1px solid #fed7aa;
}

.leads-stage-pill--vendido {
  background: #dcfce7;
  color: #14532d;
  border: 1px solid #bbf7d0;
}

.leads-stage-pill--descartado {
  background: #f1f5f9;
  color: #475569;
  border: 1px solid #e2e8f0;
}

.leads-col-actions {
  min-width: 200px;
  width: 1%;
}

.leads-td-actions {
  vertical-align: middle;
}

.leads-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.leads-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 12px;
  border-radius: 10px;
  font-size: 0.78rem;
  font-weight: 800;
  text-decoration: none;
  border: 1px solid transparent;
  cursor: pointer;
  font-family: inherit;
  line-height: 1.2;
  transition: transform 0.1s ease, box-shadow 0.15s ease, background 0.15s ease;
  background: #fff;
  color: #1e293b;
}

.leads-btn:hover {
  transform: translateY(-1px);
}

.leads-btn--detail {
  background: linear-gradient(135deg, #2f63ff, #5b8cff);
  color: #fff;
  border-color: transparent;
  box-shadow: 0 4px 14px rgba(47, 99, 255, 0.35);
}

.leads-btn--detail:hover {
  color: #fff;
  box-shadow: 0 6px 18px rgba(47, 99, 255, 0.42);
}

.leads-btn--stage {
  border-color: #e2e8f0;
  background: #f8fafc;
  color: #334155;
}

.leads-btn--stage:hover {
  background: #f1f5f9;
  border-color: #cbd5e1;
}

.leads-btn--danger {
  border-color: #fecaca;
  background: #fff;
  color: #b91c1c;
}

.leads-btn--danger:hover {
  background: #fef2f2;
  border-color: #f87171;
  color: #991b1b;
}

.leads-btn-ico {
  width: 14px;
  height: 14px;
  flex-shrink: 0;
  opacity: 0.95;
}

.leads-btn--detail .leads-btn-ico {
  background: #fff;
}

.leads-btn-ico--chat {
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M20 2H4c-1.1 0-2 .9-2 2v18l4-4h14c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm0 14H6l-2 2V4h16v12z'/%3E%3C/svg%3E")
    center / contain no-repeat;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M20 2H4c-1.1 0-2 .9-2 2v18l4-4h14c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm0 14H6l-2 2V4h16v12z'/%3E%3C/svg%3E")
    center / contain no-repeat;
  background: #fff;
}

.leads-btn-ico--stage {
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M12 8c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z'/%3E%3C/svg%3E")
    center / contain no-repeat;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M12 8c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z'/%3E%3C/svg%3E")
    center / contain no-repeat;
  background: #64748b;
}

.leads-btn-ico--trash {
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zM19 4h-3.5l-1-1h-5l-1 1H5v2h14V4z'/%3E%3C/svg%3E")
    center / contain no-repeat;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zM19 4h-3.5l-1-1h-5l-1 1H5v2h14V4z'/%3E%3C/svg%3E")
    center / contain no-repeat;
  background: #b91c1c;
}

.leads-actions-dropdown-wrap {
  position: relative;
}

.leads-etapa-menu {
  position: absolute;
  right: 0;
  top: calc(100% + 6px);
  z-index: 30;
  min-width: 200px;
  margin: 0;
  padding: 6px;
  list-style: none;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  box-shadow: 0 16px 40px rgba(15, 23, 42, 0.18);
}

.leads-etapa-menu li {
  margin: 0;
}

.leads-etapa-menu a {
  display: block;
  padding: 10px 12px;
  border-radius: 8px;
  font-size: 0.86rem;
  font-weight: 700;
  color: #334155;
  text-decoration: none;
}

.leads-etapa-menu a:hover {
  background: #f1f5f9;
  color: #0f172a;
}

.leads-empty-state {
  padding: 48px 24px;
  text-align: center;
}

.leads-empty-title {
  margin: 0 0 8px;
  font-size: 1.1rem;
  font-weight: 800;
  color: #1e293b;
}

.leads-empty-text {
  margin: 0;
  font-size: 0.92rem;
  color: #64748b;
  line-height: 1.5;
}

@media (max-width: 1100px) {
  .leads-td-interes {
    max-width: 160px;
  }
}

@media (max-width: 768px) {
  .leads-actions {
    flex-direction: column;
    align-items: stretch;
  }

  .leads-btn {
    justify-content: center;
  }

  .leads-etapa-menu {
    left: 0;
    right: auto;
  }

  .leads-table-scroll {
    max-height: none;
  }
}

/* Footer legal global */
.site-footer{border-top:1px solid #d9e3f7;background:#fff;padding:12px 18px}
.site-footer-inner{max-width:1200px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;color:#4f5d7e;font-size:.9rem}
.site-footer-links{display:flex;gap:12px;flex-wrap:wrap}
.site-footer-links a{text-decoration:none;color:#2948a5;font-weight:700}
.site-footer-links a:hover{text-decoration:underline}

/* Footer legal en paginas auth */
.register-footer-links{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.register-footer-links a{text-decoration:none;color:#1e3c95;font-weight:700}

/* Paginas legales */
.legal-body{margin:0;background:#f4f7fb;color:#1c2434;font-family:Arial,sans-serif}
.legal-shell{max-width:900px;margin:30px auto;padding:24px;background:#fff;border:1px solid #dce4f5;border-radius:14px;box-shadow:0 14px 28px rgba(21,46,109,.1)}
.legal-shell h1{margin-top:0;color:#11244f}
.legal-shell h2{margin:20px 0 8px;color:#1f3d89}
.legal-shell p{line-height:1.6;color:#3f4f6f}
.legal-meta{margin-top:18px;font-size:.9rem;color:#667085}

/* Links legales visibles en landing */
.legal-links-section{padding:10px 0 20px}
.legal-links-wrap{display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap;color:#4f5d7e;font-size:.92rem}
.legal-links-wrap a{text-decoration:none;color:#2948a5;font-weight:700}
.legal-links-wrap a:hover{text-decoration:underline}