/* Innfortec Cloud — área de clientes (tema claro de marca). */
:root{--cl-orange:#F36C21;--cl-orange-dk:#d65c16;--cl-navy:#2B307E;--cl-navy-dk:#21255f;
  --cl-text:#231F20;--cl-muted:#6b7280;--cl-bg:#F6F7FB;--cl-surface:#fff;--cl-border:#e5e7eb;
  --cl-radius:12px;--cl-shadow:0 1px 3px rgba(16,24,40,.06),0 6px 20px rgba(16,24,40,.05)}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{font-family:'DM Sans',system-ui,sans-serif;color:var(--cl-text);background:var(--cl-bg);margin:0;overflow-x:hidden;
  background-image:radial-gradient(circle,rgba(43,48,126,.04) 1px,transparent 1px);background-size:24px 24px}
.cl-empresa{font-weight:700;color:var(--cl-navy);display:inline-flex;align-items:center;gap:.3rem}
.cl-main img,.cl-main canvas,.cl-main embed{max-width:100%}
a{color:var(--cl-navy);text-decoration:none}a:hover{color:var(--cl-orange)}
.cl-header{background:var(--cl-surface);border-bottom:1px solid var(--cl-border);position:sticky;top:0;z-index:50}
.cl-header-in{max-width:960px;margin:0 auto;padding:.8rem 1.25rem;display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.cl-brand{font-weight:700;font-size:1.15rem;color:var(--cl-navy);display:inline-flex;align-items:center;gap:.5rem}
.cl-brand:hover{color:var(--cl-navy)}
.cl-dot{width:14px;height:14px;border-radius:50%;background:var(--cl-orange)}
.cl-sub{color:var(--cl-orange);font-weight:600;font-size:.95rem}
.cl-nav{display:flex;align-items:center;gap:.6rem;color:var(--cl-muted);font-size:.9rem;flex-wrap:wrap}
.cl-ic{width:15px;height:15px;vertical-align:-2px}
.cl-main{max-width:960px;margin:0 auto;padding:2rem 1.25rem 3rem}
.cl-btn{display:inline-flex;align-items:center;gap:.4rem;background:var(--cl-orange);color:#fff;border:none;border-radius:10px;padding:.6rem 1.1rem;font-weight:600;cursor:pointer;text-decoration:none}
.cl-btn:hover{background:var(--cl-orange-dk);color:#fff}
.cl-btn-block{width:100%;justify-content:center}
.cl-btn-ghost{display:inline-flex;align-items:center;gap:.4rem;color:var(--cl-navy);border:1px solid var(--cl-border);background:#fff;border-radius:10px;padding:.5rem .9rem;font-weight:500;font-size:.9rem;text-decoration:none}
.cl-btn-ghost:hover{border-color:var(--cl-orange);color:var(--cl-orange)}
.cl-card{background:var(--cl-surface);border:1px solid var(--cl-border);border-radius:var(--cl-radius);box-shadow:var(--cl-shadow);padding:1.6rem}
.cl-card-narrow{max-width:420px;margin:2rem auto}
.cl-title{font-size:1.5rem;font-weight:700;color:var(--cl-navy);margin:0 0 .35rem}
.cl-sub2{color:var(--cl-muted);margin:0 0 1.4rem}
.cl-field{margin-bottom:1rem}
.cl-label{display:block;font-size:.85rem;font-weight:600;margin-bottom:.35rem}
.cl-input{width:100%;padding:.65rem .85rem;border:1px solid var(--cl-border);border-radius:10px;font-size:.95rem;font-family:inherit}
.cl-input:focus{outline:none;border-color:var(--cl-orange);box-shadow:0 0 0 3px rgba(243,108,33,.15)}
input[type=file].cl-input{padding:.4rem;cursor:pointer;color:var(--cl-muted)}
input[type=file].cl-input::file-selector-button{background:var(--cl-navy);color:#fff;border:none;border-radius:8px;padding:.5rem 1rem;margin-right:.85rem;font-family:inherit;font-weight:600;font-size:.88rem;cursor:pointer;transition:background .15s}
input[type=file].cl-input::file-selector-button:hover{background:var(--cl-navy-dk)}
.cl-alert{padding:.8rem 1rem;border-radius:10px;font-size:.9rem;margin-bottom:1.2rem}
.cl-alert-error{background:#fef2f2;border:1px solid #fecaca;color:#b91c1c}
.cl-login-ic{width:58px;height:58px;border-radius:16px;background:linear-gradient(135deg,var(--cl-orange),#ff8a4d);display:flex;align-items:center;justify-content:center;color:#fff;margin:0 auto 1rem}
.cl-login-ic svg{width:28px;height:28px}
.cl-login-wrap{max-width:430px;margin:3rem auto}
.cl-login-hero{background:linear-gradient(135deg,var(--cl-navy),#3a3f9e);color:#fff;border-radius:16px 16px 0 0;padding:2.2rem 1.5rem 1.7rem;text-align:center}
.cl-login-hero .ic{width:60px;height:60px;border-radius:16px;background:rgba(255,255,255,.16);display:flex;align-items:center;justify-content:center;margin:0 auto .85rem}
.cl-login-hero .ic svg{width:30px;height:30px}
.cl-login-hero h1{margin:0;font-size:1.45rem;font-weight:700}
.cl-login-hero p{margin:.35rem 0 0;opacity:.85;font-size:.9rem}
.cl-login-body{background:#fff;border:1px solid var(--cl-border);border-top:none;border-radius:0 0 16px 16px;box-shadow:var(--cl-shadow);padding:1.7rem 1.6rem}
.cl-login-foot{text-align:center;color:var(--cl-muted);font-size:.78rem;margin-top:1.1rem}
.cl-login2{max-width:780px;margin:3rem auto;display:grid;grid-template-columns:1fr 1fr;border-radius:18px;overflow:hidden;box-shadow:0 12px 44px rgba(16,24,40,.14);border:1px solid var(--cl-border)}
@media(max-width:700px){.cl-login2{grid-template-columns:1fr;max-width:440px}}
.cl-login2-brand{background:linear-gradient(150deg,var(--cl-navy),#3a3f9e 70%,#4a50b8);color:#fff;padding:2.6rem 2rem;display:flex;flex-direction:column;justify-content:center;position:relative}
@media(max-width:700px){.cl-login2-brand{padding:2rem 1.5rem;text-align:center;align-items:center}}
.cl-login2-brand .ic{width:58px;height:58px;border-radius:16px;background:rgba(255,255,255,.16);display:flex;align-items:center;justify-content:center;margin-bottom:1rem}
.cl-login2-brand .ic svg{width:30px;height:30px}
.cl-login2-brand h2{margin:0 0 .4rem;font-size:1.55rem;font-weight:700}
.cl-login2-brand .tag{opacity:.85;margin:0 0 1.5rem;font-size:.92rem}
.cl-login2-feats{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:.7rem}
.cl-login2-feats li{display:flex;align-items:center;gap:.55rem;font-size:.88rem;opacity:.95}
.cl-login2-feats svg{width:17px;height:17px;flex:0 0 auto}
.cl-login2-form{background:#fff;padding:2.6rem 2rem}
@media(max-width:700px){.cl-login2-form{padding:1.9rem 1.5rem}}
.cl-login2-form h1{font-size:1.35rem;color:var(--cl-navy);margin:0 0 .3rem}
.cl-center{text-align:center}
.cl-panel-head{background:linear-gradient(135deg,var(--cl-navy),#3a3f9e);color:#fff;border-radius:16px;padding:1.6rem 1.5rem;margin-bottom:1.2rem}
.cl-panel-head h1{margin:0;font-size:1.5rem}
.cl-panel-head p{margin:.35rem 0 0;opacity:.85}
.cl-code-badge{display:inline-block;background:rgba(255,255,255,.18);padding:.2rem .6rem;border-radius:999px;font-family:monospace;font-size:.82rem}
.cl-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1rem;margin-bottom:1.2rem}
.cl-stat{background:#fff;border:1px solid var(--cl-border);border-radius:12px;box-shadow:var(--cl-shadow);padding:1.1rem 1.2rem;display:flex;align-items:center;gap:.9rem}
.cl-stat-ic{width:40px;height:40px;border-radius:10px;background:rgba(243,108,33,.12);color:var(--cl-orange);display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.cl-stat-ic svg{width:20px;height:20px}
.cl-stat .v{font-size:1.4rem;font-weight:700;color:var(--cl-navy);line-height:1}
.cl-stat .l{color:var(--cl-muted);font-size:.8rem;margin-top:.15rem}
.cl-section-t{font-size:1.05rem;font-weight:700;color:var(--cl-navy);margin:1.4rem 0 .7rem}
.cl-modules{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1rem;margin-top:.5rem}
.cl-mod{display:block;background:var(--cl-surface);border:1px solid var(--cl-border);border-radius:var(--cl-radius);box-shadow:var(--cl-shadow);padding:1.4rem;text-decoration:none;color:var(--cl-text);transition:border-color .15s}
.cl-mod:hover{border-color:var(--cl-orange);color:var(--cl-text)}
.cl-mod.disabled{opacity:.5;pointer-events:none}
.cl-mod-ic{width:44px;height:44px;border-radius:10px;background:rgba(43,48,126,.08);color:var(--cl-navy);display:flex;align-items:center;justify-content:center;margin-bottom:.7rem}
.cl-mod-ic svg{width:22px;height:22px}
.cl-mod h3{font-size:1.05rem;color:var(--cl-navy);margin:0 0 .25rem}
.cl-mod p{color:var(--cl-muted);font-size:.85rem;margin:0}
.cl-quota{background:var(--cl-surface);border:1px solid var(--cl-border);border-radius:var(--cl-radius);padding:1rem 1.2rem;box-shadow:var(--cl-shadow)}
.cl-quota-bar{height:10px;background:#eef2f6;border-radius:6px;overflow:hidden;margin-top:.5rem}
.cl-quota-fill{height:100%;background:var(--cl-orange)}
.cl-muted{color:var(--cl-muted)}
.cl-table{width:100%;border-collapse:collapse;font-size:.9rem}
.cl-table th,.cl-table td{padding:.55rem .6rem;border-bottom:1px solid var(--cl-border);text-align:left}
.cl-alert-ok{background:#f0fdf4;border:1px solid #bbf7d0;color:#15803d}
.cl-prod-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1rem}
.cl-prod{background:#fff;border:1px solid var(--cl-border);border-radius:12px;box-shadow:var(--cl-shadow);overflow:hidden;display:flex;flex-direction:column;transition:border-color .15s,transform .15s}
.cl-prod:hover{border-color:var(--cl-orange);transform:translateY(-2px)}
.cl-prod-thumb{width:100%;height:140px;object-fit:cover;background:#f3f4f6;display:flex;align-items:center;justify-content:center}
.cl-prod-pdf{color:var(--cl-navy)}.cl-prod-pdf svg{width:42px;height:42px}
.cl-prod-body{padding:.8rem;display:flex;flex-direction:column;gap:.4rem}
.cl-prod-name{font-weight:600;color:var(--cl-navy)}
.cl-qr{display:flex;justify-content:center;margin:.3rem 0}
.cl-qr img,.cl-qr canvas{display:block}
.cl-prod-link{font-size:.72rem;padding:.35rem .5rem}
.cl-prod-actions{display:flex;gap:.4rem;align-items:center;justify-content:space-between}
.cl-prod-actions form{margin:0}
.cl-prod-meta{display:flex;justify-content:space-between;font-size:.74rem;color:var(--cl-muted)}
.cl-prod-tag{display:inline-block;background:#eef2f6;color:var(--cl-navy);font-size:.68rem;font-weight:600;padding:.1rem .45rem;border-radius:999px}
.cl-qr-wrap{display:flex;flex-direction:column;align-items:center;gap:.2rem;margin:.2rem 0}
.cl-qr-dl{display:inline-flex;align-items:center;gap:.3rem;font-size:.72rem;color:var(--cl-navy);background:none;border:none;cursor:pointer;padding:.15rem .3rem}
.cl-qr-dl:hover{color:var(--cl-orange)}
.cl-qr-dl .cl-ic{width:13px;height:13px}
/* Modal descarga QR */
.cl-modal{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;padding:1.25rem;background:rgba(35,31,32,.5);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);opacity:0;visibility:hidden;transition:opacity .18s ease,visibility .18s ease}
.cl-modal.is-open{opacity:1;visibility:visible}
.cl-modal-box{width:100%;max-width:420px;background:var(--cl-surface);border-radius:var(--cl-radius);box-shadow:var(--cl-shadow);padding:1.6rem 1.6rem 1.3rem;text-align:center;transform:translateY(8px) scale(.98);transition:transform .18s ease}
.cl-modal.is-open .cl-modal-box{transform:none}
.cl-modal-ic{width:52px;height:52px;margin:0 auto .8rem;display:flex;align-items:center;justify-content:center;border-radius:50%;background:rgba(243,108,33,.12);color:var(--cl-orange)}
.cl-modal-ic i{width:26px;height:26px}
.cl-modal-box h3{margin:0 0 .3rem;font-size:1.15rem;color:var(--cl-text)}
.cl-qr-opts{display:grid;grid-template-columns:1fr 1fr;gap:.6rem;margin:1.1rem 0 1rem}
.cl-qr-opts button{display:flex;flex-direction:column;align-items:center;gap:.15rem;padding:.7rem .5rem;border:1px solid var(--cl-border);border-radius:10px;background:#fff;cursor:pointer;transition:border-color .15s ease,background .15s ease}
.cl-qr-opts button:hover{border-color:var(--cl-orange);background:rgba(243,108,33,.05)}
.cl-qr-opts button strong{font-size:.95rem;color:var(--cl-text)}
.cl-qr-opts button small{font-size:.7rem;color:var(--cl-muted)}
.cl-modal-cancel{margin-top:.2rem}
.cl-copy{cursor:pointer}
.cl-copy-ok{color:#15803d !important;border-color:#bbf7d0 !important}
.cl-prod-actions .cl-btn-ghost{padding:.35rem .6rem;font-size:.8rem}
.cl-prod-replace{display:flex;gap:.4rem;margin-top:.55rem;border-top:1px dashed var(--cl-border);padding-top:.55rem}
.cl-prod-replace input[type=file]{font-size:.7rem;padding:.2rem;flex:1;min-width:0}
.cl-prod-replace input[type=file]::file-selector-button{padding:.28rem .55rem;font-size:.72rem;margin-right:.5rem}
.cl-prod-replace .cl-btn-ghost{padding:.3rem .55rem;font-size:.76rem;white-space:nowrap}
.cl-pg-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:1rem}
.cl-pg{background:#fff;border:1px solid var(--cl-border);border-radius:12px;overflow:hidden;box-shadow:var(--cl-shadow);display:flex;flex-direction:column}
.cl-pg-thumb{width:100%;height:210px;object-fit:contain;background:#f3f4f6;display:flex;align-items:center;justify-content:center}
.cl-pg-thumb svg{width:48px;height:48px}
.cl-pg-foot{display:flex;flex-direction:column;gap:.55rem;padding:.7rem .8rem;font-size:.85rem}
.cl-pg-acts{display:flex;gap:.35rem;flex-wrap:wrap;align-items:center}
.cl-pg-acts .cl-btn-ghost{padding:.4rem .6rem;font-size:.82rem}
.cl-pg-acts form{margin:0}