/* ===== Desktop QR widget (web only) ===== */
.qr-widget{ position:fixed; right:22px; bottom:22px; width:206px; z-index:9990; }
.qr-widget__card{ position:relative; background:#fff; border-radius:16px; box-shadow:0 10px 30px rgba(0,0,0,.13); padding:15px 15px 13px; text-align:center; }

/* dikkat çekici ring: üstten (12 yön) başlar, saat yönünde 15sn'de bir tur, yeşil -> kırmızı */
@property --qrFill { syntax: '<angle>'; inherits: false; initial-value: 0deg; }
.qr-widget__card::before{
	content:""; position:absolute; inset:-3px; border-radius:19px; padding:3px; pointer-events:none; z-index:1;
	background: conic-gradient(from 0deg, #2fa56a, #8ec63f, #f5b301, #e0483d var(--qrFill), transparent var(--qrFill) 360deg);
	-webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
	        mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
	-webkit-mask-composite: xor; mask-composite: exclude;
	animation: qrFillAnim 15s linear forwards;
}
@keyframes qrFillAnim{ to{ --qrFill:360deg; } }
.qr-widget__ring{ display:none; } /* eski svg yaklaşımı kullanılmıyor */

.qr-widget__qr{ position:relative; z-index:2; width:150px; height:150px; display:block; margin:0 auto 8px; border-radius:8px; }
.qr-widget__cap{ position:relative; z-index:2; font-family:var(--wp--preset--font-family--serif,Georgia,serif); font-weight:600; font-size:1rem; color:#1A1A1A; }
.qr-widget__sub{ position:relative; z-index:2; font-size:.76rem; color:#6B6760; margin-top:2px; line-height:1.35; }
.qr-widget__rate{ position:relative; z-index:2; margin-top:7px; font-size:.72rem; color:#6B6760; }
.qr-widget__rate b{ color:#E6A817; letter-spacing:1px; font-size:.82rem; }
@media (max-width:900px){ .qr-widget{ display:none; } }

/* ===== Mobile app banner (mobile only) ===== */
.app-banner{ position:fixed; left:12px; right:12px; bottom:12px; z-index:9991; background:#fff; border-radius:18px; box-shadow:0 14px 40px rgba(0,0,0,.20); padding:15px 15px 17px; transform:translateY(150%); transition:transform .42s cubic-bezier(.22,1,.36,1); }
.app-banner.is-visible{ transform:translateY(0); }
/* banner çıkınca arka planı karart (dikkat çek) */
.app-backdrop{ position:fixed; inset:0; background:rgba(0,0,0,.55); opacity:0; pointer-events:none; transition:opacity .4s ease; z-index:9989; }
.app-backdrop.is-visible{ opacity:1; pointer-events:auto; }
.app-banner__row{ display:flex; align-items:center; gap:13px; }
.app-banner__icon{ width:58px; height:58px; border-radius:14px; flex:0 0 58px; object-fit:cover; }
.app-banner__title{ font-weight:700; font-size:1.1rem; color:#1A1A1A; display:flex; align-items:center; gap:8px; line-height:1.1; }
.app-banner__title .stars{ color:#E6A817; font-size:.82rem; letter-spacing:1px; }
.app-banner__sub{ font-size:.9rem; color:#3a3a3a; margin-top:2px; line-height:1.3; }
.app-banner__store{ font-size:.8rem; color:#8a8a8a; margin-top:1px; }
.app-banner__actions{ display:flex; gap:11px; margin-top:14px; }
.app-banner__no, .app-banner__cta{ flex:1; text-align:center; padding:13px 0; border-radius:12px; font-size:1rem; font-weight:600; cursor:pointer; border:1px solid #d8d3c7; background:#fff; color:#1A1A1A; }
.app-banner__cta{ background:#1A1A1A; border-color:#1A1A1A; color:#fff; text-decoration:none; }
@media (min-width:901px){ .app-banner, .app-backdrop{ display:none !important; } }