/* ===== Layout de base ===== */
.avqr-wrap{display:flex;justify-content:center;padding:clamp(20px,5vw,56px) 16px}
.avqr-card{
  width:min(940px,100%);max-width:820px;background:#fff;border-radius:16px;
  box-shadow:0 10px 25px rgba(0,0,0,.06);padding:clamp(18px,3vw,32px);
  border:1px solid rgba(0,0,0,.06)
}
.avqr-label{display:inline-block;font-size:.95rem;font-weight:600;color:#334155;margin-bottom:10px}

/* Ligne input + bouton */
.avqr-row{display:grid;gap:10px}
.avqr-input{
  width:100%;height:52px;padding:0 16px;font-size:1rem;color:#0f172a;background:#fff;
  border:1px solid #e2e8f0;border-radius:12px;transition:box-shadow .2s,border-color .2s
}
.avqr-input::placeholder{color:#94a3b8}
.avqr-input:focus{outline:none;border-color:#94a3b8;box-shadow:0 0 0 4px rgba(59,130,246,.15)}
.avqr-btn{
  height:52px;padding:0 18px;border:none;border-radius:14px;background:#0ea5e9;color:#fff;
  font-weight:700;font-size:.98rem;cursor:pointer;transition:transform .06s,box-shadow .2s,background .2s;
  box-shadow:0 6px 16px rgba(14,165,233,.25);width:fit-content;justify-self:start
}
.avqr-btn:hover{background:#0284c7;box-shadow:0 8px 22px rgba(14,165,233,.32)}
.avqr-btn:active{transform:translateY(1px)}
@media (min-width:640px){
  .avqr-row{grid-template-columns:1fr auto}
  .avqr-btn{justify-self:end}
}
@media (max-width:480px){.avqr-wrap{padding-left:2.5%;padding-right:2.5%}}

/* ===== Preview ===== */
.avqr-preview{
  position:relative;margin-top:16px;display:flex;justify-content:center;align-items:center;
  padding:16px;min-height:220px;border:1px solid #e2e8f0;border-radius:14px;background:#f8fafc;overflow:hidden
}
.avqr-placeholder{color:#64748b;font-size:.98rem;user-select:none}
.avqr-canvas img,.avqr-canvas object{max-width:100%;height:auto;display:block}
.avqr-preview.is-loading{opacity:.6}

/* ===== Actions (télécharger + copier) ===== */
.avqr-actions{margin-top:12px;display:flex;align-items:center;justify-content:center;gap:.5rem}
.avqr-btn[disabled]{opacity:.7;cursor:not-allowed}

/* Bouton “Générer” en busy (spinner à droite) */
.avqr-btn.is-busy{position:relative;pointer-events:none}
.avqr-btn.is-busy::after{
  content:"";position:absolute;right:12px;top:50%;transform:translateY(-50%);
  width:16px;height:16px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;
  animation:avqr-spin .8s linear infinite
}
@keyframes avqr-spin{to{transform:translateY(-50%) rotate(360deg)}}

/* Bouton Copier : icône seule */
.avqr-btn--icon{
  display:inline-flex;align-items:center;justify-content:center;padding:.25rem;
  border:1px solid #e5e7eb;border-radius:.375rem;background:#fff;color:#111827;line-height:0;
  cursor:pointer;-webkit-appearance:none;appearance:none
}
.avqr-btn--icon svg{width:1.25rem;height:1.25rem;display:block;fill:currentColor}
.avqr-btn--icon[disabled]{opacity:.45;pointer-events:none}

/* Rotation 360° au clic */
.avqr-btn--icon{position:relative}
.avqr-btn--icon svg{transform-origin:50% 50%}
.avqr-btn--icon.is-rotating svg{animation:avqrRotateOnce .45s ease-in-out both}
@keyframes avqrRotateOnce{to{transform:rotate(360deg)}}

@media (max-width:640px){
  .avqr-actions{gap:.375rem}
  .avqr-btn--icon svg{width:1.15rem;height:1.15rem}
}

/* ===== Zone erreurs ===== */
.avqr-error{margin-top:.5rem;padding:10px 12px;border:1px solid #fecaca;background:#fee2e2;border-radius:12px;color:#7f1d1d;font-size:.95rem}

/* ===== Options / champs ===== */
.avqr-options{margin-top:12px;display:grid;gap:10px;grid-template-columns:1fr 1fr}
.avqr-field{display:flex;align-items:center;gap:8px;margin-top:8px}
.avqr-field:first-of-type{margin-top:0}
.avqr-field label{font-size:.9rem;color:#334155;min-width:90px}
.avqr-field select,.avqr-field input[type="number"]{
  height:40px;padding:0 10px;border:1px solid #e2e8f0;border-radius:10px;font-size:.95rem
}
.avqr-field input[type="color"]{
  width:44px;height:40px;padding:0;border:1px solid #e2e8f0;border-radius:10px;background:#fff
}
@media (max-width:640px){.avqr-options{grid-template-columns:1fr}}

/* Aides sous les champs */
.avqr-help{display:block;font-size:.85em;line-height:1.3;color:#6b7280;margin-top:.25rem}

/* Champ “taille du logo” compact */
.avqr-input-compact{max-width:90px}

/* Ligne Logo responsive (retours à la ligne sur mobile) */
@media (max-width:520px){
  .avqr-field--logo{display:flex;flex-direction:column;align-items:stretch;gap:6px}
  .avqr-field--logo label{margin-bottom:2px}
  .avqr-field--logo input[type="file"]{width:100%;max-width:100%}
  .avqr-field--logo .avqr-logo-clear{align-self:flex-end}
  .avqr-field--logo-size{display:flex;flex-direction:column;align-items:stretch;gap:6px}
  .avqr-field--logo-size .avqr-input-compact{width:100%;max-width:100%}
  .avqr-help{width:100%}
}

/* Upload logo : bouton effacer + styles input file custom */
.avqr-logo-clear{border:none;background:transparent;cursor:pointer;font-size:1rem;line-height:1;color:#9ca3af;padding:.1rem .25rem}
.avqr-logo-clear:hover{color:#ef4444}
.avqr-visually-hidden{
  position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);
  white-space:nowrap;border:0
}
.avqr-file-btn{
  appearance:none;border:1px solid #d1d5db;background:#fff;color:#111827;border-radius:8px;padding:8px 12px;cursor:pointer;font-weight:600
}
.avqr-file-btn:focus{outline:2px solid #3b82f6;outline-offset:2px}
.avqr-file-status{font-size:.9em;color:#6b7280;margin-left:.25rem}
@media (max-width:520px){.avqr-file-status{margin-left:0}}

/* ===== Onglets ===== */
.avqr-tabs{margin-top:14px}
.avqr-tablist{
  display:flex;gap:6px;align-items:flex-end;border-bottom:1px solid #e5e7eb;overflow:auto
}
.avqr-tab{
  appearance:none;border:none;background:transparent;cursor:pointer;padding:8px 12px;border-radius:10px 10px 0 0;
  font-weight:600;color:#6b7280
}
.avqr-tab.is-active{background:#f9fafb;color:#111827;border:1px solid #e5e7eb;border-bottom-color:transparent}
.avqr-tab:focus{outline:2px solid #3b82f6;outline-offset:2px}
.avqr-tabpanel{border:1px solid #e5e7eb;border-top:none;border-radius:0 12px 12px 12px;padding:12px;background:#f9fafb}
@media (max-width:520px){
  .avqr-tablist{gap:4px;scrollbar-width:thin}
  .avqr-tab{padding:8px 10px;white-space:nowrap;flex:0 0 auto}
  .avqr-tabpanel{padding:10px}
}
/* Dans les onglets, fieldset interne sans cadre */
.avqr-tabpanel .avqr-panel{border:0;padding:0;margin:0}

/* Télécharger = style "outline" (comme avant) */
.avqr-actions [data-avqr="download"]{
  display:inline-block;
  padding:10px 14px;
  border-radius:12px;
  border:1px solid #0ea5e9;
  background:transparent;
  color:#0ea5e9;
  font-weight:700;
  text-decoration:none;
  box-shadow:none;    /* neutralise l’ombre de .avqr-btn */
}
.avqr-actions [data-avqr="download"]:hover{
  background:rgba(14,165,233,.08);
  box-shadow:0 6px 16px rgba(14,165,233,.15);
}