/* ============================================================
   IbeKa — Hoja de estilos propia
   Identidad basada en ibeka.co (cosmetics): degradado azul→
   púrpura→rosa, acento lima, tipografía Poppins. Todo local.
   ============================================================ */

/* ---------- Tipografía Poppins (local, sin CDN) ---------- */
@font-face { font-family:'Poppins'; font-weight:400; font-display:swap; src:url('../vendor/fonts/poppins-400.woff2') format('woff2'); }
@font-face { font-family:'Poppins'; font-weight:600; font-display:swap; src:url('../vendor/fonts/poppins-600.woff2') format('woff2'); }
@font-face { font-family:'Poppins'; font-weight:700; font-display:swap; src:url('../vendor/fonts/poppins-700.woff2') format('woff2'); }

:root {
  /* Degradado de marca (favicon ibeka.co) */
  --g1:#5B5BD6;   /* azul-índigo */
  --g2:#9B4DE0;   /* púrpura */
  --g3:#FF4FA3;   /* rosa */
  --grad: linear-gradient(135deg, var(--g1) 0%, var(--g2) 50%, var(--g3) 100%);

  --brand:        #9B4DE0;  /* púrpura principal */
  --brand-dark:   #7A2FC0;
  --brand-pink:   #FF4FA3;
  --brand-light:  #F3E9FC;
  --accent:       #BAF771;  /* lima */
  --accent-dark:  #94d24a;

  --ink:          #17121F;  /* casi negro */
  --ink-soft:     #4A4458;
  --bg:           #FAFAF8;  /* blanco hueso */
  --bg-soft:      #F3F2F7;
  --gray:         #6E6880;
  --line:         #E7E3EE;
}

* { box-sizing: border-box; }
html, body { height: 100%; }

body {
  font-family: 'Poppins', system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  color: var(--ink);
  background: var(--bg);
  line-height: 1.6;
}

h1, h2, h3, h4, h5, h6 { font-weight: 700; color: var(--ink); }
a { text-decoration: none; }

.text-brand { color: var(--brand) !important; }
.text-pink  { color: var(--brand-pink) !important; }
.bg-brand   { background: var(--brand) !important; }
.bg-ink     { background: var(--ink) !important; }
.bg-soft    { background: var(--bg-soft) !important; }
.bg-grad    { background: var(--grad) !important; }
.text-gradient {
  background: var(--grad);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent;
}

/* ---------- Logo wordmark "IbeKa" (Poppins) ---------- */
.wm {
  font-family:'Poppins', sans-serif; font-weight:600;
  font-size:1.6rem; letter-spacing:-.02em; color:var(--ink);
  line-height:1; display:inline-flex; align-items:baseline;
}
.wm .k { font-weight:700; }
.wm-light { color:#fff; }
.wm .dot { font-size:.55em; font-weight:600; color:var(--brand-pink); margin-left:1px; }

/* Insignia circular con la K (degradado) */
.k-badge{
  width:40px;height:40px;border-radius:50%;
  background:var(--grad); display:grid;place-items:center;
  color:#fff;font-family:'Poppins';font-weight:700;font-size:1.3rem;
  box-shadow:0 3px 10px rgba(155,77,224,.4);
}

/* ---------- Botones ---------- */
.btn-brand {
  background: var(--grad); color:#fff; font-weight:600;
  border-radius:999px; padding:.65rem 1.6rem; border:none;
  background-size:140% 140%; transition:filter .2s, transform .2s;
}
.btn-brand:hover { color:#fff; filter:brightness(1.06); transform:translateY(-1px); }

.btn-outline-brand {
  color:var(--brand); font-weight:600; border-radius:999px;
  padding:.65rem 1.6rem; border:2px solid var(--brand); background:transparent; transition:all .2s;
}
.btn-outline-brand:hover { background:var(--brand); color:#fff; }

.btn-accent {
  background:var(--accent); color:var(--ink); font-weight:700;
  border-radius:999px; padding:.7rem 1.8rem; border:none;
}
.btn-accent:hover { background:var(--accent-dark); color:var(--ink); }

/* ---------- Navbar ---------- */
.navbar-ibeka { background:transparent; padding:1rem 2rem; transition:background .35s, box-shadow .35s, padding .35s; }
.navbar-ibeka.scrolled { background:rgba(23,18,31,.92); backdrop-filter:blur(6px); box-shadow:0 4px 18px rgba(23,18,31,.25); padding:.55rem 2rem; }
.navbar-ibeka .nav-link { color:#fff; font-weight:600; opacity:.9; }
.navbar-ibeka .nav-link:hover { opacity:1; color:var(--accent); }

/* ---------- Hero ---------- */
.hero { background:var(--ink); color:#fff; padding:9rem 0 5rem; overflow:hidden; position:relative; }
.hero::before{
  content:""; position:absolute; inset:0;
  background:radial-gradient(900px 500px at 80% -10%, rgba(255,79,163,.35), transparent 60%),
             radial-gradient(700px 500px at 0% 100%, rgba(91,91,214,.45), transparent 55%);
}
.hero > .container { position:relative; z-index:1; }
.hero h1 { color:#fff; font-size:clamp(2.2rem,4vw,3.4rem); line-height:1.12; }
.hero h1 .accent { color:var(--accent); }
.hero p.lead { color:#e4def0; font-size:1.2rem; }
.hero img { max-width:100%; filter:drop-shadow(0 18px 40px rgba(0,0,0,.4)); }

/* ---------- Secciones ---------- */
.section { padding:5rem 0; }
.section-title { font-size:clamp(1.6rem,3vw,2.4rem); margin-bottom:.5rem; }
.section-sub { color:var(--gray); max-width:720px; margin:0 auto 2.5rem; }

/* ---------- Tarjeta de característica ---------- */
.feature-card { background:#fff; border:1px solid var(--line); border-radius:18px; padding:1.8rem 1.5rem; height:100%; transition:transform .2s, box-shadow .2s, border-color .2s; }
.feature-card:hover { transform:translateY(-6px); box-shadow:0 16px 36px rgba(155,77,224,.16); border-color:var(--brand); }
.feature-ico { width:60px;height:60px;display:grid;place-items:center;border-radius:14px;background:var(--brand-light);color:var(--brand);margin-bottom:1rem; }
.feature-ico svg { width:30px;height:30px; }
.feature-card h5 { font-size:1.05rem; }
.feature-card p  { color:var(--gray); font-size:.94rem; margin:0; }

/* ---------- Módulos ---------- */
.module-soft { background:var(--bg-soft); }
.checklist { list-style:none; padding:0; margin:0; }
.checklist li { display:flex; gap:.8rem; margin-bottom:1rem; align-items:flex-start; }
.checklist li svg { flex:0 0 22px; color:var(--brand); margin-top:3px; }

/* ---------- Integraciones ---------- */
.integration-pill { border:1px solid var(--line); border-radius:12px; padding:.9rem 1.2rem; font-weight:600; color:var(--ink-soft); text-align:center; background:#fff; }

/* ---------- CTA ---------- */
.cta { background:var(--grad); color:#fff; border-radius:28px; padding:3.5rem 2rem; text-align:center; }
.cta h2 { color:#fff; }

/* ---------- Footer ---------- */
.site-footer { background:var(--ink); color:#c7c0d6; padding:3.5rem 0 1.5rem; }
.site-footer h6 { color:#fff; text-transform:uppercase; letter-spacing:.04em; font-size:.8rem; }
.site-footer a { color:#c7c0d6; }
.site-footer a:hover { color:var(--accent); }
.footer-bottom { border-top:1px solid rgba(255,255,255,.1); margin-top:2rem; padding-top:1.2rem; font-size:.85rem; }

/* ---------- WhatsApp flotante ---------- */
.wa-float { position:fixed; right:22px; bottom:22px; width:56px; height:56px; border-radius:50%; background:#25D366; display:grid; place-items:center; box-shadow:0 8px 20px rgba(0,0,0,.25); z-index:1050; }
.wa-float svg { width:30px; height:30px; fill:#fff; }

/* ============================================================
   LANDING — GESTIÓN COMERCIAL INTELIGENTE
   ============================================================ */
.landing-intelligence { background:#fbfafc; }
.landing-intelligence .navbar-ibeka { padding-top:1.15rem; padding-bottom:1.15rem; }
.landing-intelligence .navbar-brand img { height:38px; }
.hero-intelligence { min-height:710px; display:flex; align-items:center; padding:9.5rem 0 5.5rem; background:linear-gradient(135deg,#21152f 0%,#32194d 58%,#4a215d 100%); }
.hero-intelligence::before { background:radial-gradient(650px 460px at 95% 8%,rgba(255,79,163,.19),transparent 66%),radial-gradient(700px 520px at 0 100%,rgba(91,91,214,.27),transparent 64%); }
.hero-intelligence .container::before { content:""; position:absolute; inset:-100px -40px; pointer-events:none; opacity:.07; background-image:linear-gradient(rgba(255,255,255,.12) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.12) 1px,transparent 1px); background-size:72px 72px; mask-image:linear-gradient(to bottom,transparent,#000 28%,#000 68%,transparent); }
.hero-intelligence::after { display:none; }
.hero-intelligence h1 { font-size:clamp(2.8rem,4.5vw,4.45rem); letter-spacing:-.05em; line-height:1.04; max-width:780px; }
.hero-intelligence .text-gradient { background:linear-gradient(100deg,#fff 0%,#e2c6ff 55%,#ffb2d6 100%); -webkit-background-clip:text; background-clip:text; color:transparent; -webkit-text-fill-color:transparent; }
.hero-intelligence p.lead { max-width:660px; font-size:1.13rem; line-height:1.75; }
.eyebrow,.section-kicker { display:inline-flex; align-items:center; gap:.55rem; color:var(--accent); font-size:.74rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; margin-bottom:1.25rem; }
.live-dot { width:8px; height:8px; border-radius:50%; background:var(--accent); box-shadow:0 0 0 6px rgba(186,247,113,.12); }
.btn-ghost-light { border:1px solid rgba(255,255,255,.25); color:#fff; border-radius:999px; padding:.72rem 1.45rem; font-weight:600; }
.btn-ghost-light:hover { color:var(--accent); border-color:var(--accent); background:rgba(255,255,255,.04); }
.hero-proof { display:flex; flex-wrap:wrap; gap:1rem 1.35rem; margin-top:2rem; color:#bdb5cc; font-size:.76rem; }
.hero-proof span::first-letter { color:var(--accent); }
.product-evidence { max-width:520px; margin:0 auto; }
.evidence-label { display:inline-block; margin:0 0 .65rem .2rem; color:#d6cddd; font-size:.64rem; font-weight:600; letter-spacing:.08em; text-transform:uppercase; }
.hero-photo { position:relative; margin:0; border-radius:18px; overflow:hidden; border:1px solid rgba(255,255,255,.16); background:rgba(255,255,255,.05); box-shadow:0 18px 44px rgba(16,8,25,.28); transform:none; }
.hero-photo::after { display:none; }
.hero-photo img { display:block; width:100%; min-height:320px; max-height:365px; object-fit:cover; object-position:center; filter:saturate(.9) contrast(.98); }
.hero-photo figcaption { position:static; display:block; padding:.9rem 1rem 1rem; border-top:1px solid rgba(255,255,255,.12); background:rgba(25,14,37,.64); color:#fff; }
.hero-photo figcaption strong,.hero-photo figcaption small { display:block; }
.hero-photo figcaption strong { font-size:.76rem; margin-bottom:.2rem; }
.hero-photo figcaption small { color:#bdb5c8; font-size:.64rem; line-height:1.5; }

.console-stage { position:relative; padding:2rem 1rem; }
.console-stage::before { content:""; position:absolute; width:82%; height:82%; left:9%; top:9%; border-radius:50%; background:radial-gradient(circle,rgba(155,77,224,.28),transparent 68%); filter:blur(18px); }
.intel-console { position:relative; max-width:620px; margin:auto; padding:1rem; border:1px solid rgba(255,255,255,.15); border-radius:26px; background:rgba(255,255,255,.075); backdrop-filter:blur(18px); box-shadow:0 40px 90px rgba(0,0,0,.45); transform:perspective(1200px) rotateY(-3deg) rotateX(1deg); animation:consoleFloat 6s ease-in-out infinite; }
.intel-console::before { content:""; position:absolute; inset:-1px; z-index:-1; border-radius:26px; background:linear-gradient(135deg,rgba(255,255,255,.2),transparent 35%,rgba(186,247,113,.22)); }
.floating-signal { position:absolute; z-index:3; display:flex; align-items:center; gap:.45rem; padding:.65rem .85rem; border:1px solid rgba(255,255,255,.2); border-radius:12px; background:rgba(29,20,40,.88); backdrop-filter:blur(12px); color:#fff; font-size:.68rem; box-shadow:0 12px 30px rgba(0,0,0,.3); }
.floating-signal i { width:7px; height:7px; border-radius:50%; background:var(--accent); box-shadow:0 0 0 5px rgba(186,247,113,.12); }
.floating-signal strong { color:var(--accent); }
.signal-orders { top:5%; right:-2%; animation:signalFloat 5s ease-in-out infinite .5s; }
.signal-goal { bottom:3%; left:-2%; animation:signalFloat 5.5s ease-in-out infinite 1.2s; }
@keyframes consoleFloat { 0%,100% { transform:perspective(1200px) rotateY(-3deg) rotateX(1deg) translateY(0); } 50% { transform:perspective(1200px) rotateY(-2deg) rotateX(1deg) translateY(-8px); } }
@keyframes signalFloat { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-7px); } }
.console-top { display:flex; justify-content:space-between; align-items:center; padding:.35rem .35rem 1rem; color:#fff; font-size:.75rem; }
.console-brand { font-weight:700; letter-spacing:.04em; }
.status-live { display:inline-flex; align-items:center; gap:.35rem; color:#52850f; font-size:.68rem; font-weight:700; padding:.3rem .55rem; border-radius:999px; background:#effbdc; white-space:nowrap; }
.status-live i { width:6px; height:6px; border-radius:50%; background:#78bd26; }
.console-grid { display:grid; grid-template-columns:1.35fr 1fr; gap:.75rem; }
.metric-card,.chart-card,.ai-insight { background:#fff; border:1px solid rgba(255,255,255,.5); border-radius:15px; padding:1rem; box-shadow:0 12px 28px rgba(0,0,0,.1); }
.metric-card { min-height:116px; display:flex; flex-direction:column; }
.metric-card span,.chart-head small { color:#81798e; font-size:.65rem; }
.metric-card strong { font-size:1.55rem; color:#21182c; letter-spacing:-.04em; margin:.25rem 0; }
.metric-card small { color:#3f9c62; font-size:.6rem; }
.metric-main { background:linear-gradient(145deg,#fff,#f6efff); }
.micro-progress { height:5px; background:#ece8f0; border-radius:8px; margin-top:auto; overflow:hidden; }
.micro-progress i { display:block; height:100%; border-radius:8px; background:var(--grad); }
.chart-card { grid-row:span 2; min-height:248px; }
.chart-head { display:flex; justify-content:space-between; align-items:center; color:#21182c; font-size:.73rem; font-weight:700; }
.bars { height:180px; display:flex; align-items:end; gap:8px; padding-top:1.5rem; }
.bars i { flex:1; min-width:8px; border-radius:6px 6px 2px 2px; background:linear-gradient(180deg,#c9a4f7,#7741b9); opacity:.8; }
.bars i.hot { background:linear-gradient(180deg,var(--accent),#78bd26); opacity:1; }
.ai-insight { grid-column:1/-1; display:flex; align-items:center; gap:.8rem; background:linear-gradient(110deg,#21142e,#3c1e5b); color:#fff; }
.ai-mark,.ai-orb { display:grid; place-items:center; flex:0 0 auto; width:38px; height:38px; border-radius:11px; background:linear-gradient(135deg,var(--accent),#7bdca5); color:#1a1720; font-size:.72rem; font-weight:800; }
.ai-insight small,.ai-insight strong { display:block; }
.ai-insight small { color:#baf771; font-size:.6rem; text-transform:uppercase; letter-spacing:.08em; }
.ai-insight strong { font-size:.75rem; margin-top:.2rem; }

.signal-strip { background:#fff; border-bottom:1px solid var(--line); }
.signal-strip .container { min-height:78px; display:flex; align-items:center; justify-content:center; gap:1.2rem; color:#7d7589; font-size:.78rem; text-transform:uppercase; letter-spacing:.08em; }
.signal-strip i { width:4px; height:4px; border-radius:50%; background:#c9c3d0; }
.signal-strip strong { color:var(--brand); }
.value-claims { position:relative; z-index:2; margin-top:-1px; background:#fff; border-bottom:1px solid var(--line); }
.value-claims .container { display:grid; grid-template-columns:repeat(3,1fr); }
.value-claims article { display:flex; gap:1rem; min-height:150px; align-items:center; padding:1.7rem 2rem; border-right:1px solid var(--line); }
.value-claims article:last-child { border-right:0; }
.value-claims article>span { display:grid; place-items:center; flex:0 0 38px; width:38px; height:38px; border-radius:12px; background:var(--brand-light); color:var(--brand); font-size:.65rem; font-weight:700; }
.value-claims strong { display:block; color:var(--ink); font-size:.92rem; margin-bottom:.25rem; }
.value-claims p { color:var(--gray); font-size:.72rem; line-height:1.5; margin:0; }
.display-title { font-size:clamp(2.2rem,4vw,3.5rem); line-height:1.08; letter-spacing:-.045em; }
.section-kicker { color:var(--brand); margin-bottom:.85rem; }
.section-lead { color:var(--gray); font-size:1rem; line-height:1.75; margin:0; }
.intelligence-section { padding:7rem 0; }
.intelligence-flow { display:grid; grid-template-columns:repeat(4,1fr); border:1px solid var(--line); border-radius:24px; overflow:hidden; background:#fff; box-shadow:0 20px 60px rgba(45,25,66,.06); }
.intelligence-flow article { position:relative; padding:2rem 1.65rem; min-height:260px; border-right:1px solid var(--line); }
.intelligence-flow article { transition:background .25s,transform .25s; }
.intelligence-flow article:hover { z-index:2; background:linear-gradient(145deg,#fff,#fbf7ff); transform:translateY(-2px); box-shadow:0 12px 28px rgba(63,32,89,.07); }
.intelligence-flow article:not(:last-child)::after { content:"→"; position:absolute; z-index:3; right:-13px; top:50%; width:26px; height:26px; display:grid; place-items:center; border:1px solid var(--line); border-radius:50%; background:#fff; color:var(--brand); font-size:.7rem; }
.intelligence-flow article:last-child { border:0; }
.step-number { color:#c7c0d0; font-size:.65rem; font-weight:700; }
.step-icon { width:46px; height:46px; display:grid; place-items:center; margin:2rem 0 1.5rem; border-radius:14px; color:var(--brand); background:var(--brand-light); font-size:1.1rem; }
.intelligence-flow h3 { font-size:1.1rem; }
.intelligence-flow p { color:var(--gray); font-size:.86rem; margin:0; }

.platform-section { background:#f2eff5; padding:7rem 0; }
.section-heading { max-width:800px; margin:0 auto 3.5rem; }
.platform-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.2rem; }
.platform-card { position:relative; min-height:510px; padding:2rem; border-radius:20px; overflow:hidden; display:flex; flex-direction:column; border:1px solid var(--line); border-top:4px solid var(--brand); background:#fff; box-shadow:0 10px 28px rgba(42,25,58,.055); }
.platform-card { transition:transform .3s ease,box-shadow .3s ease; }
.platform-card:hover { transform:translateY(-3px); box-shadow:0 16px 34px rgba(42,25,58,.09); }
.platform-card::after { content:""; position:absolute; width:180px; height:180px; border-radius:50%; top:-85px; right:-70px; background:var(--brand-light); opacity:.7; }
.platform-card.control-card { background:#fff; color:var(--ink-soft); border-top-color:var(--brand-pink); }
.platform-card.control-card h3 { color:var(--ink); }
.platform-card.control-card::after { background:#fde8f3; }
.platform-card.intelligence-card { background:#fff; color:var(--ink-soft); border-top-color:var(--accent-dark); }
.platform-card.intelligence-card h3 { color:var(--ink); }
.platform-card.intelligence-card::after { background:#edfbdc; }
.card-tag { position:relative; z-index:1; display:inline-block; align-self:flex-start; padding:.35rem .65rem; margin-bottom:3.5rem; border-radius:999px; background:var(--brand-light); color:var(--brand); font-size:.65rem; font-weight:700; text-transform:uppercase; letter-spacing:.08em; }
.control-card .card-tag { background:#fde8f3; color:#b82e70; }
.intelligence-card .card-tag { background:#edfbdc; color:#548c16; }
.platform-card h3 { font-size:1.55rem; line-height:1.2; margin-bottom:1rem; }
.platform-card p,.platform-card li { font-size:.86rem; line-height:1.65; color:inherit; opacity:.8; }
.platform-card ul { list-style:none; padding:1rem 0 0; margin:0 0 2rem; border-top:1px solid rgba(130,115,145,.2); }
.platform-card li { padding:.35rem 0; }
.platform-card li::before { content:"✓"; color:var(--brand); font-weight:700; margin-right:.55rem; }
.control-card li::before { color:var(--brand-pink); }
.intelligence-card li::before { color:var(--accent-dark); }
.platform-card a { margin-top:auto; color:var(--brand); font-size:.82rem; font-weight:700; }
.control-card a { color:var(--brand-pink); }
.intelligence-card a { color:#548c16; }

.ai-section { position:relative; overflow:hidden; padding:7rem 0; background:#140c20; }
.ai-section::before { content:""; position:absolute; inset:0; background:radial-gradient(650px 400px at 5% 50%,rgba(155,77,224,.3),transparent 65%),radial-gradient(600px 400px at 100% 100%,rgba(91,91,214,.18),transparent 65%); }
.ai-section .container { position:relative; }
.eyebrow-dark { color:var(--accent); }
.ai-copy { color:#bdb4c9; line-height:1.75; }
.security-note { display:flex; align-items:center; gap:.8rem; margin-top:2rem; color:#fff; }
.security-note>span { color:var(--accent); font-size:1.35rem; }
.security-note strong,.security-note small { display:block; }
.security-note strong { font-size:.82rem; }
.security-note small { color:#968da3; font-size:.7rem; }
.conversation-card { padding:1.2rem; border:1px solid rgba(255,255,255,.14); border-radius:24px; background:rgba(255,255,255,.075); backdrop-filter:blur(15px); }
.conversation-head { display:flex; align-items:center; justify-content:space-between; gap:1rem; color:#fff; padding:.25rem .25rem 1rem; }
.conversation-head>div { display:flex; align-items:center; gap:.65rem; }
.ai-orb { width:34px; height:34px; }
.question-list { display:grid; gap:.55rem; }
.question-list button { border:1px solid rgba(255,255,255,.09); border-radius:12px; padding:.85rem 1rem; text-align:left; background:rgba(255,255,255,.06); color:#d9d2e1; font-size:.8rem; transition:.2s; }
.question-list button:hover { border-color:var(--accent); color:#fff; transform:translateX(3px); }
.answer-preview { display:flex; gap:.9rem; margin-top:1rem; padding:1rem; border-radius:14px; background:#fff; color:#35283f; }
.answer-preview p { font-size:.77rem; margin:0; line-height:1.6; }
.verified-note { color:#8f859a; text-align:right; font-size:.62rem; margin:.7rem .2rem 0; }
/* Herramientas compatibles con MCP (sección IA, fondo oscuro). Son etiquetas de texto, NO
   logotipos: se nombran como ecosistema del estándar, no como integraciones certificadas. */
.mcp-tools { display:flex; flex-wrap:wrap; gap:.5rem; list-style:none; padding:0; margin:0; }
.mcp-tools li { border:1px solid rgba(255,255,255,.18); border-radius:999px; padding:.4rem .9rem;
  color:#e7e2ee; font-size:.74rem; font-weight:600; background:rgba(255,255,255,.04); }
.mcp-tools li:last-child { border-style:dashed; color:#968da3; font-weight:500; }

.capabilities-section { padding:7rem 0; }
.capability-grid { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line); border-left:1px solid var(--line); }
.capability-grid article { padding:2rem; min-height:210px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); background:#fff; }
.capability-grid article { position:relative; overflow:hidden; transition:background .25s,transform .25s; }
.capability-grid article::before { content:""; position:absolute; width:90px; height:90px; right:-50px; top:-50px; border-radius:50%; background:var(--brand-light); transition:transform .3s; }
.capability-grid article:hover { z-index:1; background:#fdfaff; transform:translateY(-4px); box-shadow:0 16px 34px rgba(55,31,74,.09); }
.capability-grid article:hover::before { transform:scale(1.45); }
.capability-grid span { color:var(--brand-pink); font-size:.65rem; font-weight:700; }
.capability-grid h3 { font-size:1.02rem; margin:2rem 0 .7rem; }
.capability-grid p { color:var(--gray); font-size:.82rem; margin:0; }
.cta-intelligence { position:relative; overflow:hidden; padding:5rem 2rem; background:linear-gradient(135deg,#5b35a8,#9b4de0 58%,#d8438b); }
.cta-intelligence::before { content:""; position:absolute; inset:0; background:radial-gradient(600px 300px at 20% 100%,rgba(155,77,224,.45),transparent 70%),radial-gradient(500px 300px at 100% 0,rgba(186,247,113,.15),transparent 70%); }
.cta-intelligence::after { content:""; position:absolute; width:240px; height:240px; right:-80px; bottom:-130px; border:1px solid rgba(186,247,113,.22); border-radius:50%; box-shadow:0 0 0 45px rgba(186,247,113,.035),0 0 0 90px rgba(186,247,113,.02); }
.cta-intelligence>* { position:relative; }
.cta-intelligence h2 { font-size:clamp(2.2rem,4vw,3.6rem); letter-spacing:-.045em; }
.cta-intelligence p { max-width:650px; margin:1rem auto 2rem; color:#c9c0d2; }
.site-footer { padding-top:4.5rem; }

@media (max-width:991px) {
  .hero-intelligence { min-height:auto; }
  .intel-console { transform:none; }
  .hero-photo { transform:none; }
  .intelligence-flow { grid-template-columns:repeat(2,1fr); }
  .intelligence-flow article:nth-child(2) { border-right:0; }
  .intelligence-flow article:nth-child(-n+2) { border-bottom:1px solid var(--line); }
  .intelligence-flow article:nth-child(2)::after { display:none; }
  .platform-grid { grid-template-columns:1fr; }
  .platform-card { min-height:400px; }
  .capability-grid { grid-template-columns:repeat(2,1fr); }
  .value-claims article { padding:1.35rem 1rem; }
}
@media (max-width:575px) {
  .landing-intelligence .navbar-ibeka { padding-left:.5rem; padding-right:.5rem; }
  .hero-intelligence { padding:8.5rem 0 4rem; }
  .hero-intelligence h1 { font-size:2.75rem; }
  .hero-photo img { min-height:330px; }
  .console-grid { grid-template-columns:1fr 1fr; }
  .chart-card { grid-column:1/-1; grid-row:auto; }
  .signal-strip .container { overflow-x:auto; justify-content:flex-start; white-space:nowrap; }
  .value-claims .container { grid-template-columns:1fr; }
  .value-claims article { min-height:auto; border-right:0; border-bottom:1px solid var(--line); }
  .value-claims article:last-child { border-bottom:0; }
  .intelligence-flow { grid-template-columns:1fr; }
  .intelligence-flow article { border-right:0; border-bottom:1px solid var(--line); }
  .intelligence-flow article::after,.floating-signal { display:none !important; }
  .capability-grid { grid-template-columns:1fr; }
  .conversation-head { align-items:flex-start; }
  .conversation-head .status-live { white-space:normal; }
}
@media (prefers-reduced-motion:reduce) {
  .intel-console,.floating-signal { animation:none; }
  .platform-card,.intelligence-flow article,.capability-grid article { transition:none; }
}

/* ============================================================
   PANEL ADMIN
   ============================================================ */
.admin-body { background:var(--bg-soft); }
.auth-wrap { min-height:100vh; display:grid; place-items:center; background:var(--grad); padding:1rem; }
.auth-card { background:#fff; border-radius:22px; padding:2.5rem; width:100%; max-width:410px; box-shadow:0 24px 60px rgba(0,0,0,.3); }

/* ---------- Acceso administrativo ---------- */
.login-page { overflow-x:hidden; background:#fff; }
.login-shell { min-height:100vh; min-height:100dvh; display:grid; grid-template-columns:minmax(520px, 58%) minmax(430px, 42%); background:#fff; }
.login-visual { position:relative; min-height:100vh; overflow:hidden; color:#fff; }
.login-stage-bg { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.login-stage-title { position:absolute; z-index:2; top:11%; left:34%; color:#fff; font-size:clamp(1.5rem, 2.35vw, 2.65rem); font-weight:600; line-height:1.25; text-shadow:0 2px 14px rgba(0,45,130,.28); }
.login-stage-brand { position:absolute; z-index:2; left:3.5rem; bottom:3rem; display:flex; flex-direction:column; gap:.45rem; color:#fff; font-size:.72rem; font-weight:600; }
.login-stage-brand img { width:155px; height:auto; }
.device { position:absolute; z-index:2; border:8px solid #101828; border-radius:30px; background:#101828; box-shadow:0 22px 46px rgba(0,20,70,.4); overflow:hidden; }
.device-menu { width:210px; height:445px; left:8%; top:8%; transform:rotate(-1deg); }
.device-clients { width:220px; height:470px; left:39%; top:34%; transform:rotate(1deg); }
.device-speaker { position:absolute; z-index:3; width:46%; height:14px; left:27%; top:0; border-radius:0 0 10px 10px; background:#101828; }
.device-screen { position:absolute; inset:0; overflow:hidden; border-radius:21px; background:#f6f8fc; color:#182133; font-family:Arial,sans-serif; }
.device-appbar { min-height:58px; padding:20px 12px 8px; background:#215dcc; color:#fff; }
.device-appbar b { display:block; font-size:12px; }
.device-appbar small { display:block; margin-top:2px; font-size:8px; opacity:.82; }
.device-company { padding:8px 10px; background:#fff; border-bottom:1px solid #dce3ef; font-size:8px; font-weight:700; }
.device-actions { display:grid; grid-template-columns:repeat(3,1fr); gap:5px; padding:8px; }
.device-actions span { min-height:63px; display:flex; align-items:end; justify-content:center; padding:7px 3px; border:1px solid #d9e1ec; border-radius:3px; background:#fff; color:#26344a; font-size:8px; font-weight:600; text-align:center; }
.device-actions span::before { content:'+'; position:absolute; align-self:flex-start; width:25px; height:25px; display:grid; place-items:center; border-radius:50%; background:#e6efff; color:#215dcc; font-size:16px; }
.device-tabbar { position:absolute; left:0; right:0; bottom:0; height:35px; display:flex; align-items:center; justify-content:space-around; border-top:1px solid #dce3ef; background:#fff; color:#637087; font-size:7px; }
.device-tabbar b { color:#215dcc; }
.device-search { margin:9px; padding:7px 9px; border:1px solid #d9e1ec; border-radius:5px; background:#fff; color:#8792a5; font-size:8px; }
.device-client { position:relative; margin:0 9px 7px; padding:10px 8px; border:1px solid #dde4ef; border-radius:5px; background:#fff; }
.device-client b,.device-client span { display:block; padding-right:46px; }
.device-client b { color:#1852bc; font-size:9px; }
.device-client span { margin-top:3px; color:#68758a; font-size:7px; }
.device-client em { position:absolute; right:7px; top:12px; color:#138a70; font-size:7px; font-style:normal; font-weight:700; }
.login-panel { min-height:100vh; display:grid; align-items:center; padding:2.5rem clamp(2rem, 5vw, 5.5rem); background:#fff; }
.login-panel .auth-card { max-width:560px; padding:0; border-radius:0; box-shadow:none; }
.login-mobile-brand { margin-bottom:2.5rem; text-align:center; }
.login-panel-logo img { width:180px; height:auto; }
.login-heading h2 { margin:.3rem 0 .4rem; font-size:1.2rem; }
.login-heading p { margin:0; color:var(--gray); font-size:.9rem; }
.login-eyebrow { color:var(--brand-dark); font-size:.72rem; font-weight:700; text-transform:uppercase; }
.login-panel .nav-pills { padding:4px; border:1px solid var(--line); border-radius:8px; background:var(--bg-soft); }
.login-panel .nav-pills .nav-link { border-radius:6px; padding:.55rem .75rem; font-size:.82rem; color:var(--gray); }
.login-panel .nav-pills .nav-link.active { background:#fff; color:var(--ink); box-shadow:0 2px 7px rgba(23,18,31,.08); }
.login-field .form-label { margin-bottom:.35rem; color:var(--ink-soft); font-size:.72rem; font-weight:700; text-transform:uppercase; }
.login-panel .form-control { min-height:46px; padding:.65rem .1rem; border:0; border-bottom:1px solid #cfc9d7; border-radius:0; background:#fff; font-size:.92rem; }
.login-panel .form-control:focus { border-color:var(--brand); box-shadow:0 2px 0 var(--brand); }
.login-submit { min-height:48px; margin-top:.45rem; border-radius:7px; background:#315fcb; }
.login-submit:hover { background:#244fab; }
.login-help-link { color:#315fcb; font-weight:600; }
.login-demo { opacity:.78; }
.login-panel-footer { display:flex; justify-content:center; gap:.55rem; margin-top:2.25rem; padding-top:1.15rem; border-top:1px solid var(--line); color:var(--gray); font-size:.75rem; }
.login-panel-footer a { color:var(--gray); }
.login-panel-footer a:hover { color:var(--brand-dark); }
.login-app-link { font-weight:600; }
@media (max-width: 1050px) {
  .login-shell { grid-template-columns:minmax(400px, 52%) minmax(410px, 48%); }
  .device-menu { left:4%; }
  .device-clients { left:38%; }
}
@media (max-width: 780px) {
  .login-shell { display:block; }
  .login-visual { display:none; }
  .login-panel { min-height:100vh; min-height:100dvh; padding:2rem 1.25rem; }
  .login-panel .auth-card { width:100%; max-width:480px; margin:auto; }
  .login-mobile-brand { margin-bottom:2rem; }
}
@media (min-width: 781px) and (max-height: 760px) {
  .login-panel { align-items:start; padding-top:1.5rem; padding-bottom:1.5rem; overflow-y:auto; }
  .login-mobile-brand { margin-bottom:1rem; }
  .login-heading { margin-bottom:1rem !important; }
  .login-panel-footer { margin-top:1.25rem; }
}

.nav-pills .nav-link.active { background:var(--brand); }
.nav-pills .nav-link { color:var(--brand); font-weight:600; }
.form-control:focus { border-color:var(--brand); box-shadow:0 0 0 .2rem rgba(155,77,224,.2); }

.admin-layout { display:flex; min-height:100vh; }
.sidebar-admin { width:250px; background:var(--ink); color:#cfc6dd; flex-shrink:0; padding:1.2rem 0; }
.sidebar-admin .brand { padding:0 1.4rem 1.2rem; border-bottom:1px solid rgba(255,255,255,.08); }
.nav-item-admin { display:flex; align-items:center; gap:.7rem; color:#cfc6dd; padding:.7rem 1.4rem; font-weight:600; font-size:.94rem; }
.nav-item-admin svg { width:18px; height:18px; }
.nav-item-admin:hover { background:rgba(255,255,255,.06); color:#fff; }
.nav-item-admin.active { background:var(--brand); color:#fff; }

.admin-main { flex:1; min-width:0; }
.admin-topbar { background:#fff; border-bottom:1px solid var(--line); padding:.9rem 1.5rem; display:flex; align-items:center; justify-content:space-between; }
.admin-content { padding:1.5rem; }

.stat-card { background:#fff; border:1px solid var(--line); border-radius:16px; padding:1.3rem; }
.stat-card .v { font-size:1.8rem; font-weight:700; }
.stat-card .l { color:var(--gray); font-size:.85rem; }
.stat-ico { width:46px; height:46px; border-radius:12px; display:grid; place-items:center; background:var(--brand-light); color:var(--brand); }

.card-soft { background:#fff; border:1px solid var(--line); border-radius:16px; }
.badge-soft { background:var(--brand-light); color:var(--brand-dark); font-weight:600; }
.admin-launch-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(150px, 1fr)); gap:1rem; }
.admin-launch-tile {
  min-height:132px; border:1px solid var(--line); border-radius:8px; background:#fff;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.55rem;
  color:var(--brand-dark); font-weight:700; text-align:center; padding:1rem .75rem;
  cursor:pointer; box-shadow:0 6px 16px rgba(23,18,31,.08); transition:transform .15s, box-shadow .15s, border-color .15s;
}
.admin-launch-tile:hover { transform:translateY(-2px); border-color:var(--brand); box-shadow:0 10px 24px rgba(155,77,224,.16); }
.admin-launch-tile .launch-ico { font-size:2.45rem; line-height:1; }
.gps-workspace { display:grid; grid-template-columns:minmax(0, 1fr) 260px; min-height:480px; border:1px solid var(--line); border-radius:8px; overflow:hidden; background:#fff; }
.gps-map-panel { height:480px; min-width:0; background:var(--bg-soft); }
.gps-legend { padding:1rem; border-left:1px solid var(--line); background:#fff; color:var(--ink-soft); }
.gps-legend-title { color:var(--ink); font-size:1rem; font-weight:700; margin-bottom:1rem; }
.gps-legend-item { display:flex; align-items:center; gap:.7rem; font-size:.82rem; margin-bottom:.8rem; }
.gps-symbol { width:15px; height:15px; flex:0 0 15px; display:inline-block; }
.gps-symbol-route { height:4px; border-radius:2px; background:#2968b2; }
.gps-symbol-start, .gps-symbol-point, .gps-symbol-end { border-radius:50%; border:2px solid #fff; box-shadow:0 0 0 1px rgba(23,18,31,.2); }
.gps-symbol-start { background:#1D9E75; }
.gps-symbol-point { width:10px; height:10px; flex-basis:10px; margin:0 2px; background:#2968b2; }
.gps-symbol-end { background:#FF4FA3; }
.gps-legend-divider { border-top:1px solid var(--line); margin:1rem 0; }
.gps-summary { font-size:.82rem; }
.gps-summary-empty { color:var(--gray); line-height:1.45; }
.gps-summary-label { color:var(--gray); font-size:.72rem; text-transform:uppercase; font-weight:700; margin-bottom:.15rem; }
.gps-summary-grid { display:grid; grid-template-columns:1fr 1fr; gap:.55rem; margin-top:1rem; }
.gps-summary-grid > div { padding:.6rem; background:var(--bg-soft); border-radius:6px; }
.gps-summary-grid span { display:block; color:var(--gray); font-size:.7rem; }
.gps-summary-grid strong { display:block; color:var(--ink); font-size:.9rem; margin-top:.15rem; }
.gps-accuracy { margin-top:.8rem; padding-top:.8rem; border-top:1px solid var(--line); color:var(--gray); }

/* Pedidos administrativos: identidad IbeKa */
.orders-module { overflow:hidden; border:1px solid var(--line); border-radius:8px; background:#fff; box-shadow:0 10px 28px rgba(23,18,31,.06); }
.orders-titlebar { min-height:76px; display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:1rem 1.2rem; border-bottom:1px solid var(--line); background:#fff; }
.orders-title { display:flex; align-items:center; gap:.75rem; color:var(--ink); }
.orders-title > div { display:flex; flex-direction:column; }
.orders-title > div > span { font-size:1.05rem; font-weight:700; }
.orders-title small { margin-top:.1rem; color:var(--gray); font-size:.67rem; font-weight:400; }
.orders-title-icon { width:38px; height:38px; display:grid; place-items:center; border-radius:50%; background:var(--grad); color:#fff; font-weight:800; box-shadow:0 5px 14px rgba(155,77,224,.22); }
.orders-title-actions { display:flex; align-items:center; gap:.5rem; }
.orders-title-actions button { min-height:36px; padding:.4rem .72rem; border:1px solid var(--line); border-radius:6px; background:#fff; color:var(--ink-soft); font-size:.72rem; font-weight:600; }
.orders-title-actions button:hover { border-color:var(--brand); color:var(--brand-dark); }
.orders-title-actions #btnNewPedido { border-color:var(--brand); background:var(--brand); color:#fff; }
.orders-title-actions #btnNoVentaPedido { border-color:#f0bdd5; color:#b92f70; }
.orders-body { padding:1rem 1.1rem 1.2rem; background:#fbfbfd; }
.orders-kpis { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.65rem; margin-bottom:1rem; }
.orders-kpi { min-width:0; padding:.7rem .8rem; border-left:3px solid var(--brand); background:#fff; box-shadow:0 2px 8px rgba(23,18,31,.04); }
.orders-kpi:nth-child(2) { border-left-color:#1D9E75; }
.orders-kpi:nth-child(3) { border-left-color:var(--brand-pink); }
.orders-kpi span,.orders-kpi strong { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.orders-kpi span { color:var(--gray); font-size:.62rem; text-transform:uppercase; }
.orders-kpi strong { margin-top:.15rem; color:var(--ink); font-size:1rem; }
.orders-search { max-width:720px; margin:0 0 1rem; display:flex; align-items:center; gap:.55rem; }
.orders-search span { width:30px; height:30px; display:grid; place-items:center; color:var(--brand); font-size:1.45rem; line-height:1; }
.orders-search input { width:100%; min-height:40px; padding:.5rem .75rem; border:1px solid #d9d4e2; border-radius:6px; background:#fff; color:var(--ink); }
.orders-search input:focus { outline:0; border-color:var(--brand); box-shadow:0 0 0 3px rgba(155,77,224,.1); }
.orders-selection { min-height:40px; margin-bottom:1rem; padding:.45rem .65rem; display:flex; align-items:center; justify-content:space-between; gap:1rem; border:1px solid #d8c4ea; border-radius:6px; background:#faf5ff; color:var(--brand-dark); font-size:.72rem; }
.orders-selection[hidden] { display:none; }
.orders-selection button { margin-left:.4rem; padding:.25rem .45rem; border:1px solid #d8c4ea; border-radius:4px; background:#fff; color:var(--brand-dark); font-size:.68rem; font-weight:600; }
.orders-table { min-width:1180px; margin:0; border:1px solid var(--line); background:#fff; }
.orders-table thead th { padding:.7rem .55rem; border-bottom:2px solid var(--brand); background:#231c2e; color:#fff; font-size:.68rem; font-weight:600; text-align:left; white-space:nowrap; }
.orders-table thead th:first-child,.orders-table thead th:nth-child(2),.orders-table thead th:nth-child(7),.orders-table thead th:last-child { text-align:center; }
.orders-table tbody td { padding:.72rem .55rem; border-bottom:1px solid var(--line); background:#fff; color:#342e3e; font-size:.71rem; vertical-align:middle; }
.orders-table tbody tr:hover td { background:#faf6fd; }
.order-status,.order-pay-status { display:inline-flex; align-items:center; max-width:170px; padding:.22rem .45rem; overflow:hidden; border-radius:999px; background:#eee8f5; color:#675b76; font-size:.62rem; font-weight:700; text-overflow:ellipsis; white-space:nowrap; }
.order-status.ok { background:#e5f6ef; color:#197258; }
.order-status.pending { background:#fff1d0; color:#8b6200; }
.order-status.cancelled { background:#fde7ec; color:#a43857; }
.order-pay-status { background:#edf2fb; color:#315b9a; }
.order-actions { display:grid; grid-template-columns:repeat(3,28px); gap:4px; justify-content:end; }
.order-icon-btn { width:28px; height:28px; display:grid; place-items:center; padding:0; border:1px solid transparent; border-radius:5px; color:var(--ink-soft); background:#f2eff5; }
.order-icon-btn:hover { border-color:var(--brand); color:var(--brand-dark); }
.order-icon-btn svg { width:14px; height:14px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.order-icon-btn.edit { background:#e8f6ef; color:#197258; }
.order-icon-btn.view,.order-icon-btn.status,.order-icon-btn.print,.order-icon-btn.copy { background:#edf2fb; color:#315b9a; }
.order-icon-btn.delete { background:#fde7ec; color:#b63855; }
@media (max-width:700px) {
  .orders-titlebar { align-items:flex-start; flex-direction:column; }
  .orders-title-actions { width:100%; display:grid; grid-template-columns:1fr 1fr; }
  .orders-title-actions #btnNoVentaPedido { grid-column:1/-1; }
  .orders-kpis { grid-template-columns:1fr; }
  .orders-search { max-width:100%; }
}

@media (max-width: 900px) {
  .gps-workspace { grid-template-columns:1fr; }
  .gps-map-panel { height:420px; }
  .gps-legend { border-left:0; border-top:1px solid var(--line); }
  .gps-summary-grid { grid-template-columns:repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 575px) {
  .gps-map-panel { height:360px; }
  .gps-summary-grid { grid-template-columns:1fr 1fr; }
}

/* ============================================================
   APP MÓVIL + SALES FORCE TRACKING
   ============================================================ */
.app-stage { background:var(--bg-soft); min-height:100vh; padding:2rem 1rem; }
.phone { width:340px; max-width:100%; margin:0 auto; background:#fff; border-radius:38px; overflow:hidden; border:10px solid var(--ink); box-shadow:0 24px 60px rgba(23,18,31,.32); }
.phone-notch { height:26px; background:var(--ink); }
.app-header { background:var(--grad); color:#fff; padding:1rem 1.1rem; }
.app-body { padding:1rem 1.1rem; min-height:520px; }
.app-tabbar { display:flex; justify-content:space-around; border-top:1px solid var(--line); padding:.6rem 0; background:#fff; }
.app-tabbar a { color:var(--gray); font-size:.68rem; text-align:center; cursor:pointer; }
.app-tabbar a svg { width:22px; height:22px; display:block; margin:0 auto 2px; }
.app-tabbar a.active { color:var(--brand); }

/* ---- En el teléfono (o instalada como PWA): pantalla completa, sin marco demo ----
   En escritorio se conserva la maqueta de "teléfono". */
@media (max-width: 600px), (display-mode: standalone) {
  .app-stage { padding:0; background:#fff; }
  .app-stage > .text-center.mb-3,             /* cabecera "demo" superior */
  .app-stage > p.text-center { display:none; } /* enlaces inferiores */
  /* overflow visible: en móvil no hay esquinas que recortar y el hidden rompe
     el position:sticky de las barras (búsqueda, acción y tabbar). */
  .phone { width:100%; max-width:none; margin:0; border:0; border-radius:0; box-shadow:none; min-height:100vh; min-height:100dvh; overflow:visible; }
  .phone-notch { display:none; }
  .app-header { padding-top:calc(1rem + env(safe-area-inset-top)); }
  .app-body { min-height:calc(100dvh - 9.5rem); }
  .app-tabbar { position:sticky; bottom:0; padding-bottom:calc(.6rem + env(safe-area-inset-bottom)); }
}

.app-list-item { border:1px solid var(--line); border-radius:12px; padding:.8rem; margin-bottom:.7rem; cursor:pointer; }
.app-input { border:1px solid var(--line); border-radius:10px; padding:.6rem .8rem; width:100%; font-family:inherit; }

/* Banner de seguimiento activo */
.track-banner { background:var(--ink); color:#fff; font-size:.74rem; padding:.45rem .8rem; display:flex; align-items:center; gap:.5rem; }
.track-dot { width:8px; height:8px; border-radius:50%; background:var(--accent); box-shadow:0 0 0 0 rgba(186,247,113,.7); animation:pulse 1.6s infinite; }
@keyframes pulse { 0%{box-shadow:0 0 0 0 rgba(186,247,113,.7)} 70%{box-shadow:0 0 0 8px rgba(186,247,113,0)} 100%{box-shadow:0 0 0 0 rgba(186,247,113,0)} }

/* Inicio móvil: cuadrícula operativa estilo Ventas Remotas */
.mobile-company-card { display:flex; justify-content:space-between; align-items:center; padding:.75rem .8rem; border:1px solid var(--line); border-radius:6px; background:#fff; }
.mobile-company-card strong,.mobile-company-card small { display:block; }
.mobile-company-card strong { color:var(--ink); font-size:.9rem; }
.mobile-company-card small { color:var(--gray); font-size:.67rem; }
.mobile-company-kicker { display:block; color:#215dcc; font-size:.6rem; font-weight:700; }
.mobile-online-dot { width:11px; height:11px; border-radius:50%; background:#22b887; box-shadow:0 0 0 4px rgba(34,184,135,.14); }
.mobile-home-meta { padding:.4rem .1rem .55rem; color:var(--gray); font-size:.65rem; }
.mobile-action-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:5px; }
.mobile-action-grid button { min-width:0; aspect-ratio:1/1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.38rem; padding:.45rem .25rem; border:1px solid #d7dfe9; border-radius:4px; background:#fff; color:#26344a; }
.mobile-action-grid button:active { background:#edf4ff; border-color:#215dcc; }
.mobile-action-grid b { max-width:100%; font-size:.66rem; font-weight:600; line-height:1.15; }
.mobile-action-icon { width:32px; height:32px; display:grid; place-items:center; border-radius:50%; background:#e9f1ff; color:#215dcc; }
.mobile-action-icon svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.mobile-home-summary { display:grid; grid-template-columns:1fr 1fr; gap:6px; margin-top:.6rem; }
.mobile-home-summary div,.mobile-module-summary { padding:.65rem; border-radius:6px; background:#eef4ff; }
.mobile-home-summary strong,.mobile-home-summary span { display:block; }
.mobile-home-summary strong { color:#174da8; font-size:.95rem; }
.mobile-home-summary span { color:var(--gray); font-size:.62rem; }
.mobile-history-summary { margin-bottom:.55rem; color:var(--gray); font-size:.7rem; }
.mobile-history-summary strong { color:#174da8; font-size:.95rem; }
.mobile-history-summary span { color:#b54848; font-weight:600; }
.mobile-history-row { display:flex; align-items:center; justify-content:space-between; gap:.65rem; padding:.72rem .15rem; border-bottom:1px solid var(--line); }
.mobile-history-row > div { min-width:0; }
.mobile-history-row strong,.mobile-history-row small { display:block; }
.mobile-history-row strong { overflow:hidden; color:var(--ink); font-size:.78rem; text-overflow:ellipsis; white-space:nowrap; }
.mobile-history-row small { margin-top:.16rem; color:var(--gray); font-size:.62rem; }
.history-days { flex:0 0 auto; min-width:64px; padding:.28rem .42rem; border-radius:5px; font-size:.62rem; font-weight:700; text-align:center; }
.history-days.ok { background:#e4f7ef; color:#16765c; }
.history-days.warn { background:#fff2cf; color:#8a6210; }
.history-days.late,.history-days.never { background:#fde5e7; color:#a43843; }

/* Tarjeta de visita / distancia / timer */
.visit-meta { display:flex; gap:.5rem; }
.visit-chip { flex:1; border:1px solid var(--line); border-radius:12px; padding:.6rem; text-align:center; }
.visit-chip .n { font-size:1.15rem; font-weight:700; }
.visit-chip .t { font-size:.66rem; color:var(--gray); }
.geo-ok   { border-color:var(--accent-dark); background:#f3fbe7; }
.geo-ok .n{ color:#5f9e1f; }
.geo-far  { border-color:#f0c0d4; background:#fdeef5; }
.geo-far .n{ color:var(--brand-pink); }

.btn-venta   { background:var(--accent); color:var(--ink); font-weight:700; border:none; border-radius:12px; padding:.75rem; width:100%; }
.btn-venta:disabled { background:#e4e4e4; color:#9a9a9a; }
.btn-noventa { background:#fff; color:var(--brand-pink); font-weight:700; border:2px solid var(--brand-pink); border-radius:12px; padding:.7rem; width:100%; }
.btn-noventa:disabled { border-color:#ddd; color:#bbb; }

.muted-note { font-size:.72rem; color:var(--gray); }

/* ============================================================
   APP MÓVIL · REDISEÑO 2026 (inspirado en flujos TAT, marca IbeKa)
   ============================================================ */
/* Barra superior con título centrado + acciones (menú ⋮) */
.app-topbar { position:relative; background:var(--grad); color:#fff; padding:.85rem 1rem; display:flex; align-items:center; gap:.5rem; }
.app-topbar.with-safe { padding-top:calc(.85rem + env(safe-area-inset-top)); }
.app-topbar .tb-title { flex:1; text-align:center; font-weight:700; font-size:1.05rem; display:flex; align-items:center; justify-content:center; gap:.45rem; }
.app-topbar .tb-title svg { width:20px; height:20px; }
.tb-btn { background:transparent; border:0; color:#fff; width:34px; height:34px; display:grid; place-items:center; border-radius:9px; cursor:pointer; }
.tb-btn:hover { background:rgba(255,255,255,.16); }
.tb-btn svg { width:22px; height:22px; }
.tb-spacer { width:34px; height:34px; }

/* Menú desplegable (overflow ⋮) */
.overflow-menu { position:absolute; top:.6rem; right:.6rem; z-index:80; background:#fff; border-radius:12px; min-width:188px; box-shadow:0 12px 34px rgba(23,18,31,.28); overflow:hidden; animation:appPop .12s ease-out; }
.overflow-menu[hidden] { display:none; }
.overflow-menu button { display:flex; align-items:center; gap:.6rem; width:100%; background:#fff; border:0; text-align:left; padding:.8rem 1rem; font-size:.92rem; color:var(--ink); cursor:pointer; }
.overflow-menu button:hover { background:var(--brand-light); }
.overflow-menu button + button { border-top:1px solid var(--line); }
.overflow-menu button svg { width:18px; height:18px; color:var(--brand); }
.overflow-menu button.danger { color:var(--brand-pink); }
.overflow-menu button.danger svg { color:var(--brand-pink); }

/* Dashboard de inicio */
.dash-hero { text-align:center; padding:.4rem 0 1rem; }
.dash-hero .who { font-weight:700; font-size:1.15rem; color:var(--ink); }
.dash-hero .sub { font-size:.8rem; color:var(--gray); }
.dash-stats { display:flex; gap:.5rem; margin:.2rem 0 1.1rem; }
.dash-stat { flex:1; border:1px solid var(--line); border-radius:14px; padding:.6rem .4rem; text-align:center; background:#fff; }
.dash-stat .n { font-size:1.15rem; font-weight:800; color:var(--brand); line-height:1.1; }
.dash-stat .t { font-size:.62rem; color:var(--gray); text-transform:uppercase; letter-spacing:.02em; }

/* Botones grandes tipo "launcher" */
.launcher { display:flex; align-items:center; gap:1rem; width:100%; border:0; border-radius:18px; padding:1.05rem 1.2rem; margin-bottom:.85rem; color:#fff; font-weight:700; font-size:1.05rem; background:var(--grad); box-shadow:0 8px 22px rgba(155,77,224,.26); cursor:pointer; text-align:left; }
.launcher:active { transform:translateY(1px); }
.launcher.alt { background:var(--ink); box-shadow:0 8px 22px rgba(23,18,31,.22); }
.launcher.lime { background:var(--accent); color:var(--ink); box-shadow:0 8px 22px rgba(148,210,74,.3); }
.launcher svg { width:30px; height:30px; flex:0 0 30px; }

/* Tarjeta de cliente con banda de marca */
.cli-card { border:1px solid var(--line); border-radius:16px; overflow:hidden; margin-bottom:.85rem; background:#fff; cursor:pointer; box-shadow:0 2px 8px rgba(23,18,31,.05); }
.cli-card:active { transform:scale(.995); }
.cli-band { background:var(--grad); color:#fff; padding:.6rem .85rem; font-weight:700; font-size:.95rem; display:flex; justify-content:space-between; align-items:center; gap:.5rem; }
.cli-band .chev { opacity:.85; }
.cli-body { padding:.7rem .85rem; }
.cli-row { display:flex; justify-content:space-between; gap:.6rem; font-size:.82rem; padding:.12rem 0; }
.cli-row .k { color:var(--gray); flex:0 0 auto; }
.cli-row .v { color:var(--ink); font-weight:600; text-align:right; }
.geo-pill { display:inline-flex; align-items:center; gap:.25rem; font-size:.68rem; font-weight:700; padding:.12rem .5rem; border-radius:999px; }
.geo-pill.on  { background:#eef9df; color:#5f9e1f; }
.geo-pill.off { background:var(--bg-soft); color:var(--gray); }

/* Barra de acción inferior (Nuevo / Buscar / Mapa) */
.action-bar { position:sticky; bottom:0; z-index:20; display:flex; justify-content:space-around; align-items:center; background:var(--ink); padding:.55rem 0; box-shadow:0 -8px 22px rgba(23,18,31,.18); }
.action-bar.safe { padding-bottom:calc(.55rem + env(safe-area-inset-bottom)); }
.action-bar button { background:transparent; border:0; color:#fff; font-size:.66rem; cursor:pointer; display:flex; flex-direction:column; align-items:center; gap:.15rem; }
.action-bar button svg { width:24px; height:24px; }
.action-bar button.primary { color:var(--accent); }
[data-screen="clientes"] .app-body { padding-bottom:4.8rem; }
@media (max-width: 600px), (display-mode: standalone) {
  [data-screen="clientes"] .action-bar { position:fixed; left:0; right:0; bottom:0; }
}

.visit-mode { display:grid; grid-template-columns:1fr 1fr; gap:.35rem; background:var(--bg-soft); border:1px solid var(--line); border-radius:12px; padding:.25rem; }
.visit-mode button { border:0; border-radius:9px; background:transparent; color:var(--gray); font-weight:700; font-size:.78rem; padding:.45rem .35rem; }
.visit-mode button.active { background:#fff; color:var(--brand); box-shadow:0 2px 8px rgba(23,18,31,.08); }

/* Tarjeta de resumen de ventas (Pedidos del Día) */
.summary-card { border:1px solid var(--line); border-radius:16px; overflow:hidden; margin-bottom:1rem; background:#fff; }
.summary-head { background:var(--grad); color:#fff; padding:.6rem .9rem; font-weight:700; }
.summary-body { padding:.85rem .9rem; }
.summary-top { display:flex; justify-content:space-between; gap:.8rem; padding-bottom:.7rem; margin-bottom:.7rem; border-bottom:1px solid var(--line); }
.summary-top .lbl { font-size:.72rem; color:var(--gray); }
.summary-top .big { font-size:1.05rem; font-weight:800; color:var(--ink); }
.summary-top .big.ok { color:#5f9e1f; }
.summary-grid { display:flex; justify-content:space-between; text-align:center; }
.summary-grid .cell .n { font-size:1.25rem; font-weight:800; color:var(--ink); }
.summary-grid .cell .n.warn { color:var(--brand-pink); }
.summary-grid .cell .t { font-size:.66rem; color:var(--gray); }
.meta-bar { height:8px; border-radius:999px; background:var(--bg-soft); overflow:hidden; margin-top:.2rem; }
.meta-bar > span { display:block; height:100%; background:var(--accent); }

/* Tarjeta de pedido del día */
.order-card { border:1px solid var(--line); border-radius:14px; overflow:hidden; margin-bottom:.75rem; background:#fff; }
.order-head { background:var(--brand); color:#fff; padding:.45rem .8rem; font-weight:700; font-size:.9rem; }
.order-body { padding:.6rem .8rem; font-size:.82rem; }
.order-body .ln { display:flex; justify-content:space-between; padding:.1rem 0; }
.order-body .ln .k { color:var(--gray); }
.order-total { text-align:right; font-weight:800; color:var(--brand); margin-top:.3rem; }

/* Formulario nuevo cliente */
.form-grid2 { display:flex; gap:.5rem; }
.form-grid2 > * { flex:1; }
.field-label { font-size:.74rem; color:var(--gray); margin:.55rem 0 .15rem; display:block; font-weight:600; }

/* Bloques de cumplimiento (meta diaria / mensual) */
.meta-block { margin:.25rem 0 .75rem; }
.meta-pct { font-weight:800; color:var(--brand); }
.meta-bar.mes > span { background:var(--brand); }

/* Barra de acción fija al fondo de la pantalla (no al final del listado) */
.app-sticky-bar { position:sticky; bottom:0; background:#fff; padding:.7rem 1.1rem; margin:.85rem -1.1rem 0; border-top:.5px solid var(--line); z-index:6; }
@media (max-width: 600px), (display-mode: standalone) {
  .app-sticky-bar { padding-bottom:calc(.7rem + env(safe-area-inset-bottom)); }
}

/* Barra de búsqueda fija arriba mientras se hace scroll (lista de clientes y de productos) */
.app-sticky-search { position:sticky; top:0; z-index:7; background:#fff; margin:0 -1.1rem .6rem; padding:.5rem 1.1rem; box-shadow:0 6px 14px rgba(23,18,31,.08); }
@media (max-width: 600px), (display-mode: standalone) {
  .app-sticky-search { padding-top:calc(.5rem + env(safe-area-inset-top)); }
}

/* ============================================================
   TEMA "ALTA GERENCIA" — SOLO PANEL ADMINISTRATIVO (Fase 1 · 2026-07-04)
   Alcance: body.admin-body (dashboard.html y login.html del admin).
   NO afecta la landing (index.html) ni la app móvil (app-stage):
   solo redefine variables y refina componentes dentro del panel.
   ============================================================ */
body.admin-body {
  /* Paleta ejecutiva IbeKa */
  --brand:       #5B2E91;  /* púrpura ejecutivo profundo */
  --brand-dark:  #472273;
  --brand-pink:  #C9A227;  /* acento pasa de rosa a DORADO corporativo */
  --brand-light: #F1EBF8;
  --accent:      #C9A227;  /* dorado corporativo */
  --accent-dark: #A8861D;
  --ink:         #1F1B2E;  /* carbón gerencial (sidebar) */
  --ink-soft:    #4A4458;
  --bg:          #F7F6FA;  /* gris perla */
  --bg-soft:     #F7F6FA;
  --line:        #E5E1EC;
  --grad: linear-gradient(135deg, #472273 0%, #5B2E91 55%, #7B4BB4 100%);
}

/* --- Sidebar: sobriedad + ítem activo con barra dorada --- */
body.admin-body .sidebar-admin { background:#1F1B2E; }
body.admin-body .side-label { color:#8E86A3; letter-spacing:.06em; }
body.admin-body .nav-item-admin { border-left:3px solid transparent; }
body.admin-body .nav-item-admin.active {
  background:linear-gradient(90deg, rgba(91,46,145,.55), rgba(91,46,145,.15));
  border-left:3px solid var(--accent);
  color:#fff;
}
body.admin-body .nav-item-admin:hover { border-left-color:rgba(201,162,39,.45); }
/* Emojis del menú y tiles en monocromo sobrio (identidad, sin tocar HTML) */
body.admin-body .nav-item-admin .ico { filter:grayscale(1) brightness(1.9); opacity:.92; }
body.admin-body .admin-launch-tile .launch-ico { filter:grayscale(1) contrast(.9); opacity:.85; }

/* --- Tarjetas y paneles: elevación ejecutiva --- */
body.admin-body .stat-card,
body.admin-body .card-soft,
body.admin-body .dash-panel,
body.admin-body .orders-module {
  border-radius:12px;
  box-shadow:0 8px 24px rgba(31,27,46,.06);
}
body.admin-body .stat-card .v { color:var(--brand-dark); }
body.admin-body .admin-launch-tile:hover {
  border-color:var(--accent);
  box-shadow:0 10px 24px rgba(201,162,39,.22);
}

/* --- Tablas: cabecera púrpura + zebra suave (familiaridad TomaPedidos,
       identidad IbeKa) --- */
body.admin-body .table thead th {
  background:#5B2E91; color:#fff; border-color:#4A2578;
  font-size:.72rem; text-transform:uppercase; letter-spacing:.03em;
}
body.admin-body .table tbody tr:nth-child(even) { background:#F6F2FB; }
body.admin-body .table tbody tr:hover { background:#EFE7F8; }

/* --- Topbar: hilo dorado de distinción gerencial --- */
body.admin-body .admin-topbar { border-bottom:2px solid var(--accent); }
body.admin-body .admin-page-mark { background:var(--grad); color:#fff; }

/* --- Login administrativo alineado a la paleta (antes azul) --- */
body.admin-body .login-submit { background:var(--brand); }
body.admin-body .login-submit:hover { background:var(--brand-dark); }
body.admin-body .login-help-link { color:var(--brand); }
body.admin-body .device-appbar { background:var(--brand); }
body.admin-body .device-actions span::before { background:var(--brand-light); color:var(--brand); }
body.admin-body .device-tabbar b, body.admin-body .device-client b { color:var(--brand); }

/* --- Badges de estado con semántica ejecutiva --- */
body.admin-body .badge-soft { background:#F4EDDA; color:#7A6215; }

/* --- Panel Gerencial (IA) · Fase 2: barras interactivas sin librerías --- */
body.admin-body .ger-vchart { display:flex; align-items:end; gap:8px; height:190px; padding-top:6px; }
body.admin-body .ger-vcol { flex:1; min-width:0; height:100%; display:flex; flex-direction:column; justify-content:end; align-items:center; gap:4px; cursor:pointer; }
body.admin-body .ger-vbar { width:70%; max-width:46px; border-radius:6px 6px 0 0; transition:filter .12s, transform .12s, height .7s cubic-bezier(.2,.8,.2,1); }
body.admin-body .ger-vcol:hover .ger-vbar { filter:brightness(1.15); transform:scaleY(1.02); transform-origin:bottom; }
body.admin-body .ger-vcol span { font-size:.66rem; color:var(--gray); white-space:nowrap; }
body.admin-body .ger-hrow { display:flex; align-items:center; gap:.7rem; padding:.32rem 0; cursor:pointer; border-radius:6px; }
body.admin-body .ger-hrow:hover { background:var(--brand-light); }
body.admin-body .ger-hlabel { width:150px; flex:0 0 150px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:.8rem; font-weight:600; }
body.admin-body .ger-htrack { position:relative; flex:1; height:16px; background:var(--bg-soft); border-radius:8px; overflow:hidden; }
body.admin-body .ger-hmeta { position:absolute; inset:0 auto 0 0; background:#DAD4E4; border-radius:8px; transition:width .7s cubic-bezier(.2,.8,.2,1); }
body.admin-body .ger-hfill { position:absolute; inset:0 auto 0 0; background:var(--grad); border-radius:8px; transition:width .7s cubic-bezier(.2,.8,.2,1); }
body.admin-body .ger-hval { width:64px; flex:0 0 64px; text-align:right; font-size:.78rem; font-weight:700; }
body.admin-body .ger-good { color:#1E8E5A; }
body.admin-body .ger-bad { color:#C0392B; }
body.admin-body .ger-tip { position:absolute; z-index:1080; max-width:280px; padding:.45rem .65rem; border-radius:8px; background:#1F1B2E; color:#fff; font-size:.75rem; box-shadow:0 10px 24px rgba(31,27,46,.35); pointer-events:none; }
body.admin-body .ger-sel .ger-vbar, body.admin-body .ger-hrow.ger-sel { outline:2px solid var(--accent); outline-offset:2px; }
body.admin-body .ger-alerta { border-left:3px solid #C0392B; }
body.admin-body .ger-rec { padding:.65rem .8rem; border-left:3px solid var(--accent); background:#FCFAF3; border-radius:0 8px 8px 0; margin-bottom:.55rem; }

/* --- Panel Gerencial · Fase 3 (2026-07-16): semáforo ejecutivo + diagnóstico IA --- */
/* Bloques semáforo: solo 4 cifras visibles; el detalle se expande al tocar. */
body.admin-body .ger-sema { background:#fff; border:1px solid var(--line); border-radius:16px; padding:1.05rem 1.15rem; cursor:pointer; height:100%; position:relative; transition:box-shadow .15s, transform .15s, border-color .15s; }
body.admin-body .ger-sema:hover { box-shadow:0 8px 22px rgba(31,27,46,.10); transform:translateY(-2px); }
body.admin-body .ger-sema.open { border-color:var(--brand); box-shadow:0 8px 22px rgba(31,27,46,.12); }
body.admin-body .ger-sema .ger-slabel { font-size:.8rem; color:var(--gray); display:flex; align-items:center; gap:.45rem; }
body.admin-body .ger-sema .ger-sval { font-size:1.55rem; font-weight:700; color:var(--brand-dark); margin:.15rem 0 .3rem; line-height:1.15; }
body.admin-body .ger-sema .ger-ssub { font-size:.74rem; color:var(--gray); }
body.admin-body .ger-sema .ger-schev { position:absolute; right:.9rem; top:1rem; color:var(--gray); font-size:.8rem; transition:transform .15s; }
body.admin-body .ger-sema.open .ger-schev { transform:rotate(180deg); }
body.admin-body .ger-dot { width:10px; height:10px; border-radius:50%; flex:0 0 10px; display:inline-block; }
body.admin-body .ger-dot-ok { background:#1E8E5A; }
body.admin-body .ger-dot-warn { background:#E8A013; }
body.admin-body .ger-dot-bad { background:#C0392B; }
body.admin-body .ger-pill { font-size:.7rem; font-weight:700; padding:.14rem .55rem; border-radius:10px; display:inline-block; }
body.admin-body .ger-pill-ok { background:#E3F4EB; color:#166A42; }
body.admin-body .ger-pill-warn { background:#FBF0D8; color:#8A5D06; }
body.admin-body .ger-pill-bad { background:#F9E4E1; color:#8E2519; }
body.admin-body .ger-pill-info { background:#F1EFE8; color:#5F5E5A; }
body.admin-body .ger-dot-info { background:#B4B2A9; }
/* Bloques plegables (nivel CEO): cabecera con chevron, cuerpo colapsable, flash al navegar */
body.admin-body .ger-phead { display:flex; justify-content:space-between; align-items:center; cursor:pointer; gap:.6rem; }
body.admin-body .ger-pchev { color:var(--gray); font-size:.85rem; transition:transform .18s; }
body.admin-body .ger-panel.ger-closed .ger-pchev { transform:rotate(-90deg); }
body.admin-body .ger-panel.ger-closed .ger-pbody, body.admin-body .ger-panel.ger-closed .ger-pnote { display:none; }
body.admin-body .ger-pbody { animation:gerSlide .18s ease-out; }
body.admin-body .ger-flash { animation:gerFlash 1.2s ease; }
@keyframes gerFlash { 0% { box-shadow:0 0 0 3px var(--accent); } 100% { box-shadow:0 0 0 0 transparent; } }
body.admin-body .ger-detail { animation:gerSlide .18s ease-out; }
@keyframes gerSlide { from { opacity:0; transform:translateY(-6px); } to { opacity:1; transform:none; } }
/* Diagnóstico IA: bloque hero + 3 evidencias */
body.admin-body .ger-diag { background:linear-gradient(135deg,#F5F2FB,#FDFBF4); border:1px solid #E4DCF2; border-radius:16px; padding:1.1rem 1.25rem; }
body.admin-body .ger-diag-tag { font-size:.72rem; font-weight:700; color:var(--brand); letter-spacing:.4px; text-transform:uppercase; }
body.admin-body .ger-diag-txt { font-size:.95rem; line-height:1.55; color:#2B2440; margin:.4rem 0 0; }
body.admin-body .ger-ev { background:#fff; border:1px solid var(--line); border-radius:12px; padding:.7rem .85rem; height:100%; }
body.admin-body .ger-ev .l { font-size:.72rem; color:var(--gray); }
body.admin-body .ger-ev .v { font-size:1.15rem; font-weight:700; color:var(--brand-dark); }

/* --- Autocomplete predictivo de referencia en Nuevo/Editar pedido (Fase Ventas · 2026-07-06) --- */
body.admin-body [data-oi-sug] { border:1px solid var(--line); border-radius:8px; background:#fff; }
body.admin-body [data-oi-sug] .list-group-item { border:0; border-bottom:1px solid var(--line); }
body.admin-body [data-oi-sug] .list-group-item:last-child { border-bottom:0; }
body.admin-body [data-oi-sug] .list-group-item:hover { background:var(--brand-light); }

/* --- Modal AMPLIO para Nuevo/Editar pedido (rediseño 6-jul-2026, v2 sin solapamientos) --- */
body.admin-body .modal-order.modal-xl { max-width: min(1180px, 96vw); }
body.admin-body .modal-order .modal-content { border-radius: 14px; border: 0; box-shadow: 0 30px 80px rgba(31,27,46,.28); }
body.admin-body .modal-order .modal-header {
  background: linear-gradient(135deg, var(--brand-dark), var(--brand));
  color: #fff; border-bottom: 3px solid var(--accent);
}
body.admin-body .modal-order .modal-header .modal-title { color:#fff; font-weight:700; letter-spacing:.02em; }
body.admin-body .modal-order .modal-header .btn-close { filter: invert(1) grayscale(1) brightness(2); }
body.admin-body .modal-order .modal-body { padding: 1.25rem 1.5rem; }
body.admin-body .modal-order .form-control, body.admin-body .modal-order .form-select { padding-top:.45rem; padding-bottom:.45rem; }

/* Encabezado 'Productos del pedido' — NO sticky (evita tapar el buscador) */
body.admin-body .modal-order .order-items-head { padding: .2rem 0 .6rem; }

/* Layout de filas-tarjeta para los productos (reemplaza la tabla con overflow) */
body.admin-body .oi-head {
  display: grid; grid-template-columns: 1fr 110px 160px 130px 110px; gap: 10px;
  background: var(--brand); color:#fff; padding: 8px 12px; border-radius: 8px 8px 0 0;
  font-size: .7rem; text-transform: uppercase; letter-spacing:.03em; font-weight:600;
}
body.admin-body .oi-head .oi-c-qty, body.admin-body .oi-head .oi-c-price, body.admin-body .oi-head .oi-c-total { text-align: right; }
body.admin-body .oi-row {
  display: grid; grid-template-columns: 1fr 110px 160px 130px 110px; gap: 10px; align-items: center;
  padding: 10px 12px; border: .5px solid var(--line); border-top: 0; background:#fff;
}
body.admin-body .oi-row:last-child { border-radius: 0 0 8px 8px; }
body.admin-body .oi-c-total { text-align: right; }
body.admin-body .oi-mlabel { display:block; font-size:.66rem; color:var(--gray); margin-bottom:2px; }

/* Buscador de referencia + desplegable flotante que NO queda atrapado en overflow */
body.admin-body .oi-search-wrap { position: relative; }
body.admin-body .oi-sug {
  display: none; margin-top: 4px; border: .5px solid var(--line); border-radius: 10px;
  background: #fff; box-shadow: 0 14px 34px rgba(31,27,46,.20);
  position: absolute; left: 0; right: 0; z-index: 1080; max-height: 300px; overflow-y: auto;
}
body.admin-body .oi-sug-item {
  display: block; width: 100%; text-align: left; border: 0; border-bottom: .5px solid var(--line);
  background: #fff; padding: .55rem .75rem; cursor: pointer; font-size:.85rem;
}
body.admin-body .oi-sug-item:last-child { border-bottom: 0; }
body.admin-body .oi-sug-item:hover { background: var(--brand-light); }
body.admin-body .oi-sug-empty { padding: .6rem .75rem; }

@media (max-width: 767px){
  body.admin-body .oi-row { grid-template-columns: 1fr; gap: 6px; }
}

/* Afinado visual del modal de pedido para igualar el preview aprobado (6-jul-2026) */
body.admin-body .modal-order .modal-body .form-label { font-size:.78rem; color:var(--gray); margin-bottom:.2rem; font-weight:500; }
body.admin-body .modal-order .modal-body .form-control,
body.admin-body .modal-order .modal-body .form-select {
  border:.5px solid var(--line); border-radius:8px; font-size:.9rem; background:#fff;
}
body.admin-body .modal-order .modal-body .form-control:focus,
body.admin-body .modal-order .modal-body .form-select:focus {
  border-color:var(--brand); box-shadow:0 0 0 3px rgba(91,46,145,.12);
}
/* Campo Total destacado en lila, solo lectura */
body.admin-body .modal-order #f_total { background:var(--brand-light); font-weight:600; color:var(--brand-dark); }
/* Encabezado de sección Productos */
body.admin-body .modal-order .order-items-head strong { font-size:.95rem; }
/* El botón + Agregar referencia en púrpura sólido */
body.admin-body .modal-order #f_add_item { background:var(--brand); border-color:var(--brand); color:#fff; font-weight:500; }
body.admin-body .modal-order #f_add_item:hover { filter:brightness(1.08); }
/* Footer del modal con fondo perla */
body.admin-body .modal-order .modal-footer { background:var(--bg); border-top:.5px solid var(--line); }