/* QR kod aracı (sekmeler ve kart text.css'ten gelir) */
.qr-grid { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 28px; padding: 20px; }
@media (max-width: 860px) { .qr-grid { grid-template-columns: minmax(0, 1fr); } }

.qr-form { display: grid; gap: 14px; align-content: start; }
.qr-panel { display: grid; gap: 12px; }
.qr-form label, .qr-opts-body label { display: flex; flex-direction: column; gap: 4px; font-weight: 600; font-size: 14px; }
.qr-form label.check { flex-direction: row; align-items: center; gap: 8px; font-weight: 500; }
.qr-form label small { font-weight: 400; color: var(--muted); font-size: 12.5px; }
.qr-form input:not([type="checkbox"]):not([type="radio"]):not([type="color"]), .qr-form select, .qr-form textarea {
  width: 100%; padding: 9px 11px; font: 400 14.5px var(--font-ui); color: var(--ink);
  background: var(--paper); border: 1px solid var(--line); border-radius: 8px;
}
.qr-form textarea { resize: vertical; min-height: 84px; }
.qr-form input:focus-visible, .qr-form select:focus-visible, .qr-form textarea:focus-visible { outline: 2px solid var(--signal); outline-offset: -1px; border-color: transparent; }
.qr-form input[type="checkbox"], .qr-form input[type="radio"] { width: 16px; height: 16px; margin: 0; accent-color: var(--signal); }
.qr-form input[type="color"] { width: 100%; height: 40px; padding: 3px; background: var(--paper); border: 1px solid var(--line); border-radius: 8px; cursor: pointer; }
.qr-panel fieldset { border: 0; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 4px 20px; }
.qr-panel legend { float: left; margin-right: 14px; padding: 0; font-weight: 600; font-size: 14px; }
.qr-panel .pair, .qr-opts-body .pair { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }

.qr-options { border: 1px solid var(--line); border-radius: 12px; background: var(--paper); padding: 0 16px; }
.qr-options summary { padding: 12px 0; }
.qr-opts-body { display: grid; gap: 12px; padding-bottom: 16px; }

.qr-out { display: flex; flex-direction: column; gap: 10px; align-items: flex-start; }
.qr-frame { padding: 14px; background: #fff; border: 1px solid var(--line); border-radius: 14px; line-height: 0; }
.qr-frame canvas { display: block; max-width: 100%; height: auto; }
.qr-out .msg { min-height: 1.4em; }
.qr-out .msg.warn { color: var(--danger); }
.qr-out .note { margin: 0; color: var(--muted); font-size: 13px; }