/* Cotizador CRM — Cinépolis Media
   Estilos principales
   Generado automáticamente desde index.html
*/

/* ══════════════════════════════════════════════════════
   VARIABLES Y RESET
══════════════════════════════════════════════════════ */
:root {
  --purple:#8234cf; --blue:#4781ff; --turquoise:#35cbcc;
  --green:#4fc974; --yellow:#ffbe06; --coral:#f64e4e; --magenta:#d3168f;
  --ink:#1d1d2b; --muted:#6b6b7b; --line:#e6e6ee; --bg:#f4f4f9; --white:#fff;

  /* Sidebar claro */
  --sb-bg:#ededed; --sb-text:#444; --sb-border:#d4d4d4;
  --sb-active-bg:rgba(130,52,207,0.1); --sb-active-text:#8234cf;
  --sb-item-hover:rgba(0,0,0,0.05);
  --sb-soon-bg:rgba(0,0,0,0.08); --sb-soon-text:#888;
  --sb-logo:#1d1d2b; --sb-logo-span:#8234cf;
  --sb-avatar-bg:rgba(130,52,207,0.15); --sb-avatar-text:#8234cf;
  --sb-uname:#333; --sb-urole:#888; --sb-icon:#999;

  /* Main area */
  --main-bg:#f4f4f9; --panel-bg:#fff; --panel-border:#e6e6ee;
  --top-bg:#fff; --top-border:#e6e6ee;
  --field-bg:#f4f4f9; --field-border:#e6e6ee; --field-text:#1d1d2b;
  --label-color:#6b6b7b; --section-color:#8234cf;
  --chip-bg:#f0e9fa; --chip-border:#ddd0f5;
}

/* Modo oscuro */
body.dark-mode {
  --sb-bg:#13131e; --sb-text:rgba(255,255,255,0.5); --sb-border:rgba(255,255,255,0.07);
  --sb-active-bg:rgba(130,52,207,0.28); --sb-active-text:#c3a6f7;
  --sb-item-hover:rgba(255,255,255,0.05);
  --sb-soon-bg:rgba(255,255,255,0.08); --sb-soon-text:rgba(255,255,255,0.35);
  --sb-logo:#fff; --sb-logo-span:#9b6de0;
  --sb-avatar-bg:rgba(130,52,207,0.35); --sb-avatar-text:#c3a6f7;
  --sb-uname:rgba(255,255,255,0.7); --sb-urole:rgba(255,255,255,0.35); --sb-icon:rgba(255,255,255,0.3);

  --ink:rgba(255,255,255,0.88); --muted:rgba(255,255,255,0.45);
  --line:rgba(255,255,255,0.08); --bg:#1a1a28; --white:#22223a;
  --main-bg:#1a1a28; --panel-bg:#22223a; --panel-border:rgba(255,255,255,0.07);
  --top-bg:#1e1e30; --top-border:rgba(255,255,255,0.07);
  --field-bg:#1a1a28; --field-border:rgba(255,255,255,0.09); --field-text:rgba(255,255,255,0.85);
  --label-color:rgba(255,255,255,0.38); --section-color:#a07ee8;
  --chip-bg:rgba(130,52,207,0.18); --chip-border:rgba(130,52,207,0.3);
  --purple:#9b6de0; --blue:#5a8fff; --coral:#f64e4e;
}

*{box-sizing:border-box;margin:0;padding:0}
body{font-family:'Montserrat',sans-serif;background:var(--main-bg);color:var(--ink);font-size:14px;line-height:1.5;transition:background .25s,color .25s}
button{font-family:inherit;cursor:pointer;border:none;border-radius:8px;font-weight:600;transition:.15s}
input,select,textarea{font-family:inherit;font-size:14px;border:1px solid var(--field-border);border-radius:8px;padding:9px 11px;width:100%;background:var(--panel-bg);color:var(--field-text);transition:background .25s,border-color .25s,color .25s}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(71,129,255,.12)}
label{font-size:12px;font-weight:600;color:var(--label-color);display:block;margin-bottom:5px;transition:color .25s}

/* ══════════════════════════════════════════════════════
   LAYOUT PRINCIPAL
══════════════════════════════════════════════════════ */
.app-shell {
  display: flex;
  min-height: 100vh;
}

/* ══════════════════════════════════════════════════════
   SIDEBAR
══════════════════════════════════════════════════════ */
.sidebar {
  width: 216px;
  flex-shrink: 0;
  background: var(--sb-bg);
  border-right: 1px solid var(--sb-border);
  display: flex;
  flex-direction: column;
  transition: background .25s, border-color .25s, transform .25s;
  position: sticky;
  top: 0;
  height: 100vh;
  overflow-y: auto;
  overflow-x: hidden;
  z-index: 50;
}
.sb-brand {
  padding: 16px 14px 12px;
  border-bottom: 1px solid var(--sb-border);
  flex-shrink: 0;
}
.sb-logo {
  font-size: 16px;
  font-weight: 800;
  color: var(--sb-logo);
  letter-spacing: -.5px;
  transition: color .25s;
}
.sb-logo span { color: var(--sb-logo-span); }
.sb-sub {
  font-size: 9px;
  color: var(--sb-icon);
  text-transform: uppercase;
  letter-spacing: .5px;
  margin-top: 2px;
  font-weight: 600;
  transition: color .25s;
}
.sb-nav {
  flex: 1;
  padding: 10px 8px;
  display: flex;
  flex-direction: column;
  gap: 2px;
  overflow-y: auto;
}
.sb-item {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 9px 10px;
  border-radius: 9px;
  font-size: 13px;
  font-weight: 600;
  color: var(--sb-text);
  cursor: pointer;
  text-decoration: none;
  transition: background .12s, color .12s;
  white-space: nowrap;
}
.sb-item:hover { background: var(--sb-item-hover); }
.sb-item.active { background: var(--sb-active-bg); color: var(--sb-active-text); }
.sb-item .sb-icon { font-size: 16px; width: 20px; text-align: center; flex-shrink: 0; }
.sb-item.active .sb-icon { opacity: 1; }
.sb-item .sb-label { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.sb-chevron { font-size: 14px; color: var(--muted); transition: transform .2s; margin-left: auto; }
.sb-item.submenu-open .sb-chevron { transform: rotate(90deg); }
.sb-submenu {
  max-height: 0;
  overflow: hidden;
  transition: max-height .25s ease;
  padding-left: 12px;
}
.sb-submenu.open { max-height: 300px; }
.sb-sub-item {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 7px 10px;
  border-radius: 8px;
  font-size: 12.5px;
  font-weight: 500;
  color: var(--sb-text);
  cursor: pointer;
  text-decoration: none;
  transition: background .12s, color .12s;
  white-space: nowrap;
}
.sb-sub-item:hover { background: var(--sb-item-hover); }
.sb-sub-item.active { background: var(--sb-active-bg); color: var(--sb-active-text); font-weight: 600; }
.sb-sub-icon { font-size: 13px; width: 18px; text-align: center; flex-shrink: 0; }
.sb-soon {
  font-size: 9px; font-weight: 700;
  background: var(--sb-soon-bg); color: var(--sb-soon-text);
  border-radius: 4px; padding: 2px 5px;
  margin-left: auto; flex-shrink: 0;
  text-transform: uppercase; letter-spacing: .3px;
  transition: background .25s, color .25s;
}

/* Acciones inferiores */
.sb-actions-row {
  display: flex;
  flex-direction: column;
  gap: 1px;
  padding: 6px 8px 4px;
  border-top: 1px solid var(--sb-border);
  flex-shrink: 0;
}
.sb-action-btn {
  display: flex; align-items: center; gap: 9px;
  padding: 8px 10px; border-radius: 9px;
  font-size: 12.5px; font-weight: 600;
  color: var(--sb-text); background: none; border: none;
  cursor: pointer; text-decoration: none;
  font-family: inherit; width: 100%; text-align: left;
  transition: background .12s, color .12s;
  white-space: nowrap;
}
.sb-action-btn:hover { background: var(--sb-item-hover); }
.sb-action-icon { font-size: 15px; width: 20px; text-align: center; flex-shrink: 0; }
.sb-action-label { color: var(--sb-text); transition: color .25s; overflow: hidden; text-overflow: ellipsis; }

/* Tarjeta usuario */
.sb-user-card {
  display: flex; align-items: center; gap: 9px;
  padding: 10px 12px;
  border-top: 1px solid var(--sb-border);
  background: rgba(0,0,0,0.03);
  flex-shrink: 0; min-width: 0;
}
.sb-avatar {
  width: 32px; height: 32px; border-radius: 50%;
  background: var(--sb-avatar-bg);
  display: flex; align-items: center; justify-content: center;
  font-size: 12px; font-weight: 700; color: var(--sb-avatar-text);
  flex-shrink: 0; transition: background .25s, color .25s;
}
.sb-uinfo { flex: 1; min-width: 0; }
.sb-uname {
  font-size: 12px; font-weight: 600; color: var(--sb-uname);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  transition: color .25s;
}
.sb-urole { font-size: 10px; color: var(--sb-urole); transition: color .25s; }

/* Badge de rol */
#role-badge {
  display: inline-block; font-size: 9px; font-weight: 700;
  text-transform: uppercase; letter-spacing: .4px;
  padding: 2px 6px; border-radius: 10px;
  background: #eef1ff; color: #3858c6;
}
body[data-role="administrador"] #role-badge { background:#ffe9e9; color:#c0392b; }
body[data-role="editor"]        #role-badge { background:#e8f0ff; color:var(--blue); }
body[data-role="lector"]        #role-badge { background:#e8f9ee; color:#27ae60; }
body[data-role="desarrollador"] #role-badge { background:rgba(130,52,207,.14); color:var(--purple); }

/* Botón hamburguesa (mobile) */
#sb-toggle {
  display: none;
  position: fixed;
  top: 11px; left: 12px;
  z-index: 200;
  width: 36px; height: 36px;
  background: var(--panel-bg);
  border: 1px solid var(--panel-border);
  border-radius: 9px;
  cursor: pointer;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  box-shadow: 0 2px 8px rgba(0,0,0,.08);
  transition: background .12s;
}
#sb-toggle:hover { background: var(--bg); }

/* Overlay para cerrar sidebar en mobile */
#sb-overlay {
  display: none;
  position: fixed; inset: 0;
  background: rgba(0,0,0,.35);
  z-index: 49;
}
#sb-overlay.show { display: block; }

/* ══════════════════════════════════════════════════════
   ÁREA PRINCIPAL
══════════════════════════════════════════════════════ */
.main-area {
  flex: 1;
  display: flex;
  flex-direction: column;
  min-width: 0;
  overflow: hidden;
}

/* Topbar */
.topbar {
  background: var(--top-bg);
  border-bottom: 1px solid var(--top-border);
  padding: 10px 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  position: sticky;
  top: 0;
  z-index: 10;
  transition: background .25s, border-color .25s;
  min-height: 48px;
  flex-shrink: 0;
}
.topbar-left { display: flex; align-items: center; gap: 8px; min-width: 0; }
.topbar-title { font-size: 14px; font-weight: 700; color: var(--ink); white-space: nowrap; }
.topbar-sub { font-size: 11px; color: var(--muted); font-weight: 500; white-space: nowrap; }
.topbar-right { display: flex; gap: 6px; align-items: center; flex-shrink: 0; }

