/*
 * Espace location : composants (repris des maquettes validées le 14/11/2026).
 * N'utilise que les variables de charte.css (charte du site actuel, en marque blanche).
 */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--text);font:400 16px/1.55 var(--font-text)}
a{color:var(--link)}
h1,h2,h3,h4{color:var(--title);font-family:var(--font-title);line-height:1.25;margin:0 0 .5em}
h1{font-size:1.65rem;font-weight:800}
h2{font-size:1.2rem;font-weight:700}
h3{font-size:1.02rem;font-weight:700}
p{margin:0 0 .8em}
small,.muted{color:var(--text-2)}
.muted{font-size:.92rem}
:focus-visible{outline:2px solid var(--focus);outline-offset:2px}

/* Icônes */
.ic{display:inline-block;width:1.15em;height:1.15em;flex:none;vertical-align:-.2em;background:currentColor;
  -webkit-mask:var(--ic) center/contain no-repeat;mask:var(--ic) center/contain no-repeat}
.ic-lg{width:1.6em;height:1.6em}


/* Mise en page générale */
.page{max-width:1120px;margin:0 auto;padding:1.25rem 1rem 6rem}
.page-etroite{max-width:720px}
.pile>*+*{margin-top:1rem}
.grille{display:grid;gap:1rem}
@media (min-width:760px){
  .grille-2{grid-template-columns:repeat(2,minmax(0,1fr))}
  .grille-3{grid-template-columns:repeat(3,minmax(0,1fr))}
  .grille-2-1{grid-template-columns:minmax(0,2fr) minmax(0,1fr)}
}
.ligne{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap}
.ecarte{justify-content:space-between}
.fin{margin-left:auto}

/* Carte */
.carte{background:var(--card);border:1px solid var(--card-border);border-radius:var(--radius);box-shadow:var(--card-shadow);padding:1.1rem}
.carte>h2:first-child,.carte>h3:first-child{margin-top:0}
.carte-titre{display:flex;align-items:center;gap:.5rem;margin-bottom:.75rem}
.carte-titre h2,.carte-titre h3{margin:0}
.carte-titre .fin{font-size:.9rem}

/* Chiffre clé */
.kpi{font-size:1.9rem;font-weight:var(--kpi-weight);color:var(--title);font-family:var(--font-num);line-height:1.1}
.kpi-legende{font-size:.85rem;color:var(--text-2)}

/* Pastilles */
.pastille{display:inline-flex;align-items:center;gap:.3rem;border-radius:var(--radius-pill);padding:.12rem .6rem;font-size:.8rem;font-weight:600;
  border:1px solid var(--tint-neutral-bd);background:var(--tint-neutral-bg);color:var(--tint-neutral-tx);white-space:nowrap}
.pastille.ok{border-color:var(--tint-ok-bd);background:var(--tint-ok-bg);color:var(--tint-ok-tx)}
.pastille.signal{border-color:var(--tint-signal-bd);background:var(--tint-signal-bg);color:var(--tint-signal-tx)}
.pastille.info{border-color:var(--tint-info-bd);background:var(--tint-info-bg);color:var(--tint-info-tx)}
.pastille.erreur{border-color:var(--error-bd);background:var(--error-bg);color:var(--error-tx)}

/* Encadrés */
.encadre{border-radius:var(--radius);padding:.85rem 1rem;border:1px solid var(--tint-info-bd);background:var(--tint-info-bg);color:var(--tint-info-tx);display:flex;gap:.7rem}
.encadre .ic{margin-top:.15rem}
.encadre.signal{border-color:var(--tint-signal-bd);background:var(--tint-signal-bg);color:var(--tint-signal-tx)}
.encadre.ok{border-color:var(--tint-ok-bd);background:var(--tint-ok-bg);color:var(--tint-ok-tx)}
.encadre.erreur{border-color:var(--error-bd);background:var(--error-bg);color:var(--error-tx)}
.encadre p:last-child{margin:0}
.encadre strong{display:block}

