/**
 * Bajro Quick Reader PRO - Styles
 * Version: 1.0.1
 */

.bsnp-qr-overlay { position: fixed; inset: 0; z-index: 9999999999; display: none; align-items: center; justify-content: center; opacity: 0; transition: opacity 0.3s; }
.bsnp-qr-overlay.active { display: flex; opacity: 1; }
.bsnp-qr-backdrop { position: absolute; inset: 0; background: rgba(0,0,0,0.9); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
.bsnp-qr-container { position: relative; width: 100%; max-width: 720px; height: 100dvh; background: var(--bg-color, #fff); display: flex; flex-direction: column; transform: translateY(20px); transition: 0.3s ease; }
.bsnp-qr-overlay.active .bsnp-qr-container { transform: translateY(0); }

/* সোয়াইপ ইন্ডিকেটর */
.bsnp-swipe-hint-wrap { position: absolute; inset: 0; display: none; flex-direction: column; align-items: center; justify-content: center; background: rgba(0,0,0,0.6); z-index: 50; color: #fff; pointer-events: none; transition: 0.5s; opacity: 0; }
.bsnp-swipe-hint-wrap.show { display: flex; opacity: 1; }
.bsnp-swipe-hand { font-size: 50px; animation: bsnp-swipe-anim 1.5s infinite; }
.bsnp-swipe-hint-wrap span { margin-top: 15px; font-family: var(--font-ui); font-size: 18px; font-weight: 700; background: var(--accent-color); padding: 5px 20px; border-radius: 50px; }
@keyframes bsnp-swipe-anim { 0% { transform: translateX(40px); } 50% { transform: translateX(-40px); } 100% { transform: translateX(40px); } }

/* হেডার */
.bsnp-qr-header { padding: 10px 20px; background: var(--surface-color); border-bottom: 1px solid var(--border-color); display: flex; justify-content: space-between; align-items: center; flex-shrink: 0; z-index: 20; }
.bsnp-qr-h-side { flex: 1; display: flex; align-items: center; }
.bsnp-qr-h-center { flex: 2; display: flex; justify-content: center; align-items: center; }
.bsnp-qr-h-center img { max-height: 32px; width: auto; }
.text-right { justify-content: flex-end; }
.bsnp-qr-back-btn { background: var(--border-color); border: none; width: 32px; height: 32px; border-radius: 50%; cursor: pointer; color: var(--heading-color); }
.bsnp-qr-close-x { background: none; border: none; font-size: 35px; cursor: pointer; color: var(--heading-color); line-height: 1; }

/* কন্টেন্ট */
.bsnp-qr-scroll-area { flex: 1; overflow-y: auto; padding: 25px 20px 50px; -webkit-overflow-scrolling: touch; }
.bsnp-qr-subtitle { font-family: var(--font-body); font-size: 19px; color: #ff0000; font-weight: 400; margin-bottom: 10px; display: block; }
.bsnp-qr-title { font-family: var(--font-ui); font-size: 34px; line-height: 1.35; color: var(--heading-color); font-weight: 500; margin: 0 0 15px; }
.bsnp-qr-meta-text { font-family: var(--font-body); font-size: 15px; color: #888; margin-bottom: 20px; border-bottom: 1px solid var(--border-color); padding-bottom: 10px; }
.bsnp-qr-meta-text strong { color: var(--accent-color); font-weight: 600; }
.bsnp-qr-scroll-area img { width: 100% !important; aspect-ratio: 16/9 !important; object-fit: cover !important; border-radius: 10px; margin-bottom: 25px; }
.bsnp-qr-entry { font-family: var(--font-body); font-size: 18px; line-height: 1.9; color: var(--body-color); font-weight: 400; }

/* ফুটার */
.bsnp-qr-footer { padding: 15px 20px; background: var(--surface-color); border-top: 1px solid var(--border-color); flex-shrink: 0; z-index: 20; padding-bottom: calc(15px + env(safe-area-inset-bottom)); }
.bsnp-qr-nav-btns { display: flex; justify-content: space-between; gap: 10px; margin-bottom: 15px; }
.bsnp-nav-pill-btn { flex: 1; background: #fff; border: 1px solid var(--border-color); padding: 12px 10px; border-radius: 50px; font-family: var(--font-ui); font-size: 17px; font-weight: 600; cursor: pointer; display: flex; align-items: center; justify-content: center; gap: 8px; color: var(--heading-color); }
.bsnp-nav-pill-btn:disabled { opacity: 0.4; }
.bsnp-qr-footer-actions { display: flex; justify-content: space-between; align-items: center; border-top: 1px dashed var(--border-color); padding-top: 15px; }
.bsnp-qr-share { background: none; border: none; font-size: 16px; font-weight: 700; color: var(--accent-color); cursor: pointer; font-family: var(--font-ui); display: flex; align-items: center; gap: 8px; }
.bsnp-qr-visit { text-decoration: none; color: var(--accent-color); font-weight: 800; font-family: var(--font-ui); font-size: 16px; }

/* শিমার */
.bsnp-qr-shimmer { padding: 30px; }
.bs-sk-line, .bs-sk-img { margin-bottom: 15px; border-radius: 4px; animation: bs_sk_move 1.5s infinite linear; background: linear-gradient(90deg, #f5f5f5 25%, #e9e9e9 50%, #f5f5f5 75%); background-size: 200% 100%; }
.bs-sk-line { height: 18px; width: 100%; }
.bs-sk-line.title { height: 30px; width: 80%; }
.bs-sk-img { height: 200px; width: 100%; }
@keyframes bs_sk_move { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } }
[data-theme="dark"] .bs-sk-line,
[data-theme="dark"] .bs-sk-img { background: linear-gradient(90deg, #1a2f4e 25%, #1e3a5f 50%, #1a2f4e 75%); background-size: 200% 100%; animation: bs_sk_move 1.5s infinite linear; }

/* ডার্ক মোড */
[data-theme="dark"] .bsnp-qr-container { background: #0D1322; }
[data-theme="dark"] .bsnp-qr-header,
[data-theme="dark"] .bsnp-qr-footer { background: #0A1628; }
[data-theme="dark"] .bsnp-nav-pill-btn { background: #1e3a5f; color: #fff; border-color: #334155; }
[data-theme="dark"] .bsnp-qr-title,
[data-theme="dark"] .bsnp-qr-meta-text,
[data-theme="dark"] .bsnp-qr-entry,
[data-theme="dark"] .bsnp-qr-share,
[data-theme="dark"] .bsnp-qr-visit,
[data-theme="dark"] .bsnp-qr-back-btn,
[data-theme="dark"] .bsnp-qr-close-x { color: var(--heading-color); }
[data-theme="dark"] .bsnp-qr-backdrop { background: rgba(0,0,0,0.95); }

@media (max-width: 480px) {
    .bsnp-qr-title { font-size: 32px; }
    .bsnp-qr-entry { font-size: 18px; }
}
