:root { --gold:#B8963E; --gold-light:#D4AF68; --gold-pale:#F5EDD8; --ink:#1A1A2E; --ink-mid:#2E2E4A; --slate:#5A5A7A; --mist:#F0EEF8; --white:#FAFAFA; --border:#E2DDEF; --danger:#C0392B; --shadow:0 4px 24px rgba(26,26,46,.10); --shadow-lg:0 12px 48px rgba(26,26,46,.15); } *{box-sizing:border-box;margin:0;padding:0;} body{font-family:'DM Sans',sans-serif;background:var(--mist);color:var(--ink);min-height:100vh;} /* HEADER */ header{background:var(--ink);padding:0 24px;display:flex;align-items:center;justify-content:space-between;height:64px;position:sticky;top:0;z-index:100;box-shadow:0 2px 16px rgba(0,0,0,.25);} .brand{display:flex;align-items:center;gap:12px;} .brand-icon{width:36px;height:36px;border:2px solid var(--gold);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:18px;} .brand-name{font-family:'Cormorant Garamond',serif;font-size:22px;font-weight:600;color:var(--white);letter-spacing:.5px;} .brand-name span{color:var(--gold-light);} .nav-tabs{display:flex;gap:4px;} .nav-tab{padding:8px 16px;border-radius:8px;font-size:13px;font-weight:600;cursor:pointer;border:none;background:transparent;color:rgba(255,255,255,.55);transition:all .2s;font-family:'DM Sans',sans-serif;} .nav-tab:hover{color:var(--white);background:rgba(255,255,255,.08);} .nav-tab.active{background:rgba(184,150,62,.2);color:var(--gold-light);} /* PAGES */ .page{display:none;} .page.active{display:block;} /* LAYOUT */ .app{max-width:1100px;margin:0 auto;padding:32px 24px 64px;display:grid;gap:24px;grid-template-columns:1fr 1fr;grid-template-areas:"config config" "calc result" "history history";} .card{background:var(--white);border-radius:16px;box-shadow:var(--shadow);border:1px solid var(--border);overflow:hidden;} .card-header{padding:20px 28px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:10px;} .card-header h2{font-family:'Cormorant Garamond',serif;font-size:20px;font-weight:600;color:var(--ink);} .card-icon{width:32px;height:32px;background:var(--gold-pale);border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:16px;flex-shrink:0;} .card-body{padding:24px 28px;} .config-section{grid-area:config;} .calc-section{grid-area:calc;} .result-section{grid-area:result;} .history-section{grid-area:history;} .config-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px;} /* FORMS */ label{display:block;font-size:12px;font-weight:600;color:var(--slate);text-transform:uppercase;letter-spacing:.8px;margin-bottom:6px;} input[type="text"],input[type="number"],input[type="tel"],input[type="email"],select,textarea{width:100%;padding:10px 14px;border:1.5px solid var(--border);border-radius:10px;font-family:'DM Sans',sans-serif;font-size:15px;color:var(--ink);background:var(--white);transition:border-color .2s,box-shadow .2s;outline:none;appearance:none;} textarea{resize:vertical;min-height:72px;} input:focus,select:focus,textarea:focus{border-color:var(--gold);box-shadow:0 0 0 3px rgba(184,150,62,.12);} input[type="number"]{font-weight:600;} .input-group{position:relative;} .input-prefix,.input-suffix{position:absolute;top:50%;transform:translateY(-50%);font-size:13px;font-weight:600;color:var(--slate);pointer-events:none;} .input-prefix{left:12px;} .input-suffix{right:12px;} .has-prefix input{padding-left:32px;} .has-suffix input{padding-right:36px;} /* TIER TABLE */ .tier-table{width:100%;border-collapse:collapse;margin-top:4px;} .tier-table th{font-size:11px;font-weight:600;color:var(--slate);text-transform:uppercase;letter-spacing:.8px;text-align:left;padding:8px 10px;border-bottom:2px solid var(--border);} .tier-table td{padding:7px 10px;} .tier-table tr:not(:last-child) td{border-bottom:1px solid var(--border);} .tier-table input{padding:6px 10px;font-size:14px;} .tier-table .has-suffix input{padding-right:30px;} .tier-table .input-suffix{font-size:11px;} /* BUTTONS */ .btn{padding:11px 22px;border-radius:10px;font-family:'DM Sans',sans-serif;font-size:14px;font-weight:600;cursor:pointer;border:none;transition:all .2s;display:inline-flex;align-items:center;gap:7px;} .btn-primary{background:var(--ink);color:var(--white);} .btn-primary:hover{background:var(--ink-mid);transform:translateY(-1px);box-shadow:var(--shadow);} .btn-gold{background:var(--gold);color:var(--white);} .btn-gold:hover{background:var(--gold-light);transform:translateY(-1px);box-shadow:var(--shadow);} .btn-outline{background:transparent;color:var(--ink);border:1.5px solid var(--border);} .btn-outline:hover{border-color:var(--gold);color:var(--gold);} .btn-danger{background:transparent;color:var(--danger);border:1.5px solid #f0c0b8;padding:7px 14px;font-size:13px;} .btn-danger:hover{background:#fdf0ee;} .btn-sm{padding:7px 14px;font-size:13px;} .btn-full{width:100%;justify-content:center;} /* RESULT DUAL */ .result-dual{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:16px;} .result-main{border-radius:12px;padding:20px;color:var(--white);text-align:center;} .result-main.usd-card{background:linear-gradient(135deg,#1a3a2e,#2e5c45);} .result-main.pyg-card{background:linear-gradient(135deg,var(--ink),var(--ink-mid));} .result-currency-label{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:1.5px;color:rgba(255,255,255,.45);margin-bottom:4px;} .result-price{font-family:'Cormorant Garamond',serif;font-size:32px;font-weight:700;line-height:1;margin-bottom:3px;} .result-main.usd-card .result-price{color:#7dd4a8;} .result-main.pyg-card .result-price{color:var(--gold-light);} .result-price-sub{font-size:12px;color:rgba(255,255,255,.45);} .result-breakdown{display:flex;flex-direction:column;gap:8px;} .breakdown-row{display:flex;justify-content:space-between;align-items:center;padding:9px 14px;background:var(--mist);border-radius:8px;font-size:14px;} .breakdown-row .lbl{color:var(--slate);} .breakdown-row .vals{display:flex;gap:16px;align-items:center;} .breakdown-row .val-usd{font-weight:600;color:#2e7d5e;font-size:13px;min-width:80px;text-align:right;} .breakdown-row .val-pyg{font-weight:600;color:var(--ink);font-size:13px;min-width:100px;text-align:right;} .breakdown-row.highlight{background:var(--gold-pale);} .breakdown-row.highlight .val-pyg{color:var(--gold);} .breakdown-row.highlight .val-usd{color:#1a6644;} .tier-badge{background:var(--gold);color:var(--white);font-size:11px;font-weight:600;padding:3px 9px;border-radius:20px;letter-spacing:.5px;} .col-header{display:flex;justify-content:flex-end;gap:16px;padding:0 14px 4px;margin-top:4px;} .col-h{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:var(--slate);} .col-h.usd{min-width:80px;text-align:right;color:#2e7d5e;} .col-h.pyg{min-width:100px;text-align:right;color:var(--gold);} /* TC BADGE */ .tc-badge{display:inline-flex;align-items:center;gap:6px;background:rgba(184,150,62,.12);border:1px solid rgba(184,150,62,.3);border-radius:8px;padding:5px 12px;font-size:13px;color:var(--gold);font-weight:600;} .tc-badge span{color:var(--slate);font-weight:400;font-size:12px;} /* HISTORY */ .history-table{width:100%;border-collapse:collapse;font-size:13px;} .history-table th{font-size:11px;font-weight:600;color:var(--slate);text-transform:uppercase;letter-spacing:.8px;text-align:left;padding:10px 12px;border-bottom:2px solid var(--border);} .history-table td{padding:11px 12px;vertical-align:middle;} .history-table tr:not(:last-child) td{border-bottom:1px solid var(--border);} .history-table tr:hover td{background:var(--mist);} .price-usd{font-weight:700;color:#2e7d5e;} .price-pyg{font-weight:700;color:var(--gold);} .empty-state{text-align:center;color:var(--slate);padding:32px;font-size:14px;} /* UTILS */ .flex{display:flex;gap:10px;align-items:center;} .flex-between{display:flex;justify-content:space-between;align-items:center;} .mt16{margin-top:16px;} .mt24{margin-top:24px;} .divider{height:1px;background:var(--border);margin:20px 0;} .section-title{font-size:12px;font-weight:600;color:var(--slate);text-transform:uppercase;letter-spacing:.8px;margin-bottom:12px;} .tag{background:var(--mist);border:1px solid var(--border);color:var(--slate);font-size:12px;padding:3px 9px;border-radius:6px;} /* TOAST */ .toast{position:fixed;bottom:24px;right:24px;background:var(--ink);color:var(--white);padding:12px 20px;border-radius:10px;font-size:14px;font-weight:500;display:flex;align-items:center;gap:10px;box-shadow:var(--shadow-lg);transform:translateY(80px);opacity:0;transition:all .3s cubic-bezier(.34,1.56,.64,1);z-index:999;} .toast.show{transform:translateY(0);opacity:1;} .toast-icon{color:var(--gold-light);font-size:16px;} /* ══════════ COTIZACIÓN PAGE ══════════ */ .quote-page{max-width:1000px;margin:0 auto;padding:32px 24px 64px;display:grid;gap:24px;grid-template-columns:1fr 1fr;grid-template-areas:"qmeta qmeta" "qprods qprods" "qprev qprev";} .qmeta-section{grid-area:qmeta;} .qprods-section{grid-area:qprods;} .qprev-section{grid-area:qprev;} .qmeta-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;} .qp-table{width:100%;border-collapse:collapse;} .qp-table th{font-size:11px;font-weight:600;color:var(--slate);text-transform:uppercase;letter-spacing:.8px;padding:8px 12px;border-bottom:2px solid var(--border);text-align:left;} .qp-table th.r{text-align:right;} .qp-table td{padding:6px 10px;vertical-align:middle;} .qp-table tr:not(:last-child) td{border-bottom:1px solid var(--border);} .qp-table input{padding:7px 10px;font-size:14px;} .qp-sub-usd{font-weight:700;color:#2e7d5e;font-size:13px;text-align:right;padding-right:8px;} .qp-sub-pyg{font-weight:700;color:var(--gold);font-size:13px;text-align:right;padding-right:14px;} /* PRINTABLE QUOTE */ #quote-preview{background:white;border-radius:16px;box-shadow:var(--shadow-lg);border:1px solid var(--border);overflow:hidden;} .qh-bar{background:var(--ink);padding:28px 40px;display:flex;align-items:center;justify-content:space-between;} .qh-name{font-family:'Cormorant Garamond',serif;font-size:40px;font-weight:700;color:white;letter-spacing:1px;line-height:1;} .qh-name span{color:var(--gold-light);} .qh-sub{font-size:11px;color:rgba(255,255,255,.4);text-transform:uppercase;letter-spacing:2.5px;margin-top:4px;} .qh-right{text-align:right;} .qh-label{font-size:10px;color:rgba(255,255,255,.4);text-transform:uppercase;letter-spacing:1.5px;margin-bottom:4px;} .qh-num{font-family:'Cormorant Garamond',serif;font-size:28px;color:var(--gold-light);font-weight:600;} .qh-date{font-size:12px;color:rgba(255,255,255,.4);margin-top:3px;} .gold-bar{height:4px;background:linear-gradient(90deg,var(--gold),var(--gold-light),var(--gold));} /* TC INFO BAR */ .tc-bar{background:var(--gold-pale);border-bottom:1px solid #e8d8b0;padding:10px 40px;display:flex;align-items:center;gap:16px;font-size:12px;color:var(--slate);} .tc-bar strong{color:var(--gold);font-size:13px;} .qbody{padding:32px 40px;} .qmeta-row{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-bottom:28px;} .qmi-label{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:1.5px;color:var(--slate);margin-bottom:5px;} .qmi-value{font-size:16px;font-weight:600;color:var(--ink);} .qmi-right{text-align:right;} .qprod-title{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:1.5px;color:var(--slate);padding-bottom:10px;border-bottom:2px solid var(--ink);margin-bottom:0;} /* DUAL CURRENCY PRODUCT TABLE */ .qprod-table{width:100%;border-collapse:collapse;margin-bottom:24px;} .qprod-table th{background:var(--mist);font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.8px;color:var(--slate);padding:10px 12px;text-align:left;} .qprod-table th.r{text-align:right;} .qprod-table th.usd-h{color:#2e7d5e;text-align:right;} .qprod-table th.pyg-h{color:var(--gold);text-align:right;} .qprod-table td{padding:12px 12px;font-size:14px;border-bottom:1px solid var(--border);vertical-align:middle;} .qprod-table tr:last-child td{border-bottom:none;} .qprod-table .pname{font-weight:600;color:var(--ink);} .qprod-table .p-usd{text-align:right;font-weight:700;color:#2e7d5e;} .qprod-table .p-pyg{text-align:right;font-weight:700;color:var(--gold);} .disc-badge{display:inline-block;background:var(--gold-pale);color:var(--gold);font-size:10px;font-weight:700;padding:2px 7px;border-radius:5px;margin-left:6px;} .col-sep{width:1px;background:var(--border);padding:0!important;} /* DUAL TOTALS */ .qtotals-wrap{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:24px;} .qtotals-block{display:flex;flex-direction:column;gap:6px;} .qtotals-block .ttitle{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:1.5px;margin-bottom:4px;padding-bottom:6px;border-bottom:2px solid var(--border);} .qtotals-block.usd-block .ttitle{color:#2e7d5e;border-color:#2e7d5e;} .qtotals-block.pyg-block .ttitle{color:var(--gold);border-color:var(--gold);} .qtot-row{display:flex;justify-content:space-between;font-size:14px;padding:4px 0;} .qtot-row .tl{color:var(--slate);} .qtot-row .tv{font-weight:600;color:var(--ink);} .qtot-final{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;border-radius:10px;margin-top:6px;} .qtot-final.usd-final{background:linear-gradient(135deg,#1a3a2e,#2e5c45);} .qtot-final.pyg-final{background:linear-gradient(135deg,var(--ink),var(--ink-mid));} .qtot-final .tl{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:rgba(255,255,255,.5);} .qtot-final .tv{font-family:'Cormorant Garamond',serif;font-size:22px;font-weight:700;} .qtot-final.usd-final .tv{color:#7dd4a8;} .qtot-final.pyg-final .tv{color:var(--gold-light);} .qcond{border-top:1px solid var(--border);padding-top:20px;margin-bottom:20px;} .qcond-label{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:1.5px;color:var(--slate);margin-bottom:8px;} .qcond-text{font-size:13px;color:var(--slate);line-height:1.65;white-space:pre-line;} .qfoot{background:var(--mist);border-top:1px solid var(--border);padding:20px 40px;display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;} .qcontacts{display:flex;gap:20px;flex-wrap:wrap;} .qcontact-item{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--slate);} .qvalidity{text-align:right;font-size:12px;color:var(--slate);} .qvalidity strong{display:block;color:var(--ink);font-size:14px;margin-bottom:2px;} .print-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:14px;} /* SETTINGS */ .settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;} /* ── PRINT MODAL ── */ .modal-overlay{position:fixed;inset:0;background:rgba(10,10,20,.7);z-index:1000;display:flex;align-items:flex-start;justify-content:center;padding:24px;overflow-y:auto;backdrop-filter:blur(4px);opacity:0;pointer-events:none;transition:opacity .25s;} .modal-overlay.open{opacity:1;pointer-events:all;} .modal{background:var(--white);border-radius:20px;box-shadow:var(--shadow-lg);width:100%;max-width:820px;overflow:hidden;transform:translateY(24px);transition:transform .3s cubic-bezier(.34,1.56,.64,1);} .modal-overlay.open .modal{transform:translateY(0);} .modal-bar{background:var(--ink);padding:18px 28px;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;} .modal-bar h3{font-family:'Cormorant Garamond',serif;font-size:20px;font-weight:600;color:var(--white);} .modal-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;} .modal-close{background:rgba(255,255,255,.1);border:none;color:rgba(255,255,255,.7);width:34px;height:34px;border-radius:8px;cursor:pointer;font-size:18px;display:flex;align-items:center;justify-content:center;transition:all .2s;} .modal-close:hover{background:rgba(255,255,255,.2);color:white;} .modal-options{padding:16px 28px;background:var(--mist);border-bottom:1px solid var(--border);display:flex;gap:16px;flex-wrap:wrap;align-items:center;} .modal-opt-label{font-size:12px;font-weight:600;color:var(--slate);text-transform:uppercase;letter-spacing:.7px;white-space:nowrap;} .modal-check{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--ink);cursor:pointer;user-select:none;} .modal-check input[type=checkbox]{width:16px;height:16px;accent-color:var(--gold);cursor:pointer;} .modal-body{padding:24px 28px;max-height:70vh;overflow-y:auto;} .print-preview-wrap{border:1px solid var(--border);border-radius:12px;overflow:hidden;box-shadow:0 2px 12px rgba(0,0,0,.07);} /* PRINT */ @media print { header,.qmeta-section,.qprods-section,.print-actions,.modal-bar,.modal-options{display:none!important;} body{background:white;} .page{display:block!important;} .quote-page{padding:0;display:grid!important;} #quote-preview{box-shadow:none;border:none;border-radius:0;} .modal-overlay{position:static;background:none;padding:0;backdrop-filter:none;opacity:1;pointer-events:all;} .modal{box-shadow:none;border-radius:0;max-width:100%;} .modal-body{max-height:none;overflow:visible;padding:0;} .print-preview-wrap{border:none;border-radius:0;box-shadow:none;} } @media(max-width:700px){ .app{grid-template-columns:1fr;grid-template-areas:"config" "calc" "result" "history";} .quote-page{grid-template-columns:1fr;grid-template-areas:"qmeta" "qprods" "qprev";} .qmeta-grid,.qmeta-row,.settings-grid,.result-dual,.qtotals-wrap{grid-template-columns:1fr;} .qh-bar{flex-direction:column;gap:16px;text-align:center;} .qh-right{text-align:center;} }
⌚
CD & Co.
⚙️

Márgenes y Tipo de Cambio

Tipo de cambio

₲
TC actual: 1 USD = ₲ 7.800

Niveles de descuento por cantidad

#Cant. mínimaDescuentoEtiqueta
%
🧮

Calculadora de Precio

$
%
₲

Opcional — calculará la ganancia sobre tu precio público

💰

Resultado

Precio unitario · USD
$ 0.00
Sin descuento
Precio unitario · PYG
₲ 0
Al tipo de cambio actual
USD PYG
Costo base
$0₲0
Ganancia (30%)
$0₲0
Precio s/descuento
$0₲0
Descuento —
$0₲0
IVA (10%)
$0₲0
Total × 1 unid.
$0₲0
📄

Historial

FechaProductoClienteCant.NivelUnit. USDUnit. ₲Total USDTotal ₲
Sin cotizaciones aún.
🏷️

Datos de la Cotización

⌚

Productos

Producto Cant. P. Unit. USD Desc.% Sub. USD Sub. ₲

Vista previa

CD & Co.
Cotización
COT-001
—
💱 Tipo de cambio aplicado: 1 USD = ₲ 7.800 Los precios se expresan en USD y Guaraníes
Cotización para
—
Válida hasta
—
Detalle de productos
Producto Cant. P.Unit USD Desc. Sub. USD Sub. ₲
Sin productos aún
Condiciones
—
Completá tus datos en ⚙️ Mi Negocio
— Válida hasta
🏢

Datos de CD & Co.

Esta información aparece en el pie de cada cotización que enviás a tus clientes.

Contacto

✔Guardado