* { box-sizing: border-box; margin: 0; padding: 0; }
  body { background: #0a0a0a; color: #fff; font-family: system-ui, sans-serif; min-height: 100vh; padding: 24px 16px; }
  .container { max-width: 680px; margin: auto; }
  .header { text-align: center; margin-bottom: 28px; }
  .logo { display: flex; align-items: center; justify-content: center; gap: 14px; margin-bottom: 8px; }
  .logo-icon { width: 54px; height: 54px; border-radius: 10px; }
  .logo-text h1 { color: #ff6600; font-size: 1.6rem; font-weight: 900; letter-spacing: 0.04em; text-align: left; }
  .logo-text p { color: #888; font-size: 0.78rem; text-align: left; margin-top: 2px; }
  .header .line { width: 60px; height: 3px; background: #ff6600; margin: 10px auto 0; border-radius: 2px; }
  .card { background: #1a1a1a; border: 1px solid #2a2a2a; border-radius: 14px; padding: 20px; margin-bottom: 16px; }
  .card-title { display: flex; align-items: center; gap: 8px; margin-bottom: 16px; }
  .card-title h2 { color: #ff6600; font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.08em; font-weight: 700; }
  .grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
  .grid3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 12px; }
  label { display: block; font-size: 0.75rem; margin-bottom: 5px; font-weight: 500; color: #aaa; }
  input, select { width: 100%; background: #0f0f0f; color: #fff; border: 1px solid #333; border-radius: 8px; padding: 10px 12px; font-size: 0.95rem; outline: none; transition: border 0.2s, box-shadow 0.2s; }
  input { text-align: right; }
  input[type="text"] { text-align: left; }
  input:focus, select:focus { border-color: #ff6600; box-shadow: 0 0 0 3px rgba(255,102,0,0.15); }
  #convSelectPrecio:focus, #convSelectTasa:focus { border-color: inherit; box-shadow: none; outline: none; }
  .display-box { border: 1px solid #333; border-radius: 8px; padding: 10px 12px; text-align: right; font-family: monospace; font-size: 0.95rem; font-weight: 700; }
  .diferencial { background: #0f0f0f; border: 1px solid #ff6600; border-radius: 10px; padding: 12px 20px; display: flex; justify-content: space-between; align-items: center; margin-top: 14px; }
  .diferencial .dif-label { color: #aaa; font-size: 0.85rem; }
  .diferencial .dif-val { color: #ff6600; font-size: 1.5rem; font-weight: 800; font-family: monospace; }
  .mini-cards { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 10px; margin-top: 14px; }
  .mini-card { border-radius: 10px; padding: 12px 10px; text-align: center; border: 1px solid #444; background: #141414; }
  .mini-card .mc-label { font-size: 0.72rem; margin-bottom: 6px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; color: #aaa; }
  .mini-card .mc-val { font-family: monospace; font-weight: 800; font-size: 1.05rem; color: #ccc; }
  .venta-cards { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 10px; margin-top: 14px; }
  .venta-card { border-radius: 12px; padding: 14px 10px; text-align: center; border: 1px solid #444; background: #141414; }
  .venta-card.vc-local { border-color: #8b0033; background: #1a0010; }
  .venta-card.vc-local .vc-label { color: #cc0044; }
  .venta-card.vc-local .vc-precio { color: #ff4477; }
  .venta-card.vc-ext   { border-color: #006633; background: #001a0f; }
  .venta-card.vc-ext   .vc-label { color: #00aa44; }
  .venta-card.vc-ext   .vc-precio { color: #00dd55; }
  .venta-card.vc-prom  { border-color: #0088cc; background: #001a2a; }
  .venta-card.vc-prom  .vc-label { color: #00aaff; }
  .venta-card.vc-prom  .vc-precio { color: #33ccff; }
  .venta-card .vc-label { font-size: 0.7rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; margin-bottom: 6px; color: #aaa; }
  .venta-card .vc-precio { font-family: monospace; font-weight: 800; font-size: 1.2rem; margin-bottom: 4px; color: #ccc; }
  .venta-card .vc-gan { font-size: 0.7rem; margin-bottom: 3px; color: #666; }
  .venta-card .vc-iva { font-size: 0.72rem; font-weight: 700; margin-top: 5px; padding-top: 5px; border-top: 1px solid rgba(255,255,255,0.1); display: none; color: #aaa; }
  .conv-btn { background:#1a1a1a;border:1px solid #333;color:#aaa;border-radius:10px;padding:10px 6px;font-size:0.75rem;font-weight:700;cursor:pointer;text-align:center;transition:all 0.2s;line-height:1.6; }
  .conv-btn:hover { border-color:#ff6600;color:#ff6600; }
  .conv-btn-active { background:#ff6600 !important;border-color:#ff6600 !important;color:#000 !important; }
  .conv-btn-active span { color:#000 !important; }
  /* Chips de conversión */
  .conv-chip { background:#1a1a1a;border:1px solid #333;border-radius:8px;padding:7px 8px;font-size:0.72rem;font-weight:700;cursor:pointer;text-align:center;transition:all 0.18s;line-height:1.5;width:100%; }
  .conv-chip-local       { color:#cc0044;border-color:#3a0015; }
  .conv-chip-local:hover { background:#1a0010;border-color:#8b0033; }
  .conv-chip-ext         { color:#00aa44;border-color:#003318; }
  .conv-chip-ext:hover   { background:#001a0f;border-color:#006633; }
  .conv-chip-prom        { color:#00aaff;border-color:#002a44; }
  .conv-chip-prom:hover  { background:#001a2a;border-color:#0088cc; }
  .conv-chip-custom      { color:#ffffff;border-color:#444; }
  .conv-chip-custom:hover{ background:#222;border-color:#888; }
  .conv-chip-active-local  { background:#1a0010 !important;border-color:#cc0044 !important;box-shadow:0 0 8px rgba(204,0,68,0.3); }
  .conv-chip-active-ext    { background:#001a0f !important;border-color:#00aa44 !important;box-shadow:0 0 8px rgba(0,170,68,0.3); }
  .conv-chip-active-prom   { background:#001a2a !important;border-color:#00aaff !important;box-shadow:0 0 8px rgba(0,170,255,0.3); }
  .conv-chip-active-custom { background:#222    !important;border-color:#fff    !important;box-shadow:0 0 8px rgba(255,255,255,0.15); }
  @keyframes slideDown { from { opacity:0; transform:translateY(-6px); } to { opacity:1; transform:translateY(0); } }
  .toggle-row { display: flex; align-items: center; justify-content: space-between; background: #0f0f0f; border: 1px solid #333; border-radius: 10px; padding: 12px 16px; margin-top: 12px; }
  .toggle-row .tg-label { color: #aaa; font-size: 0.85rem; }
  .toggle-row .tg-label span { color: #ff6600; font-weight: 700; }
  .toggle-wrap { display: flex; gap: 8px; }
  .toggle-btn { padding: 6px 18px; border-radius: 20px; border: 1px solid #444; background: #1a1a1a; color: #888; font-size: 0.8rem; font-weight: 700; cursor: pointer; transition: all 0.2s; }
  .toggle-btn.active-si { background: #ff6600; border-color: #ff6600; color: #000; }
  .toggle-btn.active-no { background: #333; border-color: #555; color: #fff; }
  .desc-row { display: flex; align-items: center; justify-content: space-between; background: #0f0f0f; border: 1px solid #333; border-radius: 10px; padding: 12px 16px; margin-top: 12px; gap: 12px; }
  .desc-row .tg-label { color: #aaa; font-size: 0.85rem; white-space: nowrap; }
  .desc-input-wrap { display: flex; align-items: center; gap: 6px; }
  .desc-input-wrap input { width: 80px; }
  .desc-input-wrap span { color: #ff6600; font-weight: 700; }
  .table-wrap { overflow-x: auto; }
  table { width: 100%; border-collapse: collapse; font-size: 0.85rem; min-width: 360px; }
  thead tr { border-bottom: 2px solid #ff6600; }
  th { padding: 8px 10px; text-align: right; font-weight: 700; font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.05em; white-space: nowrap; }
  th:first-child { text-align: left; color: #666; }
  th.col-l { color: #cc0044; } th.col-e { color: #00aa44; } th.col-p { color: #00aaff; }
  tbody tr { border-bottom: 1px solid #2a2a2a; }
  tbody tr:last-child { border-bottom: none; }
  td { padding: 9px 10px; white-space: nowrap; }
  td:first-child { color: #888; font-size: 0.82rem; }
  td.col-l { color: #cc0044; text-align: right; font-family: monospace; font-weight: 700; }
  td.col-e { color: #00aa44; text-align: right; font-family: monospace; font-weight: 600; }
  td.col-p { color: #00aaff; text-align: right; font-family: monospace; }
  .btn-pdf { width: 100%; background: #ff6600; color: #000; border: none; border-radius: 10px; padding: 14px; font-size: 1rem; font-weight: 800; cursor: pointer; letter-spacing: 0.05em; text-transform: uppercase; transition: background 0.2s, transform 0.1s; margin-top: 4px; }
  .chk-label { display:inline-flex;align-items:center;gap:6px;background:#1a1a1a;border:1px solid #333;border-radius:8px;padding:7px 12px;cursor:pointer;font-size:0.8rem;font-weight:700;color:#aaa;transition:all 0.15s;user-select:none; }
  .chk-label input[type=checkbox] { display:none; }
  .chk-label:has(input:checked) { background:#1a1a1a;border-color:#ff6600;color:#ff6600; }
  .chk-label.chk-local:has(input:checked) { border-color:#cc0044;color:#cc0044;background:#1a0010; }
  .chk-label.chk-ext:has(input:checked)   { border-color:#00aa44;color:#00aa44;background:#001a0f; }
  .chk-label.chk-prom:has(input:checked)  { border-color:#00aaff;color:#00aaff;background:#001a2a; }
  .chk-label.chk-iva:has(input:checked)   { border-color:#ff6600;color:#ff6600;background:#1a0d00; }
  /* ── COLAPSABLES ── */
  .collapse-body { overflow: hidden; transition: max-height 0.35s ease, opacity 0.25s ease; opacity: 1; }
  .collapse-body.closed { max-height: 0 !important; opacity: 0; pointer-events: none; }
  .collapse-toggle { cursor: pointer; user-select: none; }
  .collapse-arrow { display: inline-block; transition: transform 0.3s ease; font-size: 0.7rem; color: #ff6600; margin-left: auto; }
  .collapse-arrow.open { transform: rotate(180deg); }

  .btn-pdf:hover { background: #ff8833; }
  .btn-pdf:active { transform: scale(0.98); }
  .btn-sec { background: #1a1a1a; border: 1px solid #444; color: #aaa; border-radius: 8px; padding: 5px 12px; font-size: 0.75rem; cursor: pointer; transition: all 0.2s; }
  .btn-sec:hover { border-color: #ff6600; color: #ff6600; }
  .btn-danger { background: #1a1a1a; border: 1px solid #8b0033; color: #cc0044; border-radius: 8px; padding: 7px; font-size: 0.75rem; font-weight: 700; cursor: pointer; flex: 1; }
  .footer { text-align: center; color: #333; font-size: 0.72rem; margin-top: 16px; }

  /* ── HISTORIAL DE COTIZACIONES ── */
  .hist-item { background:#0f0f0f; border:1px solid #2a2a2a; border-radius:10px; padding:12px 14px; margin-bottom:8px; cursor:pointer; transition:border-color 0.18s,background 0.18s; }
  .hist-item:hover { border-color:#ff6600; background:#130a00; }
  .hist-num { font-family:monospace; font-size:0.7rem; color:#ff6600; font-weight:700; letter-spacing:0.04em; }
  .hist-cliente { color:#fff; font-weight:700; font-size:0.9rem; margin:3px 0 2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .hist-total { font-family:monospace; font-weight:800; font-size:1rem; color:#ff6600; }
  .hist-meta { font-size:0.7rem; color:#555; margin-top:3px; }
  .hist-actions { display:flex; gap:6px; margin-top:8px; }
  .btn-hist-load { flex:1; background:#1a1a1a; border:1px solid #444; color:#ccc; border-radius:7px; padding:7px; font-size:0.75rem; font-weight:700; cursor:pointer; transition:all 0.15s; }
  .btn-hist-load:hover { border-color:#ff6600; color:#ff6600; }
  .btn-hist-del { background:#1a1a1a; border:1px solid #3a0015; color:#cc0044; border-radius:7px; padding:7px 10px; font-size:0.75rem; font-weight:700; cursor:pointer; transition:all 0.15s; }
  .btn-hist-del:hover { background:#2a0010; }
  .hist-search { width:100%; background:#0f0f0f; color:#fff; border:1px solid #333; border-radius:8px; padding:9px 12px; font-size:0.88rem; outline:none; margin-bottom:12px; box-sizing:border-box; }
  .hist-search:focus { border-color:#ff6600; box-shadow:0 0 0 3px rgba(255,102,0,0.12); }
  .btn-guardar-cot { width:100%; background:#1a1a1a; border:2px solid #ff6600; color:#ff6600; border-radius:10px; padding:13px; font-size:0.95rem; font-weight:800; cursor:pointer; letter-spacing:0.04em; text-transform:uppercase; transition:all 0.2s; margin-top:8px; }
  .btn-guardar-cot:hover { background:#ff6600; color:#000; }
  .btn-guardar-cot:active { transform:scale(0.98); }


  /* ── COTIZACIÓN ── */
  .cot-item { display:block; padding:10px 0; border-bottom:1px solid #2a2a2a; }
  .cot-item:last-child { border-bottom:none; }
  .cot-item-info { min-width:0; overflow:hidden; }
  .cot-item-nombre { color:#fff; font-weight:700; font-size:0.85rem; white-space:normal; word-break:break-word; line-height:1.3; }
  .cot-item-sub { color:#888; font-size:0.68rem; margin-top:2px; font-family:monospace; }
  .cot-qty { display:flex; align-items:center; gap:4px; }
  .cot-qty-btn { background:#2a2a2a; border:1px solid #444; color:#fff; border-radius:6px; width:28px; height:28px; font-size:1rem; font-weight:700; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:all 0.15s; line-height:1; padding:0; }
  .cot-qty-btn:hover { border-color:#ff6600; color:#ff6600; }
  .cot-qty-num { background:#0f0f0f; border:1px solid #333; border-radius:6px; color:#fff; font-family:monospace; font-weight:700; font-size:0.9rem; width:42px; text-align:center; padding:4px 0; }
  .cot-precio { color:#ff6600; font-family:monospace; font-weight:800; font-size:0.9rem; text-align:right; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:120px; }
  .cot-del { background:none; border:none; color:#555; cursor:pointer; font-size:1rem; padding:4px; border-radius:4px; transition:color 0.15s; }
  .cot-del:hover { color:#cc0044; }
  .cot-drag-handle { display:flex; flex-direction:column; gap:3.5px; justify-content:center; align-items:center; flex-shrink:0; width:26px; min-height:44px; padding:4px 4px; cursor:grab; touch-action:none; opacity:0.3; transition:opacity 0.15s; border-radius:5px; align-self:stretch; -webkit-user-select:none; user-select:none; }
  .cot-drag-handle:hover { opacity:1; }
  .cot-drag-handle:active { cursor:grabbing; opacity:1; }
  .cot-drag-handle span { display:block; width:15px; height:2px; background:#aaa; border-radius:2px; pointer-events:none; }
  .cot-nombre-input { background:none; border:none; border-bottom:1px dashed #333; color:#fff; font-weight:700; font-size:0.88rem; padding:0 2px 1px; width:100%; outline:none; transition:border-color 0.15s; }
  .cot-nombre-input:focus { border-bottom-color:#ff6600; }
  .cot-moneda-sel { display:flex; gap:6px; margin-bottom:16px; }
  .cot-mon-btn { flex:1; padding:8px 4px; border-radius:8px; border:1px solid #333; background:#1a1a1a; font-size:0.75rem; font-weight:700; cursor:pointer; transition:all 0.15s; }
  .cot-mon-btn.activo-local { background:#1a0010; border-color:#cc0044; color:#ff4477; }
  .cot-mon-btn.activo-ext   { background:#001a0f; border-color:#00aa44; color:#00dd55; }
  .cot-mon-btn.activo-prom  { background:#001a2a; border-color:#00aaff; color:#33ccff; }
  .cot-mon-btn:not(.activo-local):not(.activo-ext):not(.activo-prom) { color:#555; }
  .cot-total-box { background:#0f0f0f; border:1px solid #2a2a2a; border-radius:10px; padding:14px 16px; margin-top:12px; }
  .cot-total-row { display:flex; justify-content:space-between; align-items:center; padding:4px 0; font-size:0.85rem; color:#888; }
  .cot-total-row.grand { border-top:1px solid #ff6600; margin-top:8px; padding-top:10px; color:#fff; font-weight:800; font-size:1rem; }
  .cot-total-row.grand span:last-child { color:#ff6600; font-family:monospace; font-size:1.15rem; }
  .cot-total-row span:last-child { font-family:monospace; color:#ccc; }
  .btn-agregar-cot { width:100%; margin-top:12px; background:linear-gradient(135deg,#ff6600,#ff8833); border:none; color:#000; border-radius:10px; padding:13px; font-size:0.92rem; font-weight:900; cursor:pointer; letter-spacing:0.04em; transition:all 0.2s; display:none; }
  .btn-agregar-cot:hover { transform:translateY(-1px); box-shadow:0 4px 16px rgba(255,102,0,0.4); }

  /* Burbujas flotantes minimalistas */
  .quick-add-bubble { position:fixed; bottom:84px; right:20px; z-index:600; display:none; transition:bottom 0.2s ease; }
  #qabBotonesFijos { position:relative; display:flex; flex-direction:column; align-items:center; gap:10px; }
  #qabAcciones { position:absolute; bottom:calc(100% + 10px); right:0; display:flex; flex-direction:column; align-items:flex-end; gap:10px; overflow:visible; pointer-events:none; opacity:0; transition:opacity 0.3s ease; }
  #qabAcciones.abierto { pointer-events:all; opacity:1; }
  .qab-btn { background:#1a1a1a; border:1.5px solid #ff6600; border-radius:50%; width:48px; height:48px; cursor:pointer; box-shadow:0 3px 16px rgba(0,0,0,0.5); display:flex; align-items:center; justify-content:center; transition:all 0.18s; animation:popIn 0.22s cubic-bezier(0.34,1.56,0.64,1); flex-shrink:0; }
  .qab-btn:hover { background:#ff6600; transform:scale(1.08); }
  .qab-btn:hover svg { stroke:#000; }
  .qab-btn:active { transform:scale(0.93); }
  .qab-btn svg { stroke:#ff6600; transition:stroke 0.15s; }
  .qab-accion-wrap { display:flex; align-items:center; justify-content:flex-end; gap:8px; }
  @keyframes popIn { from { opacity:0; transform:scale(0.5); } to { opacity:1; transform:scale(1); } }
  /* Historial compacto */
  .hist-item-compact { display:flex; align-items:center; background:#0f0f0f; border:1px solid #2a2a2a; border-radius:9px; padding:10px 12px; margin-bottom:6px; cursor:pointer; transition:border-color 0.15s,background 0.15s; gap:10px; }
  .hist-item-compact:hover { border-color:#ff6600; background:#130a00; }
  .hist-item-compact:active { transform:scale(0.98); }
  .hist-num-sm { font-family:monospace; font-size:0.65rem; color:#ff6600; font-weight:700; letter-spacing:0.03em; }
  .hist-cliente-sm { color:#fff; font-weight:700; font-size:0.85rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .hist-total-sm { font-family:monospace; font-weight:800; font-size:0.9rem; color:#ff6600; white-space:nowrap; flex-shrink:0; }
  .hist-del-sm { background:none; border:none; color:#444; font-size:0.9rem; cursor:pointer; padding:4px 6px; border-radius:5px; transition:color 0.15s; flex-shrink:0; line-height:1; }
  .hist-del-sm:hover { color:#cc0044; }