/* =========================================================================
   MSL Cotizaciones · estilo del sitio (degradado petróleo → turquesa → menta)
   ========================================================================= */
:root{
	--mslq-c:#09acc6;--mslq-d:#006582;--mslq-m:#8fd3c9;--mslq-n:#12344d;--mslq-tx:#4a5a62;
	--mslq-g:#f0f4f5;--mslq-b:#e1e9ec;--mslq-r:18px;
	--mslq-grad:linear-gradient(120deg,var(--mslq-d) 0%,#0790ad 45%,var(--mslq-m) 100%);
	--mslq-grad-btn:linear-gradient(120deg,var(--mslq-d) 0%,var(--mslq-c) 55%,#3fc3d6 100%);
	--mslq-shadow:0 10px 30px rgba(0,60,80,.08);
}
.mslq,.mslq-btn,.mslq-toast,.mslq-counter{font-family:'DM Sans',system-ui,-apple-system,'Segoe UI',sans-serif}
.mslq em,.mslq-toast em{font-family:'Instrument Serif',Georgia,serif;font-style:italic;font-weight:400;color:var(--mslq-c)}
.mslq *{box-sizing:border-box}
.mslq h2,.mslq h3,.mslq h4{font-family:'DM Sans',system-ui,sans-serif;letter-spacing:-.01em}
.mslq-ico{flex:none;display:inline-block;vertical-align:middle}

/* ---------- botones ---------- */
.mslq-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;border:2px solid transparent;cursor:pointer;
	font-weight:700;font-size:15px;line-height:1.2;letter-spacing:.01em;padding:13px 22px;border-radius:12px;text-decoration:none!important;
	transition:transform .15s ease,box-shadow .25s ease,background-position .4s ease,background-color .2s,color .2s,border-color .2s;white-space:nowrap}
.mslq-btn:active{transform:scale(.98)}
.mslq-btn[disabled]{opacity:.65;cursor:wait}
.mslq-btn-grad{color:#fff!important;background-image:var(--mslq-grad-btn);background-size:180% 100%;background-position:0 0;box-shadow:0 8px 20px rgba(9,172,198,.28)}
.mslq-btn-grad:hover{background-position:100% 0;box-shadow:0 12px 26px rgba(0,101,130,.32);transform:translateY(-1px)}
.mslq-btn-outline{background:#fff;color:var(--mslq-d)!important;border-color:var(--mslq-d)}
.mslq-btn-outline:hover{background:var(--mslq-d);color:#fff!important}
.mslq-btn-ghost{background:transparent;color:var(--mslq-d)!important;border-color:var(--mslq-b)}
.mslq-btn-ghost:hover{border-color:var(--mslq-d)}
.mslq-btn-danger{background:#d63638;color:#fff!important}
.mslq-btn-danger:hover{background:#b32d2e}
.mslq-btn-sm{font-size:13px;padding:9px 14px;border-radius:10px;gap:7px}
.mslq-btn-block{width:100%;white-space:normal;text-align:center}
.mslq-btn.is-added{background-image:none;background-color:var(--mslq-n);box-shadow:none}
.mslq-btn .mslq-arrow{display:inline-grid;place-items:center;width:28px;height:28px;margin:-6px -10px -6px 4px;border-radius:9px;background:rgba(255,255,255,.18);transition:transform .25s}
.mslq-btn:hover .mslq-arrow{transform:translateX(3px)}
.mslq-btn.is-added .mslq-arrow{display:none}

/* ---------- botón en ficha de producto ---------- */
.mslq-single{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin:22px 0}
.mslq-single .mslq-add{flex:1 1 220px;min-height:52px;font-size:16px}
.mslq-view{width:100%;display:inline-flex;align-items:center;gap:6px;font-weight:700;color:var(--mslq-d);text-decoration:none}
.mslq-qty{display:inline-flex;align-items:center;height:52px;border:1.5px solid var(--mslq-b);border-radius:12px;overflow:hidden;background:#fff}
.mslq-qty button{border:0;background:transparent;width:40px;height:100%;font-size:20px;line-height:1;cursor:pointer;color:var(--mslq-d);transition:background .2s}
.mslq-qty button:hover{background:var(--mslq-g)}
.mslq-qty input{width:48px;height:100%;border:0;text-align:center;font:inherit;font-weight:700;color:var(--mslq-n);background:transparent;-moz-appearance:textfield}
.mslq-qty input::-webkit-inner-spin-button,.mslq-qty input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}

/* ---------- contador / flotante ---------- */
.mslq-counter{display:inline-flex;align-items:center;gap:8px;color:var(--mslq-n);font-weight:700;font-size:14px;text-decoration:none}
.mslq-counter .mslq-ico{color:var(--mslq-d)}
.mslq-count{min-width:22px;height:22px;padding:0 7px;border-radius:99px;background-image:var(--mslq-grad-btn);color:#fff;font-size:12px;display:inline-grid;place-items:center}
.mslq-float{position:fixed;left:20px;bottom:20px;z-index:60}
.mslq-float .mslq-counter{background:#fff;padding:12px 16px 12px 14px;border-radius:99px;box-shadow:0 10px 30px rgba(0,50,70,.18);border:1px solid var(--mslq-b)}
.mslq-float .mslq-counter:hover{border-color:var(--mslq-c)}

/* ---------- aviso emergente ---------- */
.mslq-toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,20px);opacity:0;z-index:99999;display:flex;align-items:center;gap:12px;
	background:var(--mslq-n);color:#fff;padding:14px 18px 14px 14px;border-radius:14px;font-size:14px;box-shadow:0 14px 34px rgba(0,30,45,.3);transition:.3s;max-width:calc(100% - 32px)}
.mslq-toast::before{content:"";width:6px;align-self:stretch;border-radius:6px;background-image:var(--mslq-grad-btn)}
.mslq-toast.show{opacity:1;transform:translate(-50%,0)}
.mslq-toast a{color:var(--mslq-m);font-weight:700;white-space:nowrap}

/* ---------- página de cotización (lista) ---------- */
.mslq-page{max-width:1120px;margin:0 auto;color:var(--mslq-tx)}
.mslq-steps{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 26px;font-size:13px;font-weight:600;color:#7a8a91}
.mslq-steps span{display:inline-flex;align-items:center;gap:8px;padding:6px 12px 6px 6px;border-radius:99px;background:var(--mslq-g)}
.mslq-steps b{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;background:#fff;color:var(--mslq-d);font-size:12px}
.mslq-steps .is-on{background:#e3f6f9;color:var(--mslq-d)}
.mslq-steps .is-on b{background-image:var(--mslq-grad-btn);color:#fff}
.mslq-steps i{flex:0 0 18px;height:2px;background:var(--mslq-b)}
.mslq-layout{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:28px;align-items:start}
.mslq-items h3,.mslq-form h3{color:var(--mslq-n);font-size:24px;line-height:1.2;margin:0 0 16px}
.mslq-items h3 span{color:#9aa8ae;font-weight:400;font-size:18px}
.mslq-row{display:grid;grid-template-columns:88px minmax(0,1fr) auto 38px;gap:16px;align-items:center;padding:14px;border:1px solid var(--mslq-b);border-radius:var(--mslq-r);margin-bottom:12px;background:#fff;box-shadow:var(--mslq-shadow);transition:opacity .2s,border-color .2s}
.mslq-row:hover{border-color:#bfe9f0}
.mslq-thumb{display:block;border-radius:14px;background:var(--mslq-g);overflow:hidden}
.mslq-thumb img{width:88px;height:88px;object-fit:contain;display:block;mix-blend-mode:multiply}
.mslq-info{display:flex;flex-direction:column;gap:3px;min-width:0}
.mslq-brand{align-self:flex-start;font-size:10.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--mslq-d);background:#e3f6f9;padding:3px 8px;border-radius:99px}
.mslq-name{font-weight:700;color:var(--mslq-n)!important;text-decoration:none;line-height:1.3}
.mslq-name:hover{color:var(--mslq-d)!important}
.mslq-info small{color:#7a8a91;font-size:12.5px}
.mslq-note{margin-top:6px;width:100%;font:inherit;font-size:13px;border:1px dashed #cfdde2;border-radius:10px;padding:7px 10px;background:var(--mslq-g);resize:vertical;color:var(--mslq-n)}
.mslq-note:focus{outline:none;border-style:solid;border-color:var(--mslq-c);background:#fff}
.mslq-row .mslq-qty{height:42px}
.mslq-row .mslq-qty button{width:34px}
.mslq-row .mslq-qty input{width:40px}
.mslq-remove{width:38px;height:38px;border-radius:50%;border:0;background:var(--mslq-g);font-size:20px;cursor:pointer;color:#7a8a91;transition:.2s}
.mslq-remove:hover{background:#fde8e8;color:#d63638}
.mslq-empty{text-align:center;padding:56px 24px;border-radius:var(--mslq-r);background:var(--mslq-g)}
.mslq-empty h3{margin-bottom:6px}
.mslq-empty p{margin:0 0 18px}

/* formulario */
.mslq-form{position:sticky;top:24px;padding:0 24px 24px;border-radius:var(--mslq-r);background:#fff;border:1px solid var(--mslq-b);box-shadow:var(--mslq-shadow);overflow:hidden}
.mslq-form-head{margin:0 -24px 20px;padding:22px 24px 20px;background-image:var(--mslq-grad);color:#fff}
.mslq-form-head h3{color:#fff;margin:2px 0 4px}
.mslq-form-head em{color:#fff}
.mslq-form-head p{margin:0;font-size:14px;opacity:.9}
.mslq-kicker{display:inline-block;font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;opacity:.85}
.mslq-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:14px}
.mslq-grid label,.mslq-pref legend{display:flex;flex-direction:column;gap:6px;font-size:12.5px;font-weight:700;color:var(--mslq-n)}
.mslq-grid label small{font-weight:400;color:#7a8a91}
.mslq-grid .mslq-full{grid-column:1/-1}
.mslq-grid input,.mslq-grid select,.mslq-grid textarea{font:inherit;font-size:15px;font-weight:400;padding:12px 14px;border:1.5px solid var(--mslq-b);border-radius:12px;background:#f8fbfc;color:var(--mslq-n);width:100%;transition:border-color .2s,background .2s,box-shadow .2s}
.mslq-grid input:focus,.mslq-grid select:focus,.mslq-grid textarea:focus{outline:none;border-color:var(--mslq-c);background:#fff;box-shadow:0 0 0 4px rgba(9,172,198,.12)}
.mslq-pref{border:0;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.mslq-pref legend{margin-bottom:6px}
.mslq-pref label{flex-direction:row;cursor:pointer}
.mslq-pref input{position:absolute;opacity:0;pointer-events:none}
.mslq-pref span{display:inline-block;padding:8px 14px;border-radius:99px;border:1.5px solid var(--mslq-b);font-weight:600;font-size:13px;color:var(--mslq-tx);transition:.2s}
.mslq-pref input:checked+span{border-color:transparent;background-image:var(--mslq-grad-btn);color:#fff}
.mslq-pref input:focus-visible+span{box-shadow:0 0 0 3px rgba(9,172,198,.3)}
.mslq-hp{position:absolute!important;left:-9999px!important}
.mslq-check{display:flex;gap:10px;align-items:flex-start;font-size:13.5px;margin-bottom:16px;color:var(--mslq-tx)}
.mslq-check input{margin-top:3px;accent-color:var(--mslq-c);width:16px;height:16px}
.mslq-check a{color:var(--mslq-d)}
.mslq-msg{margin:12px 0 0;font-size:14px}.mslq-msg:empty{display:none}.mslq-msg.is-error{color:#d63638}

/* enviado */
.mslq-ok{max-width:620px;margin:0 auto;text-align:center;padding:44px 28px;border-radius:24px;background:#fff;border:1px solid var(--mslq-b);box-shadow:var(--mslq-shadow)}
.mslq-ok-ico{width:72px;height:72px;margin:0 auto 16px;border-radius:50%;display:grid;place-items:center;background-image:var(--mslq-grad-btn);color:#fff;box-shadow:0 12px 26px rgba(9,172,198,.35)}
.mslq-ok-ico .mslq-ico{width:34px;height:34px}
.mslq-ok h3{color:var(--mslq-n);font-size:26px;margin:0 0 8px}
.mslq-ok p{margin:0 0 22px}
.mslq-ok .mslq-btn{margin:5px}
.mslq-wa{background:#25d366;color:#fff!important}.mslq-wa:hover{background:#1ebe5a}

/* ---------- tarjeta de cotización con precios ---------- */
.mslq-quote{max-width:780px}
.mslq-card{border-radius:24px;background:#fff;border:1px solid var(--mslq-b);box-shadow:0 18px 50px rgba(0,60,80,.12);overflow:hidden}
.mslq-card-head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;padding:30px 32px 26px;background-image:var(--mslq-grad);color:#fff;position:relative;overflow:hidden}
.mslq-card-head::after{content:"";position:absolute;right:-60px;top:-60px;width:220px;height:220px;border-radius:50%;background:rgba(255,255,255,.08)}
.mslq-card-head h2{color:#fff;font-size:34px;line-height:1.1;margin:4px 0 6px;font-weight:700}
.mslq-card-head h2 em{color:#fff}
.mslq-card-head p{margin:0;opacity:.9;font-size:14px}
.mslq-card-meta{display:flex;flex-direction:column;align-items:flex-end;gap:6px;position:relative;z-index:1}
.mslq-card-meta small{font-size:12.5px;opacity:.9}
.mslq-card-meta small.is-expired{background:#fff;color:#d63638;padding:2px 8px;border-radius:6px;opacity:1;font-weight:700}
.mslq-card .mslq-status{background:rgba(255,255,255,.95)}
.mslq-card-body{padding:26px 32px 30px}
.mslq-intro{margin:0 0 6px;font-size:15px}
.mslq-notice{padding:16px 18px;border-radius:14px;background:var(--mslq-g);border-left:4px solid var(--mslq-c);color:var(--mslq-n)}
.mslq-lines{list-style:none;margin:10px 0 0;padding:0}
.mslq-line{display:flex;align-items:center;gap:16px;padding:16px 0;border-bottom:1px solid var(--mslq-b);transition:opacity .2s}
.mslq-line.is-off-sel{opacity:.5}
.mslq-line.is-declined{opacity:.45}
.mslq-pick{position:relative;flex:none;cursor:pointer;width:26px;height:26px}
.mslq-pick input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.mslq-pick span{position:absolute;inset:0;border-radius:8px;border:2px solid #c6d6dc;background:#fff;transition:.2s}
.mslq-pick input:checked+span{border-color:transparent;background-image:var(--mslq-grad-btn)}
.mslq-pick input:checked+span::after{content:"";position:absolute;left:8px;top:3px;width:6px;height:12px;border:solid #fff;border-width:0 2.5px 2.5px 0;transform:rotate(45deg)}
.mslq-pick input:disabled+span{background:var(--mslq-g);border-color:var(--mslq-b)}
.mslq-pick input:focus-visible+span{box-shadow:0 0 0 3px rgba(9,172,198,.3)}
.mslq-line-img{flex:none;width:72px;height:72px;object-fit:contain;border-radius:14px;background:var(--mslq-g)}
.mslq-line-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.mslq-line-info small{color:#7a8a91;font-size:12.5px}
.mslq-line-price{flex:none;text-align:right;display:flex;flex-direction:column;gap:1px}
.mslq-line-price del{color:#9aa8ae;font-size:13px}
.mslq-line-price strong{color:var(--mslq-n);font-size:18px}
.mslq-line-price strong.is-deal{color:var(--mslq-c)}
.mslq-line-price small{color:#7a8a91;font-size:12px}
.mslq-chip{align-self:flex-start;display:inline-flex;align-items:center;gap:4px;margin-top:4px;font-size:11.5px;font-weight:700;padding:3px 9px;border-radius:99px}
.mslq-chip .mslq-ico{width:14px;height:14px}
.mslq-chip.is-wait{background:#fff4dc;color:#9a6700}
.mslq-chip.is-paid{background:#e3f7e8;color:#00791f}
.mslq-chip.is-off{background:var(--mslq-g);color:#7a8a91}
.mslq-totals{margin:18px 0 0;padding:0}
.mslq-totals div{display:flex;justify-content:space-between;padding:5px 0;font-size:15px}
.mslq-totals dt{color:var(--mslq-tx)}
.mslq-totals dd{margin:0;color:var(--mslq-n);font-weight:600}
.mslq-totals .mslq-save dt,.mslq-totals .mslq-save dd{color:var(--mslq-c)}
.mslq-totals .mslq-total{margin-top:8px;padding-top:12px;border-top:2px solid var(--mslq-n)}
.mslq-totals .mslq-total dt{font-weight:700;color:var(--mslq-n);font-size:18px}
.mslq-totals .mslq-total dd{font-size:26px;font-weight:700}
.mslq-terms{margin-top:18px;padding:14px 16px;border-radius:14px;background:var(--mslq-g);font-size:13.5px}
.mslq-actions{display:grid;gap:10px;margin-top:24px}
.mslq-actions .mslq-accept{min-height:54px;font-size:16px;text-transform:uppercase;letter-spacing:.04em}
.mslq-actions .mslq-reject-open{min-height:50px;text-transform:uppercase;letter-spacing:.04em}
.mslq-reject{padding:16px;border-radius:14px;background:#fff7f7;border:1px solid #f4d2d2}
.mslq-reject label{display:flex;flex-direction:column;gap:6px;font-size:13px;font-weight:700;color:var(--mslq-n)}
.mslq-reject textarea{font:inherit;font-size:14px;padding:10px 12px;border:1.5px solid var(--mslq-b);border-radius:10px;width:100%}
.mslq-row-btns{display:flex;gap:10px;margin-top:10px;flex-wrap:wrap}
.mslq-order{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:14px;padding:14px 16px;border-radius:14px;background:var(--mslq-g)}
.mslq-order strong{display:block;color:var(--mslq-n)}
.mslq-order small{color:#7a8a91}
.mslq-links{display:flex;flex-wrap:wrap;gap:18px;justify-content:center;margin-top:22px}
.mslq-links a{display:inline-flex;align-items:center;gap:6px;font-size:14px;font-weight:700;color:var(--mslq-d);text-decoration:none}
.mslq-links a:hover{color:var(--mslq-c)}

/* estado (mi cuenta / tarjeta) */
.mslq-status{display:inline-flex;align-items:center;gap:6px;padding:4px 11px;border-radius:99px;font-size:12px;font-weight:700;color:var(--st);background:color-mix(in srgb,var(--st) 12%,#fff)}
.mslq-status::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--st)}
.mslq-account .mslq-btn{margin:2px 0}
.mslq-link{font-weight:700;color:var(--mslq-d)}

/* ---------- responsive ---------- */
@media (max-width:900px){
	.mslq-layout{grid-template-columns:1fr}
	.mslq-form{position:static}
}
@media (max-width:640px){
	.mslq-steps i{display:none}
	.mslq-row{grid-template-columns:64px minmax(0,1fr) 34px;grid-template-areas:"img info rm" "qty qty qty";gap:10px 12px}
	.mslq-thumb{grid-area:img}.mslq-thumb img{width:64px;height:64px}
	.mslq-info{grid-area:info}.mslq-remove{grid-area:rm;width:34px;height:34px}
	.mslq-row>.mslq-qty{grid-area:qty;justify-self:start}
	.mslq-grid{grid-template-columns:1fr}
	.mslq-form{padding:0 16px 18px}.mslq-form-head{margin:0 -16px 18px;padding:18px 16px}
	.mslq-card-head{padding:24px 20px 20px}.mslq-card-head h2{font-size:27px}
	.mslq-card-meta{align-items:flex-start}
	.mslq-card-body{padding:18px 18px 24px}
	.mslq-line{gap:12px;flex-wrap:wrap}
	.mslq-line-img{width:56px;height:56px}
	.mslq-line-info{flex:1 1 calc(100% - 120px)}
	.mslq-line-price{flex:1 0 100%;flex-direction:row;align-items:baseline;justify-content:flex-end;gap:8px}
	.mslq-actions .mslq-accept,.mslq-actions .mslq-reject-open{font-size:14px;letter-spacing:.02em}
	.mslq-totals .mslq-total dd{font-size:22px}
	.mslq-float{left:12px;bottom:12px}
	.mslq-float .mslq-counter span{display:none}
}
