/* ==========================================================================
   shams-scan.css — نافذة قراءة الباركود/‏QR بالكاميرا | camera barcode/QR scanner modal
   يعمل داخل مربّع بحث المتجر عبر أيقونة كاميرا صغيرة | opens from the store search box.
   ========================================================================== */

/* أيقونة الكاميرا داخل مربّع البحث | camera button inside the search box */
.sf-scan-btn {
    border: 0;
    background: transparent;
    color: var(--sf-muted, #6c757d);
    padding: 0 .35rem;
    font-size: 1.05rem;
    line-height: 1;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
}
.sf-scan-btn:hover { color: var(--sf-accent, #e83e8c); }

/* الغطاء | overlay */
.qrsc-overlay {
    position: fixed; inset: 0;
    background: rgba(0, 0, 0, .82);
    z-index: 20000;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 16px;
}
.qrsc-overlay.open { display: flex; }

/* الصندوق | dialog */
.qrsc-box {
    width: min(460px, 96vw);
    background: #0e0e11;
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 20px 60px rgba(0, 0, 0, .5);
    color: #fff;
    position: relative;
}
.qrsc-head {
    display: flex; align-items: center; gap: 10px;
    padding: 12px 14px;
    background: #17171c;
    border-bottom: 1px solid rgba(255, 255, 255, .08);
}
.qrsc-head .qrsc-ttl { font-weight: 700; font-size: 1rem; }
.qrsc-head .qrsc-x {
    margin-inline-start: auto;
    background: transparent; border: 0; color: #fff;
    font-size: 1.15rem; cursor: pointer; line-height: 1;
}

/* منطقة الفيديو | video stage */
.qrsc-stage {
    position: relative;
    width: 100%;
    aspect-ratio: 3 / 4;
    background: #000;
    overflow: hidden;
}
.qrsc-stage video {
    width: 100%; height: 100%;
    object-fit: cover;
    display: block;
}
/* إطار الاستهداف | targeting frame */
.qrsc-frame {
    position: absolute; inset: 0;
    display: flex; align-items: center; justify-content: center;
    pointer-events: none;
}
.qrsc-frame::before {
    content: "";
    width: 66%; aspect-ratio: 1 / 1;
    border: 3px solid rgba(255, 255, 255, .9);
    border-radius: 16px;
    box-shadow: 0 0 0 4000px rgba(0, 0, 0, .35);
}
.qrsc-scanline {
    position: absolute;
    left: 17%; right: 17%;
    height: 2px;
    background: linear-gradient(90deg, transparent, #4be36a, transparent);
    top: 17%;
    animation: qrscMove 2.2s ease-in-out infinite;
}
@keyframes qrscMove { 0%,100% { top: 18%; } 50% { top: 82%; } }

/* شريط الحالة/الأزرار | status + actions */
.qrsc-foot {
    padding: 10px 14px 14px;
    background: #17171c;
    text-align: center;
}
.qrsc-status { font-size: .9rem; color: #cfcfd6; min-height: 1.25em; }
.qrsc-status.err { color: #ff8a8a; }
.qrsc-status.ok  { color: #7ee29a; }
.qrsc-actions { margin-top: 10px; display: flex; gap: 8px; justify-content: center; flex-wrap: wrap; }
.qrsc-actions .btn { min-width: 120px; }

/* إدخال يدوي (احتياطي إن رُفض الإذن) | manual fallback input */
.qrsc-manual { margin-top: 10px; display: none; gap: 8px; }
.qrsc-manual.show { display: flex; }
.qrsc-manual input {
    flex: 1; border-radius: 10px; border: 1px solid #333; background: #0e0e11; color: #fff;
    padding: 8px 10px; font-size: .95rem; direction: ltr; text-align: left;
}

/* الزر المُضاف تلقائياً بجانب مربّعات البحث | auto-injected button next to search boxes */
.js-shams-scan { display: inline-flex; align-items: center; justify-content: center; line-height: 1; }
.js-shams-scan.shams-scan-standalone { margin-inline-start: .35rem; vertical-align: middle; }
.js-shams-scan .bi { font-size: 1rem; }