/* Boutons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.45rem;font:600 .95rem var(--font-text);border-radius:var(--radius-pill);
  padding:.6rem 1.1rem;border:1px solid var(--btn-bd);background:var(--btn-bg);color:var(--on-btn);text-decoration:none;cursor:pointer;min-height:44px}
.btn.secondaire{background:transparent;color:var(--title);border-color:var(--card-border)}
.btn.discret{background:transparent;border-color:transparent;color:var(--link);padding-inline:.4rem}
.btn.accent{background:var(--accent);border-color:var(--accent);color:#1A2C45}
.btn.plein{width:100%}
.btn.petit{min-height:34px;padding:.3rem .8rem;font-size:.85rem}

/* Formulaires */
.champ{display:block;margin-bottom:.9rem}
.champ>span{display:block;font-weight:600;font-size:.92rem;margin-bottom:.3rem}
.champ>small{display:block;margin-top:.25rem}
input[type=text],input[type=email],input[type=password],input[type=number],input[type=date],select,textarea{
  width:100%;font:inherit;color:var(--field-tx);background:var(--field-bg);border:1px solid var(--field-bd);border-radius:8px;padding:.6rem .75rem;min-height:44px}
textarea{min-height:110px;resize:vertical}
.code-otp{display:flex;gap:.5rem;justify-content:center}
.code-otp input{width:3rem;text-align:center;font-size:1.4rem;font-weight:700;padding:.5rem 0}
.choix{display:flex;gap:.6rem;align-items:flex-start;padding:.7rem .8rem;border:1px solid var(--card-border);border-radius:8px;margin-bottom:.5rem;background:var(--card)}
.choix input{margin-top:.3rem}
.choix.coche{border-color:var(--link);background:var(--tint-info-bg)}
.depot{border:2px dashed var(--card-border);border-radius:var(--radius);padding:1rem;text-align:center;color:var(--text-2)}
.depot .ic{display:block;margin:0 auto .3rem}

/* Listes de lignes (documents, échéances, demandes) */
.liste{list-style:none;margin:0;padding:0}
.liste>li{display:flex;align-items:center;gap:.75rem;padding:.7rem 0;border-top:1px solid var(--rule)}
.liste>li:first-child{border-top:0}
.liste .titre{font-weight:600}
.liste .sous{font-size:.85rem;color:var(--text-2)}
.liste .corps{flex:1;min-width:0}
.pictos{width:2.4rem;height:2.4rem;border-radius:10px;display:grid;place-items:center;background:var(--tint-info-bg);color:var(--tint-info-tx);flex:none}
.pictos.signal{background:var(--tint-signal-bg);color:var(--tint-signal-tx)}
.pictos.ok{background:var(--tint-ok-bg);color:var(--tint-ok-tx)}
.pictos.erreur{background:var(--error-bg);color:var(--error-tx)}

/* Tableaux */
.tableau-defile{overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:.93rem}
th{background:var(--th-bg);color:var(--th-tx);text-align:left;font-weight:600;padding:.55rem .7rem}
th:first-child{border-top-left-radius:8px}th:last-child{border-top-right-radius:8px}
td{padding:.55rem .7rem;border-bottom:1px solid var(--rule);vertical-align:top}
tbody tr:nth-child(even) td{background:var(--zebra)}
td.num,th.num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
tfoot td{font-weight:700;border-bottom:0}

/* Progression */
.barre{height:8px;border-radius:99px;background:var(--tint-neutral-bg);overflow:hidden}
.barre>i{display:block;height:100%;background:var(--mark-ok);border-radius:99px}
.etapes{display:flex;gap:.35rem;list-style:none;padding:0;margin:0 0 1rem;counter-reset:e;flex-wrap:wrap}
.etapes li{flex:1;min-width:6.5rem;font-size:.8rem;color:var(--text-2);border-top:4px solid var(--tint-neutral-bd);padding-top:.35rem}
.etapes li.fait{border-color:var(--mark-ok);color:var(--tint-ok-tx)}
.etapes li.encours{border-color:var(--accent);color:var(--text);font-weight:700}

/* Onglets (statiques) */
.onglets{display:flex;gap:.3rem;border-bottom:1px solid var(--rule);margin-bottom:1rem;overflow-x:auto}
.onglets a{padding:.55rem .9rem;text-decoration:none;color:var(--text-2);font-weight:600;border-bottom:3px solid transparent;white-space:nowrap}
.onglets a.actif{color:var(--title);border-color:var(--accent)}

