/* ============================================================
   BookSwap · theme.css (v1) — CANÓNICO, NO REGENERAR
   Design tokens + dark mode + componentes base.
   Se carga DESPUÉS de Bootstrap 5.3 (lo puentea y personaliza).
   REGLAS PARA EL AGENTE:
   · Los componentes nuevos usan SOLO estos tokens/variables.
   · Los estilos específicos de página van en assets/css/paginas.css.
   · No fijar colores hex fuera de aquí.
   ============================================================ */

/* ---------- 1. TOKENS ---------- */
:root {
  /* Marca */
  --brand-50:#EEF2FF; --brand-100:#E0E7FF; --brand-200:#C7D2FE; --brand-300:#A5B4FC;
  --brand-400:#818CF8; --brand-500:#6366F1; --brand-600:#4F46E5; --brand-700:#4338CA;
  --brand-800:#3730A3; --brand-900:#312E81;
  --accent-400:#FBBF24; --accent-500:#F59E0B; --accent-600:#D97706;
  --ok-500:#10B981; --ok-600:#059669;
  --danger-500:#EF4444; --danger-600:#DC2626;
  --info-500:#0EA5E9; --warn-500:#F59E0B;

  /* Semánticos (tema claro) */
  --bg:#F8FAFC; --surface:#FFFFFF; --surface-2:#F1F5F9; --surface-3:#E2E8F0;
  --text:#0F172A; --text-muted:#64748B; --border:#E2E8F0; --border-strong:#CBD5E1;
  --brand-soft:rgba(79,70,229,.10);
  --ok-soft:rgba(16,185,129,.14);  --danger-soft:rgba(239,68,68,.12);
  --warn-soft:rgba(245,158,11,.16); --info-soft:rgba(14,165,233,.14);

  /* Forma y sombras */
  --radius-sm:.5rem; --radius:.75rem; --radius-lg:1rem; --radius-xl:1.5rem;
  --shadow-sm:0 1px 2px rgba(15,23,42,.06),0 1px 3px rgba(15,23,42,.08);
  --shadow:0 2px 4px rgba(15,23,42,.05),0 8px 24px rgba(15,23,42,.08);
  --shadow-lg:0 4px 8px rgba(15,23,42,.06),0 16px 40px rgba(15,23,42,.14);

  --font-sans:'Plus Jakarta Sans',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --trans:180ms ease;

  /* Puente con Bootstrap 5.3 */
  --bs-primary:#4F46E5; --bs-primary-rgb:79,70,229;
  --bs-body-color:#0F172A; --bs-body-bg:#F8FAFC;
  --bs-body-font-family:var(--font-sans);
  --bs-border-radius:.75rem; --bs-border-radius-lg:1rem;
  --bs-link-color:#4F46E5; --bs-link-color-rgb:79,70,229;
  --bs-link-hover-color:#4338CA; --bs-link-hover-color-rgb:67,56,202;
  --bs-card-bg:var(--surface);
  --bs-card-color:var(--text);
  --bs-card-border-color:var(--border);
  --bs-card-cap-bg:var(--surface-2);
  --bs-list-group-bg:var(--surface);
  --bs-list-group-color:var(--text);
  --bs-list-group-border-color:var(--border);
  --bs-tertiary-bg:var(--surface-2);
  --bs-secondary-bg:var(--surface-2);
  --bs-border-color:var(--border);
}

[data-theme="dark"],
[data-bs-theme="dark"] {
  --bg:#121212; --surface:#1E1E1E; --surface-2:#282828; --surface-3:#333333;
  --text:#EDEDED; --text-muted:#A3A3A3; --border:#333333; --border-strong:#484848;
  --brand-soft:rgba(99,102,241,.18);
  --ok-soft:rgba(16,185,129,.18);  --danger-soft:rgba(239,68,68,.16);
  --warn-soft:rgba(245,158,11,.18); --info-soft:rgba(14,165,233,.18);
  --shadow-sm:0 1px 2px rgba(0,0,0,.6),0 1px 3px rgba(0,0,0,.7);
  --shadow:0 2px 4px rgba(0,0,0,.5),0 10px 28px rgba(0,0,0,.6);
  --shadow-lg:0 6px 12px rgba(0,0,0,.6),0 20px 48px rgba(0,0,0,.7);
  --bs-body-color:#EDEDED; --bs-body-bg:#121212;
  --bs-heading-color:#F5F5F5;
  --bs-secondary-color:#A3A3A3;
  --bs-border-color:#333333;
  --bs-border-color-translucent:#333333;
  --bs-card-bg:var(--surface);
  --bs-card-color:var(--text);
  --bs-card-border-color:var(--border);
  --bs-card-cap-bg:var(--surface-2);
  --bs-list-group-bg:var(--surface);
  --bs-list-group-color:var(--text);
  --bs-list-group-border-color:var(--border);
  --bs-tertiary-bg:var(--surface-2);
  --bs-secondary-bg:var(--surface-2);
  color-scheme:dark;
}

