/* ===== QR Reader Styles ===== */
.qr-tabs { display:flex; gap:0; margin-bottom:1rem; border-radius:var(--radius-sm); overflow:hidden; border:2px solid var(--border); }
.qr-tab-btn { flex:1; padding:0.7rem 0.5rem; border:none; background:var(--bg); color:var(--text-secondary); font-family:var(--font); font-size:0.8rem; font-weight:600; cursor:pointer; transition:all 0.2s; position:relative; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.qr-tab-btn:hover { background:var(--accent-light); color:var(--accent); }
.qr-tab-btn.active { background:var(--accent); color:#fff; }
.qr-tab-btn:focus-visible { outline:2px solid var(--accent); outline-offset:-2px; z-index:1; }

/* Camera viewfinder */
.qr-viewfinder { position:relative; width:100%; aspect-ratio:1; max-height:380px; background:#000; border-radius:var(--radius-sm); overflow:hidden; display:none; }
.qr-viewfinder.show { display:block; }
.qr-viewfinder video { width:100%; height:100%; object-fit:cover; display:block; }
.qr-viewfinder .scanner-overlay { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; pointer-events:none; }
.qr-viewfinder .scan-region { width:65%; aspect-ratio:1; border:2.5px solid rgba(255,255,255,0.8); border-radius:16px; box-shadow:0 0 0 9999px rgba(0,0,0,0.45); position:relative; }
.qr-viewfinder .scan-line { position:absolute; left:0; right:0; height:2px; background:linear-gradient(90deg,transparent,var(--accent),transparent); animation:qrScanLine 1.5s ease-in-out infinite; top:50%; }
@keyframes qrScanLine { 0%,100% { top:10%; opacity:0.3; } 50% { top:85%; opacity:1; } }
.qr-viewfinder .scan-corners { position:absolute; inset:-4px; }
.qr-viewfinder .scan-corner { position:absolute; width:20px; height:20px; border-color:var(--accent); border-style:solid; }
.qr-viewfinder .scan-corner-tl { top:0; left:0; border-width:3px 0 0 3px; border-radius:4px 0 0 0; }
.qr-viewfinder .scan-corner-tr { top:0; right:0; border-width:3px 3px 0 0; border-radius:0 4px 0 0; }
.qr-viewfinder .scan-corner-bl { bottom:0; left:0; border-width:0 0 3px 3px; border-radius:0 0 0 4px; }
.qr-viewfinder .scan-corner-br { bottom:0; right:0; border-width:0 3px 3px 0; border-radius:0 0 4px 0; }
.qr-camera-controls { display:flex; gap:0.5rem; margin-top:0.6rem; flex-wrap:wrap; }
.qr-camera-controls .qr-cam-btn { padding:0.55rem 1rem; border:1.5px solid var(--border); border-radius:50px; background:var(--bg-glass); color:var(--text); font-family:var(--font); font-size:0.78rem; font-weight:500; cursor:pointer; transition:all 0.15s; display:inline-flex; align-items:center; gap:0.35rem; }
.qr-camera-controls .qr-cam-btn:hover { border-color:var(--accent); color:var(--accent); background:var(--accent-light); }
.qr-camera-controls .qr-cam-btn.primary { background:var(--accent); color:#fff; border-color:var(--accent); font-weight:700; }
.qr-camera-controls .qr-cam-btn.primary:hover { opacity:0.9; transform:translateY(-1px); }
.qr-camera-status { margin-top:0.5rem; font-size:0.78rem; color:var(--text-tertiary); text-align:center; min-height:1.2em; }

/* Drop zone */
.qr-dropzone { border:2.5px dashed var(--border); border-radius:var(--radius-sm); padding:2rem 1.5rem; text-align:center; cursor:pointer; transition:all 0.2s; background:var(--bg-glass); position:relative; }
.qr-dropzone:hover, .qr-dropzone.drag-over { border-color:var(--accent); background:var(--accent-light); }
.qr-dropzone .dz-icon { font-size:2.5rem; display:block; margin-bottom:0.6rem; }
.qr-dropzone .dz-text { font-size:0.85rem; color:var(--text-secondary); line-height:1.5; }
.qr-dropzone .dz-sub { font-size:0.72rem; color:var(--text-tertiary); margin-top:0.3rem; }
.qr-dropzone input[type=file] { position:absolute; inset:0; opacity:0; cursor:pointer; }

/* Paste area */
.qr-paste-area { border:2.5px dashed var(--border); border-radius:var(--radius-sm); padding:2rem 1.5rem; text-align:center; background:var(--bg-glass); cursor:text; transition:all 0.2s; }
.qr-paste-area:focus-within { border-color:var(--accent); background:var(--accent-light); box-shadow:0 0 0 3px var(--accent-light); }
.qr-paste-area .paste-preview { max-width:100%; max-height:200px; border-radius:8px; margin-bottom:0.75rem; display:none; }
.qr-paste-area .paste-preview.show { display:inline-block; }

/* Result box */
.qr-result-box { padding:1.25rem; background:var(--bg-glass); border-radius:var(--radius-sm); border:1.5px solid var(--border); display:none; }
.qr-result-box.show { display:block; }
.qr-result-box .result-label { font-size:0.72rem; font-weight:700; text-transform:uppercase; letter-spacing:0.06em; color:var(--accent); margin-bottom:0.4rem; }
.qr-result-box .result-type { font-size:0.75rem; color:var(--text-tertiary); margin-bottom:0.6rem; }
.qr-result-box .result-content { width:100%; min-height:60px; padding:0.75rem 1rem; border:1.5px solid var(--border); border-radius:var(--radius-sm); background:var(--bg); color:var(--text); font-family:var(--font); font-size:0.9rem; line-height:1.55; word-break:break-all; resize:vertical; box-sizing:border-box; }
.qr-result-box .result-content:focus { border-color:var(--accent); outline:none; box-shadow:0 0 0 3px var(--accent-light); }
.qr-result-actions { display:flex; gap:0.5rem; margin-top:0.75rem; flex-wrap:wrap; }
.qr-result-actions .qr-action-btn { padding:0.55rem 1.1rem; border:1.5px solid var(--border); border-radius:50px; background:var(--bg-glass); color:var(--text); font-family:var(--font); font-size:0.8rem; font-weight:600; cursor:pointer; transition:all 0.15s; display:inline-flex; align-items:center; gap:0.35rem; }
.qr-result-actions .qr-action-btn:hover { background:var(--accent); color:#fff; border-color:var(--accent); transform:translateY(-1px); }
.qr-result-actions .qr-action-btn.primary-action { background:var(--accent); color:#fff; border-color:var(--accent); }
.qr-result-actions .qr-action-btn.primary-action:hover { opacity:0.9; }

/* Options row */
.qr-options-row { display:flex; gap:1rem; margin-top:0.75rem; flex-wrap:wrap; align-items:center; font-size:0.78rem; color:var(--text-tertiary); }
.qr-options-row label { display:inline-flex; align-items:center; gap:0.35rem; cursor:pointer; user-select:none; }
.qr-options-row input[type=checkbox] { accent-color:var(--accent); width:16px; height:16px; cursor:pointer; }

/* History */
.qr-history-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:0.5rem; }
.qr-history-header h4 { font-size:0.85rem; font-weight:700; color:var(--text-tertiary); text-transform:uppercase; letter-spacing:0.06em; margin:0; }
.qr-clear-history { font-size:0.65rem; color:var(--text-tertiary); cursor:pointer; padding:0.2rem 0.5rem; border:1px solid var(--border); border-radius:var(--radius-sm); background:var(--bg); transition:all 0.15s; font-family:var(--font); }
.qr-clear-history:hover { color:var(--accent); border-color:var(--accent); background:var(--accent-light); }
.qr-history-item { display:flex; align-items:center; gap:0.45rem; padding:0.4rem 0.6rem; background:var(--bg-card); border:1px solid var(--border-glass); border-radius:var(--radius-sm); margin-bottom:0.3rem; cursor:pointer; transition:all 0.2s; }
.qr-history-item:hover { border-color:var(--accent); background:var(--accent-light); }
.qr-history-icon { font-size:1.2rem; flex-shrink:0; }
.qr-history-info { flex:1; min-width:0; }
.qr-history-text { font-weight:600; font-size:0.72rem; color:var(--text); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.qr-history-type { font-size:0.62rem; color:var(--text-tertiary); }

/* Processing overlay */
.qr-processing { display:none; align-items:center; justify-content:center; gap:0.5rem; padding:1rem; color:var(--accent); font-weight:600; font-size:0.9rem; }
.qr-processing.show { display:flex; }
.qr-spinner { width:22px; height:22px; border:3px solid var(--border); border-top-color:var(--accent); border-radius:50%; animation:qrSpin 0.6s linear infinite; }
@keyframes qrSpin { to { transform:rotate(360deg); } }

/* No camera fallback */
.qr-no-camera { display:none; padding:1.5rem; text-align:center; color:var(--text-secondary); background:var(--bg-glass); border-radius:var(--radius-sm); }
.qr-no-camera.show { display:block; }
.qr-no-camera .nc-icon { font-size:2.5rem; display:block; margin-bottom:0.5rem; }

/* Responsive */
@media (max-width:768px) {
  .qr-tab-btn { font-size:0.72rem; padding:0.55rem 0.3rem; }
  .qr-viewfinder { max-height:300px; }
  .qr-camera-controls { justify-content:center; }
  .qr-result-actions { justify-content:center; }
  .qr-dropzone, .qr-paste-area { padding:1.5rem 1rem; }
}
@media (max-width:480px) {
  .qr-tabs { flex-wrap:wrap; }
  .qr-tab-btn { flex-basis:33.33%; font-size:0.68rem; padding:0.5rem 0.2rem; }
  .qr-viewfinder { max-height:250px; }
}

/* ARIA live region (visually hidden) */
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }