/* Deepnet OTP QR Generator styles */
.deepnet-otp-qr { display:grid; gap:1rem; grid-template-columns: 1fr; }
@media (min-width: 900px){ .deepnet-otp-qr{ grid-template-columns: 2fr 1fr; } }
.deepnet-otp-qr .dn-card{ background:#fff; border:1px solid #e5e7eb; border-radius:12px; padding:16px; box-shadow:0 1px 2px rgba(0,0,0,.03); }
.deepnet-otp-qr h2, .deepnet-otp-qr h3{ margin-top:0; }
.deepnet-otp-qr .dn-form .dn-row{ margin-bottom:12px; }
.deepnet-otp-qr label{ display:block; font-weight:600; margin-bottom:6px; }
.deepnet-otp-qr .dn-inline{ display:flex; gap:8px; align-items:center; }
.deepnet-otp-qr input[type=text], .deepnet-otp-qr input[type=number], .deepnet-otp-qr select{
    width:100%; max-width:100%; padding:8px 10px; border:1px solid #d1d5db; border-radius:8px;
}
.deepnet-otp-qr .button{ padding:8px 12px; border-radius:8px; border:1px solid #d1d5db; background:#f9fafb; cursor:pointer; }
.deepnet-otp-qr .button-primary{ background:#2563eb; color:#fff; border-color:#1d4ed8; }
.deepnet-otp-qr .dn-advanced summary{ cursor:pointer; font-weight:700; }
.deepnet-otp-qr .dn-note{ color:#6b7280; font-size:.9em; margin:.4em 0 0; }
.deepnet-otp-qr .dn-checkbox{ margin-top:8px; font-weight:500; }
#dn-qr{ display:flex; align-items:center; justify-content:center; min-height:260px; padding:8px; background:#f8fafc; border:1px dashed #e2e8f0; border-radius:12px; }




.deepnet-otp-qr .dn-inline {
    display: flex;
    align-items: stretch;
    gap: 6px;
}
.deepnet-otp-qr .dn-inline input[type=text] {
    flex: 1 1 auto;
}
.deepnet-otp-qr .dn-inline .button {
    flex: 0 0 auto;
}
.deepnet-otp-qr [data-action="download-png"] {
    margin-top: 10px;
}


/* Precise alignment for Secret + URI rows only */
.deepnet-otp-qr input[name=secret],
.deepnet-otp-qr [data-action=generate-secret],
.deepnet-otp-qr input[name=uri],
.deepnet-otp-qr [data-action=copy-uri]{
    height: 40px;
    box-sizing: border-box;
}

/* Add a little top margin above the Download PNG button under the QR preview */
.deepnet-otp-qr #dn-qr + .dn-actions .button,
.deepnet-otp-qr [data-action=download-png]{
    margin-top: 8px;
}