/* En-tête de page */
.entete-page{margin:.3rem 0 1.2rem}
.entete-page p{color:var(--text-2);margin:0}
.fil{font-size:.85rem;color:var(--text-2);margin-bottom:.4rem}
.fil a{color:var(--text-2)}

/* --- Espace bailleur : barre latérale --- */
.app{display:grid;grid-template-columns:1fr;min-height:100vh}
.lateral{background:#01427C;color:#fff;padding:1rem .8rem;display:none}
.lateral .marque{font-weight:800;font-size:1.05rem;padding:.3rem .6rem 1rem;display:flex;gap:.5rem;align-items:center}
.lateral nav a{display:flex;align-items:center;gap:.6rem;color:#CFE8FF;text-decoration:none;padding:.5rem .6rem;border-radius:8px;font-size:.93rem}
.lateral nav a:hover{background:rgba(255,255,255,.08);color:#fff}
.lateral nav a.actif{background:rgba(255,255,255,.14);color:#fff;font-weight:700}
.lateral nav .compte{margin-left:auto;background:var(--accent);color:#1A2C45;border-radius:99px;font-size:.72rem;font-weight:800;padding:0 .45rem}
.lateral hr{border:0;border-top:1px solid rgba(255,255,255,.15);margin:.6rem 0}
.barre-haut{display:flex;align-items:center;gap:.6rem;padding:.6rem 1rem;background:var(--card);border-bottom:1px solid var(--card-border);position:sticky;top:0;z-index:5}
.barre-haut .marque{font-weight:800;color:var(--title)}
.menu-mobile summary{list-style:none;cursor:pointer;display:grid;place-items:center;width:44px;height:44px;border-radius:8px;color:var(--title)}
.menu-mobile summary::-webkit-details-marker{display:none}
.menu-mobile[open] nav{position:absolute;left:0;right:0;top:100%;background:#01427C;padding:.6rem;display:grid;gap:.1rem}
.menu-mobile nav a{color:#fff;text-decoration:none;padding:.6rem .8rem;border-radius:8px;display:flex;gap:.6rem;align-items:center}
@media (min-width:980px){
  .app{grid-template-columns:250px 1fr}
  .lateral{display:block;position:sticky;top:0;height:100vh;overflow-y:auto}
  .menu-mobile,.barre-haut .marque{display:none}
}
.btn-note{margin-left:auto}

/* --- Espace locataire : en-tête et barre d'onglets mobile --- */
.entete-loc{background:var(--card);border-bottom:1px solid var(--card-border)}
.entete-loc .dedans{max-width:1120px;margin:0 auto;padding:.7rem 1rem;display:flex;align-items:center;gap:1rem}
.entete-loc .marque{font-weight:800;color:var(--title);display:flex;gap:.5rem;align-items:center}
.entete-loc nav{display:none;gap:.2rem;margin-left:auto}
.entete-loc nav a{text-decoration:none;color:var(--text-2);font-weight:600;padding:.45rem .8rem;border-radius:99px}
.entete-loc nav a.actif{background:var(--tint-info-bg);color:var(--title)}
.onglets-bas{position:fixed;bottom:0;left:0;right:0;background:var(--card);border-top:1px solid var(--card-border);display:grid;grid-template-columns:repeat(4,1fr);z-index:5;padding-bottom:env(safe-area-inset-bottom)}
.onglets-bas a{display:flex;flex-direction:column;align-items:center;gap:.15rem;padding:.5rem 0 .55rem;font-size:.72rem;font-weight:600;color:var(--text-2);text-decoration:none}
.onglets-bas a.actif{color:var(--title)}
.onglets-bas a.actif .ic{color:var(--accent)}
@media (min-width:760px){.entete-loc nav{display:flex}.onglets-bas{display:none}.page{padding-bottom:3rem}}

/* Accueil locataire : bloc de bienvenue */
.bienvenue{background:#01427C;color:#fff;border-radius:var(--radius);padding:1.2rem}
.bienvenue h1{color:#fff;margin-bottom:.2rem}
.bienvenue p{color:#CFE8FF;margin:0}
.raccourcis{display:grid;grid-template-columns:repeat(2,1fr);gap:.7rem}
@media (min-width:760px){.raccourcis{grid-template-columns:repeat(4,1fr)}}
.raccourci{display:flex;flex-direction:column;gap:.5rem;padding:1rem;border-radius:var(--radius);background:var(--card);border:1px solid var(--card-border);text-decoration:none;color:var(--text);font-weight:700}
.raccourci .ic{color:var(--title);width:1.6em;height:1.6em}

/* Guide : l'essentiel */
.essentiel{border-left:5px solid var(--accent);background:var(--card);border-radius:0 var(--radius) var(--radius) 0;padding:1rem 1.1rem;box-shadow:var(--card-shadow)}
.essentiel h2{font-size:.85rem;text-transform:uppercase;letter-spacing:.05em;color:var(--text-2)}
.essentiel ul{margin:0;padding-left:1.1rem}
.essentiel li{margin:.25rem 0}
.prose h2{margin-top:1.6rem}
.prose ul,.prose ol{padding-left:1.2rem}
.prose li{margin:.3rem 0}
.sources{font-size:.85rem;color:var(--text-2)}
.sources a{color:var(--text-2)}

/* Connexion */
.ecran-connexion{min-height:100vh;display:grid;place-items:center;padding:1.5rem 1rem;background:linear-gradient(160deg,#01427C 0%,#002F57 100%)}
.ecran-connexion .carte{width:100%;max-width:420px}
.logo-site{display:flex;align-items:center;gap:.6rem;color:#fff;font-weight:800;font-size:1.1rem;margin-bottom:1rem;justify-content:center}

/* Aperçu de document */
.feuille{background:#fff;color:#1A2C45;border-radius:4px;box-shadow:0 6px 28px rgba(0,0,0,.12);padding:2rem 1.8rem;font-size:.82rem;line-height:1.5}
.feuille h3{color:#01427C;text-align:center;font-size:1rem;margin-bottom:.2rem}
.feuille h4{color:#01427C;font-size:.85rem;margin:1rem 0 .3rem;border-bottom:1px solid #E6ECF3;padding-bottom:.2rem}
.feuille .rempli{background:#EFF5FF;border-radius:3px;padding:0 .2rem;font-weight:600}
.feuille .a-completer{background:#FFF8EC;border-radius:3px;padding:0 .2rem;font-weight:600;color:#8C5A00}

/* Sommaire du livret */
.tuiles{display:grid;grid-template-columns:repeat(2,1fr);gap:.7rem}
@media (min-width:760px){.tuiles{grid-template-columns:repeat(3,1fr)}}
.tuile{display:flex;gap:.7rem;align-items:center;padding:.85rem;border-radius:var(--radius);border:1px solid var(--card-border);background:var(--card);text-decoration:none;color:var(--text);font-weight:600}
.etapes-num{counter-reset:n;list-style:none;padding:0;margin:0}
.etapes-num li{counter-increment:n;position:relative;padding:0 0 .8rem 2.4rem}
.etapes-num li::before{content:counter(n);position:absolute;left:0;top:0;width:1.7rem;height:1.7rem;border-radius:50%;background:var(--tint-info-bg);color:var(--title);font-weight:800;display:grid;place-items:center;font-size:.85rem}
.photo-fictive{aspect-ratio:4/3;max-height:260px;width:100%;border-radius:var(--radius);background:repeating-linear-gradient(45deg,var(--tint-neutral-bg) 0 12px,transparent 12px 24px),var(--zebra);
  display:grid;place-items:center;color:var(--text-2);font-size:.85rem;border:1px solid var(--card-border)}


/* Corrections d'affichage sur petit écran */
.app>div{min-width:0}
@media (max-width:560px){
  .btn-note .libelle{display:none}
  .code-otp{gap:.35rem}
  .code-otp input{width:2.5rem;font-size:1.2rem}
}
.entete-loc .marque{white-space:nowrap}
@media (max-width:759px){
  .entete-loc .dedans>a:last-child{margin-left:auto}
  .etapes li{min-width:4.2rem}
  .entete-loc .pastille{white-space:normal;font-size:.75rem}
}
.etapes{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr)}
.etapes li{min-width:0}

/* Infobulle d'aide : au survol, au toucher (focus) et au clavier */
.aide{position:relative;display:inline-grid;place-items:center;width:1.15rem;height:1.15rem;border-radius:50%;margin-left:.3rem;vertical-align:.05em;
  background:var(--tint-info-bg);border:1px solid var(--tint-info-bd);color:var(--tint-info-tx);font-size:.72rem;font-weight:800;cursor:help;line-height:1}
.aide .bulle{display:none;position:absolute;z-index:10;left:50%;bottom:calc(100% + 8px);transform:translateX(-50%);width:max-content;max-width:min(280px,80vw);
  background:var(--toast-bg);color:var(--toast-tx);font-size:.82rem;font-weight:400;line-height:1.45;text-align:left;padding:.55rem .7rem;border-radius:8px;box-shadow:0 8px 24px rgba(0,0,0,.2)}
.aide .bulle a{color:inherit}
.aide:hover .bulle,.aide:focus .bulle,.aide:focus-within .bulle{display:block}

/* --- Ajouts du site --- */
.evitement{position:absolute;left:-9999px;top:0;background:var(--card);padding:.5rem 1rem;z-index:50}
.evitement:focus{left:1rem}
.lien-nav{display:flex;align-items:center;gap:.6rem;width:100%;background:none;border:0;font:inherit;color:#CFE8FF;text-decoration:none;padding:.5rem .6rem;border-radius:8px;font-size:.93rem;cursor:pointer;text-align:left}
.lien-nav:hover{background:rgba(255,255,255,.08);color:#fff}
.menu-mobile .lien-nav{color:#fff;padding:.6rem .8rem}
.lateral form,.menu-mobile form{margin:0}
.saisie-code{font-size:1.4rem;letter-spacing:.3em;text-align:center;font-weight:700}
.cle-totp{font-family:ui-monospace,Menlo,monospace;font-size:1.1rem;font-weight:700;background:var(--field-bg);border:1px solid var(--field-bd);border-radius:8px;padding:.6rem .8rem;margin:.4rem 0;word-break:break-all;letter-spacing:.05em}
.codes-secours{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(2,1fr);gap:.4rem}
.codes-secours li{font-family:ui-monospace,Menlo,monospace;font-size:1.05rem;font-weight:700;background:var(--field-bg);border-radius:6px;padding:.4rem .6rem;text-align:center}
.lien-copie{display:flex;gap:.5rem;align-items:center;margin-top:.4rem}
.lien-copie input{flex:1;min-width:0;font-size:.85rem}
.depot{display:block;cursor:pointer}
.depot input[type=file]{display:block;margin:.6rem auto 0;max-width:100%;font-size:.85rem}
.depot-piece{margin-top:.5rem}
.depot-piece>summary{list-style:none;display:inline-flex}
.depot-piece>summary::-webkit-details-marker{display:none}
.etapes li a{color:inherit;text-decoration:none;display:block}
details.carte>summary{cursor:pointer}
.prose table{margin:.6rem 0}
.carte ul:not(.liste){padding-left:1.2rem}
button[disabled]{opacity:.5;cursor:not-allowed}
@media print{.lateral,.barre-haut,.btn,.evitement{display:none!important}.ecran-connexion{background:none}.logo-site{color:#000}}

/* Utilitaires : la politique de sécurité interdit les attributs style="" */
.u-gap-col{column-gap:1rem;row-gap:0}.u-gap-petit{gap:.3rem}
.u-titre-carte{font-size:1.35rem}
.u-mt{margin-top:.75rem}.u-mb{margin-bottom:.9rem}.u-mb0{margin-bottom:0}.u-m0{margin:0}.u-my-petit{margin:.25rem 0}
.u-centre{text-align:center}.u-centre-bloc{margin:0 auto;width:100%}
.u-haut{align-items:flex-start}.u-bas{align-items:flex-end}.u-colonne{flex-direction:column}
.u-coupe{word-break:break-all}.u-auto{width:auto}.u-plein{width:100%}.u-sans-max{max-width:none}
.u-retrait{margin-left:1.8rem}.u-extensible{flex:1;min-width:14rem}.u-inline{display:inline}
.ecran-simple{width:100%;max-width:440px}.ecran-large{max-width:960px}
progress.barre{appearance:none;-webkit-appearance:none;display:block;width:100%;height:8px;border:0;border-radius:99px;background:var(--tint-neutral-bg);overflow:hidden;color:var(--mark-ok)}
progress.barre::-webkit-progress-bar{background:var(--tint-neutral-bg);border-radius:99px}
progress.barre::-webkit-progress-value{background:var(--mark-ok);border-radius:99px}
progress.barre::-moz-progress-bar{background:var(--mark-ok);border-radius:99px}

/* Lot 1B : aperçu locataire, livret, état des lieux */
.bandeau-apercu{background:var(--accent);color:#1A2C45;text-align:center;font-size:.85rem;font-weight:700;padding:.35rem 1rem}
.bandeau-apercu a{color:inherit}
.photo-equipement{width:100%;max-height:280px;object-fit:cover;border-radius:var(--radius);border:1px solid var(--card-border)}
.carte-interne{border:1px solid var(--card-border);border-radius:8px;padding:.7rem .9rem;margin-top:.7rem;background:var(--card)}
.carte-interne>summary{cursor:pointer;display:flex;gap:.5rem;align-items:center;flex-wrap:wrap}
details>summary.btn{list-style:none}
details>summary.btn::-webkit-details-marker{display:none}
.grille-edl{display:grid;grid-template-columns:minmax(7rem,9rem) 1fr;gap:.5rem;margin-top:.4rem}
.grille-edl:has(input[type=number]){grid-template-columns:minmax(7rem,9rem) 4.5rem 1fr}
@media (max-width:560px){.grille-edl,.grille-edl:has(input[type=number]){grid-template-columns:1fr 4.5rem}.grille-edl input[type=text]{grid-column:1/-1}}
.galerie{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:.6rem}
.galerie figure{margin:0}
.galerie img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:8px;border:1px solid var(--card-border)}
.galerie figcaption{font-size:.8rem}
.tuile small{font-weight:400}
.sous-menu{display:grid;margin:.1rem 0 .4rem 2.2rem;border-left:2px solid rgba(255,255,255,.2)}
.lateral .sous-menu a{padding:.35rem .7rem;font-size:.88rem;border-radius:0 8px 8px 0}
.lateral .sous-menu a.actif{background:rgba(255,255,255,.14);border-left:2px solid var(--accent);margin-left:-2px}
.menu-mobile .sous-menu a{padding:.45rem .8rem;font-size:.9rem}

/* Infobulles (retour de Heaven du 14/11) : la bulle reste ouverte 0,4 s après la sortie du « ? »,
   et une bande invisible relie le « ? » à la bulle : on peut aller cliquer sur un lien qu'elle contient. */
.aide .bulle{display:block;visibility:hidden;opacity:0;pointer-events:none;transition:opacity .15s ease,visibility 0s linear .4s}
.aide:hover .bulle,.aide:focus .bulle,.aide:focus-within .bulle{visibility:visible;opacity:1;pointer-events:auto;transition-delay:0s}
.aide .bulle::after{content:"";position:absolute;left:-8px;right:-8px;top:100%;height:14px}
.aide .bulle a{display:inline-block;padding:.15rem 0;font-weight:700}

/* Notes pour la maintenance : note ciblée par un lien (tableau de bord, e-mail) mise en évidence */
.page-maintenance{max-width:960px}
.note{scroll-margin-top:5rem}
.note-ciblee,.note:target{outline:2px solid var(--accent);outline-offset:4px;border-radius:var(--radius)}
.liste>li.note{padding-inline:.4rem}
/* Résumés cliquables : toute la ligne mène au détail */
a.ligne-lien{display:flex;align-items:center;gap:.75rem;flex:1;min-width:0;color:inherit;text-decoration:none}
a.ligne-lien:hover .titre{text-decoration:underline}

/* QR code de configuration de l'application d'authentification */
.qr-totp{width:min(240px,100%);margin:.6rem 0;background:#fff;border:1px solid var(--card-border);border-radius:8px;padding:.3rem}
.qr-totp svg{display:block;width:100%;height:auto}