/* School Library — screens that the base design (site.css) does not cover */
.stat-books { --stat-color: linear-gradient(135deg, #0d9488, #0284c7); }
.stat-issued { --stat-color: linear-gradient(135deg, #6366f1, #0ea5e9); }
.stat-overdue { --stat-color: linear-gradient(135deg, #f97316, #ef4444); }
.stat-members { --stat-color: linear-gradient(135deg, #8b5cf6, #d946ef); }
.stat-fines { --stat-color: linear-gradient(135deg, #10b981, #14b8a6); }
.stat-sub { font-size: .75rem; color: var(--app-muted); margin-top: .1rem; }
.bar-issued, .legend-issued { background: linear-gradient(180deg, #2dd4bf, #0d9488); }
.bar-returned, .legend-returned { background: linear-gradient(180deg, #7dd3fc, #0284c7); }

/* Trial / subscription banner */
.plan-banner {
    display: flex; align-items: center; gap: .75rem; flex-wrap: wrap;
    padding: .65rem 1rem; margin-bottom: 1rem; border-radius: var(--app-radius);
    background: linear-gradient(90deg, #fffbeb, #fef3c7); border: 1px solid #fde68a; color: #92400e;
    animation: slide-down .3s var(--app-ease);
}
.plan-banner.ending { background: linear-gradient(90deg, #fef2f2, #fee2e2); border-color: #fecaca; color: #991b1b; }
.plan-banner i { font-size: 1.15rem; }

/* Sidebar badge */
.sidebar .nav-link .badge { margin-left: auto; background: #f97316 !important; color: #fff !important; }

/* Quick actions on the dashboard */
.quick-action {
    display: flex; align-items: center; gap: .8rem; padding: .9rem 1rem; height: 100%;
    background: var(--app-surface); border: 1px solid var(--app-border); border-radius: var(--app-radius);
    box-shadow: var(--app-shadow); color: var(--app-text); text-decoration: none; font-weight: 600;
    transition: transform .2s var(--app-ease), box-shadow .2s var(--app-ease), border-color .2s;
}
.quick-action:hover { transform: translateY(-2px); box-shadow: var(--app-shadow-lg); border-color: #b9e6e0; color: var(--app-accent-dark); }
.quick-action .qa-icon {
    width: 42px; height: 42px; border-radius: 12px; display: inline-flex; align-items: center; justify-content: center;
    font-size: 1.2rem; color: #fff; background: var(--app-gradient); flex-shrink: 0;
}
.quick-action small { display: block; font-weight: 500; color: var(--app-muted); font-size: .75rem; }

/* Issue / return desk */
.desk-tabs .nav-link { font-weight: 700; border-radius: 12px; padding: .6rem 1.2rem; color: var(--app-muted); }
.desk-tabs .nav-link.active { background: var(--app-gradient); color: #fff; box-shadow: 0 6px 16px rgba(13, 148, 136, .3); }
.scan-input { font-size: 1.15rem; padding: .7rem 1rem; font-weight: 600; letter-spacing: .02em; }
.scan-input::placeholder { font-weight: 500; letter-spacing: 0; }
.scan-hint { font-size: .78rem; color: var(--app-muted); }
.scan-hint kbd { background: #eef2f7; color: #334155; border: 1px solid #dbe2ea; font-size: .72rem; }

.member-card { display: flex; gap: 1rem; align-items: flex-start; }
.avatar {
    width: 54px; height: 54px; border-radius: 16px; flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center;
    background: var(--app-gradient); color: #fff; font-weight: 800; font-size: 1.15rem; letter-spacing: .02em; object-fit: cover;
}
.avatar-sm { width: 36px; height: 36px; border-radius: 11px; font-size: .85rem; }
.avatar-lg { width: 76px; height: 76px; border-radius: 20px; font-size: 1.6rem; }
.limit-meter { height: 8px; border-radius: 99px; background: #eef1f6; overflow: hidden; }
.limit-meter > span { display: block; height: 100%; border-radius: 99px; background: var(--app-gradient); }
.limit-meter.full > span { background: linear-gradient(90deg, #f97316, #ef4444); }

.book-cover {
    width: 56px; height: 76px; border-radius: 8px; flex-shrink: 0; object-fit: cover;
    display: inline-flex; align-items: center; justify-content: center; font-size: 1.4rem; color: #fff;
    background: linear-gradient(160deg, #14b8a6, #0369a1); box-shadow: 0 4px 10px rgba(3, 105, 161, .25);
}
.book-cover-sm { width: 34px; height: 46px; border-radius: 6px; font-size: .95rem; }
.book-cover-lg { width: 110px; height: 150px; border-radius: 12px; font-size: 2.6rem; }

/* Autocomplete (member / book pickers) */
.lookup-wrap { position: relative; }
.lookup-menu {
    position: absolute; z-index: 1050; left: 0; right: 0; top: calc(100% + 4px); max-height: 340px; overflow-y: auto;
    background: #fff; border: 1px solid var(--app-border); border-radius: var(--app-radius); box-shadow: var(--app-shadow-lg);
    padding: .3rem; animation: pop-in .15s var(--app-ease);
}
.lookup-item { display: flex; gap: .6rem; align-items: center; padding: .45rem .6rem; border-radius: 9px; cursor: pointer; }
.lookup-item:hover, .lookup-item.active { background: var(--app-accent-soft); }
.lookup-item .small { color: var(--app-muted); }
.lookup-empty { padding: .6rem; color: var(--app-muted); font-size: .85rem; }

/* Sign-up page */
.auth-card-wide { max-width: 980px !important; overflow: hidden; }
.auth-side { background: linear-gradient(160deg, #0f3a44 0%, #115e59 100%); color: #cfe9ea; }
.auth-side h2 { color: #fff; }
.signup-perks { list-style: none; padding: 0; }
.signup-perks li { margin-bottom: .6rem; display: flex; gap: .55rem; }
.signup-perks i { color: #5eead4; }

/* Empty states */
.empty-state { text-align: center; padding: 3rem 1rem; }
.empty-state .stat-icon { margin-left: auto; margin-right: auto; }

/* Barcode labels (Books → Print labels) */
.label-sheet { display: grid; grid-template-columns: repeat(auto-fill, minmax(62mm, 1fr)); gap: 3mm; }
.book-label {
    border: 1px dashed #c8d1dc; border-radius: 6px; padding: 2mm 3mm; text-align: center; background: #fff;
    break-inside: avoid; page-break-inside: avoid;
}
.book-label .lbl-school { font-size: 7.5pt; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: #334155; }
.book-label .lbl-title { font-size: 8pt; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.book-label svg { max-width: 100%; height: 14mm; }
.book-label .lbl-meta { font-size: 7.5pt; color: #475569; }

/* Library cards (Members → Print cards) */
.card-sheet { display: grid; grid-template-columns: repeat(auto-fill, 86mm); gap: 5mm; }
.lib-card {
    width: 86mm; height: 54mm; border-radius: 3.5mm; overflow: hidden; position: relative; background: #fff;
    border: 1px solid #cfd8e3; display: flex; flex-direction: column; break-inside: avoid; page-break-inside: avoid;
    -webkit-print-color-adjust: exact; print-color-adjust: exact;
}
.lib-card-head { background: var(--app-gradient); color: #fff; padding: 2mm 3.5mm; display: flex; align-items: center; gap: 2mm; }
.lib-card-head .school { font-weight: 800; font-size: 9pt; line-height: 1.1; }
.lib-card-head .sub { font-size: 6.5pt; opacity: .85; text-transform: uppercase; letter-spacing: .08em; }
.lib-card-body { display: flex; gap: 3mm; padding: 2.5mm 3.5mm 0; flex: 1; }
.lib-card-body .avatar { width: 15mm; height: 18mm; border-radius: 2mm; font-size: 12pt; }
.lib-card-body .name { font-weight: 800; font-size: 10pt; line-height: 1.15; }
.lib-card-body .meta { font-size: 7.5pt; color: #475569; line-height: 1.45; }
.lib-card-foot { text-align: center; padding: 0 3mm 1.5mm; }
.lib-card-foot svg { height: 11mm; max-width: 100%; }

/* Printable documents (receipt, overdue notice) */
.doc { max-width: 820px; margin: 0 auto; background: #fff; }
.doc-head { border-bottom: 2px solid var(--app-text); padding-bottom: .6rem; margin-bottom: 1rem; }
.notice { border: 1px solid #d5dbe5; border-radius: 10px; padding: 1rem 1.2rem; margin-bottom: 1rem; break-inside: avoid; page-break-inside: avoid; background: #fff; }

@media print {
    .label-sheet { gap: 2mm; }
    .book-label { border-color: #ddd; }
    .notice { border-color: #999; }
    .page-break { page-break-after: always; }
    .plan-banner { display: none !important; }
}

.min-w-0 { min-width: 0; }

/* Links: underline only on hover; pills and tabs in the library colours */
a { text-decoration: none; }
a:hover { text-decoration: underline; }
.btn:hover, .nav-link:hover, .dropdown-item:hover, .stat-card:hover, .quick-action:hover, .report-tile:hover, .list-group-item-action:hover { text-decoration: none; }
.nav-pills .nav-link { color: var(--app-accent-dark); font-weight: 600; }
.nav-pills .nav-link.active { background: var(--app-gradient); color: #fff; }
.nav-tabs .nav-link { color: var(--app-muted); font-weight: 600; }
.nav-tabs .nav-link.active { color: var(--app-accent-dark); }

/* ---------- Online payment plans ---------- */
.plan-option { position: relative; border: 1px solid var(--bs-border-color); border-radius: .75rem; padding: 1rem; background: var(--bs-body-bg); }
.plan-option.best { border-color: var(--app-accent); box-shadow: 0 0 0 1px var(--app-accent); }
.plan-option .plan-price { font-size: 1.6rem; font-weight: 700; line-height: 1.2; margin: .25rem 0; }
.plan-option .plan-tag { position: absolute; top: -.6rem; right: .75rem; }

/* ---------- Suggestions / What's new ---------- */
.pre-line { white-space: pre-line; }
.suggestion { border: 1px solid var(--bs-border-color); border-radius: .6rem; padding: .75rem .9rem; margin-bottom: .75rem; }
.suggestion.answered { border-color: var(--app-accent); }
.suggestion-reply { background: var(--app-accent-soft, rgba(13, 148, 136, .08)); border-radius: .5rem; padding: .5rem .75rem; }
.icon-btn { position: relative; width: 34px; height: 34px; display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; color: var(--bs-body-color); }
.icon-btn:hover { background: var(--bs-tertiary-bg); text-decoration: none; }
.icon-btn .bi { font-size: 1.1rem; }
.icon-btn .dot { position: absolute; top: 2px; right: 2px; min-width: 16px; height: 16px; padding: 0 4px; border-radius: 8px; background: #ef4444; color: #fff; font-size: .65rem; font-weight: 700; line-height: 16px; text-align: center; }