/* Botones topbar */
.btn-top {
  border: 1px solid var(--panel-border);
  background: var(--panel-bg);
  color: var(--ink);
  border-radius: 8px;
  padding: 6px 12px;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  display: flex; align-items: center; gap: 5px;
  transition: background .12s, color .12s, border-color .12s;
  font-family: inherit;
  text-decoration: none;
  white-space: nowrap;
}
.btn-top:hover { background: var(--bg); }
.btn-top.blue   { background: var(--blue);   border-color: var(--blue);   color: #fff; }
.btn-top.blue:hover  { opacity: .88; }
.btn-top.purple { background: var(--purple); border-color: var(--purple); color: #fff; }
.btn-top.purple:hover { opacity: .88; }

/* Contenido split (crear cotización) */
.content-split {
  flex: 1;
  display: flex;
  overflow: hidden;
  min-height: 0;
}

/* ══════════════════════════════════════════════════════
   PANEL FORMULARIO
══════════════════════════════════════════════════════ */
.panel {
  width: 400px;
  flex-shrink: 0;
  background: var(--panel-bg);
  border-right: 1px solid var(--panel-border);
  overflow-y: auto;
  overflow-x: hidden;
  height: calc(100vh - 48px);
  padding: 0;
  transition: background .25s, border-color .25s;
}

/* Paso numerado */
.step-block {
  border-bottom: 1px solid var(--panel-border);
  padding: 16px 18px;
}
.step-block:last-child { border-bottom: none; }
.step-header {
  display: flex; align-items: center; gap: 10px; margin-bottom: 12px;
}
.step-num {
  width: 24px; height: 24px; border-radius: 50%;
  background: var(--purple); color: #fff;
  font-size: 11px; font-weight: 800; display: flex; align-items: center;
  justify-content: center; flex-shrink: 0;
}
.step-title {
  font-size: 12px; font-weight: 700; text-transform: uppercase;
  letter-spacing: .5px; color: var(--ink);
}
.step-subtitle {
  font-size: 11px; color: var(--muted); margin-left: 34px; margin-top: -8px; margin-bottom: 10px;
}

/* Mantener .group para compatibilidad JS pero invisible */
.group { margin-bottom: 0; }
.group h3 { display: none; }
.row   { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.field { margin-bottom: 10px; }
.field label { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .4px; color: var(--muted); display: block; margin-bottom: 4px; }

/* Preview del documento */
.preview-wrap {
  flex: 1;
  padding: 20px;
  overflow-y: auto;
  overflow-x: hidden;
  height: calc(100vh - 48px);
  background: var(--main-bg);
  transition: background .25s;
}

/* Toggle IVA */
.toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: var(--bg);
  padding: 10px 12px;
  border-radius: 8px;
  margin-bottom: 10px;
  transition: background .25s;
}
.toggle span { font-size: 13px; font-weight: 600; }
.switch { position: relative; width: 42px; height: 23px; flex-shrink: 0; }
.switch input { opacity: 0; width: 0; height: 0; position: absolute; }
.slider { position: absolute; inset: 0; background: #cfcfdd; border-radius: 23px; transition: .2s; }
.slider::before { content: ""; position: absolute; height: 17px; width: 17px; left: 3px; top: 3px; background: #fff; border-radius: 50%; transition: .2s; }
.switch input:checked + .slider { background: var(--green); }
.switch input:checked + .slider::before { transform: translateX(19px); }

/* Botones panel */
.btn-primary { background: var(--purple); color: #fff; padding: 10px; width: 100%; font-size: 13px; }
.btn-primary:hover { opacity: .88; }
.btn-blue { background: var(--blue); color: #fff; padding: 10px; width: 100%; font-size: 13px; }
.btn-blue:hover { opacity: .88; }
.btn-ghost {
  background: var(--bg);
  color: var(--ink);
  padding: 9px;
  width: 100%;
  border: 1px solid var(--line);
  font-size: 13px;
  transition: background .12s, border-color .12s, color .12s;
}
.btn-ghost:hover { background: var(--line); }
.btn-sm { padding: 6px 10px; font-size: 12px; }

/* Catálogo items */
.cat-item {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: 8px;
  margin-bottom: 7px;
  background: var(--panel-bg);
  transition: background .25s, border-color .25s;
}
.cat-item .ci-main { flex: 1; min-width: 0; }
.cat-item .ci-name { font-weight: 600; font-size: 12.5px; color: var(--ink); }
.cat-item .ci-meta { font-size: 11px; color: var(--muted); margin-top: 2px; }
.cat-actions { display: flex; gap: 4px; margin-top: 7px; }
.icon-btn {
  background: var(--bg);
  border-radius: 6px;
  padding: 4px 8px;
  font-size: 11px;
  font-weight: 600;
  color: var(--muted);
  border: none;
  cursor: pointer;
  transition: background .12s, color .12s;
}
.icon-btn:hover { background: var(--line); color: var(--ink); }
.icon-btn.add { background: var(--green); color: #fff; }
.icon-btn.add:hover { opacity: .88; }
.icon-btn.del:hover { background: var(--coral); color: #fff; }
.empty { font-size: 12px; color: var(--muted); text-align: center; padding: 14px; background: var(--bg); border-radius: 8px; }
.hint { font-size: 11px; color: var(--muted); margin-top: 6px; line-height: 1.4; }

/* ══════════════════════════════════════════════════════
   DOCUMENTO
══════════════════════════════════════════════════════ */
.doc { background: #fff; width: 100%; max-width: 920px; min-height: 1060px; margin: 0 auto; padding: 44px 52px; box-shadow: 0 4px 24px rgba(30,30,60,.09); border-radius: 6px; box-sizing: border-box; overflow-wrap: break-word; word-wrap: break-word; }
.doc-head { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 16px; }
.doc-logo { max-width: 220px; text-align: left; }
.doc-logo img { max-width: 220px; max-height: 80px; object-fit: contain; }
.doc-title { font-size: 15px; font-weight: 700; color: #4781ff; max-width: 55%; line-height: 1.35; text-transform: uppercase; text-align: right; word-break: break-word; overflow-wrap: break-word; }

.doc-meta { display: flex; justify-content: space-between; margin-bottom: 14px; font-size: 11px; }
.doc-meta .left .co { font-weight: 700; color: #1d1d2b; margin-bottom: 2px; font-size: 11.5px; }
.doc-meta .left p { color: #6b6b7b; margin-bottom: 1px; }
.doc-meta .right { text-align: right; max-width: 55%; overflow-wrap: break-word; word-wrap: break-word; }
.doc-meta .right p { color: #6b6b7b; margin-bottom: 1px; }
.doc-meta .right .num { color: #1d1d2b; font-weight: 700; font-size: 12px; margin-bottom: 3px; }
.doc-meta .right .lbl-val { display: flex; justify-content: flex-end; gap: 6px; margin-bottom: 1px; flex-wrap: wrap; }
.doc-meta .right .lbl-val .lbl { color: #6b6b7b; font-weight: 500; white-space: nowrap; }
.doc-meta .right .lbl-val .val { color: #1d1d2b; font-weight: 600; font-size: 11px; word-break: break-word; }
.pay-cond { margin-top: 1px; font-weight: 600; font-size: 11px; }

.doc-comments { margin-bottom: 12px; border-left: 3px solid #4781ff; padding-left: 10px; }
.doc-comments .lbl { font-size: 11px; font-weight: 700; color: #4781ff; text-transform: uppercase; letter-spacing: .4px; margin-bottom: 4px; }
.doc-comments .obs { white-space: normal; line-height: 1.5; font-size: 11px; color: #1d1d2b; }

table.items { width: 100%; border-collapse: collapse; margin-bottom: 8px; table-layout: fixed; }
table.items thead th:nth-child(1), table.items tbody td:nth-child(1) { width: 40%; }
table.items thead th:nth-child(2), table.items tbody td:nth-child(2) { width: 12%; }
table.items thead th:nth-child(3), table.items tbody td:nth-child(3) { width: 18%; }
table.items thead th:nth-child(4), table.items tbody td:nth-child(4) { width: 10%; }
table.items thead th:nth-child(5), table.items tbody td:nth-child(5) { width: 20%; }
table.items thead th { background: #4781ff; color: #fff; font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: .4px; padding: 6px 10px; text-align: left; }
table.items thead th.r { text-align: right; white-space: nowrap; }
table.items thead th.c { text-align: center; }
.line-name { font-weight: 700; font-size: 11.5px; padding: 6px 10px 2px 0; }
.line-desc { font-size: 10.5px; color: #555; padding: 1px 10px 1px 0; white-space: pre-line; }
.line-disc { display: flex; gap: 6px; align-items: center; margin-top: 6px; }
.line-disc-type { flex: 0 0 92px; padding: 5px 7px; font-size: 11.5px; }
.line-disc-value { width: 80px; padding: 5px 7px; font-size: 11.5px; }
.line-disc-note { font-size: 11px; color: #f64e4e; font-weight: 600; margin-top: 3px; }
.line-row td { vertical-align: top; padding: 6px 10px; }
.line-row td.c { text-align: center; }
.qty-stepper { display: inline-flex; align-items: center; border: 1px solid #e6e6ee; border-radius: 8px; overflow: hidden; background: #fff; }
.qty-btn { width: 26px; height: 30px; background: #f4f4f9; color: #8234cf; font-size: 16px; font-weight: 700; border-radius: 0; line-height: 1; border: none; cursor: pointer; }
.qty-btn:hover { background: #8234cf; color: #fff; }
.qty-input { width: 44px; height: 30px; border: none; text-align: center; font-weight: 600; font-size: 13px; padding: 0; border-radius: 0; -moz-appearance: textfield; background: #fff; color: #1d1d2b; }
.qty-input::-webkit-outer-spin-button, .qty-input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.qty-input:focus { box-shadow: none; background: #f0f4ff; }
.line-row td.r { text-align: right; font-weight: 600; white-space: nowrap; }
.line-sep td { border-bottom: 1px solid #e6e6ee; padding: 0; height: 0; }

.totals { margin-left: auto; width: 240px; margin-top: 4px; }
.totals .trow { display: flex; justify-content: space-between; padding: 4px 10px; font-size: 11.5px; border-bottom: 1px solid #e6e6ee; }
.totals .trow .tl { font-weight: 600; color: #6b6b7b; }
.totals .trow.grand { background: #f4f4f9; border-radius: 6px; border: none; margin-top: 4px; }
.totals .trow.trow-discount { background: #fff5f5; border-color: #fcdada; }
.totals .trow.trow-discount .tl { color: #e53935; }
.totals .trow.grand .tl, .totals .trow.grand .tv { font-weight: 800; font-size: 13px; color: #8234cf; }

.doc-foot { margin-top: 34px; font-size: 11.5px; color: #6b6b7b; }
.doc-foot .gen { margin-bottom: 14px; font-size: 12px; }
.doc-foot .gen b { color: #1d1d2b; }
/* "Generado por" al final del documento: se muestra como cierre/firma, con un
   separador superior que lo despega de los términos que lo preceden. */
.doc-foot .gen-close { margin-top: 22px; margin-bottom: 0; padding-top: 12px; border-top: 1px solid #e6e6ee; }
.doc-foot h4 { font-size: 11.5px; color: #1d1d2b; text-transform: uppercase; letter-spacing: .4px; margin-bottom: 4px; margin-top: 12px; }
.doc-foot a { color: #4781ff; word-break: break-all; }

.editable { cursor: text; border-radius: 3px; transition: background .12s; }
.editable:hover { background: rgba(71,129,255,.07); }
.editable:focus { outline: none; background: rgba(71,129,255,.1); box-shadow: 0 0 0 2px rgba(71,129,255,.25); }
.line-del { position: absolute; left: -2px; top: 8px; opacity: 0; transition: opacity .12s; }
.line-row:hover .line-del { opacity: 1; }

/* ══════════════════════════════════════════════════════
   MODALES
══════════════════════════════════════════════════════ */
.modal-bg { position: fixed; inset: 0; background: rgba(20,20,40,.45); display: none; align-items: center; justify-content: center; z-index: 50; padding: 20px; }
.modal-bg.show { display: flex; }
.modal { background: var(--panel-bg); border-radius: 14px; padding: 26px; width: 100%; max-width: 440px; box-shadow: 0 20px 60px rgba(0,0,0,.25); transition: background .25s; }
.modal h2 { font-size: 17px; margin-bottom: 18px; color: var(--purple); }
.modal .field { margin-bottom: 13px; }
.modal-actions { display: flex; gap: 10px; margin-top: 8px; }
.modal-actions button { flex: 1; }
.hist-list { max-height: 50vh; overflow-y: auto; border: 1px solid var(--line); border-radius: 10px; }
.hist-row { display: grid; grid-template-columns: 54px 1fr 100px 76px 130px; gap: 8px; align-items: center; padding: 10px 12px; border-bottom: 1px solid var(--line); font-size: 12.5px; color: var(--ink); }
.hist-row:last-child { border-bottom: none; }
.hist-row .h-num { font-weight: 700; color: var(--purple); }
.hist-row .h-name { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hist-row .h-name small { display: block; font-weight: 500; color: var(--muted); font-size: 11px; }
.hist-row .h-amt { text-align: right; font-weight: 700; }
.hist-row .h-date, .hist-row .h-owner { color: var(--muted); font-size: 11px; }
.hist-row .h-del { background: var(--bg); border-radius: 6px; padding: 4px 7px; font-size: 11px; color: var(--muted); }
.h-acts { display: flex; gap: 4px; flex-wrap: wrap; }
.h-act { background: var(--bg); border-radius: 6px; padding: 4px 7px; font-size: 11px; font-weight: 600; color: var(--purple); border: none; cursor: pointer; }
.h-act:hover { background: var(--purple); color: #fff; }
.h-act.del { color: var(--muted); }
.h-act.del:hover { background: var(--coral); color: #fff; }
.hist-row .h-del:hover { background: var(--coral); color: #fff; }
.hist-head { display: grid; grid-template-columns: 54px 1fr 100px 76px 130px; gap: 8px; padding: 8px 12px; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .4px; color: var(--muted); background: var(--bg); border-bottom: 1px solid var(--line); }
.hist-empty { padding: 24px; text-align: center; color: var(--muted); font-size: 13px; }

/* Admin modal (original) */
.adm-row { display: flex; align-items: center; gap: 8px; padding: 8px 0; border-bottom: 1px solid var(--line); }
.adm-role { padding: 6px 8px; border: 1px solid var(--line); border-radius: 8px; font-size: 12.5px; background: var(--panel-bg); color: var(--ink); }
.adm-tabs { display: flex; gap: 6px; margin-bottom: 14px; }
.adm-tab { flex: 1; padding: 8px; border: 1px solid var(--line); background: var(--bg); border-radius: 8px; font-size: 12.5px; font-weight: 600; cursor: pointer; color: var(--muted); font-family: inherit; transition: background .12s; }
.adm-tab.active { background: var(--blue); border-color: var(--blue); color: #fff; }

/* ══════════════════════════════════════════════════════
   LOGIN
══════════════════════════════════════════════════════ */
.login-bg { position: fixed; inset: 0; background: linear-gradient(135deg,#8234cf,#35cbcc); display: flex; align-items: center; justify-content: center; z-index: 100; padding: 20px; }
.login-card { background: #fff; border-radius: 18px; padding: 38px 34px; width: 100%; max-width: 380px; box-shadow: 0 24px 70px rgba(0,0,0,.3); }
.login-card .ll { text-align: center; margin-bottom: 6px; }
.login-card .ll img { max-width: 180px; max-height: 54px; object-fit: contain; }
.login-card .lsub { text-align: center; font-size: 11px; color: #6b6b7b; text-transform: uppercase; letter-spacing: .6px; font-weight: 600; margin-bottom: 24px; }
.login-card .field { margin-bottom: 14px; }
.login-err { background: #fde8e8; color: #f64e4e; font-size: 12.5px; padding: 9px 12px; border-radius: 8px; margin-bottom: 14px; display: none; }
.login-err.show { display: block; }
.login-err.ok { background: #e8f7ee; color: #1e7e45; }
.auth-tabs { display: flex; gap: 6px; margin-bottom: 14px; }
.auth-tab { flex: 1; padding: 9px; border: none; background: #f64e4e; border-radius: 9px; font-size: 13px; font-weight: 600; cursor: default; color: #fff; font-family: inherit; }
.auth-tab.active { background: #f64e4e; border-color: #f64e4e; color: #fff; }
#app-root { display: none; }
#login { display: none; }
#boot-splash{position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,#fff0f0,#eef3ff)}
#boot-splash .ring{width:42px;height:42px;border:4px solid rgba(71,129,255,.25);
  border-top-color:#4781ff;border-radius:50%;animation:bootspin .8s linear infinite}
@keyframes bootspin{to{transform:rotate(360deg)}}

/* ══════════════════════════════════════════════════════
   PÁGINA DE COTIZACIONES
══════════════════════════════════════════════════════ */
#page-quotes { display: flex; flex-direction: column; min-height: 0; }

/* Tabla: 8 columnas → folio | doc+cliente | ejecutivo | emisión | vence | total | estado | acciones */
.qp-row {
  display: grid;
  grid-template-columns: 56px minmax(140px,1.3fr) 128px 84px 84px 108px 96px 216px;
  column-gap: 12px;
  align-items: center;
  padding: 11px 20px;
  border-bottom: 1px solid var(--panel-border);
  font-size: 13px;
  color: var(--ink);
  transition: background .1s;
}
/* Permite que las celdas de texto se encojan y usen ellipsis en vez de desbordar */
.qp-row > * { min-width: 0; }
.qp-head {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .6px;
  color: var(--muted);
  background: var(--bg);
  border-bottom: 2px solid var(--panel-border);
  padding: 10px 20px;
}
.qp-row:not(.qp-head):hover { background: var(--bg); cursor: default; }
.qp-row:last-child { border-bottom: none; }

.qp-folio { font-weight: 800; color: var(--purple); font-size: 13px; letter-spacing: -.2px; }
.qp-name  { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding-right: 12px; }
.qp-sub   { font-size: 11px; color: var(--muted); margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.qp-exec  { font-size: 11.5px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding-right: 8px; }
.qp-date  { font-size: 11.5px; color: var(--muted); }
.qp-amount{ text-align: right; font-weight: 700; font-size: 13px; color: var(--ink); white-space: nowrap; }

.qp-badge {
  display: inline-flex;
  align-items: center;
  font-size: 10px;
  font-weight: 700;
  padding: 3px 9px;
  border-radius: 20px;
  text-transform: uppercase;
  letter-spacing: .3px;
  white-space: nowrap;
}
.qp-badge.generada { background: #eef1ff; color: #4055d4; }
.qp-badge.enviada  { background: #fff8e1; color: #9c6800; }
.qp-badge.aprobada { background: #e8f5e9; color: #2e7d32; }
.qp-badge.rechazada{ background: #fde8e8; color: #c0392b; }
.qp-badge.vencida  { background: #eceff1; color: #607d8b; }

/* Selector de estado (solo visible para quien puede cambiarlo) */
.qp-status-sel {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .3px;
  padding: 4px 22px 4px 10px;
  border-radius: 20px;
  border: 1px solid transparent;
  cursor: pointer;
  font-family: inherit;
  max-width: 100%;
  -webkit-appearance: none;
  appearance: none;
  background-repeat: no-repeat;
  background-position: right 8px center;
  background-size: 8px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath fill='%23667' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
}
.qp-status-sel.generada { background-color: #eef1ff; color: #4055d4; }
.qp-status-sel.enviada  { background-color: #fff8e1; color: #9c6800; }
.qp-status-sel.aprobada { background-color: #e8f5e9; color: #2e7d32; }
.qp-status-sel.rechazada{ background-color: #fde8e8; color: #c0392b; }
.qp-status-sel:hover    { border-color: rgba(0,0,0,.12); }
.qp-status-sel:focus    { outline: none; border-color: var(--purple); }
.qp-status-sel:disabled { opacity: .55; cursor: default; }

/* ══════════════════════════════════════════════════════════════════════
   CONTACTOS
══════════════════════════════════════════════════════════════════════ */

/* ── Barra superior ── */
.ct-topbar {
  padding: 16px 24px 0;
  border-bottom: 1px solid var(--panel-border);
  background: var(--panel-bg);
  flex-shrink: 0;
}
.ct-topbar-row1 {
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px; flex-wrap: wrap; margin-bottom: 12px;
}
.ct-search-wrap {
  position: relative; flex: 1; min-width: 200px; max-width: 360px;
}
.ct-search-icon {
  position: absolute; left: 11px; top: 50%; transform: translateY(-50%);
  font-size: 14px; color: var(--muted); pointer-events: none;
}
.ct-input-search {
  width: 100%; padding: 9px 12px 9px 34px;
  border: 1.5px solid var(--panel-border); border-radius: 10px;
  background: var(--bg); color: var(--ink); font-size: 13px; font-family: inherit;
  transition: border-color .15s;
}
.ct-input-search:focus { outline: none; border-color: var(--purple); }
.ct-filters-row {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  padding-bottom: 12px;
}
.ct-filter-chip {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 6px 12px; border-radius: 20px;
  border: 1.5px solid var(--panel-border); background: var(--bg);
  color: var(--muted); font-size: 12px; font-weight: 600; font-family: inherit;
  cursor: pointer; transition: all .15s; white-space: nowrap;
}
.ct-filter-chip:hover    { border-color: var(--purple); color: var(--purple); background: rgba(130,52,207,.06); }
.ct-filter-chip.active   { border-color: var(--purple); color: var(--purple); background: rgba(130,52,207,.10); }
.ct-filter-chip .chip-x  { font-size: 10px; margin-left: 2px; }
.ct-filter-select-wrap { position: relative; }
.ct-select {
  appearance: none; -webkit-appearance: none;
  padding: 7px 28px 7px 12px; border: 1.5px solid var(--panel-border); border-radius: 20px;
  background: var(--bg); color: var(--muted); font-size: 12px; font-weight: 600;
  font-family: inherit; cursor: pointer; transition: all .15s;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 6'%3E%3Cpath fill='%236b6b7b' d='M0 0l5 6 5-6z'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 10px center; background-size: 8px;
}
.ct-select:focus     { outline: none; border-color: var(--purple); color: var(--ink); }
.ct-select.filtered  { border-color: var(--purple); color: var(--purple); background-color: rgba(130,52,207,.08); }
.ct-actions { display: flex; gap: 8px; align-items: center; }
/* Modal editar propietario */
.ct-owner-modal-bg {
  display: none; position: fixed; inset: 0; background: rgba(20,24,33,.45);
  z-index: 1100; align-items: center; justify-content: center;
}
.ct-owner-modal-bg.show { display: flex; }
.ct-owner-modal {
  background: var(--panel-bg); border-radius: 14px; padding: 24px;
  min-width: 320px; max-width: 400px; width: 100%;
  box-shadow: 0 20px 60px rgba(0,0,0,.25);
}
.ct-owner-modal h3 { margin: 0 0 6px; font-size: 15px; }
.ct-owner-modal p  { margin: 0 0 16px; font-size: 12px; color: var(--muted); }
.ct-owner-modal select {
  width: 100%; padding: 9px 12px; border: 1.5px solid var(--panel-border);
  border-radius: 9px; background: var(--bg); color: var(--ink);
  font-size: 13px; font-family: inherit; margin-bottom: 16px;
}
.ct-owner-modal-btns { display: flex; gap: 8px; justify-content: flex-end; }

/* ── Tabla de contactos ── */
.ct-table-wrap { flex: 1; overflow-y: auto; padding: 20px 28px 32px; }
.ct-table {
  background: var(--panel-bg); border: 1px solid var(--panel-border);
  border-radius: 12px; overflow: hidden;
}
.ct-row {
  display: grid;
  grid-template-columns: minmax(180px,1fr) 110px 85px 80px 120px auto auto;
  column-gap: 10px;
  align-items: center;
  padding: 11px 18px;
  border-bottom: 1px solid var(--panel-border);
  font-size: 13px;
}
.ct-row > * { min-width: 0; }
.ct-head {
  font-size: 10px; font-weight: 700; text-transform: uppercase;
  letter-spacing: .6px; color: var(--muted); background: var(--bg);
  border-bottom: 2px solid var(--panel-border); padding: 9px 18px;
}
.ct-row:not(.ct-head):hover { background: var(--bg); }
.ct-row:last-child { border-bottom: none; }
.ct-name  { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ct-sub   { font-size: 11px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ct-cell  { font-size: 12px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ct-empty { text-align: center; padding: 48px 20px; color: var(--muted); font-size: 14px; }
.ct-empty-icon { font-size: 40px; margin-bottom: 10px; }

/* Acciones y Historial: botones compactos */
.ct-actions { display:flex; gap:6px; flex-wrap:nowrap; justify-content:flex-end; }
.ct-actions .ct-row-btn { padding:5px 10px; font-size:11px; white-space:nowrap; }
.ct-hist-col { text-align:center; }
.ct-hist-col .ct-row-btn { padding:5px 10px; font-size:11px; white-space:nowrap; }

/* ── Badges de origen ── */
.ct-badge {
  display: inline-flex; align-items: center; font-size: 9.5px; font-weight: 700;
  padding: 2px 8px; border-radius: 20px; text-transform: uppercase; letter-spacing: .3px;
  white-space: nowrap;
}
.ct-badge.form_home     { background: #eef1ff; color: #4055d4; }
.ct-badge.form_tickets  { background: #fff8e1; color: #9c6800; }
.ct-badge.form_eventos  { background: #e8f5e9; color: #2e7d32; }
.ct-badge.clientify     { background: #fce4ec; color: #ad1457; }
.ct-badge.manual        { background: #f3e5f5; color: #7b1fa2; }

.ct-badge-status { display:inline-flex; align-items:center; font-size:10px; font-weight:700; padding:2px 8px; border-radius:20px; white-space:nowrap; }
.ct-badge-status.activo       { background:#e8f5e9; color:#2e7d32; }
.ct-badge-status.inactivo     { background:#eceff1; color:#607d8b; }
.ct-badge-status.no_suscrito  { background:#fde8e8; color:#c0392b; }

/* ── Botones de fila ── */
.ct-row-btn {
  font-size: 11px; font-weight: 600; padding: 4px 9px; border-radius: 7px;
  border: 1px solid var(--panel-border); background: var(--panel-bg); color: var(--muted);
  cursor: pointer; font-family: inherit; white-space: nowrap;
}
.ct-row-btn:hover { background: var(--purple); color: #fff; border-color: var(--purple); }
.ct-row-btn.del:hover { background: var(--coral); border-color: var(--coral); color: #fff; }

/* ── Modal importar ── */
.ct-modal-bg {
  display: none; position: fixed; inset: 0; background: rgba(20,24,33,.5);
  z-index: 1000; align-items: center; justify-content: center; padding: 20px;
}
.ct-modal {
  background: var(--panel-bg); color: var(--ink);
  border-radius: 16px; width: 100%; max-width: 780px;
  max-height: 90vh; overflow: hidden;
  display: flex; flex-direction: column;
  box-shadow: 0 28px 70px rgba(0,0,0,.28);
}
.ct-modal-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 18px 22px 14px; border-bottom: 1px solid var(--panel-border); flex-shrink: 0;
}
.ct-modal-body { flex: 1; overflow-y: auto; padding: 20px 22px; }
.ct-modal-foot {
  padding: 14px 22px; border-top: 1px solid var(--panel-border);
  display: flex; justify-content: flex-end; gap: 10px; flex-shrink: 0;
}

/* ── Drop zone ── */
.ct-dropzone {
  border: 2px dashed var(--panel-border); border-radius: 12px;
  padding: 36px 20px; text-align: center; cursor: pointer;
  transition: border-color .15s, background .15s;
}
.ct-dropzone:hover, .ct-dropzone.drag-over {
  border-color: var(--purple); background: rgba(130,52,207,.04);
}
.ct-dropzone-icon { font-size: 36px; margin-bottom: 10px; }
.ct-dropzone p    { font-size: 13.5px; color: var(--muted); margin: 0; }
.ct-dropzone b    { color: var(--purple); cursor: pointer; }
#ct-file-input    { display: none; }

/* ── Tabla de previsualización ── */
.ct-preview-table { width: 100%; border-collapse: collapse; font-size: 12px; margin-top: 16px; }
.ct-preview-table th {
  background: var(--bg); color: var(--muted); font-weight: 700;
  font-size: 10px; text-transform: uppercase; letter-spacing: .4px;
  padding: 7px 10px; text-align: left; border-bottom: 2px solid var(--panel-border);
  white-space: nowrap;
}
.ct-preview-table td { padding: 7px 10px; border-bottom: 1px solid var(--panel-border); }
.ct-preview-table tr:last-child td { border-bottom: none; }
.ct-preview-table td:empty::after, .ct-preview-table td.empty::after
  { content: '—'; color: var(--muted); }

/* ── Selector de mapeo de columnas ── */
.ct-map-table { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.ct-map-table th { color: var(--muted); font-size: 10px; font-weight: 700;
  text-transform: uppercase; letter-spacing: .4px; padding: 6px 8px;
  border-bottom: 2px solid var(--panel-border); text-align: left; }
.ct-map-table td { padding: 5px 8px; border-bottom: 1px solid var(--panel-border); }
.ct-map-table tr:last-child td { border-bottom: none; }
.ct-map-sel {
  width: 100%; padding: 5px 8px; border: 1px solid var(--panel-border);
  border-radius: 7px; background: var(--bg); color: var(--ink);
  font-size: 12px; font-family: inherit;
}

/* ── Progress ── */
.ct-progress { text-align: center; padding: 28px 0; }
.ct-progress-ring { width: 44px; height: 44px; border: 4px solid rgba(130,52,207,.2);
  border-top-color: var(--purple); border-radius: 50%; animation: bootspin .8s linear infinite;
  margin: 0 auto 12px; }
.ct-progress p { font-size: 13px; color: var(--muted); }
.ct-result-ok  { background: #e8f5e9; color: #2e7d32; border-radius: 10px; padding: 14px 16px; font-size: 13.5px; font-weight: 600; }
.ct-result-err { background: #fde8e8; color: #c0392b; border-radius: 10px; padding: 14px 16px; font-size: 13.5px; }

@media (max-width: 1280px) {
  /* Pantallas medianas: ocultar Origen y Estado, dar más espacio al resto */
  .ct-row { grid-template-columns: minmax(160px,1fr) 100px 110px auto auto; }
  .ct-row > :nth-child(3), .ct-row > :nth-child(4) { display: none; }
  .ct-head > :nth-child(3), .ct-head > :nth-child(4) { display: none; }
}
@media (max-width: 960px) {
  /* Tablets: ocultar también Teléfono, dejar Cliente + Ejecutivo + Acciones + Historial */
  .ct-row { grid-template-columns: minmax(140px,1fr) 100px auto auto; padding: 10px 14px; }
  .ct-row > :nth-child(2), .ct-row > :nth-child(3), .ct-row > :nth-child(4) { display: none; }
  .ct-head > :nth-child(2), .ct-head > :nth-child(3), .ct-head > :nth-child(4) { display: none; }
}
@media (max-width: 640px) {
  /* Móvil: solo Cliente + Historial */
  .ct-row { grid-template-columns: 1fr auto; padding: 10px 12px; column-gap: 8px; }
  .ct-row > :nth-child(2), .ct-row > :nth-child(3),
  .ct-row > :nth-child(4), .ct-row > :nth-child(5),
  .ct-row > :nth-child(6) { display: none; }
  .ct-head > :nth-child(2), .ct-head > :nth-child(3),
  .ct-head > :nth-child(4), .ct-head > :nth-child(5),
  .ct-head > :nth-child(6) { display: none; }
  .ct-table-wrap { padding: 12px; }
  .ct-topbar { padding: 12px; }
  .ct-input-search { width: 100%; }
}


/* ── Tabs de revisión de duplicados ── */
.ct-dtab {
  padding: 7px 14px; border: none; background: none; cursor: pointer;
  font-family: inherit; font-size: 12.5px; font-weight: 600; color: var(--muted);
  border-bottom: 2px solid transparent; margin-bottom: -2px;
  transition: color .12s, border-color .12s;
  display: flex; align-items: center; gap: 6px;
}
.ct-dtab:hover  { color: var(--ink); }
.ct-dtab.active { color: var(--purple); border-bottom-color: var(--purple); }
.ct-dtab-count  {
  display:inline-flex; align-items:center; justify-content:center;
  min-width:18px; height:18px; border-radius:20px; padding:0 5px;
  font-size:10px; font-weight:700;
  background: var(--bg); color: var(--muted);
}
.ct-dtab.active .ct-dtab-count { background: rgba(130,52,207,.12); color: var(--purple); }
.ct-dupe-table { width:100%; border-collapse:collapse; font-size:12px; }
.ct-dupe-table th { background:var(--bg); color:var(--muted); font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.4px; padding:7px 10px; border-bottom:2px solid var(--panel-border); text-align:left; white-space:nowrap; }
.ct-dupe-table td { padding:8px 10px; border-bottom:1px solid var(--panel-border); vertical-align:top; }
.ct-dupe-table tr:last-child td { border-bottom:none; }
.ct-action-sel { font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.3px; padding:3px 22px 3px 8px; border-radius:20px; border:1px solid transparent; cursor:pointer; font-family:inherit; -webkit-appearance:none; appearance:none; background-repeat:no-repeat; background-position:right 6px center; background-size:7px; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath fill='%23667' d='M1 1l5 5 5-5'/%3E%3C/svg%3E"); }
.ct-action-sel.insert { background-color:#e8f5e9; color:#2e7d32; }
.ct-action-sel.merge  { background-color:#e3f2fd; color:#1565c0; }
.ct-action-sel.review_merge { background-color:#fff3e0; color:#e65100; }
.ct-action-sel.skip   { background-color:#eceff1; color:#607d8b; }
.ct-stat-chip { display:inline-flex; align-items:center; gap:5px; padding:5px 12px; border-radius:20px; font-size:12px; font-weight:600; }
.ct-stat-chip.new       { background:#e8f5e9; color:#2e7d32; }
.ct-stat-chip.dup-email { background:#e3f2fd; color:#1565c0; }
.ct-stat-chip.dup-co    { background:#fff3e0; color:#e65100; }
.ct-main-tabs { display:flex; gap:2px; padding:14px 28px 0; border-bottom:2px solid var(--panel-border); flex-shrink:0; }
.ct-main-tab { padding:8px 16px; border:none; background:none; cursor:pointer; font-family:inherit; font-size:13px; font-weight:600; color:var(--muted); border-bottom:2px solid transparent; margin-bottom:-2px; transition:color .12s, border-color .12s; }
.ct-main-tab:hover  { color:var(--ink); }
.ct-main-tab.active { color:var(--purple); border-bottom-color:var(--purple); }
.ct-main-tab .ct-tc { display:inline-flex; align-items:center; justify-content:center; min-width:18px; height:18px; border-radius:20px; padding:0 5px; font-size:10px; font-weight:700; margin-left:5px; background:var(--bg); color:var(--muted); }
.ct-main-tab.active .ct-tc { background:rgba(130,52,207,.12); color:var(--purple); }
.ct-tc.ew-tab-new { background:var(--coral); color:#fff; animation:ew-pulse 1.8s ease-in-out infinite; }
.ct-main-tab.active .ct-tc.ew-tab-new { background:var(--coral); color:#fff; }
@keyframes ew-pulse { 0%,100%{ opacity:1; } 50%{ opacity:.65; } }

.qpe-label { display:block; font-size:12px; font-weight:600; color:var(--muted); margin:0 0 5px; }
.qpe-input {
  width:100%; padding:10px 12px; margin-bottom:14px;
  border:1px solid var(--panel-border); border-radius:9px;
  background:var(--bg); color:var(--ink); font-size:14px; font-family:inherit;
}
.qpe-input:focus { outline:none; border-color:var(--purple); box-shadow:0 0 0 3px rgba(124,77,255,.15); }

.qp-actions { display: flex; gap: 6px; justify-content: flex-end; flex-wrap: wrap; }
.qp-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  padding: 0;
  font-size: 14px;
  line-height: 1;
  border-radius: 8px;
  border: 1px solid var(--panel-border);
  background: var(--panel-bg);
  color: var(--ink);
  cursor: pointer;
  font-family: inherit;
  transition: background .12s, color .12s, border-color .12s, transform .05s;
  white-space: nowrap;
}
.qp-btn:hover        { background: var(--purple); color: #fff; border-color: var(--purple); }
.qp-btn:active       { transform: scale(.94); }
.qp-btn:focus-visible{ outline: 2px solid var(--blue); outline-offset: 1px; }
/* Acciones destacadas: Enviar (azul) y PDF (morado) */
.qp-btn--send        { background: var(--blue);  border-color: var(--blue);  color: #fff; }
.qp-btn--send:hover  { background: #2f6bff;       border-color: #2f6bff; }
.qp-btn--pdf         { background: var(--purple); border-color: var(--purple); color: #fff; }
.qp-btn--pdf:hover   { background: #6f28b8;       border-color: #6f28b8; }
.qp-btn.del          { color: var(--muted); }
.qp-btn.del:hover    { background: var(--coral); border-color: var(--coral); color: #fff; }

/* Empty / loading state */
.qp-empty {
  padding: 56px 24px;
  text-align: center;
  color: var(--muted);
}
.qp-empty .qp-empty-icon { font-size: 40px; margin-bottom: 12px; opacity: .5; }
.qp-empty p { font-size: 13px; }

/* ══════════════════════════════════════════════════════
   MODAL DE VISTA PREVIA
══════════════════════════════════════════════════════ */
#quote-preview-modal {
  position: fixed;
  inset: 0;
  background: rgba(15,15,35,.6);
  z-index: 200;
  display: none;
  align-items: flex-start;
  justify-content: center;
  padding: 24px 16px;
  overflow-y: auto;
}
#quote-preview-modal.show { display: flex; }

.qpm-shell {
  background: var(--panel-bg);
  border-radius: 16px;
  width: 100%;
  max-width: 880px;
  margin: auto;
  box-shadow: 0 32px 80px rgba(0,0,0,.3);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.qpm-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 20px;
  border-bottom: 1px solid var(--panel-border);
  background: var(--panel-bg);
  position: sticky;
  top: 0;
  z-index: 1;
  gap: 12px;
}
.qpm-title {
  font-size: 14px;
  font-weight: 700;
  color: var(--ink);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  flex: 1;
  min-width: 0;
}
.qpm-actions { display: flex; gap: 7px; flex-shrink: 0; }
.qpm-btn-close {
  background: none;
  border: 1px solid var(--panel-border);
  color: var(--muted);
  border-radius: 8px;
  padding: 6px 14px;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  font-family: inherit;
  transition: background .12s;
}
.qpm-btn-close:hover { background: var(--bg); }
.qpm-btn-export {
  background: var(--purple);
  border: none;
  color: #fff;
  border-radius: 8px;
  padding: 7px 16px;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  font-family: inherit;
  display: flex;
  align-items: center;
  gap: 6px;
  transition: opacity .12s;
}
.qpm-btn-export:hover { opacity: .88; }
.qpm-body {
  padding: 28px;
  background: var(--main-bg);
  overflow-y: auto;
}
.qpm-body .doc {
  background: #fff !important;
  box-shadow: 0 2px 20px rgba(0,0,0,.1);
  margin: 0 auto;
  color: #1d1d2b !important;
}

/* ══════════════════════════════════════════════════════
   RESPONSIVO
══════════════════════════════════════════════════════ */

/* ── Tablet (≤1024px): sidebar más angosta, panel más angosto ── */
@media (max-width: 1024px) {
  .sidebar { width: 190px; }
  .panel   { width: 280px; }
  .doc     { padding: 32px 36px; }

  /* Cotizaciones: ocultar columna ejecutivo */
  .qp-row { grid-template-columns: 56px minmax(130px,1.2fr) 84px 84px 108px 96px 216px; }
  .qp-row > :nth-child(3) { display: none; }
  .qp-head > :nth-child(3) { display: none; }
}

/* ── Mobile-ish (≤768px): sidebar como drawer ── */
@media (max-width: 768px) {
  /* Mostrar botón hamburguesa */
  #sb-toggle { display: flex; }

  /* Topbar con espacio para el hamburguesa */
  .topbar { padding: 10px 12px 10px 56px; }
  .topbar-sub { display: none; }

  /* Sidebar como drawer lateral */
  .sidebar {
    position: fixed;
    left: 0; top: 0;
    height: 100vh;
    width: 240px;
    transform: translateX(-100%);
    z-index: 100;
    box-shadow: 4px 0 20px rgba(0,0,0,.15);
  }
  .sidebar.open { transform: translateX(0); }

  /* Crear cotización: panel encima del preview */
  .content-split { flex-direction: column; overflow: auto; }
  .panel {
    width: 100%;
    height: auto;
    max-height: none;
    border-right: none;
    border-bottom: 1px solid var(--panel-border);
  }
  .preview-wrap { height: auto; padding: 14px; }
  .doc { padding: 24px 20px; }

  /* Totales full width en mobile */
  .totals { width: 100%; margin-left: 0; }

  /* Cotizaciones: cada fila se vuelve una tarjeta apilada */
  .qp-head { display: none; }              /* el encabezado de columnas no aplica a tarjetas */
  .qp-row {
    grid-template-columns: auto 1fr auto;
    grid-template-areas:
      "folio  name    total"
      "status actions actions";
    column-gap: 10px;
    row-gap: 8px;
    padding: 12px 14px;
    font-size: 12px;
  }
  .qp-row > :nth-child(3),   /* ejecutivo */
  .qp-row > :nth-child(4),   /* emisión   */
  .qp-row > :nth-child(5) {  /* vence     */
    display: none;
  }
  .qp-row > :nth-child(1) { grid-area: folio;   align-self: center; }
  .qp-row > :nth-child(2) { grid-area: name;    align-self: center; }
  .qp-row > :nth-child(6) { grid-area: total;   text-align: right; align-self: center; }
  .qp-row > :nth-child(7) { grid-area: status;  justify-self: start; }
  .qp-row > :nth-child(8) { grid-area: actions; justify-content: flex-end; }
  .qp-name { white-space: normal; }        /* el nombre puede ocupar 2 líneas en la tarjeta */

  /* En móvil no hay espacio cómodo para editar la cotización completa. */
  .qp-edit-btn { display: none; }

  /* Modal previsualización full screen en mobile */
  #quote-preview-modal { padding: 0; align-items: flex-end; }
  .qpm-shell { border-radius: 16px 16px 0 0; max-width: 100%; margin: 0; }
  .qpm-body  { padding: 16px; }
  .qpm-body .doc { padding: 20px 16px; }

  /* Topbar botones: sólo iconos */
  .btn-top .btn-label { display: none; }

  /* Filtros cotizaciones: stack */
  #page-quotes > div:first-child > div:last-child { flex-direction: column; align-items: stretch; }
  #qp-search { width: 100% !important; }
}

/* ── Pantalla muy pequeña (≤480px) ── */
@media (max-width: 480px) {
  .topbar-title { font-size: 13px; }
  .btn-top { padding: 6px 9px; font-size: 11px; }
  .doc { padding: 18px 14px; }
  .doc-head { flex-direction: column; gap: 10px; }
  .doc-title { max-width: 100%; text-align: left; font-size: 13px; }
  .doc-meta  { flex-direction: column; gap: 10px; }
  .doc-meta .right { text-align: left; }
  .doc-meta .right .lbl-val { justify-content: flex-start; }
  .totals { width: 100%; }
  table.items thead th:nth-child(4) { display: none; }
  table.items tbody td:nth-child(4) { display: none; }

  /* Se mantiene la tarjeta; solo compactamos padding y botones */
  .qp-row { padding: 11px 12px; }
  .qp-btn { width: 28px; height: 28px; font-size: 13px; }
}

/* ══════════════════════════════════════════════════════
   RESPONSIVE — MEJORAS COMPLETAS (tablet / móvil)
   Bloque consolidado: cubre contactos, formularios web,
   modales, submenús y refinamientos de tipografía.
══════════════════════════════════════════════════════ */

/* ── TABLET (≤1024px) ── */
@media (max-width: 1024px) {
  /* Pestañas de ejecutivo con scroll horizontal sin romper layout */
  .ct-main-tabs {
    overflow-x: auto;
    flex-wrap: nowrap;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    gap: 4px;
    padding-bottom: 2px;
  }
  .ct-main-tabs::-webkit-scrollbar { height: 4px; }
  .ct-main-tab { flex-shrink: 0; white-space: nowrap; }

  /* Filtros que envuelven en vez de desbordar */
  .ct-filters-row { flex-wrap: wrap; gap: 8px; }
  .ct-select, .ct-search-wrap { flex: 1 1 auto; min-width: 140px; }
}

/* ── MÓVIL (≤768px) ── */
@media (max-width: 768px) {
  /* Tipografía base un poco más compacta para que no se sobreponga */
  .topbar-title { font-size: 13px; overflow: hidden; text-overflow: ellipsis; max-width: 60vw; }

  /* Pestañas de ejecutivo: scroll horizontal táctil */
  .ct-main-tabs {
    overflow-x: auto; flex-wrap: nowrap; gap: 4px;
    margin: 0 -4px 10px; padding: 0 4px 4px;
  }
  .ct-main-tab { flex-shrink: 0; font-size: 12px; padding: 7px 10px; }
  .ct-main-tab .ct-tc { font-size: 9px; }

  /* Barra de filtros y acciones: todo en columna, ancho completo */
  .ct-topbar { padding: 12px; }
  .ct-filters-row { flex-direction: column; align-items: stretch !important; gap: 8px; }
  .ct-filters-row > div { width: 100%; }
  .ct-filters-row > div[style*="flex-shrink"] { flex-wrap: wrap; }
  .ct-search-wrap { max-width: none !important; width: 100%; }
  .ct-select { width: 100%; min-width: 0; }
  /* Botones de acción (Nuevo, Importar, Asignar…) en grilla de 2 columnas */
  .ct-topbar .ct-row-btn { flex: 1 1 calc(50% - 4px); justify-content: center; }
  #ct-perpage-sel { flex: 1 1 100%; }

  /* Submenús de sidebar siempre visibles cuando el drawer está abierto */
  .sb-submenu.open { max-height: 400px; }

  /* Modales de asignar (Asignar / Asignar por email): full-width cómodo */
  #ct-assign-modal-bg > div,
  #ct-assign-email-modal-bg > div {
    width: 94vw !important;
    max-height: 88vh !important;
    padding: 20px 18px 18px !important;
  }
  #ct-assign-preview table,
  #ct-assign-email-preview table { font-size: 11px; }

  /* Modal de importación a pantalla casi completa */
  #ct-import-modal .ct-import-shell,
  #ct-import-modal > div { max-width: 96vw; }
  .ct-map-table { font-size: 12px; }
  .ct-map-table select { max-width: 130px; }

  /* Formularios Web: pestañas con scroll y tabla compacta */
  .ew-tabs, [id^="ew-"][class*="tabs"] { overflow-x: auto; flex-wrap: nowrap; }
  .ew-search-wrap { max-width: none; width: 100%; }

  /* Cards de inicio: una columna */
  .home-cards, .home-stats { grid-template-columns: 1fr 1fr !important; }
  .home-greeting { font-size: 20px !important; }

  /* Modal genérico: márgenes seguros */
  .modal { max-width: 94vw; padding: 22px 18px; }

  /* Recibo / cotización: encabezado apilado para que no se sobreponga */
  .doc-head { flex-direction: column; gap: 10px; align-items: flex-start; }
  .doc-title { text-align: left; max-width: 100%; }
}

/* ── MÓVIL PEQUEÑO (≤480px) ── */
@media (max-width: 480px) {
  .home-cards, .home-stats { grid-template-columns: 1fr !important; }
  .home-greeting { font-size: 18px !important; }

  /* Botones de acción de contactos: una por fila para textos largos */
  .ct-topbar .ct-row-btn { flex: 1 1 100%; }

  /* Cuenta de contactos y paginación legibles */
  #ct-count { font-size: 11px; }
  .ct-name { font-size: 13px; }
  .ct-sub  { font-size: 10px; }

  /* Submenú: indentación menor para aprovechar ancho */
  .sb-submenu { padding-left: 8px; }
  .sb-sub-item { font-size: 12px; padding: 8px 8px; }

  /* Modales asignar: ocupar casi toda la pantalla, desde abajo */
  #ct-assign-modal-bg, #ct-assign-email-modal-bg { align-items: flex-end; }
  #ct-assign-modal-bg > div,
  #ct-assign-email-modal-bg > div {
    width: 100vw !important; max-width: 100vw !important;
    border-radius: 16px 16px 0 0 !important;
    max-height: 90vh !important;
  }
}

/* ── Mejoras táctiles generales (cualquier pantalla con dedo) ── */
@media (hover: none) and (pointer: coarse) {
  .ct-row-btn, .sb-item, .sb-sub-item, .ct-main-tab, .btn-top {
    min-height: 38px;  /* área táctil cómoda */
  }
  select, input, button { font-size: 16px; } /* evita zoom automático en iOS */
}


@media print {
  /* ─────────────────────────────────────────────────────────────────────────
     El PDF debe salir IDÉNTICO al preview. Antes no lo era por dos motivos:

       1) El navegador ELIMINA fondos y colores al imprimir si no se le dice lo
          contrario. Se perdían el encabezado de la tabla, el sombreado de los
          totales y el color del título.
          → `print-color-adjust: exact` lo obliga a conservarlos.

       2) Estas mismas reglas reescribían la geometría del documento:
          en pantalla `.doc` tiene max-width 920px y padding 44/52px; al
          imprimir se lo dejaba en `max-width:none` con padding 14/20px. El
          contenido se estiraba a toda la hoja: otra maqueta.
          → Ahora los márgenes los pone `@page` y el documento conserva sus
            proporciones.
     ───────────────────────────────────────────────────────────────────────── */

  /* Conservar TODOS los colores y fondos tal como se ven en pantalla. */
  *, *::before, *::after {
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
  }

  /* Márgenes de la hoja: equivalen al padding que el .doc tiene en pantalla. */
  @page { margin: 12mm; }

  body { background: #fff; }
  #sb-toggle, #sb-overlay { display: none !important; }

  /* ── Impresión desde el editor (sin modal) ── */
  body:not(.printing-modal) .sidebar,
  body:not(.printing-modal) .topbar,
  body:not(.printing-modal) .panel,
  body:not(.printing-modal) .login-bg { display: none !important; }
  body:not(.printing-modal) .app-shell    { display: block; }
  body:not(.printing-modal) .content-split{ display: block; }
  body:not(.printing-modal) .preview-wrap { padding: 0; height: auto; overflow: visible; }

  /* ── Impresión desde el modal (preview, lista y exportar) ── */
  body.printing-modal .sidebar,
  body.printing-modal .topbar,
  body.printing-modal .panel,
  body.printing-modal .login-bg,
  body.printing-modal .app-shell,
  body.printing-modal #app-root { display: none !important; }
  body.printing-modal #quote-preview-modal {
    position: static !important; background: none !important;
    padding: 0 !important; display: block !important; overflow: visible !important;
  }
  body.printing-modal .qpm-shell  { box-shadow: none; border-radius: 0; max-height: none; height: auto; }
  body.printing-modal .qpm-topbar { display: none !important; }
  body.printing-modal .qpm-body   { padding: 0 !important; background: #fff !important; overflow: visible !important; }

  /* ── EL DOCUMENTO: una sola regla para los dos caminos ──
     Conserva las proporciones del preview. Los márgenes de página los pone
     @page, así que el .doc va sin padding propio y a todo el ancho útil. */
  .doc,
  body.printing-modal .qpm-body .doc {
    background: #fff !important;
    color: #1d1d2b !important;
    width: 100% !important;
    max-width: none !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    box-shadow: none !important;
    border-radius: 0 !important;
  }

  /* Evitar cortes feos entre páginas. */
  .items thead { display: table-header-group; }
  .items tr    { page-break-inside: avoid; }
  .totals      { page-break-inside: avoid; }

  /* El pie (Generado por + Términos y Condiciones) puede ser largo. Con
     `page-break-inside: avoid`, si no cabía en lo que quedaba de la página se
     iba ENTERO a la siguiente, dejando un gran espacio en blanco. Lo dejamos
     FLUIR: llena la página actual y continúa en la siguiente solo si hace falta. */
  .doc-foot { page-break-inside: auto; }
  /* Mantener juntos solo los bloques pequeños e indivisibles del pie. */
  .doc-foot .gen,
  .doc-foot .legal-block-preview { page-break-inside: avoid; }
  /* Que un título no quede huérfano al final de una página (se pega al texto
     que le sigue). */
  .doc-foot h4 { page-break-after: avoid; break-after: avoid; }

  /* Controles de la interfaz que no deben salir en el papel. */
  .editable:hover, .editable:focus { background: none !important; box-shadow: none !important; }
  .line-del           { display: none !important; }
  /* El enlace de T&C es una URL https real: se mantiene visible para que el
     "Guardar como PDF" del navegador lo conserve como enlace clicable. Además
     mostramos la URL completa debajo, por si el visor de PDF no respeta la
     anotación del enlace. */
  .legal-download-btn { display: inline !important; }
  .legal-print-note   { display: block !important; margin-top: 2px; }
  .line-disc          { display: none !important; }
  .qty-stepper        { border: none; background: none; }
  .qty-btn            { display: none !important; }
  .qty-input          { width: auto; font-size: 12px; background: none; border: none; }

  /* Wizard v2 (deshabilitado, se mantiene por compatibilidad). */
  #page-create-v2 .v2-stepper,
  #page-create-v2 .v2-nav,
  #page-create-v2 #v2-s1,
  #page-create-v2 #v2-s2 { display: none !important; }
  #v2-doc-host .preview-wrap { padding: 0; height: auto !important; max-height: none !important; overflow: visible !important; }
}

/* ══════════════════════════════════════
   MÓDULO: ENTRADAS WEB (Flamingo)
   ══════════════════════════════════════ */
.ew-topbar {
  padding: 16px 24px 0;
  border-bottom: 1px solid var(--panel-border);
  background: var(--panel-bg);
  flex-shrink: 0;
}
.ew-topbar-row {
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px; flex-wrap: wrap; margin-bottom: 12px;
}
.ew-search-wrap { position: relative; flex: 1; min-width: 180px; max-width: 320px; }
.ew-search-icon {
  position: absolute; left: 11px; top: 50%; transform: translateY(-50%);
  font-size: 14px; color: var(--muted); pointer-events: none;
}
.ew-input-search {
  width: 100%; padding: 9px 12px 9px 34px;
  border: 1.5px solid var(--panel-border); border-radius: 10px;
  background: var(--bg); color: var(--ink); font-size: 13px; font-family: inherit;
  transition: border-color .15s;
}
.ew-input-search:focus { outline: none; border-color: var(--purple); }
.ew-table-wrap { flex: 1; overflow-y: auto; padding: 20px 28px 32px; }
.ew-table {
  background: var(--panel-bg); border: 1px solid var(--panel-border);
  border-radius: 12px; overflow: hidden;
}
.ew-row {
  display: grid;
  grid-template-columns: 1fr 200px 180px 130px 90px;
  column-gap: 14px; align-items: center;
  padding: 11px 20px;
  border-bottom: 1px solid var(--panel-border);
  font-size: 13px; cursor: pointer; transition: background .1s;
}
.ew-row:not(.ew-head):hover { background: var(--bg); }
.ew-row:last-child { border-bottom: none; }
.ew-head {
  font-size: 10px; font-weight: 700; text-transform: uppercase;
  letter-spacing: .6px; color: var(--muted); background: var(--bg);
  border-bottom: 2px solid var(--panel-border); cursor: default;
}
.ew-name  { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ew-cell  { font-size: 12px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ew-empty { text-align: center; padding: 48px 20px; color: var(--muted); }
.ew-empty-icon { font-size: 40px; margin-bottom: 10px; }
.ew-source-badge {
  display: inline-flex; align-items: center; font-size: 9.5px; font-weight: 700;
  padding: 2px 9px; border-radius: 20px; text-transform: uppercase; letter-spacing: .3px;
}
.ew-source-badge.home       { background: #eef1ff; color: #4055d4; }
.ew-source-badge.tickets    { background: #fff8e1; color: #9c6800; }
.ew-source-badge.eventos    { background: #e8f5e9; color: #2e7d32; }
.ew-source-badge.escolar    { background: #fce4ec; color: #880e4f; }
.ew-source-badge.cumpleanos { background: #f3e5f5; color: #6a1b9a; }
/* Drawer de detalle */
.ew-drawer-bg {
  display: none; position: fixed; inset: 0;
  background: rgba(20,24,33,.4); z-index: 1050;
  align-items: flex-end; justify-content: flex-end;
}
.ew-drawer-bg.show { display: flex; }
.ew-drawer {
  background: var(--panel-bg); height: 100%; width: 460px; max-width: 95vw;
  box-shadow: -8px 0 40px rgba(0,0,0,.18); overflow-y: auto;
  padding: 28px 24px; display: flex; flex-direction: column; gap: 14px;
}
.ew-drawer h3 { margin: 0; font-size: 16px; }
.ew-drawer-close {
  position: absolute; top: 20px; right: 20px;
  background: none; border: none; font-size: 20px;
  cursor: pointer; color: var(--muted);
}
.ew-field-label {
  font-size: 10px; font-weight: 700; text-transform: uppercase;
  letter-spacing: .5px; color: var(--muted); margin-bottom: 3px;
}
.ew-field-value {
  font-size: 13px; color: var(--ink); white-space: pre-wrap;
  background: var(--bg); border-radius: 8px; padding: 9px 12px;
}
.ew-field-value.empty { color: var(--muted); font-style: italic; }
.ew-prox {
  text-align: center; padding: 60px 20px;
  color: var(--muted); font-size: 14px;
}
.ew-prox-icon { font-size: 48px; margin-bottom: 16px; }
.ew-prox h3   { font-size: 18px; font-weight: 700; color: var(--ink); margin: 0 0 8px; }
.ew-prox p    { margin: 0; font-size: 13px; line-height: 1.6; }
@media (max-width: 900px) {
  .ew-row { grid-template-columns: 1fr 160px 90px; }
  .ew-row > :nth-child(3), .ew-row > :nth-child(4) { display: none; }
  .ew-head > :nth-child(3), .ew-head > :nth-child(4) { display: none; }
}
@media (max-width: 768px) {
  .ew-row { grid-template-columns: 1fr 80px; padding: 9px 12px; }
  .ew-row > :nth-child(2),.ew-row > :nth-child(3),.ew-row > :nth-child(4) { display: none; }
  .ew-table-wrap { padding: 12px; }
}

/* ── Modal crear/editar contacto ── */
.ctc-modal-bg {
  display: none; position: fixed; inset: 0;
  background: rgba(20,24,33,.48); z-index: 1100;
  align-items: center; justify-content: center; padding: 16px;
}
.ctc-modal-bg.show { display: flex; }
.ctc-modal {
  background: var(--panel-bg); border-radius: 16px;
  width: 100%; max-width: 520px; max-height: 90vh;
  overflow-y: auto; box-shadow: 0 24px 60px rgba(0,0,0,.25);
  padding: 28px 28px 24px;
}
.ctc-modal h3   { margin: 0 0 20px; font-size: 16px; font-weight: 700; }
.ctc-field      { margin-bottom: 14px; }
.ctc-label      { font-size: 11px; font-weight: 700; text-transform: uppercase;
                   letter-spacing: .4px; color: var(--muted); margin-bottom: 5px; }
.ctc-label span { color: var(--coral); margin-left: 2px; }
.ctc-input {
  width: 100%; padding: 9px 12px;
  border: 1.5px solid var(--panel-border); border-radius: 9px;
  background: var(--bg); color: var(--ink); font-size: 13px;
  font-family: inherit; transition: border-color .15s; box-sizing: border-box;
}
.ctc-input:focus { outline: none; border-color: var(--purple); }
.ctc-input.error { border-color: var(--coral); }
.ctc-row2       { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.ctc-btns       { display: flex; justify-content: flex-end; gap: 8px; margin-top: 20px; }
.ctc-err        { font-size: 12px; color: var(--coral); margin-top: 8px; display: none; }

/* ── Autocomplete contactos en cotizador ── */
.ac-wrap { position: relative; }
.ac-dropdown {
  display: none; position: absolute; top: calc(100% + 4px); left: 0; right: 0;
  background: var(--panel-bg); border: 1.5px solid var(--purple);
  border-radius: 10px; box-shadow: 0 8px 24px rgba(0,0,0,.15);
  z-index: 500; max-height: 260px; overflow-y: auto;
}
.ac-dropdown.show { display: block; }
.ac-item {
  padding: 10px 14px; cursor: pointer; border-bottom: 1px solid var(--panel-border);
  transition: background .1s;
}
.ac-item:last-child { border-bottom: none; }
.ac-item:hover, .ac-item.selected { background: rgba(130,52,207,.08); }
.ac-item-name  { font-weight: 600; font-size: 13px; color: var(--ink); }
.ac-item-sub   { font-size: 11px; color: var(--muted); margin-top: 2px; }
.ac-item-new   {
  padding: 10px 14px; cursor: pointer; color: var(--purple);
  font-size: 13px; font-weight: 600; display: flex; align-items: center; gap: 6px;
}
.ac-item-new:hover { background: rgba(130,52,207,.06); }
.ac-no-empresa {
  background: #fff8e1; border: 1px solid #ffe082; border-radius: 8px;
  padding: 9px 12px; font-size: 12px; color: #7a5f00; margin-top: 6px;
  display: none; line-height: 1.5;
}
.ac-no-empresa a { color: var(--purple); font-weight: 600; text-decoration: none; cursor: pointer; }

/* ══ Sección Productos ══ */
.pr-topbar {
  padding: 16px 24px 12px; border-bottom: 1px solid var(--panel-border);
  background: var(--panel-bg); flex-shrink: 0;
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  justify-content: space-between;
}
.pr-filters { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; flex: 1; }
.pr-search-wrap { position: relative; min-width: 200px; max-width: 300px; flex: 1; }
.pr-search-icon { position: absolute; left: 11px; top: 50%; transform: translateY(-50%); font-size: 13px; color: var(--muted); pointer-events: none; }
.pr-input-search {
  width: 100%; padding: 8px 12px 8px 32px;
  border: 1.5px solid var(--panel-border); border-radius: 10px;
  background: var(--bg); color: var(--ink); font-size: 13px; font-family: inherit;
}
.pr-input-search:focus { outline: none; border-color: var(--purple); }
.pr-table-wrap { flex: 1; overflow-y: auto; padding: 20px 28px 32px; }
.pr-table {
  background: var(--panel-bg); border: 1px solid var(--panel-border);
  border-radius: 12px; overflow: hidden; width: 100%;
}
.pr-row {
  display: grid;
  grid-template-columns: 1fr 180px 120px 80px 100px;
  column-gap: 14px; align-items: center;
  padding: 11px 20px; border-bottom: 1px solid var(--panel-border);
  font-size: 13px;
}
.pr-row:last-child { border-bottom: none; }
.pr-row:not(.pr-head):hover { background: var(--bg); }
.pr-head {
  font-size: 10px; font-weight: 700; text-transform: uppercase;
  letter-spacing: .6px; color: var(--muted); background: var(--bg);
  border-bottom: 2px solid var(--panel-border);
}
.pr-name  { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pr-descr { font-size: 11px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-top: 2px; }
.pr-cell  { font-size: 12.5px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pr-price { font-size: 13px; font-weight: 700; color: var(--ink); }
.pr-cat-badge {
  display: inline-flex; font-size: 10px; font-weight: 700; padding: 2px 9px;
  border-radius: 20px; background: rgba(130,52,207,.1); color: var(--purple);
  white-space: nowrap; max-width: 160px; overflow: hidden; text-overflow: ellipsis;
}
.pr-empty { text-align: center; padding: 48px 20px; color: var(--muted); }
.pr-empty-icon { font-size: 40px; margin-bottom: 10px; }
@media (max-width: 900px) {
  .pr-row { grid-template-columns: 1fr 100px 80px; }
  .pr-row > :nth-child(2), .pr-row > :nth-child(5) { display: none; }
  .pr-head > :nth-child(2), .pr-head > :nth-child(5) { display: none; }
  .pr-table-wrap { padding: 12px; }
}

.sb-badge {
  background: var(--coral); color: #fff; font-size: 10px; font-weight: 800;
  min-width: 17px; height: 17px; border-radius: 20px; display: inline-flex;
  align-items: center; justify-content: center; padding: 0 4px; margin-left: auto;
}
.sb-badge.badge-new { animation: badge-pulse 1.5s ease-in-out infinite; box-shadow: 0 0 0 0 rgba(255,90,90,.6); }
@keyframes badge-pulse {
  0%   { box-shadow: 0 0 0 0 rgba(255,90,90,.5); }
  70%  { box-shadow: 0 0 0 6px rgba(255,90,90,0); }
  100% { box-shadow: 0 0 0 0 rgba(255,90,90,0); }
}

/* ── Modal duplicados ── */
.dupes-modal-bg {
  display:none; position:fixed; inset:0;
  background:rgba(20,24,33,.48); z-index:1200;
  align-items:center; justify-content:center; padding:16px;
}
.dupes-modal-bg.show { display:flex; }
.dupes-modal {
  background:var(--panel-bg); border-radius:16px;
  width:100%; max-width:680px; max-height:85vh;
  display:flex; flex-direction:column;
  box-shadow:0 24px 60px rgba(0,0,0,.25);
}
.dupes-modal-head {
  padding:20px 24px 16px; border-bottom:1px solid var(--panel-border);
  display:flex; align-items:center; justify-content:space-between; flex-shrink:0;
}
.dupes-modal-head h3 { margin:0; font-size:15px; }
.dupes-modal-body { overflow-y:auto; padding:16px 24px; flex:1; }
.dupes-group {
  border:1px solid var(--panel-border); border-radius:10px;
  margin-bottom:14px; overflow:hidden;
}
.dupes-group-head {
  background:var(--bg); padding:10px 14px;
  font-size:12px; font-weight:700; color:var(--muted);
  border-bottom:1px solid var(--panel-border);
  display:flex; align-items:center; justify-content:space-between;
}
.dupes-row {
  display:flex; align-items:center; gap:12px;
  padding:11px 14px; border-bottom:1px solid var(--panel-border);
  font-size:13px; cursor:pointer; transition:background .1s;
}
.dupes-row:last-child { border-bottom:none; }
.dupes-row:hover { background:rgba(130,52,207,.04); }
.dupes-row.selected { background:rgba(130,52,207,.08); }
.dupes-radio {
  width:18px; height:18px; border-radius:50%; border:2px solid var(--panel-border);
  flex-shrink:0; display:flex; align-items:center; justify-content:center;
  transition:all .15s;
}
.dupes-row.selected .dupes-radio { border-color:var(--purple); background:var(--purple); }
.dupes-row.selected .dupes-radio::after { content:''; width:7px; height:7px; border-radius:50%; background:#fff; }
.dupes-row input[type=radio] { display:none; }
.dupes-row-info { flex:1; min-width:0; }
.dupes-row-name { font-weight:600; color:var(--ink); font-size:13px; }
.dupes-row-sub  { font-size:11px; color:var(--muted); margin-top:2px; }
.dupes-row-badge { font-size:10px; font-weight:700; padding:2px 8px; border-radius:20px; background:rgba(130,52,207,.1); color:var(--purple); white-space:nowrap; }
.dupes-footer   { padding:14px 24px; border-top:1px solid var(--panel-border); display:flex; gap:8px; justify-content:space-between; align-items:center; flex-shrink:0; }
.dupes-footer-left { font-size:12px; color:var(--muted); }

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

.sub-status-badge {
  display:inline-flex; align-items:center; font-size:10px; font-weight:700;
  padding:2px 8px; border-radius:20px; white-space:nowrap;
}

/* ══ Página de Inicio ══ */
.home-card {
  background: var(--panel-bg);
  border: 0.5px solid var(--panel-border);
  border-radius: 14px;
  padding: 20px;
  cursor: pointer;
  transition: border-color .15s, transform .15s;
}
.home-card:hover {
  border-color: var(--purple);
  transform: translateY(-2px);
}
.home-card-icon-wrap {
  width: 40px; height: 40px;
  border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  font-size: 20px;
  margin-bottom: 12px;
}
.home-card-title { font-weight: 700; font-size: 13px; color: var(--ink); margin-bottom: 3px; }
.home-card-sub   { font-size: 12px; color: var(--muted); }

.home-stat {
  background: var(--panel-bg);
  border: 0.5px solid var(--panel-border);
  border-radius: 12px;
  padding: 18px 20px;
  cursor: pointer;
  transition: border-color .15s;
}
.home-stat:hover { border-color: var(--purple); }
.home-stat-num   { font-size: 30px; font-weight: 800; color: var(--purple); line-height: 1; margin-bottom: 6px; }
.home-stat-label { font-size: 12px; color: var(--ink); font-weight: 700; }
.home-stat-sub   { font-size: 11px; color: var(--muted); margin-top: 2px; }
/* ── Opciones del modal de herramientas de contactos ── */
.ct-tool-opt {
  display: flex; align-items: center; gap: 14px;
  width: 100%; text-align: left;
  padding: 14px 16px; border-radius: 12px;
  border: 1px solid var(--panel-border); background: var(--card);
  cursor: pointer; transition: border-color .15s, background .15s, transform .08s;
  font-family: inherit;
}
.ct-tool-opt:hover { border-color: var(--purple); background: var(--bg); }
.ct-tool-opt:active { transform: scale(.99); }
.ct-tool-ico {
  flex-shrink: 0; width: 42px; height: 42px; border-radius: 10px;
  display: flex; align-items: center; justify-content: center; font-size: 20px;
}
.ct-tool-txt { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; }
.ct-tool-txt b { font-size: 14px; color: var(--ink); }
.ct-tool-txt small { font-size: 11.5px; color: var(--muted); line-height: 1.35; }
.ct-tool-arrow { flex-shrink: 0; font-size: 22px; color: var(--muted); }

/* ── Separador entre categorías principales y subdivisión por ejecutivo ── */
.ct-tabs-divider {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 0 10px; flex-shrink: 0; align-self: center;
}
.ct-tabs-divider-line {
  width: 1px; height: 22px; background: var(--panel-border);
}
.ct-tabs-divider-label {
  font-size: 9px; font-weight: 700; color: var(--muted);
  text-transform: uppercase; letter-spacing: .3px; white-space: nowrap;
}
/* Pestañas de ejecutivo: tono más sutil para indicar que son subdivisión */
.ct-main-tab[data-ctexec="bparra@cinepolis.com"],
.ct-main-tab[data-ctexec="corellana@cinepolis.com"],
.ct-main-tab[data-ctexec="caraya@cinepolis.com"],
.ct-main-tab[data-ctexec="pbendeck@cinepolis.com"] {
  background: transparent;
  border-style: dashed;
}
.ct-main-tab[data-ctexec="bparra@cinepolis.com"].active,
.ct-main-tab[data-ctexec="corellana@cinepolis.com"].active,
.ct-main-tab[data-ctexec="caraya@cinepolis.com"].active,
.ct-main-tab[data-ctexec="pbendeck@cinepolis.com"].active {
  border-style: solid;
}
/* ── Pestaña Cotizaciones de Legado: barra de filtros + paginación ─────────── */
.lg-toolbar{
  display:flex; flex-wrap:wrap; gap:14px 18px; align-items:flex-end;
  padding:14px 16px; background:var(--panel-bg);
  border-bottom:1px solid var(--line);
  position:sticky; top:0; z-index:5;
}
.lg-pills{ display:flex; gap:6px; flex-wrap:wrap; }
.lg-pill{
  display:inline-flex; align-items:center; gap:7px;
  padding:7px 14px; font-size:13px; font-weight:600;
  color:var(--ink); background:var(--bg);
  border:1px solid var(--panel-border); border-radius:999px;
  cursor:pointer; transition:all .15s ease; white-space:nowrap;
}
.lg-pill:hover{ border-color:var(--purple); color:var(--purple); }
.lg-pill.active{ background:var(--purple); color:#fff; border-color:var(--purple); }
.lg-pill-n{
  font-size:11px; font-weight:700; line-height:1;
  padding:2px 7px; border-radius:999px;
  background:rgba(130,52,207,.12); color:var(--purple);
}
.lg-pill.active .lg-pill-n{ background:rgba(255,255,255,.25); color:#fff; }

.lg-filters{ display:flex; flex-wrap:wrap; gap:10px; align-items:flex-end; margin-left:auto; }
.lg-field{ display:flex; flex-direction:column; gap:4px; }
.lg-field-size{ min-width:90px; }
.lg-cap{
  font-size:10.5px; font-weight:700; text-transform:uppercase;
  letter-spacing:.4px; color:var(--muted);
}
.lg-input{
  padding:8px 11px; font-size:13px; color:var(--ink);
  background:var(--bg); border:1px solid var(--panel-border);
  border-radius:9px; outline:none; min-height:36px;
}
.lg-input:focus{ border-color:var(--purple); box-shadow:0 0 0 3px rgba(130,52,207,.12); }
.lg-clear{
  align-self:flex-end; padding:8px 12px; font-size:12.5px; font-weight:600;
  color:#c0392b; background:#fde8e8; border:1px solid #f5c6c6;
  border-radius:9px; cursor:pointer; min-height:36px;
}
.lg-clear:hover{ background:#fbd5d5; }

.lg-pager{
  display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px;
  padding:14px 16px; border-top:1px solid var(--line); background:var(--panel-bg);
}
.lg-pager-info{ font-size:12.5px; color:var(--muted); font-weight:500; }
.lg-pager-btns{ display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
.lg-pager-cur{ font-size:12.5px; color:var(--ink); font-weight:600; padding:0 6px; }
.lg-page-btn{
  padding:7px 12px; font-size:12.5px; font-weight:600;
  color:var(--ink); background:var(--bg);
  border:1px solid var(--panel-border); border-radius:8px; cursor:pointer;
  transition:all .15s ease;
}
.lg-page-btn:hover:not(:disabled){ border-color:var(--purple); color:var(--purple); }
.lg-page-btn:disabled{ opacity:.4; cursor:not-allowed; }

@media (max-width:768px){
  .lg-toolbar{ gap:10px 12px; }
  .lg-filters{ margin-left:0; width:100%; }
  .lg-field{ flex:1 1 calc(50% - 5px); }
  .lg-field-size{ flex:1 1 100%; }
}

/* ══════════════════════════════════════════════════════════════════════════════
   CREAR COTIZACIÓN v2 — Wizard
   ══════════════════════════════════════════════════════════════════════════════ */
.v2-stepper {
  display:flex; align-items:center; gap:0; justify-content:center;
  margin-bottom:28px; padding:16px 0;
}
.v2-step {
  display:inline-flex; align-items:center; gap:8px;
  padding:10px 18px; border-radius:999px; border:none; cursor:pointer;
  font-family:inherit; font-size:13px; font-weight:600;
  background:var(--bg); color:var(--muted);
  transition:all .2s ease;
}
.v2-step:hover { color:var(--ink); }
.v2-step.active { background:var(--purple); color:#fff; }
.v2-step.done { background:rgba(130,52,207,.12); color:var(--purple); }
.v2-step-n {
  display:inline-flex; align-items:center; justify-content:center;
  width:24px; height:24px; border-radius:50%;
  font-size:12px; font-weight:800;
  background:rgba(130,52,207,.1); color:var(--purple);
}
.v2-step.active .v2-step-n { background:rgba(255,255,255,.25); color:#fff; }
.v2-step.done .v2-step-n { background:var(--purple); color:#fff; }
.v2-step-line { width:40px; height:2px; background:var(--panel-border); flex-shrink:0; }

.v2-panel { max-width:780px; margin:0 auto; }
.v2-section {
  background:var(--panel-bg); border:1px solid var(--panel-border);
  border-radius:14px; padding:22px 24px; margin-bottom:18px;
}
.v2-section-title { font-size:16px; font-weight:700; margin-bottom:4px; }
.v2-section-sub { font-size:12.5px; color:var(--muted); margin-bottom:14px; }
.v2-input {
  display:block; width:100%; padding:11px 14px; font-size:13.5px;
  border:1px solid var(--panel-border); border-radius:10px;
  background:var(--bg); color:var(--ink); font-family:inherit;
  outline:none; box-sizing:border-box;
}
.v2-input:focus { border-color:var(--purple); box-shadow:0 0 0 3px rgba(130,52,207,.1); }
.v2-field { margin-bottom:12px; }
.v2-field label { display:block; font-size:11px; font-weight:700; color:var(--muted);
  text-transform:uppercase; letter-spacing:.4px; margin-bottom:5px; }
.v2-row { display:flex; gap:14px; }
.v2-row > * { flex:1; }

.v2-link-btn {
  border:none; background:none; color:var(--purple); font-size:12.5px;
  font-weight:600; cursor:pointer; font-family:inherit; padding:6px 0;
}
.v2-link-btn:hover { text-decoration:underline; }

/* Results */
.v2-results { max-height:220px; overflow-y:auto; }
.v2-result-card {
  padding:10px 14px; cursor:pointer; border-radius:10px;
  border:1px solid transparent; transition:all .15s;
}
.v2-result-card:hover { background:rgba(130,52,207,.05); border-color:var(--purple); }
.v2-rc-name { font-weight:600; font-size:13.5px; }
.v2-rc-sub { font-size:11.5px; color:var(--muted); }
.v2-no-result { padding:14px; color:var(--muted); font-size:13px; text-align:center; }

.v2-selected-card {
  display:flex; align-items:center; gap:12px;
  padding:14px 16px; background:rgba(130,52,207,.06);
  border:1.5px solid var(--purple); border-radius:12px; margin-top:10px;
}

/* Product grid */
.v2-prod-grid {
  display:grid; grid-template-columns:repeat(auto-fill, minmax(200px, 1fr));
  gap:10px; padding:4px 0;
}
.v2-prod-card {
  padding:14px 16px; background:var(--bg); border:1px solid var(--panel-border);
  border-radius:12px; display:flex; flex-direction:column; gap:4px;
  transition:border-color .15s;
}
.v2-prod-card.in-cart { border-color:var(--purple); background:rgba(130,52,207,.04); }
.v2-pc-name { font-weight:600; font-size:13px; }
.v2-pc-desc { font-size:11px; color:var(--muted); overflow:hidden; text-overflow:ellipsis;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.v2-pc-price { font-size:13px; font-weight:700; color:var(--purple); }
.v2-pc-cat { font-size:10px; color:var(--muted); text-transform:uppercase; letter-spacing:.3px; }
.v2-pc-add {
  margin-top:auto; padding:7px 0; border:1.5px solid var(--purple); border-radius:8px;
  background:none; color:var(--purple); font-size:12px; font-weight:700;
  cursor:pointer; font-family:inherit; transition:all .15s;
}
.v2-pc-add:hover { background:var(--purple); color:#fff; }
.v2-prod-card.in-cart .v2-pc-add { background:var(--purple); color:#fff; }

/* Cart */
.v2-cart-row {
  display:flex; align-items:center; gap:12px;
  padding:10px 0; border-bottom:1px solid var(--panel-border);
}
.v2-cart-row:last-child { border-bottom:none; }
.v2-qty-ctrl { display:flex; align-items:center; gap:0; }
.v2-qty-btn {
  width:30px; height:30px; border:1px solid var(--panel-border); background:var(--bg);
  font-size:16px; font-weight:700; cursor:pointer; color:var(--ink);
  display:flex; align-items:center; justify-content:center;
}
.v2-qty-btn:first-child { border-radius:8px 0 0 8px; }
.v2-qty-btn:last-child  { border-radius:0 8px 8px 0; }
.v2-qty-btn:hover { background:var(--purple); color:#fff; border-color:var(--purple); }
.v2-qty-val {
  width:36px; height:30px; display:flex; align-items:center; justify-content:center;
  border-top:1px solid var(--panel-border); border-bottom:1px solid var(--panel-border);
  font-size:13px; font-weight:700;
}

/* Navigation */
.v2-nav {
  display:flex; justify-content:flex-end; gap:10px; padding:16px 0;
}
.v2-btn-next, .v2-btn-back, .v2-btn-action {
  padding:12px 24px; border-radius:10px; font-size:13.5px; font-weight:700;
  border:none; cursor:pointer; font-family:inherit; transition:all .15s;
}
.v2-btn-next { background:var(--purple); color:#fff; }
.v2-btn-next:hover { filter:brightness(1.1); }
.v2-btn-back { background:var(--bg); color:var(--ink); border:1px solid var(--panel-border); }
.v2-btn-back:hover { border-color:var(--purple); color:var(--purple); }
.v2-btn-action { background:var(--purple); color:#fff; }
.v2-btn-action:hover { filter:brightness(1.1); }
.v2-btn-preview { background:#0d9488; }

/* Summary */
.v2-sum-section { margin-bottom:16px; }
.v2-sum-label { font-size:10.5px; font-weight:700; color:var(--muted);
  text-transform:uppercase; letter-spacing:.4px; margin-bottom:4px; }
.v2-sum-val { font-size:14px; font-weight:500; }
.v2-sum-table { width:100%; border-collapse:collapse; font-size:12.5px; margin-top:8px; }
.v2-sum-table th { text-align:left; padding:7px 10px; font-size:10px; font-weight:700;
  color:var(--muted); text-transform:uppercase; border-bottom:2px solid var(--panel-border); }
.v2-sum-table td { padding:8px 10px; border-bottom:1px solid var(--panel-border); }
.v2-sum-totals { border-top:2px solid var(--panel-border); padding-top:12px; margin-top:16px; }
.v2-sum-row { display:flex; justify-content:space-between; padding:4px 0; font-size:13px; }
.v2-sum-total { font-size:16px; font-weight:800; color:var(--purple); padding-top:8px;
  border-top:1px solid var(--panel-border); margin-top:6px; }

@media (max-width:960px){
  #v2-split { grid-template-columns:1fr !important; }
}
@media (max-width:640px){
  .v2-stepper { flex-wrap:wrap; gap:6px; }
  .v2-step { padding:8px 12px; font-size:12px; }
  .v2-step-line { width:20px; }
  .v2-row { flex-direction:column; gap:0; }
  .v2-prod-grid { grid-template-columns:1fr 1fr; }
  .v2-section { padding:16px; }
  .v2-nav { flex-wrap:wrap; }
  #v2-split { grid-template-columns:1fr !important; }
}
@media (max-width:420px){
  .v2-prod-grid { grid-template-columns:1fr; }
}

/* ── V2 Fase 3: doc es solo preview (sin controles de edición) ── */
#v2-doc-host .line-disc { display:none !important; }
#v2-doc-host .line-del { display:none !important; }
#v2-doc-host .qty-btn { display:none !important; }
#v2-doc-host .qty-input { border:none; background:none; text-align:center; pointer-events:none; width:32px; padding:0; font-weight:700; }
#v2-doc-host .qty-stepper { justify-content:center; }
#v2-doc-host .editable { cursor:default !important; }
#v2-doc-host .editable:hover { background:none !important; }
#v2-doc-host .editable:focus { background:none !important; box-shadow:none !important; }
#v2-doc-host [contenteditable] { pointer-events:none; }
/* ── Editor de texto enriquecido (observaciones / términos) ── */
.rte-toolbar { display:flex; gap:2px; padding:5px 6px; background:#f6f7fb; border-bottom:1px solid #e2e6ee; flex-wrap:wrap; }
.rte-btn { min-width:30px; height:28px; padding:0 8px; border:1px solid #dfe3ea; background:#fff; border-radius:6px; font-size:13px; cursor:pointer; color:#334; font-family:inherit; line-height:1; display:inline-flex; align-items:center; justify-content:center; transition:background .12s; }
.rte-btn:hover { background:#eef1ff; border-color:#4781ff; }
.rte-btn:active { background:#dde4ff; }
.rte-btn.active { background:#4781ff; color:#fff; border-color:#4781ff; }
.rte-editor { display:block !important; box-sizing:border-box; width:100%; min-height:80px; height:auto; max-height:260px; overflow-y:auto; padding:10px 12px; font-size:13px; line-height:1.55; color:#1f2430; outline:none; font-family:inherit; background:#fff; }
.rte-editor:focus { background:#fff; }
.rte-editor:empty:before { content:attr(data-placeholder); color:#9aa1ad; pointer-events:none; display:inline-block; }
.rte-wrap { border:1px solid #dfe3ea; border-radius:9px; overflow:visible; background:#fff; }
.rte-wrap[data-disabled="true"] .rte-editor { background:#f6f7fb; }
.rte-editor ul { margin:4px 0; padding-left:22px; }
.rte-editor li { margin:2px 0; }
.rte-editor b, .rte-editor strong { font-weight:700; }

/* Spinner del botón de login */
.btn-spinner {
  display:inline-block; width:14px; height:14px; vertical-align:-2px;
  border:2px solid rgba(255,255,255,.4); border-top-color:#fff;
  border-radius:50%; animation:btnspin .6s linear infinite; margin-right:4px;
}
@keyframes btnspin { to { transform:rotate(360deg); } }

/* ── Empresas (reutiliza las clases ct-* de Contactos, solo cambia la grilla) ── */
.co-row {
  display: grid;
  grid-template-columns: minmax(200px,1fr) 130px minmax(120px,1fr) 140px auto;
  column-gap: 10px;
  align-items: center;
  padding: 11px 18px;
  border-bottom: 1px solid var(--panel-border);
}
.co-row > * { min-width: 0; }
.co-row:not(.ct-head):hover { background: var(--bg); }
.co-row:last-child { border-bottom: none; }
.co-norut {
  display: inline-block; font-size: 10px; font-weight: 700; padding: 2px 7px;
  border-radius: 20px; background: rgba(239,68,68,.12); color: #dc2626;
}
@media (max-width: 900px) {
  .co-row { grid-template-columns: minmax(140px,1fr) 110px auto; }
  .co-row > :nth-child(3), .co-row > :nth-child(4) { display: none; }
}

/* ── Selector Persona / Empresa en la cotización ────────────────────────────── */
.ct-type-switch { display:flex; gap:6px; }
.ct-type-btn {
  flex:1; padding:9px 12px; font-size:12.5px; font-weight:600; font-family:inherit;
  border:1.5px solid var(--panel-border); border-radius:9px;
  background:transparent; color:var(--muted); cursor:pointer; transition:all .12s;
}
.ct-type-btn:hover { border-color:var(--purple); color:var(--purple); }
.ct-type-btn.active {
  background:var(--purple); border-color:var(--purple); color:#fff;
}