/**
 * Estudio Ideas QR — estilos del frontend público.
 * Diseño tipo aplicación SaaS moderna, independiente del theme de WordPress.
 * @version 1.3.0
 */

/* Fuente Outfit autohospedada (OFL-1.1), para que los títulos se vean
   consistentes sin depender de que el theme la tenga cargada. */
@font-face {
	font-family: 'EI Outfit';
	src: url('../fonts/outfit-latin-600-normal.woff2') format('woff2'),
		 url('../fonts/outfit-latin-600-normal.woff') format('woff');
	font-weight: 600;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'EI Outfit';
	src: url('../fonts/outfit-latin-700-normal.woff2') format('woff2'),
		 url('../fonts/outfit-latin-700-normal.woff') format('woff');
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'EI Outfit';
	src: url('../fonts/outfit-latin-800-normal.woff2') format('woff2'),
		 url('../fonts/outfit-latin-800-normal.woff') format('woff');
	font-weight: 800;
	font-style: normal;
	font-display: swap;
}

.ei-qr-app {
	--ei-primary: #EF034E;
	--ei-secondary: #373E48;
	--ei-dark: #252A34;
	--ei-white: #FFFFFF;
	--ei-bg: #F6F6F8;
	--ei-border: #E4E4E8;
	--ei-radius: 16px;
	--ei-shadow: 0 8px 30px rgba(37, 42, 52, 0.08);

	all: initial;
	display: block;
	box-sizing: border-box;
	font-family: 'DM Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	color: var(--ei-dark);
	background: var(--ei-bg);
	border-radius: 24px;
	padding: clamp(24px, 5vw, 56px);
	max-width: 960px;
	margin: 0 auto;
	line-height: 1.5;
}

.ei-qr-app *,
.ei-qr-app *::before,
.ei-qr-app *::after {
	box-sizing: border-box;
}

/* Refuerzo defensivo: algunos temas/page builders resetean "display" en
   todos los elementos, lo que puede anular el atributo nativo [hidden].
   Esta regla garantiza que los pasos ocultos del diseñador permanezcan
   ocultos sin importar el CSS del tema. */
.ei-qr-app [hidden] {
	display: none !important;
}

.ei-qr-app h1, .ei-qr-app h2, .ei-qr-app h3, .ei-qr-app p, .ei-qr-app label, .ei-qr-app span, .ei-qr-app button, .ei-qr-app input, .ei-qr-app select, .ei-qr-app textarea {
	font-family: inherit;
	margin: 0;
}

.ei-qr-app .ei-qr-hero-title {
	font-family: 'EI Outfit', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

/* ---------- Portada + selección de tipo (vista unificada) ---------- */
.ei-qr-landing {
	text-align: center;
	padding: clamp(28px, 5vw, 48px) 16px clamp(36px, 5vw, 56px);
	background: var(--ei-white);
	border: 1.5px solid var(--ei-border);
	border-radius: var(--ei-radius);
}
.ei-qr-hero-badge {
	display: inline-block;
	background: #FEECF1;
	color: var(--ei-primary);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	padding: 6px 14px;
	border-radius: 999px;
	margin-bottom: 20px;
}
.ei-qr-hero-title {
	font-family: 'EI Outfit', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	font-size: 54px;
	font-weight: 600;
	line-height: 66px;
	letter-spacing: 0;
	margin: 0;
	color: #000000;
	text-transform: none;
}
.ei-qr-hero-subtitle {
	font-size: clamp(15px, 2vw, 17px);
	color: #5B6068;
	max-width: 520px;
	margin: 0 auto 8px;
}

/* ---------- Botones ---------- */
.ei-qr-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	border: none;
	border-radius: 10px;
	padding: 12px 22px;
	font-size: 15px;
	font-weight: 700;
	cursor: pointer;
	transition: transform .15s ease, box-shadow .15s ease, opacity .15s ease;
}
.ei-qr-btn:active { transform: scale(0.98); }
.ei-qr-btn:disabled { opacity: 0.6; cursor: not-allowed; }
.ei-qr-btn--primary { background: var(--ei-primary); color: #fff; box-shadow: 0 6px 16px rgba(239,3,78,0.35); }
.ei-qr-btn--primary:hover { box-shadow: 0 8px 22px rgba(239,3,78,0.45); }
.ei-qr-btn--secondary { background: var(--ei-dark); color: #fff; }
.ei-qr-btn--ghost { background: transparent; color: var(--ei-secondary); border: 1px solid var(--ei-border); }
.ei-qr-btn--lg { padding: 16px 32px; font-size: 16px; border-radius: 12px; }
.ei-qr-btn--sm { padding: 8px 14px; font-size: 13px; }
.ei-qr-btn--block { width: 100%; }

/* ---------- Tarjetas / genérico ---------- */
.ei-qr-card {
	background: var(--ei-white);
	border: 1.5px solid var(--ei-border);
	border-radius: var(--ei-radius);
	box-shadow: var(--ei-shadow);
	padding: clamp(20px, 4vw, 40px);
	max-width: 520px;
	margin: 0 auto;
}
.ei-qr-card--center { text-align: center; }
.ei-qr-card h2 { font-size: 22px; font-weight: 800; margin-bottom: 8px; color: var(--ei-dark); text-align: center; }
.ei-qr-card > p.ei-qr-muted { text-align: center; }
.ei-qr-muted { color: #5B6068; font-size: 14.5px; }
.ei-qr-small { font-size: 12px; }

.ei-qr-step-title {
	text-align: center;
	font-size: clamp(20px, 3vw, 26px);
	font-weight: 800;
	margin: 32px 0 24px;
}

/* ---------- Formularios ---------- */
.ei-qr-field { display: block; margin-bottom: 16px; }
.ei-qr-field span { display: block; font-size: 13px; font-weight: 600; color: var(--ei-secondary); margin-bottom: 6px; }
.ei-qr-field input,
.ei-qr-field select,
.ei-qr-field textarea {
	width: 100%;
	border: 1.5px solid var(--ei-border);
	border-radius: 10px;
	padding: 11px 14px;
	font-size: 14px;
	background: #fff;
	color: var(--ei-dark);
	transition: border-color .15s ease;
}
.ei-qr-field input:focus,
.ei-qr-field select:focus,
.ei-qr-field textarea:focus {
	outline: none;
	border-color: var(--ei-primary);
}
.ei-qr-field textarea { min-height: 80px; resize: vertical; }
.ei-qr-field input[type="range"] { padding: 0; border: none; }
.ei-qr-field input[type="color"] { padding: 2px; height: 42px; cursor: pointer; }

.ei-qr-checkbox { display: flex; align-items: flex-start; gap: 10px; font-size: 13px; color: var(--ei-secondary); margin: 16px 0; cursor: pointer; }
.ei-qr-checkbox input { margin-top: 3px; }
.ei-qr-checkbox a { color: var(--ei-primary); text-decoration: underline; }

.ei-qr-form-message { font-size: 13px; min-height: 18px; margin: 8px 0; }
.ei-qr-form-message.is-error { color: var(--ei-primary); font-weight: 600; }
.ei-qr-form-message.is-ok { color: #16A34A; font-weight: 600; }

/* ---------- Espera de validación / confirmación ---------- */
.ei-qr-icon-circle {
	width: 64px;
	height: 64px;
	border-radius: 50%;
	background: var(--ei-bg);
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto 16px;
	color: var(--ei-primary);
}
.ei-qr-icon-circle svg { width: 28px; height: 28px; }
.ei-qr-icon-circle--ok { background: #E9F9EF; color: #16A34A; }
.ei-qr-spinner {
	width: 32px; height: 32px;
	border: 3px solid var(--ei-border);
	border-top-color: var(--ei-primary);
	border-radius: 50%;
	margin: 20px auto;
	animation: ei-qr-spin 0.8s linear infinite;
}
@keyframes ei-qr-spin { to { transform: rotate(360deg); } }

/* ---------- Selección de tipo ---------- */
.ei-qr-type-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
	gap: 14px;
}
.ei-qr-type-card {
	background: var(--ei-white);
	border: 1.5px solid var(--ei-border);
	border-radius: 14px;
	padding: 22px 12px;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
	font-size: 13px;
	font-weight: 700;
	color: var(--ei-dark);
	cursor: pointer;
	transition: border-color .15s ease, transform .15s ease, box-shadow .15s ease, background .15s ease;
}
.ei-qr-type-card:hover { border-color: var(--ei-primary); background: #FEF7F9; transform: translateY(-2px); box-shadow: var(--ei-shadow); }
.ei-qr-type-icon { color: var(--ei-primary); display: inline-flex; }
.ei-qr-type-icon svg { width: 26px; height: 26px; }

/* ---------- Diseñador ---------- */
.ei-qr-designer {
	display: grid;
	grid-template-columns: 1fr 340px;
	gap: 28px;
	align-items: start;
}
@media (max-width: 860px) {
	.ei-qr-designer { grid-template-columns: 1fr; }
}

.ei-qr-panel {
	background: var(--ei-white);
	border-radius: 14px;
	box-shadow: var(--ei-shadow);
	padding: 20px;
	margin-bottom: 18px;
}
.ei-qr-panel h3 { font-size: 14px; font-weight: 800; margin-bottom: 14px; text-transform: uppercase; letter-spacing: 0.03em; color: var(--ei-secondary); }

.ei-qr-color-row, .ei-qr-select-row {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(90px, 1fr));
	gap: 12px;
	margin-bottom: 14px;
}
.ei-qr-color-row label, .ei-qr-select-row label { font-size: 12px; font-weight: 600; color: var(--ei-secondary); display: block; }
.ei-qr-color-row input, .ei-qr-select-row select { margin-top: 6px; }

.ei-qr-presets {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 10px;
}
.ei-qr-preset-swatch {
	aspect-ratio: 1;
	border-radius: 10px;
	border: 1.5px solid var(--ei-border);
	cursor: pointer;
	overflow: hidden;
	padding: 4px;
	background: var(--ei-white);
	display: block;
}
.ei-qr-preset-swatch img { width: 100%; height: 100%; object-fit: contain; display: block; }
.ei-qr-preset-swatch:hover { border-color: var(--ei-primary); }

.ei-qr-designer-col--preview { position: relative; }
.ei-qr-preview-sticky {
	position: sticky;
	top: 30px;
	background: var(--ei-white);
	border-radius: 14px;
	box-shadow: var(--ei-shadow);
	padding: 24px;
	text-align: center;
}
.ei-qr-preview-box {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 280px;
	margin-bottom: 14px;
}
.ei-qr-preview-box canvas, .ei-qr-preview-box svg { max-width: 100%; height: auto; border-radius: 8px; }
.ei-qr-preview-box--final { min-height: 260px; }

.ei-qr-scan-status { font-size: 12px; font-weight: 600; min-height: 16px; margin-bottom: 10px; }
.ei-qr-scan-status.is-ok { color: #16A34A; }
.ei-qr-scan-status.is-warning { color: var(--ei-primary); }

.ei-qr-export-row { margin: 14px 0; }
.ei-qr-export-row label { display: block; font-size: 12px; font-weight: 600; color: var(--ei-secondary); text-align: left; }
.ei-qr-export-row select { width: 100%; margin-top: 6px; border: 1.5px solid var(--ei-border); border-radius: 8px; padding: 9px; }

.ei-qr-download-row { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; margin: 20px 0 14px; }

.ei-qr-cta-subtext { text-align: center; font-size: 12px; color: #8a8f96; margin-top: 8px; }

.ei-qr-extra-actions { margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--ei-border); text-align: center; }
.ei-qr-extra-actions-label { text-transform: uppercase; letter-spacing: 0.04em; font-weight: 700; margin-bottom: 8px; }
.ei-qr-download-row--compact { margin: 0 0 14px; }

/* ---------- Ajustes específicos del contenedor .codigoqr1 (Elementor) ---------- */
.codigoqr1 .elementor-widget-container {
	padding-top: 0px !important;
	padding-bottom: 0px !important;
}
.codigoqr1 div#ei-qr-app {
	max-width: 1360px !important;
	padding-top: 40px !important;
	padding-bottom: 80px !important;
}
@media (min-width: 1366px) {
	.codigoqr1 div#ei-qr-app {
		min-width: 1300px !important;
	}
}
.codigoqr1 section.ei-qr-step.ei-qr-landing {
	padding-top: 40px;
	padding-left: 40px;
	padding-right: 40px;
	padding-bottom: 40px;
	margin-bottom: 10px;
}
.codigoqr1 .ei-qr-hero-badge {
	margin-bottom: 15px;
}
.codigoqr1 section.ei-qr-step.ei-qr-landing p {
	margin-left: auto;
	margin-right: auto;
}
.codigoqr1 h2.ei-qr-step-title {
	margin-top: 10px;
	margin-bottom: 15px;
}
.codigoqr1 .ei-qr-type-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
	gap: 10px;
}
.codigoqr1 button.ei-qr-type-card {
	padding-top: 15px;
	padding-bottom: 15px;
	border-radius: 10px;
	border: 1px solid #ddd;
	font-size: 15px;
}

/* Responsive */
@media (max-width: 480px) {
	.ei-qr-app { padding: 18px; border-radius: 16px; }
	.ei-qr-type-grid { grid-template-columns: repeat(2, 1fr); }
	.ei-qr-presets { grid-template-columns: repeat(4, 1fr); }
}

/* ---------- Flujo v1.4: pasos acumulativos + preview persistente ---------- */
.ei-qr-step--designer { margin-top: 24px; }
.ei-qr-step-number {
	display: inline-flex; align-items: center; justify-content: center;
	width: 28px; height: 28px; margin-right: 9px; border-radius: 50%;
	background: var(--ei-primary); color: #fff; font-weight: 800; font-size: 14px;
	vertical-align: middle; flex: 0 0 auto;
}
.ei-qr-step-help { color: #6b7078; font-size: 13px; margin: -5px 0 14px !important; }
.ei-qr-subtitle { font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; color: var(--ei-secondary); margin: 12px 0 10px; }
.ei-qr-preview-step, .ei-qr-email-export-title { display:flex; align-items:center; justify-content:center; margin-bottom:14px; font-family:'EI Outfit',sans-serif; }
.ei-qr-designer, .ei-qr-step--designer, .ei-qr-app { overflow: visible !important; }
.ei-qr-designer-col--preview { align-self: stretch; overflow: visible !important; }
.ei-qr-preview-sticky { position: sticky !important; top: 90px !important; z-index: 5; }
.ei-qr-preset-swatch.is-active { border-color: var(--ei-primary); box-shadow: 0 0 0 2px rgba(239,3,78,.12); }
.ei-qr-email-export { margin: 18px 0; padding: 16px; border: 1px solid var(--ei-border); border-radius: 12px; background: #fafafa; }
.ei-qr-email-export-form { display:grid; grid-template-columns: 1fr auto; gap: 8px; margin-top: 12px; }
.ei-qr-email-export-form input[type="email"] { min-width:0; border:1.5px solid var(--ei-border); border-radius:9px; padding:10px 12px; font-size:14px; }
.ei-qr-hp { position:absolute !important; left:-99999px !important; width:1px !important; height:1px !important; opacity:0 !important; }
.ei-qr-form-message.is-success { color:#15803d; font-weight:700; margin-top:10px; }
@media (max-width: 860px) {
	.ei-qr-preview-sticky { position: relative !important; top: auto !important; z-index: auto; }
	.ei-qr-email-export-form { grid-template-columns: 1fr; }
}

@media (max-width: 640px) {
	.ei-qr-hero-title { font-size: 38px; line-height: 46px; }
}
/* v1.4.2 refinamientos UX */
.ei-qr-step-title,.ei-qr-panel h3,.ei-qr-preview-step,.ei-qr-email-export-title{gap:9px!important}
.ei-qr-step-number{margin-right:0!important}
.ei-qr-type-grid{grid-template-columns:repeat(6,minmax(0,1fr))!important;gap:8px!important;max-width:900px;margin:0 auto}
.ei-qr-type-card,.codigoqr1 button.ei-qr-type-card{min-height:58px!important;padding:9px 6px!important;border-radius:9px!important;gap:5px!important;font-size:12px!important;background:#fff!important;color:#252A34!important;transform:none!important;box-shadow:none!important}
.ei-qr-type-card:hover{background:#f1f1f3!important;border-color:#c8c9cd!important;color:#252A34!important}
.ei-qr-type-card.is-active{background:#EF034E!important;border-color:#EF034E!important;color:#fff!important}
.ei-qr-type-card.is-active .ei-qr-type-icon{color:#fff!important}
.ei-qr-type-icon{font-size:16px;font-weight:800;line-height:1;color:#EF034E}
.ei-qr-prefix-input{display:flex;align-items:center;border:1.5px solid var(--ei-border);border-radius:9px;background:#fff;overflow:hidden}
.ei-qr-prefix-input>span{padding:0 0 0 12px;font-weight:700;color:#252A34}.ei-qr-prefix-input input{border:0!important;box-shadow:none!important;flex:1}
.ei-qr-frame-caption{width:280px;max-width:100%;margin:0 auto;padding:8px 12px;text-align:center;font-weight:700;line-height:1.15;border-radius:10px}
.ei-qr-preview-box+.ei-qr-frame-caption{margin-top:8px}.ei-qr-frame-caption+.ei-qr-preview-box{margin-top:8px}
[data-action="save-and-unlock"]{background:#EF034E!important;color:#fff!important}
@media(max-width:760px){.ei-qr-type-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}}
@media(max-width:480px){.ei-qr-type-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}}

/* v1.4.3: selector de formato y tamaño de descarga */
.ei-qr-export-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
@media(max-width:520px){.ei-qr-export-grid{grid-template-columns:1fr;}}

/* v1.4.4: categorías, URL protegida, frase con flecha y sticky reforzado */
.ei-qr-type-card,
.codigoqr1 button.ei-qr-type-card{
  border-color:#373E48!important;
  color:#373E48!important;
  background:#fff!important;
}
.ei-qr-type-card .ei-qr-type-icon{
  color:#373E48!important;
  font-size:17px!important;
  min-height:18px;
  display:flex;
  align-items:center;
  justify-content:center;
}
.ei-qr-type-card .ei-qr-type-icon i{font-size:17px;line-height:1}
.ei-qr-type-card:hover{
  border-color:#EF034E!important;
  color:#EF034E!important;
  background:#fff!important;
}
.ei-qr-type-card:hover .ei-qr-type-icon{color:#EF034E!important}
.ei-qr-type-card.is-active,
.codigoqr1 button.ei-qr-type-card.is-active{
  background:#EF034E!important;
  border-color:#EF034E!important;
  color:#fff!important;
}
.ei-qr-type-card.is-active .ei-qr-type-icon{color:#fff!important}
.ei-qr-type-grid{max-width:920px!important}

.ei-qr-prefix-input{border-color:#373E48!important}
.ei-qr-prefix-input:focus-within{border-color:#EF034E!important;box-shadow:0 0 0 2px rgba(239,3,78,.08)}
.ei-qr-prefix-input>span{padding:0 2px 0 13px!important;color:#373E48!important;white-space:nowrap;font-weight:700!important;margin:0!important}
.ei-qr-prefix-input input{padding-left:4px!important}

.ei-qr-frame-caption{
  display:flex!important;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:46px;
  padding:7px 12px!important;
  overflow:hidden;
}
.ei-qr-caption-arrow{width:46px;height:34px;flex:0 0 46px;overflow:visible}
.ei-qr-caption-arrow.is-top{transform:scaleY(-1);transform-origin:center}
.ei-qr-caption-text{display:block!important;line-height:1.08;white-space:normal}
.ei-qr-arrow-toggle{margin:8px 0 12px!important}
[data-role="frame-arrow-options"] input[type="color"]{width:100%;height:38px;margin-top:6px}

/* Fallback JS: evita que el paso 4 desaparezca cuando Woodmart/Elementor
   anulan sticky mediante overflow o transform en un ancestro. */
.ei-qr-preview-sticky.ei-qr-preview-fixed{
  position:fixed!important;
  top:140px!important;
  left:var(--ei-fixed-left)!important;
  width:var(--ei-fixed-width)!important;
  z-index:5!important;
}
.codigoqr1,
.codigoqr1 .elementor-widget-container,
.codigoqr1 .elementor-widget-shortcode,
.codigoqr1 .elementor-shortcode{
  overflow:visible!important;
}

@media(max-width:760px){
  .ei-qr-type-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;max-width:100%!important}
}
@media(max-width:480px){
  .ei-qr-type-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .ei-qr-caption-arrow{width:38px;height:28px;flex-basis:38px}
}

/* v1.4.5: workspace definitivo — pasos a la izquierda, QR persistente a la derecha */
.ei-qr-workspace{
  display:grid;
  grid-template-columns:minmax(0,1fr) 320px;
  gap:24px;
  align-items:start;
}
.ei-qr-workspace-main{min-width:0}
.ei-qr-workspace-main .ei-qr-landing{margin-top:0!important}
.ei-qr-workspace-main .ei-qr-designer{display:block!important}
.ei-qr-workspace-main .ei-qr-designer-col--form{width:100%!important}
.ei-qr-workspace-preview{position:relative;align-self:stretch;min-width:0}
.ei-qr-workspace-preview .ei-qr-preview-sticky{
  position:sticky!important;
  top:140px!important;
  z-index:5;
  padding:20px!important;
}
.ei-qr-preview-label{
  font-family:'EI Outfit',sans-serif;
  font-size:14px;
  font-weight:600;
  color:#373E48;
  margin-bottom:10px;
  text-align:left;
}
.ei-qr-workspace-preview .ei-qr-preview-box{min-height:260px;margin-bottom:6px}
.ei-qr-download-panel{margin-top:16px}
@media(max-width:860px){
  .ei-qr-workspace{display:flex;flex-direction:column;gap:18px}
  .ei-qr-workspace-preview{order:-1;width:100%}
  .ei-qr-workspace-preview .ei-qr-preview-sticky{position:relative!important;top:auto!important;max-width:360px;margin:0 auto;width:100%}
  .ei-qr-workspace-main{width:100%}
}


/* v1.4.6: interacción de categorías EI */
.ei-qr-type-card,
.codigoqr1 button.ei-qr-type-card {
  background: transparent !important;
  border: 1px solid #373E48 !important;
  color: #373E48 !important;
}
.ei-qr-type-card .ei-qr-type-icon,
.ei-qr-type-card .ei-qr-type-icon i,
.ei-qr-type-card > span:last-child {
  color: #373E48 !important;
}
.ei-qr-type-card:hover,
.codigoqr1 button.ei-qr-type-card:hover {
  background: transparent !important;
  border-color: #EF034E !important;
  color: #EF034E !important;
}
.ei-qr-type-card:hover .ei-qr-type-icon,
.ei-qr-type-card:hover .ei-qr-type-icon i,
.ei-qr-type-card:hover > span:last-child {
  color: #EF034E !important;
}
.ei-qr-type-card.is-active,
.codigoqr1 button.ei-qr-type-card.is-active,
.ei-qr-type-card.is-active:hover,
.codigoqr1 button.ei-qr-type-card.is-active:hover {
  background: #EF034E !important;
  border-color: #EF034E !important;
  color: #fff !important;
}
.ei-qr-type-card.is-active .ei-qr-type-icon,
.ei-qr-type-card.is-active .ei-qr-type-icon i,
.ei-qr-type-card.is-active > span:last-child,
.ei-qr-type-card.is-active:hover .ei-qr-type-icon,
.ei-qr-type-card.is-active:hover .ei-qr-type-icon i,
.ei-qr-type-card.is-active:hover > span:last-child {
  color: #fff !important;
}

/* v1.4.7: descarga bajo la vista previa */
.ei-qr-workspace-preview > .ei-qr-download-panel{max-width:360px;margin:14px auto 0;width:100%}
.ei-qr-workspace-preview > .ei-qr-download-panel[hidden]{display:none!important}
@media(max-width:860px){.ei-qr-workspace-preview > .ei-qr-download-panel{max-width:360px}}

/* v1.4.9: frase/flecha horizontal y panel derecho completo sticky */
.ei-qr-frame-caption{transform:none!important;flex-direction:row!important;align-items:center!important;justify-content:center!important;}
.ei-qr-caption-text{transform:none!important;font-style:normal;writing-mode:horizontal-tb!important;}
.ei-qr-caption-arrow{width:52px;height:38px;flex:0 0 52px;transform:none!important;}
/* Frase abajo: flecha sube hacia el QR. Frase arriba: se invierte verticalmente y baja hacia el QR. */
.ei-qr-caption-arrow.is-bottom{transform:rotate(180deg)!important;}
.ei-qr-caption-arrow.is-top{transform:none!important;}
.ei-qr-workspace-preview .ei-qr-preview-sticky{top:112px!important;z-index:4!important;}
.ei-qr-workspace-preview .ei-qr-download-panel{margin:14px 0 0!important;}
@media(max-width:860px){.ei-qr-caption-arrow{width:44px;height:32px;flex-basis:44px}.ei-qr-workspace-preview .ei-qr-download-panel{margin-top:14px!important;}}

/* v1.5.0: separación real bajo header sticky + flecha EI exacta */
@media(min-width:861px){
  .ei-qr-workspace-preview .ei-qr-preview-sticky{
    top:140px!important; /* header sticky + 30px de aire */
    z-index:20!important;
  }
}
.ei-qr-caption-arrow--brand{
  display:block;
  width:52px;
  height:38px;
  flex:0 0 52px;
  background:var(--ei-arrow-color,#EF034E);
  -webkit-mask:url('../img/ei-arrow-mask.png') center/contain no-repeat;
  mask:url('../img/ei-arrow-mask.png') center/contain no-repeat;
  transform:scaleX(-1)!important;
  transform-origin:center!important;
}
.ei-qr-caption-arrow--brand.is-bottom{
  transform:scaleX(-1) rotate(180deg)!important;
}
.ei-qr-caption-arrow--simple.is-top{transform:none!important}
.ei-qr-caption-arrow--simple.is-bottom{transform:rotate(180deg)!important}
@media(max-width:860px){
  .ei-qr-caption-arrow--brand{width:44px;height:32px;flex-basis:44px}
}

/* v1.5.1 — columna de vista previa/descarga siempre disponible */
.ei-qr-preview-sticky .ei-qr-download-panel { display:block !important; visibility:visible !important; opacity:1 !important; }
.ei-qr-preview-sticky .ei-qr-download-panel[hidden] { display:block !important; }
@media (min-width:861px){
  .ei-qr-preview-sticky { top:30px; }
}
\n\n/* v1.5.2 — flechas según referencia del cliente + marco adaptativo */
.ei-qr-frame-caption.has-arrow{
  min-height:72px!important;
  padding:8px 14px!important;
  justify-content:flex-start!important;
  gap:10px!important;
}
.ei-qr-frame-caption.has-arrow .ei-qr-caption-arrow--brand{
  width:72px!important;
  height:56px!important;
  flex:0 0 72px!important;
  transform-origin:center!important;
}
/* Texto ARRIBA del QR: flecha curva apunta hacia ABAJO-IZQUIERDA. */
.ei-qr-frame-caption.arrow-top .ei-qr-caption-arrow--brand{
  transform:rotate(180deg)!important;
}
.ei-qr-frame-caption.arrow-top .ei-qr-caption-text{
  align-self:flex-start!important;
  margin-top:2px!important;
}
/* Texto ABAJO del QR: flecha curva apunta hacia ARRIBA-IZQUIERDA. */
.ei-qr-frame-caption.arrow-bottom .ei-qr-caption-arrow--brand{
  transform:scaleX(-1)!important;
}
.ei-qr-frame-caption.arrow-bottom .ei-qr-caption-text{
  align-self:flex-end!important;
  margin-bottom:2px!important;
}
@media(max-width:860px){
  .ei-qr-frame-caption.has-arrow{min-height:66px!important;padding:7px 10px!important}
  .ei-qr-frame-caption.has-arrow .ei-qr-caption-arrow--brand{width:62px!important;height:50px!important;flex-basis:62px!important}
}

/* v1.5.4 — orientación y composición de flechas fijadas a la referencia */
.ei-qr-frame-caption.has-arrow{
  position:relative!important;
  display:block!important;
  min-height:82px!important;
  height:82px!important;
  padding:0!important;
  overflow:hidden!important;
}
.ei-qr-frame-caption.has-arrow .ei-qr-caption-arrow--brand{
  position:absolute!important;
  left:12px!important;
  width:78px!important;
  height:66px!important;
  margin:0!important;
  flex:none!important;
  transform-origin:center center!important;
}
.ei-qr-frame-caption.has-arrow .ei-qr-caption-text{
  position:absolute!important;
  left:92px!important;
  right:12px!important;
  width:auto!important;
  margin:0!important;
  line-height:1.08!important;
  text-align:center!important;
  white-space:nowrap!important;
}
/* ARRIBA: exactamente como referencia superior: punta ABAJO-IZQUIERDA; texto ARRIBA. */
.ei-qr-frame-caption.arrow-top .ei-qr-caption-arrow--brand{
  top:8px!important;
  bottom:auto!important;
  transform:rotate(180deg)!important;
}
.ei-qr-frame-caption.arrow-top .ei-qr-caption-text{
  top:7px!important;
  bottom:auto!important;
}
/* ABAJO: exactamente como referencia inferior: punta ARRIBA-IZQUIERDA; texto ABAJO. */
.ei-qr-frame-caption.arrow-bottom .ei-qr-caption-arrow--brand{
  top:8px!important;
  bottom:auto!important;
  transform:scaleX(-1)!important;
}
.ei-qr-frame-caption.arrow-bottom .ei-qr-caption-text{
  top:auto!important;
  bottom:7px!important;
}
@media(max-width:860px){
  .ei-qr-frame-caption.has-arrow{min-height:76px!important;height:76px!important}
  .ei-qr-frame-caption.has-arrow .ei-qr-caption-arrow--brand{left:9px!important;width:68px!important;height:58px!important}
  .ei-qr-frame-caption.has-arrow .ei-qr-caption-text{left:78px!important;right:9px!important}
}

/* v1.5.4 — flechas tomadas de la referencia exacta: sin rotaciones ni espejos */
.ei-qr-frame-caption.has-arrow .ei-qr-caption-arrow--brand{
  transform:none!important;
  background:var(--ei-arrow-color,#EF034E)!important;
  -webkit-mask-size:contain!important;
  mask-size:contain!important;
  -webkit-mask-position:center!important;
  mask-position:center!important;
  -webkit-mask-repeat:no-repeat!important;
  mask-repeat:no-repeat!important;
}
/* Texto ARRIBA: curva hacia AFUERA y punta abajo-izquierda. */
.ei-qr-frame-caption.arrow-top .ei-qr-caption-arrow--brand{
  -webkit-mask-image:url('../img/ei-arrow-top.png')!important;
  mask-image:url('../img/ei-arrow-top.png')!important;
  transform:none!important;
}
/* Texto ABAJO: curva hacia AFUERA y punta arriba-izquierda. */
.ei-qr-frame-caption.arrow-bottom .ei-qr-caption-arrow--brand{
  -webkit-mask-image:url('../img/ei-arrow-bottom.png')!important;
  mask-image:url('../img/ei-arrow-bottom.png')!important;
  transform:none!important;
}

/* v1.5.5 — ajuste libre de flecha/texto + flecha vectorial nítida */
.ei-qr-adjust-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 14px;margin-top:12px}
.ei-qr-adjust-grid label{font-size:12px;font-weight:600;color:#4b515b}
.ei-qr-adjust-grid input[type="range"]{display:block;width:100%;margin-top:6px}
.ei-qr-frame-caption.has-arrow{overflow:hidden!important;min-height:82px!important;height:82px!important}
.ei-qr-frame-caption.has-arrow .ei-qr-caption-arrow--brand{
 left:var(--ei-arrow-x,12px)!important;top:var(--ei-arrow-y,8px)!important;
 width:var(--ei-arrow-size,58px)!important;height:calc(var(--ei-arrow-size,58px) * .794)!important;
 flex-basis:auto!important;transform:none!important;
}
.ei-qr-frame-caption.arrow-top .ei-qr-caption-arrow--brand{-webkit-mask-image:url('../img/ei-arrow-top.svg')!important;mask-image:url('../img/ei-arrow-top.svg')!important}
.ei-qr-frame-caption.arrow-bottom .ei-qr-caption-arrow--brand{-webkit-mask-image:url('../img/ei-arrow-bottom.svg')!important;mask-image:url('../img/ei-arrow-bottom.svg')!important}
.ei-qr-frame-caption.has-arrow .ei-qr-caption-text{transform:translate(var(--ei-text-x,0px),var(--ei-text-y,0px))!important}
@media(max-width:860px){.ei-qr-adjust-grid{grid-template-columns:1fr}.ei-qr-frame-caption.has-arrow .ei-qr-caption-arrow--brand{width:var(--ei-arrow-size,58px)!important;height:calc(var(--ei-arrow-size,58px) * .794)!important;left:var(--ei-arrow-x,12px)!important;top:var(--ei-arrow-y,8px)!important}}