/* ---------- 2. BASE ---------- */
* { -webkit-tap-highlight-color:transparent }
html { scroll-behavior:smooth }
body { background:var(--bg); color:var(--text); font-family:var(--font-sans);
  min-height:100vh; display:flex; flex-direction:column;
  transition:background var(--trans),color var(--trans) }
main { flex:1 0 auto }
:focus-visible { outline:3px solid rgba(99,102,241,.55); outline-offset:2px; border-radius:.25rem }
::selection { background:var(--brand-200); color:var(--brand-900) }
.fw-800 { font-weight:800 }

/* ---------- 3. BOTONES ---------- */
.btn { border-radius:var(--radius); font-weight:600; transition:all var(--trans) }
.btn:active { transform:scale(.97) }
.btn-primary { --bs-btn-bg:var(--brand-600); --bs-btn-border-color:var(--brand-600);
  --bs-btn-hover-bg:var(--brand-700); --bs-btn-hover-border-color:var(--brand-700);
  --bs-btn-active-bg:var(--brand-800); --bs-btn-active-border-color:var(--brand-800);
  --bs-btn-focus-shadow-rgb:79,70,229 }
.btn-outline-primary { --bs-btn-color:var(--brand-600); --bs-btn-border-color:var(--brand-600);
  --bs-btn-hover-bg:var(--brand-600); --bs-btn-hover-border-color:var(--brand-600);
  --bs-btn-active-bg:var(--brand-700); --bs-btn-active-border-color:var(--brand-700) }
