/* H2 · Generador de QR para la carta (SEO-PLAN.md §2.d, W3.2): app/views/seo/herramientas/generador-qr.php.
   En pantalla, el formulario y el resultado sobre el papel de la herramienta (tokens de landing.css) con la hoja A4 en
   miniatura; al imprimir, solo .imprimible: la hoja A4 vertical con 1, 2, 4, 6 u 8 códigos y líneas de corte. */

.gq{--gq-tinta:var(--papel-tinta,#2a1a12);--gq-tinta-2:var(--papel-tinta-2,#5c4433);--gq-raya:var(--papel-borde,#e2d1b5);--gq-acento:var(--almagre,#a8321c);color:var(--gq-tinta)}
.gq [hidden]{display:none!important}
.gq-defs{position:absolute;width:0;height:0;overflow:hidden}

/* ---------- formulario ---------- */
.gq-form{display:grid;gap:20px}
.gq-campo{display:grid;gap:7px;min-width:0}
.gq-etiqueta{font-size:.74rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--gq-acento)}
.gq .gq-url[type=url]{width:100%;min-height:58px;padding:12px 18px;border:1.5px solid var(--gq-raya);border-radius:14px;background:#fff;color:var(--gq-tinta);font:500 1.08rem/1.3 var(--sans)}
.gq .gq-url[type=url]::placeholder{color:var(--gq-tinta-2);opacity:.6}
.gq .gq-url[type=url]:focus{outline:2px solid var(--gq-acento);outline-offset:2px;border-color:var(--gq-acento)}
.gq .gq-url[aria-invalid=true]{border-color:var(--gq-acento);background:#fffaf8}
.gq-ayuda{margin:0;font-size:.86rem;line-height:1.45;color:var(--gq-tinta-2)}
.gq-error{margin:2px 0 0;padding:10px 14px;border-left:3px solid var(--gq-acento);border-radius:0 10px 10px 0;background:rgba(168,50,28,.07);font-size:.95rem;font-weight:650;color:var(--gq-acento)}
.gq-fila{display:flex;flex-wrap:wrap;align-items:flex-end;gap:14px 16px}
.gq-fila .gq-campo{flex:1 1 250px}
.gq .gq-select{width:100%;min-height:52px;padding:10px 14px;border:1.5px solid var(--gq-raya);border-radius:12px;background:#fff;color:var(--gq-tinta);font:500 1rem/1.2 var(--sans)}
.gq .gq-select:focus{outline:2px solid var(--gq-acento);outline-offset:2px}
.gq .gq-crear{flex:0 0 auto;min-height:52px;margin-top:0}

/* ---------- resultado ---------- */
.gq-resultado{display:grid;gap:26px;margin-top:32px;padding-top:30px;border-top:2px dashed var(--gq-raya)}
.gq-qr{width:min(68vw,250px);margin:0 auto;padding:8px;background:#fff;border:1px solid var(--gq-raya);border-radius:16px;box-shadow:0 22px 44px -28px rgba(42,26,18,.6)}
.gq-qr svg{display:block;width:100%;height:auto}
.gq-resultado__texto p{margin:0}
.gq-listo{font-family:var(--serif);font-size:clamp(1.5rem,1.2rem + 1vw,1.9rem);font-weight:650;line-height:1.08}
.gq-destino{margin-top:10px!important;font-size:.95rem;color:var(--gq-tinta-2);overflow-wrap:anywhere}
.gq-destino span{font-family:ui-monospace,'Cascadia Mono',Menlo,Consolas,monospace;font-size:.9em;color:var(--gq-tinta)}
.gq-consejo{margin-top:6px!important;font-size:.92rem;color:var(--gq-tinta-2)}
.gq-acciones{display:flex;flex-wrap:wrap;gap:10px 12px;margin-top:20px}
.gq-acciones .boton{margin-top:0}
.gq .boton--linea{color:var(--gq-tinta);border-color:var(--gq-raya);background:transparent}
/* .herramienta__marco a (landing.css) pinta los enlaces en almagre: los botones-enlace conservan su color */
.gq a.boton--oro{color:#241a06}
.gq a.boton--linea{color:var(--gq-tinta)}
.gq .boton--linea:hover{border-color:var(--gq-acento)}
.gq-nota{margin-top:14px!important;max-width:60ch;font-size:.88rem;line-height:1.5;color:var(--gq-tinta-2)}
.gq kbd{display:inline-block;min-width:1.6em;padding:0 .35em;border:1px solid var(--gq-raya);border-bottom-width:2px;border-radius:5px;background:#fff;font:600 .82em/1.45 var(--sans);text-align:center;color:var(--gq-tinta)}
/* la hoja en miniatura, sobre una mesa de corte */
.gq-vista{display:flex;justify-content:center;padding:22px 12px;border-radius:16px;background:radial-gradient(circle,rgba(42,26,18,.09) 1px,transparent 1.5px) 0 0/14px 14px,#efe3cc;overflow:hidden}
.gq-vista .gq-hoja{zoom:.4;box-shadow:0 2px 0 rgba(42,26,18,.08),0 30px 60px -30px rgba(42,26,18,.7)}

/* ---------- la hoja A4 (190 × 276 mm útiles): la misma en pantalla y en papel ---------- */
.gq-hoja{width:190mm;height:276mm;display:grid;grid-template-columns:1fr;grid-template-rows:1fr;background:#fff;color:#111;font-family:var(--sans,system-ui,sans-serif)}
.gq-hoja--n2{grid-template-rows:repeat(2,1fr)}
.gq-hoja--n4{grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(2,1fr)}
.gq-hoja--n6{grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(3,1fr)}
.gq-hoja--n8{grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(4,1fr)}
.gq-tarjeta{min-width:0;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--gap);padding:5mm;text-align:center;border:.25mm dashed #b5b5b5;overflow:hidden;break-inside:avoid}
.gq-tarjeta__qr{flex:none;width:var(--qr);height:var(--qr);line-height:0}
.gq-tarjeta__qr svg{display:block;width:100%;height:100%}
.gq-tarjeta__texto{min-width:0}
.gq-tarjeta__texto p{margin:0}
.gq-tarjeta__cta{font-family:var(--serif,Georgia,serif);font-weight:700;font-size:var(--c);line-height:1.12;color:#111}
.gq-tarjeta__en{margin-top:.8mm!important;font-size:var(--e);font-style:italic;color:#4a4a4a}
.gq-tarjeta__url{margin-top:2mm!important;font-size:var(--u);line-height:1.25;color:#333;overflow-wrap:anywhere;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden}
.gq-hoja--n1{--qr:160mm;--c:30pt;--e:16pt;--u:12pt;--gap:8mm}
.gq-hoja--n2{--qr:95mm;--c:20pt;--e:12pt;--u:9.5pt;--gap:4mm}
.gq-hoja--n4{--qr:74mm;--c:15pt;--e:10pt;--u:8pt;--gap:3mm}
.gq-hoja--n6{--qr:54mm;--c:12pt;--e:8.5pt;--u:7pt;--gap:2.5mm}
.gq-hoja--n8{--qr:48mm;--c:11pt;--e:8.5pt;--u:7pt;--gap:4mm}
.gq-hoja--n8 .gq-tarjeta{flex-direction:row;justify-content:flex-start;text-align:left}

@media (min-width:768px){
  .gq-resultado{grid-template-columns:minmax(0,260px) minmax(0,1fr);align-items:center;column-gap:40px}
  .gq-vista{grid-column:1/-1;padding:30px}
  .gq-vista .gq-hoja{zoom:.5}
}

/* ========================================== IMPRESIÓN ========================================== */
@media print{
  @page{size:A4 portrait;margin:10mm}
  html,body{background:#fff!important;color:#000!important}
  /* Solo sale .imprimible: lo demás desaparece y sus antepasados se quedan sin caja propia (sin márgenes, fondos ni sombras) */
  body *:not(.imprimible,.imprimible *,:has(.imprimible)){display:none!important}
  body *:has(.imprimible){display:block!important;position:static!important;width:auto!important;max-width:none!important;height:auto!important;min-height:0!important;margin:0!important;padding:0!important;border:0!important;background:none!important;box-shadow:none!important;transform:none!important;translate:none!important;rotate:none!important;scale:none!important;opacity:1!important;filter:none!important;animation:none!important;overflow:visible!important;container-type:normal!important}
  .gq-hoja,.gq-vista .gq-hoja{zoom:1!important;box-shadow:none!important;break-inside:avoid;page-break-inside:avoid;-webkit-print-color-adjust:exact;print-color-adjust:exact}
}