/* QR etiket & yazıcı sahnesi — .qr-* (sayfaya özel) */
.qr{display:grid;grid-template-columns:minmax(0,1fr) 230px;gap:28px;align-items:end;min-height:480px;padding:10px 0 6px}
.qr-left{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;min-width:0;min-height:460px;position:relative}

/* etiket çıkış kanalı: yazıcının üstünde, taşan kısmı gizler */
.qr-feed{position:relative;width:196px;height:250px;overflow:hidden;z-index:1}
.qr-label{position:absolute;left:12px;right:12px;bottom:-4px;background:#fff;color:#08160f;border-radius:10px 10px 4px 4px;padding:12px 13px 14px;box-shadow:0 18px 40px -12px rgba(0,0,0,.6);transform:translateY(104%);transition:transform 2.2s cubic-bezier(.33,.2,.2,1);display:flex;flex-direction:column;gap:7px}
.qr-label::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:6px;background:repeating-linear-gradient(90deg,#fff 0 6px,transparent 6px 10px)}
.qr.printing .qr-label,.qr.scanning .qr-label,.qr.opened .qr-label{transform:translateY(0)}
.qr.resetting .qr-label{transition-duration:.5s;transform:translateY(104%)}
.qr-lb-top{display:flex;justify-content:space-between;align-items:center;font-size:10px;font-weight:800;letter-spacing:.06em;color:#5b6b62}
.qr-lb-top b{font-size:14px;color:#08160f;letter-spacing:0}
.qr-lb-nm{font-size:12px;font-weight:700;line-height:1.3;color:#0e2a20}
.qr-lb-nm small{display:block;font-size:10.5px;font-weight:600;color:#5b6b62}
.qr-code{position:relative;width:92px;height:92px;margin:2px auto 0;padding:5px;background:#fff;border:1.5px solid #0e2a20;border-radius:6px;display:grid;grid-template-columns:repeat(11,1fr);grid-template-rows:repeat(11,1fr);gap:1px}
.qr-code i{display:block;background:#08160f;border-radius:1px}
.qr-code i.o{background:transparent}
.qr-scan{position:absolute;left:-6px;right:-6px;top:0;height:3px;border-radius:3px;background:#34d399;box-shadow:0 0 14px 3px rgba(52,211,153,.75);opacity:0;pointer-events:none}
.qr.scanning .qr-scan{animation:qrScan 1.2s ease-in-out forwards}
.qr.opened .qr-code{box-shadow:0 0 0 3px rgba(52,211,153,.55)}
@keyframes qrScan{0%{opacity:0;top:0}10%{opacity:1}90%{opacity:1}100%{opacity:0;top:calc(100% - 3px)}}
.qr-lb-ft{display:flex;justify-content:space-between;font-size:9px;font-weight:700;color:#8a9a91;letter-spacing:.04em}

/* yazıcı gövdesi */
.qr-printer{position:relative;width:196px;height:118px;border-radius:18px 18px 22px 22px;background:linear-gradient(180deg,#2a302d,#161a18);box-shadow:0 0 0 1px rgba(255,255,255,.08) inset,0 30px 50px -20px rgba(0,0,0,.8);z-index:2}
.qr-printer::before{content:"";position:absolute;left:20px;right:20px;top:-2px;height:9px;border-radius:0 0 6px 6px;background:#070908;box-shadow:0 2px 0 rgba(255,255,255,.05)}
.qr-printer::after{content:"";position:absolute;left:0;right:0;bottom:-10px;height:14px;border-radius:50%;background:radial-gradient(ellipse at center,rgba(0,0,0,.6),transparent 70%);z-index:-1}
.qr-lid{position:absolute;left:14px;right:14px;top:18px;height:46px;border-radius:12px;background:linear-gradient(180deg,#1f2422,#171b19);box-shadow:0 1px 0 rgba(255,255,255,.06) inset}
.qr-led{position:absolute;left:22px;bottom:18px;width:8px;height:8px;border-radius:50%;background:#34d399;box-shadow:0 0 8px rgba(52,211,153,.9)}
.qr.printing .qr-led{animation:qrBlink .5s step-end infinite}
@keyframes qrBlink{50%{opacity:.25}}
.qr-brand{position:absolute;right:20px;bottom:14px;font-size:10px;font-weight:800;letter-spacing:.12em;color:rgba(255,255,255,.35)}
.qr-cap{margin-top:16px;font-size:12.5px;font-weight:700;color:rgba(214,235,224,.75);display:inline-flex;align-items:center;gap:8px;min-height:20px}
.qr-cap i{width:8px;height:8px;border-radius:50%;background:#34d399;flex:none}

/* telefon ekranı: liste → detay */
.qr-phone{position:relative;justify-self:center}
.qr .fph-scr{position:relative}
.qr-screen{position:absolute;inset:44px 11px 0;display:flex;flex-direction:column;gap:8px;transition:opacity .4s,transform .4s}
.qr-detail{opacity:0;transform:translateX(16px);pointer-events:none}
.qr.opened .qr-detail{opacity:1;transform:none}
.qr.opened .qr-list{opacity:0;transform:translateX(-16px)}
.qr-toast{position:absolute;left:11px;right:11px;top:50px;z-index:3;opacity:0;transform:translateY(-10px);transition:opacity .35s,transform .35s}
.qr.opened .qr-toast{opacity:1;transform:none}
.qr-items .fph-row b{font-size:10.5px}
.qr-sum{display:flex;justify-content:space-between;font-weight:800;font-size:11px;padding-top:7px}

/* reduced motion: son kare statik */
.qr.qr-rm .qr-label,.qr.qr-rm .qr-screen,.qr.qr-rm .qr-toast{transition:none}
.qr.qr-rm .qr-led{animation:none}

@media (max-width:600px){
 .qr{grid-template-columns:minmax(0,1fr);gap:22px;align-items:center;justify-items:center;min-height:0}
 .qr-left{min-height:0}
 .qr-feed{height:200px}
}