.btn-accent { background:linear-gradient(135deg,var(--accent-500),var(--accent-600));
  border:0; color:#fff; box-shadow:var(--shadow-sm) }
.btn-accent:hover,.btn-accent:focus { filter:brightness(1.06); color:#fff;
  transform:translateY(-1px); box-shadow:var(--shadow) }
.btn-soft { background:var(--surface-2); color:var(--text); border:1px solid var(--border) }
.btn-soft:hover { background:var(--surface-3); color:var(--text) }

/* ---------- 4. TARJETAS DE LIBRO ---------- */
.card-libro { background:var(--surface); border:1px solid var(--border);
  border-radius:var(--radius-lg); overflow:hidden; height:100%; display:flex; flex-direction:column;
  transition:transform var(--trans),box-shadow var(--trans),border-color var(--trans) }
.card-libro:hover { transform:translateY(-4px); box-shadow:var(--shadow-lg); border-color:var(--brand-300) }
.card-libro-portada { aspect-ratio:2/3; width:100%; object-fit:cover; background:var(--surface-2); display:block }
[data-theme="dark"] .card-libro-portada { filter:brightness(.9) }
.portada-placeholder { aspect-ratio:2/3; display:grid; place-items:center;
  background:linear-gradient(150deg,var(--brand-600),var(--brand-800));
  color:#fff; font-size:2.2rem; font-weight:800 }
/* Ratios editoriales para portadas de libros */
.ratio-3x4 { --bs-aspect-ratio: calc(4 / 3 * 100%); }
.ratio-2x3 { --bs-aspect-ratio: calc(3 / 2 * 100%); }
.card-libro-cuerpo { padding:1rem; display:flex; flex-direction:column; gap:.3rem; flex:1 }
.card-libro-titulo { font-weight:700; font-size:.95rem; line-height:1.3; margin:0;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden }
.card-libro-autor { color:var(--text-muted); font-size:.85rem; margin:0 }
.card-libro-pie { margin-top:auto; padding-top:.55rem; display:flex;
  align-items:center; justify-content:space-between; gap:.5rem }
.precio-token { font-weight:800; color:var(--accent-600); white-space:nowrap; font-size:.9rem }
[data-theme="dark"] .precio-token { color:var(--accent-400) }

/* ---------- 5. CHIPS DE NIVEL Y BADGES DE ESTADO ---------- */
.chip-nivel { display:inline-flex; align-items:center; gap:.35rem; font-size:.78rem;
  font-weight:700; padding:.28rem .7rem; border-radius:999px; line-height:1; white-space:nowrap }
.chip-nivel-3 { background:linear-gradient(135deg,var(--accent-500),#F97316); color:#fff; box-shadow:var(--shadow-sm) }
.chip-nivel-2 { background:var(--surface-3); color:var(--text) }
.chip-nivel-1 { background:var(--brand-soft); color:var(--brand-600) }
[data-theme="dark"] .chip-nivel-1 { color:var(--brand-300) }
.chip-nivel-0 { background:transparent; color:var(--text-muted); border:1.5px dashed var(--border-strong) }

.badge-estado { font-size:.72rem; font-weight:700; padding:.32rem .6rem; border-radius:999px }
.badge-estado-disponible          { background:var(--ok-soft);     color:var(--ok-600) }
.badge-estado-reservado           { background:var(--warn-soft);   color:var(--accent-600) }
.badge-estado-pendiente_validacion{ background:var(--info-soft);   color:#0284C7 }
.badge-estado-retirado            { background:var(--surface-2);   color:var(--text-muted) }
.badge-estado-baja                { background:var(--danger-soft); color:var(--danger-600) }
[data-theme="dark"] .badge-estado-disponible      { color:#34D399 }
[data-theme="dark"] .badge-estado-reservado       { color:var(--accent-400) }
[data-theme="dark"] .badge-estado-pendiente_validacion { color:#38BDF8 }

.chip-abierto { display:inline-flex; align-items:center; gap:.4rem; font-weight:700;
  font-size:.8rem; padding:.3rem .7rem; border-radius:999px }
.chip-abierto.si { background:var(--ok-soft); color:var(--ok-600) }
.chip-abierto.no { background:var(--danger-soft); color:var(--danger-600) }

/* ---------- 6. NAVBAR, SALDO Y CAMPANA ---------- */
.navbar-bookswap { background:var(--surface); border-bottom:1px solid var(--border);
  backdrop-filter:saturate(1.4) blur(10px) }
.navbar-brand .brand-logo { width:68px; height:68px; object-fit:contain; transition:transform .2s ease }
@media (max-width:575.98px) { .navbar-brand .brand-logo { width:52px; height:52px } }
.navbar-brand:hover .brand-logo { transform:scale(1.08) }
[data-bs-theme="dark"] .navbar-brand .brand-logo,
[data-theme="dark"] .navbar-brand .brand-logo { filter:drop-shadow(0 0 1px rgba(255,255,255,.45)) }
.footer-bookswap .footer-logo { width:60px; height:60px; object-fit:contain }
.navbar-bookswap .nav-link { font-weight:600; color:var(--text-muted);
  border-radius:var(--radius-sm); padding:.45rem .8rem }
.navbar-bookswap .nav-link:hover,
.navbar-bookswap .nav-link.active { color:var(--brand-600); background:var(--brand-soft) }
.saldo-pill { display:inline-flex; align-items:center; gap:.4rem; font-weight:800;
  background:linear-gradient(135deg,var(--accent-500),var(--accent-600)); color:#fff;
  padding:.35rem .85rem; border-radius:999px; box-shadow:var(--shadow-sm); font-size:.9rem }
.saldo-pill.bump { animation:bump .45s ease }
.campana { position:relative; color:var(--text-muted); font-size:1.15rem; text-decoration:none }
.campana:hover { color:var(--brand-600) }
.campana-badge { position:absolute; top:-5px; right:-7px; min-width:18px; height:18px;
  border-radius:999px; background:var(--danger-500); color:#fff; font-size:.68rem; font-weight:800;
  display:grid; place-items:center; padding:0 4px; animation:pulso 2.2s infinite }
.avatar { width:34px; height:34px; border-radius:999px; object-fit:cover }
.avatar-iniciales { width:34px; height:34px; border-radius:999px; display:grid; place-items:center;
  background:var(--brand-600); color:#fff; font-size:.78rem; font-weight:800 }

/* ---------- 7. HERO / LOGIN SPLIT ---------- */
.hero { border-radius:var(--radius-xl);
  background:radial-gradient(60rem 30rem at 110% -10%, var(--brand-100), transparent 60%),
             radial-gradient(50rem 25rem at -10% 110%, var(--warn-soft), transparent 60%) }
[data-theme="dark"] .hero { background:
             radial-gradient(60rem 30rem at 110% -10%, rgba(79,70,229,.25), transparent 60%),
             radial-gradient(50rem 25rem at -10% 110%, rgba(245,158,11,.12), transparent 60%) }
.hero-titulo { font-weight:800; letter-spacing:-.02em; font-size:clamp(1.9rem,4.5vw,3rem) }
.stat-num { font-size:2.1rem; font-weight:800; color:var(--brand-600); line-height:1 }
[data-theme="dark"] .stat-num { color:var(--brand-300) }
.stat-label { color:var(--text-muted); font-size:.88rem; font-weight:600 }

/* Estructura esperada en Fase 1 (login):
   <div class="login-split"><div class="login-hero">…</div><div class="login-panel">form</div></div> */
.login-split { min-height:calc(100vh - 64px); display:grid; grid-template-columns:1fr 1fr }
.login-hero { background:linear-gradient(160deg,var(--brand-600),var(--brand-800));
  color:#fff; display:grid; place-items:center; padding:3rem }
.login-panel { display:grid; place-items:center; padding:2rem }
.login-separador { display:flex; align-items:center; gap:1rem; color:var(--text-muted);
  font-size:.85rem; margin:1.25rem 0 }
.login-separador::before,.login-separador::after { content:''; height:1px; flex:1; background:var(--border) }
.btn-google { display:inline-flex; align-items:center; justify-content:center; gap:.6rem;
  width:100%; padding:.65rem 1rem; border-radius:var(--radius); font-weight:600;
  background:var(--surface); border:1px solid var(--border-strong); color:var(--text);
  transition:all var(--trans) }
.btn-google:hover { background:var(--surface-2); transform:translateY(-1px); box-shadow:var(--shadow-sm); color:var(--text) }
@media (max-width:991.98px){ .login-split{grid-template-columns:1fr} .login-hero{display:none} }

/* ---------- 8. MODO MOSTRADOR (tablet del personal) ---------- */
.modo-mostrador .btn,.modo-mostrador .dropdown-item { min-height:48px }
.mostrador-input { font-size:1.6rem; font-weight:700; text-align:center; letter-spacing:.06em;
  padding:.9rem; border-radius:var(--radius-lg); border:2px solid var(--border-strong);
  background:var(--surface); color:var(--text) }
.mostrador-input:focus { border-color:var(--brand-500); box-shadow:0 0 0 4px var(--brand-soft) }
.btn-mostrador { min-height:56px; font-size:1.15rem; border-radius:var(--radius-lg) }

/* ---------- 9. FOOTER GLOBAL (siempre oscuro) ---------- */
.footer-bookswap { background:#0F172A; color:#CBD5E1; margin-top:auto; font-size:.92rem }
.footer-bookswap a { color:#A5B4FC; text-decoration:none }
.footer-bookswap a:hover { color:#E0E7FF; text-decoration:underline }
.footer-bookswap h6 { color:#F8FAFC; font-weight:700; text-transform:uppercase;
  letter-spacing:.08em; font-size:.78rem; margin-bottom:.9rem }
.footer-bookswap .lista-horario { list-style:none; padding:0; margin:0 }
.footer-bookswap .lista-horario li { display:flex; justify-content:space-between; gap:1rem; padding:.15rem 0 }
.footer-bookswap .lista-horario li.hoy { color:var(--accent-400); font-weight:700 }

/* ---------- 10. PANEL / FORM / PAGINACIÓN ---------- */
.card-panel { background:var(--surface); border:1px solid var(--border);
  border-radius:var(--radius-lg); box-shadow:var(--shadow-sm) }
.card-panel .card-header { background:transparent; border-bottom:1px solid var(--border); font-weight:700 }
.form-control,.form-select { background:var(--surface); border-color:var(--border-strong); color:var(--text) }
.form-control:focus,.form-select:focus { border-color:var(--brand-500); box-shadow:0 0 0 .25rem var(--brand-soft) }
.form-label { font-weight:600 }
.pagination { --bs-pagination-active-bg:var(--brand-600); --bs-pagination-active-border-color:var(--brand-600);
  --bs-pagination-color:var(--brand-600); --bs-pagination-hover-color:var(--brand-700) }
.pagination .page-link { border-radius:var(--radius-sm)!important; margin:0 2px; border:1px solid var(--border) }
.icono-circulo { width:52px; height:52px; border-radius:16px; display:grid; place-items:center;
  background:var(--brand-soft); color:var(--brand-600); font-size:1.4rem }
[data-theme="dark"] .icono-circulo { color:var(--brand-300) }

/* ---------- 11. SKELETON / EMPTY STATES / TOASTS ---------- */
.skeleton { background:linear-gradient(90deg,var(--surface-2) 25%,var(--surface-3) 50%,var(--surface-2) 75%);
  background-size:200% 100%; animation:shimmer 1.3s infinite; border-radius:var(--radius-sm); color:transparent!important }
@keyframes shimmer { to { background-position:-200% 0 } }

.empty-state { text-align:center; padding:3.5rem 1rem; color:var(--text-muted) }
.empty-state svg { width:110px; height:auto; opacity:.9; margin-bottom:1rem }
.empty-state h3 { color:var(--text); font-weight:700 }

#toasts { position:fixed; top:1rem; right:1rem; z-index:3000; display:flex;
  flex-direction:column; gap:.5rem; width:min(360px,calc(100vw - 2rem)) }
.toast-bs { display:flex; align-items:flex-start; gap:.6rem; background:var(--surface);
  color:var(--text); border:1px solid var(--border); border-left:4px solid var(--info-500);
  border-radius:var(--radius); box-shadow:var(--shadow-lg); padding:.8rem 1rem; animation:entra .25s ease }
.toast-bs.toast-exito { border-left-color:var(--ok-500) }
.toast-bs.toast-error { border-left-color:var(--danger-500) }
.toast-bs.toast-aviso { border-left-color:var(--warn-500) }
.toast-bs.saliendo { opacity:0; transform:translateX(12px); transition:all .3s }

/* ---------- 12. ANIMACIONES Y UTILIDADES ---------- */
@keyframes bump { 30% { transform:scale(1.18) } }
@keyframes pulso { 0%,100% { box-shadow:0 0 0 0 rgba(239,68,68,.5) } 50% { box-shadow:0 0 0 6px rgba(239,68,68,0) } }
@keyframes entra { from { opacity:0; transform:translateY(-8px) } }
@keyframes fadeUp { from { opacity:0; transform:translateY(12px) } }
.fade-up { animation:fadeUp .45s ease both }
.text-token { color:var(--accent-600)!important }
[data-theme="dark"] .text-token,
[data-bs-theme="dark"] .text-token { color:var(--accent-400)!important }
.icono-sol { display:none }
.icono-luna { display:inline-block }
[data-theme="dark"] .icono-sol,
[data-bs-theme="dark"] .icono-sol { display:inline-block!important }
[data-theme="dark"] .icono-luna,
[data-bs-theme="dark"] .icono-luna { display:none!important }

/* ---------- 13. CLASES DE SUPERFICIE Y SOBRESCRITURAS DE TEMA OSCURO ---------- */
.bg-surface   { background-color: var(--surface) !important; }
.bg-surface-2 { background-color: var(--surface-2) !important; }
.bg-surface-3 { background-color: var(--surface-3) !important; }

/* Sobrescrituras para Bootstrap en modo oscuro */
[data-theme="dark"] .bg-white,
[data-bs-theme="dark"] .bg-white {
  background-color: var(--surface) !important;
  color: var(--text) !important;
}

[data-theme="dark"] .bg-light,
[data-bs-theme="dark"] .bg-light,
[data-theme="dark"] .bg-light-subtle,
[data-bs-theme="dark"] .bg-light-subtle {
  background-color: var(--surface-2) !important;
  color: var(--text) !important;
}

[data-theme="dark"] .card,
[data-bs-theme="dark"] .card {
  background-color: var(--surface);
  border-color: var(--border);
  color: var(--text);
}

[data-theme="dark"] .card-header.bg-white,
[data-bs-theme="dark"] .card-header.bg-white,
[data-theme="dark"] .card-header,
[data-bs-theme="dark"] .card-header,
[data-theme="dark"] .card-footer,
[data-bs-theme="dark"] .card-footer {
  background-color: var(--surface-2);
  border-color: var(--border);
  color: var(--text);
}

[data-theme="dark"] .list-group-item,
[data-bs-theme="dark"] .list-group-item {
  background-color: var(--surface);
  border-color: var(--border);
  color: var(--text);
}

[data-theme="dark"] .form-control,
[data-bs-theme="dark"] .form-control,
[data-theme="dark"] .form-select,
[data-bs-theme="dark"] .form-select {
  background-color: var(--surface-2);
  border-color: var(--border);
  color: var(--text);
}

[data-theme="dark"] .form-control:focus,
[data-bs-theme="dark"] .form-control:focus,
[data-theme="dark"] .form-select:focus,
[data-bs-theme="dark"] .form-select:focus {
  background-color: var(--surface);
  border-color: var(--brand-400);
  color: var(--text);
}

[data-theme="dark"] .input-group-text,
[data-bs-theme="dark"] .input-group-text {
  background-color: var(--surface-3);
  border-color: var(--border);
  color: var(--text-muted);
}

[data-theme="dark"] .modal-content,
[data-bs-theme="dark"] .modal-content {
  background-color: var(--surface);
  border-color: var(--border);
  color: var(--text);
}

[data-theme="dark"] .dropdown-menu,
[data-bs-theme="dark"] .dropdown-menu {
  background-color: var(--surface);
  border-color: var(--border);
  color: var(--text);
  box-shadow: var(--shadow-lg);
}

[data-theme="dark"] .dropdown-item,
[data-bs-theme="dark"] .dropdown-item {
  color: var(--text);
}

[data-theme="dark"] .dropdown-item:hover,
[data-bs-theme="dark"] .dropdown-item:hover,
[data-theme="dark"] .dropdown-item:focus,
[data-bs-theme="dark"] .dropdown-item:focus {
  background-color: var(--surface-2);
  color: var(--brand-300);
}

[data-theme="dark"] .dropdown-divider,
[data-bs-theme="dark"] .dropdown-divider {
  border-color: var(--border);
}

[data-theme="dark"] .table,
[data-bs-theme="dark"] .table {
  --bs-table-bg: transparent;
  --bs-table-color: var(--text);
  --bs-table-border-color: var(--border);
  --bs-table-striped-bg: rgba(255, 255, 255, 0.03);
  --bs-table-hover-bg: rgba(255, 255, 255, 0.05);
}

[data-theme="dark"] .table-light,
[data-bs-theme="dark"] .table-light {
  --bs-table-bg: var(--surface-2);
  --bs-table-color: var(--text);
  --bs-table-border-color: var(--border);
}

[data-theme="dark"] .badge.bg-light,
[data-bs-theme="dark"] .badge.bg-light,
[data-theme="dark"] .badge.bg-white,
[data-bs-theme="dark"] .badge.bg-white {
  background-color: var(--surface-3) !important;
  color: var(--text) !important;
  border-color: var(--border-strong) !important;
}

[data-theme="dark"] .border,
[data-bs-theme="dark"] .border,
[data-theme="dark"] .border-top,
[data-bs-theme="dark"] .border-top,
[data-theme="dark"] .border-bottom,
[data-bs-theme="dark"] .border-bottom,
[data-theme="dark"] .border-start,
[data-bs-theme="dark"] .border-start,
[data-theme="dark"] .border-end,
[data-bs-theme="dark"] .border-end {
  border-color: var(--border) !important;
}

[data-theme="dark"] .border-primary, [data-bs-theme="dark"] .border-primary { border-color: var(--bs-primary) !important; }
[data-theme="dark"] .border-success, [data-bs-theme="dark"] .border-success { border-color: var(--bs-success) !important; }
[data-theme="dark"] .border-warning, [data-bs-theme="dark"] .border-warning { border-color: var(--bs-warning) !important; }
[data-theme="dark"] .border-info, [data-bs-theme="dark"] .border-info { border-color: var(--bs-info) !important; }
[data-theme="dark"] .border-danger, [data-bs-theme="dark"] .border-danger { border-color: var(--bs-danger) !important; }

[data-theme="dark"] .text-dark,
[data-bs-theme="dark"] .text-dark {
  color: var(--text) !important;
}

[data-theme="dark"] .footer-bookswap,
[data-bs-theme="dark"] .footer-bookswap {
  background: #161616;
  color: #D4D4D4;
  border-top: 1px solid #2B2B2B;
}

[data-theme="dark"] .footer-bookswap h6,
[data-bs-theme="dark"] .footer-bookswap h6 {
  color: #F5F5F5;
}

@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after { animation:none!important; transition:none!important; scroll-behavior:auto!important }
}