/*!
 * Academia Real - dashboard theme (index + mis cursos)
 * Brand: navy + yellow + vivid blue
 * Fonts: Montserrat se carga en layout/head.tpl (no @import: bloquea todo el CSS).
 */

:root {
  --ar-navy: #0b1f3a;
  --ar-navy-2: #122a4a;
  --ar-blue: #1f6feb;
  --ar-blue-bright: #2b8cff;
  --ar-yellow: #f5c518;
  --ar-yellow-hover: #ffd84a;
  --ar-bg: #f3f5f9;
  --ar-card: #ffffff;
  --ar-text: #1a2433;
  --ar-muted: #6b778c;
  --ar-border: #e6ebf2;
  --ar-sidebar-w: 268px;
  --ar-radius: 18px;
  --ar-radius-sm: 12px;
  --ar-shadow: 0 8px 24px rgba(11, 31, 58, 0.08);
  --ar-font: 'Montserrat', system-ui, sans-serif;
  --ar-sub-blue: #2563eb;
  --ar-sub-navy: #0f2744;
  --ar-sub-muted: #64748b;
  --ar-sub-line: #e8eef6;
  --ar-sub-bg: #f4f7fb;
}

/* ---------- Theme basics (all pages using this stylesheet) ---------- */
html,
body {
  font-family: var(--ar-font);
  font-optical-sizing: auto;
}
a { color: var(--ar-blue); }
a:hover { color: var(--ar-blue-bright); }

.navbar-default {
  background: linear-gradient(180deg, #1a3558 0%, var(--ar-navy) 100%);
  border-color: var(--ar-navy);
}
.navbar-default .navbar-nav > li > a,
.navbar-default .navbar-brand { color: #fff; }
.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > li > a:hover {
  background: rgba(255, 255, 255, 0.12);
  color: #fff;
}

/* ---------- Dashboard shell (campus + mis cursos + red social + agenda + admin) ---------- */
body:has(> main.section-mycampus),
body:has(> main.section-mycourses),
body:has(> main.section-social-network),
body:has(> main.section-myagenda),
body:has(> main.section-platform_admin),
body:has(> main.section-gamification),
body:has(> main.section-library) {
  margin-bottom: 0 !important;
  background: var(--ar-bg);
}

main.section-mycampus,
main.section-mycourses,
main.section-social-network,
main.section-myagenda,
main.section-platform_admin,
main.section-gamification,
main.section-library,
main:has(.ar-app),
body.ar-body-shell #main {
  font-family: var(--ar-font);
  background: var(--ar-bg);
  margin: 0 !important;
  margin-bottom: 0 !important;
  min-height: 100vh;
  height: 100dvh;
  padding-bottom: 0 !important;
}

main.section-mycampus > #cm-header,
main.section-mycourses > #cm-header,
main.section-social-network > #cm-header,
main.section-myagenda > #cm-header,
main.section-platform_admin > #cm-header,
main.section-gamification > #cm-header,
main.section-library > #cm-header,
main:has(.ar-app) > #cm-header {
  display: none !important;
}

main.section-mycampus > footer.footer,
main.section-mycourses > footer.footer,
main.section-social-network > footer.footer,
main.section-myagenda > footer.footer,
main.section-platform_admin > footer.footer,
main.section-gamification > footer.footer,
main.section-library > footer.footer,
main:has(.ar-app) > footer.footer {
  display: none !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}

main.section-mycampus > #cm-content,
main.section-mycourses > #cm-content,
main.section-social-network > #cm-content,
main.section-myagenda > #cm-content,
main.section-platform_admin > #cm-content,
main.section-gamification > #cm-content,
main.section-library > #cm-content,
main:has(.ar-app) > #cm-content {
  padding: 0;
  min-height: inherit;
}

main.section-mycampus > #cm-content > .container,
main.section-mycourses > #cm-content > .container,
main.section-social-network > #cm-content > .container,
main.section-myagenda > #cm-content > .container,
main.section-platform_admin > #cm-content > .container,
main.section-gamification > #cm-content > .container,
main.section-library > #cm-content > .container,
main:has(.ar-app) > #cm-content > .container {
  width: 100%;
  max-width: none;
  padding: 0;
  margin: 0;
  min-height: inherit;
}

.ar-app {
  display: flex;
  min-height: 100vh;
  align-items: stretch;
  background: var(--ar-bg);
  color: var(--ar-text);
  font-family: var(--ar-font);
}

/* Sidebar */
.ar-sidebar {
  width: var(--ar-sidebar-w);
  flex-shrink: 0;
  background: linear-gradient(180deg, var(--ar-navy) 0%, #071528 100%);
  color: #fff;
  display: flex;
  flex-direction: column;
  padding: 1.25rem 1rem 1.5rem;
  position: sticky;
  top: 0;
  align-self: flex-start;
  min-height: 100vh;
  height: auto;
  z-index: 40;
  transition: width 0.22s ease, padding 0.22s ease;
}

.ar-sidebar__brand {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
  padding: 0.35rem 0.5rem 1.35rem;
  text-decoration: none;
  color: #fff;
}

.ar-sidebar__logo {
  display: block;
  width: 100%;
  max-width: 200px;
  height: auto;
}

.ar-sidebar__mark {
  display: none;
  width: 40px;
  height: 40px;
  flex-shrink: 0;
}

.ar-sidebar__mark img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.ar-sidebar__brand-mark {
  width: 42px;
  height: 42px;
  border-radius: 12px;
  background: linear-gradient(135deg, var(--ar-blue-bright), var(--ar-blue));
  display: grid;
  place-items: center;
  font-weight: 800;
  font-size: 0.85rem;
  letter-spacing: 0.02em;
  box-shadow: 0 6px 16px rgba(31, 111, 235, 0.35);
}

.ar-sidebar__brand-text {
  line-height: 1.15;
}

.ar-sidebar__brand-text strong {
  display: block;
  font-size: 1.15rem;
  font-weight: 800;
  letter-spacing: 0.04em;
}

.ar-sidebar__brand-text strong span {
  color: var(--ar-yellow);
}

.ar-sidebar__brand-text small {
  display: block;
  font-size: 0.68rem;
  opacity: 0.7;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  font-weight: 600;
}

/* Welcome / videos preserved from previous campus home */
.ar-welcome {
  background: var(--ar-card);
  border-radius: var(--ar-radius);
  box-shadow: var(--ar-shadow);
  padding: 1.5rem;
  margin-bottom: 1.5rem;
}

.ar-welcome__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.5rem;
  align-items: start;
}

.ar-welcome__col {
  min-width: 0;
}

.academia-welcome-video {
  margin: 0 0 1.5rem;
}

.academia-welcome-video__inner {
  overflow: hidden;
  border-radius: 16px;
  background: #000;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.28);
  margin-bottom: 1rem;
}

.academia-welcome-video .plyr {
  --plyr-color-main: #ffffff;
  --plyr-video-control-color: #ffffff;
  --plyr-video-control-color-hover: #ffffff;
  --plyr-range-fill-background: #ffffff;
  --plyr-video-progress-buffered-background: rgba(255, 255, 255, 0.25);
  --plyr-font-family: inherit;
}

.academia-welcome-video .plyr--video .plyr__control--overlaid {
  background: rgba(0, 0, 0, 0.55);
}

.academia-welcome-video .plyr--full-ui input[type=range] {
  color: #ffffff;
}

.academia-welcome-video__intro {
  margin: 0;
  color: var(--ar-text);
  font-size: 0.95rem;
  line-height: 1.6;
}

.academia-welcome-video__intro p {
  margin: 0 0 0.65rem;
}

.academia-welcome-video__intro p:last-child {
  margin-bottom: 0;
}

.ar-welcome .academia-welcome-video__inner {
  margin-bottom: 1rem;
  border-radius: 16px;
  overflow: hidden;
}

@media (max-width: 991px) {
  .ar-welcome__grid {
    grid-template-columns: 1fr 1fr;
  }
}

.ar-nav {
  list-style: none;
  margin: 0;
  padding: 0;
  flex: 1;
  overflow-y: auto;
}

.ar-nav__item a {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  padding: 0.78rem 1rem;
  margin-bottom: 0.25rem;
  border-radius: 999px;
  color: rgba(255, 255, 255, 0.82);
  text-decoration: none;
  font-weight: 500;
  font-size: 14px;
  transition: background 0.2s, color 0.2s;
}

.ar-nav__item a:hover {
  background: rgba(255, 255, 255, 0.08);
  color: #fff;
  text-decoration: none;
}

.ar-nav__item.active a,
.ar-nav__item.current a {
  background: linear-gradient(90deg, var(--ar-blue-bright), var(--ar-blue));
  color: #fff;
}

.ar-nav__item a .fa {
  width: 1.55rem;
  font-size: 1.35rem;
  text-align: center;
  opacity: 0.95;
  flex-shrink: 0;
}

.ar-nav__item--sub a {
  padding-left: 2.4rem;
  font-size: 0.85rem;
}

.ar-nav__item--sub a .fa {
  font-size: 0.95rem;
}

.ar-app.is-sidebar-collapsed .ar-sidebar {
  width: 88px;
  padding: 1.15rem 0.7rem 1.25rem;
}

.ar-app.is-sidebar-collapsed .ar-sidebar__logo {
  display: none;
}

.ar-app.is-sidebar-collapsed .ar-sidebar__mark {
  display: block;
}

.ar-app.is-sidebar-collapsed .ar-sidebar__brand {
  padding: 0.5rem 0 1.1rem;
}

.ar-app.is-sidebar-collapsed .ar-nav__item a {
  justify-content: center;
  padding: 0.85rem 0.45rem;
  border-radius: 16px;
}

.ar-app.is-sidebar-collapsed .ar-nav__item a span,
.ar-app.is-sidebar-collapsed .ar-nav__item--sub,
.ar-app.is-sidebar-collapsed .ar-sidebar__promo {
  display: none;
}

.ar-app.is-sidebar-collapsed .ar-nav__item a .fa {
  font-size: 1.5rem;
  width: auto;
}

.ar-sidebar__promo {
  margin-top: 1rem;
  padding: 1.1rem;
  border-radius: var(--ar-radius);
  background: linear-gradient(145deg, #1a4d9c, var(--ar-blue));
  text-align: center;
}

.ar-sidebar__promo p {
  margin: 0 0 0.85rem;
  font-weight: 700;
  font-size: 0.95rem;
}

.ar-btn-yellow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  background: var(--ar-yellow);
  color: var(--ar-navy) !important;
  font-weight: 700;
  border: 0;
  border-radius: 999px;
  padding: 0.65rem 1.15rem;
  text-decoration: none !important;
  transition: background 0.2s, transform 0.15s;
}

.ar-btn-yellow:hover {
  background: var(--ar-yellow-hover);
  transform: translateY(-1px);
}

.ar-btn-yellow--lg {
  padding: 0.8rem 1.4rem;
  font-size: 0.95rem;
}

/* Main column */
.ar-main {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
}

.ar-chrome {
  position: sticky;
  top: 0;
  z-index: 50;
  overflow: visible;
}

.ar-admin-bar {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  min-height: 42px;
  padding: 0.35rem 1.75rem;
  background: #0a1628;
  color: #fff;
  overflow: visible;
  position: relative;
  z-index: 40;
}

.ar-admin-bar__nav {
  display: flex;
  align-items: center;
  gap: 0.15rem;
  list-style: none;
  margin: 0;
  padding: 0;
  flex-wrap: nowrap;
}

.ar-admin-bar__nav > li {
  margin: 0;
  position: relative;
}

.ar-admin-bar__nav > li > a {
  display: block;
  padding: 0.45rem 0.75rem;
  color: rgba(255, 255, 255, 0.88) !important;
  font-size: 14px;
  font-weight: 650;
  text-decoration: none !important;
  white-space: nowrap;
  border-radius: 8px;
}

.ar-admin-bar__nav > li > a:hover,
.ar-admin-bar__nav > li.open > a,
.ar-admin-bar__nav > li > a:focus {
  background: rgba(255, 255, 255, 0.1);
  color: #fff !important;
}

.ar-admin-bar .caret {
  margin-left: 0.2rem;
  border-top-color: rgba(255, 255, 255, 0.8);
}

.ar-admin-bar .dropdown-menu {
  margin-top: 0 !important;
  top: calc(100% - 2px);
  border: 1px solid var(--ar-border);
  border-radius: 12px;
  box-shadow: var(--ar-shadow);
  font-family: var(--ar-font);
  min-width: 220px;
  z-index: 50;
}

.ar-admin-bar__nav > li.dropdown:hover > .dropdown-menu,
.ar-admin-bar__nav > li.open > .dropdown-menu,
.ar-admin-bar__nav > li.is-open > .dropdown-menu {
  display: block;
}
.ar-admin-bar__nav > li.is-open > a {
  background: rgba(255, 255, 255, 0.1);
  color: #fff !important;
}

.ar-admin-bar .dropdown-menu > li > a {
  padding: 0.55rem 0.9rem;
  font-size: 0.85rem;
  color: var(--ar-navy);
}

.ar-admin-bar .dropdown-menu > li > a:hover {
  background: #eef4ff;
  color: var(--ar-blue);
}

.ar-admin-bar__search {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  margin-left: auto;
  flex-shrink: 0;
}

.ar-admin-bar__search input {
  height: 32px;
  width: 180px;
  border: 0;
  border-radius: 8px;
  padding: 0 0.7rem;
  font-size: 0.82rem;
  color: var(--ar-navy);
}

.ar-admin-bar__search button {
  height: 32px;
  border: 0;
  border-radius: 8px;
  padding: 0 0.8rem;
  background: var(--ar-blue);
  color: #fff;
  font-size: 0.8rem;
  font-weight: 700;
  font-family: inherit;
}

.ar-admin-bar__search button:hover {
  background: var(--ar-blue-bright);
}

.ar-topbar {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1rem 1.75rem;
  background: rgba(255, 255, 255, 0.92);
  backdrop-filter: blur(8px);
  border-bottom: 1px solid var(--ar-border);
  position: relative;
  z-index: 1;
}

.ar-topbar__menu-btn {
  display: grid;
  place-items: center;
  border: 0;
  background: var(--ar-bg);
  width: 42px;
  height: 42px;
  border-radius: 12px;
  color: var(--ar-navy);
  cursor: pointer;
  flex-shrink: 0;
}

.ar-topbar__menu-btn:hover {
  background: #e8eef7;
}

.ar-search {
  flex: 1;
  max-width: 520px;
  position: relative;
}

.ar-search .fa {
  position: absolute;
  left: 1rem;
  top: 50%;
  transform: translateY(-50%);
  color: var(--ar-muted);
}

.ar-search input {
  width: 100%;
  border: 1px solid var(--ar-border);
  background: var(--ar-bg);
  border-radius: 999px;
  padding: 0.7rem 1rem 0.7rem 2.5rem;
  font-family: inherit;
  font-size: 0.9rem;
  outline: none;
}

.ar-search input:focus {
  border-color: var(--ar-blue);
  background: #fff;
}

.ar-topbar__actions {
  display: flex;
  align-items: center;
  gap: 1.15rem;
  margin-left: auto;
}

.ar-online-users,
.ar-topbar #notifications {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

.ar-online-users > li,
.ar-topbar #notifications > li {
  margin: 0;
  display: flex;
}

.ar-online-users a,
.ar-topbar #notifications a {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  color: #0f172a !important;
  font-family: var(--ar-font);
  font-size: 1.05rem;
  font-weight: 700;
  text-decoration: none !important;
  line-height: 1;
  background: none !important;
  padding: 0;
}

.ar-online-users a:hover,
.ar-topbar #notifications a:hover {
  color: var(--ar-blue) !important;
}

.ar-online-users img,
.ar-topbar #notifications img {
  width: 22px;
  height: 22px;
  display: block;
}

.ar-icon-btn {
  position: relative;
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  color: #0f172a;
  font-size: 1.2rem;
  text-decoration: none !important;
}

.ar-icon-btn .fa {
  line-height: 1;
}

.ar-icon-btn__dot {
  position: absolute;
  top: 1px;
  right: 2px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #ef4444;
  box-shadow: 0 0 0 2px #fff;
}

.ar-icon-btn .ar-badge {
  position: absolute;
  top: -4px;
  right: -4px;
  min-width: 18px;
  height: 18px;
  padding: 0 4px;
  border-radius: 999px;
  background: var(--ar-yellow);
  color: var(--ar-navy);
  font-size: 0.65rem;
  font-weight: 800;
  display: grid;
  place-items: center;
}

.ar-user-menu {
  position: relative;
}

.ar-user {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  text-decoration: none !important;
  color: inherit;
  padding: 0;
  border-radius: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
  font: inherit;
  text-align: left;
}

.ar-user:hover,
.ar-user-menu.is-open .ar-user,
.ar-user-menu:hover .ar-user {
  background: transparent;
}

.ar-user img,
.ar-user__initials {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  flex: 0 0 52px;
}

.ar-user img {
  object-fit: cover;
  border: 0;
  box-shadow: none;
}

.ar-user__initials {
  display: grid;
  place-items: center;
  background: #f3e8ff;
  color: #7c3aed;
  font-size: 1.05rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  line-height: 1;
}

.ar-user__meta {
  line-height: 1.2;
}

.ar-user__meta strong {
  display: block;
  font-size: 0.98rem;
  font-weight: 700;
  color: #0f172a;
}

.ar-user__meta small {
  color: #94a3b8;
  font-size: 0.8rem;
  font-weight: 500;
}

.ar-user__caret {
  font-size: 0.7rem;
  color: #94a3b8;
  margin-left: 0.15rem;
  transition: transform 0.18s ease;
}

.ar-user-menu.is-open .ar-user__caret,
.ar-user-menu:hover .ar-user__caret {
  transform: rotate(180deg);
}

.ar-user-menu__dropdown {
  position: absolute;
  top: calc(100% + 0.45rem);
  right: 0;
  min-width: 200px;
  padding: 0.4rem;
  background: #fff;
  border: 1px solid var(--ar-border);
  border-radius: var(--ar-radius-sm);
  box-shadow: 0 12px 28px rgba(11, 31, 58, 0.14);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-6px);
  transition: opacity 0.15s ease, transform 0.15s ease, visibility 0.15s;
  z-index: 60;
}

.ar-user-menu:hover .ar-user-menu__dropdown,
.ar-user-menu.is-open .ar-user-menu__dropdown {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.ar-user-menu__item {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  padding: 0.7rem 0.85rem;
  border-radius: 10px;
  color: var(--ar-navy) !important;
  text-decoration: none !important;
  font-size: 0.88rem;
  font-weight: 600;
}

.ar-user-menu__item:hover {
  background: var(--ar-bg);
}

.ar-user-menu__item--logout {
  color: #b42318 !important;
}

.ar-user-menu__item--logout:hover {
  background: #ffe8e8;
}

.ar-content {
  padding: 1.5rem 1.75rem 2.5rem;
}

.ar-content--guest {
  padding-top: 1.25rem;
}

.ar-breadcrumb {
  margin: 0 0 1rem;
}
.ar-breadcrumb .breadcrumb {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.1rem 0;
  margin: 0;
  padding: 0.5rem 0;
  list-style: none;
  background: none;
}
.ar-breadcrumb .breadcrumb > li {
  display: inline-flex;
  align-items: center;
  color: #64748b;
  font-size: 0.88rem;
  font-weight: 600;
  line-height: 1.35;
}
.ar-breadcrumb .breadcrumb > li + li:before {
  content: "\203A";
  padding: 0 0.5rem 0 0.35rem;
  color: #94a3b8;
  font-size: 1.05rem;
  font-weight: 700;
}
.ar-breadcrumb .breadcrumb > li a {
  color: #2563eb;
  text-decoration: none;
}
.ar-breadcrumb .breadcrumb > li a:hover {
  color: #1d4ed8;
  text-decoration: underline;
}
.ar-breadcrumb .breadcrumb > li.active:last-child,
.ar-breadcrumb .breadcrumb > li:last-child {
  color: var(--ar-navy);
}

/* Login / invitados: sin sidebar ni botón de menú */
.ar-app--guest {
  display: block;
  width: 100%;
}

.ar-app--guest .ar-main {
  width: 100%;
  max-width: 1920px;
  margin-left: auto;
  margin-right: auto;
}

.ar-app--guest .ar-content {
  max-width: 1920px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 1.5rem;
  padding-right: 1.5rem;
  box-sizing: border-box;
}

.ar-guest-menu-btn {
  display: none !important;
}

/* Hero */
.ar-hero {
  position: relative;
  overflow: hidden;
  border-radius: 24px;
  background:
    radial-gradient(circle at 78% 35%, rgba(80, 160, 255, 0.45), transparent 42%),
    radial-gradient(circle at 92% 80%, rgba(40, 100, 220, 0.5), transparent 38%),
    linear-gradient(105deg, #06152b 0%, #0c2a58 42%, #1a56c4 78%, #2b7bff 100%);
  color: #fff;
  padding: 0;
  margin-bottom: 1.5rem;
  box-shadow: var(--ar-shadow);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  min-height: 280px;
}

/* Inicio logueado y login: imagen izquierda, contenido derecha, bloque centrado. */
.ar-hero:not(.ar-hero--login),
.ar-hero--login {
  background:
    radial-gradient(circle at 22% 35%, rgba(80, 160, 255, 0.45), transparent 42%),
    radial-gradient(circle at 8% 80%, rgba(40, 100, 220, 0.5), transparent 38%),
    linear-gradient(255deg, #06152b 0%, #0c2a58 42%, #1a56c4 78%, #2b7bff 100%);
}

.ar-hero__content {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 0.85rem;
  max-width: 420px;
  width: 100%;
}

.ar-hero__content .ar-hero__copy {
  max-width: none;
  padding: 0;
}

@media (min-width: 992px) {
  .ar-hero:not(.ar-hero--login),
  .ar-hero--login {
    flex-direction: row-reverse;
    justify-content: center;
    align-items: center;
    gap: 1.75rem;
    padding: 0 1.5rem;
  }

  .ar-hero:not(.ar-hero--login) .ar-hero__copy {
    padding: 2.4rem 1rem 2.4rem 0.5rem;
    margin-left: 0;
    flex: 0 1 480px;
  }

  .ar-hero--login .ar-hero__content {
    flex: 0 1 400px;
    padding: 2rem 0.5rem 2rem 0;
    margin: 0;
  }

  .ar-hero:not(.ar-hero--login) .ar-hero__visual,
  .ar-hero--login .ar-hero__visual {
    justify-content: center;
    align-items: flex-end;
    padding: 0.5rem 0.5rem 0 0;
    flex: 0 1 400px;
    margin: 0;
    max-width: 400px;
  }

  .ar-hero:not(.ar-hero--login) .ar-hero__img,
  .ar-hero--login .ar-hero__img {
    object-position: center bottom;
  }
}

.ar-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: radial-gradient(rgba(255, 255, 255, 0.16) 1.2px, transparent 1.2px);
  background-size: 16px 16px;
  background-position: 62% 0;
  -webkit-mask-image: linear-gradient(90deg, transparent 35%, #000 62%);
  mask-image: linear-gradient(90deg, transparent 35%, #000 62%);
  opacity: 0.45;
  pointer-events: none;
}

.ar-hero:not(.ar-hero--login)::before,
.ar-hero--login::before {
  background-position: 38% 0;
  -webkit-mask-image: linear-gradient(270deg, transparent 35%, #000 62%);
  mask-image: linear-gradient(270deg, transparent 35%, #000 62%);
}

.ar-hero__copy {
  position: relative;
  z-index: 2;
  padding: 2.4rem 1.5rem 2.4rem 2.6rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  max-width: 500px;
  height: fit-content;
}

.ar-hero__accent {
  display: block;
  width: 42px;
  height: 3px;
  border-radius: 999px;
  background: var(--ar-yellow);
  margin-bottom: 1rem;
}

.ar-hero__copy h1 {
  margin: 0 0 0.85rem;
  font-size: clamp(1.55rem, 2.4vw, 2.05rem);
  font-weight: 600;
  letter-spacing: -0.02em;
  line-height: 1.2;
  color: #fff;
}

.ar-hero__copy h1 strong {
  font-weight: 800;
}

.ar-hero__copy p {
  margin: 0 0 1.4rem;
  max-width: 32rem;
  color: rgba(255, 255, 255, 0.9);
  font-size: 0.98rem;
  line-height: 1.55;
}

.ar-certs {
  margin-top: 1.35rem;
  width: 100%;
}

.ar-certs h2 {
  margin: 0 0 0.7rem;
  font-size: 0.78rem;
  font-weight: 750;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ar-yellow);
}

.ar-certs__row {
  display: flex;
  align-items: stretch;
  gap: 0.45rem;
}

.ar-certs__track {
  display: flex;
  gap: 0.65rem;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  flex: 1;
  min-width: 0;
  padding: 0.15rem 0 0.35rem;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
  touch-action: pan-x;
  overscroll-behavior-x: contain;
}

.ar-certs__track::-webkit-scrollbar {
  display: none;
}

.ar-certs__item {
  flex: 0 0 118px;
  width: 118px;
  max-width: 118px;
  scroll-snap-align: start;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.45rem;
  padding: 0.7rem 0.55rem 0.65rem;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.12);
  border: 1px solid rgba(255, 255, 255, 0.16);
  color: #fff !important;
  text-decoration: none !important;
  box-sizing: border-box;
}

.ar-certs__item:hover {
  background: rgba(255, 255, 255, 0.2);
}

.ar-certs__badge {
  width: 52px;
  height: 52px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  overflow: hidden;
}

.ar-certs__badge img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.ar-certs__badge .fa {
  font-size: 1.35rem;
  color: var(--ar-yellow);
}

.ar-certs__name {
  font-size: 0.75rem;
  font-weight: 650;
  line-height: 1.25;
  text-align: center;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.ar-certs__nav {
  flex-shrink: 0;
  width: 28px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: #fff;
  cursor: pointer;
}

.ar-certs__nav:hover {
  background: var(--ar-yellow);
  color: var(--ar-navy);
}

.ar-certs__empty {
  margin: 0;
  font-size: 0.85rem;
  color: rgba(255, 255, 255, 0.72);
}

.ar-hero .ar-btn-yellow--lg {
  align-self: flex-start;
  padding: 0.72rem 0.85rem 0.72rem 1.25rem;
  gap: 0.65rem;
}

.ar-btn-yellow__icon {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--ar-navy);
  color: #fff;
  display: inline-grid;
  place-items: center;
  font-size: 0.7rem;
}

.ar-hero__visual {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  max-height: 400px;
  flex: 1 1 300px;
  min-width: 300px;
  max-width: 400px;
  padding: 0.5rem 0.75rem 0 0;
}

.ar-hero__img {
  display: block;
  width: 110%;
  height: 110%;
  object-fit: cover;
  object-position: right bottom;
  filter: drop-shadow(0 18px 30px rgba(0, 0, 0, 0.28));
  mix-blend-mode: lighten;
}

.ar-hero__orb {
  display: none;
}

@keyframes ar-float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-8px); }
}

/* Stats */
.ar-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1rem;
  margin-bottom: 1.5rem;
}

.ar-stat {
  background: var(--ar-card);
  border-radius: var(--ar-radius);
  padding: 1.1rem 1.2rem;
  box-shadow: var(--ar-shadow);
  display: flex;
  align-items: center;
  gap: 0.9rem;
  text-decoration: none !important;
  color: inherit;
  transition: transform 0.15s;
}

.ar-stat:hover { transform: translateY(-2px); }

.ar-stat__icon {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  color: #fff;
  flex-shrink: 0;
}

.ar-stat__icon--blue { background: linear-gradient(135deg, #3b82f6, #1d4ed8); }
.ar-stat__icon--green { background: linear-gradient(135deg, #34d399, #059669); }
.ar-stat__icon--purple { background: linear-gradient(135deg, #a78bfa, #7c3aed); }
.ar-stat__icon--yellow { background: linear-gradient(135deg, #fbbf24, #d97706); }

.ar-stat__body { flex: 1; min-width: 0; }
.ar-stat__body span {
  display: block;
  color: var(--ar-muted);
  font-size: 0.8rem;
  font-weight: 600;
}
.ar-stat__body strong {
  font-size: 1.05rem;
  font-weight: 700;
}
.ar-stat .fa-chevron-right {
  color: var(--ar-muted);
  font-size: 0.8rem;
}

/* Panels */
.ar-grid {
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 1.25rem;
}

.ar-panel {
  background: var(--ar-card);
  border-radius: var(--ar-radius);
  box-shadow: var(--ar-shadow);
  padding: 1.25rem 1.35rem;
}

.ar-panel__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 1rem;
}

.ar-panel__head h2 {
  margin: 0;
  font-size: 1.05rem;
  font-weight: 750;
}

.ar-panel__head a {
  font-size: 0.85rem;
  font-weight: 600;
  text-decoration: none;
}

.ar-course {
  display: flex;
  gap: 0.9rem;
  align-items: center;
  padding: 0.85rem 0;
  border-bottom: 1px solid var(--ar-border);
}

.ar-course:last-child { border-bottom: 0; }

.ar-course__thumb {
  width: 56px;
  height: 56px;
  border-radius: 14px;
  background: linear-gradient(135deg, #dbeafe, #93c5fd);
  display: grid;
  place-items: center;
  color: var(--ar-blue);
  font-size: 1.25rem;
  flex-shrink: 0;
  overflow: hidden;
}

.ar-course__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ar-course__body { flex: 1; min-width: 0; }
.ar-course__body h3 {
  margin: 0 0 0.45rem;
  font-size: 0.95rem;
  font-weight: 700;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.ar-progress {
  height: 8px;
  border-radius: 999px;
  background: #e8eef7;
  overflow: hidden;
}

.ar-progress > span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--ar-blue-bright), var(--ar-blue));
}

.ar-course__meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 0.35rem;
  font-size: 0.8rem;
  color: var(--ar-muted);
}

.ar-course__meta a {
  font-weight: 700;
  text-decoration: none;
}

.ar-empty {
  color: var(--ar-muted);
  font-size: 0.9rem;
  padding: 0.5rem 0;
}

.ar-event {
  display: flex;
  gap: 0.9rem;
  align-items: flex-start;
  padding: 0.8rem 0;
  border-bottom: 1px solid var(--ar-border);
}

.ar-event:last-child { border-bottom: 0; }

.ar-event__date {
  width: 52px;
  height: 52px;
  border-radius: 14px;
  background: var(--ar-bg);
  border: 1px solid var(--ar-border);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.ar-event__date small {
  font-size: 0.65rem;
  font-weight: 800;
  color: var(--ar-blue);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.ar-event__date strong {
  font-size: 1.1rem;
  line-height: 1;
}

.ar-event__body h3 {
  margin: 0 0 0.25rem;
  font-size: 0.92rem;
  font-weight: 700;
}

.ar-event__body p {
  margin: 0;
  color: var(--ar-muted);
  font-size: 0.8rem;
}

/* Mobile */
@media (max-width: 767px) {
  .ar-welcome__grid {
    grid-template-columns: 1fr;
  }

  .ar-admin-bar {
    padding: 0.4rem 0.7rem 0.5rem;
  }

  .ar-admin-bar__nav > li {
    flex: 0 1 auto;
  }

  .ar-admin-bar__nav > li > a {
    padding: 0.4rem 0.55rem;
  }

  /* En táctil el menú solo se abre al tocarlo, no al “hover”. */
  .ar-admin-bar__nav > li.dropdown:hover > .dropdown-menu {
    display: none;
  }
  .ar-admin-bar__nav > li.open > .dropdown-menu,
  .ar-admin-bar__nav > li.is-open > .dropdown-menu {
    display: block;
  }
  .ar-admin-bar__nav > li.is-open {
    flex: 1 1 100%;
  }
  .ar-admin-bar__nav > li.is-open > a {
    display: inline-block;
  }
  .ar-admin-bar .dropdown-menu {
    position: static;
    float: none;
    width: 100%;
    max-width: none;
    margin: 0.25rem 0 0.35rem !important;
    box-shadow: none;
  }
}

@media (max-width: 991px) {
  .ar-admin-bar {
    flex-wrap: wrap;
    align-items: center;
    padding: 0.45rem 0.85rem 0.55rem;
    gap: 0.4rem 0.5rem;
  }

  .ar-admin-bar__nav {
    flex: 1 1 100%;
    flex-wrap: wrap;
    width: 100%;
  }

  .ar-admin-bar__nav > li > a {
    padding: 0.42rem 0.65rem;
    font-size: 13px;
  }

  .ar-admin-bar .dropdown-menu {
    left: 0;
    right: auto;
    max-width: calc(100vw - 1.5rem);
  }

  .ar-admin-bar__search {
    flex: 1 1 100%;
    width: 100%;
    margin-left: 0;
  }

  .ar-admin-bar__search input {
    flex: 1 1 auto;
    width: 0;
    min-width: 0;
  }

  .ar-sidebar {
    position: fixed;
    left: 0;
    top: 0;
    transform: translateX(-105%);
    transition: transform 0.25s ease;
    box-shadow: 8px 0 30px rgba(0, 0, 0, 0.25);
    /* Por encima del chrome sticky (z-index 50) en tablet/móvil */
    z-index: 70;
  }

  .ar-backdrop {
    z-index: 60;
  }

  .ar-app.is-sidebar-open .ar-sidebar {
    transform: translateX(0);
  }

  .ar-app.is-sidebar-collapsed .ar-sidebar {
    width: var(--ar-sidebar-w);
    padding: 1.25rem 1rem 1.5rem;
  }

  .ar-app.is-sidebar-collapsed .ar-sidebar__logo {
    display: block;
  }

  .ar-app.is-sidebar-collapsed .ar-sidebar__mark {
    display: none;
  }

  .ar-app.is-sidebar-collapsed .ar-nav__item a {
    justify-content: flex-start;
    padding: 0.78rem 1rem;
    border-radius: 999px;
  }

  .ar-app.is-sidebar-collapsed .ar-nav__item a span {
    display: inline;
  }

  .ar-app.is-sidebar-collapsed .ar-sidebar__promo {
    display: block;
  }

  .ar-app.is-sidebar-collapsed .ar-nav__item--sub {
    display: list-item;
  }

  .ar-topbar__menu-btn { display: grid; place-items: center; }

  .ar-hero {
    min-height: 0;
  }

  .ar-hero__copy {
    padding: 1.75rem 1.5rem 1rem;
    max-width: none;
  }

  .ar-hero__visual {
    justify-content: center;
    min-height: 0;
    padding: 0 1rem 0.5rem;
  }

  .ar-hero__img {
    width: min(100%, 340px);
    max-height: 240px;
  }

  .ar-stats { grid-template-columns: repeat(2, 1fr); }

  .ar-grid { grid-template-columns: 1fr; }

  .ar-user__meta { display: none; }

  .ar-user__caret { display: none; }

  .ar-content { padding: 1.1rem; }
}

@media (max-width: 575px) {
  .ar-stats { grid-template-columns: 1fr; }
  .ar-search { display: none; }
}

.ar-backdrop {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(7, 21, 40, 0.45);
  z-index: 35;
}

.ar-app.is-sidebar-open .ar-backdrop {
  display: block;
}

/* Login form inside hero banner (guest) */
.ar-login {
  margin: 0;
}

.ar-login__title {
  margin: 0 0 0.85rem;
  color: white;
  font-size: 1.05rem;
  text-align: left;
  font-weight: 750;
  letter-spacing: -0.01em;
}

.ar-login__cap-notice {
  margin: 0 0 0.55rem;
  padding: 0.55rem 0.7rem;
  border-radius: 10px;
  background: rgba(245, 197, 24, 0.95);
  color: #1a2433;
  font-size: 0.78rem;
  font-weight: 650;
  line-height: 1.35;
}

.ar-login__online {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem 0.5rem;
  margin: 0 0 0.65rem;
  color: rgba(255, 255, 255, 0.92);
  font-size: 0.88rem;
  font-weight: 600;
}

.ar-login__online .fa {
  color: #f5c518;
}

.ar-login__online-max {
  opacity: 0.8;
  font-weight: 500;
  font-size: 0.82rem;
}

.ar-login__cap-full {
  margin: 0 0 0.7rem;
  padding: 0.5rem 0.65rem;
  border-radius: 10px;
  background: rgba(220, 53, 69, 0.92);
  color: #fff;
  font-size: 0.78rem;
  font-weight: 650;
  line-height: 1.35;
}

.ar-login #login-block .alert,
.ar-login #login-block .error-message {
  margin: 0 0 0.75rem;
  font-size: 0.82rem;
  line-height: 1.35;
}

.ar-login--hero {
  width: min(100%, 340px);
  margin: 0;
  position: relative;
  z-index: 2;
}

.ar-hero--login .ar-hero__visual {
  align-items: flex-end;
  justify-content: center;
  padding: 0.5rem;
  margin-left: 0;
  min-height: 0;
}

.normal-message {
  padding: 10px;
}

.ar-login #login-block,
.ar-login .ar-login-card {
  background: #fff;
  border: 0;
  border-radius: 18px;
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.22);
  margin: 0;
  overflow: hidden;
}

.ar-login #login-block .panel-body {
  padding: 1.15rem 1.1rem 1.25rem;
}

.ar-login #login-block .form-group {
  margin-bottom: 0.85rem;
}

.ar-login #login-block label {
  display: none;
}

.ar-login #login-block .input-group {
  display: flex;
  width: 100%;
  border-radius: 12px;
  overflow: hidden;
  background: var(--ar-bg);
  border: 1px solid var(--ar-border);
  box-shadow: none;
}

.ar-login #login-block .input-group-addon {
  background: transparent;
  border: 0;
  color: #7b8798;
  width: 42px;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.ar-login #login-block .form-control,
.ar-login #login-block input[type="text"],
.ar-login #login-block input[type="password"] {
  background: transparent;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  height: 46px;
  padding-left: 0.25rem;
  font-size: 0.92rem;
  color: var(--ar-text);
}

.ar-login #login-block .form-control:focus {
  outline: none;
  box-shadow: none !important;
}

.ar-login #login-block .btn,
.ar-login #login-block button[type="submit"],
.ar-login #login-block input[type="submit"] {
  background: var(--ar-yellow) !important;
  border: 0 !important;
  border-radius: 12px !important;
  color: var(--ar-navy) !important;
  font-weight: 800;
  width: 100%;
  height: 46px;
  margin-top: 0.25rem;
  box-shadow: 0 8px 18px rgba(245, 197, 24, 0.28);
}

.ar-login #login-block .btn:hover,
.ar-login #login-block button[type="submit"]:hover,
.ar-login #login-block input[type="submit"]:hover {
  background: var(--ar-yellow-hover) !important;
}

.ar-login #login-block .nav-pills {
  margin: 0.85rem 0 0;
}

.ar-login #login-block .nav-pills > li {
  float: none;
  display: block;
}

.ar-login #login-block .nav-pills > li > a,
.ar-login #login-block a {
  color: var(--ar-blue);
  padding: 0.35rem 0;
  font-size: 0.85rem;
  text-align: center;
  font-weight: 600;
}

.ar-login #login-block .nav-pills > li > a:hover,
.ar-login #login-block a:hover {
  color: var(--ar-navy);
  background: transparent;
}

.ar-lost-password .ar-login-card {
  padding: 1.15rem 1.1rem 1.25rem;
}

.ar-lost-password .page-header,
.ar-lost-password legend,
.ar-lost-password .panel-heading,
.ar-lost-password #lost_password h2,
.ar-lost-password #lost_password h3,
.ar-lost-password #reset h2,
.ar-lost-password #reset h3 {
  display: none;
}

.ar-lost-password label {
  display: block;
  font-size: 0.82rem;
  font-weight: 700;
  color: var(--ar-navy);
  margin-bottom: 0.35rem;
}

.ar-lost-password .form-group {
  margin-bottom: 0.85rem;
}

.ar-lost-password .form-control,
.ar-lost-password input[type="text"],
.ar-lost-password input[type="password"],
.ar-lost-password input[type="email"] {
  width: 100%;
  height: 46px;
  border: 1px solid var(--ar-border) !important;
  border-radius: 12px !important;
  background: var(--ar-bg);
  box-shadow: none !important;
  padding: 0 0.9rem;
  font-size: 0.92rem;
  color: var(--ar-text);
}

.ar-lost-password .form-control:focus,
.ar-lost-password input:focus {
  border-color: var(--ar-blue) !important;
  background: #fff;
  outline: none;
}

.ar-lost-password .help-block {
  font-size: 0.8rem;
  color: var(--ar-muted);
  margin-top: 0.4rem;
}

.ar-lost-password .btn,
.ar-lost-password button[type="submit"],
.ar-lost-password input[type="submit"] {
  background: var(--ar-yellow) !important;
  border: 0 !important;
  border-radius: 12px !important;
  color: var(--ar-navy) !important;
  font-weight: 800;
  width: 100%;
  height: 46px;
  margin-top: 0.35rem;
  box-shadow: 0 8px 18px rgba(245, 197, 24, 0.28);
}

.ar-lost-password .btn:hover,
.ar-lost-password button[type="submit"]:hover {
  background: var(--ar-yellow-hover) !important;
}

.ar-lost-password .form_required,
.ar-lost-password .required {
  color: #d92d20;
}

.ar-lost-password__back {
  margin: 0.85rem 0 0;
  text-align: center;
}

.ar-lost-password__back a {
  color: var(--ar-blue);
  font-size: 0.85rem;
  font-weight: 600;
  text-decoration: none;
}

.ar-lost-password__back a:hover {
  color: var(--ar-navy);
}

.ar-session-login .ar-session-alert {
  background: #fef2f2;
  border: 1px solid #fecaca;
  color: #991b1b;
  border-radius: 12px;
  padding: 0.75rem 0.9rem;
  font-size: 0.86rem;
  font-weight: 600;
  line-height: 1.4;
  margin-bottom: 1rem;
}

.ar-session-login .ar-login-card .alert,
.ar-session-login .ar-login-card .normal-message,
.ar-session-login .ar-login-card .error-message {
  display: none;
}

.ar-session-login .ar-session-form .col-md-3,
.ar-session-login .ar-session-form [class*="col-"] {
  width: 100% !important;
  float: none !important;
  padding: 0 !important;
}

.ar-session-login .ar-session-form .form-group {
  margin-bottom: 0.85rem;
}

.ar-session-login .ar-session-form label {
  display: none;
}

.ar-session-login .ar-session-form input[type="text"],
.ar-session-login .ar-session-form input[type="password"] {
  width: 100%;
  height: 46px;
  border: 1px solid var(--ar-border) !important;
  border-radius: 12px !important;
  background: var(--ar-bg);
  box-shadow: none !important;
  padding: 0 0.9rem;
  font-size: 0.92rem;
  color: var(--ar-text);
}

.ar-session-login .ar-session-form input:focus {
  border-color: var(--ar-blue) !important;
  background: #fff;
  outline: none;
}

.ar-session-login .ar-session-form .btn,
.ar-session-login .ar-session-form button[type="submit"] {
  background: var(--ar-yellow) !important;
  border: 0 !important;
  border-radius: 12px !important;
  color: var(--ar-navy) !important;
  font-weight: 800;
  width: 100%;
  height: 46px;
  margin-top: 0.35rem;
  box-shadow: 0 8px 18px rgba(245, 197, 24, 0.28);
}

.ar-session-login .ar-session-form .btn:hover,
.ar-session-login .ar-session-form button[type="submit"]:hover {
  background: var(--ar-yellow-hover) !important;
}

.ar-session-login #main_content {
  padding: 0;
}

.ar-lost-password #main_content {
  padding: 0;
}

.ar-nav--guest {
  margin-top: 1rem;
  padding-top: 0.75rem;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  flex: 1;
}

.ar-nav--guest .ar-nav__item a {
  font-size: 0.85rem;
  padding: 0.55rem 0.9rem;
  opacity: 0.9;
}

@media (max-width: 991px) {
  .ar-hero__content {
    max-width: none;
    padding: 1.75rem 1.5rem 0.75rem;
  }

  .ar-login--hero {
    width: 100%;
    max-width: 340px;
  }

  .ar-hero--login .ar-hero__visual {
    justify-content: center;
    padding: 0 1rem 0.5rem;
  }
}

/* ---------- Mis cursos (user_portal / section-mycourses) ---------- */
.ar-page-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1.35rem;
  flex-wrap: wrap;
}

.ar-page-head__eyebrow {
  margin: 0 0 0.25rem;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ar-muted);
}

.ar-page-head h1 {
  margin: 0;
  font-size: clamp(1.45rem, 2.2vw, 1.85rem);
  font-weight: 800;
  color: var(--ar-navy);
  letter-spacing: -0.02em;
}

.ar-page-head__sub {
  margin: 0.35rem 0 0;
  color: var(--ar-muted);
  font-size: 0.98rem;
  font-weight: 500;
  line-height: 1.4;
}

.ar-panel--flush {
  padding: 0;
  overflow: hidden;
}

.ar-courses-page .panel.panel-default {
  background: var(--ar-card);
  border: 1px solid var(--ar-border);
  border-radius: var(--ar-radius);
  box-shadow: var(--ar-shadow);
  margin-bottom: 1.25rem;
  overflow: hidden;
}

.ar-courses-page .panel.panel-default > .panel-heading {
  background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%);
  border-bottom: 1px solid var(--ar-border);
  padding: 1rem 1.25rem;
  font-family: var(--ar-font);
  font-size: 1.05rem;
  font-weight: 750;
  color: var(--ar-navy);
}

.ar-courses-page .panel.panel-default > .panel-heading a {
  color: var(--ar-navy);
  text-decoration: none;
}

.ar-courses-page .panel.panel-default > .panel-heading a:hover {
  color: var(--ar-blue);
}

.ar-courses-page .panel.panel-default > .panel-heading img {
  margin-right: 0.35rem;
  vertical-align: middle;
}

.ar-courses-page .panel-body {
  padding: 1.1rem 1.25rem 1.25rem;
}

.ar-courses-page .info-session {
  margin: 0 0 1rem;
  padding: 0.65rem 0.85rem;
  background: #eef4ff;
  border-radius: var(--ar-radius-sm);
  color: var(--ar-navy);
  font-size: 0.88rem;
  font-weight: 600;
}

.ar-courses-page .info-session li {
  margin-right: 1rem;
}

.ar-courses-page .sessions-items .courses {
  background: #fff;
  border: 1px solid var(--ar-border);
  border-radius: var(--ar-radius-sm);
  padding: 1rem;
  margin-bottom: 0.85rem;
  transition: box-shadow 0.2s ease, border-color 0.2s ease;
}

.ar-courses-page .sessions-items .courses:last-child {
  margin-bottom: 0;
}

.ar-courses-page .sessions-items .courses:hover {
  border-color: #c9d7ef;
  box-shadow: 0 6px 18px rgba(11, 31, 58, 0.07);
}

.ar-courses-page .sessions-items .courses h4 {
  margin: 0 0 0.45rem;
  font-size: 1rem;
  font-weight: 750;
  color: var(--ar-navy);
  font-family: var(--ar-font);
}

.ar-courses-page .sessions-items .courses h4 a {
  color: inherit;
  text-decoration: none;
}

.ar-courses-page .sessions-items .thumbnail {
  display: block;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 14px;
  overflow: hidden;
  background: linear-gradient(135deg, #dbeafe, #93c5fd);
  box-shadow: none;
}

.ar-courses-page .sessions-items .thumbnail img {
  width: 100%;
  height: auto;
  max-height: 110px;
  object-fit: cover;
  border-radius: 14px;
}

.ar-courses-page .list-teachers,
.ar-courses-page .category,
.ar-courses-page .course_language,
.ar-courses-page .course_extrafields {
  font-size: 0.85rem;
  color: var(--ar-muted);
  margin-top: 0.35rem;
}

.ar-courses-page .portal-course-completion-label {
  margin: 0.35rem 0;
}

.ar-courses-page .label {
  border-radius: 999px;
  font-weight: 700;
  padding: 0.25em 0.7em;
}

.ar-courses-page .title {
  margin: 0 0 0.35rem;
  font-size: 1.15rem;
  font-weight: 800;
  color: var(--ar-navy);
  font-family: var(--ar-font);
}

.ar-courses-page .subtitle-session {
  color: var(--ar-muted);
  font-size: 0.9rem;
  margin-bottom: 1rem;
}

.ar-courses-page .course-items .items,
.ar-courses-page .grid-courses .items {
  background: var(--ar-card);
  border: 1px solid var(--ar-border);
  border-radius: var(--ar-radius);
  box-shadow: var(--ar-shadow);
  overflow: hidden;
  margin-bottom: 1.25rem;
}

.ar-course-filters {
  display: grid;
  grid-template-columns: minmax(220px, 1.7fr) repeat(4, minmax(132px, 1fr));
  gap: 0.7rem 0.85rem;
  align-items: end;
  margin: 0 0 1.35rem;
  padding: 0.9rem 1rem;
  background: #fff;
  border: 1px solid #e8eef5;
  border-radius: 18px;
  box-shadow: 0 2px 10px rgba(16, 24, 40, 0.05);
}
.ar-course-filters--compact {
  grid-template-columns: minmax(240px, 2fr) repeat(2, minmax(150px, 1fr));
}
.ar-course-filters__search {
  min-width: 0;
}
.ar-course-filters__search input {
  min-height: 44px;
  border-radius: 12px;
  background: #f8fafc;
}
.ar-course-filters__field {
  display: flex;
  flex-direction: column;
  gap: 0.28rem;
  margin: 0;
  min-width: 0;
}
.ar-course-filters__field span {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  color: #64748b;
  font-size: 0.78rem;
  font-weight: 700;
}
.ar-course-filters__field span .fa {
  color: #2563eb;
  font-size: 0.82rem;
}
.ar-course-filters__field select {
  width: 100%;
  min-height: 44px;
  border: 1px solid #d7deea;
  border-radius: 12px;
  padding: 0.45rem 0.7rem;
  font-size: 0.95rem;
  font-family: inherit;
  font-weight: 600;
  color: var(--ar-navy);
  background: #fff;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%2364748b' d='M1.2 1.2L6 6l4.8-4.8'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.75rem center;
  padding-right: 1.8rem;
}
.ar-course-filters__field select:focus,
.ar-course-filters__search input:focus {
  outline: none;
  border-color: #93c5fd;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.15);
}

.ar-catalog-group {
  margin: 0 0 1.1rem;
  padding: 0.9rem 1.1rem 1.15rem;
  background: #fff;
  border: 1px solid #e8eef5;
  border-radius: 18px;
  box-shadow: 0 2px 10px rgba(16, 24, 40, 0.05);
}
.ar-catalog-group.is-expired {
  border-color: #f3e2a4;
}
.ar-catalog-group[hidden] {
  display: none !important;
}
.ar-catalog-group__head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.55rem 1rem;
  margin: 0;
  cursor: pointer;
  user-select: none;
}
.ar-catalog-group[open] > .ar-catalog-group__head {
  margin: 0 0 0.95rem;
}
.ar-catalog-group > summary.ar-catalog-group__head {
  list-style: none;
}
.ar-catalog-group > summary.ar-catalog-group__head::-webkit-details-marker,
.ar-catalog-group > summary.ar-catalog-group__head::marker {
  display: none;
  content: none;
}
.ar-catalog-group:not([open]) .ar-catalog-group__toggle .fa {
  transform: rotate(180deg);
}
.ar-catalog-group__title {
  display: flex;
  align-items: flex-start;
  gap: 0.7rem;
  min-width: 0;
}
.ar-catalog-group__icon {
  width: 34px;
  height: 34px;
  border-radius: 10px;
  background: #e8f1ff;
  color: #2563eb;
  display: grid;
  place-items: center;
  flex-shrink: 0;
  margin-top: 0.1rem;
}
.ar-catalog-group.is-expired .ar-catalog-group__icon {
  background: #fff6d6;
  color: #b45309;
}
.ar-catalog-group__head h2 {
  margin: 0;
  font-size: 1.18rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  text-transform: none;
  color: var(--ar-navy);
  line-height: 1.25;
}
.ar-route-note {
  display: block;
  margin: 0.38rem 0 0;
  padding: 0;
  background: transparent;
  color: #475569;
  font-size: 0.9rem;
  font-weight: 600;
  line-height: 1.4;
  max-width: 46rem;
}
.ar-route-note.is-expired {
  color: #92400e;
}
.ar-route-note__date {
  display: inline;
  padding: 0.18rem 0.55rem;
  border-radius: 8px;
  background: #e8f1ff;
  color: #1d4ed8;
  font-weight: 800;
  white-space: nowrap;
}
.ar-route-note.is-expired .ar-route-note__date {
  background: #fff4d6;
  color: #b45309;
}
.ar-catalog-group__meta {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  color: #64748b;
  font-size: 0.92rem;
  font-weight: 700;
}
.ar-catalog-group__toggle {
  width: 40px;
  height: 40px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: #64748b;
  display: grid;
  place-items: center;
  pointer-events: none;
}
.ar-catalog-group__toggle .fa {
  font-size: 1.35rem;
  transition: transform 0.16s ease;
}
.ar-catalog-group__head:hover .ar-catalog-group__toggle {
  background: #eef2f7;
  color: var(--ar-navy);
}

.ar-course-pager {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0.75rem;
  margin-top: 0.35rem;
  color: var(--ar-muted);
  font-size: 0.95rem;
  font-weight: 600;
}
.ar-course-pager[hidden] {
  display: none !important;
}
.ar-course-pager__nav {
  display: flex;
  align-items: center;
  gap: 0.55rem;
}
.ar-course-pager nav {
  display: flex;
  gap: 0.3rem;
}
.ar-course-pager button {
  min-width: 32px;
  height: 32px;
  border-radius: 8px;
  display: grid;
  place-items: center;
  color: var(--ar-navy);
  border: 1px solid var(--ar-border);
  padding: 0 0.4rem;
  font-weight: 700;
  font-family: inherit;
  background: #fff;
  cursor: pointer;
}
.ar-course-pager button.is-active {
  background: var(--ar-navy);
  border-color: var(--ar-navy);
  color: #fff;
}
.ar-course-pager button:disabled {
  opacity: 0.45;
  cursor: default;
}
.ar-course-pager__size select {
  min-height: 36px;
  border: 1px solid #d7deea;
  border-radius: 10px;
  padding: 0.3rem 1.7rem 0.3rem 0.7rem;
  font-family: inherit;
  font-weight: 700;
  color: var(--ar-navy);
  background: #fff;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%2364748b' d='M1.2 1.2L6 6l4.8-4.8'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.65rem center;
}

.ar-courses-page .ar-lib-catalog__tools {
  margin-top: 0;
}

@media (max-width: 1100px) {
  .ar-course-filters,
  .ar-course-filters--compact {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }
  .ar-course-filters__search {
    grid-column: 1 / -1;
  }
}

@media (max-width: 767px) {
  .ar-page-head {
    align-items: stretch;
  }

  .ar-page-head .ar-btn-yellow {
    width: 100%;
    text-align: center;
  }

  .ar-course-filters {
    grid-template-columns: 1fr;
    padding: 0.85rem;
  }

  .ar-course-pager,
  .ar-course-pager__nav {
    flex-direction: column;
    align-items: stretch;
  }
}

/* ---------- Red social (section-social-network) ---------- */
.ar-social-page {
  font-family: var(--ar-font);
}

.ar-social-grid {
  display: grid;
  grid-template-columns: 260px minmax(0, 1fr) 300px;
  gap: 1.15rem;
  align-items: start;
}

.ar-social-card__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 0.85rem;
}

.ar-social-card__head h3 {
  margin: 0;
  font-size: 1rem;
  font-weight: 800;
  color: var(--ar-navy);
}

.ar-social-card__head a {
  font-size: 0.82rem;
  font-weight: 700;
  text-decoration: none !important;
}

.ar-social-empty {
  margin: 0.5rem 0 0.85rem;
  color: var(--ar-muted);
  font-size: 0.88rem;
}

/* Profile card */
.ar-social-profile {
  background: #fff;
  border: 1px solid var(--ar-border);
  border-radius: 20px;
  box-shadow: var(--ar-shadow);
  padding: 1.25rem 1.1rem 1.15rem;
  text-align: center;
  margin-bottom: 1rem;
}

.ar-social-profile__avatar {
  position: relative;
  width: 108px;
  height: 108px;
  margin: 0 auto 0.85rem;
}

.ar-social-profile__avatar .social-profile,
.ar-social-profile__avatar .sm-groups {
  margin: 0;
}

.ar-social-profile__avatar img,
.ar-social-profile__avatar .img-circle,
.ar-social-profile__avatar .img-responsive {
  width: 108px !important;
  height: 108px !important;
  border-radius: 50% !important;
  object-fit: cover;
  border: 3px solid #e8f1ff;
  box-shadow: 0 8px 20px rgba(11, 31, 58, 0.12);
}

.ar-social-profile__badge-icon {
  position: absolute;
  right: -2px;
  bottom: 2px;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 2px 8px rgba(11, 31, 58, 0.15);
}

.ar-social-profile__badge-icon img {
  width: 100% !important;
  height: 100% !important;
  border: 0 !important;
}

.ar-social-profile__name {
  margin: 0 0 0.45rem;
  font-size: 1.05rem;
  font-weight: 800;
  color: var(--ar-navy);
}

.ar-social-profile__role {
  display: inline-flex;
  align-items: center;
  background: #e8f1ff;
  color: var(--ar-blue);
  font-size: 0.72rem;
  font-weight: 800;
  padding: 0.28rem 0.7rem;
  border-radius: 999px;
  margin-bottom: 0.85rem;
}

.ar-social-profile__meta {
  list-style: none;
  margin: 0 0 0.95rem;
  padding: 0;
  text-align: left;
}

.ar-social-profile__meta li {
  margin: 0.35rem 0;
}

.ar-social-profile__meta a {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  color: var(--ar-muted) !important;
  text-decoration: none !important;
  font-size: 0.82rem;
  font-weight: 600;
}

.ar-social-profile__meta .fa {
  color: var(--ar-blue);
  width: 16px;
  text-align: center;
}

.ar-social-profile__meta span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ar-social-profile__edit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  width: 100%;
  border: 1px solid var(--ar-border);
  background: #fff;
  color: var(--ar-navy) !important;
  border-radius: 12px;
  padding: 0.65rem 0.9rem;
  font-weight: 700;
  font-size: 0.88rem;
  text-decoration: none !important;
}

.ar-social-profile__edit:hover {
  background: #f7f9fc;
}

/* Left navigation */
.ar-social-nav {
  background: #fff;
  border: 1px solid var(--ar-border);
  border-radius: 20px;
  box-shadow: var(--ar-shadow);
  padding: 0.95rem 0.75rem;
}

.ar-social-nav__label {
  margin: 0 0.55rem 0.55rem;
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ar-muted);
}

.ar-social-nav__menu .panel,
.ar-social-nav__menu .panel-group,
.ar-social-nav__menu .panel-default {
  border: 0 !important;
  box-shadow: none !important;
  margin: 0 !important;
  background: transparent !important;
}

.ar-social-nav__menu .panel-heading {
  display: none !important;
}

.ar-social-nav__menu .panel-body,
.ar-social-nav__menu .panel-collapse {
  padding: 0 !important;
  border: 0 !important;
}

.ar-social-nav__menu .nav-pills,
.ar-social-nav__menu .list-group,
.ar-social-nav__menu ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.ar-social-nav__menu li,
.ar-social-nav__menu .list-group-item {
  border: 0 !important;
  background: transparent !important;
  margin: 0.15rem 0;
  padding: 0 !important;
}

.ar-social-nav__menu a,
.ar-social-nav__menu .list-group-item a {
  display: flex !important;
  align-items: center;
  gap: 0.65rem;
  padding: 0.65rem 0.8rem !important;
  border-radius: 12px;
  color: var(--ar-navy) !important;
  font-weight: 650;
  font-size: 0.88rem;
  text-decoration: none !important;
}

.ar-social-nav__menu a img,
.ar-social-nav__menu .list-group-item a img {
  width: 18px;
  height: 18px;
  object-fit: contain;
  opacity: 0.85;
}

.ar-social-nav__menu li.active > a,
.ar-social-nav__menu .list-group-item.active,
.ar-social-nav__menu .list-group-item.active a,
.ar-social-nav__menu li.active a {
  background: var(--ar-blue) !important;
  color: #fff !important;
}

.ar-social-nav__menu a:hover {
  background: #eef4ff !important;
}

.ar-social-nav__menu li.active a:hover {
  background: var(--ar-blue) !important;
}

.ar-social-nav__menu .badge {
  margin-left: auto;
  background: #fee2e2;
  color: #b91c1c;
}

.ar-social-nav__menu li.active .badge {
  background: rgba(255, 255, 255, 0.22);
  color: #fff;
}

/* Composer + feed */
.ar-social-composer {
  background: #fff;
  border: 1px solid var(--ar-border);
  border-radius: 20px;
  box-shadow: var(--ar-shadow);
  padding: 1.1rem 1.15rem 1rem;
  margin-bottom: 1.1rem;
}

.ar-social-composer__title {
  margin: 0 0 0.85rem;
  font-size: 1.05rem;
  font-weight: 800;
  color: var(--ar-navy);
}

.ar-social-composer > .panel,
.ar-social-composer > .panel.panel-default {
  border: 0 !important;
  box-shadow: none !important;
  margin: 0 !important;
  background: transparent !important;
}

.ar-social-composer > .panel > .panel-heading {
  display: none !important;
}

.ar-social-composer > .panel > .panel-body {
  padding: 0 !important;
}

.ar-social-composer textarea,
.ar-social-composer .form-control {
  min-height: 96px;
  border-radius: 14px !important;
  border: 1px solid var(--ar-border) !important;
  background: #f7f9fc !important;
  box-shadow: none !important;
  padding: 0.85rem 1rem !important;
  font-size: 0.92rem;
  resize: vertical;
}

.ar-social-composer .form-group {
  margin-bottom: 0.75rem;
}

.ar-social-composer .btn-primary,
.ar-social-composer button[name="wall_post_button"],
.ar-social-wall button[name="wall_post_button"] {
  background: var(--ar-blue) !important;
  border-color: var(--ar-blue) !important;
  border-radius: 12px !important;
  font-weight: 800 !important;
  padding: 0.55rem 1.15rem !important;
  min-width: 120px;
}

.ar-social-composer .btn-default,
.ar-social-composer .bootstrap-filestyle .btn {
  border-radius: 12px !important;
  border-color: var(--ar-border) !important;
  background: #fff !important;
  color: var(--ar-muted) !important;
  font-weight: 700 !important;
}

.ar-social-feed > .panel,
.ar-social-feed .panel.panel-default {
  background: #fff;
  border: 1px solid var(--ar-border);
  border-radius: 18px !important;
  box-shadow: var(--ar-shadow);
  margin-bottom: 1rem;
  overflow: hidden;
}

.ar-social-feed .panel-heading {
  background: #fff !important;
  border-bottom: 1px solid #f0f3f8;
  padding: 0.9rem 1.05rem;
}

.ar-social-feed .panel-body {
  padding: 1rem 1.05rem;
}

.ar-social-feed .panel-title,
.ar-social-feed .panel-title a {
  font-weight: 750;
  color: var(--ar-navy);
  font-size: 0.92rem;
}

.ar-social-feed textarea,
.ar-social-feed .form-control {
  border-radius: 12px !important;
  border-color: var(--ar-border) !important;
  background: #f7f9fc !important;
}

.ar-social-feed .btn-primary {
  background: var(--ar-blue) !important;
  border-color: var(--ar-blue) !important;
  border-radius: 10px !important;
  font-weight: 700 !important;
}

/* Friends */
.ar-social-friends,
.ar-social-skills,
.ar-social-groups > .panel,
.ar-social-sessions {
  background: #fff;
  border: 1px solid var(--ar-border);
  border-radius: 20px;
  box-shadow: var(--ar-shadow);
  padding: 1.05rem 1.1rem;
  margin-bottom: 1rem;
}

.ar-social-friends__search {
  margin-bottom: 0.75rem;
}

.ar-social-friends__search .form-control,
.ar-social-friends__search input[type="text"] {
  border-radius: 12px !important;
  border: 1px solid var(--ar-border) !important;
  background: #f7f9fc !important;
  height: 40px;
  box-shadow: none !important;
}

.ar-social-friends__list {
  max-height: 280px;
  overflow-y: auto;
}

.ar-social-friends__list .list-group,
.ar-social-friends__list .contact-list {
  margin: 0;
  border: 0;
  box-shadow: none;
}

.ar-social-friends__list .list-group-item {
  display: flex !important;
  align-items: center;
  gap: 0.7rem;
  border: 0 !important;
  border-bottom: 1px solid #f0f3f8 !important;
  padding: 0.65rem 0.15rem !important;
  background: transparent !important;
  color: var(--ar-navy) !important;
  text-decoration: none !important;
}

.ar-social-friends__list .list-group-item:last-child {
  border-bottom: 0 !important;
}

.ar-social-friends__list .user-image,
.ar-social-friends__list img {
  width: 40px !important;
  height: 40px !important;
  border-radius: 50% !important;
  object-fit: cover;
}

.ar-social-friends__list .username {
  flex: 1;
  font-weight: 700;
  font-size: 0.88rem;
}

.ar-social-friends__list .status img {
  width: 14px !important;
  height: 14px !important;
}

.ar-social-friends__all {
  display: block;
  text-align: center;
  margin-top: 0.75rem;
  padding-top: 0.75rem;
  border-top: 1px solid #f0f3f8;
  font-weight: 700;
  font-size: 0.86rem;
  text-decoration: none !important;
}

/* Skills */
.ar-social-skills__body {
  display: flex;
  gap: 0.85rem;
  align-items: center;
  margin-bottom: 0.85rem;
}

.ar-social-skills__dial {
  --pct: 0;
  width: 92px;
  height: 92px;
  border-radius: 50%;
  background: conic-gradient(#22c55e calc(var(--pct) * 1%), #e8eef6 0);
  display: grid;
  place-items: center;
  position: relative;
  flex-shrink: 0;
}

.ar-social-skills__dial::before {
  content: "";
  position: absolute;
  inset: 10px;
  background: #fff;
  border-radius: 50%;
}

.ar-social-skills__dial span {
  position: relative;
  z-index: 1;
  text-align: center;
  font-size: 0.65rem;
  font-weight: 700;
  color: var(--ar-muted);
  line-height: 1.15;
}

.ar-social-skills__dial strong {
  display: block;
  color: var(--ar-navy);
  font-size: 1.05rem;
}

.ar-social-skills__legend {
  list-style: none;
  margin: 0;
  padding: 0;
  flex: 1;
}

.ar-social-skills__legend li {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.78rem;
  color: var(--ar-muted);
  margin: 0.28rem 0;
}

.ar-social-skills__legend b {
  margin-left: auto;
  color: var(--ar-navy);
}

.ar-social-skills__legend i {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  display: inline-block;
}

.ar-social-skills__legend i.is-done { background: #22c55e; }
.ar-social-skills__legend i.is-progress { background: #3b82f6; }
.ar-social-skills__legend i.is-pending { background: #f59e0b; }
.ar-social-skills__legend i.is-empty { background: #cbd5e1; }

.ar-social-skills__list {
  display: grid;
  gap: 0.45rem;
  margin-bottom: 0.75rem;
}

.ar-social-skills__item {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  text-decoration: none !important;
  color: var(--ar-navy) !important;
  font-size: 0.82rem;
  font-weight: 650;
}

.ar-social-skills__img img {
  width: 28px;
  height: 28px;
  border-radius: 8px;
}

.ar-social-skills__cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  width: 100%;
  background: #eef4ff;
  color: var(--ar-blue) !important;
  border-radius: 12px;
  padding: 0.7rem 0.9rem;
  font-weight: 800;
  font-size: 0.86rem;
  text-decoration: none !important;
}

.ar-social-skills__cta:hover {
  background: #dbeafe;
}

.ar-social-groups .panel {
  border: 0 !important;
  box-shadow: none !important;
  margin: 0 !important;
}

.ar-social-groups .panel-heading {
  background: transparent !important;
  border: 0 !important;
  padding: 0 0 0.65rem !important;
}

.ar-social-groups .panel-body {
  padding: 0 !important;
}

.ar-social-sessions__list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.ar-social-sessions__list li {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  padding: 0.45rem 0;
  border-bottom: 1px solid #f0f3f8;
}

.ar-social-sessions__list img {
  width: 36px;
  height: 36px;
  border-radius: 10px;
  object-fit: cover;
}

@media (max-width: 1199px) {
  .ar-social-grid {
    grid-template-columns: 230px minmax(0, 1fr) 260px;
  }
}

@media (max-width: 991px) {
  .ar-social-grid {
    grid-template-columns: 1fr;
  }
}

/* Legacy panel hooks still used in nested social pages */
.ar-social-page .panel.panel-default,
.ar-social-page .panel-group .panel {
  background: var(--ar-card);
  border: 1px solid var(--ar-border);
  border-radius: var(--ar-radius);
  box-shadow: var(--ar-shadow);
  margin-bottom: 1.1rem;
  overflow: hidden;
}

.ar-social-page .btn-primary {
  background: var(--ar-blue);
  border-color: var(--ar-blue);
  border-radius: 999px;
  font-weight: 700;
}

.ar-social-page .btn-primary:hover {
  background: var(--ar-blue-bright);
  border-color: var(--ar-blue-bright);
}

.ar-social-page .alert {
  border-radius: var(--ar-radius-sm);
}

/* ---------- Agenda (section-myagenda) ---------- */
.ar-agenda-page .btn-toolbar,
.ar-agenda-page .actions,
.ar-agenda-page .new_actions {
  background: var(--ar-card);
  border: 1px solid var(--ar-border);
  border-radius: var(--ar-radius);
  box-shadow: var(--ar-shadow);
  padding: 0.75rem 1rem;
  margin-bottom: 1.25rem;
}

.ar-agenda-page .panel-group {
  margin-bottom: 0;
}

.ar-agenda-page .panel.panel-default {
  background: var(--ar-card);
  border: 1px solid var(--ar-border);
  border-radius: var(--ar-radius) !important;
  box-shadow: var(--ar-shadow);
  margin-bottom: 0.9rem;
  overflow: hidden;
}

.ar-agenda-page .panel.panel-default + .panel.panel-default {
  border-top: 1px solid var(--ar-border);
}

.ar-agenda-page .panel-heading {
  background: #fff;
  border-bottom: 0;
  padding: 1rem 1.2rem;
}

.ar-agenda-page .panel-title {
  font-family: var(--ar-font);
  font-size: 1rem;
  font-weight: 750;
  color: var(--ar-navy);
}

.ar-agenda-page .panel-title a {
  color: var(--ar-navy);
  text-decoration: none;
  display: block;
}

.ar-agenda-page .panel-title a:hover {
  color: var(--ar-blue);
}

.ar-agenda-page .panel-title small {
  display: inline-block;
  margin-top: 0.35rem;
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--ar-muted);
}

.ar-agenda-page .panel-collapse .list-group-item {
  border-color: var(--ar-border);
  font-size: 0.9rem;
  color: var(--ar-text);
  padding: 0.85rem 1.2rem;
}

.ar-agenda-page .btn-default {
  border-radius: 10px;
}

/* ---------- Administración e interior plataforma (Informes, mySpace, etc.) ---------- */
.ar-admin-page .btn-toolbar,
.ar-platform-page .btn-toolbar,
.ar-admin-page .new_actions,
.ar-platform-page .new_actions,
.ar-admin-page .toolbar,
.ar-platform-page .toolbar,
.ar-admin-page .search-simple,
.ar-platform-page .search-simple,
.ar-admin-page form[name="search_simple"],
.ar-platform-page form[name="search_simple"],
.ar-admin-page #search-users,
.ar-platform-page #search-users,
.ar-admin-page .well,
.ar-platform-page .well {
  background: var(--ar-card);
  border: 1px solid var(--ar-border);
  border-radius: var(--ar-radius);
  box-shadow: var(--ar-shadow);
  padding: 0.85rem 1rem;
  margin-bottom: 1.1rem;
}

.ar-admin-page .form-control,
.ar-platform-page .form-control,
.ar-admin-page input[type="text"],
.ar-platform-page input[type="text"],
.ar-admin-page input[type="search"],
.ar-platform-page input[type="search"] {
  border-radius: var(--ar-radius-sm);
  border-color: var(--ar-border);
  height: 40px;
  box-shadow: none;
  font-family: var(--ar-font);
}

/* Multi-select de inscripción: no heredar height:40px de .form-control */
.ar-admin-page select.form-control[multiple],
.ar-platform-page select.form-control[multiple],
.ar-admin-page select.ar-multi-select,
.ar-platform-page select.ar-multi-select {
  height: 320px !important;
  min-height: 320px;
  max-height: 70vh;
}

.ar-admin-page .select-list-ajax,
.ar-platform-page .select-list-ajax {
  margin-top: 8px;
  max-height: 280px;
  overflow-y: auto;
  border: 1px solid var(--ar-border);
  border-radius: var(--ar-radius-sm);
  background: #fff;
  padding: 4px;
}
.ar-admin-page .select-list-ajax a,
.ar-platform-page .select-list-ajax a {
  display: block;
  padding: 8px 10px;
  border-radius: 8px;
  color: var(--ar-text);
  text-decoration: none;
}
.ar-admin-page .select-list-ajax a:hover,
.ar-platform-page .select-list-ajax a:hover {
  background: #eef4ff;
  color: var(--ar-blue);
}

.ar-admin-page .form-control:focus,
.ar-platform-page .form-control:focus {
  border-color: var(--ar-blue);
  box-shadow: 0 0 0 3px rgba(31, 111, 235, 0.12);
}

.ar-admin-page .btn-primary,
.ar-platform-page .btn-primary {
  background: var(--ar-blue);
  border-color: var(--ar-blue);
  border-radius: 10px;
  font-weight: 700;
}

.ar-admin-page .btn-default,
.ar-platform-page .btn-default {
  border-radius: 10px;
  font-weight: 600;
}

.ar-admin-page .table,
.ar-platform-page .table,
.ar-admin-page table.data_table,
.ar-platform-page table.data_table,
.ar-admin-page .table-striped,
.ar-platform-page .table-striped {
  background: var(--ar-card);
  border: 1px solid var(--ar-border);
  border-radius: var(--ar-radius);
  overflow: visible;
  box-shadow: var(--ar-shadow);
}

.ar-user-pop-wrap {
  position: relative;
  display: inline-block;
  vertical-align: middle;
  margin-right: 2px;
}
.ar-user-pop-wrap.is-open {
  z-index: 40;
}
.ar-user-pop-trigger {
  display: inline-block;
  line-height: 0;
}
.ar-admin-page .blackboard_show,
.ar-user-pop.blackboard_show {
  display: block !important;
  float: none;
  position: absolute;
  right: 0;
  top: calc(100% + 6px);
  z-index: 50;
  min-width: 220px;
  max-width: 320px;
  max-height: 280px;
  overflow: auto;
  padding: 0.55rem 0.75rem;
  background: #0f172a;
  color: #fff;
  border: 0;
  border-radius: 10px;
  box-shadow: 0 12px 30px rgba(15, 23, 42, 0.28);
  font-size: 12px;
  font-weight: 600;
  line-height: 1.45;
  white-space: normal;
  text-align: left;
}

.ar-admin-page .table > thead > tr > th,
.ar-platform-page .table > thead > tr > th,
.ar-admin-page table.data_table th,
.ar-platform-page table.data_table th {
  background: #f8fafc;
  color: var(--ar-navy);
  font-weight: 750;
  border-bottom: 1px solid var(--ar-border);
  font-family: var(--ar-font);
}

.ar-admin-page .table > tbody > tr > td,
.ar-platform-page .table > tbody > tr > td,
.ar-admin-page table.data_table td,
.ar-platform-page table.data_table td {
  border-color: var(--ar-border);
  vertical-align: middle;
}

.ar-admin-page .pagination > li > a,
.ar-platform-page .pagination > li > a,
.ar-admin-page .pagination > li > span,
.ar-platform-page .pagination > li > span {
  border-radius: 8px;
  margin: 0 2px;
  border-color: var(--ar-border);
  color: var(--ar-navy);
}

.ar-admin-page .pagination > .active > a,
.ar-platform-page .pagination > .active > a {
  background: var(--ar-blue);
  border-color: var(--ar-blue);
}

/* ---------- Insignias emitidas (badge/issued) ---------- */
.ar-badge-page .issued {
  background: var(--ar-card);
  border: 1px solid var(--ar-border);
  border-radius: var(--ar-radius);
  box-shadow: var(--ar-shadow);
  padding: 1.5rem 1.35rem 1.25rem;
  margin: 0 0 1.35rem;
}

.ar-badge-page .thumbnail {
  background: #f8fafc;
  border: 1px solid var(--ar-border);
  border-radius: var(--ar-radius);
  box-shadow: none;
  padding: 1.15rem 1rem 1rem;
  margin-bottom: 1rem;
}

.ar-badge-page .thumbnail img {
  max-width: 260px;
  margin: 0 auto;
}

.ar-badge-page .thumbnail .lead,
.ar-badge-page .lead {
  font-family: var(--ar-font);
  font-weight: 750;
  color: var(--ar-navy);
}

.ar-badge-page h4,
.ar-badge-page h5,
.ar-badge-page .bage-username {
  font-family: var(--ar-font);
  font-weight: 750;
  color: var(--ar-navy);
}

.ar-badge-page .caption,
.ar-badge-page .badge-item,
.ar-badge-page .fa-ul {
  color: var(--ar-text);
  font-family: var(--ar-font);
}

.ar-badge-page .btn-primary,
.ar-badge-page .btn-success {
  border-radius: 999px;
  font-weight: 700;
  padding: 0.55rem 1.15rem;
}

.ar-badge-page .btn-primary {
  background: var(--ar-blue);
  border-color: var(--ar-blue);
}

.ar-badge-page .btn-primary:hover {
  background: var(--ar-blue-bright);
  border-color: var(--ar-blue-bright);
}

.ar-badge-page .panel {
  border: 1px solid var(--ar-border);
  border-radius: var(--ar-radius);
  box-shadow: none;
  overflow: hidden;
}

.ar-badge-page .panel-heading {
  font-family: var(--ar-font);
  font-weight: 700;
  background: #f8fafc;
  border-bottom: 1px solid var(--ar-border);
}

.ar-badge-page .form-control {
  border-radius: var(--ar-radius-sm);
  border-color: var(--ar-border);
  font-family: var(--ar-font);
}

/* ---------- Gamificación ---------- */
.ar-gami-page {
  font-family: var(--ar-font);
  font-size: 1.06rem;
}

.ar-page-head--gami {
  align-items: center;
  margin-bottom: 1.15rem;
}
.ar-page-head__gami-title {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
}
.ar-page-head__gami-title > em,
.ar-page-head__gami-icon {
  margin-top: 0.15rem;
  color: var(--ar-yellow);
  font-size: 1.67rem;
  filter: drop-shadow(0 1px 0 rgba(11, 31, 58, 0.12));
  flex-shrink: 0;
}
.ar-page-head__gami-icon {
  width: 42px;
  height: 42px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  background: linear-gradient(145deg, #1a3558, var(--ar-navy));
  color: var(--ar-yellow);
  font-size: 1.24rem;
  filter: none;
  box-shadow: 0 8px 18px rgba(11, 31, 58, 0.18);
}
.ar-page-head__gami-title h1 {
  margin: 0;
}
.ar-page-head__gami-title p {
  margin: 0.3rem 0 0;
  color: var(--ar-muted);
  font-size: 1.03rem;
  font-weight: 500;
  line-height: 1.4;
}

.ar-gami-tabs {
  display: flex;
  flex-wrap: nowrap;
  align-items: stretch;
  gap: 0;
  margin-bottom: 1.35rem;
  background: #fff;
  border: 1px solid var(--ar-border);
  border-radius: var(--ar-radius-sm);
  box-shadow: var(--ar-shadow);
  overflow-x: auto;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}
.ar-gami-tabs::-webkit-scrollbar { display: none; }

.ar-gami-tabs__btn {
  position: relative;
  flex: 1 1 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  border: 0;
  background: transparent;
  color: var(--ar-navy);
  border-radius: 0;
  padding: 20px 10px;
  font-weight: 700;
  font-size: 0.97rem;
  font-family: var(--ar-font);
  cursor: pointer;
  white-space: nowrap;
  transition: color 0.18s ease, background 0.18s ease;
}

.ar-gami-tabs__btn em {
  margin-right: 0;
  font-size: 1.08rem;
  width: 1.1em;
  text-align: center;
  opacity: 0.95;
}

.ar-gami-tabs__btn:hover {
  color: var(--ar-blue);
  background: rgba(31, 111, 235, 0.04);
  transform: none;
  border-color: transparent;
}

.ar-gami-tabs__btn.is-active {
  background: transparent;
  border-color: transparent;
  color: var(--ar-navy);
}
.ar-gami-tabs__btn.is-active::after {
  content: '';
  position: absolute;
  left: 0.85rem;
  right: 0.85rem;
  bottom: 0;
  height: 3px;
  border-radius: 3px 3px 0 0;
  background: var(--ar-blue);
}

.ar-gami-panel {
  display: none;
  animation: arGamiIn 0.28s ease;
}

.ar-gami-panel.is-active {
  display: block;
}

@keyframes arGamiIn {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: none; }
}

.ar-gami-me {
  display: flex;
  align-items: center;
  gap: 1rem;
  flex-wrap: wrap;
  background: linear-gradient(135deg, var(--ar-navy) 0%, #16335c 100%);
  color: #fff;
  border-radius: var(--ar-radius);
  padding: 1.15rem 1.25rem;
  margin-bottom: 1.35rem;
  box-shadow: var(--ar-shadow);
}

.ar-gami-me__place span {
  display: block;
  font-size: 0.78rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  opacity: 0.75;
}

.ar-gami-me__place strong {
  font-size: 1.84rem;
  color: var(--ar-yellow);
}

.ar-gami-me__avatar {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  object-fit: cover;
  border: 3px solid rgba(255, 255, 255, 0.35);
}

.ar-gami-me__meta {
  flex: 1;
  min-width: 160px;
}

.ar-gami-me__meta h2 {
  margin: 0;
  font-size: 1.24rem;
  font-weight: 800;
}

.ar-gami-me__meta p,
.ar-gami-me__stats {
  margin: 0.2rem 0 0;
  opacity: 0.88;
}

.ar-gami-me__stats {
  display: flex;
  gap: 0.75rem;
  font-weight: 700;
}

.ar-gami-podium {
  display: grid;
  grid-template-columns: 1fr 1.15fr 1fr;
  gap: 1.35rem;
  align-items: end;
  margin-bottom: 1.5rem;
}

.ar-gami-podium__card {
  position: relative;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 28px;
  box-shadow: 0 14px 34px rgba(15, 35, 69, 0.08);
  text-align: center;
  padding: 2rem 1.5rem 1.5rem;
  overflow: hidden;
  min-height: 420px;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.ar-gami-podium__card::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 150px;
  border-radius: 28px 28px 55% 55%;
  z-index: 0;
}

.ar-gami-podium__card > * {
  position: relative;
  z-index: 1;
}

.ar-gami-podium__card--2 { order: 1; }
.ar-gami-podium__card--2::before {
  background: linear-gradient(180deg, #f1f4ff 0%, #e8eefc 100%);
}

.ar-gami-podium__card--1 {
  order: 2;
  min-height: 470px;
  padding-top: 2.85rem;
  border: 2px solid #f2b21b;
  box-shadow:
    0 20px 50px rgba(242, 178, 27, 0.18),
    0 8px 18px rgba(15, 35, 69, 0.06);
}
.ar-gami-podium__card--1::before {
  background: linear-gradient(180deg, #fffaf0 0%, #fff3cf 100%);
}

.ar-gami-podium__card--3 { order: 3; }
.ar-gami-podium__card--3::before {
  background: linear-gradient(180deg, #fff5f2 0%, #fce9e4 100%);
}

.ar-gami-podium__crown {
  position: absolute;
  top: 0.55rem;
  left: 50%;
  transform: translateX(-50%);
  z-index: 3;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: linear-gradient(145deg, #ffd55c, #f3a900);
  color: #fff;
  font-size: 1.35rem;
  box-shadow: 0 8px 16px rgba(242, 178, 27, 0.35);
}

.ar-gami-podium__place {
  position: absolute;
  top: 1.15rem;
  right: 1.2rem;
  padding: 0.45rem 0.9rem;
  border-radius: 999px;
  font-size: 0.88rem;
  font-weight: 700;
  line-height: 1;
}

.ar-gami-podium__card--2 .ar-gami-podium__place {
  background: #e7ecff;
  color: #3a4f7b;
}
.ar-gami-podium__card--1 .ar-gami-podium__place {
  background: #ffe48b;
  color: #8c5b00;
}
.ar-gami-podium__card--3 .ar-gami-podium__place {
  background: #ffdcd1;
  color: #8c432d;
}

.ar-gami-podium__medal {
  width: 76px;
  height: 76px;
  border-radius: 50%;
  margin: 0.35rem auto 0.9rem;
  display: grid;
  place-items: center;
  font-size: 2rem;
  font-weight: 900;
  color: #fff;
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.1);
  flex-shrink: 0;
}

.ar-gami-podium__card--2 .ar-gami-podium__medal {
  background: linear-gradient(145deg, #c7d1e4, #7f91b2);
}
.ar-gami-podium__card--1 .ar-gami-podium__medal {
  background: linear-gradient(145deg, #ffd55c, #f3a900);
}
.ar-gami-podium__card--3 .ar-gami-podium__medal {
  background: linear-gradient(145deg, #d8875f, #a95d3b);
}

.ar-gami-podium__avatar {
  width: 110px;
  height: 110px;
  border-radius: 50%;
  margin: 0 auto 1rem;
  border: 6px solid #fff;
  box-shadow: 0 10px 22px rgba(15, 35, 69, 0.14);
  overflow: hidden;
  background: linear-gradient(145deg, #1d5fd1, #153d85);
  flex-shrink: 0;
}

.ar-gami-podium__card--1 .ar-gami-podium__avatar {
  width: 130px;
  height: 130px;
  border-color: #ffc928;
}

.ar-gami-podium__avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.ar-gami-podium__name {
  margin: 0 0 0.4rem;
  font-size: 1.35rem;
  font-weight: 800;
  color: #0f2345;
  line-height: 1.25;
}

.ar-gami-podium__points {
  margin: 0 0 0.65rem;
  font-size: 2.35rem;
  font-weight: 900;
  color: #145cff;
  line-height: 1.1;
}

.ar-gami-podium__card--1 .ar-gami-podium__points {
  font-size: 2.7rem;
}

.ar-gami-podium__level {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.45rem 1rem;
  border-radius: 999px;
  background: #eef3ff;
  color: #52698f;
  font-size: 0.88rem;
  font-weight: 800;
  margin-bottom: 0.85rem;
}

.ar-gami-podium__card--1 .ar-gami-podium__level {
  background: #fff1bd;
  color: #8c6200;
}

.ar-gami-podium__zona {
  margin: -0.35rem 0 0.85rem;
  font-size: 0.9rem;
  color: #74809a;
  font-weight: 600;
}

.ar-gami-me__zona {
  margin: 0.2rem 0 0;
  font-size: 0.9rem;
  color: inherit;
  font-weight: 600;
  opacity: 0.88;
}

.ar-gami-podium__stats {
  display: grid;
  grid-template-columns: 1fr 1fr;
  width: 100%;
  background: #f7f9fc;
  border-radius: 18px;
  overflow: hidden;
  margin-top: auto;
}

.ar-gami-podium__card--1 .ar-gami-podium__stats {
  background: #fff9e9;
}

.ar-gami-podium__stat {
  padding: 1rem 0.65rem;
  font-size: 0.95rem;
  font-weight: 700;
  color: #0f2345;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
}

.ar-gami-podium__stat + .ar-gami-podium__stat {
  border-left: 1px solid #dfe5ee;
}

.ar-gami-podium__stat em {
  color: #145cff;
  font-size: 1.05rem;
}

.ar-gami-podium__card--1 .ar-gami-podium__stat em {
  color: #c48a00;
}

@media (max-width: 1000px) {
  .ar-gami-podium {
    grid-template-columns: 1fr;
    gap: 1rem;
  }
  .ar-gami-podium__card--1 {
    order: -1;
    min-height: 0;
  }
  .ar-gami-podium__card--2,
  .ar-gami-podium__card--3 {
    order: 0;
    min-height: 0;
  }
}
.ar-gami-league-name {
  text-transform: uppercase !important;
  letter-spacing: 0.04em;
}
.ar-gami-league-badge {
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.ar-gami-rank-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  margin: 0 0 1rem;
}
.ar-gami-rank-tabs__btn {
  display: inline-flex;
  align-items: center;
  padding: 0.45rem 0.9rem;
  border-radius: 999px;
  border: 1px solid var(--ar-border);
  background: #fff;
  color: var(--ar-navy);
  font-weight: 750;
  font-size: 0.91rem;
  text-decoration: none !important;
}
.ar-gami-rank-tabs__btn:hover {
  border-color: var(--ar-blue);
  color: var(--ar-blue);
}
.ar-gami-rank-tabs__btn.is-active {
  background: var(--ar-navy);
  border-color: var(--ar-navy);
  color: #fff;
}

.ar-gami-board {
  background: #fff;
  border: 1px solid #e8eef5;
  border-radius: 18px;
  box-shadow: 0 2px 8px rgba(16, 24, 40, 0.05);
  overflow: hidden;
}

.ar-gami-board__scroll {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.ar-gami-board__table {
  width: 100%;
  border-collapse: collapse;
  min-width: 720px;
}

.ar-gami-board__table th {
  text-align: left;
  padding: 0.95rem 1rem;
  background: #f5f7fb;
  color: #0f2345;
  font-size: 0.92rem;
  font-weight: 750;
  white-space: nowrap;
  border-bottom: 1px solid #e8eef5;
}

.ar-gami-board__table td {
  padding: 0.95rem 1rem;
  border-bottom: 1px solid #eef1f6;
  vertical-align: middle;
  color: #0f2345;
  font-size: 1rem;
}

.ar-gami-board__table tbody tr:last-child td {
  border-bottom: 0;
}

.ar-gami-board__table tbody tr:hover {
  background: #f8fafc;
}

.ar-gami-board__table tbody tr.is-me {
  background: #eef4ff;
}

.ar-gami-board__col-pos,
.ar-gami-board__pos {
  width: 3rem;
  text-align: center !important;
  font-weight: 800;
  color: #0f2345;
}

.ar-gami-board__user {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  min-width: 200px;
}

.ar-gami-board__user img {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
  background: #e8eef5;
}

.ar-gami-avatar-initials {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  flex-shrink: 0;
  font-size: 0.85rem;
  font-weight: 800;
  letter-spacing: 0.02em;
  line-height: 1;
  user-select: none;
}

.ar-gami-avatar-initials--0 { background: #dbeafe; color: #1d4ed8; }
.ar-gami-avatar-initials--1 { background: #ede9fe; color: #6d28d9; }
.ar-gami-avatar-initials--2 { background: #fce7f3; color: #be185d; }
.ar-gami-avatar-initials--3 { background: #dcfce7; color: #15803d; }
.ar-gami-avatar-initials--4 { background: #fef3c7; color: #a16207; }

.ar-gami-me__avatar.ar-gami-avatar-initials {
  width: 56px;
  height: 56px;
  font-size: 1.05rem;
  border: 3px solid rgba(255, 255, 255, 0.35);
}

.ar-gami-podium__avatar .ar-gami-avatar-initials {
  width: 100%;
  height: 100%;
  font-size: 2rem;
  border-radius: 50%;
}

.ar-gami-podium__card--1 .ar-gami-podium__avatar .ar-gami-avatar-initials {
  font-size: 2.35rem;
}

.ar-gami-board__user strong {
  font-size: 1.02rem;
  font-weight: 800;
  color: #0f2345;
  line-height: 1.25;
}

.ar-gami-board__level {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.35rem 0.75rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--league-color, #16a34a) 14%, #fff);
  color: var(--league-color, #16a34a);
  font-size: 0.82rem;
  font-weight: 800;
  white-space: nowrap;
}

.ar-gami-board__zona {
  color: #64748b;
  font-weight: 600;
  font-size: 0.98rem;
  white-space: nowrap;
}

.ar-gami-board__col-num,
.ar-gami-board__num {
  text-align: center !important;
  font-weight: 700;
  color: #334155;
  width: 5rem;
}

.ar-gami-board__col-pts,
.ar-gami-board__pts {
  text-align: right !important;
  font-weight: 800;
  color: #145cff !important;
  white-space: nowrap;
  font-size: 1.05rem;
}

.ar-gami-table {
  background: #fff;
  border: 1px solid var(--ar-border);
  border-radius: var(--ar-radius);
  box-shadow: var(--ar-shadow);
  overflow: hidden;
}

.ar-gami-row {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  padding: 0.8rem 1rem;
  border-bottom: 1px solid var(--ar-border);
}

.ar-gami-row:last-child { border-bottom: 0; }
.ar-gami-row.is-me { background: #eef4ff; }
.ar-gami-row:hover { background: #f8fafc; }

.ar-gami-row__pos {
  width: 2rem;
  font-weight: 800;
  color: var(--ar-navy);
  text-align: center;
}

.ar-gami-row img {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  object-fit: cover;
}

.ar-gami-row__name { flex: 1; min-width: 0; }
.ar-gami-row__name strong {
  display: block;
  color: var(--ar-navy);
}
.ar-gami-row__name small {
  color: var(--ar-muted);
  font-size: 0.84rem;
}

.ar-gami-row__pts {
  font-weight: 800;
  color: var(--ar-blue);
  white-space: nowrap;
}

.ar-gami-hero-card {
  background: linear-gradient(135deg, var(--ar-navy), #1f6feb);
  color: #fff;
  border-radius: var(--ar-radius);
  padding: 1.5rem;
  margin-bottom: 1.15rem;
}

.ar-gami-hero-card p { margin: 0; text-transform: uppercase; letter-spacing: 0.08em; font-size: 0.81rem; opacity: 0.8; }
.ar-gami-hero-card strong { display: block; font-size: clamp(2.16rem, 4vw, 3.24rem); line-height: 1.1; margin: 0.2rem 0; }
.ar-gami-hero-card span { color: var(--ar-yellow); font-weight: 700; }

.ar-gami-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 0.75rem;
  margin-bottom: 1.15rem;
}

.ar-gami-stats article {
  background: #fff;
  border: 1px solid var(--ar-border);
  border-radius: var(--ar-radius-sm);
  box-shadow: var(--ar-shadow);
  padding: 0.9rem 1rem;
}

.ar-gami-stats span { display: block; color: var(--ar-muted); font-size: 0.84rem; font-weight: 700; }
.ar-gami-stats strong { font-size: 1.35rem; color: var(--ar-navy); }

.ar-gami-level,
.ar-gami-history,
.ar-gami-card {
  background: #fff;
  border: 1px solid var(--ar-border);
  border-radius: var(--ar-radius);
  box-shadow: var(--ar-shadow);
  padding: 1.15rem 1.2rem;
  margin-bottom: 1.15rem;
}

.ar-gami-level__head,
.ar-gami-history h3,
.ar-gami-card h3 {
  display: flex;
  justify-content: space-between;
  gap: 0.75rem;
  margin: 0 0 0.75rem;
  color: var(--ar-navy);
  font-size: 1.08rem;
  font-weight: 800;
}

.ar-gami-bar {
  height: 10px;
  background: #e8eef6;
  border-radius: 999px;
  overflow: hidden;
}

.ar-gami-bar span {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, var(--ar-blue), var(--ar-yellow));
  border-radius: 999px;
}

.ar-gami-level p { margin: 0.65rem 0 0; color: var(--ar-muted); }

.ar-gami-history ul { list-style: none; margin: 0; padding: 0; }
.ar-gami-history li {
  display: flex;
  gap: 0.85rem;
  padding: 0.75rem 0;
  border-bottom: 1px solid var(--ar-border);
}
.ar-gami-history li:last-child { border-bottom: 0; }
.ar-gami-history__pts {
  min-width: 4.2rem;
  font-weight: 800;
  color: #15803d;
}
.ar-gami-history__pts.is-neg { color: #b42318; }
.ar-gami-history p { margin: 0.15rem 0; color: var(--ar-text); }
.ar-gami-history small { color: var(--ar-muted); }

.ar-gami-achievements,
.ar-gami-courses {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 1.1rem;
}

.ar-gami-ach {
  background: #fff;
  border: 1px solid var(--ar-border);
  border-radius: var(--ar-radius);
  box-shadow: var(--ar-shadow);
  padding: 1.1rem;
}

.ar-gami-ach.is-off { opacity: 0.55; filter: grayscale(0.6); }
.ar-gami-ach__icon {
  width: 46px;
  height: 46px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  background: #eef4ff;
  color: var(--ar-blue);
  font-size: 1.3rem;
  margin-bottom: 0.7rem;
}
.ar-gami-ach.is-on .ar-gami-ach__icon { background: var(--ar-yellow); color: var(--ar-navy); }
.ar-gami-ach h3 { margin: 0 0 0.3rem; font-size: 1.08rem; color: var(--ar-navy); }
.ar-gami-ach p, .ar-gami-ach small { color: var(--ar-muted); }

/* ---------- Mis logros (ref mis-logros.html) ---------- */
.ar-gami-ach-summary {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  background: linear-gradient(135deg, #0B1F3D 0%, #132A4D 100%);
  border-radius: 20px;
  padding: 1.3rem 1.5rem;
  margin-bottom: 1.15rem;
  color: #fff;
}
.ar-gami-ach-summary__left {
  display: flex;
  align-items: center;
  gap: 0.9rem;
}
.ar-gami-ach-summary__icon {
  width: 46px;
  height: 46px;
  border-radius: 12px;
  background: #FFC93C;
  color: #0B1F3D;
  display: grid;
  place-items: center;
  font-size: 1.24rem;
  flex-shrink: 0;
}
.ar-gami-ach-summary__left h2 {
  margin: 0;
  font-size: 1.32rem;
  font-weight: 800;
  color: #fff;
}
.ar-gami-ach-summary__left p {
  margin: 0.15rem 0 0;
  font-size: 1rem;
  color: rgba(255, 255, 255, 0.6);
}
.ar-gami-ach-summary__right {
  display: flex;
  gap: 1.75rem;
}
.ar-gami-ach-summary__stat { text-align: right; }
.ar-gami-ach-summary__stat strong {
  display: block;
  font-size: 1.55rem;
  font-weight: 800;
  line-height: 1;
  color: #fff;
}
.ar-gami-ach-summary__stat span {
  display: block;
  margin-top: 0.3rem;
  font-size: 0.84rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.55);
}

.ar-gami-ach-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 1.15rem;
}
.ar-gami-ach-filter {
  border: 1px solid #ebeef4;
  background: #fff;
  color: #64748b;
  padding: 0.55rem 1.05rem;
  border-radius: 999px;
  font-family: var(--ar-font);
  font-size: 0.98rem;
  font-weight: 700;
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}
.ar-gami-ach-filter span {
  margin-left: 0.3rem;
  opacity: 0.65;
  font-weight: 600;
}
.ar-gami-ach-filter.is-active {
  background: #0B1F3D;
  border-color: #0B1F3D;
  color: #fff;
}
.ar-gami-ach-filter:hover:not(.is-active) {
  border-color: #cbd5e1;
  color: var(--ar-navy);
}

.ar-gami-ach-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
  gap: 1.1rem;
}
.ar-gami-ach-card {
  position: relative;
  background: #fff;
  border-radius: 20px;
  padding: 1.25rem 1.2rem 1.15rem;
  border: 1px solid #eef1f6;
  box-shadow: 0 2px 10px rgba(16, 24, 40, 0.05);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  min-height: 210px;
  transition: transform 0.18s ease, box-shadow 0.18s ease;
}
.ar-gami-ach-card[hidden],
.ar-gami-ach-card.is-filtered-out {
  display: none !important;
}
.ar-gami-ach-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 14px 28px -10px rgba(16, 24, 40, 0.12);
}
.ar-gami-ach-card.is-locked {
  opacity: 1;
}
.ar-gami-ach-card__mark {
  position: absolute;
  right: -0.35rem;
  top: 50%;
  transform: translateY(-55%);
  font-size: 7.5rem;
  line-height: 1;
  color: var(--ach-color, #F59E0B);
  opacity: 0.07;
  pointer-events: none;
  z-index: 0;
}
.ar-gami-ach-card.is-locked .ar-gami-ach-card__mark {
  color: #94a3b8;
  opacity: 0.08;
}
.ar-gami-ach-card__top {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 0.85rem;
}
.ar-gami-ach-card__icon {
  width: auto;
  height: auto;
  border-radius: 0;
  display: grid;
  place-items: center;
  font-size: 5.85rem;
  flex-shrink: 0;
  background: none;
  color: var(--ach-color, #F59E0B);
  box-shadow: none;
}
.ar-gami-ach-card.is-locked .ar-gami-ach-card__icon {
  color: #94a3b8;
}
.ar-gami-ach-card__pts {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  padding: 0.32rem 0.7rem;
  border-radius: 999px;
  font-size: 0.88rem;
  font-weight: 800;
  white-space: nowrap;
  background: rgba(34, 197, 94, 0.12);
  color: #16a34a;
}
.ar-gami-ach-card.is-locked .ar-gami-ach-card__pts {
  background: #eef1f6;
  color: #94a3b8;
}
.ar-gami-ach-card h3 {
  position: relative;
  z-index: 1;
  margin: 0 0 0.3rem;
  font-size: 1.18rem;
  font-weight: 800;
  color: #0f1e36;
}
.ar-gami-ach-card > p {
  position: relative;
  z-index: 1;
  margin: 0 0 1rem;
  font-size: 1rem;
  line-height: 1.45;
  color: #64748b;
  flex: 1;
}
.ar-gami-ach-card__foot {
  position: relative;
  z-index: 1;
  margin-top: auto;
  padding-top: 0.85rem;
  border-top: 1px solid #ebeef4;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.65rem;
}
.ar-gami-ach-card__status {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.95rem;
  font-weight: 700;
  color: #16a34a;
}
.ar-gami-ach-card__status em {
  font-size: 1.05rem;
}
.ar-gami-ach-card__when {
  font-size: 0.9rem;
  font-weight: 600;
  color: #94a3b8;
  white-space: nowrap;
}
.ar-gami-ach-card__progress {
  width: 100%;
}
.ar-gami-ach-card__progress-label {
  display: flex;
  justify-content: space-between;
  gap: 0.5rem;
  font-size: 0.92rem;
  font-weight: 700;
  color: #64748b;
  margin-bottom: 0.45rem;
}
.ar-gami-ach-card__bar {
  height: 7px;
  border-radius: 999px;
  background: #eef1f6;
  overflow: hidden;
}
.ar-gami-ach-card__bar span {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, #2F6FED, #8B5CF6);
}

.ar-gami-course {
  background: #fff;
  border: 1px solid #e8eef5;
  border-radius: 18px;
  box-shadow: 0 2px 8px rgba(16, 24, 40, 0.06);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.ar-gami-course__media {
  position: relative;
}

.ar-gami-course__img {
  height: 140px;
  background: #dbe7f5 center/cover no-repeat;
}
.ar-gami-course__img--html img {
  width: 100%;
  height: 140px;
  object-fit: cover;
  display: block;
}
.ar-gami-course[hidden] { display: none !important; }

.ar-gami-course__badge {
  position: absolute;
  top: 0.75rem;
  left: 0.75rem;
  padding: 0.28rem 0.55rem;
  border-radius: 8px;
  background: #1f6feb;
  color: #fff;
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  line-height: 1.2;
}

.ar-gami-course__body {
  padding: 1.05rem 1.1rem 1.15rem;
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  flex: 1;
}

.ar-gami-course h3 {
  margin: 0;
  font-size: 1.18rem;
  font-weight: 800;
  line-height: 1.3;
  color: var(--ar-navy);
}

.ar-gami-course__desc {
  margin: 0;
  font-size: 0.95rem;
  line-height: 1.4;
  color: #64748b;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.ar-gami-course__type {
  margin: 0;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.92rem;
  font-weight: 600;
  color: #64748b;
}

.ar-gami-course__type em {
  color: #1f6feb;
}

.ar-gami-course__status {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.6rem;
  flex-wrap: wrap;
}

.ar-gami-course__ok {
  margin: 0;
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  color: #15803d;
  font-weight: 700;
  font-size: 0.98rem;
}

.ar-gami-course__date {
  font-size: 0.9rem;
  font-weight: 600;
  color: #94a3b8;
}

.ar-gami-course__pts {
  margin-top: 0.15rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  width: 100%;
  padding: 0.55rem 0.85rem;
  border-radius: 999px;
  background: #e8f1ff;
  color: #1d4ed8;
  font-size: 1rem;
  font-weight: 800;
  box-sizing: border-box;
}

.ar-gami-course__pts em {
  font-size: 0.95rem;
}

.ar-gami-course__forms {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  margin-top: 0.15rem;
}
.ar-gami-course__forms-toggle {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  width: 100%;
  padding: 0.45rem 0.55rem 0.45rem 0.65rem;
  border: 0;
  border-radius: 10px;
  background: #eff6ff;
  color: #1d4ed8;
  font: inherit;
  font-weight: 700;
  font-size: 14px;
  line-height: 1.2;
  text-align: left;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
}
.ar-gami-course__forms-toggle:hover { background: #dbeafe; color: #1e40af; }
span.ar-gami-course__forms-toggle { box-sizing: border-box; }
.ar-gami-course__forms-toggle.is-empty,
.ar-gami-course__forms-toggle.is-empty:hover {
  background: #f8fafc;
  color: #94a3b8;
  cursor: default;
}
.ar-gami-course__forms-toggle em { width: 1rem; text-align: center; flex: 0 0 auto; }
.ar-gami-course__forms-toggle > span:not(.ar-gami-course__forms-count) {
  min-width: 0;
  flex: 1 1 auto;
}
.ar-gami-course__forms-count {
  margin-left: auto;
  flex: 0 0 auto;
  box-sizing: border-box;
  min-width: 24px;
  height: 24px;
  padding: 0 6px;
  border-radius: 999px;
  background: #1d4ed8;
  color: #fff;
  font-size: 13px;
  font-weight: 800;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.ar-gami-course__forms-count.is-empty {
  background: #cbd5e1;
}
.ar-gami-course__form {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.55rem 0.7rem;
  border-radius: 10px;
  background: #eff6ff;
  color: #1d4ed8;
  font-weight: 700;
  font-size: 14px;
  text-decoration: none;
}
.ar-gami-course__form:hover { background: #dbeafe; color: #1e40af; }
.ar-gami-course__form.is-done { background: #ecfdf3; color: #067647; }
.ar-gami-course__form.is-pending { background: #f8fafc; color: #1e3a5f; }
.ar-gami-course__form.is-pending:hover { background: #eef2f7; color: #0f2744; }
.ar-gami-course__form em { width: 1.1rem; text-align: center; flex: 0 0 auto; font-size: 16px; }
.ar-gami-course__form span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  flex: 1 1 auto;
}
.ar-gami-course__form small {
  margin-left: auto;
  flex: 0 0 auto;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}
.ar-gami-course__form.is-pending small { color: #64748b; }
.ar-gami-course__forms-pop {
  position: fixed;
  inset: 0;
  z-index: 10060;
  background: rgba(15, 23, 42, 0.45);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
}
.ar-gami-course__forms-pop[hidden] { display: none !important; }
.ar-gami-course__forms-pop__panel {
  width: min(600px, 100%);
  max-height: min(80vh, 520px);
  overflow: auto;
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 20px 50px rgba(15, 23, 42, 0.2);
  padding: 0.85rem 0.9rem 0.95rem;
}
.ar-gami-course__forms-pop__panel header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.6rem;
  margin-bottom: 0.65rem;
}
.ar-gami-course__forms-pop__panel header strong {
  font-size: 18px;
  color: #0b1f3a;
}
.ar-gami-course__forms-pop__close {
  width: 32px;
  height: 32px;
  border: 0;
  border-radius: 8px;
  background: #f1f5f9;
  color: #0b1f3a;
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
}
.ar-gami-course__forms-pop__close:hover { background: #e2e8f0; }
.ar-gami-course__forms-pop__close a:hover { text-decoration: none; }
.ar-gami-course__forms-pop__panel ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}

.ar-gami-course__actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.55rem;
  margin-top: auto;
  padding-top: 0.35rem;
}

.ar-gami-course__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  min-height: 42px;
  padding: 0.55rem 0.7rem;
  border-radius: 10px;
  font-family: var(--ar-font);
  font-size: 0.95rem;
  font-weight: 800;
  text-decoration: none !important;
  line-height: 1.2;
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.ar-gami-course__btn--primary {
  background: var(--ar-yellow);
  color: var(--ar-navy) !important;
  border: 1px solid transparent;
}

.ar-gami-course__btn--primary:hover {
  background: var(--ar-yellow-hover);
  color: var(--ar-navy) !important;
}

.ar-gami-course__btn--ghost {
  background: #fff;
  color: var(--ar-navy) !important;
  border: 1px solid #d0d7e2;
}

.ar-gami-course__btn--ghost:hover {
  border-color: var(--ar-navy);
  color: var(--ar-navy) !important;
}

.ar-gami-course__actions:has(> :only-child) {
  grid-template-columns: 1fr;
}

.ar-gami-empty { color: var(--ar-muted); padding: 1rem 0; }
.ar-gami-note { color: var(--ar-muted); }
.ar-gami-admin-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 0.9rem;
}
.ar-gami-card label { display: block; margin: 0.55rem 0; font-weight: 700; color: var(--ar-navy); font-size: 0.95rem; }
.ar-gami-card input {
  display: block;
  width: 100%;
  margin-top: 0.3rem;
  height: 40px;
  border: 1px solid var(--ar-border);
  border-radius: var(--ar-radius-sm);
  padding: 0 0.7rem;
  font-family: var(--ar-font);
}
.ar-gami-search__row { display: flex; gap: 0.6rem; }
.ar-gami-search__list { list-style: none; padding: 0; margin: 0.75rem 0 0; }
.ar-gami-search__list li { padding: 0.4rem 0; border-bottom: 1px solid var(--ar-border); }
.ar-gami-flash {
  border-radius: var(--ar-radius-sm);
  padding: 0.8rem 1rem;
  margin-bottom: 1rem;
  font-weight: 600;
}
.ar-gami-flash--confirmation { background: #ecfdf3; color: #067647; }
.ar-gami-flash--warning { background: #fff7ed; color: #b54708; }
.ar-gami-flash--error { background: #fef3f2; color: #b42318; }

.ar-gami-admin-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
}
.ar-gami-admin-head h1 {
  margin: 0 0 0.25rem;
  font-size: 1.57rem;
  color: var(--ar-navy);
}
.ar-gami-admin-head p { margin: 0; color: var(--ar-muted); }
.ar-gami-admin-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem;
  margin-bottom: 1.25rem;
  border-bottom: 1px solid var(--ar-border);
  padding-bottom: 0;
}
.ar-gami-admin-tabs a {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.7rem 0.95rem;
  border-radius: 0;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
  font-weight: 700;
  font-size: 0.97rem;
  color: var(--ar-muted) !important;
  text-decoration: none !important;
}
.ar-gami-admin-tabs a .fa { opacity: 0.75; font-size: 0.92rem; }
.ar-gami-admin-tabs a.is-active {
  background: transparent;
  color: var(--ar-blue) !important;
  border-bottom-color: var(--ar-blue);
}
.ar-gami-admin-tabs a.is-active .fa { opacity: 1; color: var(--ar-blue); }
.ar-gami-admin-tabs a:hover:not(.is-active) {
  color: var(--ar-navy) !important;
}
.ar-gami-admin-tabs__badge {
  display: inline-grid;
  place-items: center;
  min-width: 1.2rem;
  height: 1.2rem;
  padding: 0 0.3rem;
  border-radius: 999px;
  background: #ef4444;
  color: #fff;
  font-size: 0.76rem;
  font-style: normal;
}

/* ---------- Admin Resumen (overview) ---------- */
.ar-gami-ov { display: grid; gap: 1rem; }

.ar-gami-ov-actions {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
  gap: 0.85rem;
  align-items: stretch;
}
.ar-gami-ov-actions__col {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
  min-width: 0;
}
.ar-gami-ov-actions__col .ar-gami-card { margin-bottom: 0; }
.ar-gami-ov-actions__bonus {
  margin-bottom: 0;
  height: 100%;
  display: flex;
  flex-direction: column;
}
.ar-gami-ov-actions__bonus .ar-gami-bonus-grid {
  flex: 1;
}
.ar-gami-kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.85rem;
}
.ar-gami-kpi {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  background: #fff;
  border: 1px solid var(--ar-border);
  border-radius: 16px;
  box-shadow: var(--ar-shadow);
  padding: 1rem 1.1rem;
}
.ar-gami-kpi__icon {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  font-size: 1.19rem;
  flex-shrink: 0;
}
.ar-gami-kpi__icon--blue { background: #e8f0fe; color: #2563eb; }
.ar-gami-kpi__icon--green { background: #ecfdf3; color: #16a34a; }
.ar-gami-kpi__icon--violet { background: #f3e8ff; color: #7c3aed; }
.ar-gami-kpi__icon--amber { background: #fff7ed; color: #d97706; }
.ar-gami-kpi__label {
  display: block;
  color: var(--ar-muted);
  font-size: 0.84rem;
  font-weight: 700;
  margin-bottom: 0.15rem;
}
.ar-gami-kpi__value {
  display: block;
  font-size: 1.46rem;
  font-weight: 800;
  color: var(--ar-navy);
  line-height: 1.15;
}
.ar-gami-kpi__value small {
  font-size: 0.92rem;
  font-weight: 700;
  color: var(--ar-muted);
}

.ar-gami-syncbar {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 1rem;
  flex-wrap: wrap;
  background: #f0f6ff;
  border: 1px solid #d6e4ff;
  border-radius: 14px;
  padding: 0.65rem 1rem;
}
.ar-gami-syncbar p {
  margin: 0;
  color: var(--ar-navy);
  font-size: 0.97rem;
}
.ar-gami-syncbar form { margin: 0; }
.ar-gami-btn-outline {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.5rem 0.95rem;
  border-radius: 999px;
  border: 1.5px solid var(--ar-blue);
  background: #fff;
  color: var(--ar-blue);
  font-weight: 750;
  font-size: 0.95rem;
  cursor: pointer;
}
.ar-gami-btn-outline:hover {
  background: #e8f0fe;
}

.ar-gami-action-card__head {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  margin-bottom: 0.55rem;
}
.ar-gami-action-card__head h3 { margin: 0; }
.ar-gami-action-card__ico {
  width: 38px;
  height: 38px;
  border-radius: 10px;
  display: grid;
  place-items: center;
  flex-shrink: 0;
}
.ar-gami-action-card__ico--blue { background: #e8f0fe; color: #2563eb; }
.ar-gami-action-card__ico--amber { background: #fff7ed; color: #d97706; }
.ar-gami-action-card p {
  margin: 0 0 1rem;
  color: var(--ar-muted);
  font-size: 0.97rem;
  line-height: 1.45;
}
.ar-gami-action-card .ar-btn-yellow {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
}
.ar-gami-bonus-grid {
  display: grid;
  gap: 0.65rem 0.75rem;
  margin-bottom: 0.95rem;
}
.ar-gami-bonus-grid .is-full { grid-column: 1 / -1; }
.ar-gami-bonus-grid label {
  display: block;
  font-weight: 700;
  font-size: 0.89rem;
  color: var(--ar-navy);
}
.ar-gami-bonus-grid input {
  display: block;
  width: 100%;
  margin-top: 0.3rem;
  border: 1px solid var(--ar-border);
  border-radius: var(--ar-radius-sm);
  padding: 0.55rem 0.7rem;
  font-family: var(--ar-font);
  font-size: 0.97rem;
}

.ar-gami-reset-card {
  border-color: #fecaca !important;
  background: #fff7f7 !important;
}
.ar-gami-reset-card__head {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  margin-bottom: 0.85rem;
  color: #b91c1c;
}
.ar-gami-reset-card__head h3 {
  margin: 0;
  color: #991b1b;
}
.ar-gami-reset-card__body {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 1rem 1.5rem;
}
.ar-gami-reset-card__checks {
}
.ar-gami-reset-card__confirm {
  display: flex;
  align-items: end;
  gap: 0.65rem;
  flex-wrap: wrap;
}
.ar-gami-reset-card__confirm label {
  flex: 1;
  min-width: 180px;
  font-weight: 700;
  font-size: 0.89rem;
  color: var(--ar-navy);
}
.ar-gami-reset-card__confirm input {
  display: block;
  width: 100%;
  margin-top: 0.3rem;
  border: 1px solid #fca5a5;
  border-radius: var(--ar-radius-sm);
  padding: 0.55rem 0.7rem;
  font-family: var(--ar-font);
  font-size: 0.97rem;
  background: #fff;
}
.ar-gami-reset-card .ar-btn-danger {
  margin-top: 0;
  white-space: nowrap;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  width: 100%
}

.ar-gami-search__field {
  position: relative;
  flex: 1;
  min-width: 0;
  margin: 0 !important;
}
.ar-gami-search__field .fa {
  position: absolute;
  left: 0.85rem;
  top: 50%;
  transform: translateY(-50%);
  color: var(--ar-muted);
  pointer-events: none;
}
.ar-gami-search__field input {
  width: 100%;
  padding-left: 2.25rem !important;
}

.ar-gami-rank-card h3 { margin-bottom: 0.85rem; }
.ar-gami-rank-table-wrap { overflow-x: auto; }
.ar-gami-rank-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.99rem;
}
.ar-gami-rank-table th {
  text-align: left;
  padding: 0.55rem 0.65rem;
  color: var(--ar-muted);
  font-size: 0.81rem;
  font-weight: 750;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  border-bottom: 1px solid var(--ar-border);
}
.ar-gami-rank-table td {
  padding: 0.75rem 0.65rem;
  border-bottom: 1px solid var(--ar-border);
  color: var(--ar-navy);
  vertical-align: middle;
}
.ar-gami-rank-table tr:last-child td { border-bottom: 0; }
.ar-gami-rank-table__pos {
  font-weight: 800;
  color: var(--ar-muted);
  width: 2.5rem;
}
.ar-gami-rank-table__user {
  display: flex;
  align-items: center;
  gap: 0.65rem;
}
.ar-gami-rank-table__user img {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
}
.ar-gami-rank-table__user strong {
  display: block;
  font-size: 0.99rem;
}
.ar-gami-rank-table__user small {
  display: block;
  color: var(--ar-muted);
  font-size: 0.84rem;
  margin-top: 0.1rem;
}
.ar-gami-rank-table__pts {
  font-weight: 800;
  color: var(--ar-blue) !important;
}
.ar-gami-league-badge {
  display: inline-flex;
  align-items: center;
  padding: 0.25rem 0.7rem;
  border-radius: 999px;
  font-size: 0.81rem;
  font-weight: 750;
  background: color-mix(in srgb, var(--league-color, #2F6FED) 16%, #fff);
  color: var(--league-color, #2F6FED);
}
.ar-gami-rank-card__more {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  margin-top: 0.85rem;
  padding-top: 0.75rem;
  border-top: 1px solid var(--ar-border);
  font-weight: 750;
  color: var(--ar-blue) !important;
  text-decoration: none !important;
}
.ar-gami-rank-card__more:hover { text-decoration: underline !important; }

.ar-gami-toolbar { margin-bottom: 0.85rem; }
.ar-gami-points-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 0.75rem 1rem;
  margin: 0.85rem 0 1rem;
}

/* --- Puntos por curso (admin gamificación) --- */
.ar-gami-coursepts__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
}
.ar-gami-coursepts__count {
  text-align: right;
  line-height: 1.2;
}
.ar-gami-coursepts__count strong {
  display: block;
  font-size: 1.55rem;
  color: var(--ar-blue);
}
.ar-gami-coursepts__count span {
  font-size: 0.78rem;
  color: var(--ar-muted);
}
.ar-gami-ceiling {
  display: flex;
  gap: 1rem;
  align-items: flex-start;
  margin-top: 0.9rem;
  padding: 0.85rem 1rem;
  border: 1px solid var(--ar-border);
  border-left: 4px solid var(--ar-blue);
  border-radius: 10px;
  background: rgba(47, 111, 237, 0.05);
}
.ar-gami-ceiling.is-warn {
  border-left-color: #F59E0B;
  background: rgba(245, 158, 11, 0.07);
}
.ar-gami-ceiling__total {
  text-align: center;
  min-width: 96px;
  line-height: 1.1;
}
.ar-gami-ceiling__total strong {
  display: block;
  font-size: 1.7rem;
  color: var(--ar-blue);
}
.ar-gami-ceiling.is-warn .ar-gami-ceiling__total strong {
  color: #B45309;
}
.ar-gami-ceiling__total span {
  font-size: 0.74rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--ar-muted);
}
.ar-gami-ceiling__body p {
  margin: 0;
  font-size: 0.86rem;
  color: var(--ar-muted);
}
.ar-gami-ceiling__alert,
.ar-gami-ceiling__ok {
  margin-top: 0.45rem !important;
  font-weight: 600;
}
.ar-gami-ceiling__alert {
  color: #B45309 !important;
}
.ar-gami-ceiling__ok {
  color: #15803D !important;
}
@media (max-width: 600px) {
  .ar-gami-ceiling {
    flex-direction: column;
  }
  .ar-gami-ceiling__total {
    text-align: left;
  }
}

.ar-gami-coursepts__filters {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  flex-wrap: wrap;
  margin: 0.85rem 0;
  padding-bottom: 0.85rem;
  border-bottom: 1px solid var(--ar-border);
}
.ar-gami-coursepts__filters input[type="search"] {
  flex: 1 1 260px;
  border: 1px solid var(--ar-border);
  border-radius: var(--ar-radius-sm);
  padding: 0.5rem 0.7rem;
  font-family: var(--ar-font);
  font-size: 0.94rem;
}
.ar-gami-coursepts__bulk {
  display: grid;
  grid-template-columns: 150px minmax(200px, 1fr) auto;
  align-items: end;
  gap: 0.75rem 1rem;
  padding: 0.85rem;
  background: var(--ar-bg-soft, #f5f8fc);
  border: 1px solid var(--ar-border);
  border-radius: var(--ar-radius-sm);
  margin-bottom: 0.85rem;
}
.ar-gami-coursepts__actions {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
}
.ar-gami-coursepts__tablewrap {
  overflow-x: auto;
  border: 1px solid var(--ar-border);
  border-radius: var(--ar-radius-sm);
}
.ar-gami-coursepts__table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.92rem;
}
.ar-gami-coursepts__table th,
.ar-gami-coursepts__table td {
  padding: 0.6rem 0.7rem;
  border-bottom: 1px solid var(--ar-border);
  text-align: left;
  vertical-align: middle;
}
.ar-gami-coursepts__table th {
  font-size: 0.74rem;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: var(--ar-muted);
  background: var(--ar-bg-soft, #f5f8fc);
}
.ar-gami-coursepts__table .is-check { width: 38px; text-align: center; }
.ar-gami-coursepts__table .is-num { text-align: right; white-space: nowrap; }
.ar-gami-coursepts__table tbody tr:hover { background: #f8fafc; }
.ar-gami-coursepts__table tr.is-custom { background: #f0f7ff; }
.ar-gami-coursepts__table code {
  font-size: 0.82rem;
  color: var(--ar-muted);
}
.ar-gami-coursepts__note {
  display: block;
  font-size: 0.78rem;
  color: var(--ar-muted);
  font-weight: 500;
}
.ar-gami-coursepts__pts {
  display: inline-block;
  min-width: 42px;
  padding: 0.15rem 0.5rem;
  border-radius: 999px;
  background: #eef2f7;
  font-weight: 700;
}
.ar-gami-coursepts__pts.is-custom {
  background: #dbeafe;
  color: var(--ar-blue);
}
.ar-gami-coursepts__table small {
  display: block;
  font-size: 0.72rem;
  color: var(--ar-muted);
}
@media (max-width: 860px) {
  .ar-gami-coursepts__bulk { grid-template-columns: 1fr; }
}
.ar-gami-points-grid small,
.ar-gami-prize-form small {
  display: block;
  margin-top: 0.25rem;
  font-weight: 500;
  color: var(--ar-muted);
  font-size: 0.81rem;
}
.ar-gami-card textarea,
.ar-gami-card select {
  display: block;
  width: 100%;
  margin-top: 0.3rem;
  border: 1px solid var(--ar-border);
  border-radius: var(--ar-radius-sm);
  padding: 0.55rem 0.7rem;
  font-family: var(--ar-font);
  font-size: 0.97rem;
}
.ar-gami-prize-form__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem 1rem;
}
.ar-gami-prize-form__grid .is-full { grid-column: 1 / -1; }
.ar-gami-prize-form__preview {
  display: block;
  margin-top: 0.5rem;
  width: 96px;
  height: 96px;
  object-fit: cover;
  border-radius: 12px;
  border: 1px solid var(--ar-border);
}
.ar-gami-prize-form__actions {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  margin-top: 0.85rem;
  flex-wrap: wrap;
}
.ar-gami-prize-form--aside .ar-gami-prize-form__grid {
  grid-template-columns: 1fr;
}
.ar-gami-prize-form--aside label {
  display: block;
  font-weight: 700;
  font-size: 0.86rem;
  color: var(--ar-navy);
}
.ar-gami-prize-form--aside input[type="text"],
.ar-gami-prize-form--aside input[type="number"],
.ar-gami-prize-form--aside input[type="date"],
.ar-gami-prize-form--aside input[type="file"],
.ar-gami-prize-form--aside select,
.ar-gami-prize-form--aside textarea {
  display: block;
  width: 100%;
  margin-top: 0.28rem;
}
.ar-gami-prize-form--aside .ar-gami-prize-form__actions {
  flex-direction: column;
  align-items: stretch;
}
.ar-gami-prize-form--aside .ar-gami-prize-form__actions a {
  text-align: center;
  font-weight: 700;
  color: var(--ar-blue) !important;
  text-decoration: none !important;
}
.ar-gami-prize-page .ar-gami-ach-page__head { margin-bottom: 0.85rem; }
.ar-gami-prize-page .ar-gami-prize-admin {
  border: 1px solid var(--ar-border);
  border-radius: 14px;
  padding: 0.75rem 0.85rem;
  border-bottom: 1px solid var(--ar-border);
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.ar-gami-prize-page .ar-gami-prize-admin.is-editing {
  border-color: var(--ar-blue);
  box-shadow: 0 0 0 3px rgba(47, 111, 237, 0.12);
}
.ar-gami-check {
  display: flex !important;
  align-items: center;
  gap: 0.45rem;
  font-weight: 700;
}
.ar-gami-check input { width: auto !important; height: auto !important; margin: 0 !important; }
.ar-gami-prize-admin-list { display: grid; gap: 0.65rem; }
.ar-gami-prize-admin {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  padding: 0.65rem 0;
  border-bottom: 1px solid var(--ar-border);
}
.ar-gami-prize-admin img,
.ar-gami-prize-admin__ph {
  width: 56px;
  height: 56px;
  border-radius: 12px;
  object-fit: cover;
  flex-shrink: 0;
  background: #eef3fb;
  display: grid;
  place-items: center;
  color: var(--ar-blue);
  font-size: 1.35rem;
}
.ar-gami-prize-admin > div { flex: 1; min-width: 0; }
.ar-gami-prize-admin strong { display: block; color: var(--ar-navy); }
.ar-gami-prize-admin small { display: block; color: var(--ar-muted); margin-top: 0.15rem; }
.ar-gami-prize-admin__actions {
  display: flex;
  gap: 0.45rem;
  align-items: center;
}
.ar-gami-prize-admin__actions a,
.ar-gami-prize-admin__actions button {
  width: 34px;
  height: 34px;
  border: 1px solid var(--ar-border);
  border-radius: 8px;
  background: #fff;
  color: var(--ar-navy);
  display: grid;
  place-items: center;
  cursor: pointer;
}
.ar-gami-prize-admin__actions form { margin: 0; }

/* Admin split layout (logros, niveles) */
.ar-gami-ach-layout {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1rem;
  align-items: start;
}
@media (min-width: 768px) {
  .ar-gami-ach-layout {
    grid-template-columns: minmax(0, 1fr) minmax(280px, 340px);
    gap: 1rem 1.15rem;
  }
  .ar-gami-ach-layout--wide-aside {
    grid-template-columns: minmax(0, 1fr) minmax(300px, 380px);
  }
}
.ar-gami-ach-layout__main { min-width: 0; }
.ar-gami-ach-layout__aside { min-width: 0; height: 100%; }
@media (min-width: 768px) {
  .ar-gami-ach-create-sticky {
    position: sticky;
    top: 115px;
    z-index: 2;
  }
}

.ar-gami-ach-page__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
  margin-bottom: 1rem;
}
.ar-gami-ach-page__head h3 { margin: 0 0 0.35rem; }
.ar-gami-ach-page__head p {
  margin: 0;
  color: var(--ar-muted);
  font-size: 0.97rem;
  max-width: 42rem;
  line-height: 1.45;
}
.ar-gami-ach-admin-list { display: grid; gap: 0.75rem; }
.ar-gami-ach-admin {
  border: 1px solid var(--ar-border);
  border-radius: 16px;
  padding: 0;
  background: #fff;
  overflow: hidden;
  box-shadow: 0 4px 14px rgba(11, 31, 58, 0.04);
  transition: opacity 0.2s ease;
}
.ar-gami-ach-admin.is-off { opacity: 0.72; }
.ar-gami-ach-admin__head {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  padding: 0.85rem 1rem;
  background: linear-gradient(180deg, #f8fafc 0%, #fff 100%);
  border-bottom: 1px solid var(--ar-border);
  flex-wrap: wrap;
}
.ar-gami-ach-admin__meta { flex: 1; min-width: 0; }
.ar-gami-ach-admin__meta strong {
  display: block;
  color: var(--ar-navy);
  font-size: 1.08rem;
  font-weight: 800;
  line-height: 1.25;
}
.ar-gami-ach-admin__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  margin-top: 0.4rem;
}
.ar-gami-ach-admin__tag {
  display: inline-flex;
  align-items: center;
  padding: 0.18rem 0.55rem;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 700;
  background: #eef2f7;
  color: var(--ar-muted);
}
.ar-gami-ach-admin__tag--type {
  background: #e8f0fe;
  color: var(--ar-blue);
}
.ar-gami-ach-admin__tag--pts {
  background: #ecfdf3;
  color: #15803d;
}
.ar-gami-ach-admin__toggle {
  margin: 0 !important;
  white-space: nowrap;
  font-size: 0.89rem !important;
}
.ar-gami-ach-admin__ico {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  background: linear-gradient(145deg, #e8f0fe, #dbeafe);
  color: var(--ar-blue);
  font-size: 1.19rem;
  flex-shrink: 0;
}
.ar-gami-ach-admin__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.65rem 0.85rem;
  padding: 0.85rem 1rem 1rem;
}
.ar-gami-ach-admin__grid .is-full { grid-column: 1 / -1; }
.ar-gami-ach-admin__grid label {
  display: block;
  font-weight: 700;
  font-size: 0.86rem;
  color: var(--ar-navy);
}
.ar-gami-ach-admin__grid input,
.ar-gami-ach-admin__grid select {
  display: block;
  width: 100%;
  margin-top: 0.28rem;
  border: 1px solid var(--ar-border);
  border-radius: 10px;
  padding: 0.5rem 0.65rem;
  font-family: var(--ar-font);
  font-size: 0.95rem;
  background: #fff;
}
.ar-gami-ach-admin__grid input:focus,
.ar-gami-ach-admin__grid select:focus {
  outline: none;
  border-color: var(--ar-blue);
  box-shadow: 0 0 0 3px rgba(47, 111, 237, 0.12);
}

.ar-gami-ach-create-panel {
  margin-bottom: 0;
  border: 1px solid #dbeafe;
  box-shadow: 0 8px 24px rgba(47, 111, 237, 0.08);
}
.ar-gami-ach-create-panel__head {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  margin-bottom: 0.85rem;
  padding-bottom: 0.85rem;
  border-bottom: 1px solid var(--ar-border);
}
.ar-gami-ach-create-panel__head h3 {
  margin: 0 0 0.2rem;
  font-size: 1.08rem;
  color: var(--ar-navy);
}
.ar-gami-ach-create-panel__head p {
  margin: 0;
  font-size: 0.86rem;
  color: var(--ar-muted);
}
.ar-gami-ach-create-panel__ico {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  background: linear-gradient(145deg, #e8f0fe, #dbeafe);
  color: var(--ar-blue);
  font-size: 1.19rem;
  flex-shrink: 0;
}
.ar-gami-ach-create-panel__submit {
  width: 100%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
}
.ar-gami-ach-create__form {
  padding: 0;
  margin: 0;
  grid-template-columns: 1fr;
}
.ar-gami-ach-create__form small {
  display: block;
  margin-top: 0.25rem;
  font-weight: 500;
  color: var(--ar-muted);
  font-size: 0.81rem;
}

.ar-gami-fa-help {
  display: block;
  margin-top: 0.3rem;
  font-weight: 500;
  font-size: 0.81rem;
  color: var(--ar-muted);
}
.ar-gami-fa-help a {
  font-weight: 700;
  color: var(--ar-blue) !important;
  text-decoration: none !important;
}
.ar-gami-fa-help a:hover { text-decoration: underline !important; }
.ar-gami-fa-help code {
  font-size: 0.78rem;
  padding: 0.05rem 0.25rem;
  border-radius: 4px;
  background: #eef2f7;
  color: var(--ar-navy);
}

.ar-gami-level-admin-list { display: grid; gap: 0.65rem; }
.ar-gami-level-admin {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  padding: 0.75rem 0.85rem;
  border: 1px solid var(--ar-border);
  border-radius: 14px;
  background: #fff;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.ar-gami-level-admin.is-editing {
  border-color: var(--ar-blue);
  box-shadow: 0 0 0 3px rgba(47, 111, 237, 0.12);
}
.ar-gami-level-page .ar-gami-ach-page__head { margin-bottom: 0.85rem; }
.ar-gami-level-form label {
  display: block;
  font-weight: 700;
  font-size: 0.86rem;
  color: var(--ar-navy);
}
.ar-gami-level-form input[type="text"],
.ar-gami-level-form input[type="number"],
.ar-gami-level-form input[type="file"] {
  display: block;
  width: 100%;
  margin-top: 0.28rem;
  border: 1px solid var(--ar-border);
  border-radius: 10px;
  padding: 0.5rem 0.65rem;
  font-family: var(--ar-font);
  font-size: 0.95rem;
}
.ar-gami-level-form small {
  display: block;
  margin-top: 0.25rem;
  font-weight: 500;
  color: var(--ar-muted);
  font-size: 0.81rem;
}
.ar-gami-level-form__actions {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex-wrap: wrap;
}
.ar-gami-level-form__actions a {
  font-weight: 700;
  color: var(--ar-blue) !important;
  text-decoration: none !important;
}
.ar-gami-prize-admin__actions a.is-active {
  background: #e8f0fe;
  color: var(--ar-blue) !important;
}
.ar-gami-level-admin img,
.ar-gami-level-admin__ph {
  width: 48px;
  height: 48px;
  border-radius: 12px;
  object-fit: contain;
  flex-shrink: 0;
  background: #f3f6fb;
}
.ar-gami-level-admin__ph {
  display: grid;
  place-items: center;
  font-size: 1.24rem;
}
.ar-gami-level-admin > div { flex: 1; min-width: 0; }
.ar-gami-level-admin strong { display: block; color: var(--ar-navy); }
.ar-gami-level-admin small { display: block; color: var(--ar-muted); margin-top: 0.15rem; }
.ar-btn-danger {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  margin-top: 0.75rem;
  padding: 0.65rem 1.1rem;
  border: 0;
  border-radius: 999px;
  background: #dc2626;
  color: #fff !important;
  font-weight: 800;
  cursor: pointer;
  text-decoration: none !important;
}
.ar-btn-danger:hover { background: #b91c1c; color: #fff !important; }

.ar-gami-earn-hero__icon img,
.ar-gami-earn-levels__star img,
.ar-gami-pts-dial__badge img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
  border-radius: inherit;
}
.ar-gami-earn-levels__star {
  overflow: hidden;
}
.ar-gami-pts-dial__badge {
  overflow: hidden;
}

.ar-gami-status {
  display: inline-block;
  margin-top: 0.25rem;
  padding: 0.15rem 0.5rem;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 700;
}
.ar-gami-status.is-on,
.ar-gami-status.is-delivered,
.ar-gami-status.is-approved { background: #dcfce7; color: #166534; }
.ar-gami-status.is-off,
.ar-gami-status.is-rejected { background: #fee2e2; color: #b91c1c; }
.ar-gami-status.is-pending { background: #fef3c7; color: #b45309; }
.ar-gami-filters-inline {
  display: flex;
  align-items: end;
  gap: 0.75rem;
  flex-wrap: wrap;
}
.ar-gami-filters-inline label { margin: 0; min-width: 180px; }
.ar-gami-claims { display: grid; gap: 1rem; }
.ar-gami-claim {
  display: grid;
  grid-template-columns: 56px 1fr minmax(260px, 320px);
  gap: 0.85rem;
  align-items: start;
  padding-bottom: 1rem;
  border-bottom: 1px solid var(--ar-border);
}
.ar-gami-claim img { width: 56px; height: 56px; border-radius: 12px; object-fit: cover; }
.ar-gami-claim__body strong { display: block; color: var(--ar-navy); }
.ar-gami-claim__body small { display: block; color: var(--ar-muted); margin-top: 0.15rem; }
.ar-gami-claim__form label { margin-top: 0.35rem; }
.ar-gami-claim__form textarea {
  width: 100%;
  min-height: 72px;
  resize: vertical;
  border: 1px solid var(--ar-border);
  border-radius: 10px;
  padding: 0.55rem 0.7rem;
  font: inherit;
}
.ar-gami-claim__media {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  margin: 0.55rem 0 0;
}
.ar-gami-claim__media img {
  width: 64px;
  height: 64px;
  border-radius: 10px;
  object-fit: cover;
}
.ar-gami-claim__media span {
  color: var(--ar-muted);
  font-size: 0.89rem;
}
.ar-gami-claim-box { margin-top: 0.35rem; }
.ar-gami-claim-box > summary {
  list-style: none;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
}
.ar-gami-claim-box > summary::-webkit-details-marker { display: none; }
.ar-gami-claim-box__form {
  display: grid;
  gap: 0.55rem;
  margin-top: 0.75rem;
  padding: 0.85rem;
  background: #f8fafc;
  border: 1px solid var(--ar-border);
  border-radius: 12px;
}
.ar-gami-claim-box__form label {
  display: grid;
  gap: 0.25rem;
  margin: 0;
  font-size: 0.91rem;
  color: var(--ar-navy);
  font-weight: 600;
}
.ar-gami-claim-box__form input[type="text"] {
  border: 1px solid var(--ar-border);
  border-radius: 10px;
  padding: 0.5rem 0.7rem;
  font: inherit;
  font-weight: 400;
}
.ar-gami-winners-page { max-width: 1100px; margin: 0 auto; }
.ar-gami-winners-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
  gap: 1rem;
}
.ar-gami-winner {
  background: #fff;
  border: 1px solid var(--ar-border);
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 8px 20px rgba(11, 31, 58, 0.05);
}
.ar-gami-winner__img {
  width: 100%;
  height: 180px;
  object-fit: cover;
  background: linear-gradient(135deg, #e8f0fe, #f8fafc);
  display: grid;
  place-items: center;
  color: var(--ar-blue);
  font-size: 2.16rem;
}
.ar-gami-winner__img.is-empty { min-height: 180px; }
.ar-gami-winner__body { padding: 0.95rem 1rem 1.1rem; }
.ar-gami-winner__body h2,
.ar-gami-winner__body h3 {
  margin: 0 0 0.35rem;
  font-size: 1.13rem;
  color: var(--ar-navy);
}
.ar-gami-winner__prize {
  margin: 0 0 0.25rem;
  font-weight: 700;
  color: var(--ar-blue);
  font-size: 0.97rem;
}
.ar-gami-winner__company {
  margin: 0 0 0.55rem;
  color: var(--ar-muted);
  font-size: 0.91rem;
}
.ar-gami-winner blockquote {
  margin: 0.4rem 0 0.55rem;
  padding: 0.65rem 0.75rem;
  border-left: 3px solid var(--ar-blue);
  background: #f8fafc;
  color: var(--ar-navy);
  font-size: 0.97rem;
  line-height: 1.45;
}
.ar-gami-winner small { color: var(--ar-muted); }
.ar-gami-section-head { margin-bottom: 1rem; }
.ar-gami-section-head h2 { margin: 0 0 0.35rem; color: var(--ar-navy); }
.ar-gami-section-head p { margin: 0; color: var(--ar-muted); }
.ar-gami-subtitle { margin: 1.5rem 0 0.75rem; color: var(--ar-navy); font-size: 1.13rem; }
.ar-gami-prize-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 1rem;
}
.ar-gami-prize-card {
  background: #fff;
  border: 1px solid var(--ar-border);
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 8px 20px rgba(11, 31, 58, 0.05);
}
.ar-gami-prize-card__img {
  width: 100%;
  height: 150px;
  object-fit: cover;
  background: linear-gradient(135deg, #e8f0fe, #f8fafc);
  display: grid;
  place-items: center;
  color: var(--ar-blue);
  font-size: 2.16rem;
}
.ar-gami-prize-card__body { padding: 0.95rem 1rem 1.1rem; }
.ar-gami-prize-card h3 { margin: 0 0 0.4rem; font-size: 1.08rem; color: var(--ar-navy); }
.ar-gami-prize-card p { margin: 0 0 0.45rem; color: var(--ar-muted); font-size: 0.93rem; }
.ar-gami-prize-card__rule { color: var(--ar-navy) !important; font-weight: 700; }
.ar-gami-prize-card__cost { font-weight: 800; color: var(--ar-blue) !important; }
.ar-gami-prize-card__reasons {
  margin: 0.5rem 0 0;
  padding-left: 1.1rem;
  color: #b45309;
  font-size: 0.84rem;
}
.ar-gami-btn.is-disabled {
  display: inline-block;
  padding: 0.45rem 0.8rem;
  border-radius: 10px;
  background: #f1f5f9;
  color: #64748b;
  font-weight: 700;
  font-size: 0.89rem;
}
.ar-gami-my-claims { display: grid; gap: 0.55rem; }
.ar-gami-my-claim {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.55rem 1rem;
  padding: 0.75rem 0.9rem;
  border: 1px solid var(--ar-border);
  border-radius: 12px;
  background: #fff;
}
.ar-gami-my-claim strong { color: var(--ar-navy); }
.ar-gami-my-claim small { color: var(--ar-muted); }

@media (max-width: 768px) {
  .ar-gami-tabs { flex-wrap: nowrap; }
  .ar-gami-tabs__btn {
    flex: 0 0 auto;
    padding: 0.85rem 0.9rem;
    font-size: 0.91rem;
  }
  .ar-gami-podium {
    grid-template-columns: 1fr;
    gap: 1rem;
  }
  .ar-gami-podium__card--1 {
    order: -1;
    min-height: 0;
    padding-top: 2.85rem;
  }
  .ar-gami-podium__card--2,
  .ar-gami-podium__card--3 {
    order: 0;
    min-height: 0;
  }
  .ar-gami-podium__name {
    font-size: 1.2rem;
  }
  .ar-gami-podium__points,
  .ar-gami-podium__card--1 .ar-gami-podium__points {
    font-size: 2.1rem;
  }
  .ar-gami-podium__avatar,
  .ar-gami-podium__card--1 .ar-gami-podium__avatar {
    width: 96px;
    height: 96px;
  }
  .ar-gami-row { flex-wrap: wrap; }
  .ar-gami-search__row { flex-direction: column; }
  .ar-gami-prize-form__grid,
  .ar-gami-ach-admin__grid,
  .ar-gami-bonus-grid,
  .ar-gami-reset-card__body,
  .ar-gami-kpis,
  .ar-gami-ov-actions,
  .ar-gami-claim { grid-template-columns: 1fr; }
  .ar-gami-kpis { grid-template-columns: 1fr 1fr; }
  .ar-gami-admin-head { flex-direction: column; }
  .ar-gami-reset-card__confirm { flex-direction: column; align-items: stretch; }
}

@media (max-width: 767px) {
  .ar-gami-ach-layout {
    display: flex;
    flex-direction: column-reverse;
  }
}

@media (max-width: 575px) {
  .ar-gami-kpis { grid-template-columns: 1fr; }
}

/* ---------- Ganar puntos (pixel-perfect ref 2) ---------- */
.ar-gami-earn-hero {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.1rem;
  margin-bottom: 1.25rem;
}
.ar-gami-earn-hero__card {
  background: #fff;
  border: 1px solid #e8eef5;
  border-radius: 20px;
  box-shadow: 0 10px 28px rgba(11, 31, 58, 0.06);
  padding: 1.25rem 1.3rem 1.3rem;
  position: relative;
  overflow: hidden;
}
.ar-gami-earn-hero__top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.85rem;
  margin-bottom: 0.95rem;
}
.ar-gami-earn-hero__icon {
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  color: var(--ar-yellow);
  font-size: 1.13rem;
  flex-shrink: 0;
  clip-path: polygon(25% 6%, 75% 6%, 100% 50%, 75% 94%, 25% 94%, 0 50%);
}
.ar-gami-earn-hero__icon--blue {
  background: linear-gradient(145deg, #3b82f6, #1d4ed8);
  color: #ffe566;
}
.ar-gami-earn-hero__icon--violet {
  background: linear-gradient(145deg, #a78bfa, #7c3aed);
  color: #ffe566;
}
.ar-gami-earn-hero__label {
  margin: 0;
  font-size: 0.89rem;
  font-weight: 700;
  color: #334155;
}
.ar-gami-earn-hero__name {
  margin: 0.2rem 0 0;
  font-size: 1.67rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  text-transform: uppercase;
  line-height: 1.15;
}
.ar-gami-earn-hero__name--blue { color: #1d4ed8; }
.ar-gami-earn-hero__name--violet { color: #7c3aed; }
.ar-gami-earn-hero__points {
  margin: 0.35rem 0 0;
  font-size: 1.08rem;
  font-weight: 700;
  color: #475569;
  font-variant-numeric: tabular-nums;
}
.ar-gami-earn-hero__hint {
  margin: 0.75rem 0 0;
  color: #64748b;
  font-size: 0.93rem;
  line-height: 1.4;
}
.ar-gami-earn-hero__hint strong {
  color: #0f172a;
  font-weight: 800;
}
.ar-gami-earn-hero__note {
  margin: 0.15rem 0 0;
  padding: 0.7rem 0.85rem;
  border-radius: 12px;
  background: #f5f3ff;
  color: #5b21b6;
  font-size: 0.93rem;
  line-height: 1.4;
}
.ar-gami-earn-hero__note strong { font-weight: 800; color: #4c1d95; }
.ar-gami-bar--earn {
  height: 10px;
  background: #e8eef6;
  border-radius: 999px;
  overflow: hidden;
}
.ar-gami-bar--earn span {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, #3b82f6, #1d4ed8);
  border-radius: 999px;
}
.ar-gami-earn-hero__card--available {
  background: #fff;
}
.ar-gami-earn-hero__available {
  margin: 0.45rem 0 0.45rem;
  font-size: 2.21rem;
  font-weight: 800;
  color: #16a34a;
  letter-spacing: -0.02em;
  line-height: 1;
}
.ar-gami-earn-hero__gift {
  position: absolute;
  right: 1rem;
  top: 1rem;
  width: 58px;
  height: 58px;
  border-radius: 16px;
  display: grid;
  place-items: center;
  background: linear-gradient(160deg, #dbeafe, #93c5fd);
  color: #1d4ed8;
  font-size: 1.67rem;
  box-shadow: 0 10px 22px rgba(37, 99, 235, 0.22);
}
.ar-gami-earn-hero__spark {
  position: absolute;
  width: 8px;
  height: 8px;
  background: var(--ar-yellow);
  clip-path: polygon(50% 0, 61% 35%, 98% 35%, 68% 57%, 79% 91%, 50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 35%);
}
.ar-gami-earn-hero__spark--1 { top: -4px; right: -2px; }
.ar-gami-earn-hero__spark--2 { bottom: 2px; left: -6px; width: 6px; height: 6px; }
.ar-gami-earn-hero__spark--3 { top: 10px; left: -8px; width: 7px; height: 7px; }
.ar-gami-earn-hero__card--available .ar-gami-earn-hero__label,
.ar-gami-earn-hero__card--available .ar-gami-earn-hero__available,
.ar-gami-earn-hero__card--available .ar-gami-earn-hero__hint {
  padding-right: 4.5rem;
}

.ar-gami-earn-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.6fr) minmax(270px, 0.9fr);
  gap: 1.1rem;
  align-items: start;
}

.ar-gami-earn-actions__head {
  margin-bottom: 0.85rem;
  padding: 0;
  border: 0;
}
.ar-gami-earn-actions__head h3 {
  margin: 0 0 0.25rem;
  font-size: 1.24rem;
  font-weight: 800;
  color: var(--ar-navy);
}
.ar-gami-earn-actions__head p {
  margin: 0;
  color: #64748b;
  font-size: 0.97rem;
}
.ar-gami-earn-actions__list {
  list-style: none;
  margin: 0 0 0.95rem;
  padding: 0;
  display: grid;
  gap: 0.75rem;
}
.ar-gami-earn-action {
  display: grid;
  grid-template-columns: auto auto minmax(0, 1fr) auto auto;
  gap: 0.8rem;
  align-items: center;
  padding: 1rem 1.05rem;
  background: #fff;
  border: 1px solid #e8eef5;
  border-radius: 16px;
  box-shadow: 0 6px 18px rgba(11, 31, 58, 0.04);
}
.ar-gami-earn-action__mark {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: 0.81rem;
  flex-shrink: 0;
  color: #fff;
}
.ar-gami-earn-action.is-done .ar-gami-earn-action__mark {
  background: #22c55e;
  box-shadow: 0 0 0 3px rgba(34, 197, 94, 0.18);
}
.ar-gami-earn-action.is-pending .ar-gami-earn-action__mark {
  background: #f59e0b;
  box-shadow: 0 0 0 3px rgba(245, 158, 11, 0.18);
}
.ar-gami-earn-action__icon {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  font-size: 1.46rem;
  line-height: 1;
}
.ar-gami-earn-action__icon em {
  display: block;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
}
.ar-gami-earn-action.is-done .ar-gami-earn-action__icon {
  background: #dcfce7;
  color: #15803d;
}
.ar-gami-earn-action.is-pending .ar-gami-earn-action__icon {
  background: #fff7ed;
  color: #c2410c;
}
.ar-gami-earn-action__body { min-width: 0; }
.ar-gami-earn-action__body strong {
  display: block;
  color: var(--ar-navy);
  font-size: 1.06rem;
  font-weight: 750;
}
.ar-gami-earn-action__body span {
  display: block;
  color: #64748b;
  font-size: 0.91rem;
  margin-top: 0.12rem;
}
.ar-gami-earn-action__pts {
  font-weight: 800;
  font-size: 0.99rem;
  white-space: nowrap;
}
.ar-gami-earn-action.is-done .ar-gami-earn-action__pts { color: #16a34a; }
.ar-gami-earn-action.is-pending .ar-gami-earn-action__pts { color: #ea580c; }
.ar-gami-earn-action__badge {
  display: inline-flex;
  align-items: center;
  background: #dcfce7;
  color: #15803d;
  font-weight: 750;
  font-size: 0.86rem;
  border-radius: 999px;
  padding: 0.42rem 0.85rem;
  white-space: nowrap;
}
.ar-gami-earn-action__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1.5px solid #2563eb;
  color: #2563eb !important;
  background: #fff;
  border-radius: 999px;
  padding: 0.42rem 1rem;
  font-weight: 750;
  font-size: 0.91rem;
  text-decoration: none !important;
  white-space: nowrap;
  transition: background 0.15s ease, color 0.15s ease;
}
.ar-gami-earn-action__btn:hover {
  background: #2563eb;
  color: #fff !important;
}
.ar-gami-earn-actions__foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.85rem;
  flex-wrap: wrap;
  padding: 1rem 1.15rem;
  background: #eff6ff;
  border: 1px solid #dbeafe;
  border-radius: 16px;
}
.ar-gami-earn-actions__total {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  color: #0f172a;
  font-size: 1.03rem;
  font-weight: 650;
}
.ar-gami-earn-actions__total em {
  color: var(--ar-yellow);
  font-size: 1.3rem;
}
.ar-gami-earn-actions__total strong {
  color: #16a34a;
  font-weight: 800;
}
.ar-gami-earn-actions__cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #2563eb;
  color: #fff !important;
  border-radius: 12px;
  padding: 0.72rem 1.2rem;
  font-weight: 800;
  font-size: 0.99rem;
  text-decoration: none !important;
  box-shadow: 0 10px 22px rgba(37, 99, 235, 0.28);
  transition: background 0.15s ease, transform 0.15s ease;
}
.ar-gami-earn-actions__cta:hover {
  background: #1d4ed8;
  color: #fff !important;
  transform: translateY(-1px);
}

.ar-gami-earn-aside {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.ar-gami-earn-side-card {
  background: #fff;
  border: 1px solid #e8eef5;
  border-radius: 20px;
  box-shadow: 0 10px 28px rgba(11, 31, 58, 0.06);
  padding: 1.15rem 1.2rem 1.2rem;
}
.ar-gami-earn-side-card h3 {
  margin: 0 0 0.9rem;
  font-size: 1.1rem;
  font-weight: 800;
  color: var(--ar-navy);
}
.ar-gami-earn-side-empty {
  margin: 0;
  color: #64748b;
  font-size: 0.97rem;
}
.ar-gami-earn-checklist {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.55rem;
}
.ar-gami-earn-checklist li {
  display: grid;
  grid-template-columns: auto auto minmax(0, 1fr) auto;
  gap: 0.55rem;
  align-items: center;
  padding: 0.55rem 0.15rem;
  font-size: 0.97rem;
  color: var(--ar-text);
}
.ar-gami-earn-checklist__warn {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: #f59e0b;
  color: #fff;
  font-size: 0.76rem;
}
.ar-gami-earn-checklist__icon {
  width: 30px;
  height: 30px;
  border-radius: 8px;
  display: grid;
  place-items: center;
  background: #fff7ed;
  color: #c2410c;
  font-size: 1.08rem;
  flex-shrink: 0;
}
.ar-gami-earn-checklist__icon em {
  display: block;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
}
.ar-gami-earn-checklist__name {
  min-width: 0;
  font-weight: 700;
  color: var(--ar-navy);
}
.ar-gami-earn-checklist strong {
  color: #ea580c;
  font-weight: 800;
  white-space: nowrap;
  font-size: 0.91rem;
}

.ar-gami-earn-levels {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.2rem;
}
.ar-gami-earn-levels li {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.55rem;
  padding: 0.55rem 0.55rem;
  border-radius: 12px;
  border: 1px solid transparent;
  color: var(--ar-text);
}
.ar-gami-earn-levels__star {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: 0.76rem;
  color: #fff;
}
.ar-gami-earn-levels__item--1 .ar-gami-earn-levels__star { background: #22c55e; }
.ar-gami-earn-levels__item--2 .ar-gami-earn-levels__star { background: #3b82f6; }
.ar-gami-earn-levels__item--3 .ar-gami-earn-levels__star { background: #8b5cf6; }
.ar-gami-earn-levels__item--4 .ar-gami-earn-levels__star { background: #f59e0b; }
.ar-gami-earn-levels__item--5 .ar-gami-earn-levels__star { background: #2563eb; }
.ar-gami-earn-levels__item--6 .ar-gami-earn-levels__star { background: #7c3aed; }
.ar-gami-earn-levels li strong {
  font-weight: 700;
  color: var(--ar-navy);
  font-size: 0.99rem;
}
.ar-gami-earn-levels li > span:last-child {
  color: #64748b;
  font-weight: 700;
  font-size: 0.91rem;
  font-variant-numeric: tabular-nums;
}
.ar-gami-earn-levels li.is-current {
  background: #eff6ff;
  border-color: #bfdbfe;
}
.ar-gami-earn-levels li.is-current strong {
  font-weight: 800;
  color: #1d4ed8;
}

@media (max-width: 1100px) {
  .ar-gami-earn-hero { grid-template-columns: 1fr 1fr; }
  .ar-gami-earn-hero__card--available { grid-column: 1 / -1; }
}
@media (max-width: 900px) {
  .ar-gami-earn-grid { grid-template-columns: 1fr; }
}
@media (max-width: 768px) {
  .ar-gami-earn-hero { grid-template-columns: 1fr; }
  .ar-gami-earn-hero__card--available { grid-column: auto; }
  .ar-gami-earn-action {
    grid-template-columns: auto auto minmax(0, 1fr);
    grid-template-areas:
      "mark icon body"
      "mark icon pts"
      "cta cta cta";
  }
  .ar-gami-earn-action__mark { grid-area: mark; }
  .ar-gami-earn-action__icon { grid-area: icon; }
  .ar-gami-earn-action__body { grid-area: body; }
  .ar-gami-earn-action__pts { grid-area: pts; }
  .ar-gami-earn-action__cta { grid-area: cta; margin-top: 0.25rem; }
  .ar-gami-earn-action__btn,
  .ar-gami-earn-action__badge { width: 100%; justify-content: center; }
  .ar-gami-earn-actions__foot { flex-direction: column; align-items: stretch; }
  .ar-gami-earn-actions__cta { width: 100%; justify-content: center; }
}

/* ---------- Mis puntos (ref mis-puntos.html) ---------- */
.ar-gami-pts-top {
  display: grid;
  grid-template-columns: minmax(0, 1.7fr) minmax(220px, 0.75fr);
  gap: 1rem;
  align-items: stretch;
  margin-bottom: 1.25rem;
}
.ar-gami-pts-hero {
  --lvl-color: #2F6FED;
  position: relative;
  overflow: hidden;
  border-radius: 24px;
  padding: 2rem;
  margin-bottom: 0;
  height: 100%;
  background: linear-gradient(135deg, #0B1F3D 0%, #132A4D 55%, #1B3A66 100%);
  color: #fff;
}
.ar-gami-pts-hero__glow {
  position: absolute;
  top: -40px;
  right: -40px;
  width: 220px;
  height: 220px;
  border-radius: 50%;
  background: var(--lvl-color);
  opacity: 0.2;
  filter: blur(50px);
  pointer-events: none;
}
.ar-gami-pts-hero__top {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1.75rem;
}
.ar-gami-pts-hero__eyebrow {
  margin: 0;
  font-size: 0.81rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.5);
}
.ar-gami-pts-hero__points {
  margin: 0.25rem 0 0;
  font-size: clamp(2.59rem, 5vw, 3.24rem);
  font-weight: 800;
  letter-spacing: -0.02em;
  color: #fff;
  line-height: 1.1;
}
.ar-gami-pts-hero__chip {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  margin-top: 0.55rem;
  padding: 0.35rem 0.8rem;
  border-radius: 999px;
  font-size: 0.97rem;
  font-weight: 700;
  background: color-mix(in srgb, var(--lvl-color) 18%, transparent);
  color: var(--lvl-color);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.ar-gami-pts-hero__chip em { font-size: 0.92rem; }
.ar-gami-pts-hero__hint {
  max-width: 18rem;
  margin: 1.25rem 0 0;
  font-size: 0.97rem;
  line-height: 1.5;
  color: rgba(255, 255, 255, 0.62);
}
.ar-gami-pts-hero__hint strong { color: #fff; font-weight: 700; }
.ar-gami-pts-hero__next { font-weight: 800; }

.ar-gami-pts-dial {
  position: relative;
  width: 168px;
  height: 168px;
  flex-shrink: 0;
}
.ar-gami-pts-dial svg { transform: rotate(-90deg); display: block; }
.ar-gami-pts-dial__track {
  fill: none;
  stroke: rgba(255, 255, 255, 0.12);
  stroke-width: 10;
}
.ar-gami-pts-dial__progress {
  fill: none;
  stroke: var(--lvl-color);
  stroke-width: 10;
  stroke-linecap: round;
  transition: stroke-dashoffset 0.9s ease;
}
.ar-gami-pts-dial__center {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.ar-gami-pts-dial__badge {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background: var(--lvl-color);
  display: grid;
  place-items: center;
  color: #fff;
  font-size: 1.46rem;
}
.ar-gami-pts-dial__pct {
  margin-top: 0.5rem;
  font-size: 0.81rem;
  font-weight: 800;
  color: #fff;
}

.ar-gami-pts-stepper {
  position: relative;
  display: flex;
  align-items: center;
  gap: 0.4rem;
  padding-top: 10px;
  overflow-x: auto;
  padding-bottom: 0.25rem;
  scrollbar-width: none;
}
.ar-gami-pts-stepper::-webkit-scrollbar { display: none; }
.ar-gami-pts-step {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.4rem;
  flex-shrink: 0;
}
.ar-gami-pts-step__dot {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: 0.76rem;
  font-weight: 800;
  background: rgba(255, 255, 255, 0.08);
  color: rgba(255, 255, 255, 0.4);
}
.ar-gami-pts-step__dot.is-reached { color: #fff; }
.ar-gami-pts-step__dot.is-current {
  box-shadow: 0 0 0 3px var(--ring-color, transparent);
}
.ar-gami-pts-step__label {
  white-space: nowrap;
  font-size: 0.76rem;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.35);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.ar-gami-pts-step__label.is-reached { color: #fff; }
.ar-gami-pts-step__line {
  width: 24px;
  height: 2px;
  border-radius: 2px;
  margin-bottom: 1rem;
  flex-shrink: 0;
  background: rgba(255, 255, 255, 0.1);
}
@media (min-width: 640px) {
  .ar-gami-pts-step__line { width: 40px; }
}

.ar-gami-pts-stats {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.75rem;
  margin-bottom: 0;
  align-content: stretch;
}
.ar-gami-pts-stat {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  background: #fff;
  border-radius: 16px;
  padding: 0.95rem 1rem;
  border: 1px solid #e8eef5;
  box-shadow: 0 1px 2px rgba(16, 24, 40, 0.05);
  min-height: 0;
  flex: 1;
}
.ar-gami-pts-stat__icon {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  flex-shrink: 0;
  font-size: 1.13rem;
}
.ar-gami-pts-stat__label {
  display: block;
  font-size: 0.76rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: #64748b;
}
.ar-gami-pts-stat__value {
  display: block;
  margin-top: 0.1rem;
  font-size: 1.35rem;
  font-weight: 800;
  color: #0f1e36;
}

.ar-gami-pts-history {
  background: #fff;
  border-radius: 16px;
  padding: 1.4rem 1.45rem;
  border: 1px solid #e8eef5;
  box-shadow: 0 1px 2px rgba(16, 24, 40, 0.05);
}
.ar-gami-pts-history__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 1.15rem;
}
.ar-gami-pts-history__head h3 {
  margin: 0;
  font-size: 1.18rem;
  font-weight: 800;
  color: var(--ar-navy);
}
.ar-gami-pts-history__more {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  border: 0;
  background: none;
  color: #2F6FED;
  font-family: var(--ar-font);
  font-size: 1.02rem;
  font-weight: 700;
  cursor: pointer;
  padding: 0;
}
.ar-gami-pts-history__more em { font-size: 0.85rem; }

.ar-gami-pts-timeline { position: relative; }
.ar-gami-pts-timeline__line {
  position: absolute;
  left: 17px;
  top: 8px;
  bottom: 8px;
  width: 2px;
  background: #edf0f6;
}
.ar-gami-pts-timeline__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 1.2rem;
}
.ar-gami-pts-timeline__list .is-extra {
  display: none !important;
}
.ar-gami-pts-timeline__list.is-expanded .is-extra {
  display: flex !important;
}
.ar-gami-pts-timeline__item {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 1rem;
}
.ar-gami-pts-timeline__icon {
  z-index: 1;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  flex-shrink: 0;
  font-size: 0.98rem;
}
.ar-gami-pts-timeline__icon--perfil,
.ar-gami-pts-timeline__icon--curso,
.ar-gami-pts-timeline__icon--otro {
  background: #22C55E;
  color: #fff;
}
.ar-gami-pts-timeline__icon--logro {
  background: #FFC93C;
  color: #0B1F3D;
}
.ar-gami-pts-timeline__icon--nivel {
  background: #1f6feb;
  color: #fff;
}
.ar-gami-pts-timeline__icon--biblioteca,
.ar-gami-pts-timeline__icon--premio {
  background: #8B5CF6;
  color: #fff;
}
.ar-gami-pts-timeline__body {
  flex: 1;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
  min-width: 0;
}
.ar-gami-pts-timeline__body strong {
  display: block;
  font-size: 1.05rem;
  font-weight: 750;
  color: #0f1e36;
}
.ar-gami-pts-timeline__body p {
  margin: 0.15rem 0 0;
  font-size: 1.02rem;
  color: #475569;
}
.ar-gami-pts-timeline__body small {
  display: block;
  margin-top: 0.25rem;
  font-size: 0.92rem;
  color: #64748b;
}
.ar-gami-pts-timeline__amount {
  flex-shrink: 0;
  padding: 0.3rem 0.7rem;
  border-radius: 8px;
  font-size: 1.02rem;
  font-weight: 800;
  background: color-mix(in srgb, #22C55E 12%, transparent);
  color: #22C55E;
}
.ar-gami-pts-timeline__amount.is-neg {
  background: color-mix(in srgb, #ef4444 12%, transparent);
  color: #ef4444;
}

@media (max-width: 960px) {
  .ar-gami-pts-top {
    grid-template-columns: 1fr;
  }
  .ar-gami-pts-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 640px) {
  .ar-gami-pts-hero { padding: 1.35rem; }
  .ar-gami-pts-hero__top { justify-content: center; text-align: center; }
  .ar-gami-pts-hero__hint { margin-left: auto; margin-right: auto; }
  .ar-gami-pts-hero__chip { justify-content: center; }
  .ar-gami-pts-stats {
    grid-template-columns: 1fr;
  }
}
/* ---------- Flotante (inferior derecha, encima del chat) ---------- */
.ar-gami-float {
  --ar-gami-float-chat-gap: 2.75rem;
  --ar-gami-float-bg: #00153f;
  --ar-gami-float-bg-2: #0a2148;
  --ar-gami-float-line: rgba(255, 255, 255, 0.12);
  --ar-gami-float-muted: rgba(255, 255, 255, 0.78);
  position: fixed;
  right: 1.15rem;
  left: auto;
  bottom: var(--ar-gami-float-chat-gap);
  z-index: 10050;
  font-family: var(--ar-font);
  pointer-events: none;
  display: flex;
  flex-direction: column-reverse;
  align-items: flex-end;
  gap: 0.75rem;
}
.ar-gami-float > * { pointer-events: auto; }

.ar-gami-float__panel {
  width: min(320px, calc(100vw - 2rem));
  background: linear-gradient(180deg, var(--ar-gami-float-bg-2) 0%, var(--ar-gami-float-bg) 100%);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 22px;
  box-shadow: 0 22px 50px rgba(7, 21, 40, 0.45);
  padding: 1.15rem 1.15rem 1rem;
  position: relative;
  color: #fff;
  animation: arGamiIn 0.25s ease;
}
.ar-gami-float__close {
  position: absolute;
  top: 0.7rem;
  right: 0.7rem;
  border: 0;
  background: transparent;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  color: rgba(255, 255, 255, 0.85);
  cursor: pointer;
  font-size: 1.03rem;
  transition: background 0.15s ease, color 0.15s ease;
}
.ar-gami-float__close:hover {
  background: rgba(255, 255, 255, 0.1);
  color: #fff;
}
.ar-gami-float__head {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  color: #fff;
  margin-bottom: 0.55rem;
  padding-right: 1.7rem;
}
.ar-gami-float__badge-icon {
  width: 34px;
  height: 34px;
  border-radius: 10px;
  display: grid;
  place-items: center;
  background: rgba(0, 0, 0, 0.28);
  color: var(--ar-yellow);
  font-size: 1.03rem;
  flex-shrink: 0;
}
.ar-gami-float__head strong {
  font-size: 1.13rem;
  font-weight: 800;
  letter-spacing: -0.01em;
}
.ar-gami-float__copy {
  margin: 0 0 0.85rem;
  color: var(--ar-gami-float-muted);
  font-size: 0.97rem;
  line-height: 1.45;
}
.ar-gami-float__copy strong {
  color: var(--ar-yellow);
  font-weight: 800;
}
.ar-gami-float__list {
  list-style: none;
  margin: 0 0 1rem;
  padding: 0;
}
.ar-gami-float__list li {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0.65rem;
  padding: 0.62rem 0;
  font-size: 0.99rem;
  color: #fff;
  border-bottom: 1px solid var(--ar-gami-float-line);
}
.ar-gami-float__list li:last-child { border-bottom: 0; }
.ar-gami-float__item {
  display: inline-flex;
  align-items: center;
  gap: 0.65rem;
  min-width: 0;
}
.ar-gami-float__item em {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  display: inline-grid;
  place-items: center;
  font-size: 0.78rem;
  flex-shrink: 0;
  line-height: 1;
}
.ar-gami-float__list li.is-done .ar-gami-float__item em {
  background: #22c55e;
  color: #fff;
  box-shadow: 0 0 0 3px rgba(34, 197, 94, 0.22);
}
.ar-gami-float__list li.is-pending .ar-gami-float__item em {
  background: #f59e0b;
  color: #fff;
}
.ar-gami-float__list li.is-done strong {
  color: #4ade80;
}
.ar-gami-float__list li.is-pending strong {
  color: #fb923c;
}
.ar-gami-float__list strong {
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}
.ar-gami-float__cta {
  display: inline-flex;
  width: 100%;
  justify-content: center;
  align-items: center;
  background: #2563eb;
  color: #fff !important;
  border-radius: 12px;
  padding: 0.78rem 1rem;
  font-weight: 800;
  font-size: 1.03rem;
  text-decoration: none !important;
  box-shadow: 0 10px 22px rgba(37, 99, 235, 0.35);
  transition: background 0.15s ease, transform 0.15s ease;
}
.ar-gami-float__cta:hover {
  background: #1d4ed8;
  color: #fff !important;
  transform: translateY(-1px);
}
.ar-gami-float__later {
  display: block;
  width: 100%;
  margin-top: 0.7rem;
  border: 0;
  background: transparent;
  color: rgba(255, 255, 255, 0.55);
  font-family: var(--ar-font);
  font-size: 0.95rem;
  font-weight: 650;
  cursor: pointer;
  text-align: center;
  padding: 0.35rem;
}
.ar-gami-float__later:hover { color: rgba(255, 255, 255, 0.85); }

.ar-gami-float__tips,
.ar-gami-float__news {
  margin-top: 0.15rem;
  padding-top: 0.85rem;
  border-top: 1px solid var(--ar-gami-float-line);
}
.ar-gami-float__tips h4,
.ar-gami-float__news h4 {
  margin: 0 0 0.55rem;
  font-size: 0.78rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.5);
  font-weight: 800;
}
.ar-gami-float__tips ul,
.ar-gami-float__news ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.ar-gami-float__tips li,
.ar-gami-float__news li { margin: 0 0 0.55rem; }
.ar-gami-float__tips li:last-child,
.ar-gami-float__news li:last-child { margin-bottom: 0; }
.ar-gami-float__tips a,
.ar-gami-float__tips strong,
.ar-gami-float__news a,
.ar-gami-float__news strong {
  display: block;
  color: #fff;
  text-decoration: none;
  font-size: 0.97rem;
  font-weight: 750;
  line-height: 1.3;
}
.ar-gami-float__tips a:hover,
.ar-gami-float__news a:hover { color: var(--ar-yellow); }
.ar-gami-float__tips span,
.ar-gami-float__news span {
  display: block;
  margin-top: 0.15rem;
  color: var(--ar-gami-float-muted);
  font-size: 0.86rem;
  font-weight: 500;
  line-height: 1.35;
}
.ar-gami-float__tips li.is-priority strong {
  color: var(--ar-yellow);
}

.ar-gami-float__fab {
  width: 58px;
  height: 58px;
  border-radius: 50%;
  border: 0;
  background: #2563eb;
  color: #fff;
  box-shadow: 0 12px 32px rgba(37, 99, 235, 0.4);
  font-size: 1.4rem;
  cursor: pointer;
  position: relative;
  transition: transform 0.18s ease, box-shadow 0.18s ease;
}
.ar-gami-float__fab:hover {
  transform: translateY(-2px) scale(1.03);
  box-shadow: 0 16px 36px rgba(37, 99, 235, 0.48);
}
.ar-gami-float__fab-badge {
  position: absolute;
  top: -2px;
  right: -2px;
  min-width: 22px;
  height: 22px;
  border-radius: 999px;
  background: #ef4444;
  color: #fff;
  font-size: 0.78rem;
  font-weight: 800;
  display: grid;
  place-items: center;
  padding: 0 5px;
  box-shadow: 0 2px 6px rgba(11, 31, 58, 0.25);
}

@media (max-width: 768px) {
  .ar-gami-float {
    right: 0.85rem;
    left: auto;
    bottom: var(--ar-gami-float-chat-gap);
  }
  .ar-gami-float__panel {
    width: min(300px, calc(100vw - 1.7rem));
  }
}

/* ---------- Biblioteca ---------- */
.ar-lib-page {
  font-family: var(--ar-font);
  font-size: 14px;
  padding-bottom: 2rem;
}

.ar-lib-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  margin-bottom: 1.35rem;
  background: #f7f8fa;
  border-radius: 16px;
  padding: 1.6rem 2rem;
}

.ar-lib-hero h1 {
  margin: 0;
  font-size: 28px;
  font-weight: 800;
  color: var(--ar-navy);
  letter-spacing: -0.03em;
}

.ar-lib-hero p {
  margin: 0.4rem 0 0;
  color: var(--ar-muted);
  font-size: 14px;
  max-width: 34rem;
}

.ar-lib-hero__art {
  flex-shrink: 0;
}

.ar-lib-hero__img {
  display: block;
  width: min(280px, 34vw);
  height: auto;
  filter: drop-shadow(0 10px 18px rgba(11, 31, 58, 0.12));
}

.ar-lib-card {
  background: #fff;
  border: 1px solid var(--ar-border);
  border-radius: 20px;
  box-shadow: var(--ar-shadow);
  padding: 1.15rem 1.2rem 1.2rem;
  margin-bottom: 10px;
}

.ar-lib-card > h2,
.ar-lib-card > h3,
.ar-lib-form h2,
.ar-lib-form h3,
.ar-lib-reader h1,
.ar-lib-taskpage h1 {
  margin: 0 0 0.9rem;
  color: var(--ar-navy);
  font-weight: 800;
}

.ar-lib-card > h2 { font-size: 22px; }

.ar-lib-overview {
  display: grid;
  grid-template-columns: 1.1fr 1.15fr 1fr;
  gap: 1rem;
  margin-bottom: 1.15rem;
}
.ar-lib-overview > .ar-lib-recommend,
.ar-lib-overview > .ar-lib-catalog {
  grid-column: 1 / -1;
}

.ar-lib-progress {
  display: flex;
  gap: 1.1rem;
  align-items: center;
  margin-bottom: 1rem;
}

.ar-lib-dial {
  --pct: 0;
  width: 118px;
  height: 118px;
  border-radius: 50%;
  background: conic-gradient(var(--ar-blue) calc(var(--pct) * 1%), #e8eef6 0);
  display: grid;
  place-items: center;
  flex-shrink: 0;
}

.ar-lib-dial::before {
  content: "";
  width: 86px;
  height: 86px;
  background: #fff;
  border-radius: 50%;
  position: absolute;
}

.ar-lib-dial {
  position: relative;
}

.ar-lib-dial span {
  position: relative;
  z-index: 1;
  text-align: center;
  color: var(--ar-muted);
  font-size: 14px;
  font-weight: 600;
  line-height: 1.2;
}

.ar-lib-dial strong {
  display: block;
  color: var(--ar-navy);
  font-size: 22px;
  font-weight: 800;
}

.ar-lib-progress ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.ar-lib-progress li {
  color: var(--ar-muted);
  font-size: 14px;
  margin: 0.35rem 0;
}

.ar-lib-progress li strong {
  color: var(--ar-navy);
  margin-right: 0.25rem;
}

.ar-lib-current {
  display: flex;
  gap: 0.9rem;
  align-items: flex-start;
  margin-bottom: 1rem;
}

.ar-lib-current img,
.ar-lib-reader__head img,
.ar-lib-admin-row img,
.ar-lib-book img {
  width: 64px;
  height: 86px;
  object-fit: cover;
  border-radius: 8px;
  background: #eef3fb;
  flex-shrink: 0;
}

.ar-lib-current h3,
.ar-lib-book h3 {
  margin: 0;
  font-size: 14px;
  font-weight: 800;
  color: var(--ar-navy);
}

.ar-lib-author {
  margin: 0.2rem 0 0.55rem;
  color: var(--ar-muted);
  font-size: 14px;
}

.ar-lib-author .fa { margin-right: 0.3rem; }

.ar-lib-bar {
  height: 8px;
  background: #e8eef6;
  border-radius: 999px;
  overflow: hidden;
  margin-bottom: 0.35rem;
}

.ar-lib-bar span {
  display: block;
  height: 100%;
  background: var(--ar-blue);
  border-radius: inherit;
}

.ar-lib-current small,
.ar-lib-reader small { color: var(--ar-muted); font-size: 14px; }

.ar-lib-stats {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.7rem;
  margin-bottom: 1rem;
}

.ar-lib-stats > div {
  display: flex;
  gap: 0.55rem;
  align-items: center;
  background: #f7f9fc;
  border-radius: 12px;
  padding: 0.55rem 0.65rem;
}

.ar-lib-stats p {
  margin: 0;
  color: var(--ar-muted);
  font-size: 14px;
  line-height: 1.25;
}

.ar-lib-stats strong {
  display: block;
  color: var(--ar-navy);
  font-size: 14px;
}
.ar-lib-stats__detail {
  display: block;
  margin-top: 0.15rem;
  color: #64748b;
  font-size: 14px;
  font-weight: 600;
}

.ar-lib-ico {
  width: 32px;
  height: 32px;
  border-radius: 10px;
  display: grid;
  place-items: center;
  color: #fff;
  flex-shrink: 0;
  font-size: 14px;
}
.ar-lib-ico.is-blue { background: #3b82f6; }
.ar-lib-ico.is-purple { background: #7c5cfc; }
.ar-lib-ico.is-pink { background: #f43f5e; }
.ar-lib-ico.is-sky { background: #38bdf8; }

.ar-lib-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  border-radius: 12px;
  padding: 0.62rem 1rem;
  font-weight: 700;
  font-size: 14px;
  text-decoration: none !important;
  border: 1px solid transparent;
  cursor: pointer;
  font-family: inherit;
}

.ar-lib-btn--ghost {
  background: #fff;
  color: var(--ar-navy) !important;
  border-color: #e6ebf2;
}

.ar-lib-btn--outline {
  background: #fff;
  color: var(--ar-blue) !important;
  border-color: #c9dbf8;
  width: auto;
  padding: 0.42rem 0.85rem;
  border-radius: 10px;
  white-space: nowrap;
}

.ar-lib-btn--solid {
  background: var(--ar-blue);
  color: #fff !important;
  border-color: var(--ar-blue);
}

.ar-lib-btn--solid:hover { background: var(--ar-blue-bright); }
.ar-lib-btn--ghost:hover,
.ar-lib-btn--outline:hover { background: #f5f8fd; }

.ar-lib-btn--danger {
  background: #fff;
  color: #e11d48 !important;
  border-color: #fecdd3;
  width: auto;
  padding: 0.42rem 0.75rem;
}

.ar-lib-btn.is-disabled {
  pointer-events: none;
  opacity: 0.65;
  width: auto;
  padding: 0.42rem 0.85rem;
}

.ar-lib-main {
  display: grid;
  grid-template-columns: 1.45fr 0.9fr;
  gap: 1rem;
  margin-bottom: 1.15rem;
}

.ar-lib-section-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 0.35rem;
}

.ar-lib-section-head h2 { margin: 0; font-size: 22px; }
.ar-lib-section-head a,
.ar-lib-link { font-size: 14px; font-weight: 700; }

.ar-lib-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.85rem 1.1rem;
  border-bottom: 1px solid var(--ar-border);
  margin: 0.65rem 0 0.85rem;
}

.ar-lib-tabs button {
  background: none;
  border: 0;
  padding: 0.45rem 0;
  color: var(--ar-muted);
  font-weight: 700;
  font-size: 14px;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
  cursor: pointer;
  font-family: inherit;
}

.ar-lib-tabs button.is-active {
  color: var(--ar-blue);
  border-bottom-color: var(--ar-blue);
}

.ar-lib-task-panel { display: none; }
.ar-lib-task-panel.is-active { display: block; }

.ar-lib-task {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.7rem 0;
  border-bottom: 1px solid #f0f3f8;
}

.ar-lib-task:last-child { border-bottom: 0; }

.ar-lib-task__ico {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  color: #fff;
  flex-shrink: 0;
}
.ar-lib-task__ico.is-purple { background: #7c5cfc; }
.ar-lib-task__ico.is-green { background: #22c55e; }
.ar-lib-task__ico.is-yellow { background: #f59e0b; }
.ar-lib-task__ico.is-blue { background: #38bdf8; }

.ar-lib-task__body { flex: 1; min-width: 0; }
.ar-lib-task__body strong { display: block; color: var(--ar-navy); font-size: 14px; }
.ar-lib-task__body small { display: block; color: var(--ar-muted); font-size: 14px; }
.ar-lib-task__pts {
  display: inline-block;
  margin-top: 0.15rem;
  font-style: normal;
  font-size: 14px;
  font-weight: 800;
  color: var(--ar-blue);
}
.ar-lib-task__fail {
  display: block;
  margin-top: 0.2rem;
  color: #b45309;
  font-size: 14px;
}

.ar-lib-due {
  font-size: 14px;
  font-weight: 800;
  padding: 0.28rem 0.55rem;
  border-radius: 999px;
  white-space: nowrap;
}
.ar-lib-due.is-today,
.ar-lib-due.is-overdue { background: #fee2e2; color: #b91c1c; }
.ar-lib-due.is-soon { background: #ffedd5; color: #c2410c; }
.ar-lib-due.is-later { background: #dbeafe; color: #1d4ed8; }

.ar-lib-activity ul { list-style: none; margin: 0; padding: 0; }
.ar-lib-activity li {
  display: flex;
  align-items: flex-start;
  gap: 0.7rem;
  padding: 0.75rem 0;
  border-bottom: 1px solid #f0f3f8;
}
.ar-lib-activity li:last-child { border-bottom: 0; }
.ar-lib-activity__ico {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: #eef4ff;
  color: var(--ar-blue);
  display: grid;
  place-items: center;
  flex-shrink: 0;
}
.ar-lib-activity li div { flex: 1; min-width: 0; }
.ar-lib-activity strong { display: block; font-size: 14px; color: var(--ar-navy); }
.ar-lib-activity small { color: var(--ar-muted); font-size: 14px; }

.ar-lib-chip {
  font-size: 14px;
  font-weight: 800;
  padding: 0.28rem 0.55rem;
  border-radius: 999px;
  white-space: nowrap;
}
.ar-lib-chip.is-green { background: #dcfce7; color: #15803d; }
.ar-lib-chip.is-yellow { background: #fef3c7; color: #b45309; }
.ar-lib-chip.is-blue { background: #dbeafe; color: #1d4ed8; }

.ar-lib-banner {
  display: flex;
  align-items: center;
  gap: 0.9rem;
  background: #eaf3ff;
  border-radius: 16px;
  padding: 0.95rem 1.1rem;
  margin-bottom: 1.15rem;
}

.ar-lib-banner p {
  flex: 1;
  margin: 0;
  font-weight: 700;
  color: var(--ar-navy);
}

.ar-lib-banner .ar-lib-btn { width: auto; }
.ar-lib-banner__trophy {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: var(--ar-blue);
  color: #fff;
  display: grid;
  place-items: center;
  flex-shrink: 0;
}

.ar-lib-catalog__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(245px, 1fr));
  gap: 0.85rem;
}
.ar-lib-catalog__tools {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 180px;
  gap: 0.75rem;
  align-items: end;
  margin: 0.55rem 0 0.9rem;
}
.ar-lib-catalog__tools--single {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
}
.ar-lib-catalog__meta {
  color: var(--ar-muted);
  font-size: 14px;
  font-weight: 700;
}
.ar-lib-catalog .ar-lib-book[hidden] { display: none !important; }
#lib-catalog,
#lib-recommendations,
#lib-activity,
#lib-activity-full,
#lib-tasks,
#lib-tasks-all,
#lib-progress,
#lib-stats {
  scroll-margin-top: 96px;
}
#lib-catalog.is-anchor-flash,
#lib-recommendations.is-anchor-flash,
#lib-activity.is-anchor-flash,
#lib-activity-full.is-anchor-flash,
#lib-tasks.is-anchor-flash,
#lib-tasks-all.is-anchor-flash,
#lib-progress.is-anchor-flash,
#lib-stats.is-anchor-flash {
  animation: ar-lib-anchor-flash 1.3s ease;
}
@keyframes ar-lib-anchor-flash {
  0% { box-shadow: 0 0 0 0 rgba(37, 99, 235, 0.45); }
  35% { box-shadow: 0 0 0 6px rgba(37, 99, 235, 0.22); }
  100% { box-shadow: 0 0 0 0 rgba(37, 99, 235, 0); }
}
.ar-lib-detail__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 0.75rem;
}
.ar-lib-detail__item {
  display: flex;
  align-items: flex-start;
  gap: 0.7rem;
  padding: 0.85rem 0.9rem;
  border: 1px solid var(--ar-border);
  border-radius: 12px;
  background: #f8fafc;
}
.ar-lib-detail__item > .fa {
  width: 34px;
  height: 34px;
  border-radius: 10px;
  background: #e8f0fe;
  color: var(--ar-blue);
  display: grid;
  place-items: center;
  flex-shrink: 0;
}
.ar-lib-detail__item strong {
  display: block;
  font-size: 22px;
  color: var(--ar-navy);
  line-height: 1.2;
}
.ar-lib-detail__item span {
  display: block;
  margin-top: 0.15rem;
  font-size: 14px;
  color: var(--ar-muted);
}
.ar-lib-recommend-tag {
  display: inline-block;
  margin-top: 0.25rem;
  font-style: normal;
  font-size: 14px;
  font-weight: 700;
  color: #2563eb;
}

.ar-lib-book {
  display: flex;
  gap: 0.75rem;
  padding: 0.7rem;
  border: 1px solid var(--ar-border);
  border-radius: 14px;
  text-decoration: none !important;
  color: inherit;
}
.ar-lib-book:hover { background: #f7f9fc; }
.ar-lib-book--collection {
  border-color: #c7d7f5;
  background: #f8fbff;
}
.ar-lib-book.is-done { border-color: #bbf7d0; }
.ar-lib-book.is-now { border-color: #93c5fd; }
.ar-lib-collection-link {
  margin: 0.2rem 0 0.45rem;
  font-size: 14px;
  color: #64748b;
}
.ar-lib-collection-link a { font-weight: 700; }
.ar-lib-page--collection {
  max-width: 1120px;
}
.ar-lib-series__back {
  margin: 0 0 1.15rem;
}
.ar-lib-series__back a {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  color: #64748b !important;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none !important;
}
.ar-lib-series__back a:hover { color: #0f2744 !important; }
.ar-lib-series__back .fa { font-size: 13px; }
.ar-lib-series__hero {
  display: grid;
  grid-template-columns: 128px minmax(0, 1fr) 220px;
  gap: 1.5rem 1.75rem;
  align-items: start;
  background: #fff;
  border: 0;
  border-radius: 24px;
  box-shadow: 0 10px 30px rgba(15, 23, 42, 0.05);
  padding: 1.7rem 1.85rem 1.6rem;
  margin-bottom: 0.9rem;
}
.ar-lib-series__cover,
.ar-lib-series__cover img,
.ar-lib-series__cover-fallback {
  width: 128px;
  height: 128px;
  border-radius: 18px;
  object-fit: cover;
  background: #eef4ff;
  flex-shrink: 0;
  box-shadow: 0 10px 22px rgba(15, 23, 42, 0.1);
}
.ar-lib-series__cover-fallback {
  display: grid;
  place-items: center;
  color: #2563eb;
  font-size: 36px;
}
.ar-lib-series__intro { min-width: 0; padding-top: 0.15rem; }
.ar-lib-series__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  margin: 0 0 0.45rem;
  color: #94a3b8;
  font-size: 13px !important;
  font-weight: 600;
  letter-spacing: 0.01em;
}
.ar-lib-series__eyebrow .fa { font-size: 12px; }
.ar-lib-series__intro h1 {
  margin: 0;
  color: #0b1220;
  font-size: 30px;
  font-weight: 800;
  letter-spacing: -0.035em;
  line-height: 1.15;
}
.ar-lib-series__lead {
  margin: 0.55rem 0 0;
  max-width: 38rem;
  color: #64748b;
  font-size: 14px;
  line-height: 1.55;
}
.ar-lib-series__progress {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.75rem;
  margin-top: 1.15rem;
  max-width: 36rem;
  color: #64748b;
  font-size: 13px;
  font-weight: 600;
}
.ar-lib-series__progress strong {
  color: #0f2744;
  font-size: 13px;
}
.ar-lib-series__progress .ar-lib-bar {
  height: 6px;
  background: #e8eef6;
}
.ar-lib-series__progress .ar-lib-bar span {
  background: #3b82f6;
}
.ar-lib-series__stats {
  list-style: none;
  margin: 0.15rem 0 0;
  padding: 0;
  display: grid;
  gap: 1.05rem;
}
.ar-lib-series__stats li {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}
.ar-lib-series__stats li > div {
  display: flex;
  flex-direction: column;
  gap: 0.12rem;
}
.ar-lib-series__stat-ico {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: #eef4ff;
  color: #3b82f6;
  display: grid;
  place-items: center;
  flex-shrink: 0;
  font-size: 15px;
}
.ar-lib-series__stats strong {
  display: block;
  color: #0f172a;
  font-size: 14px;
  font-weight: 800;
  line-height: 1.2;
}
.ar-lib-series__stats small {
  display: block;
  margin: 0;
  color: #94a3b8;
  font-size: 13px !important;
  font-weight: 600;
  line-height: 1.25;
}
.ar-lib-series__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.7rem;
}
.ar-lib-series__row {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr) 110px auto 14px;
  align-items: center;
  gap: 0.95rem 1.05rem;
  background: #fff;
  border: 0;
  border-radius: 20px;
  box-shadow: 0 8px 22px rgba(15, 23, 42, 0.035);
  padding: 1.05rem 1.2rem;
  text-decoration: none !important;
  color: inherit;
}
a.ar-lib-series__row:hover {
  border-color: #dbe7f8;
  box-shadow: 0 10px 24px rgba(37, 99, 235, 0.08);
}
.ar-lib-series__num {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: #f1f5f9;
  color: #64748b;
  display: grid;
  place-items: center;
  font-size: 14px;
  font-weight: 800;
}
.ar-lib-series__row.is-current .ar-lib-series__num {
  background: #3b82f6;
  color: #fff;
  box-shadow: 0 6px 14px rgba(59, 130, 246, 0.28);
}
.ar-lib-series__row.is-done .ar-lib-series__num {
  background: #dcfce7;
  color: #15803d;
}
.ar-lib-series__body { min-width: 0; }
.ar-lib-series__body h2 {
  margin: 0;
  color: #0f172a;
  font-size: 15px;
  font-weight: 800;
  line-height: 1.35;
  letter-spacing: -0.015em;
}
.ar-lib-series__body h2 span {
  color: #94a3b8;
  font-weight: 700;
  margin-right: 0.35rem;
}
.ar-lib-series__body p {
  margin: 0.2rem 0 0;
  color: #94a3b8;
  font-size: 13px;
  line-height: 1.45;
}
.ar-lib-series__status {
  color: #94a3b8;
  font-size: 13px;
  font-weight: 700;
  white-space: nowrap;
  text-align: right;
}
.ar-lib-series__status .fa {
  margin-right: 0.28rem;
}
.ar-lib-series__row.is-done .ar-lib-series__status {
  color: #16a34a;
}
.ar-lib-series__meta {
  display: inline-flex;
  align-items: center;
  gap: 1rem;
  color: #94a3b8;
  font-size: 13px;
  font-weight: 600;
  white-space: nowrap;
}
.ar-lib-series__meta .fa {
  margin-right: 0.28rem;
}
.ar-lib-series__go {
  color: #cbd5e1;
  font-size: 20px;
  justify-self: end;
}
.ar-lib-series__row.is-locked {
  cursor: default;
  opacity: 0.92;
}
.ar-lib-series__row.is-locked .ar-lib-series__body h2 {
  color: #334155;
}
.ar-lib-collection-picker {
  margin: 1rem 0;
  border: 1px solid var(--ar-border);
  border-radius: 14px;
  background: #f8fafc;
  padding: 0.85rem 1rem;
}
.ar-lib-collection-picker header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 0.55rem;
}
.ar-lib-collection-picker header input[type="search"] {
  max-width: 240px;
  border: 1px solid #d7deea;
  border-radius: 10px;
  padding: 0.4rem 0.7rem;
  font-size: 14px;
}
.ar-lib-collection-picker__list {
  max-height: 380px;
  overflow: auto;
  display: grid;
  gap: 0.35rem;
}
.ar-lib-collection-picker__row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) 72px;
  gap: 0.65rem;
  align-items: center;
  margin: 0;
  padding: 0.45rem 0.55rem;
  background: #fff;
  border: 1px solid #e8eef5;
  border-radius: 10px;
  font-weight: 500;
}
.ar-lib-collection-picker__row strong { display: block; color: #0f2744; font-size: 14px; }
.ar-lib-collection-picker__row small { color: #64748b; font-size: 13px; }
.ar-lib-collection-picker__row input[type="number"] {
  width: 72px;
  margin: 0;
  padding: 0.3rem 0.4rem;
}

.ar-lib-colform {
  background: #fff;
  border: 0;
  border-radius: 24px;
  box-shadow: 0 10px 30px rgba(15, 23, 42, 0.05);
  padding: 1.35rem 1.45rem 1.25rem;
  margin-bottom: 1.15rem;
}
.ar-lib-colform__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1.25rem;
}
.ar-lib-colform__head > div:first-child {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
}
.ar-lib-colform__mark {
  width: 36px;
  height: 36px;
  border-radius: 10px;
  background: #eef4ff;
  color: #3b82f6;
  display: grid;
  place-items: center;
  flex-shrink: 0;
}
.ar-lib-colform__head h3 {
  margin: 0;
  font-size: 20px;
  font-weight: 800;
  color: #0f172a;
}
.ar-lib-colform__head p {
  margin: 0.2rem 0 0;
  color: #94a3b8;
  font-size: 13px;
  max-width: 40rem;
}
.ar-lib-colform__cancel {
  display: inline-flex;
  align-items: center;
  height: 38px;
  padding: 0 1rem;
  border: 1px solid #e2e8f0;
  border-radius: 999px;
  background: #fff;
  color: #334155 !important;
  font-size: 14px;
  font-weight: 700;
  text-decoration: none !important;
}
.ar-lib-colform__cancel:hover { background: #f8fafc; }
.ar-lib-colform__top {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 260px;
  gap: 1.15rem 1.4rem;
  align-items: start;
}
.ar-lib-colform__pair {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.9rem;
}
.ar-lib-colform__label {
  display: block;
  margin: 0 0 0.85rem;
  color: #0f172a;
  font-size: 13px;
  font-weight: 700;
}
.ar-lib-colform__label em {
  color: #ef4444;
  font-style: normal;
}
.ar-lib-colform__label input,
.ar-lib-colform__label select,
.ar-lib-colform__label textarea {
  display: block;
  width: 100%;
  margin-top: 0.4rem;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  background: #fff;
  padding: 0.7rem 0.85rem;
  font-size: 14px;
  font-weight: 500;
  color: #0f172a;
  box-shadow: none;
}
.ar-lib-colform__label small {
  display: block;
  margin-top: 0.35rem;
  color: #94a3b8;
  font-size: 12px !important;
  font-weight: 600;
}
.ar-lib-colform__count {
  display: block;
  margin-top: 0.3rem;
  color: #94a3b8;
  font-size: 12px !important;
  font-weight: 600;
  text-align: right;
}
.ar-lib-colform__label textarea {
  min-height: 96px;
  resize: vertical;
}
.ar-lib-colform__preview p {
  margin: 0 0 0.55rem;
  color: #64748b;
  font-size: 13px;
  font-weight: 700;
}
.ar-lib-colform__preview p .fa { margin-left: 0.25rem; color: #cbd5e1; }
.ar-lib-colform__preview-card {
  border: 1px solid #eef2f7;
  border-radius: 16px;
  background: #f8fafc;
  padding: 0.85rem;
}
.ar-lib-colform__preview-cover,
.ar-lib-colform__preview-cover img,
.ar-lib-colform__preview-empty {
  width: 100%;
  height: 92px;
  border-radius: 12px;
  object-fit: cover;
  background: #eef2f7;
  display: grid;
  place-items: center;
  color: #cbd5e1;
  font-size: 28px;
  margin-bottom: 0.7rem;
}
.ar-lib-colform__preview-card strong {
  display: block;
  color: #0f172a;
  font-size: 15px;
  line-height: 1.3;
}
.ar-lib-colform__preview-card small {
  display: block;
  margin-top: 0.25rem;
  color: #94a3b8;
  font-size: 13px !important;
  line-height: 1.4;
}
.ar-lib-colform__preview-card footer {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-top: 0.7rem;
  color: #94a3b8;
  font-size: 12px;
  font-weight: 700;
}
.ar-lib-colform__preview-card footer .fa { margin-right: 0.2rem; }
.ar-lib-colform__series {
  margin-top: 0.35rem;
}
.ar-lib-colform__series > header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 0.75rem;
}
.ar-lib-colform__series > header strong {
  display: block;
  color: #0f172a;
  font-size: 14px;
}
.ar-lib-colform__series > header strong .fa { color: #cbd5e1; margin-left: 0.25rem; }
.ar-lib-colform__series > header p {
  margin: 0.2rem 0 0;
  color: #94a3b8;
  font-size: 13px;
}
.ar-lib-colform__series-tools {
  display: flex;
  align-items: center;
  gap: 0.65rem;
}
.ar-lib-colform__search {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  min-width: 220px;
  height: 38px;
  padding: 0 0.8rem;
  border: 1px solid #e2e8f0;
  border-radius: 999px;
  background: #fff;
  color: #94a3b8;
  margin: 0;
}
.ar-lib-colform__search input {
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
  height: 36px;
  background: transparent;
  font-size: 13px;
  font-weight: 600;
}
.ar-lib-colform__sort {
  height: 38px;
  padding: 0 0.9rem;
  border: 0;
  background: transparent;
  color: #64748b;
  font-size: 13px;
  font-weight: 700;
  white-space: nowrap;
}
.ar-lib-colform__sort .fa { margin-right: 0.3rem; }
.ar-lib-colform__selected { display: grid; gap: 0.45rem; }
.ar-lib-colform__item,
.ar-lib-colform__pick {
  display: grid;
  grid-template-columns: 12px 32px 40px minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.75rem;
  width: 100%;
  padding: 0.55rem 0.7rem;
  border: 0;
  border-radius: 14px;
  background: #f8fafc;
  text-align: left;
  color: inherit;
}
.ar-lib-colform__pick { grid-template-columns: 40px minmax(0, 1fr) auto; cursor: pointer; }
.ar-lib-colform__item.is-dragging { opacity: 0.55; }
.ar-lib-colform__grip {
  width: 10px;
  height: 18px;
  background-image: radial-gradient(#cbd5e1 1.15px, transparent 1.2px);
  background-size: 5px 5px;
  cursor: grab;
}
.ar-lib-colform__num {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: #eef2f7;
  color: #64748b;
  display: grid;
  place-items: center;
  font-size: 12px;
  font-weight: 800;
}
.ar-lib-colform__thumb,
.ar-lib-colform__thumb img,
.ar-lib-colform__thumb-fallback {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  object-fit: cover;
  background: #e2e8f0;
  display: grid;
  place-items: center;
  color: #94a3b8;
}
.ar-lib-colform__copy { min-width: 0; }
.ar-lib-colform__copy strong {
  display: block;
  color: #0f172a;
  font-size: 14px;
  font-weight: 800;
  line-height: 1.3;
}
.ar-lib-colform__copy small {
  display: block;
  color: #94a3b8;
  font-size: 12px !important;
  font-weight: 600;
}
.ar-lib-colform__remove {
  width: 28px;
  height: 28px;
  border: 0;
  background: transparent;
  color: #94a3b8;
  font-size: 22px;
  line-height: 1;
}
.ar-lib-colform__hint {
  margin: 0.35rem 0;
  color: #94a3b8;
  font-size: 13px;
}
.ar-lib-colform__add {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  margin-top: 0.7rem;
  padding: 1.05rem 1rem;
  border: 1px dashed #dbe3ee;
  border-radius: 16px;
  background: #fff;
  color: #3b82f6;
  font-weight: 800;
}
.ar-lib-colform__add small {
  display: block;
  margin-top: 0.15rem;
  color: #94a3b8;
  font-size: 12px !important;
  font-weight: 600;
}
.ar-lib-colform__add.is-open { background: #f8fbff; }
.ar-lib-colform__catalog {
  display: none;
  gap: 0.4rem;
  margin-top: 0.55rem;
  max-height: 320px;
  overflow: auto;
}
.ar-lib-colform__catalog.is-open {
  display: grid;
}
.ar-lib-colform__save { margin-top: 1rem; }
.ar-lib-colform__save .ar-lib-btn {
  min-width: 220px;
  height: 44px;
  border-radius: 999px;
}
.ar-lib-colform__save .fa { margin-right: 0.4rem; }
.ar-lib-coltable__tools {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}
.ar-lib-coltable .ar-lib-table__resource img,
.ar-lib-coltable .ar-lib-cover-fallback--sm {
  width: 40px;
  height: 40px;
  border-radius: 10px;
}
.ar-lib-book small { color: var(--ar-blue); font-weight: 700; font-size: 14px; }
.ar-lib-book p { margin: 0.15rem 0 0; color: var(--ar-muted); font-size: 14px; }

.ar-lib-cover-fallback {
  width: 64px;
  height: 86px;
  border-radius: 8px;
  background: #e8eef6;
  color: var(--ar-blue);
  display: grid;
  place-items: center;
  font-size: 24px;
  flex-shrink: 0;
}
.ar-lib-cover-fallback.is-book { background: #e8eef6; color: #2563eb; }
.ar-lib-cover-fallback.is-pdf { background: #fee2e2; color: #dc2626; }
.ar-lib-cover-fallback.is-video { background: #ede9fe; color: #7c3aed; }
.ar-lib-cover-fallback.is-audio { background: #e0f2fe; color: #0369a1; }
.ar-lib-cover-fallback--lg { width: 92px; height: 124px; font-size: 32px; }
.ar-lib-bookview__info .ar-lib-type {
  display: inline-flex;
  margin: 0 0 0.45rem;
  font-size: 14px;
}
.ar-lib-catalog .ar-lib-type {
  display: block;
  margin: 0.15rem 0 0.25rem;
  font-size: 14px;
}
.ar-lib-media-player-wrap {
  margin-top: 1.1rem;
  max-width: 100%;
  width: 100%;
  box-sizing: border-box;
}
.ar-lib-media-player {
  display: block;
  width: 100% !important;
  max-width: 100% !important;
  border-radius: 12px;
  object-fit: contain;
}
audio.ar-lib-media-player {
  min-height: 54px;
  height: 54px !important;
  padding: 0.35rem 0.5rem;
  box-sizing: border-box;
}
.ar-lib-media-player-wrap video.ar-lib-media-player {
  height: auto !important;
  max-height: min(420px, 56vw);
  min-height: 200px;
}
.ar-lib-media-hint {
  margin: 0.55rem 0 0;
  color: #64748b;
  font-size: 14px;
  line-height: 1.45;
}
.ar-lib-bookview__hint--auto {
  margin-top: 0.75rem;
  color: #2563eb;
  font-weight: 600;
}
.ar-lib-bookview__main {
  min-width: 0;
}

.ar-lib-empty { color: var(--ar-muted); margin: 0.4rem 0 0.8rem; font-size: 14px; }
.ar-lib-back { margin: 0 0 0.85rem; }
.ar-lib-note { margin-top: 1rem; }

.ar-lib-flash {
  border-radius: 12px;
  padding: 0.75rem 1rem;
  margin-bottom: 1rem;
  font-weight: 600;
}
.ar-lib-flash--confirmation { background: #dcfce7; color: #166534; }
.ar-lib-flash--warning { background: #fef3c7; color: #92400e; }
.ar-lib-flash--error { background: #fee2e2; color: #991b1b; }

.ar-lib-form label {
  display: block;
  margin: 0.55rem 0;
  font-weight: 700;
  color: var(--ar-navy);
  font-size: 14px;
}
.ar-lib-form input,
.ar-lib-form select,
.ar-lib-form textarea {
  display: block;
  width: 100%;
  margin-top: 0.3rem;
  border: 1px solid var(--ar-border);
  border-radius: 10px;
  padding: 0.55rem 0.7rem;
  font-family: inherit;
}
.ar-lib-form small { display: block; margin-top: 0.25rem; font-weight: 500; color: var(--ar-muted); }
.ar-lib-optional {
  font-weight: 600;
  color: var(--ar-muted);
  font-size: 14px;
}
.ar-lib-cover-current {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin: 0.35rem 0 0.55rem;
  padding: 0.55rem 0.65rem;
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 12px;
  background: #f8fafc;
}
.ar-lib-cover-current img {
  width: 56px;
  height: 72px;
  object-fit: cover;
  border-radius: 8px;
  flex-shrink: 0;
}
.ar-lib-cover-current small {
  margin: 0;
  line-height: 1.35;
}
.ar-lib-form__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.75rem;
}
.ar-lib-field--youtube,
.ar-lib-field--cover {
  grid-column: 1 / -1;
}
.ar-lib-yt {
  position: relative;
  width: 100%;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
  border-radius: 14px;
  background: #0b1f3a;
}
.ar-lib-yt iframe,
.ar-lib-yt #ar-lib-yt-player {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
.ar-lib-check {
  display: flex !important;
  align-items: center;
  gap: 0.5rem;
  font-weight: 600 !important;
}
.ar-lib-check input { width: auto; margin: 0; }

.ar-lib-reader__head {
  display: flex;
  gap: 1rem;
  margin-bottom: 0.85rem;
}
.ar-lib-reader__desc { color: var(--ar-text); line-height: 1.55; }
.ar-lib-taskpage__meta { display: flex; gap: 0.6rem; align-items: center; margin-bottom: 0.75rem; }
.ar-lib-taskpage__desc { color: var(--ar-text); line-height: 1.55; }

/* Vista libro: 2 columnas */
.ar-lib-bookview {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(300px, 0.9fr);
  gap: 1.15rem;
  align-items: start;
}
.ar-lib-bookview__main,
.ar-lib-bookview__panel {
  margin: 0;
}
.ar-lib-bookview__intro {
  display: grid;
  grid-template-columns: 120px minmax(0, 1fr) minmax(180px, 220px);
  gap: 1.1rem;
  align-items: start;
}
.ar-lib-bookview__cover img,
.ar-lib-bookview__cover .ar-lib-cover-fallback {
  width: 120px;
  height: 160px;
  object-fit: cover;
  border-radius: 12px;
  display: flex;
  justify-content: center;
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.12);
}
.ar-lib-bookview__info .ar-lib-chip {
  margin-bottom: 0.55rem;
}
.ar-lib-bookview__info h1 {
  margin: 0 0 0.4rem;
  color: #0f2744;
  font-size: 24px;
  line-height: 1.25;
  font-weight: 800;
}
.ar-lib-bookview__progress {
  margin: 0.85rem 0 0.65rem;
}
.ar-lib-bookview__progress .ar-lib-bar {
  margin-bottom: 0.35rem;
}
.ar-lib-bookview__progress strong {
  color: #2563eb;
  font-size: 14px;
}
.ar-lib-bookview__facts {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.35rem;
}
.ar-lib-bookview__facts li {
  color: #6b7280;
  font-size: 14px;
}
.ar-lib-bookview__facts .fa {
  margin-right: 0.35rem;
  color: #93a4bd;
}
.ar-lib-bookview__summary {
  background: #eff6ff;
  border: 1px solid #dbeafe;
  border-radius: 14px;
  padding: 0.9rem 1rem;
}
.ar-lib-bookview__summary h2 {
  margin: 0 0 0.7rem !important;
  font-size: 14px !important;
  color: #1e3a5f !important;
}
.ar-lib-bookview__summary dl {
  margin: 0;
  display: grid;
  gap: 0.55rem;
}
.ar-lib-bookview__summary dl > div {
  display: flex;
  justify-content: space-between;
  gap: 0.75rem;
  align-items: baseline;
}
.ar-lib-bookview__summary dt {
  margin: 0;
  color: #64748b;
  font-size: 14px;
  font-weight: 500;
}
.ar-lib-bookview__summary dd {
  margin: 0;
  color: #0f2744;
  font-weight: 800;
  font-size: 14px;
}
.ar-lib-bookview__desc {
  margin: 1rem 0 0;
  color: #4b5563;
  line-height: 1.55;
}
.ar-lib-bookview__open {
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: 0.55rem;
  width: 100%;
  margin-top: 1.1rem;
  padding: 0.9rem 1rem;
  border-radius: 12px;
  background: #2563eb !important;
  color: #fff !important;
  font-weight: 750;
  text-decoration: none !important;
  box-sizing: border-box;
}
.ar-lib-bookview__open:hover {
  background: #1d4ed8 !important;
  color: #fff !important;
}

.ar-lib-bookview__side {
  display: grid;
  gap: 1rem;
}
.ar-lib-bookview__panel {
  padding: 1.15rem 1.2rem 1.2rem;
}
.ar-lib-bookview__panel-head {
  display: flex;
  gap: 0.75rem;
  align-items: flex-start;
  margin-bottom: 1rem;
}
.ar-lib-bookview__panel-head h2 {
  margin: 0 0 0.2rem !important;
  font-size: 22px !important;
  color: #0f2744 !important;
}
.ar-lib-bookview__panel-head p {
  margin: 0;
  color: #6b7280;
  font-size: 14px;
}
.ar-lib-bookview__panel-ico {
  width: 38px;
  height: 38px;
  border-radius: 11px;
  display: grid;
  place-items: center;
  color: #fff;
  flex-shrink: 0;
}
.ar-lib-bookview__panel-ico.is-blue { background: #2563eb; }
.ar-lib-bookview__panel-ico.is-purple { background: #7c5cfc; }
.ar-lib-bookview__hint {
  margin: 0.35rem 0 0.9rem;
  color: #9ca3af;
  font-size: 14px;
}
.ar-lib-bookview__save {
  display: block;
  width: 100%;
  border: 0;
  border-radius: 12px;
  padding: 0.85rem 1rem;
  background: #2563eb;
  color: #fff;
  font-weight: 750;
  cursor: pointer;
}
.ar-lib-bookview__save:hover { background: #1d4ed8; }

.ar-lib-bookview__tasks {
  display: grid;
  gap: 0.65rem;
}
.ar-lib-bookview__task {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.75rem 0.8rem;
  border: 1px solid #e8edf5;
  border-radius: 12px;
  background: #fafbff;
}
.ar-lib-bookview__task-body {
  flex: 1;
  min-width: 0;
}
.ar-lib-bookview__task-body strong {
  display: block;
  color: #0f2744;
  font-size: 14px;
  line-height: 1.3;
}
.ar-lib-bookview__task-body .ar-lib-task__pts {
  display: inline-block;
  margin-top: 0.2rem;
}
.ar-lib-bookview__task-body .ar-lib-due {
  display: block;
  margin-top: 0.25rem;
  font-size: 14px;
  padding: 5px 10px;
  width: fit-content;
}
#chatmain, .chatboxmain {
  display: none !important;
}
.ar-lib-bookview__task .ar-lib-btn {
  flex-shrink: 0;
  white-space: nowrap;
  line-height: 2;
}
.ar-lib-bookview__all {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  margin-top: 0.9rem;
  color: #2563eb !important;
  font-weight: 650;
  font-size: 14px;
  text-decoration: none !important;
}

@media (max-width: 1100px) {
  .ar-lib-bookview {
    grid-template-columns: 1fr;
  }
  .ar-lib-bookview__intro {
    grid-template-columns: 110px minmax(0, 1fr);
  }
  .ar-lib-bookview__summary {
    grid-column: 1 / -1;
  }
}
@media (max-width: 640px) {
  .ar-lib-bookview__intro {
    grid-template-columns: 1fr;
  }
  .ar-lib-bookview__cover img,
  .ar-lib-bookview__cover .ar-lib-cover-fallback {
    width: 100%;
    max-width: 180px;
    height: auto;
    aspect-ratio: 3 / 4;
  }
  .ar-lib-bookview__task {
    flex-wrap: wrap;
  }
  .ar-lib-bookview__task .ar-lib-btn {
    width: 100%;
    justify-content: center;
  }
}

.ar-lib-form--panel {
  background: #f8fafc;
  border: 1px solid var(--ar-border);
  border-radius: 16px;
  padding: 1.1rem 1.2rem;
  margin-bottom: 1.1rem;
}
.ar-lib-form__actions {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  margin-top: 0.5rem;
}

.ar-lib-admin-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1.2rem;
}
.ar-lib-admin-head__title {
  display: flex;
  align-items: flex-start;
  gap: 0.85rem;
}
.ar-lib-admin-head__icon {
  width: 52px;
  height: 52px;
  border-radius: 14px;
  background: var(--ar-yellow);
  color: var(--ar-navy);
  display: grid;
  place-items: center;
  font-size: 22px;
  flex-shrink: 0;
}
.ar-lib-admin-head h1 {
  margin: 0;
  font-size: 28px;
  font-weight: 800;
  color: var(--ar-navy);
}
.ar-lib-admin-head p {
  margin: 0.2rem 0 0;
  color: var(--ar-muted);
  font-size: 14px;
}
.ar-lib-admin-head__actions {
  display: flex;
  align-items: center;
  gap: 0.85rem;
}
.ar-lib-btn-ghost {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.55rem 0.9rem;
  border-radius: 12px;
  border: 1px solid var(--ar-border);
  background: #fff;
  color: var(--ar-navy) !important;
  font-weight: 650;
  text-decoration: none !important;
}
.ar-lib-btn-ghost:hover { background: #f8fafc; }

.ar-lib-kpi {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0.85rem;
  margin-bottom: 1.15rem;
}
.ar-lib-kpi article {
  background: #fff;
  border: 1px solid var(--ar-border);
  border-radius: 16px;
  box-shadow: var(--ar-shadow);
  padding: 1rem 1.05rem;
  display: flex;
  gap: 0.8rem;
  align-items: flex-start;
}
.ar-lib-kpi small {
  display: block;
  color: var(--ar-muted);
  font-size: 14px;
  font-weight: 650;
}
.ar-lib-kpi strong {
  display: block;
  font-size: 28px;
  color: var(--ar-navy);
  line-height: 1.1;
  margin: 0.15rem 0;
  font-weight: 800;
}
.ar-lib-kpi em {
  font-style: normal;
  font-size: 14px;
  font-weight: 700;
}
.ar-lib-kpi em.is-up { color: #16a34a; }
.ar-lib-kpi em.is-down { color: #dc2626; }
.ar-lib-kpi em.is-dot::before {
  content: "";
  display: inline-block;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  margin-right: 0.35rem;
  vertical-align: middle;
}
.ar-lib-kpi em.is-ok { color: #16a34a; }
.ar-lib-kpi em.is-ok::before { background: #16a34a; }
.ar-lib-kpi em.is-info { color: #2563eb; }
.ar-lib-kpi em.is-info::before { background: #2563eb; }
.ar-lib-kpi em.fa {
  font-style: normal;
  color: inherit;
  font-size: inherit;
  font-weight: inherit;
}
.ar-lib-kpi__ico {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  flex-shrink: 0;
  font-size: 16px;
}
.ar-lib-kpi__ico.is-blue { background: #e8f1ff; color: #2563eb; }
.ar-lib-kpi__ico.is-green { background: #dcfce7; color: #16a34a; }
.ar-lib-kpi__ico.is-purple { background: #ede9fe; color: #7c3aed; }
.ar-lib-kpi__ico.is-orange { background: #fef3c7; color: #d97706; }

.ar-lib-board {
  background: #fff;
  border: 1px solid var(--ar-border);
  border-radius: 20px;
  box-shadow: var(--ar-shadow);
  padding: 0.35rem 1.15rem 1.15rem;
}
.ar-lib-board__tabs {
  display: flex;
  gap: 0.35rem 1.4rem;
  border-bottom: 1px solid var(--ar-border);
  margin-bottom: 1rem;
  padding-bottom: 1px;
  overflow-x: auto;
}
.ar-lib-board__tabs a {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  padding: 0.95rem 0 0.75rem;
  font-size: 14px;
  color: var(--ar-muted) !important;
  font-weight: 650;
  text-decoration: none !important;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
  white-space: nowrap;
}
.ar-lib-board__tabs a em { font-size: 14px; opacity: 0.85; }
.ar-lib-board__tabs a.is-active {
  color: #2563eb !important;
  border-bottom-color: #2563eb;
}
.ar-lib-board__subtitle {
  margin: 1.2rem 0 0.6rem;
  color: var(--ar-navy);
  font-size: 16px;
}

.ar-lib-panel {
  border: 1px solid #e8edf5;
  border-radius: 16px;
  background: #fff;
  padding: 1rem 1.05rem 1.05rem;
  margin-bottom: 1rem;
}
.ar-lib-panel__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 0.95rem;
  flex-wrap: wrap;
}
.ar-lib-panel__head h2 {
  margin: 0;
  font-size: 18px;
  font-weight: 800;
  color: var(--ar-navy);
}
.ar-lib-panel__head p {
  margin: 0.25rem 0 0;
  color: var(--ar-muted);
  font-size: 14px;
}
.ar-lib-panel__tools {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  flex-wrap: wrap;
}

.ar-lib-admin-layout {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1rem;
  align-items: start;
}
.ar-lib-admin-layout.has-side {
  grid-template-columns: minmax(0, 1fr) minmax(280px, 320px);
}
.ar-lib-admin-main { min-width: 0; }
.ar-lib-admin-side {
  display: grid;
  gap: 0.85rem;
  position: sticky;
  top: 1rem;
}

.ar-lib-avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: inline-grid;
  place-items: center;
  font-size: 14px;
  font-weight: 800;
  color: #fff;
  flex-shrink: 0;
  letter-spacing: 0.02em;
}
.ar-lib-avatar--lg {
  width: 52px;
  height: 52px;
  font-size: 14px;
}
.ar-lib-avatar.tone-1 { background: #2563eb; }
.ar-lib-avatar.tone-2 { background: #0d9488; }
.ar-lib-avatar.tone-3 { background: #7c3aed; }
.ar-lib-avatar.tone-4 { background: #db2777; }
.ar-lib-avatar.tone-5 { background: #ea580c; }
.ar-lib-avatar.tone-6 { background: #0284c7; }

.ar-lib-person {
  display: inline-flex;
  align-items: center;
  gap: 0.65rem;
  border: 0;
  background: transparent;
  padding: 0;
  text-align: left;
  cursor: pointer;
  color: inherit;
  font: inherit;
  max-width: 100%;
}
.ar-lib-person.is-static { cursor: default; }
.ar-lib-person__meta {
  display: grid;
  gap: 0.1rem;
  min-width: 0;
}
.ar-lib-person__meta strong {
  color: var(--ar-navy);
  font-weight: 750;
  line-height: 1.25;
}

.ar-lib-pill {
  display: inline-flex;
  align-items: center;
  padding: 0.22rem 0.65rem;
  border-radius: 999px;
  font-size: 14px;
  font-weight: 750;
  line-height: 1.2;
}
.ar-lib-pill.is-ok { background: #dcfce7; color: #166534; }
.ar-lib-pill.is-warn { background: #ffedd5; color: #c2410c; }
.ar-lib-pill.is-bad { background: #fee2e2; color: #b91c1c; }
.ar-lib-pill.is-muted { background: #eef2f7; color: #64748b; }

.ar-lib-icon-btn {
  width: 34px;
  height: 34px;
  border-radius: 10px;
  border: 1px solid #e5eaf2;
  background: #fff;
  color: #64748b;
  display: inline-grid;
  place-items: center;
  cursor: pointer;
}
.ar-lib-icon-btn:hover {
  color: #2563eb;
  border-color: #bfdbfe;
  background: #eff6ff;
}

.ar-lib-table--admin th.is-num,
.ar-lib-table--admin td.is-num {
  text-align: center;
  white-space: nowrap;
}
.ar-lib-table--admin th.is-actions,
.ar-lib-table--admin td.is-actions {
  text-align: right;
  width: 1%;
  white-space: nowrap;
}

.ar-lib-side-card {
  border: 1px solid #e8edf5;
  border-radius: 16px;
  background: #fff;
  padding: 1rem;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.05);
  position: relative;
}
.ar-lib-side-card__close {
  position: absolute;
  top: 0.75rem;
  right: 0.75rem;
  width: 30px;
  height: 30px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: #94a3b8;
  cursor: pointer;
}
.ar-lib-side-card__close:hover { background: #f1f5f9; color: #0f172a; }
.ar-lib-side-card__profile {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding-right: 1.8rem;
  margin-bottom: 0.85rem;
}
.ar-lib-side-card__profile strong {
  display: block;
  color: var(--ar-navy);
  font-size: 14px;
  font-weight: 800;
}
.ar-lib-side-card__profile span {
  color: var(--ar-muted);
  font-size: 14px;
}
.ar-lib-side-card__tabs {
  display: flex;
  gap: 0.85rem;
  border-bottom: 1px solid #e8edf5;
  margin-bottom: 0.85rem;
}
.ar-lib-side-card__tabs span {
  padding: 0.45rem 0 0.55rem;
  font-size: 14px;
  font-weight: 700;
  color: #94a3b8;
  border-bottom: 2px solid transparent;
}
.ar-lib-side-card__tabs span.is-active {
  color: #2563eb;
  border-bottom-color: #2563eb;
}
.ar-lib-side-stats {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.65rem;
}
.ar-lib-side-stats article {
  display: flex;
  gap: 0.55rem;
  align-items: flex-start;
  padding: 0.65rem;
  border: 1px solid #eef2f7;
  border-radius: 12px;
  background: #f8fafc;
}
.ar-lib-side-stats small {
  display: block;
  color: var(--ar-muted);
  font-size: 14px;
  font-weight: 650;
  line-height: 1.25;
}
.ar-lib-side-stats strong {
  display: block;
  margin-top: 0.15rem;
  color: var(--ar-navy);
  font-size: 14px;
  font-weight: 800;
}
.ar-lib-side-stats__ico {
  width: 28px;
  height: 28px;
  border-radius: 8px;
  display: grid;
  place-items: center;
  flex-shrink: 0;
  font-size: 14px;
}
.ar-lib-side-stats__ico.is-blue { background: #e8f1ff; color: #2563eb; }
.ar-lib-side-stats__ico.is-green { background: #dcfce7; color: #16a34a; }
.ar-lib-side-stats__ico.is-purple { background: #ede9fe; color: #7c3aed; }
.ar-lib-side-stats__ico.is-orange { background: #fef3c7; color: #d97706; }
.ar-lib-side-card__foot {
  margin-top: 0.85rem;
  padding-top: 0.75rem;
  border-top: 1px solid #eef2f7;
}
.ar-lib-side-card__foot small {
  display: block;
  color: var(--ar-muted);
  font-size: 14px;
  font-weight: 650;
}
.ar-lib-side-card__foot strong {
  display: block;
  margin-top: 0.2rem;
  color: var(--ar-navy);
  font-size: 14px;
}
.ar-lib-side-card h3 {
  margin: 0 0 0.35rem;
  color: var(--ar-navy);
  font-size: 14px;
  font-weight: 800;
}
.ar-lib-side-card__hint {
  margin: 0 0 0.85rem;
  color: var(--ar-muted);
  font-size: 14px;
}
.ar-lib-side-card .ar-lib-override {
  display: grid;
  gap: 0.7rem;
}
.ar-lib-side-card .ar-lib-override label {
  display: grid;
  gap: 0.3rem;
  font-size: 14px;
  font-weight: 700;
  color: var(--ar-navy);
}
.ar-lib-side-card .ar-lib-override input[type="number"],
.ar-lib-side-card .ar-lib-override input[type="text"] {
  width: 100%;
  border: 1px solid #dbe3ef;
  border-radius: 10px;
  padding: 0.55rem 0.7rem;
  font: inherit;
}
.ar-lib-side-card .ar-lib-override .ar-btn-yellow {
  width: 100%;
  justify-content: center;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
}
.ar-lib-side-card .ar-lib-override .ar-btn-yellow:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}

.ar-lib-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.85rem;
  flex-wrap: wrap;
  margin-bottom: 0.9rem;
}
.ar-lib-toolbar__filters {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
  margin-left: auto;
}
.ar-lib-filters {
  display: grid;
  grid-template-columns: minmax(200px, 1.4fr) repeat(3, minmax(140px, 1fr)) auto;
  align-items: end;
  gap: 0.65rem 0.75rem;
  margin: 0 0 1rem;
  padding: 0.85rem 1rem;
  background: #f5f8fd;
  border: 1px solid #e2e8f4;
  border-radius: 14px;
}
.ar-lib-filters__field {
  display: flex;
  flex-direction: column;
  gap: 0.28rem;
  margin: 0;
  min-width: 0;
}
.ar-lib-filters__label {
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: var(--ar-muted);
}
.ar-lib-filters .ar-lib-search {
  align-self: end;
}
.ar-lib-search {
  position: relative;
  display: block;
  margin: 0;
}
.ar-lib-search .fa {
  position: absolute;
  left: 0.75rem;
  top: 50%;
  transform: translateY(-50%);
  color: #94a3b8;
  pointer-events: none;
}
.ar-lib-search input,
.ar-lib-toolbar select,
.ar-lib-filters select,
.ar-lib-catalog__tools select {
  width: 100%;
  border: 1px solid #d7deea;
  border-radius: 10px;
  padding: 0.55rem 0.8rem;
  font-size: 14px;
  font-family: inherit;
  color: var(--ar-navy);
  background: #fff;
  box-shadow: 0 1px 0 rgba(15, 23, 42, 0.02);
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.ar-lib-search input:focus,
.ar-lib-toolbar select:focus,
.ar-lib-filters select:focus,
.ar-lib-catalog__tools select:focus {
  outline: none;
  border-color: #93c5fd;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.15);
}
.ar-lib-search input {
  padding-left: 2.15rem;
  min-width: 0;
}
.ar-lib-filters__actions {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  flex-wrap: wrap;
  padding-bottom: 1px;
}
.ar-lib-filters__submit {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  border: 0;
  border-radius: 10px;
  padding: 0.55rem 0.95rem;
  background: var(--ar-navy, #1e3a5f);
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  font-family: inherit;
  cursor: pointer;
  white-space: nowrap;
}
.ar-lib-filters__submit:hover {
  filter: brightness(1.08);
}
.ar-lib-filters__clear {
  font-size: 14px;
  font-weight: 700;
  color: #2563eb;
  text-decoration: none !important;
  white-space: nowrap;
}
.ar-lib-filters__clear:hover {
  text-decoration: underline !important;
}
@media (max-width: 1100px) {
  .ar-lib-filters {
    grid-template-columns: 1fr 1fr;
  }
  .ar-lib-filters .ar-lib-search {
    grid-column: 1 / -1;
  }
  .ar-lib-filters__actions {
    grid-column: 1 / -1;
  }
}
@media (max-width: 640px) {
  .ar-lib-filters {
    grid-template-columns: 1fr;
  }
}

.ar-lib-table-wrap { overflow-x: auto; }
.ar-lib-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;
}
.ar-lib-table th {
  text-align: left;
  font-size: 14px;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: var(--ar-navy);
  background: #f3f7ff;
  padding: 0.7rem 0.65rem;
  white-space: nowrap;
}
.ar-lib-table td {
  padding: 0.85rem 0.65rem;
  border-bottom: 1px solid #f0f3f8;
  vertical-align: middle;
  color: var(--ar-text);
}
.ar-lib-table .is-check { width: 32px; }
.ar-lib-table__resource {
  display: flex;
  gap: 0.7rem;
  align-items: center;
  min-width: 220px;
}
.ar-lib-table__resource img,
.ar-lib-cover-fallback--sm {
  width: 40px;
  height: 52px;
  border-radius: 6px;
  object-fit: cover;
  flex-shrink: 0;
}
.ar-lib-cover-fallback--sm { font-size: 16px; }
.ar-lib-table__resource strong { display: block; color: var(--ar-navy); }
.ar-lib-table__resource small { color: var(--ar-muted); font-size: 14px; }

.ar-lib-type {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-weight: 700;
  font-size: 14px;
}
.ar-lib-type.is-book { color: #2563eb; }
.ar-lib-type.is-pdf { color: #dc2626; }
.ar-lib-type.is-video { color: #7c3aed; }
.ar-lib-type.is-audio { color: var(--ar-navy); }

.ar-lib-cat { display: inline-flex; align-items: center; gap: 0.4rem; }
.ar-lib-cat i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #94a3b8;
}
.ar-lib-cat.is-blue i { background: #2563eb; }
.ar-lib-cat.is-purple i { background: #7c3aed; }
.ar-lib-cat.is-green i { background: #16a34a; }
.ar-lib-cat.is-orange i { background: #ea580c; }
.ar-lib-cat.is-pink i { background: #e11d48; }
.ar-lib-cat.is-navy i { background: var(--ar-navy); }
.ar-lib-cat.is-yellow i { background: #eab308; }
.ar-lib-cat.is-gray i { background: #64748b; }

.ar-lib-status {
  display: inline-block;
  padding: 0.22rem 0.6rem;
  border-radius: 999px;
  font-size: 14px;
  font-weight: 800;
}
.ar-lib-status.is-published { background: #dcfce7; color: #166534; }
.ar-lib-status.is-draft { background: #ffedd5; color: #c2410c; }

.ar-lib-mini-progress {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  min-width: 110px;
  font-weight: 700;
  color: var(--ar-navy);
}
.ar-lib-mini-progress span {
  flex: 1;
  height: 6px;
  background: #e8eef6;
  border-radius: 999px;
  overflow: hidden;
}
.ar-lib-mini-progress b {
  display: block;
  height: 100%;
  background: #22c55e;
}

.ar-lib-actions {
  display: flex;
  gap: 0.3rem;
  align-items: center;
}
.ar-lib-actions form { margin: 0; }
.ar-lib-actions a,
.ar-lib-actions button {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  border: 1px solid var(--ar-border);
  background: #fff;
  color: var(--ar-navy);
  display: grid;
  place-items: center;
  text-decoration: none !important;
  cursor: pointer;
}
.ar-lib-actions .is-danger { color: #e11d48; }
.ar-lib-muted { color: var(--ar-muted); margin-right: 0.25rem; }

.ar-lib-pager {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0.75rem;
  margin-top: 0.9rem;
  color: var(--ar-muted);
  font-size: 14px;
}
.ar-lib-pager nav { display: flex; gap: 0.3rem; }
.ar-lib-pager a {
  min-width: 32px;
  height: 32px;
  border-radius: 8px;
  display: grid;
  place-items: center;
  text-decoration: none !important;
  color: var(--ar-navy) !important;
  border: 1px solid var(--ar-border);
  padding: 0 0.4rem;
  font-weight: 700;
}
.ar-lib-pager a.is-active {
  background: var(--ar-navy);
  border-color: var(--ar-navy);
  color: #fff !important;
}
.ar-lib-pager button {
  min-width: 32px;
  height: 32px;
  border-radius: 8px;
  display: grid;
  place-items: center;
  color: var(--ar-navy);
  border: 1px solid var(--ar-border);
  padding: 0 0.4rem;
  font-weight: 700;
  font-family: inherit;
  background: #fff;
  cursor: pointer;
}
.ar-lib-pager button.is-active {
  background: var(--ar-navy);
  border-color: var(--ar-navy);
  color: #fff;
}
.ar-lib-pager button:disabled {
  opacity: 0.4;
  cursor: default;
}

.ar-lib-report {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0.75rem;
  margin: 0.5rem 0 1rem;
}
.ar-lib-report article {
  background: #f8fafc;
  border-radius: 14px;
  padding: 0.9rem 1rem;
}
.ar-lib-report small { color: var(--ar-muted); font-size: 14px; }
.ar-lib-report strong { display: block; font-size: 24px; color: var(--ar-navy); }
.ar-lib-report em { font-style: normal; color: var(--ar-muted); font-size: 14px; }

.ar-lib-admin-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0.75rem;
  margin-bottom: 1rem;
}
.ar-lib-admin-stats article {
  background: #fff;
  border: 1px solid var(--ar-border);
  border-radius: 16px;
  padding: 0.9rem 1rem;
  box-shadow: var(--ar-shadow);
}
.ar-lib-admin-stats span { color: var(--ar-muted); font-size: 14px; }
.ar-lib-admin-stats strong { display: block; font-size: 22px; color: var(--ar-navy); }

.ar-lib-admin-tabs {
  display: flex;
  gap: 0.5rem;
  margin-bottom: 1rem;
}
.ar-lib-admin-tabs a {
  padding: 0.45rem 0.9rem;
  border-radius: 999px;
  font-weight: 700;
  background: #fff;
  border: 1px solid var(--ar-border);
  text-decoration: none !important;
  color: var(--ar-navy) !important;
}
.ar-lib-admin-tabs a.is-active {
  background: var(--ar-blue);
  border-color: var(--ar-blue);
  color: #fff !important;
}

.ar-lib-admin-grid {
  display: grid;
  grid-template-columns: 0.9fr 1.1fr;
  gap: 1rem;
}

.ar-lib-admin-row {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.7rem 0;
  border-bottom: 1px solid #f0f3f8;
}
.ar-lib-admin-row:last-child { border-bottom: 0; }
.ar-lib-admin-row > div { flex: 1; min-width: 0; }
.ar-lib-admin-row strong { display: block; }
.ar-lib-admin-row small { color: var(--ar-muted); }
.ar-lib-admin-row form { margin: 0; }
.ar-lib-answer {
  margin: 0.4rem 0 0;
  font-size: 14px;
  color: var(--ar-text);
}

/* Cuestionario admin (mockup) */
.ar-lib-quiz-builder {
  margin: 1.35rem 0 1.1rem;
  padding: 0;
  border: 0;
  background: transparent;
}
.ar-lib-quiz-builder__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
}
.ar-lib-quiz-builder__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  justify-content: flex-end;
}
.ar-lib-quiz-builder__add.is-open {
  border-color: #0f766e;
  color: #0f766e;
}
.ar-lib-assign-box {
  margin: 1rem 0 1.25rem;
  padding: 1rem 1.1rem;
  border: 1px solid var(--ar-border, #e5e7eb);
  border-radius: 14px;
  background: #f8fafc;
}
.ar-lib-assign-box h4 { margin: 0 0 0.35rem; color: var(--ar-navy, #0b1f3a); }
.ar-lib-assign-box > p { margin: 0 0 0.85rem; color: #64748b; font-size: 14px; }
.ar-lib-assign-puestos__label {
  display: block;
  margin-bottom: 0.4rem;
  font-weight: 700;
  color: var(--ar-navy, #0b1f3a);
}
.ar-lib-assign-puestos__list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 0.35rem 0.75rem;
  margin-bottom: 0.85rem;
  max-height: 180px;
  overflow: auto;
  padding: 0.55rem 0.65rem;
  background: #fff;
  border: 1px solid var(--ar-border, #e5e7eb);
  border-radius: 10px;
}
.ar-lib-qblock.is-open-q {
  border-color: #99f6e4;
  background: #f0fdfa;
}
.ar-lib-qblock__rubric,
.ar-lib-qblock__max {
  display: grid;
  gap: 0.3rem;
  margin: 0.65rem 0 0;
  font-size: 14px;
  font-weight: 650;
  color: #0f766e;
}
.ar-lib-quiz-open textarea {
  width: 100%;
  min-height: 120px;
  border: 1px solid var(--ar-border, #e5e7eb);
  border-radius: 12px;
  padding: 0.75rem 0.9rem;
  font: inherit;
  resize: vertical;
}
.ar-lib-override {
  display: grid;
  gap: 0.35rem;
  padding: 0.55rem;
  background: #f8fafc;
  border-radius: 10px;
  border: 1px solid #e5e7eb;
}
.ar-lib-override label { margin: 0; font-size: 14px; }
.ar-lib-quiz-builder__head h4 {
  margin: 0 0 0.35rem;
  color: #1f2937;
  font-size: 18px;
  font-weight: 750;
  font-family: var(--ar-font);
}
.ar-lib-quiz-builder__head p {
  margin: 0;
  max-width: 42rem;
  color: #6b7280;
  font-size: 14px;
  line-height: 1.45;
}
.ar-lib-quiz-builder__add {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  padding: 0.55rem 0.95rem;
  border: 1.5px solid #3b82f6;
  border-radius: 10px;
  background: #fff;
  color: #2563eb;
  font-weight: 700;
  font-size: 14px;
  cursor: pointer;
  transition: background 0.15s ease, box-shadow 0.15s ease;
}
.ar-lib-quiz-builder__add:hover {
  background: #eff6ff;
  box-shadow: 0 2px 8px rgba(37, 99, 235, 0.12);
}
.ar-lib-quiz-builder__list {
  display: grid;
  gap: 1rem;
}

.ar-lib-qblock {
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 16px;
  padding: 1.1rem 1.2rem 0.95rem;
  box-shadow: 0 4px 16px rgba(15, 23, 42, 0.05);
}
.ar-lib-qblock__top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 0.85rem;
}
.ar-lib-qblock__title {
  display: flex;
  align-items: center;
  gap: 0.65rem;
}
.ar-lib-qblock__num {
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  border-radius: 999px;
  border: 2px solid #3b82f6;
  color: #2563eb;
  font-weight: 800;
  font-size: 14px;
  background: #fff;
}
.ar-lib-qblock__title strong {
  color: #111827;
  font-size: 14px;
}
.ar-lib-qblock__remove {
  width: 36px;
  height: 36px;
  border: 0;
  border-radius: 10px;
  background: #fee2e2;
  color: #dc2626;
  cursor: pointer;
  display: grid;
  place-items: center;
  transition: background 0.15s ease;
}
.ar-lib-qblock__remove:hover {
  background: #fecaca;
}
.ar-lib-qblock__question {
  width: 100%;
  box-sizing: border-box;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  padding: 0.8rem 0.95rem;
  font-size: 14px;
  color: #111827;
  background: #fff;
  margin-bottom: 0.85rem;
  box-shadow: none !important;
}
.ar-lib-qblock__question:focus {
  border-color: #3b82f6;
  outline: none;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.15) !important;
}

.ar-lib-qblock__opts {
  display: grid;
  gap: 0.55rem;
}
.ar-lib-qopt {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 0.65rem;
  align-items: center;
  padding: 0.35rem 0.2rem;
}
.ar-lib-qopt__radio {
  position: relative;
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  cursor: pointer;
}
.ar-lib-qopt__radio input {
  position: absolute;
  opacity: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  cursor: pointer;
}
.ar-lib-qopt__dot {
  width: 20px;
  height: 20px;
  border-radius: 999px;
  border: 2px solid #d1d5db;
  background: #fff;
  box-sizing: border-box;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.ar-lib-qopt__radio input:checked + .ar-lib-qopt__dot {
  border-color: #2563eb;
  box-shadow: inset 0 0 0 5px #2563eb;
}
.ar-lib-qopt__input {
  width: 100%;
  box-sizing: border-box;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  padding: 0.72rem 0.9rem;
  font-size: 14px;
  background: #fff;
  box-shadow: none !important;
}
.ar-lib-qopt__input:focus {
  border-color: #3b82f6;
  outline: none;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.12) !important;
}
.ar-lib-qopt__badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 148px;
  padding: 0.4rem 0.75rem;
  border-radius: 999px;
  font-size: 14px;
  font-weight: 700;
  white-space: nowrap;
  background: #fee2e2;
  color: #b91c1c;
}
.ar-lib-qopt.is-correct .ar-lib-qopt__badge {
  background: #dcfce7;
  color: #15803d;
}
.ar-lib-qopt.is-wrong .ar-lib-qopt__badge {
  background: #fee2e2;
  color: #b91c1c;
}

.ar-lib-qblock__fb-toggle {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  margin-top: 0.85rem;
  padding: 0;
  border: 0;
  background: transparent;
  color: #374151;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
}
.ar-lib-qblock__fb-toggle .fa {
  font-size: 14px;
  transition: transform 0.15s ease;
}
.ar-lib-qblock__fb-toggle.is-open .fa {
  transform: rotate(180deg);
}
.ar-lib-qblock__fb {
  display: none;
  margin-top: 0.65rem;
}
.ar-lib-qblock__fb.is-open {
  display: block;
}
.ar-lib-qblock__fb textarea {
  width: 100%;
  box-sizing: border-box;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  padding: 0.7rem 0.85rem;
  margin-top: 0.35rem;
  resize: vertical;
  min-height: 70px;
}

@media (max-width: 900px) {
  .ar-lib-quiz-builder__head {
    flex-direction: column;
  }
  .ar-lib-qopt {
    grid-template-columns: auto minmax(0, 1fr);
  }
  .ar-lib-qopt__badge {
    grid-column: 2;
    justify-self: start;
    min-width: 0;
  }
}

/* Cuestionario estudiante (mockup) */
.ar-lib-taskhero {
  background: #fff;
  border: 1px solid #e8edf5;
  border-radius: 18px;
  box-shadow: 0 6px 20px rgba(15, 23, 42, 0.04);
  padding: 1.35rem 1.4rem 1.1rem;
  margin-bottom: 1.15rem;
}
.ar-lib-taskhero__crumb {
  margin: 0 0 0.35rem;
  font-size: 14px;
}
.ar-lib-taskhero__crumb a {
  color: #6b7280 !important;
  text-decoration: none !important;
}
.ar-lib-taskhero h1 {
  margin: 0 0 0.75rem;
  color: #0f2744;
  font-size: 28px;
  line-height: 1.25;
  font-weight: 800;
  font-family: var(--ar-font);
}
.ar-lib-taskhero__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  margin-bottom: 0.85rem;
}
.ar-lib-taskhero__desc {
  margin: 0 0 0.85rem;
  color: #4b5563;
  line-height: 1.5;
}
.ar-lib-taskhero__label {
  margin: 0;
  color: #6b7280;
  font-size: 14px;
  font-weight: 600;
}
.ar-lib-chip.is-muted {
  background: #f3f4f6;
  color: #4b5563;
}

.ar-lib-quiz-form {
  background: #fff;
  border: 1px solid #e8edf5;
  border-radius: 18px;
  box-shadow: 0 6px 20px rgba(15, 23, 42, 0.04);
  padding: 1.35rem 1.4rem 1.5rem;
}
.ar-lib-quiz-form__head {
  margin-bottom: 1.35rem;
}
.ar-lib-quiz-form__head h2 {
  margin: 0 0 0.35rem;
  color: #0f2744;
  font-size: 18px;
  font-weight: 800;
}
.ar-lib-quiz-form__head p {
  margin: 0;
  color: #6b7280;
  font-size: 14px;
}

.ar-lib-quiz-item {
  margin: 0 0 1.6rem;
}
.ar-lib-quiz-item h3 {
  margin: 0 0 0.45rem;
  color: #0f2744;
  font-size: 22px;
  font-weight: 800;
}
.ar-lib-quiz-item__q {
  margin: 0 0 0.85rem;
  color: #1f2937;
  font-size: 14px;
  line-height: 1.45;
  font-weight: 500;
}
.ar-lib-quiz-item__opts {
  display: grid;
  gap: 0.55rem;
}

.ar-lib-quiz-choice {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.85rem;
  padding: 0.95rem 1.05rem;
  border: 1.5px solid #e5e7eb;
  border-radius: 14px;
  background: #fff;
  cursor: pointer;
  transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
}
.ar-lib-quiz-choice:hover {
  border-color: #93c5fd;
  background: #f8fbff;
}
.ar-lib-quiz-choice:has(input:checked) {
  border-color: #2563eb;
  background: #eff6ff;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.12);
}
.ar-lib-quiz-choice__text {
  color: #111827;
  font-size: 14px;
  line-height: 1.4;
}
.ar-lib-quiz-choice input {
  position: absolute;
  opacity: 0;
  width: 1px;
  height: 1px;
}
.ar-lib-quiz-choice__radio {
  width: 22px;
  height: 22px;
  border-radius: 999px;
  border: 2px solid #d1d5db;
  box-sizing: border-box;
  background: #fff;
  flex-shrink: 0;
}
.ar-lib-quiz-choice:has(input:checked) .ar-lib-quiz-choice__radio {
  border-color: #2563eb;
  box-shadow: inset 0 0 0 5px #2563eb;
}

.ar-lib-quiz-submit {
  display: block;
  width: 100%;
  border: 0;
  border-radius: 14px;
  padding: 0.95rem 1.2rem;
  background: #2563eb;
  color: #fff;
  font-size: 16px;
  font-weight: 750;
  cursor: pointer;
  margin-top: 0.35rem;
  transition: background 0.15s ease, transform 0.1s ease;
}
.ar-lib-quiz-submit:hover {
  background: #1d4ed8;
}
.ar-lib-quiz-result {
  border-radius: 12px;
  padding: 0.85rem 1rem;
  margin-bottom: 1rem;
  font-size: 14px;
}
.ar-lib-quiz-result.is-pass {
  background: #ecfdf5;
  color: #047857;
}
.ar-lib-quiz-result.is-fail {
  background: #fff7ed;
  color: #c2410c;
}

/* legacy student quiz leftovers */
.ar-lib-quiz__hint {
  color: var(--ar-muted);
  margin: 0 0 1rem;
  font-size: 14px;
}
.ar-lib-quiz__q {
  border: 1px solid var(--ar-border);
  border-radius: 12px;
  padding: 0.9rem 1rem 1rem;
  margin: 0 0 0.9rem;
  background: #fff;
}
.ar-lib-quiz__q legend {
  font-weight: 700;
  color: var(--ar-navy);
  padding: 0 0.35rem;
}
.ar-lib-quiz__text {
  margin: 0.35rem 0 0.75rem;
  font-weight: 600;
}
.ar-lib-quiz__options {
  display: grid;
  gap: 0.45rem;
}
.ar-lib-quiz__opt {
  display: flex;
  gap: 0.65rem;
  align-items: flex-start;
  padding: 0.65rem 0.75rem;
  border: 1px solid var(--ar-border);
  border-radius: 10px;
  cursor: pointer;
  background: #fafbfc;
}
.ar-lib-quiz__opt:hover {
  border-color: var(--ar-blue);
  background: #f0f6ff;
}
.ar-lib-quiz__opt input {
  margin-top: 0.2rem;
}
.ar-lib-quiz__retry {
  color: #b54708;
  font-weight: 600;
  margin-bottom: 0.85rem;
}
.ar-lib-chip.is-navy {
  background: #e8eef7;
  color: var(--ar-navy);
}


@media (max-width: 1100px) {
  .ar-lib-colform__top,
  .ar-lib-colform__pair { grid-template-columns: 1fr; }
  .ar-lib-series__hero {
    grid-template-columns: 112px minmax(0, 1fr);
  }
  .ar-lib-series__cover,
  .ar-lib-series__cover img,
  .ar-lib-series__cover-fallback {
    width: 112px;
    height: 112px;
  }
  .ar-lib-series__stats {
    grid-column: 1 / -1;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.85rem;
  }
  .ar-lib-overview,
  .ar-lib-main,
  .ar-lib-admin-grid,
  .ar-lib-admin-stats,
  .ar-lib-kpi,
  .ar-lib-report { grid-template-columns: 1fr 1fr; }
  .ar-lib-admin-layout.has-side { grid-template-columns: 1fr; }
  .ar-lib-admin-side { position: static; }
}

@media (max-width: 767px) {
  .ar-lib-hero,
  .ar-lib-overview,
  .ar-lib-main,
  .ar-lib-admin-grid,
  .ar-lib-admin-stats,
  .ar-lib-form__grid,
  .ar-lib-kpi,
  .ar-lib-report { grid-template-columns: 1fr; }
  .ar-lib-hero { flex-direction: column; align-items: flex-start; }
  .ar-lib-hero__img { width: min(220px, 70vw); }
  .ar-lib-banner { flex-direction: column; align-items: stretch; }
  .ar-lib-banner .ar-lib-btn { width: 100%; }
  .ar-lib-catalog__tools { grid-template-columns: 1fr; }
  .ar-lib-task { flex-wrap: wrap; }
  .ar-lib-task .ar-lib-btn { width: 100%; }
  .ar-lib-admin-head,
  .ar-lib-pager { flex-direction: column; align-items: stretch; }
  .ar-lib-panel__head { flex-direction: column; }
  .ar-lib-series__hero {
    grid-template-columns: 1fr;
    padding: 1.2rem;
  }
  .ar-lib-series__intro h1 { font-size: 24px; }
  .ar-lib-series__stats { grid-template-columns: 1fr; }
  .ar-lib-series__row {
    grid-template-columns: 40px minmax(0, 1fr) auto;
    padding: 0.95rem 1rem;
  }
  .ar-lib-series__meta,
  .ar-lib-series__go { display: none; }
  .ar-lib-series__status { text-align: left; }
  .ar-lib-colform__series > header,
  .ar-lib-coltable__tools,
  .ar-lib-colform__series-tools { flex-direction: column; align-items: stretch; }
  .ar-lib-colform__search { min-width: 0; width: 100%; }
}

/* Tipografía biblioteca: html de Bootstrap es 10px; rem rendía ~10px.
   Piso 14px. Títulos de sección 22px. Título de página 28px. */
.ar-lib-page small,
.ar-lib-page .small {
  font-size: 14px;
}
.ar-lib-hero h1,
.ar-lib-admin-head h1 {
  font-size: 28px;
}
.ar-lib-bookview__info h1,
.ar-lib-reader h1,
.ar-lib-taskpage h1 {
  font-size: 24px;
}
.ar-lib-card > h2,
.ar-lib-card > h3,
.ar-lib-form h2,
.ar-lib-form h3,
.ar-lib-section-head h2,
.ar-lib-bookview__panel-head h2 {
  font-size: 22px !important;
}
.ar-lib-bookview__summary h2 {
  font-size: 16px !important;
}
.ar-lib-current h3,
.ar-lib-book h3,
.ar-lib-table__resource strong,
.ar-lib-task__body strong,
.ar-lib-activity strong,
.ar-lib-admin-row strong {
  font-size: 16px;
}
.ar-lib-dial strong,
.ar-lib-kpi strong,
.ar-lib-report strong,
.ar-lib-admin-stats strong,
.ar-lib-detail__item strong {
  font-size: 22px;
}
.ar-lib-stats strong {
  font-size: 16px;
}
.ar-lib-banner p {
  font-size: 16px;
}


/* =====================================================================
   Seguimientos automáticos (admin)
   ===================================================================== */
.ar-fw-page { display: grid; gap: 1rem; font-family: var(--ar-font); font-size: 1.06rem; }

.ar-fw-flash {
  border-radius: var(--ar-radius-sm);
  padding: 0.8rem 1rem;
  margin-bottom: 1rem;
  font-weight: 600;
}
.ar-fw-flash--confirmation { background: #ecfdf3; color: #067647; }
.ar-fw-flash--warning { background: #fff7ed; color: #b54708; }
.ar-fw-flash--error { background: #fef3f2; color: #b42318; }

.ar-fw-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem;
  margin-bottom: 1.25rem;
  border-bottom: 1px solid var(--ar-border);
}
.ar-fw-tabs a {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.7rem 0.95rem;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
  font-weight: 700;
  font-size: 0.97rem;
  color: var(--ar-muted) !important;
  text-decoration: none !important;
}
.ar-fw-tabs a .fa { opacity: 0.75; font-size: 0.92rem; }
.ar-fw-tabs a.is-active {
  color: var(--ar-blue) !important;
  border-bottom-color: var(--ar-blue);
}
.ar-fw-tabs a.is-active .fa { opacity: 1; color: var(--ar-blue); }
.ar-fw-tabs a:hover:not(.is-active) { color: var(--ar-navy) !important; }
.ar-fw-tabs__badge {
  display: inline-grid;
  place-items: center;
  min-width: 1.2rem;
  height: 1.2rem;
  padding: 0 0.3rem;
  border-radius: 999px;
  background: #ef4444;
  color: #fff;
  font-size: 0.76rem;
  font-style: normal;
}

.ar-fw-section { display: grid; gap: 1rem; }
.ar-fw-section__title {
  margin: 0 0 0.2rem;
  font-size: 1.13rem;
  font-weight: 800;
  color: var(--ar-navy);
}
.ar-fw-two-col {
  grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr);
  align-items: start;
}
.ar-fw-side { display: grid; gap: 1rem; }
.ar-fw-sticky { position: sticky; top: 1rem; }

.ar-fw-card {
  background: #fff;
  border: 1px solid var(--ar-border);
  border-radius: var(--ar-radius);
  box-shadow: var(--ar-shadow);
  padding: 1.1rem 1.2rem;
}
.ar-fw-card__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  flex-wrap: wrap;
  margin-bottom: 0.85rem;
}
.ar-fw-card__head h2 {
  margin: 0;
  font-size: 1.08rem;
  font-weight: 800;
  color: var(--ar-navy);
}
.ar-fw-card__foot {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 0.6rem;
  margin-top: 1rem;
  padding-top: 0.9rem;
  border-top: 1px solid var(--ar-border);
}

.ar-fw-hint { margin: 0 0 0.75rem; color: var(--ar-muted); font-size: 0.9rem; }
.ar-fw-empty { margin: 0; color: var(--ar-muted); font-size: 0.95rem; }

.ar-fw-note {
  border-radius: var(--ar-radius-sm);
  background: #f1f5fb;
  color: var(--ar-navy);
  padding: 0.7rem 0.9rem;
  font-size: 0.92rem;
  margin-bottom: 0.85rem;
}
.ar-fw-note--warn { background: #fff7ed; color: #b54708; }
.ar-fw-note code {
  background: rgba(11, 31, 58, 0.08);
  border-radius: 6px;
  padding: 0.05rem 0.3rem;
}

.ar-fw-code {
  display: block;
  background: var(--ar-navy);
  color: #dbe7ff;
  border-radius: var(--ar-radius-sm);
  padding: 0.7rem 0.85rem;
  font-size: 0.86rem;
  overflow-x: auto;
}

/* ---------- KPIs ---------- */
.ar-fw-kpis {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 0.75rem;
}
.ar-fw-kpi {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  background: #fff;
  border: 1px solid var(--ar-border);
  border-radius: 16px;
  box-shadow: var(--ar-shadow);
  padding: 0.9rem 1rem;
}
.ar-fw-kpi__icon {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  font-size: 1.08rem;
  flex-shrink: 0;
}
.ar-fw-kpi__icon--blue { background: #e8f0fe; color: #2563eb; }
.ar-fw-kpi__icon--green { background: #ecfdf3; color: #16a34a; }
.ar-fw-kpi__icon--violet { background: #f3e8ff; color: #7c3aed; }
.ar-fw-kpi__icon--amber { background: #fff7ed; color: #d97706; }
.ar-fw-kpi__icon--red { background: #fef3f2; color: #dc2626; }
.ar-fw-kpi__label {
  display: block;
  color: var(--ar-muted);
  font-size: 0.8rem;
  font-weight: 700;
}
.ar-fw-kpi__value {
  font-size: 1.4rem;
  font-weight: 800;
  color: var(--ar-navy);
  line-height: 1.1;
}

/* ---------- Barra de herramientas ---------- */
.ar-fw-toolbar {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 0.85rem;
  flex-wrap: wrap;
}
.ar-fw-toolbar__filters {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
  margin: 0;
}
.ar-fw-toolbar__actions {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.ar-fw-toolbar__actions form { margin: 0; }
.ar-fw-filter-card { padding: 0.85rem 1rem; }

.ar-fw-search {
  position: relative;
  display: inline-flex;
  align-items: center;
  margin: 0;
}
.ar-fw-search .fa {
  position: absolute;
  left: 0.7rem;
  color: var(--ar-muted);
  font-size: 0.92rem;
}
.ar-fw-search input {
  height: 38px;
  min-width: 240px;
  border: 1px solid var(--ar-border);
  border-radius: var(--ar-radius-sm);
  padding: 0 0.7rem 0 2rem;
  font-family: var(--ar-font);
  font-size: 0.95rem;
}

.ar-fw-toolbar__filters select,
.ar-fw-toolbar__filters input[type="date"] {
  height: 38px;
  border: 1px solid var(--ar-border);
  border-radius: var(--ar-radius-sm);
  padding: 0 0.6rem;
  font-family: var(--ar-font);
  font-size: 0.93rem;
  background: #fff;
  color: var(--ar-text);
}

/* ---------- Botones ---------- */
.ar-fw-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  height: 38px;
  padding: 0 0.9rem;
  border: 1px solid var(--ar-border);
  border-radius: var(--ar-radius-sm);
  background: #fff;
  color: var(--ar-navy) !important;
  font-family: var(--ar-font);
  font-weight: 700;
  font-size: 0.92rem;
  text-decoration: none !important;
  cursor: pointer;
}
.ar-fw-btn:hover { border-color: var(--ar-blue); color: var(--ar-blue) !important; }
.ar-fw-btn--ghost { background: #fff; }
.ar-fw-btn--mini { height: 30px; padding: 0 0.6rem; font-size: 0.84rem; }
.ar-fw-btn--danger { color: #b42318 !important; }
.ar-fw-btn--danger:hover { border-color: #b42318; color: #b42318 !important; }

.ar-fw-icon-btn {
  display: inline-grid;
  place-items: center;
  width: 32px;
  height: 32px;
  border: 1px solid var(--ar-border);
  border-radius: 10px;
  background: #fff;
  color: var(--ar-muted) !important;
  cursor: pointer;
  text-decoration: none !important;
}
.ar-fw-icon-btn:hover { border-color: var(--ar-blue); color: var(--ar-blue) !important; }
.ar-fw-icon-btn--danger:hover { border-color: #b42318; color: #b42318 !important; }
.ar-fw-inline-form { display: inline-block; margin: 0; }

/* ---------- Tablas ---------- */
.ar-fw-table-card { padding: 0; overflow-x: auto; }
.ar-fw-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.93rem;
}
.ar-fw-table-card > .ar-fw-card__head,
.ar-fw-table-card > .ar-fw-hint { padding: 1.1rem 1.2rem 0; }
.ar-fw-table-card > .ar-fw-hint { padding-bottom: 0.5rem; }
.ar-fw-table th {
  text-align: left;
  padding: 0.7rem 0.9rem;
  background: #f7f9fc;
  color: var(--ar-muted);
  font-size: 0.81rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  border-bottom: 1px solid var(--ar-border);
  white-space: nowrap;
}
.ar-fw-table td {
  padding: 0.7rem 0.9rem;
  border-bottom: 1px solid var(--ar-border);
  vertical-align: middle;
  color: var(--ar-text);
}
.ar-fw-table tr:last-child td { border-bottom: 0; }
.ar-fw-table tr.is-off td { opacity: 0.55; }
.ar-fw-table code {
  background: #f1f5fb;
  border-radius: 6px;
  padding: 0.1rem 0.35rem;
  font-size: 0.84rem;
  color: var(--ar-navy);
}
.ar-fw-table__title {
  font-weight: 800;
  color: var(--ar-navy) !important;
  text-decoration: none !important;
}
.ar-fw-table__title:hover { color: var(--ar-blue) !important; }
.ar-fw-table__sub {
  display: block;
  color: var(--ar-muted);
  font-size: 0.82rem;
  margin-top: 0.15rem;
}
.ar-fw-table__sub.is-error { color: #b42318; }
.ar-fw-table__actions { white-space: nowrap; text-align: right; }
.ar-fw-table__actions > * { margin-left: 0.2rem; }
.ar-fw-table__body-cell {
  max-width: 380px;
  font-size: 0.86rem;
  color: var(--ar-muted);
}

/* ---------- Etiquetas de estado ---------- */
.ar-fw-pill {
  display: inline-block;
  padding: 0.12rem 0.5rem;
  border-radius: 999px;
  background: #eef1f6;
  color: var(--ar-muted);
  font-size: 0.78rem;
  font-weight: 800;
  white-space: nowrap;
}
.ar-fw-pill--ok,
.ar-fw-pill--sent { background: #ecfdf3; color: #067647; }
.ar-fw-pill--warn,
.ar-fw-pill--scheduled { background: #fff7ed; color: #b54708; }
.ar-fw-pill--danger,
.ar-fw-pill--failed { background: #fef3f2; color: #b42318; }
.ar-fw-pill--sending { background: #e8f0fe; color: #2563eb; }

/* Canal de envío */
.ar-fw-pill--channel { display: inline-flex; align-items: center; gap: 0.3rem; font-weight: 700; vertical-align: middle; }
.ar-fw-pill--channel .fa { font-size: 0.9em; }
.ar-fw-pill--whatsapp { background: #e7f8ee; color: #128c7e; }
.ar-fw-pill--email { background: #eaf1fd; color: #1d4ed8; }
.ar-fw-pill--inbox { background: #f3eefc; color: #6d28d9; }
.ar-fw-card__head h2 .ar-fw-pill--channel { margin-left: 0.5rem; font-size: 0.72rem; }

.ar-fw-channel-picker {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.7rem;
  margin-top: 0.35rem;
}
.ar-fw-channel {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  padding: 0.8rem 0.9rem 0.8rem 2.6rem;
  border: 1px solid #e3e8ef;
  border-radius: 12px;
  background: #fff;
  cursor: pointer;
  transition: border-color 0.15s, box-shadow 0.15s;
}
.ar-fw-channel:hover { border-color: #c9d3e0; }
.ar-fw-channel.is-selected {
  border-color: var(--ar-yellow, #f5c400);
  box-shadow: 0 0 0 3px rgba(245, 196, 0, 0.18);
}
.ar-fw-channel input {
  position: absolute;
  left: 0.9rem;
  top: 0.95rem;
  margin: 0;
}
.ar-fw-channel input:disabled ~ span,
.ar-fw-channel input:disabled ~ small,
.ar-fw-channel input:disabled ~ .fa { opacity: 0.55; }
.ar-fw-channel.is-selected input:disabled ~ span,
.ar-fw-channel.is-selected input:disabled ~ small,
.ar-fw-channel.is-selected input:disabled ~ .fa { opacity: 1; }
.ar-fw-channel .fa {
  position: absolute;
  right: 0.9rem;
  top: 0.8rem;
  font-size: 1.15rem;
  color: var(--ar-muted);
}
.ar-fw-channel > span { font-weight: 800; font-size: 0.92rem; color: var(--ar-ink, #1f2937); }
.ar-fw-channel > small { color: var(--ar-muted); font-size: 0.76rem; line-height: 1.3; }
@media (max-width: 767px) {
  .ar-fw-channel-picker { grid-template-columns: 1fr; }
}

/* Chips para insertar variables en texto libre */
.ar-fw-var-chips {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem;
  margin: 0.35rem 0 0.5rem;
}
.ar-fw-var-chips__label { font-size: 0.78rem; color: var(--ar-muted); font-weight: 700; margin-right: 0.15rem; }
.ar-fw-chip {
  border: 1px solid #dbe3ee;
  background: #f6f8fb;
  color: #1f2937;
  border-radius: 999px;
  padding: 0.12rem 0.55rem;
  font-size: 0.74rem;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  cursor: pointer;
  line-height: 1.5;
}
.ar-fw-chip:hover { background: #fff3bf; border-color: #f5c400; }
.ar-fw-chip--event { background: #eef6ff; border-color: #cfe1fb; }
.ar-fw-chip--event:hover { background: #fff3bf; border-color: #f5c400; }
#fw-text-body { font-family: inherit; line-height: 1.5; resize: vertical; }

/* ---------- Página En vivo: reproductor + chat ---------- */
.ar-lv { max-width: 1240px; margin: 1.5rem auto 3rem; padding: 0 1rem; }

.ar-lv-admin {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem 1rem;
  background: #fff;
  border: 1px solid #e8eef5;
  border-radius: 16px;
  padding: 0.85rem 1rem;
  margin-bottom: 1.4rem;
  box-shadow: 0 8px 22px rgba(15, 23, 42, 0.06);
}
.ar-lv-admin__status { display: inline-flex; align-items: center; gap: 0.45rem; font-weight: 800; font-size: 0.92rem; }
.ar-lv-admin__status.is-on { color: #15803d; }
.ar-lv-admin__status.is-off { color: #b91c1c; }
.ar-lv-admin__dot { width: 9px; height: 9px; border-radius: 50%; background: currentColor; }
.ar-lv-admin__viewers { color: #475569; font-weight: 600; }
.ar-lv-admin__video { display: flex; gap: 0.5rem; flex: 1 1 320px; margin: 0; }
.ar-lv-admin__video input {
  flex: 1;
  min-width: 0;
  padding: 0.55rem 0.8rem;
  border: 1px solid #d5dde8;
  border-radius: 10px;
  font-size: 0.88rem;
}
.ar-lv-admin__actions { display: flex; gap: 0.5rem; align-items: center; }
.ar-lv-admin__actions form { margin: 0; }
.ar-lv-admin__error { flex-basis: 100%; margin: 0; color: #b91c1c; font-weight: 600; font-size: 0.85rem; }

.ar-lv-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.55rem 1rem;
  border-radius: 10px;
  border: 1px solid transparent;
  font-weight: 700;
  font-size: 0.86rem;
  cursor: pointer;
  text-decoration: none !important;
  white-space: nowrap;
  transition: filter 0.15s, background 0.15s;
}
.ar-lv-btn:hover { filter: brightness(0.95); }
.ar-lv-btn--blue { background: #2563eb; color: #fff !important; }
.ar-lv-btn--green { background: #16a34a; color: #fff !important; }
.ar-lv-btn--red { background: #e5484d; color: #fff !important; }
.ar-lv-btn--ghost { background: #fff; border-color: #d5dde8; color: #1f2937 !important; }

.ar-lv-head { text-align: center; margin-bottom: 1.2rem; }
.ar-lv-head h1 { margin: 0.5rem 0 0.25rem; font-size: 2rem; font-weight: 800; color: #0f2a5c; }
.ar-lv-head p { margin: 0; color: #64748b; }
.ar-lv-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.28rem 0.8rem;
  border-radius: 999px;
  background: #fff;
  border: 1px solid #fde2e2;
  color: #dc2626;
  font-size: 0.74rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  box-shadow: 0 4px 12px rgba(220, 38, 38, 0.08);
}
.ar-lv-badge__dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #ef4444;
  animation: ar-lv-pulse 1.6s ease-in-out infinite;
}
@keyframes ar-lv-pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.35; }
}

.ar-lv-card {
  background: #fff;
  border: 1px solid #e8eef5;
  border-radius: 22px;
  padding: 1rem;
  box-shadow: 0 18px 45px rgba(15, 23, 42, 0.08);
}
.ar-lv-grid {
  display: flex;
  align-items: stretch;
  gap: 1rem;
}

/* Reproductor */
.ar-lv-player {
  position: relative;
  flex: 1 1 auto;
  min-width: 0;
  aspect-ratio: 16 / 9;
  background: #000;
  border-radius: 16px;
  overflow: hidden;
  user-select: none;
}
.ar-lv-player__frame {
  position: absolute;
  inset: 0;
  z-index: 1;
}
.ar-lv-player__frame iframe,
.ar-lv-player__frame > div,
#ar-lv-yt {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  border: 0;
  max-width: none !important;
}
.ar-lv-player__frame iframe { pointer-events: none; }
.ar-lv-player.is-playing .ar-lv-player__cover { display: none !important; }
.ar-lv-player__shield { position: absolute; inset: 0; z-index: 2; cursor: pointer; }
.ar-lv-player__cover {
  position: absolute;
  inset: 0;
  z-index: 3;
  display: none;
  align-items: center;
  justify-content: center;
  background-color: #0b1220;
  background-size: cover;
  background-position: center;
}
.ar-lv-player__cover::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(2, 6, 23, 0.35), rgba(2, 6, 23, 0.6));
}
.ar-lv-player__cover.is-visible { display: flex; }
.ar-lv-player__bigplay {
  position: relative;
  width: 78px;
  height: 78px;
  border-radius: 50%;
  border: 0;
  background: #ef4444;
  color: #fff;
  font-size: 1.9rem;
  cursor: pointer;
  box-shadow: 0 12px 30px rgba(239, 68, 68, 0.45);
  transition: transform 0.15s;
}
.ar-lv-player__bigplay .fa { margin-left: 5px; }
.ar-lv-player__bigplay:hover { transform: scale(1.06); }
.ar-lv-player__top {
  position: absolute;
  top: 0.8rem;
  right: 0.8rem;
  z-index: 4;
  display: flex;
  gap: 0.45rem;
  pointer-events: none;
}
.ar-lv-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.3rem 0.65rem;
  border-radius: 999px;
  background: rgba(15, 23, 42, 0.72);
  color: #fff;
  font-size: 0.76rem;
  font-weight: 800;
}
.ar-lv-chip--live { background: #ef4444; }
.ar-lv-player__bar {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 4;
  display: flex;
  align-items: center;
  gap: 0.35rem;
  padding: 1.6rem 0.9rem 0.7rem;
  background: linear-gradient(180deg, transparent, rgba(2, 6, 23, 0.8));
  opacity: 1;
  transition: opacity 0.25s;
}
.ar-lv-player.is-playing .ar-lv-player__bar { opacity: 0; }
.ar-lv-player.is-playing:hover .ar-lv-player__bar,
.ar-lv-player.is-playing:focus-within .ar-lv-player__bar { opacity: 1; }
.ar-lv-ctrl {
  width: 38px;
  height: 38px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: #fff;
  font-size: 1.15rem;
  cursor: pointer;
}
.ar-lv-ctrl:hover { background: rgba(255, 255, 255, 0.14); }
.ar-lv-volume { width: 72px; flex: 0 0 72px; accent-color: #fff; cursor: pointer; }
.ar-lv-seek { flex: 1 1 auto; min-width: 80px; accent-color: #ef4444; cursor: pointer; }
.ar-lv-time {
  flex: 0 0 auto;
  color: #fff;
  font-size: 0.72rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  min-width: 2.4rem;
}
.ar-lv-player__live {
  margin-left: 0.15rem;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  border: 0;
  background: transparent;
  color: #fff;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  cursor: pointer;
  padding: 0.25rem 0.45rem;
  border-radius: 999px;
}
.ar-lv-player__live:hover,
.ar-lv-player__live.is-behind { background: #ef4444; }
.ar-lv-unmute {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  z-index: 6;
  display: inline-flex;
  align-items: center;
  gap: 0.85rem;
  padding: 0.95rem 1.25rem;
  border: 0;
  border-radius: 18px;
  background: rgba(15, 23, 42, 0.92);
  color: #fff;
  font-weight: 800;
  font-size: 0.95rem;
  cursor: pointer;
  box-shadow: 0 14px 36px rgba(0, 0, 0, 0.4);
  text-align: left;
  max-width: calc(100% - 2rem);
  animation: ar-lv-unmute-pulse 1.6s ease-in-out infinite;
}
.ar-lv-unmute[hidden] { display: none; }
.ar-lv-unmute__icon {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: #25d366;
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  font-size: 1.35rem;
}
.ar-lv-unmute__text {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  line-height: 1.2;
}
.ar-lv-unmute__text strong { font-size: 1rem; }
.ar-lv-unmute__text small {
  font-size: 0.78rem;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.78);
}
.ar-lv-player.is-muted::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 4;
  background: rgba(2, 6, 23, 0.28);
  pointer-events: none;
}
@keyframes ar-lv-unmute-pulse {
  0%, 100% { transform: translate(-50%, -50%) scale(1); }
  50% { transform: translate(-50%, -50%) scale(1.03); }
}

/* Chat */
.ar-lv-chat {
  display: flex;
  flex-direction: column;
  flex: 0 0 360px;
  width: 360px;
  min-width: 280px;
  max-height: 500px;
  min-height: 0;
  border: 1px solid #e8eef5;
  border-radius: 16px;
  background: #fbfcfe;
  overflow: hidden;
}
.ar-lv-chat__tabs { padding: 0.7rem 0.7rem 0; }
.ar-lv-chat__tab {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  padding: 0.6rem 0.9rem;
  border-radius: 10px;
  background: #2563eb;
  color: #fff;
  font-weight: 800;
  font-size: 0.88rem;
}
.ar-lv-chat__meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  padding: 0.65rem 0.9rem 0.5rem;
  font-size: 0.82rem;
  color: #334155;
}
.ar-lv-chat__people { display: inline-flex; align-items: center; gap: 0.4rem; font-weight: 700; }
.ar-lv-chat__online-dot { width: 8px; height: 8px; border-radius: 50%; background: #22c55e; }
.ar-lv-chat__sort {
  padding: 0.25rem 0.5rem;
  border: 1px solid #dbe3ee;
  border-radius: 8px;
  background: #fff;
  font-size: 0.78rem;
}
.ar-lv-chat__list {
  flex: 1 1 auto;
  min-height: 0;
  margin: 0;
  padding: 0.3rem 0.9rem 0.6rem;
  list-style: none;
  overflow-y: auto;
  scrollbar-width: thin;
}
.ar-lv-chat__empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.4rem;
  padding: 2.5rem 0.5rem;
  color: #94a3b8;
  font-weight: 600;
  font-size: 0.86rem;
}
.ar-lv-chat__empty .fa { font-size: 1.6rem; }
.ar-lv-chat__empty[hidden] { display: none; }

.ar-lv-msg { position: relative; display: flex; gap: 0.6rem; padding: 0.4rem 0; }
.ar-lv-msg__avatar {
  flex: 0 0 32px;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  overflow: hidden;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 0.72rem;
  font-weight: 800;
  background: #64748b;
}
.ar-lv-msg__avatar img { width: 100%; height: 100%; object-fit: cover; }
.ar-lv-msg__body { min-width: 0; }
.ar-lv-msg__head { display: flex; align-items: baseline; gap: 0.4rem; font-size: 0.78rem; }
.ar-lv-msg__head strong { color: #1e293b; }
.ar-lv-msg__head time { color: #94a3b8; font-size: 0.72rem; }
.ar-lv-msg__tag {
  padding: 0 0.4rem;
  border-radius: 999px;
  background: #fef3c7;
  color: #92400e;
  font-size: 0.66rem;
  font-weight: 800;
}
.ar-lv-msg__text {
  display: inline-block;
  margin: 0.2rem 0 0;
  padding: 0.42rem 0.7rem;
  border-radius: 4px 12px 12px 12px;
  background: #eef2f7;
  color: #1f2937;
  font-size: 0.86rem;
  line-height: 1.4;
  white-space: pre-wrap;
  word-break: break-word;
}
.ar-lv-msg.is-mine .ar-lv-msg__text { background: #dbeafe; }
.ar-lv-msg.is-staff .ar-lv-msg__text { background: #fff7d6; }
.ar-lv-msg__del {
  position: absolute;
  top: 0.35rem;
  right: 0;
  border: 0;
  background: transparent;
  color: #94a3b8;
  cursor: pointer;
  opacity: 0;
  transition: opacity 0.15s;
}
.ar-lv-msg:hover .ar-lv-msg__del { opacity: 1; }
.ar-lv-msg__del:hover { color: #dc2626; }

.ar-lv-chat__form { position: relative; margin: 0; padding: 0.6rem 0.7rem 0.7rem; border-top: 1px solid #e8eef5; background: #fff; }
.ar-lv-chat__input {
  display: flex;
  align-items: flex-end;
  gap: 0.35rem;
  padding: 0.3rem;
  border: 1px solid #dbe3ee;
  border-radius: 12px;
  background: #fff;
}
.ar-lv-chat__input:focus-within { border-color: #93b4f5; box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.12); }
.ar-lv-chat__input textarea {
  flex: 1;
  min-width: 0;
  border: 0;
  outline: 0;
  resize: none;
  padding: 0.45rem 0.2rem;
  height: 27px !important;
  font: inherit;
  font-size: 0.88rem;
  line-height: 1.35;
  max-height: 110px;
  background: transparent;
  box-shadow: none;
}
.ar-lv-chat__emoji-btn,
.ar-lv-chat__send {
  flex: 0 0 36px;
  width: 36px;
  height: 36px;
  border: 0;
  border-radius: 9px;
  cursor: pointer;
  font-size: 1.05rem;
}
.ar-lv-chat__emoji-btn { background: transparent; color: #64748b; }
.ar-lv-chat__emoji-btn:hover { background: #f1f5f9; }
.ar-lv-chat__send { background: #2563eb; color: #fff; }
.ar-lv-chat__send:disabled { opacity: 0.5; cursor: default; }
.ar-lv-chat__emojis {
  position: absolute;
  left: 0.7rem;
  bottom: calc(100% - 0.2rem);
  display: grid;
  grid-template-columns: repeat(8, 1fr);
  gap: 0.15rem;
  padding: 0.4rem;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  box-shadow: 0 10px 25px rgba(15, 23, 42, 0.12);
  z-index: 5;
}
.ar-lv-chat__emojis[hidden] { display: none; }
.ar-lv-chat__emojis button { border: 0; background: transparent; font-size: 1.2rem; padding: 0.2rem; border-radius: 6px; cursor: pointer; }
.ar-lv-chat__emojis button:hover { background: #f1f5f9; }
.ar-lv-chat__error { margin: 0.4rem 0 0; color: #b91c1c; font-size: 0.78rem; font-weight: 600; }
.ar-lv-chat__error[hidden] { display: none; }

.ar-lv-empty { text-align: center; padding: 4rem 1rem; color: #475569; }
.ar-lv-empty .fa { font-size: 2.4rem; color: #cbd5e1; }
.ar-lv-empty h2 { margin: 0.8rem 0 0.4rem; font-size: 1.5rem; font-weight: 800; color: #0f172a; }

@media (max-width: 991px) {
  .ar-lv-grid { flex-direction: column; }
  .ar-lv-chat { flex: none; width: 100%; height: 460px; }
}
@media (max-width: 575px) {
  .ar-lv-card { padding: 0.6rem; border-radius: 16px; }
  .ar-lv-head h1 { font-size: 1.5rem; }
  .ar-lv-volume { width: 80px; }
  .ar-lv-admin__actions { flex-wrap: wrap; }
}

/* ---------- Reporte de asistencia al en vivo ---------- */
.ar-live-report { max-width: 1120px; margin: 0 auto; }
.ar-live-report__hero {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  position: relative;
  min-height: 168px;
  margin: 0 0 1.15rem;
  padding-right: 0.2rem;
}
.ar-live-report__copy { max-width: 36rem; z-index: 1; padding-top: 0.15rem; }
.ar-live-report__title {
  margin: 0 0 0.4rem;
  font-size: clamp(1.55rem, 2.2vw, 1.85rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  color: var(--ar-navy);
}
.ar-live-report__lead { margin: 0; color: var(--ar-muted); max-width: 54ch; line-height: 1.5; font-size: 0.95rem; }
.ar-live-report__banner {
  position: absolute;
  right: 0;
  top: -1.1rem;
  border-radius: 30px;
  width: min(360px, 38vw);
  height: auto;
  pointer-events: none;
  user-select: none;
}
.ar-live-report__go {
  position: relative;
  z-index: 2;
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  height: 42px;
  padding: 0 1.15rem;
  border: 1px solid #e8eef5;
  border-radius: 999px;
  background: #fff;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
  color: var(--ar-navy) !important;
  font-weight: 700;
  font-size: 0.92rem;
  text-decoration: none !important;
}
.ar-live-report__go:hover { border-color: #c7d2fe; color: #1d4ed8 !important; }
.ar-live-report__picker {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  margin-bottom: 1.25rem;
}
.ar-live-report__select {
  flex: 1 1 auto;
  display: flex;
  align-items: center;
  gap: 0.65rem;
  min-height: 46px;
  padding: 0 1rem;
  background: #fff;
  border: 1px solid #e8eef5;
  border-radius: 14px;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
  margin: 0;
  font-weight: 400;
}
.ar-live-report__select > .fa { color: #94a3b8; font-size: 1.05rem; }
.ar-live-report__select select {
  flex: 1 1 auto;
  width: 100%;
  border: 0;
  background: transparent;
  box-shadow: none;
  height: 44px;
  padding: 0;
  font-weight: 600;
  color: #0f172a;
  appearance: none;
  -webkit-appearance: none;
}
.ar-live-report__select select:focus { outline: none; box-shadow: none; }
.ar-live-report__csv {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  height: 46px;
  padding: 0 1.05rem;
  border: 1px solid #e8eef5;
  border-radius: 999px;
  background: #fff;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
  color: var(--ar-navy) !important;
  font-weight: 700;
  font-size: 0.9rem;
  text-decoration: none !important;
  white-space: nowrap;
}
.ar-live-report__csv:hover { border-color: #c7d2fe; color: #1d4ed8 !important; }
.ar-live-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.75rem;
  margin-bottom: 0.4rem;
}
.ar-live-stat {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  border: 0;
  border-radius: 16px;
  padding: 0.95rem 1rem;
}
.ar-live-stat__icon {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  color: #fff;
  flex-shrink: 0;
  font-size: 0.95rem;
}
.ar-live-stat__body { min-width: 0; display: flex; flex-direction: column; gap: 0.08rem; }
.ar-live-stat__label {
  font-size: 0.7rem;
  font-weight: 700;
  color: #94a3b8;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.ar-live-stat__value { font-size: 1.28rem; font-weight: 800; color: #0f172a; line-height: 1.15; }
.ar-live-stat small { color: #94a3b8; font-size: 0.78rem; }
.ar-live-stat--ok { background: #ecfdf5; }
.ar-live-stat--ok .ar-live-stat__icon { background: #22c55e; }
.ar-live-stat--time { background: #f8fafc; }
.ar-live-stat--time .ar-live-stat__icon { background: #3b82f6; }
.ar-live-stat--people { background: #f5f3ff; }
.ar-live-stat--people .ar-live-stat__icon { background: #8b5cf6; }
.ar-live-stat--watch { background: #fff7ed; }
.ar-live-stat--watch .ar-live-stat__icon { background: #f59e0b; }
.ar-live-bar {
  height: 8px;
  border-radius: 999px;
  background: #eef1f6;
  overflow: hidden;
  min-width: 90px;
}
.ar-live-bar span { display: block; height: 100%; background: var(--ar-yellow, #f5c400); border-radius: 999px; }
.ar-live-table td small { color: var(--ar-muted); }
.ar-live-table .ar-fw-pill { margin-left: 0.35rem; }
.ar-live-user { display: flex; align-items: center; gap: 0.7rem; }
.ar-live-avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  flex-shrink: 0;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.02em;
  color: #fff;
}
.ar-live-avatar--teal { background: #14b8a6; }
.ar-live-avatar--amber { background: #f59e0b; }
.ar-live-avatar--blue { background: #3b82f6; }
.ar-live-avatar--violet { background: #8b5cf6; }
.ar-live-avatar--rose { background: #f43f5e; }
@media (max-width: 991px) {
  .ar-live-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ar-live-report__banner { width: min(220px, 32vw); right: 0.4rem; top: 2.4rem; }
}
@media (max-width: 767px) {
  .ar-live-report__hero { min-height: 0; flex-direction: column; }
  .ar-live-report__banner { display: none; }
  .ar-live-report__picker { flex-direction: column; align-items: stretch; }
  .ar-live-report__csv { justify-content: center; }
  .ar-live-stats { grid-template-columns: 1fr; }
}

/* ---------- Formularios ---------- */
.ar-fw-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.8rem 1rem;
}
.ar-fw-grid .is-full { grid-column: 1 / -1; }

.ar-fw-field { display: block; margin: 0; min-width: 0; }
.ar-fw-form [hidden],
.ar-fw-form .is-collapsed {
  display: none !important;
}
.ar-fw-field > span {
  display: block;
  font-weight: 700;
  color: var(--ar-navy);
  font-size: 0.91rem;
  margin-bottom: 0.3rem;
}
.ar-fw-field > span small { font-weight: 600; color: var(--ar-muted); }
.ar-fw-label {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  margin-bottom: 0.3rem;
  font-weight: 700;
  color: var(--ar-navy);
  font-size: 0.91rem;
}
.ar-fw-tip {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.05rem;
  height: 1.05rem;
  color: var(--ar-blue);
  cursor: help;
  outline: none;
  flex-shrink: 0;
}
.ar-fw-tip .fa {
  font-size: 0.89rem;
  line-height: 1;
}
.ar-fw-tip__bubble {
  position: absolute;
  left: 50%;
  bottom: calc(100% + 7px);
  transform: translateX(-50%);
  width: max-content;
  max-width: 270px;
  padding: 0.55rem 0.7rem;
  border-radius: 8px;
  background: #1b2a44;
  color: #fff;
  font-size: 0.82rem;
  font-weight: 500;
  line-height: 1.45;
  text-align: left;
  white-space: normal;
  box-shadow: 0 8px 22px rgba(15, 23, 42, 0.22);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  z-index: 30;
  transition: opacity 0.15s ease, visibility 0.15s ease;
}
.ar-fw-tip__bubble::after {
  content: '';
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  border: 6px solid transparent;
  border-top-color: #1b2a44;
}
.ar-fw-tip:hover .ar-fw-tip__bubble,
.ar-fw-tip:focus .ar-fw-tip__bubble {
  opacity: 1;
  visibility: visible;
}
.ar-fw-field input[type="text"],
.ar-fw-field input[type="number"],
.ar-fw-field input[type="search"],
.ar-fw-field textarea,
.ar-fw-field select {
  display: block;
  width: 100%;
  border: 1px solid var(--ar-border);
  border-radius: var(--ar-radius-sm);
  padding: 0.5rem 0.7rem;
  font-family: var(--ar-font);
  font-size: 0.95rem;
  background: #fff;
  color: var(--ar-text);
}
.ar-fw-field textarea { resize: vertical; }
.ar-fw-field small {
  display: block;
  margin-top: 0.25rem;
  color: var(--ar-muted);
  font-size: 0.82rem;
}

.ar-fw-event-hint {
  margin: -0.35rem 0 0;
  padding: 0.65rem 0.8rem;
  border-radius: var(--ar-radius-sm);
  background: #f5f8ff;
  border: 1px solid #dbe6ff;
  color: var(--ar-muted);
  font-size: 0.91rem;
  line-height: 1.45;
}

.ar-fw-dynamic-panel {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.85rem 1rem;
  padding: 0.85rem 0.95rem;
  border: 1px solid var(--ar-border);
  border-radius: var(--ar-radius-sm);
  background: #fbfcfe;
}
.ar-fw-dynamic-panel > .ar-fw-field { margin: 0; }
.ar-fw-dynamic-panel > #fw-courses-field { grid-column: 1 / -1; }
.ar-fw-dynamic-panel > #fw-sessions-field { grid-column: 1 / -1; }

.ar-fw-inline-inputs { display: flex; gap: 0.5rem; }
.ar-fw-inline-inputs input { flex: 1; }
.ar-fw-inline-inputs select { width: auto; min-width: 92px; }

.ar-fw-check {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  margin: 0.35rem 0;
  font-size: 0.93rem;
  font-weight: 600;
  color: var(--ar-text);
  cursor: pointer;
}
.ar-fw-check input { margin: 0; }

.ar-fw-switch {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.91rem;
  font-weight: 700;
  color: var(--ar-navy);
  margin: 0;
  cursor: pointer;
}
.ar-fw-switch input { margin: 0; }

.ar-fw-courses {
  max-height: 190px;
  overflow-y: auto;
  border: 1px solid var(--ar-border);
  border-radius: var(--ar-radius-sm);
  padding: 0.5rem 0.7rem;
  margin-top: 0.4rem;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.1rem 0.75rem;
}

.ar-fw-crumb { margin: 0; }
.ar-fw-crumb a {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-weight: 700;
  font-size: 0.93rem;
  text-decoration: none !important;
}

/* ---------- Variantes ---------- */
.ar-fw-variants {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
  gap: 1rem;
  align-items: start;
}
.ar-fw-variants__list { display: grid; gap: 1rem; min-width: 0; }
.ar-fw-variant-form { position: sticky; top: 1rem; }

.ar-fw-variant-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.7rem; }
.ar-fw-variant {
  border: 1px solid var(--ar-border);
  border-radius: var(--ar-radius-sm);
  padding: 0.8rem 0.9rem;
  background: #fcfdff;
}
.ar-fw-variant.is-off { opacity: 0.6; }
.ar-fw-variant__head {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  flex-wrap: wrap;
  margin-bottom: 0.5rem;
}
.ar-fw-variant__head strong { color: var(--ar-navy); font-size: 0.99rem; }
.ar-fw-variant__meta {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.2rem 0.9rem;
  margin: 0 0 0.5rem;
  font-size: 0.86rem;
}
.ar-fw-variant__meta dt {
  display: inline;
  color: var(--ar-muted);
  font-weight: 700;
}
.ar-fw-variant__meta dt::after { content: ': '; }
.ar-fw-variant__meta dd { display: inline; margin: 0; color: var(--ar-text); }
.ar-fw-variant__body {
  margin: 0 0 0.6rem;
  padding: 0.55rem 0.7rem;
  background: #f1f5fb;
  border-radius: 10px;
  color: var(--ar-navy);
  font-size: 0.89rem;
  white-space: pre-line;
}
.ar-fw-variant__actions { display: flex; gap: 0.4rem; flex-wrap: wrap; }

.ar-fw-template-preview {
  background: #f1f5fb;
  border-radius: var(--ar-radius-sm);
  padding: 0.6rem 0.75rem;
  margin-bottom: 0.75rem;
  color: var(--ar-navy);
  font-size: 0.89rem;
  white-space: pre-line;
}

.ar-fw-vars-rows { display: grid; gap: 0.4rem; }
.ar-fw-var-row {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin: 0;
}
.ar-fw-var-row__num {
  flex-shrink: 0;
  min-width: 46px;
  padding: 0.2rem 0.35rem;
  border-radius: 8px;
  background: var(--ar-navy);
  color: #ffd84a;
  font-size: 0.8rem;
  font-weight: 800;
  text-align: center;
}
.ar-fw-var-row select {
  flex: 1;
  min-width: 0;
  border: 1px solid var(--ar-border);
  border-radius: var(--ar-radius-sm);
  padding: 0.4rem 0.6rem;
  font-family: var(--ar-font);
  font-size: 0.91rem;
  background: #fff;
}

.ar-fw-test-card .ar-fw-grid { margin-bottom: 0.8rem; }
.ar-fw-test-context {
  margin: 0 0 0.85rem;
  padding: 0.75rem 0.85rem 0.2rem;
  border: 1px dashed var(--ar-border);
  border-radius: var(--ar-radius-sm);
  background: #fafbfd;
}
.ar-fw-test-context legend {
  padding: 0 0.35rem;
  font-size: 0.89rem;
  font-weight: 700;
  color: var(--ar-navy);
}
.ar-fw-test-phone {
  margin: 0 0 0.85rem;
  padding: 0.65rem 0.8rem;
  border-radius: var(--ar-radius-sm);
  font-size: 0.91rem;
  line-height: 1.45;
}
.ar-fw-test-phone--loading {
  background: #f5f7fb;
  border: 1px solid var(--ar-border);
  color: var(--ar-navy);
}
.ar-fw-test-phone--ok {
  background: #edf9f0;
  border: 1px solid #b8e6c3;
  color: #1f5f34;
}
.ar-fw-test-phone--error {
  background: #fff4f4;
  border: 1px solid #f0c4c4;
  color: #8a1f1f;
}
.ar-fw-test-phone__num {
  display: block;
  margin-top: 0.2rem;
  font-weight: 700;
}
.ar-fw-test-form #fw-test-submit:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}
.ar-fw-test-card select,
.ar-fw-variant-form select {
  appearance: auto;
  -webkit-appearance: menulist;
  min-height: 2.35rem;
  width: 100%;
  border: 1px solid var(--ar-border);
  border-radius: var(--ar-radius-sm);
  padding: 0.4rem 0.6rem;
  background-color: #fff;
  color: var(--ar-navy);
}
.ar-fw-test-card select option,
.ar-fw-variant-form select option {
  background: #fff;
  color: var(--ar-navy);
}
.ar-fw-vars-suggest {
  margin: 0 0 0.55rem;
  padding: 0.55rem 0.7rem;
  border-radius: var(--ar-radius-sm);
  background: #f0f7ff;
  border: 1px solid #cfe0ff;
  color: var(--ar-navy);
  font-size: 0.86rem;
  line-height: 1.45;
}

/* Fichas de variables en el catálogo de eventos */
.ar-fw-var {
  display: inline-block;
  margin: 0 0.25rem 0.25rem 0;
  padding: 0.1rem 0.4rem;
  border: 1px solid var(--ar-border);
  border-radius: 6px;
  background: #f5f7fb;
  color: var(--ar-navy);
  font-size: 0.78rem;
  font-weight: 700;
  cursor: help;
}

/* ---------- Estados vacíos, paginación y auditoría ---------- */
.ar-fw-empty-card {
  background: #fff;
  border: 1px dashed var(--ar-border);
  border-radius: var(--ar-radius);
  padding: 2.2rem 1.2rem;
  text-align: center;
}
.ar-fw-empty-card > .fa { font-size: 2.16rem; color: var(--ar-blue); opacity: 0.55; }
.ar-fw-empty-card h3 {
  margin: 0.7rem 0 0.3rem;
  font-size: 1.08rem;
  font-weight: 800;
  color: var(--ar-navy);
}
.ar-fw-empty-card p { margin: 0 0 1rem; color: var(--ar-muted); font-size: 0.95rem; }

.ar-fw-pager {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.9rem;
  font-size: 0.92rem;
  color: var(--ar-muted);
}
.ar-fw-pager a { font-weight: 700; text-decoration: none !important; }

.ar-fw-audit { list-style: none; margin: 0; padding: 0; }
.ar-fw-audit li {
  padding: 0.5rem 0;
  border-bottom: 1px solid var(--ar-border);
  font-size: 0.9rem;
}
.ar-fw-audit li:last-child { border-bottom: 0; }
.ar-fw-audit__action {
  display: inline-block;
  margin-right: 0.4rem;
  padding: 0.05rem 0.4rem;
  border-radius: 6px;
  background: #eef1f6;
  color: var(--ar-muted);
  font-size: 0.76rem;
  font-weight: 800;
  text-transform: uppercase;
}
.ar-fw-audit__meta { display: block; color: var(--ar-muted); font-size: 0.82rem; }

/* ---------- Inscripción de usuarios (clases / cursos) ---------- */
.ar-sub {
  --ar-sub-blue: #2563eb;
  --ar-sub-navy: #0f2744;
  --ar-sub-muted: #64748b;
  --ar-sub-line: #e8eef6;
  --ar-sub-bg: #f4f7fb;
  max-width: 1280px;
  margin: 0 auto 2rem;
  color: var(--ar-sub-navy);
  font-family: var(--ar-font);
}
.ar-sub__bc {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem;
  margin: 0 0 0.85rem;
  font-size: 0.82rem;
  font-weight: 700;
  color: var(--ar-sub-muted);
}
.ar-sub__bc a {
  color: var(--ar-sub-blue);
  text-decoration: none !important;
}
.ar-sub__bc a:hover { text-decoration: underline !important; }
.ar-sub__bc-sep { color: #cbd5e1; }
.ar-sub__bc-current { color: var(--ar-sub-navy); }

.ar-sub__top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  margin: 0 0 1.1rem;
  flex-wrap: wrap;
}

.ar-sub__title-wrap {
  display: flex;
  gap: 0.85rem;
  align-items: flex-start;
  min-width: 240px;
}
.ar-sub__title-icon {
  width: 46px;
  height: 46px;
  border-radius: 14px;
  background: #dbeafe;
  color: var(--ar-sub-blue);
  display: grid;
  place-items: center;
  font-size: 1.15rem;
  flex: 0 0 auto;
}
.ar-sub__title-wrap h1 {
  margin: 0;
  font-size: 1.35rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: var(--ar-sub-navy);
}
.ar-sub__title-wrap p {
  margin: 0.2rem 0 0;
  color: var(--ar-sub-muted);
  font-size: 0.92rem;
}
.ar-sub__toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  align-items: center;
}
.ar-sub__btn {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  border: 1px solid var(--ar-sub-line);
  background: #fff;
  color: var(--ar-sub-navy);
  border-radius: 50px;
  padding: 15px 18px;
  font-weight: 700;
  font-size: 14px;
  line-height: 1.1;
  cursor: pointer;
  text-decoration: none !important;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}
.ar-sub__btn:hover { border-color: #c5d4ea; color: var(--ar-sub-navy); }
.ar-sub__btn--primary,
.ar-sub__btn--primary:hover,
.ar-sub__btn--primary:focus,
.ar-sub__btn--primary:disabled,
.ar-sub__btn--primary.is-busy,
.ar-sub #ar_subscribe_btn {
  background: var(--ar-sub-blue) !important;
  border-color: var(--ar-sub-blue) !important;
  color: #fff !important;
  opacity: 1 !important;
}
.ar-sub__btn--primary:hover { filter: brightness(1.05); }
.ar-sub__btn--primary:disabled,
.ar-sub__btn--primary.is-busy {
  filter: none;
  cursor: wait;
}
.ar-sub__btn--success,
.ar-sub__btn--success:hover,
.ar-sub__btn--success:focus,
.ar-sub #ar_subscribe_btn.ar-sub__btn--success {
  background: #22c55e !important;
  border-color: #16a34a !important;
  color: #fff !important;
}
.ar-sub__btn--success:hover { filter: brightness(1.05); }
.ar-sub__btn--ghost { background: #fff; }
.ar-sub__btn--danger {
  background: #fff;
  color: #e11d48 !important;
  border-color: #fecdd3;
}
.ar-sub__btn--move {
  width: 42px;
  height: 42px;
  padding: 0;
  justify-content: center;
  border-radius: 12px;
  background: #fff;
}
.ar-sub__toggle {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.35rem 0.65rem 0.35rem 0.4rem;
  background: #fff;
  border: 1px solid var(--ar-sub-line);
  border-radius: 999px;
  font-weight: 700;
  font-size: 0.84rem;
  color: var(--ar-sub-navy);
  text-decoration: none !important;
}
.ar-sub__switch {
  width: 36px;
  height: 20px;
  border-radius: 999px;
  background: #cbd5e1;
  position: relative;
  display: inline-block;
}
.ar-sub__switch::after {
  content: "";
  position: absolute;
  top: 2px;
  left: 2px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #fff;
  transition: left .15s ease;
}
.ar-sub__toggle.is-on .ar-sub__switch { background: var(--ar-sub-blue); }
.ar-sub__toggle.is-on .ar-sub__switch::after { left: 18px; }

.ar-sub__filters {
  background: #fff;
  border: 1px solid var(--ar-sub-line);
  border-radius: 18px;
  padding: 1rem 1.15rem 1.05rem;
  box-shadow: 0 10px 30px rgba(15, 23, 42, 0.04);
  margin-bottom: 1rem;
}
.ar-sub__filters-head {
  display: flex;
  gap: 0.7rem;
  align-items: flex-start;
  margin-bottom: 0.85rem;
}
.ar-sub__filters-icon {
  width: 34px;
  height: 34px;
  border-radius: 10px;
  background: #eff6ff;
  color: var(--ar-sub-blue);
  display: grid;
  place-items: center;
}
.ar-sub__filters-head h2 {
  margin: 0;
  font-size: 1rem;
  font-weight: 800;
}
.ar-sub__filters-head p {
  margin: 0.1rem 0 0;
  color: var(--ar-sub-muted);
  font-size: 0.86rem;
}
.ar-sub__filters-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr)) auto;
  gap: 0.75rem;
  align-items: end;
}
.ar-sub__field { display: grid; gap: 0.3rem; margin: 0; }
.ar-sub__field-label {
  font-size: 0.8rem;
  font-weight: 700;
  color: var(--ar-sub-muted);
  display: inline-flex;
  gap: 0.35rem;
  align-items: center;
}
.ar-sub__select,
.ar-sub input.ar-sub__search {
  height: 42px !important;
  border: 1px solid #dbe3ef;
  border-radius: 12px !important;
  padding: 0 0.8rem;
  background: #fff;
  width: 100%;
  font-size: 0.92rem;
  color: var(--ar-sub-navy);
  box-shadow: none;
}
.ar-sub__filters-actions { display: flex; gap: 0.45rem; }
.ar-sub__status {
  display: none;
  align-items: center;
  gap: 0.5rem;
  margin-top: 0.75rem;
  color: var(--ar-sub-navy);
  font-weight: 700;
  font-size: 0.9rem;
}
.ar-sub__status.is-on {
  display: flex;
}
.ar-sub__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 56px minmax(0, 1fr);
  gap: 0.85rem;
  align-items: stretch;
}
.ar-sub__grid--courses {
  grid-template-columns: minmax(0, 1.05fr) 250px minmax(0, 1fr);
}
.ar-sub__mid--courses {
  padding-top: 0.4rem;
  gap: 0.85rem;
  justify-content: flex-start;
}
.ar-sub__letter {
  display: grid;
  gap: 0.35rem;
  margin: 0;
}
.ar-sub__mid-arrows {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.55rem;
}
.ar-sub__btn--move-lg,
.ar-sub__btn--move-lg:hover,
.ar-sub__btn--move-lg:focus {
  width: 48px;
  height: 48px;
  border-radius: 14px;
  background: var(--ar-sub-blue) !important;
  border-color: var(--ar-sub-blue) !important;
  color: #fff !important;
}
.ar-sub__import {
  display: flex;
  align-items: flex-start;
  gap: 0.65rem;
  margin: 0;
  padding: 0.75rem 0.85rem;
  background: #fff;
  border: 1px solid var(--ar-sub-line);
  border-radius: 14px;
  cursor: pointer;
  font-weight: 600;
  color: var(--ar-sub-navy);
}
.ar-sub__import input { margin-top: 0.2rem; flex: 0 0 auto; }
.ar-sub__import span { display: grid; gap: 0.1rem; line-height: 1.25; }
.ar-sub__import strong { font-size: 0.86rem; }
.ar-sub__import small {
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--ar-sub-muted);
}
.ar-sub__mid--courses .ar-sub__btn--success {
  width: 100%;
  justify-content: center;
  margin-top: 0.25rem;
}
.ar-sub__muted { color: var(--ar-sub-muted); font-weight: 600; }
.ar-sub__grip {
  width: 8px;
  height: 14px;
  flex: 0 0 auto;
  background-image: radial-gradient(#94a3b8 1.2px, transparent 1.3px);
  background-size: 4px 4px;
  background-repeat: repeat;
  opacity: 0.85;
}
.ar-sub__table--compact td { white-space: normal; }
.ar-sub__mid {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 0.55rem;
  padding-top: 3.2rem;
}
.ar-sub__panel {
  background: #fff;
  border: 1px solid var(--ar-sub-line);
  border-radius: 18px;
  box-shadow: 0 10px 30px rgba(15, 23, 42, 0.04);
  min-width: 0;
  display: flex;
  flex-direction: column;
}
.ar-sub__panel.is-loading { opacity: 0.55; pointer-events: none; }
.ar-sub__panel-head {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.65rem;
  padding: 1rem 1rem 0.75rem;
}
.ar-sub__panel-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.7rem;
}
.ar-sub__panel-title {
  display: flex;
  gap: 0.65rem;
  align-items: flex-start;
  min-width: 0;
}
.ar-sub__panel-title h3 {
  margin: 0;
  font-size: 1rem;
  font-weight: 800;
}
.ar-sub__panel-title p {
  margin: 0.12rem 0 0;
  color: var(--ar-sub-muted);
  font-size: 0.82rem;
}
.ar-sub__badge {
  display: inline-flex;
  min-width: 1.5rem;
  justify-content: center;
  padding: 0.05rem 0.45rem;
  border-radius: 999px;
  background: #dbeafe;
  color: var(--ar-sub-blue);
  font-size: 0.75rem;
  font-weight: 800;
  margin-left: 0.35rem;
}
.ar-sub__panel-top .ar-sub__btn--danger {
  flex: 0 0 auto;
  white-space: nowrap;
}
.ar-sub__search-wrap {
  position: relative;
  width: 100%;
  min-width: 0;
}
.ar-sub__search-wrap em {
  position: absolute;
  left: 0.7rem;
  top: 50%;
  transform: translateY(-50%);
  color: #94a3b8;
}
.ar-sub__search-wrap input {
  width: 100% !important;
  padding-left: 2rem !important;
  height: 38px !important;
  min-width: 0;
}
.ar-sub__table-wrap {
  overflow: auto;
  min-height: 320px;
  max-height: 520px;
}
.ar-sub__table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.86rem;
}
.ar-sub__table th,
.ar-sub__table td {
  padding: 0.62rem 0.7rem;
  border-bottom: 1px solid #eef2f7;
  text-align: left;
  vertical-align: middle;
  white-space: nowrap;
}
.ar-sub__table th {
  position: sticky;
  top: 0;
  background: #f8fafc;
  color: var(--ar-sub-muted);
  font-size: 0.74rem;
  font-weight: 800;
  letter-spacing: 0.02em;
  z-index: 1;
}
.ar-sub__table th button {
  background: none;
  border: 0;
  padding: 0;
  font: inherit;
  font-weight: 800;
  color: inherit;
  cursor: pointer;
}
.ar-sub__table tbody tr[data-ar-row] { cursor: pointer; }
.ar-sub__table tbody tr:hover { background: #f8fbff; }
.ar-sub__table tbody tr.is-checked { background: #eff6ff; }
.ar-sub__check { width: 36px; }
.ar-sub__check input {
  width: 18px;
  height: 18px;
  margin: 0;
  cursor: pointer;
  vertical-align: middle;
}
.ar-sub__person {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  min-width: 160px;
}
.ar-sub__avatar {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: 0.68rem;
  font-weight: 800;
  flex: 0 0 auto;
}
.ar-sub__avatar--course { background: #dbeafe; color: var(--ar-sub-blue); }
.ar-sub__name { font-weight: 750; color: var(--ar-sub-navy); }
.ar-sub__row-act { width: 36px; text-align: right; }
.ar-sub__icon-btn {
  border: 0;
  background: none;
  color: #94a3b8;
  font-size: 1.1rem;
  cursor: pointer;
  line-height: 1;
}
.ar-sub__icon-btn:hover { color: #e11d48; }
.ar-sub__empty {
  padding: 2rem 1rem;
  text-align: center;
  color: var(--ar-sub-muted);
  font-size: 0.9rem;
}
.ar-sub__pager {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.55rem;
  padding: 0.75rem 1rem 0.95rem;
  color: var(--ar-sub-muted);
  font-size: 0.82rem;
  border-top: 1px solid #eef2f7;
}
.ar-sub__pager select {
  height: 32px !important;
  border-radius: 8px !important;
  border: 1px solid #dbe3ef;
  padding: 0 0.4rem;
}
.ar-sub__pages { display: flex; gap: 0.25rem; }
.ar-sub__pages button {
  min-width: 32px;
  height: 32px;
  border: 0;
  background: transparent;
  border-radius: 8px;
  font-weight: 700;
  color: var(--ar-sub-navy);
  cursor: pointer;
}
.ar-sub__pages button.is-active {
  background: var(--ar-sub-blue);
  color: #fff;
}
.ar-sub__pages button:disabled { opacity: 0.35; cursor: default; }
.ar-sub__btn.is-busy {
  min-width: 200px;
  justify-content: center;
}
.ar-sub__progress {
  margin: 0;
  color: var(--ar-sub-muted);
  font-size: 0.88rem;
  font-weight: 700;
}
.ar-sub__foot {
  position: sticky;
  bottom: 0;
  z-index: 20;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-top: 1rem;
  padding: 0.85rem 0 0.35rem;
  background: linear-gradient(to top, var(--ar-sub-bg) 72%, rgba(244, 247, 251, 0));
}
.ar-sub__tabs {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.15rem;
  background: #fff;
  border: 1px solid var(--ar-sub-line);
  border-radius: 14px;
  padding: 0.4rem 0.55rem;
  margin: 0 0 1rem;
}
.ar-sub__tabs a,
.ar-sub__tabs span {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.45rem 0.75rem;
  border-radius: 10px;
  font-size: 0.86rem;
  font-weight: 700;
  color: var(--ar-sub-blue);
  text-decoration: none !important;
}
.ar-sub__tabs a:hover { background: #f8fafc; color: var(--ar-sub-navy); }
.ar-sub__tabs .is-on {
  color: var(--ar-sub-navy);
  background: #f1f5f9;
}
.ar-sub__search-row {
  display: flex;
  gap: 0.45rem;
  align-items: center;
}
.ar-sub__search-row .ar-sub__search-wrap { flex: 1; min-width: 0; }
.ar-sub__search-row .ar-sub__btn {
  padding: 8px 14px;
  font-size: 13px;
  white-space: nowrap;
  border-radius: 12px;
}
.ar-sub__panel-total {
  margin: 0;
  padding: 0.55rem 1rem 0.9rem;
  color: var(--ar-sub-muted);
  font-size: 0.86rem;
  font-weight: 700;
}
.ar-sub__advanced {
  background: #fff;
  border: 1px solid var(--ar-sub-line);
  border-radius: 16px;
  padding: 0.85rem 1rem;
  margin-bottom: 1rem;
}
.ar-sub__relation {
  margin: 0 0 1rem;
  max-width: 320px;
}
.ar-subscribe-spinner {
  width: 16px;
  height: 16px;
  border: 2px solid #cbd5e1;
  border-top-color: var(--ar-sub-blue);
  border-radius: 50%;
  display: inline-block;
  animation: arSubscribeSpin .7s linear infinite;
}
@keyframes arSubscribeSpin { to { transform: rotate(360deg); } }

@media (max-width: 1100px) {
  .ar-sub__filters-grid { grid-template-columns: 1fr 1fr; }
  .ar-sub__filters-actions { grid-column: 1 / -1; }
  .ar-sub__grid,
  .ar-sub__grid--courses { grid-template-columns: 1fr; }
  .ar-sub__mid {
    padding-top: 0;
    flex-direction: row;
    justify-content: center;
  }
  .ar-sub__mid--courses { flex-direction: column; }
}
@media (max-width: 700px) {
  .ar-sub__filters-grid { grid-template-columns: 1fr; }
  .ar-sub__panel-head { flex-direction: column; }
}

@media (max-width: 1200px) {
  .ar-fw-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 1024px) {
  .ar-fw-two-col,
  .ar-fw-variants { grid-template-columns: 1fr; }
  .ar-fw-sticky,
  .ar-fw-variant-form { position: static; }
}

@media (max-width: 767px) {
  .ar-fw-kpis,
  .ar-fw-grid,
  .ar-fw-dynamic-panel,
  .ar-fw-courses,
  .ar-fw-variant__meta { grid-template-columns: 1fr; }
  .ar-fw-toolbar { flex-direction: column; align-items: stretch; }
  .ar-fw-toolbar__filters > * { width: 100%; }
  .ar-fw-search input { min-width: 0; width: 100%; }
  .ar-fw-table__actions { text-align: left; }
}

.ar-ruta-head {
  margin-bottom: 1.1rem;
}
.ar-ruta-head__crumb {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem;
  margin: 0 0 0.85rem;
  color: #94a3b8;
  font-size: 0.86rem;
  font-weight: 700;
}
.ar-ruta-head__crumb a {
  color: #64748b;
  text-decoration: none;
}
.ar-ruta-head__crumb a:hover { color: var(--ar-blue); }
.ar-ruta-head__crumb strong { color: var(--ar-blue); font-weight: 800; }
.ar-ruta-head__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
}
.ar-ruta-head__title {
  display: flex;
  align-items: center;
  gap: 0.9rem;
}
.ar-ruta-head__icon {
  width: 48px;
  height: 48px;
  border: 0;
  border-radius: 999px;
  background: #e8f1ff;
  color: var(--ar-blue);
  font-size: 1.15rem;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.ar-ruta-head h1 {
  margin: 0;
  font-size: clamp(1.45rem, 2.2vw, 1.85rem);
  font-weight: 800;
  color: var(--ar-navy);
  letter-spacing: -0.02em;
}
.ar-ruta-head p {
  margin: 0.2rem 0 0;
  color: var(--ar-muted);
  font-weight: 500;
}
.ar-ruta-head__docs {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  height: 42px;
  padding: 0 1rem;
  border: 1px solid #d7deea;
  border-radius: 12px;
  background: #fff;
  color: var(--ar-navy) !important;
  font-weight: 800;
  text-decoration: none !important;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}
.ar-ruta-head__docs:hover { border-color: var(--ar-blue); color: var(--ar-blue) !important; }

.ar-ruta-mig { max-width: 100%; }
.ar-ruta-mig__flash { margin-bottom: 1rem; }
.ar-ruta-mig__alert {
  display: flex;
  gap: 0.85rem;
  align-items: flex-start;
  background: #eef5ff;
  border: 1px solid #d6e6ff;
  border-radius: 16px;
  padding: 0.95rem 1.1rem;
  margin-bottom: 1rem;
  color: #1e3a5f;
}
.ar-ruta-mig__alert-icon {
  width: 28px;
  height: 28px;
  border-radius: 999px;
  background: #2b6cb0;
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-size: 0.85rem;
}
.ar-ruta-mig__alert strong { display: block; font-size: 0.98rem; }
.ar-ruta-mig__alert p { margin: 0.15rem 0 0; font-weight: 500; line-height: 1.45; }

.ar-ruta-mig__top {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 280px;
  gap: 1rem;
  margin-bottom: 1rem;
}
.ar-ruta-mig__card {
  background: #fff;
  border: 1px solid #e8eef5;
  border-radius: 20px;
  padding: 1.15rem 1.2rem 1.25rem;
  box-shadow: 0 2px 10px rgba(16, 24, 40, 0.05);
}
.ar-ruta-mig__step {
  display: flex;
  gap: 0.75rem;
  align-items: flex-start;
}
.ar-ruta-mig__step h2 {
  margin: 0 0 0.15rem;
  font-size: 1.05rem;
  color: var(--ar-navy);
}
.ar-ruta-mig__step p {
  margin: 0;
  color: var(--ar-muted);
  font-weight: 500;
}
.ar-ruta-mig__step-n {
  flex: 0 0 1.7rem;
  width: 1.7rem;
  height: 1.7rem;
  border-radius: 999px;
  background: var(--ar-navy);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  font-size: 0.85rem;
}
.ar-ruta-mig__dest-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(240px, 0.85fr);
  gap: 1rem;
  margin-top: 1rem;
  align-items: start;
}
.ar-ruta-mig__dest {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  margin: 0;
  font-weight: 800;
  color: var(--ar-navy);
  font-size: 0.9rem;
}
.ar-ruta-mig__dest em { color: #ef4444; font-style: normal; }
.ar-ruta-mig__dest select {
  width: 100%;
  min-height: 46px;
  border: 1px solid #d7deea;
  border-radius: 12px;
  padding: 0.5rem 0.8rem;
  font-family: inherit;
  font-weight: 600;
  color: var(--ar-navy);
  background: #fff;
}
.ar-ruta-mig__courses {
  background: #f7faff;
  border: 1px solid #e4edf8;
  border-radius: 16px;
  padding: 0.85rem 1rem;
}
.ar-ruta-mig__courses-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 0.55rem;
  color: var(--ar-navy);
  font-weight: 800;
  font-size: 0.9rem;
}
.ar-ruta-mig__courses-head .fa { color: #3b82f6; margin-right: 0.25rem; }
.ar-ruta-mig__courses-head b {
  color: #2563eb;
  font-size: 0.82rem;
  font-weight: 800;
}
.ar-ruta-mig__courses-hint {
  margin: 0 0 0.45rem;
  font-size: 0.8rem;
  color: var(--ar-muted);
  font-weight: 500;
  line-height: 1.35;
}
.ar-ruta-mig__courses-tools {
  display: flex;
  gap: 0.4rem;
  margin-bottom: 0.45rem;
}
.ar-ruta-mig__courses-tools button {
  border: 1px solid #cfe0f5;
  background: #fff;
  color: #2563eb;
  font: inherit;
  font-size: 0.78rem;
  font-weight: 700;
  border-radius: 999px;
  padding: 0.18rem 0.7rem;
  cursor: pointer;
}
.ar-ruta-mig__courses-tools button:hover { background: #eef5ff; }
.ar-ruta-mig__courses ol {
  margin: 0;
  padding: 0;
  list-style: none;
  color: #334155;
  font-weight: 600;
  font-size: 0.92rem;
}
.ar-ruta-mig__courses li + li { margin-top: 0.2rem; }
.ar-ruta-mig__courses li label {
  display: flex;
  align-items: flex-start;
  gap: 0.45rem;
  cursor: pointer;
  font-weight: 600;
}
.ar-ruta-mig__courses li input {
  margin: 0.2rem 0 0;
  flex: 0 0 auto;
}
.ar-ruta-mig__courses li.is-empty {
  list-style: none;
  color: var(--ar-muted);
  font-weight: 500;
}

.ar-ruta-mig__exclude {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.75rem 1rem;
  margin: 0 0 1rem;
  padding: 0.85rem 1rem;
  background: #f8fafc;
  border: 1px solid #e4edf8;
  border-radius: 14px;
}
.ar-ruta-mig__exclude p {
  grid-column: 1 / -1;
  margin: 0;
  font-weight: 800;
  color: var(--ar-navy);
  font-size: 0.9rem;
}
.ar-ruta-mig__exclude p small {
  display: inline-block;
  margin-left: 0.4rem;
  font-weight: 500;
  color: var(--ar-muted);
}
.ar-ruta-mig__exclude label {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  font-size: 0.78rem;
  font-weight: 700;
  color: #475569;
}
.ar-ruta-mig__exclude select {
  width: 100%;
  min-height: 88px;
  border: 1px solid #d7deea;
  border-radius: 10px;
  padding: 0.35rem;
  font: inherit;
  font-weight: 600;
  color: var(--ar-navy);
  background: #fff;
}
@media (max-width: 900px) {
  .ar-ruta-mig__exclude { grid-template-columns: 1fr; }
}
.ar-ruta-mig__help {
  background: #eef5ff;
  border: 1px solid #d6e6ff;
  border-radius: 20px;
  padding: 1.05rem 1.1rem 1.15rem;
}
.ar-ruta-mig__help h2 {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin: 0 0 0.85rem;
  font-size: 1rem;
  color: var(--ar-navy);
}
.ar-ruta-mig__help h2 span {
  width: 22px;
  height: 22px;
  border-radius: 999px;
  background: #2563eb;
  color: #fff;
  font-size: 0.78rem;
  font-weight: 800;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.ar-ruta-mig__help ol {
  list-style: none;
  margin: 0;
  padding: 0;
}
.ar-ruta-mig__help li {
  display: flex;
  gap: 0.55rem;
  align-items: flex-start;
  color: #334155;
  font-weight: 600;
  font-size: 0.9rem;
  line-height: 1.35;
}
.ar-ruta-mig__help li + li { margin-top: 0.65rem; }
.ar-ruta-mig__help b {
  flex: 0 0 1.35rem;
  width: 1.35rem;
  height: 1.35rem;
  border-radius: 999px;
  background: #dbeafe;
  color: #1d4ed8;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.75rem;
}

.ar-ruta-mig__origins-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1rem;
  margin-bottom: 1rem;
}
.ar-ruta-mig__toolbar {
  display: grid;
  grid-template-columns: minmax(220px, 1.5fr) repeat(3, minmax(140px, 0.8fr)) auto;
  gap: 0.7rem;
  align-items: end;
  margin: 0 0 1rem;
}
.ar-ruta-mig__toolbar label {
  display: flex;
  flex-direction: column;
  gap: 0.28rem;
  margin: 0;
  font-weight: 700;
  color: #64748b;
  font-size: 0.78rem;
}
.ar-ruta-mig__search { position: relative; }
.ar-ruta-mig__search .fa {
  position: absolute;
  left: 0.75rem;
  top: 50%;
  transform: translateY(-50%);
  color: #94a3b8;
}
.ar-ruta-mig__toolbar input,
.ar-ruta-mig__toolbar select {
  width: 100%;
  min-height: 42px;
  border: 1px solid #d7deea;
  border-radius: 12px;
  padding: 0.4rem 0.7rem;
  font-family: inherit;
  font-weight: 600;
  color: var(--ar-navy);
  background: #fff;
}
.ar-ruta-mig__search input { padding-left: 2.1rem; }
.ar-ruta-mig__clear {
  height: 42px;
  border: 1px solid #d7deea;
  border-radius: 12px;
  background: #fff;
  color: var(--ar-navy);
  font-weight: 800;
  font-family: inherit;
  padding: 0 0.9rem;
  white-space: nowrap;
  cursor: pointer;
}
.ar-ruta-mig__clear:hover { border-color: var(--ar-blue); color: var(--ar-blue); }

.ar-ruta-mig__kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.75rem;
  list-style: none;
  margin: 0 0 1rem;
  padding: 0;
}
.ar-ruta-mig__kpis li {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  background: #f8fafc;
  border: 1px solid #eef2f7;
  border-radius: 16px;
  padding: 0.85rem 1rem;
}
.ar-ruta-mig__kpis strong {
  display: block;
  color: var(--ar-navy);
  font-size: 1.35rem;
  line-height: 1.1;
}
.ar-ruta-mig__kpis small {
  display: block;
  color: var(--ar-muted);
  font-weight: 600;
  font-size: 0.78rem;
  line-height: 1.25;
  margin-top: 0.15rem;
}
.ar-ruta-mig__kpi-icon {
  width: 42px;
  height: 42px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-size: 1.05rem;
}
.ar-ruta-mig__kpi-icon.is-blue { background: #e8f0fe; color: #2563eb; }
.ar-ruta-mig__kpi-icon.is-green { background: #ecfdf3; color: #16a34a; }
.ar-ruta-mig__kpi-icon.is-teal { background: #e6fbf4; color: #0f9f7a; }
.ar-ruta-mig__kpi-icon.is-violet { background: #f3e8ff; color: #7c3aed; }

.ar-ruta-mig__table-wrap {
  overflow: auto;
  background: #fff;
  border: 1px solid #eef2f7;
  border-radius: 14px;
}
.ar-ruta-mig__table {
  width: 100%;
  border-collapse: collapse;
}
.ar-ruta-mig__table th,
.ar-ruta-mig__table td {
  padding: 0.75rem 0.85rem;
  text-align: left;
  border-bottom: 1px solid #eef2f7;
  vertical-align: middle;
  color: var(--ar-navy);
  font-weight: 600;
}
.ar-ruta-mig__table th {
  font-size: 0.72rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #94a3b8;
  background: #fff;
  font-weight: 800;
}
.ar-ruta-mig__table small {
  display: block;
  color: var(--ar-muted);
  font-weight: 500;
}
.ar-ruta-mig__table tr.is-empty td {
  text-align: center;
  color: var(--ar-muted);
  padding: 1.4rem 0.85rem;
  font-weight: 600;
}
.ar-ruta-mig__table tr.is-copiar td:last-child { color: #1d4ed8; font-weight: 800; }
.ar-ruta-mig__table tr.is-ya_ok td:last-child { color: #15803d; font-weight: 800; }
.ar-ruta-mig__table tr.is-sin_avance td:last-child,
.ar-ruta-mig__table tr.is-sin_curso_destino td:last-child { color: #94a3b8; }
.ar-ruta-mig__match {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  white-space: nowrap;
}
.ar-ruta-mig__bar {
  display: inline-block;
  width: 88px;
  height: 8px;
  background: #e2e8f0;
  border-radius: 99px;
  overflow: hidden;
}
.ar-ruta-mig__bar i {
  display: block;
  height: 100%;
  background: #22c55e;
}
.ar-ruta-mig__detail {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  height: 34px;
  padding: 0 0.8rem;
  border: 1px solid #d7deea;
  border-radius: 999px;
  background: #fff;
  color: var(--ar-navy);
  font-weight: 800;
  font-family: inherit;
  cursor: pointer;
  white-space: nowrap;
}
.ar-ruta-mig__detail:hover { border-color: var(--ar-blue); color: var(--ar-blue); }

.ar-ruta-mig__pager {
  display: flex;
  justify-content: space-between;
  gap: 0.75rem;
  align-items: center;
  margin: 0.85rem 0 0;
  color: var(--ar-muted);
  font-weight: 600;
  flex-wrap: wrap;
}
.ar-ruta-mig__pages {
  display: flex;
  gap: 0.35rem;
}
.ar-ruta-mig__pager button {
  min-width: 34px;
  height: 34px;
  border: 0;
  background: transparent;
  color: #64748b;
  font-weight: 800;
  font-family: inherit;
  border-radius: 10px;
  cursor: pointer;
}
.ar-ruta-mig__pager button.is-active {
  background: var(--ar-navy);
  color: #fff;
}
.ar-ruta-mig__pager button:disabled {
  color: #cbd5e1;
  cursor: default;
}

.ar-ruta-mig__clock {
  margin: 0.45rem 0 0;
  font-weight: 800;
  color: var(--ar-navy);
  font-variant-numeric: tabular-nums;
}
.ar-ruta-mig__log {
  margin-top: 0.75rem;
  background: #0b1f3a;
  color: #e2e8f0;
  border-radius: 12px;
  padding: 0.7rem 0.85rem;
}
.ar-ruta-mig__log strong {
  display: block;
  margin-bottom: 0.45rem;
  color: #fff;
  font-size: 0.82rem;
}
.ar-ruta-mig__log ol {
  list-style: none;
  margin: 0;
  padding: 0;
  max-height: 220px;
  overflow: auto;
  font-size: 0.8rem;
  font-weight: 600;
  line-height: 1.4;
}
.ar-ruta-mig__log li {
  display: flex;
  gap: 0.65rem;
  padding: 0.22rem 0;
  border-top: 1px solid rgba(255,255,255,0.08);
}
.ar-ruta-mig__log time {
  flex: 0 0 4.4rem;
  color: #93c5fd;
  font-variant-numeric: tabular-nums;
}
.ar-ruta-mig__log li.is-ok span { color: #86efac; }
.ar-ruta-mig__log li.is-warn span { color: #fde68a; }
.ar-ruta-mig__log li.is-error span { color: #fca5a5; }
.ar-ruta-mig__log li.is-time span { color: #7dd3fc; }
.ar-ruta-mig__copy-actions {
  display: flex;
  gap: 0.5rem;
  align-items: center;
  margin-left: auto;
}
.ar-ruta-mig__stop {
  height: 42px;
  padding: 0 1rem;
  border: 1px solid #d7deea;
  border-radius: 999px;
  background: #fff;
  color: var(--ar-navy);
  font-weight: 800;
  font-family: inherit;
  cursor: pointer;
}
.ar-ruta-mig__copy {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.85rem;
  margin: 1.1rem 0 0.35rem;
  padding-top: 0.9rem;
  border-top: 1px solid #eef2f7;
}
.ar-ruta-mig__confirm {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin: 0;
  font-weight: 600;
  color: var(--ar-navy);
}
.ar-ruta-mig__copy-note {
  margin: 0;
  color: var(--ar-muted);
  font-weight: 600;
  font-size: 0.88rem;
}
.ar-ruta-mig__progress { margin-top: 0.75rem; }
.ar-ruta-mig__progress-bar {
  height: 8px;
  background: #e8eef5;
  border-radius: 99px;
  overflow: hidden;
}
.ar-ruta-mig__progress-bar span {
  display: block;
  height: 100%;
  width: 0;
  background: #1d4ed8;
  transition: width 0.2s ease;
}
.ar-ruta-mig__progress.is-busy .ar-ruta-mig__progress-bar span {
  background: linear-gradient(90deg, #1d4ed8 0%, #60a5fa 50%, #1d4ed8 100%);
  background-size: 200% 100%;
  animation: ar-ruta-mig-bar 1.1s linear infinite;
}
@keyframes ar-ruta-mig-bar {
  from { background-position: 100% 0; }
  to { background-position: -100% 0; }
}
.ar-ruta-mig__progress p {
  margin: 0.45rem 0 0;
  font-weight: 600;
  color: var(--ar-muted);
}
.ar-ruta-mig__progress-msg {
  margin-top: 0.65rem;
  border-radius: 12px;
  padding: 0.7rem 0.85rem;
  font-weight: 700;
  line-height: 1.4;
}
.ar-ruta-mig__progress-msg.is-ok {
  background: #ecfdf3;
  color: #067647;
}
.ar-ruta-mig__progress-msg.is-error {
  background: #fef3f2;
  color: #b42318;
}

.ar-ruta-mig-modal {
  position: fixed;
  inset: 0;
  background: rgba(15, 23, 42, 0.45);
  z-index: 1200;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: 4vh 1rem 2rem;
  overflow: auto;
}
.ar-ruta-mig-modal[hidden] { display: none; }
.ar-ruta-mig-modal__box {
  width: min(1100px, 100%);
  background: #fff;
  border-radius: 18px;
  padding: 1rem 1.1rem 1.15rem;
  box-shadow: 0 20px 50px rgba(15, 23, 42, 0.2);
}
.ar-ruta-mig-modal__box--docs { width: min(640px, 100%); }
.ar-ruta-mig-modal__box header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  margin-bottom: 0.35rem;
}
.ar-ruta-mig-modal__box h3 { margin: 0; color: var(--ar-navy); }
.ar-ruta-mig-modal__sub {
  margin: 0 0 0.85rem;
  color: var(--ar-muted);
  font-weight: 600;
}
.ar-ruta-mig-modal__close {
  border: 0;
  background: #f1f5f9;
  width: 2rem;
  height: 2rem;
  border-radius: 999px;
  font-size: 1.3rem;
  line-height: 1;
  cursor: pointer;
  color: var(--ar-navy);
}
.ar-ruta-mig-modal footer { margin-top: 0.9rem; }
.ar-ruta-mig-docs { color: #334155; font-weight: 500; line-height: 1.5; }
.ar-ruta-mig-docs ul { margin: 0.7rem 0 0; padding-left: 1.1rem; }

@media (max-width: 1200px) {
  .ar-ruta-mig__top { grid-template-columns: 1fr; }
  .ar-ruta-mig__toolbar { grid-template-columns: 1fr 1fr; }
  .ar-ruta-mig__kpis { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 800px) {
  .ar-ruta-mig__dest-grid,
  .ar-ruta-mig__toolbar,
  .ar-ruta-mig__kpis { grid-template-columns: 1fr; }
  .ar-ruta-mig__origins-head { flex-direction: column; }
}

/* ---- Coordinador Académico ---- */
.ar-coord { max-width: 1120px; margin: 0 auto; padding: 8px 0 32px; font-family: var(--ar-font); color: var(--ar-text); }
.ar-coord__head { display: flex; gap: 16px; align-items: flex-start; margin-bottom: 24px; }
.ar-coord__mark { flex: 0 0 48px; width: 48px; height: 48px; border-radius: 14px; background: #e8f0ff; color: var(--ar-blue); display: grid; place-items: center; font-size: 22px; }
.ar-coord__head h1 { margin: 0 0 6px; font-size: 26px; font-weight: 800; color: var(--ar-navy); }
.ar-coord__head p { margin: 0; font-size: 14px; line-height: 1.55; color: var(--ar-muted); max-width: 760px; }
.ar-coord__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 16px; }
.ar-coord__card { display: flex; flex-direction: column; gap: 6px; padding: 20px; background: var(--ar-card); border: 1px solid var(--ar-border); border-radius: var(--ar-radius); box-shadow: var(--ar-shadow); color: var(--ar-text); text-decoration: none; transition: transform .15s ease, border-color .15s ease; }
.ar-coord__card:hover, .ar-coord__card:focus { transform: translateY(-2px); border-color: var(--ar-blue); color: var(--ar-text); text-decoration: none; }
.ar-coord__card strong { font-size: 16px; font-weight: 700; color: var(--ar-navy); }
.ar-coord__card > span:last-child { font-size: 13px; line-height: 1.5; color: var(--ar-muted); }
.ar-coord__icon { width: 40px; height: 40px; border-radius: 12px; background: #fff7d6; color: #b58a00; display: grid; place-items: center; font-size: 18px; margin-bottom: 6px; }
.ar-coord__assign { background: var(--ar-card); border: 1px solid var(--ar-border); border-radius: var(--ar-radius); padding: 18px 20px; margin-bottom: 20px; }
.ar-coord__assign label { display: block; font-size: 13px; font-weight: 700; color: var(--ar-navy); margin-bottom: 8px; }
.ar-coord__assign-row { display: flex; gap: 10px; }
.ar-coord__assign-row input { flex: 1 1 auto; height: 40px; padding: 0 14px; border: 1px solid var(--ar-border); border-radius: 10px; font-size: 14px; }
.ar-coord__assign-row .btn { height: 40px; border-radius: 10px; padding: 0 18px; }
.ar-coord__table { background: var(--ar-card); border-radius: var(--ar-radius-sm); }
.ar-coord__table td, .ar-coord__table th { vertical-align: middle !important; font-size: 13px; }
@media (max-width: 767px) {
  .ar-coord__assign-row { flex-direction: column; }
}

/* ---- Coordinador: sugerencias al asignar ---- */
.ar-coord__combo { position: relative; flex: 1 1 auto; display: flex; }
.ar-coord__combo input { width: 100%; }
.ar-coord__suggest { position: absolute; z-index: 30; top: calc(100% + 6px); left: 0; right: 0; margin: 0; padding: 6px; list-style: none; background: #fff; border: 1px solid var(--ar-border); border-radius: 12px; box-shadow: var(--ar-shadow); max-height: 320px; overflow-y: auto; }
.ar-coord__suggest li[data-index] { display: flex; flex-direction: column; gap: 2px; padding: 8px 10px; border-radius: 8px; cursor: pointer; }
.ar-coord__suggest li[data-index]:hover, .ar-coord__suggest li.is-active { background: #eef4ff; }
.ar-coord__suggest li strong { font-size: 14px; color: var(--ar-navy); }
.ar-coord__suggest li span { font-size: 12px; color: var(--ar-muted); }
.ar-coord__suggest-empty { padding: 10px; font-size: 13px; color: var(--ar-muted); }

.ar-rp-card {
  background: var(--ar-card);
  border: 1px solid var(--ar-border);
  border-radius: var(--ar-radius);
  padding: 20px 22px;
  max-width: 560px;
  box-shadow: var(--ar-shadow);
}
.ar-rp-user {
  display: flex;
  flex-direction: column;
  gap: 2px;
  margin-bottom: 18px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--ar-border);
}
.ar-rp-user strong { font-size: 17px; color: var(--ar-navy); }
.ar-rp-user span { font-size: 13px; color: var(--ar-muted); }
.ar-rp-form label {
  display: block;
  font-size: 13px;
  font-weight: 700;
  color: var(--ar-navy);
  margin-bottom: 8px;
}
.ar-rp-pass-row { display: flex; gap: 10px; align-items: center; }
.ar-rp-pass-row input {
  flex: 1 1 auto;
  height: 42px;
  padding: 0 14px;
  border: 1px solid var(--ar-border);
  border-radius: 10px;
  font-size: 15px;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}
.ar-rp-pass-row .btn { height: 42px; border-radius: 10px; }
.ar-rp-hint { margin: 10px 0 0; font-size: 13px; color: var(--ar-muted); line-height: 1.45; }
.ar-rp-copy-msg {
  margin: 8px 0 0;
  font-size: 13px;
  font-weight: 600;
  color: #1b7a3d;
}
.ar-rp-scope {
  margin: 8px 0 0;
  font-size: 13px;
  color: var(--ar-muted);
  line-height: 1.45;
}
.ar-rp-scope--warn { color: #a15c00; }
.ar-rp-actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 18px; }
.ar-rp-combo { position: relative; z-index: 20; }
.ar-rp-suggest {
  z-index: 50 !important;
  max-height: 360px;
}
.ar-rp-status {
  margin: 10px 0 0;
  font-size: 13px;
  color: var(--ar-muted);
}
.ar-rp-results {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 14px;
  max-width: 640px;
}
.ar-rp-result {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  width: 100%;
  text-align: left;
  padding: 12px 14px;
  border: 1px solid var(--ar-border);
  border-radius: 12px;
  background: #fff;
  cursor: pointer;
  transition: border-color .15s ease, background .15s ease;
}
.ar-rp-result:hover,
.ar-rp-result:focus {
  border-color: var(--ar-blue);
  background: #eef4ff;
  outline: none;
}
.ar-rp-result strong { font-size: 14px; color: var(--ar-navy); }
.ar-rp-result span { font-size: 12px; color: var(--ar-muted); }
@media (max-width: 640px) {
  .ar-rp-pass-row { flex-direction: column; align-items: stretch; }
}

/* ---- Seguimientos: presupuesto de WhatsApp ---- */
.ar-fw-tabs__badge--warning { background: #d97706; }
.ar-fw-tabs__badge--exhausted { background: #dc2626; }
.ar-fw-budget-alert { display: flex; align-items: center; gap: 0.7rem; padding: 0.75rem 1rem; border-radius: var(--ar-radius-sm); font-size: 0.95rem; }
.ar-fw-budget-alert--warning { background: #fff7ed; color: #9a3412; border: 1px solid #fed7aa; }
.ar-fw-budget-alert--exhausted { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.ar-fw-budget-alert span { flex: 1 1 auto; }
.ar-fw-budget-alert a { font-weight: 700; white-space: nowrap; color: inherit; text-decoration: underline; }
.ar-fw-budget .ar-fw-two-col { display: grid; gap: 1rem; }
.ar-fw-budget__main { display: grid; gap: 1rem; }
.ar-fw-budget__hero { padding: 1.3rem 1.4rem; }
.ar-fw-budget__hero-top { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; flex-wrap: wrap; }
.ar-fw-budget__eyebrow { display: block; font-size: 0.8rem; font-weight: 700; letter-spacing: 0.02em; text-transform: uppercase; color: var(--ar-muted); }
.ar-fw-budget__hero h2 { margin: 0.3rem 0; font-size: 2rem; font-weight: 800; color: var(--ar-navy); }
.ar-fw-budget__hero h2 small { font-size: 1rem; font-weight: 600; color: var(--ar-muted); }
.ar-fw-budget__hero p { margin: 0; color: var(--ar-muted); font-size: 0.92rem; }
.ar-fw-budget__state { padding: 0.35rem 0.8rem; border-radius: 999px; font-size: 0.85rem; font-weight: 700; white-space: nowrap; }
.ar-fw-budget__state--ok { background: #ecfdf3; color: #067647; }
.ar-fw-budget__state--warning { background: #fff7ed; color: #b45309; }
.ar-fw-budget__state--exhausted { background: #fef2f2; color: #b91c1c; }
.ar-fw-budget__state--off { background: #f1f5f9; color: #475569; }
.ar-fw-budget__bar { position: relative; height: 14px; margin-top: 1rem; border-radius: 999px; background: #eef2f7; overflow: visible; }
.ar-fw-budget__bar > span { display: block; height: 100%; border-radius: 999px; background: linear-gradient(90deg, #22c55e, #16a34a); transition: width .4s ease; }
.ar-fw-budget__hero--warning .ar-fw-budget__bar > span { background: linear-gradient(90deg, #f59e0b, #d97706); }
.ar-fw-budget__hero--exhausted .ar-fw-budget__bar > span { background: linear-gradient(90deg, #ef4444, #b91c1c); }
.ar-fw-budget__hero--off .ar-fw-budget__bar > span { background: #94a3b8; }
.ar-fw-budget__bar > i { position: absolute; top: -4px; bottom: -4px; width: 2px; background: var(--ar-navy); opacity: 0.35; }
.ar-fw-budget__bar-legend { display: flex; justify-content: space-between; margin-top: 0.45rem; font-size: 0.8rem; color: var(--ar-muted); font-weight: 600; }
.ar-fw-kpi__value.is-over { color: #b91c1c; }
.ar-fw-budget__days { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.35rem; max-height: 420px; overflow-y: auto; }
.ar-fw-budget__days li { display: grid; grid-template-columns: 4.2rem minmax(0, 1fr) 8.5rem; align-items: center; gap: 0.6rem; font-size: 0.85rem; }
.ar-fw-budget__day-label { color: var(--ar-muted); font-weight: 600; }
.ar-fw-budget__day-bar { height: 10px; border-radius: 999px; background: #f1f5f9; overflow: hidden; }
.ar-fw-budget__day-bar span { display: block; height: 100%; background: var(--ar-blue); border-radius: 999px; }
.ar-fw-budget__day-value { text-align: right; color: var(--ar-navy); font-weight: 600; }
.ar-fw-budget__origin { list-style: none; margin: 0 0 0.75rem; padding: 0; display: grid; gap: 0.5rem; }
.ar-fw-budget__origin li { display: flex; justify-content: space-between; gap: 0.5rem; font-size: 0.9rem; padding-bottom: 0.5rem; border-bottom: 1px solid var(--ar-border); }
.ar-fw-budget__origin li:last-child { border-bottom: 0; }
@media (max-width: 1100px) {
  .ar-fw-budget .ar-fw-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ar-fw-budget .ar-fw-two-col { grid-template-columns: 1fr; }
}

/* Orden manual de cursos en la sesión (arrastrar y soltar + A-Z / Z-A) */
.ar-sub__order {
  display: grid;
  gap: 0.35rem;
  margin: 0.6rem 0 0;
}
.ar-sub__order small {
  color: var(--ar-sub-muted);
  font-size: 0.75rem;
}
.ar-sub__table tr[draggable="true"] { cursor: grab; }
.ar-sub__table tr[draggable="true"]:active { cursor: grabbing; }
.ar-sub__table tr.is-dragging { opacity: 0.45; }
.ar-sub__table tr.is-drop-before td { box-shadow: inset 0 2px 0 var(--ar-blue, #1d4ed8); }
.ar-sub__table tr.is-drop-after td { box-shadow: inset 0 -2px 0 var(--ar-blue, #1d4ed8); }


/* ---------- En vivo: activación (público, aviso), avisos y conversación ---------- */
.ar-lv-setup { display: block; }
.ar-lv-setup > .ar-lv-admin__status { margin-bottom: 0.4rem; }
.ar-lv-setup__title { margin: 0.2rem 0 0.9rem; font-size: 1.15rem; font-weight: 800; color: #0f172a; }
.ar-lv-setup .ar-lv-admin__error { margin-bottom: 0.8rem; }
.ar-lv-setup__row { display: flex; flex-wrap: wrap; gap: 0.75rem; margin-bottom: 0.9rem; }
.ar-lv-setup__field { display: flex; flex-direction: column; gap: 0.3rem; flex: 1 1 240px; margin: 0; font-weight: 700; font-size: 0.82rem; color: #334155; }
.ar-lv-setup__field input,
.ar-lv-setup__field select,
.ar-lv-setup__field textarea,
.ar-lv-setup__detail > select,
.ar-lv-setup__filter {
  width: 100%;
  padding: 0.55rem 0.8rem;
  border: 1px solid #d5dde8;
  border-radius: 10px;
  font-size: 0.88rem;
  font-weight: 400;
  background: #fff;
}
.ar-lv-setup__field textarea { resize: vertical; line-height: 1.5; }
.ar-lv-setup__group { border: 1px solid #e8eef5; border-radius: 12px; padding: 0.8rem 1rem 0.9rem; margin: 0 0 0.9rem; }
.ar-lv-setup__group legend { width: auto; border: 0; margin: 0; padding: 0 0.4rem; font-size: 0.9rem; font-weight: 800; color: #0f172a; }
.ar-lv-setup__options { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.ar-lv-option { display: inline-flex; align-items: center; gap: 0.45rem; margin: 0; padding: 0.45rem 0.8rem; border: 1px solid #d5dde8; border-radius: 999px; font-size: 0.84rem; font-weight: 600; color: #334155; cursor: pointer; background: #fff; }
.ar-lv-option input { margin: 0; }
.ar-lv-option:has(input:checked) { border-color: #2563eb; background: #eff6ff; color: #1d4ed8; }
.ar-lv-setup__detail { margin-top: 0.8rem; }
.ar-lv-setup__detail[hidden] { display: none !important; }
.ar-lv-setup__detail > select { padding: 0.3rem; }
.ar-lv-setup__filter { margin-bottom: 0.4rem; }
.ar-lv-setup__detail small { display: block; margin-top: 0.35rem; color: #64748b; font-size: 0.78rem; }
.ar-lv-setup__detail code { background: #f1f5f9; padding: 0 0.3rem; border-radius: 4px; color: #0f172a; }
.ar-lv-setup__count { margin: 0.7rem 0 0; font-size: 0.84rem; font-weight: 700; color: #15803d; }
.ar-lv-setup__count.is-warn { color: #b45309; }
.ar-lv-setup .ar-lv-admin__actions { justify-content: flex-end; flex-wrap: wrap; }

.ar-lv-admin__summary { flex-basis: 100%; display: flex; flex-wrap: wrap; gap: 0.4rem 1.2rem; font-size: 0.84rem; color: #475569; }
.ar-lv-admin__summary .fa { color: #94a3b8; margin-right: 0.2rem; }
.ar-lv-notify { flex-basis: 100%; }
.ar-lv-notify__text { font-size: 0.84rem; font-weight: 700; color: #334155; margin-bottom: 0.35rem; }
.ar-lv-notify__bar { height: 8px; background: #e2e8f0; border-radius: 999px; overflow: hidden; }
.ar-lv-notify__bar span { display: block; height: 100%; background: #22c55e; transition: width 0.3s; }
.ar-lv-notify__hint { margin: 0.35rem 0 0; font-size: 0.78rem; color: #64748b; }
.ar-lv-notify__hint.is-warn { color: #b91c1c; font-weight: 600; }

.ar-lv-player__spacer { flex: 1 1 auto; }

.ar-nav__item--live a { color: #dc2626 !important; font-weight: 800; }
.ar-nav__item--live a:hover { background: #fef2f2 !important; }
.ar-nav__live-dot {
  flex: 0 0 auto;
  width: 10px;
  height: 10px;
  margin: 0 0.35rem 0 0.2rem;
  border-radius: 50%;
  background: #ef4444;
  box-shadow: 0 0 0 0 rgba(239, 68, 68, 0.6);
  animation: ar-live-pulse 1.6s infinite;
}
@keyframes ar-live-pulse {
  0% { box-shadow: 0 0 0 0 rgba(239, 68, 68, 0.6); }
  70% { box-shadow: 0 0 0 8px rgba(239, 68, 68, 0); }
  100% { box-shadow: 0 0 0 0 rgba(239, 68, 68, 0); }
}
.ar-app.is-sidebar-collapsed .ar-nav__item--live a .ar-nav__live-dot { display: inline-block !important; margin: 0; }

.ar-live-report__meta { margin: 0 0 1.05rem; }
.ar-live-report__meta h2 { margin: 0 0 0.25rem; font-size: 1.22rem; font-weight: 800; color: #0f172a; }
.ar-live-report__meta-line {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.4rem 0.55rem;
  margin: 0;
  color: #64748b;
  font-size: 0.88rem;
}
.ar-live-report__dot {
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #cbd5e1;
}
.ar-live-tabs { display: flex; gap: 0.4rem; margin: 1.2rem 0 0.8rem; border-bottom: 1px solid #e2e8f0; }
.ar-live-tabs__tab { padding: 0.55rem 1rem; border-bottom: 3px solid transparent; font-weight: 700; font-size: 0.88rem; color: #64748b; text-decoration: none !important; }
.ar-live-tabs__tab.is-active { color: #1d4ed8; border-bottom-color: #2563eb; }
.ar-live-convo { list-style: none; margin: 0; padding: 0.4rem 0; max-height: 70vh; overflow-y: auto; }
.ar-live-convo__msg { display: flex; gap: 0.9rem; padding: 0.6rem 1rem; border-bottom: 1px solid #f1f5f9; }
.ar-live-convo__msg:last-child { border-bottom: 0; }
.ar-live-convo__time { flex: 0 0 64px; font-size: 0.78rem; color: #94a3b8; font-variant-numeric: tabular-nums; padding-top: 0.1rem; }
.ar-live-convo__body { flex: 1; min-width: 0; font-size: 0.88rem; }
.ar-live-convo__body strong { color: #0f172a; margin-right: 0.3rem; }
.ar-live-convo__body p { margin: 0.2rem 0 0; color: #334155; white-space: normal; word-break: break-word; }
.ar-live-convo__msg.is-staff .ar-live-convo__body strong { color: #1d4ed8; }
.ar-live-convo__msg.is-deleted .ar-live-convo__body p { color: #94a3b8; text-decoration: line-through; }
/* En vivo terminado: se reemplaza el reproductor */
.ar-lv-player__ended {
  position: absolute;
  inset: 0;
  z-index: 8;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  background: #0f172a;
  color: #e2e8f0;
  text-align: center;
  padding: 1rem;
}
.ar-lv-player__ended .fa { font-size: 2.4rem; color: #64748b; }
.ar-lv-player__ended strong { font-size: 1.15rem; color: #fff; }
.ar-lv-player__ended span { font-size: 0.88rem; color: #94a3b8; }
.ar-lv-player__ended .ar-lv-btn { margin-top: 0.4rem; background: #fff; color: #0f172a; }
.ar-lv-player.is-ended .ar-lv-player__bar,
.ar-lv-player.is-ended .ar-lv-player__top,
.ar-lv-player.is-ended .ar-lv-player__cover,
.ar-lv-player.is-ended .ar-lv-unmute { display: none !important; }

/* Desplegable de mensajes recientes en la barra */
.ar-msg-menu { position: relative; }
button.ar-icon-btn {
  border: 0;
  background: transparent;
  padding: 0;
  cursor: pointer;
  font: inherit;
}
.ar-msg-menu__dropdown {
  position: absolute;
  top: calc(100% + 0.45rem);
  right: 0;
  width: min(360px, calc(100vw - 1.5rem));
  background: #fff;
  border: 1px solid var(--ar-border);
  border-radius: var(--ar-radius-sm);
  box-shadow: 0 12px 28px rgba(11, 31, 58, 0.14);
  z-index: 70;
  overflow: hidden;
}
.ar-msg-menu__dropdown[hidden] { display: none !important; }
.ar-msg-menu__head {
  padding: 0.7rem 0.9rem 0.5rem;
  font-size: 0.82rem;
  font-weight: 800;
  color: #64748b;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.ar-msg-menu__list { max-height: 380px; overflow-y: auto; }
.ar-msg-menu__empty { margin: 0; padding: 1rem 0.9rem; color: #94a3b8; font-size: 0.86rem; }
.ar-msg-menu__item {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  padding: 0.7rem 0.9rem;
  text-decoration: none !important;
  color: #0f172a;
  border-top: 1px solid #f1f5f9;
}
.ar-msg-menu__item:hover { background: #f8fafc; }
.ar-msg-menu__item.is-unread { background: #eff6ff; }
.ar-msg-menu__item strong { font-size: 0.88rem; line-height: 1.3; }
.ar-msg-menu__from { font-size: 0.75rem; color: #64748b; }
.ar-msg-menu__preview { font-size: 0.78rem; color: #475569; line-height: 1.35; }
.ar-msg-menu__all {
  display: block;
  padding: 0.75rem 0.9rem;
  text-align: center;
  font-weight: 800;
  font-size: 0.86rem;
  color: #2563eb !important;
  text-decoration: none !important;
  border-top: 1px solid #e2e8f0;
  background: #f8fafc;
}
.ar-msg-menu__all:hover { background: #eff6ff; }

/* ---------- Lista de usuarios (admin) ---------- */
.ar-ul { max-width: none; margin: 0; }
.ar-ul-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  margin: 0 0 1.15rem;
}
.ar-ul-head__title { min-width: 0; }
.ar-ul-head h1 {
  margin: 0;
  font-size: 1.7rem;
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1.15;
  color: #0f172a;
}
.ar-ul-head p {
  margin: 0.35rem 0 0;
  color: #64748b;
  font-size: 0.9rem;
  line-height: 1.45;
  font-weight: 500;
}
.ar-ul-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  height: 42px;
  padding: 0 1.05rem;
  border: 1px solid #e2e8f0;
  border-radius: 999px;
  background: #fff;
  color: #0f172a !important;
  font-weight: 700;
  font-size: 14px;
  text-decoration: none !important;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
  cursor: pointer;
  white-space: nowrap;
}
.ar-ul-btn--primary { background: #2563eb; border-color: #2563eb; color: #fff !important; }
.ar-ul-btn--primary:hover { background: #1d4ed8; }
.ar-ul-btn--ghost:hover { border-color: #c7d2fe; color: #1d4ed8 !important; }
.ar-ul-sr {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
}
.ar-ul-filters {
  display: flex;
  align-items: stretch;
  gap: 0.7rem;
  background: transparent;
  border: 0;
  box-shadow: none;
  padding: 0;
  margin: 0 0 0.1rem;
  flex-wrap: nowrap;
}
.ar-admin-page .ar-ul-filters label.ar-ul-pill,
.ar-ul-pill {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  min-height: 48px;
  padding: 0.3rem 1.05rem;
  margin: 0;
  background: #fff;
  border: 1px solid #eef1f6;
  border-radius: 999px;
  box-shadow: 0 2px 10px rgba(15, 23, 42, 0.04);
  color: #0f172a;
  font-weight: 600;
  flex: 0 0 auto;
}
.ar-ul-pill > .fa {
  color: #94a3b8;
  font-size: 16px;
  width: 16px;
  text-align: center;
  flex-shrink: 0;
}
.ar-ul-pill--search { flex: 1 1 300px !important; min-width: 0; padding-left: 1.05rem; }
.ar-admin-page .ar-ul-pill--search input[type="text"],
.ar-ul-pill--search input {
  flex: 1;
  width: 100%;
  min-width: 0;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  height: 40px !important;
  padding: 0 !important;
  margin: 0;
  font-size: 0.9rem;
  font-weight: 500;
  color: #334155;
  border-radius: 0 !important;
}
.ar-ul-pill--search input::placeholder { color: #94a3b8; font-weight: 500; }
.ar-ul-pill--search input:focus { outline: none; box-shadow: none !important; }
.ar-ul-pill__txt {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-width: 4.6rem;
  line-height: 1.1;
}
.ar-ul-pill__txt small {
  display: block;
  font-size: 0.68rem;
  font-weight: 600;
  color: #94a3b8;
  letter-spacing: 0;
  line-height: 1.15;
}
.ar-admin-page .ar-ul-pill select,
.ar-ul-pill select {
  display: block;
  width: 100%;
  max-width: 9.5rem;
  height: 18px;
  border: 0 !important;
  background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath fill='%2394a3b8' d='M1 1l4 4 4-4'/%3E%3C/svg%3E") no-repeat right 2px center;
  box-shadow: none !important;
  padding: 0 14px 0 0;
  margin: 0;
  font-size: 0.82rem;
  font-weight: 700;
  color: #0f172a;
  appearance: none;
  -webkit-appearance: none;
  cursor: pointer;
}
.ar-ul-pill select:focus { outline: none; box-shadow: none !important; }
.ar-ul-pill--clear {
  text-decoration: none !important;
  color: #0f172a !important;
  font-size: 0.9rem;
  font-weight: 700;
  padding: 0 1.15rem;
  white-space: nowrap;
}
.ar-ul-pill--clear:hover { color: #2563eb !important; }
.ar-ul-adv-link {
  color: #64748b !important;
  font-size: 0.78rem;
  font-weight: 600;
  text-decoration: none !important;
  white-space: nowrap;
}
.ar-ul-adv-link:hover,
.ar-ul-adv-link.is-open { color: #2563eb !important; }
.ar-ul #advanced_search_form {
  margin: 0.55rem 0 0.85rem;
  padding: 0.35rem 1rem 0.2rem;
  background: #fff;
  border: 1px solid #eef2f7;
  border-radius: 16px;
  box-shadow: 0 4px 14px rgba(15, 23, 42, 0.04);
}
.ar-ul-adv-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  margin: 0 0 0.55rem;
  padding: 0.7rem 0.15rem;
  border: 0;
  border-bottom: 1px solid #eef2f7;
  background: transparent;
  color: #0f172a;
  font-size: 0.95rem;
  font-weight: 700;
  cursor: pointer;
  text-align: left;
}
.ar-ul-adv-toggle .fa { color: #94a3b8; font-size: 0.85rem; }
.ar-ul-adv-toggle:hover { color: #2563eb; }
.ar-ul-adv-toggle:hover .fa { color: #2563eb; }
.ar-ul #advanced_search_form .page-header,
.ar-ul #advanced_search_form h2,
.ar-ul #advanced_search_form legend {
  display: none;
}
.ar-ul-table-wrap > .table-well:first-child {
  display: none !important;
}
.ar-ul .table-well,
.ar-ul .data_table_pagination,
.ar-admin-page .ar-ul .table-well,
.ar-admin-page .ar-ul .btn-toolbar {
  background: transparent;
  border: 0;
  box-shadow: none;
  width: 100%;
  padding: 0;
  margin: 0;
}
.ar-ul-table-wrap form.form-search > .table-well {
  margin-top: 0.85rem;
}
.ar-ul .data_table_pagination {
  display: block;
}
.ar-ul .data_table_pagination tr {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
}
.ar-ul .data_table_pagination td {
  padding: 0.35rem 0;
  vertical-align: middle;
  color: #64748b;
  font-size: 0.86rem;
  border: 0 !important;
  background: transparent !important;
}
.ar-admin-page .ar-ul-table-wrap select.form-control,
.ar-ul-table-wrap select.form-control {
  height: 36px;
  width: auto;
  min-width: 72px;
  border: 1px solid #e8eef5;
  border-radius: 10px;
  padding: 0 1.6rem 0 0.7rem;
  background: #fff;
  font-weight: 600;
  color: #0f172a;
}
.ar-ul-table-wrap .btn-toolbar .btn {
  height: 36px;
  border-radius: 10px;
  border-color: #e8eef5;
  background: #fff;
  color: #334155;
  font-weight: 600;
  font-size: 0.82rem;
}
.ar-ul-table-wrap .data_table_pagination a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 32px;
  height: 32px;
  padding: 0 0.45rem;
  border-radius: 999px;
  color: #334155 !important;
  text-decoration: none !important;
  font-weight: 700;
}
.ar-ul-table-wrap .data_table_pagination a:hover { background: #eff6ff; color: #2563eb !important; }
.ar-ul-table-wrap .data_table_pagination img {
  width: 16px;
  height: 16px;
  vertical-align: middle;
}
.ar-ul-table-wrap form.form-search > .table-well .data_table_pagination td.text-right {
  display: none !important;
}
.ar-admin-page .ar-ul .table-responsive,
.ar-ul .table-responsive {
  background: #fff;
  border: 1px solid #e8eef5;
  border-radius: 16px;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.04);
  overflow: auto;
}
.ar-admin-page .ar-ul table.ar-ul-table,
.ar-admin-page .ar-ul table.data_table,
.ar-ul table.ar-ul-table,
.ar-ul .table {
  border: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  margin: 0;
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  font-size: 0.78rem;
  background: #fff;
}
/* Chamilo/PEAR pinta la tabla SIN thead/tbody: los selectores deben ir a th/td. */
.ar-admin-page .ar-ul table.ar-ul-table th,
.ar-ul table.ar-ul-table th,
.ar-admin-page .ar-ul table.data_table th {
  background: #fff !important;
  border: 0 !important;
  border-bottom: 1px solid #eef2f7 !important;
  padding: 0.85rem 0.85rem !important;
  font-size: 0;
  line-height: 1;
  text-align: left;
  vertical-align: middle;
  white-space: nowrap;
}
.ar-ul table.ar-ul-table th a,
.ar-ul table.ar-ul-table th .ar-th {
  display: inline-block;
  font-size: 0.72rem;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: 0;
  color: #94a3b8;
}
.ar-ul table.ar-ul-table th .ar-th { color: #94a3b8; }
.ar-ul table.ar-ul-table th a {
  position: relative;
  padding-right: 14px;
  color: #94a3b8 !important;
  text-decoration: none !important;
}
.ar-ul table.ar-ul-table th a::before,
.ar-ul table.ar-ul-table th a::after {
  position: absolute;
  right: 0;
  font-family: FontAwesome;
  font-size: 6px;
  font-weight: 400;
  line-height: 1;
  color: #cbd5e1;
}
.ar-ul table.ar-ul-table th a::before { content: "\f077"; top: 0; }
.ar-ul table.ar-ul-table th a::after { content: "\f078"; bottom: 0; }
.ar-ul table.ar-ul-table th input[type="checkbox"] {
  margin: 0;
  vertical-align: middle;
}
.ar-admin-page .ar-ul table.ar-ul-table td,
.ar-ul table.ar-ul-table td,
.ar-admin-page .ar-ul table.data_table td {
  background: #fff !important;
  border: 0 !important;
  border-bottom: 1px solid #f3f6fa !important;
  padding: 0.7rem 0.85rem !important;
  vertical-align: middle;
  color: #334155;
  line-height: 1.35;
  font-size: 0.78rem;
  font-weight: 500;
}
.ar-ul table.ar-ul-table tr:last-child td { border-bottom: 0 !important; }
.ar-ul table.ar-ul-table tr:hover td { background: #fbfdff !important; }
.ar-ul table.ar-ul-table input[type="checkbox"] {
  margin: 0;
  width: 15px;
  height: 15px;
  accent-color: #2563eb;
}
.ar-ul .ar-c-check { width: 36px; text-align: center; }
.ar-ul .ar-c-photo { width: 52px; }
.ar-ul .ar-c-code { width: 128px; }
.ar-ul .ar-c-name { min-width: 128px; }
.ar-ul .ar-c-user { width: 118px; }
.ar-ul .ar-c-mail { min-width: 128px; }
.ar-ul .ar-c-org { min-width: 118px; }
.ar-ul .ar-c-job { min-width: 96px; }
.ar-ul .ar-c-zone { min-width: 88px; }
.ar-ul .ar-c-role { width: 96px; }
.ar-ul .ar-c-state { display: none !important; }
.ar-ul .ar-c-date { width: 102px; }
.ar-ul .ar-c-acts {
  width: 200px;
  min-width: 200px;
  position: sticky;
  right: 0;
  z-index: 3;
  background: #fff !important;
  box-shadow: -8px 0 12px rgba(15, 23, 42, 0.04);
  white-space: normal;
  vertical-align: middle;
}
.ar-ul table.ar-ul-table .ar-ul-avatar-wrap {
  position: relative;
  display: inline-grid;
}
.ar-ul table.ar-ul-table .ar-ul-avatar {
  width: 36px;
  height: 36px;
  font-size: 0.7rem;
}
.ar-ul-avatar__dot {
  position: absolute;
  right: -2px;
  bottom: -2px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #22c55e;
  box-shadow: 0 0 0 2px #fff;
}
.ar-ul-avatar__dot.is-off { background: #ef4444; }
.ar-ul-avatar__dot.is-warn { background: #f59e0b; }
.ar-ul-avatar__dot img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  cursor: pointer;
}
.ar-ul .ar-ul-none { color: #94a3b8; font-weight: 500; }
.ar-ul .ar-ul-code,
.ar-ul .ar-ul-plain { color: #334155; }
.ar-ul a.ar-ul-name {
  color: #0f172a !important;
  font-weight: 600;
  text-decoration: none !important;
}
.ar-ul a.ar-ul-name:hover { color: #2563eb !important; }
.ar-ul a.ar-ul-mail { color: #2563eb !important; text-decoration: none !important; font-weight: 500; }
.ar-ul .ar-ul-ic {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  color: #334155;
}
.ar-ul .ar-ul-ic > .fa {
  color: #94a3b8;
  font-size: 0.78rem;
  line-height: 1;
  flex-shrink: 0;
}
.ar-ul .ar-ul-date span { display: block; color: #334155; font-weight: 500; }
.ar-ult-acts {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.3rem;
  width: 188px !important;
}
.ar-ult-act {
  width: 28px;
  height: 28px;
  display: inline-grid;
  place-items: center;
  border: 0;
  border-radius: 50%;
  background: #eef4ff;
  color: #3b82f6 !important;
  font-size: 0.78rem;
  text-decoration: none !important;
  cursor: pointer;
  flex-shrink: 0;
}
.ar-ult-act--user,
.ar-ult-act--info,
.ar-ult-act--edit,
.ar-ult-act--del,
.ar-ult-act--star,
.ar-ult-act--more {
  background: #eef4ff;
  color: #3b82f6 !important;
}
.ar-ult-act--star.is-on { color: #3b82f6 !important; }
.ar-ult-act:hover { background: #dbeafe; }
.ar-ult-act.is-off { opacity: 0.38; cursor: default; }
.ar-ult-act--more {
  background: #eef4ff;
  appearance: none;
  -webkit-appearance: none;
  padding: 0;
  line-height: 1;
}
.ar-ult-more { position: relative; display: inline-flex; }
.ar-ult-menu {
  display: none;
  position: absolute;
  right: 0;
  top: calc(100% + 4px);
  z-index: 20;
  min-width: 170px;
  padding: 0.3rem 0;
  background: #fff;
  border: 1px solid #e8eef5;
  border-radius: 10px;
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.12);
  text-align: left;
}
.ar-ult-more.is-open .ar-ult-menu { display: block; }
.ar-ult-menu a {
  display: block;
  padding: 0.38rem 0.8rem;
  color: #0f172a !important;
  font-size: 0.76rem;
  font-weight: 600;
  text-decoration: none !important;
  white-space: nowrap;
}
.ar-ult-menu a:hover { background: #f8fafc; }
.ar-ul-avatar {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  display: inline-grid;
  place-items: center;
  overflow: hidden;
  background: #e2e8f0;
  font-size: 0.68rem;
  font-weight: 800;
  color: #334155;
}
.ar-ul-avatar img { width: 100%; height: 100%; object-fit: cover; }
.ar-ul-avatar--gold { background: #fef3c7; color: #f59e0b; font-size: 0.85rem; }
.ar-ul-avatar--mint { background: #d1fae5; color: #047857; }
.ar-ul-avatar--lilac { background: #ede9fe; color: #6d28d9; }
.ar-ul-avatar--sky { background: #dbeafe; color: #1d4ed8; }
.ar-ul-avatar--sand { background: #fef3c7; color: #b45309; }
.ar-ul-avatar--rose { background: #fce7f3; color: #be185d; }
.ar-ul-avatar--teal { background: #d1fae5; color: #047857; }
.ar-ul-avatar--amber { background: #fef3c7; color: #b45309; }
.ar-ul-avatar--blue { background: #dbeafe; color: #1d4ed8; }
.ar-ul-avatar--violet { background: #ede9fe; color: #6d28d9; }
.ar-ul form#advanced_search {
  background: none;
  border: 0;
  box-shadow: none;
  padding: 0;
  margin: 0;
}
.ar-ul-adv-dates input[type="date"] {
  height: 36px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  padding: 0 0.5rem;
}
.ar-ucard .ar-ul-state {
  padding: 0.18rem 0.55rem 0.18rem 0.45rem;
  border-radius: 999px;
  background: #f1f5f9;
}
.ar-ucard .ar-ul-state.is-on { background: #dcfce7; }
.ar-ucard .ar-ul-state.is-on .ar-ul-state__txt { color: #15803d; }
.ar-ucard .ar-ul-state.is-off { background: #fee2e2; }
.ar-ucard .ar-ul-state.is-off .ar-ul-state__txt { color: #b91c1c; }
.ar-ul-state { display: inline-flex; align-items: center; gap: 0.4rem; }
.ar-ul-state img { display: none; }
.ar-ul-state::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #94a3b8;
}
.ar-ul-state.is-on::before { background: #22c55e; }
.ar-ul-state.is-off::before { background: #ef4444; }
.ar-ul-state.is-warn::before { background: #f59e0b; }
.ar-ul-state__txt { font-weight: 700; font-size: 0.82rem; color: #334155; }
.ar-ul table.ar-ul-table .ar-ul-state {
  position: relative;
  gap: 0.4rem;
  padding: 0;
  background: transparent;
}
.ar-ul table.ar-ul-table .ar-ul-state::before {
  display: block;
  width: 8px;
  height: 8px;
}
.ar-ul table.ar-ul-table .ar-ul-state img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  opacity: 0;
  cursor: pointer;
}
.ar-ul table.ar-ul-table .ar-ul-state__txt {
  font-size: 0.78rem;
  font-weight: 600;
  color: #16a34a;
}
.ar-ul table.ar-ul-table .ar-ul-state.is-on { background: transparent; }
.ar-ul table.ar-ul-table .ar-ul-state.is-on .ar-ul-state__txt { color: #16a34a; }
.ar-ul table.ar-ul-table .ar-ul-state.is-off { background: transparent; }
.ar-ul table.ar-ul-table .ar-ul-state.is-off .ar-ul-state__txt { color: #dc2626; }
.ar-ul table.ar-ul-table .ar-ul-state.is-warn { background: transparent; }
.ar-ul table.ar-ul-table .ar-ul-state.is-warn .ar-ul-state__txt { color: #d97706; }
.ar-ul .pagination > li > a,
.ar-ul .pagination > li > span {
  min-width: 32px;
  height: 32px;
  border-radius: 999px !important;
  line-height: 30px;
  text-align: center;
  padding: 0 0.45rem;
}
.ar-ul .pagination > .active > a {
  background: #2563eb !important;
  border-color: #2563eb !important;
}
@media (max-width: 1199px) {
  .ar-ul-filters { flex-wrap: wrap; }
  .ar-ul-pill--search { flex: 1 1 100%; }
}
@media (max-width: 767px) {
  .ar-ul-head { flex-direction: column; align-items: stretch; }
  .ar-ul-btn--primary { width: 100%; }
  .ar-ul-filters { flex-wrap: wrap; }
  .ar-ul-pill { flex: 1 1 calc(50% - 0.4rem); min-width: 0; }
  .ar-ul-pill--search,
  .ar-ul-pill--clear { flex: 1 1 100%; }
  .ar-ul-pill__txt { min-width: 0; }
  .ar-ul-pill select { max-width: 100%; }
}

/* ---------- Tarjetas de usuarios ---------- */
.ar-ucards-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin: 0.85rem 0 1rem;
  flex-wrap: wrap;
}
.ar-ucards-bar__count {
  margin: 0;
  color: #334155;
  font-size: 0.92rem;
  font-weight: 500;
}
.ar-ucards-bar__tools { display: flex; align-items: center; gap: 0.85rem; }
.ar-ucards-bar__label { color: #64748b; font-size: 0.86rem; font-weight: 600; }
.ar-ucards-toggle {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  border: 0;
  background: transparent;
}
.ar-ucards-toggle a {
  width: auto;
  height: auto;
  display: grid;
  place-items: center;
  color: #94a3b8 !important;
  text-decoration: none !important;
  font-size: 2rem;
  background: transparent !important;
}
.ar-ucards-toggle a.is-active { color: #2563eb !important; background: transparent !important; }
.ar-ucards-sort {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin: 0;
}
.ar-ucards-sort label {
  margin: 0;
  color: #64748b;
  font-size: 0.86rem;
  font-weight: 600;
  white-space: nowrap;
}
.ar-admin-page .ar-ucards-sort select,
.ar-ucards-sort select {
  height: 36px;
  border: 1px solid #e8eef5;
  border-radius: 10px;
  padding: 0 1.7rem 0 0.75rem;
  font-weight: 600;
  font-size: 0.86rem;
  color: #0f172a;
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath fill='%2394a3b8' d='M1 1l4 4 4-4'/%3E%3C/svg%3E") no-repeat right 0.7rem center;
  appearance: none;
  -webkit-appearance: none;
  box-shadow: none;
  min-width: 15.5rem;
}
.ar-ucards {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.9rem;
}
.ar-ucard {
  background: #fff;
  border: 1px solid #e8eef5;
  border-radius: 16px;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.04);
  padding: 0.95rem 1rem 0.75rem;
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 100%;
}
.ar-ucard__top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.5rem;
}
.ar-ucard__who { display: flex; align-items: flex-start; gap: 0.7rem; min-width: 0; }
.ar-ucard__photo { position: relative; flex-shrink: 0; }
.ar-ul--cards .ar-ul-avatar,
.ar-ucard .ar-ul-avatar {
  width: 48px;
  height: 48px;
  font-size: 0.82rem;
}
.ar-ucard__crown {
  position: absolute;
  left: -4px;
  top: -4px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #f59e0b;
  color: #fff;
  display: grid;
  place-items: center;
  font-size: 0.62rem;
  box-shadow: 0 0 0 2px #fff;
}
.ar-ucard__who h3 {
  margin: 0;
  font-size: 0.98rem;
  font-weight: 800;
  color: #0f172a;
  line-height: 1.25;
}
.ar-ucard__code,
.ar-ucard__user {
  margin: 0.08rem 0 0;
  font-size: 0.75rem;
  color: #64748b;
  line-height: 1.3;
}
.ar-ucard__aside { display: flex; align-items: center; gap: 0.25rem; flex-shrink: 0; }
.ar-ucard__icon-btn {
  width: 28px;
  height: 28px;
  border: 0;
  background: transparent;
  color: #94a3b8;
  border-radius: 8px;
  cursor: pointer;
}
.ar-ucard__icon-btn:hover { background: #f1f5f9; color: #0f172a; }
.ar-ucard__tabs {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0;
  margin: 0.85rem 0 0.65rem;
  border-bottom: 1px solid #eef2f7;
  min-width: 0;
  max-width: 100%;
  overflow-x: auto;
}
.ar-ucard__tabs button {
  border: 0;
  background: none;
  min-width: 0;
  padding: 0 0.1rem 0.5rem;
  color: #94a3b8;
  font-size: 0.68rem;
  font-weight: 700;
  cursor: pointer;
  text-align: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ar-ucard__tabs button.is-active {
  color: #2563eb;
  box-shadow: inset 0 -2px 0 #2563eb;
}
.ar-ucard__body { flex: 1 1 auto; min-height: 132px; display: flex; flex-direction: column; }
.ar-ucard__pane { display: none; flex: 1; }
.ar-ucard__pane.is-active { display: block; }
.ar-ucard__pane dl { margin: 0; display: grid; gap: 0.42rem; }
.ar-ucard__pane dl > div {
  display: flex;
  justify-content: space-between;
  gap: 0.6rem;
  align-items: baseline;
}
.ar-ucard__pane dt {
  margin: 0;
  color: #94a3b8;
  font-size: 0.95rem;
  font-weight: 600;
}
.ar-ucard__pane dt .fa { width: 14px; margin-right: 0.25rem; }
.ar-ucard__pane dd {
  margin: 0;
  color: #0f172a;
  font-size: 0.78rem;
  font-weight: 600;
  text-align: right;
  word-break: break-word;
}
.ar-ucard__links { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-top: 0.65rem; }
.ar-ucard__links .ar-ul-btn { height: 32px; font-size: 0.78rem; }
.ar-ucard__foot {
  display: flex;
  align-items: center;
  gap: 0.15rem;
  overflow-x: auto;
  margin-top: 0.8rem;
  padding-top: 0.55rem;
  border-top: 1px solid #eef2f7;
}
.ar-ucard__act {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: #eef4ff;
  color: #2563eb !important;
  font-size: 0.85rem;
  text-decoration: none !important;
  cursor: pointer;
  flex-shrink: 0;
}
.ar-ucard__act:hover { background: #dbeafe; }
.ar-ucard__act.is-danger { color: #ef4444 !important; }
.ar-ucard__act.is-off { color: #cbd5e1 !important; cursor: default; }
.ar-ucard__act--more { color: #64748b !important; }
.ar-ucard__kebab,
.ar-ucard__more { position: relative; }
.ar-ucard__menu {
  display: none;
  position: absolute;
  right: 0;
  top: calc(100% + 4px);
  z-index: 8;
  min-width: 160px;
  padding: 0.35rem 0;
  background: #fff;
  border: 1px solid #e8eef5;
  border-radius: 10px;
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.12);
}
.ar-ucard__kebab.is-open .ar-ucard__menu,
.ar-ucard__more.is-open .ar-ucard__menu { display: block; }
.ar-ucard__menu a {
  display: block;
  padding: 0.4rem 0.8rem;
  color: #0f172a !important;
  font-size: 0.8rem;
  font-weight: 600;
  text-decoration: none !important;
}
.ar-ucard__menu a:hover { background: #f8fafc; }
.ar-ucard__menu a.is-danger { color: #ef4444 !important; }
.ar-ucards-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin: 1rem 0 0.4rem;
  color: #64748b;
  font-size: 0.86rem;
}
.ar-ucards-foot p { margin: 0; }
.ar-ucards-pager { display: flex; align-items: center; gap: 0.28rem; }
.ar-ucards-pager__btn {
  min-width: 32px;
  height: 32px;
  padding: 0 0.45rem;
  border-radius: 999px;
  display: grid;
  place-items: center;
  color: #334155 !important;
  text-decoration: none !important;
  font-weight: 700;
  font-size: 0.82rem;
}
.ar-ucards-pager__btn.is-active { background: #2563eb; color: #fff !important; }
.ar-ucards-pager__btn.is-off { pointer-events: none; opacity: 0.35; }
.ar-ucards-pager__gap { color: #94a3b8; padding: 0 0.15rem; }
@media (max-width: 1439px) {
  .ar-ucards { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 1023px) {
  .ar-ucards { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
  .ar-ucards { grid-template-columns: 1fr; }
  .ar-ucards-bar { align-items: flex-start; }
  .ar-ucards-bar__tools { width: 100%; flex-wrap: wrap; }
  .ar-ucards-sort { width: 100%; }
  .ar-ucards-sort select { min-width: 0; flex: 1; }
  .ar-ucard__tabs { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .ar-ucard__foot { flex-wrap: wrap; }
}

/* Visor de lección / examen embebido: sin nav Academia Real */
body.page_origin_learnpath .ar-sidebar,
body.page_origin_learnpath .ar-topbar,
body.page_origin_learnpath .ar-backdrop,
body.page_origin_learnpath .ar-breadcrumb,
body.ar-no-shell .ar-sidebar,
body.ar-no-shell .ar-topbar,
body.ar-no-shell .ar-backdrop,
body.ar-no-shell .ar-breadcrumb {
  display: none !important;
}
body.page_origin_learnpath .ar-app,
body.ar-no-shell .ar-app {
  display: block;
  min-height: 0;
}
body.page_origin_learnpath .ar-main,
body.page_origin_learnpath .ar-content,
body.ar-no-shell .ar-main,
body.ar-no-shell .ar-content {
  margin-left: 0 !important;
  width: 100% !important;
  max-width: none !important;
}

/* Bandeja WhatsApp (seguimientos) */
.ar-fw-inbox__intro {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1rem;
  flex-wrap: wrap;
}
.ar-fw-inbox__layout {
  display: grid;
  grid-template-columns: minmax(240px, 320px) 1fr;
  min-height: 560px;
  padding: 0;
  overflow: hidden;
}
.ar-fw-inbox__list {
  border-right: 1px solid #e2e8f0;
  display: flex;
  flex-direction: column;
  min-height: 0;
  background: #f8fafc;
}
.ar-fw-inbox__search {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.75rem;
  border-bottom: 1px solid #e2e8f0;
  background: #fff;
}
.ar-fw-inbox__search input {
  flex: 1;
  border: 0;
  outline: none;
  background: transparent;
  font-size: 0.95rem;
}
.ar-fw-inbox__filters {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  padding: 0.6rem 0.75rem;
  border-bottom: 1px solid #e2e8f0;
  background: #fff;
}
.ar-fw-inbox__filter {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  border: 1px solid #cbd5e1;
  border-radius: 999px;
  background: #fff;
  color: #334155;
  font-size: 0.78rem;
  padding: 0.2rem 0.6rem;
  cursor: pointer;
}
.ar-fw-inbox__filter b {
  font-weight: 700;
  color: #0f172a;
}
.ar-fw-inbox__filter.is-active {
  background: #0b2a4a;
  border-color: #0b2a4a;
  color: #fff;
}
.ar-fw-inbox__filter.is-active b { color: #fff; }
.ar-fw-inbox__thread-tag {
  font-size: 0.72rem;
  color: #1e5bb8;
}
.ar-fw-inbox__ai {
  display: block;
  margin-top: 0.3rem;
  font-size: 0.75rem;
  color: #1e5bb8;
  font-style: normal;
}
.ar-fw-inbox__ai-note {
  display: block;
  margin-top: 0.35rem;
  padding: 0.35rem 0.5rem;
  border-left: 3px solid #93c5fd;
  background: #eff6ff;
  font-size: 0.82rem;
  color: #1e293b;
}
.ar-fw-inbox__threads {
  overflow: auto;
  flex: 1;
  max-height: 620px;
}
.ar-fw-inbox__thread {
  display: grid;
  gap: 0.15rem;
  width: 100%;
  text-align: left;
  border: 0;
  border-bottom: 1px solid #e2e8f0;
  background: transparent;
  padding: 0.75rem 0.9rem;
  cursor: pointer;
}
.ar-fw-inbox__thread:hover { background: #eff6ff; }
.ar-fw-inbox__thread.is-active { background: #dbeafe; }
.ar-fw-inbox__thread-top {
  display: flex;
  justify-content: space-between;
  gap: 0.5rem;
  align-items: center;
}
.ar-fw-inbox__thread-top strong {
  font-size: 0.95rem;
  color: #0f172a;
}
.ar-fw-inbox__unread {
  display: inline-grid;
  place-items: center;
  min-width: 1.2rem;
  height: 1.2rem;
  padding: 0 0.3rem;
  border-radius: 999px;
  background: #ef4444;
  color: #fff;
  font-size: 0.72rem;
  font-style: normal;
  font-weight: 700;
}
.ar-fw-inbox__thread-sub,
.ar-fw-inbox__thread-time {
  font-size: 0.78rem;
  color: #64748b;
}
.ar-fw-inbox__thread-prev {
  font-size: 0.85rem;
  color: #334155;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ar-fw-inbox__chat {
  display: flex;
  flex-direction: column;
  min-height: 0;
  background: #fff;
}
.ar-fw-inbox__chat-head {
  padding: 0.85rem 1rem;
  border-bottom: 1px solid #e2e8f0;
}
.ar-fw-inbox__chat-head strong {
  display: block;
  font-size: 1.05rem;
  color: #0f172a;
}
.ar-fw-inbox__meta {
  display: block;
  margin-top: 0.15rem;
  font-size: 0.85rem;
  color: #64748b;
}
.ar-fw-inbox__messages {
  flex: 1;
  overflow: auto;
  padding: 1rem;
  background:
    linear-gradient(180deg, rgba(248, 250, 252, 0.9), rgba(241, 245, 249, 0.95));
  min-height: 360px;
  max-height: 520px;
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}
.ar-fw-inbox__placeholder {
  margin: auto;
  text-align: center;
  color: #64748b;
  max-width: 280px;
}
.ar-fw-inbox__placeholder .fa {
  font-size: 2rem;
  color: #22c55e;
  margin-bottom: 0.5rem;
}
.ar-fw-inbox__bubble {
  max-width: min(78%, 520px);
  padding: 0.55rem 0.75rem;
  border-radius: 12px;
  font-size: 0.92rem;
  line-height: 1.35;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
}
.ar-fw-inbox__bubble--in {
  align-self: flex-start;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-bottom-left-radius: 4px;
}
.ar-fw-inbox__bubble--out {
  align-self: flex-end;
  background: #dcf8c6;
  border-bottom-right-radius: 4px;
}
.ar-fw-inbox__bubble-meta {
  margin-top: 0.3rem;
  font-size: 0.72rem;
  color: #64748b;
}
.ar-fw-inbox__bubble-meta i {
  font-style: normal;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}
.ar-fw-inbox__err {
  display: block;
  margin-top: 0.25rem;
  color: #b91c1c;
  font-size: 0.75rem;
  font-style: normal;
}
.ar-fw-inbox__composer {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 0.55rem 0.75rem;
  padding: 0.75rem 1rem 1rem;
  border-top: 1px solid #e2e8f0;
  background: #fff;
}
.ar-fw-inbox__composer textarea {
  grid-column: 1 / 2;
  grid-row: 1;
  width: 100%;
  resize: vertical;
  min-height: 54px;
  border: 1px solid #cbd5e1;
  border-radius: 10px;
  padding: 0.65rem 0.75rem;
  font: inherit;
}
.ar-fw-inbox__composer button {
  grid-column: 2;
  grid-row: 1;
  align-self: end;
}
.ar-fw-inbox__composer-hint {
  grid-column: 1 / -1;
  margin: 0;
  font-size: 0.78rem;
  color: #64748b;
}
.ar-fw-inbox__send-error {
  grid-column: 1 / -1;
  margin: 0;
  padding: 0.5rem 0.75rem;
  border-radius: 10px;
  background: #fef2f2;
  color: #991b1b;
  font-size: 0.85rem;
  font-weight: 700;
}
.ar-fw-inbox__send-error[hidden] {
  display: none;
}
@media (max-width: 900px) {
  .ar-fw-inbox__layout {
    grid-template-columns: 1fr;
    min-height: 0;
  }
  .ar-fw-inbox__list {
    border-right: 0;
    border-bottom: 1px solid #e2e8f0;
  }
  .ar-fw-inbox__threads { max-height: 240px; }
  .ar-fw-inbox__messages { max-height: 360px; }
}

/* Asistente Academia Real (inferior izquierda; reemplaza WA + LeadConnector) */
.real-wa-float { display: none !important; }

.ar-assistant {
  --ar-as-navy: #0b2a4a;
  --ar-as-blue: #1e5bb8;
  --ar-as-soft: #e8f0fe;
  --ar-as-muted: #64748b;
  position: fixed;
  left: 16px;
  bottom: 16px;
  z-index: 10050;
  font-family: var(--ar-font, inherit);
  font-size: 16px;
}
.ar-assistant__fab {
  --ar-fab-yellow: #f5c518;
  position: relative;
  width: 64px;
  height: 64px;
  border: 3px solid #0b2a4a;
  padding: 0;
  border-radius: 50%;
  background: #fff;
  color: var(--ar-as-blue);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  overflow: visible;
  box-shadow:
    0 10px 24px rgba(11, 42, 74, 0.28),
    0 0 0 3px rgba(245, 197, 24, 0.35);
  cursor: pointer;
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
  animation: ar-assistant-fab-in 0.55s cubic-bezier(0.22, 1, 0.36, 1) both;
}
.ar-assistant__fab-ring {
  position: absolute;
  inset: -8px;
  border-radius: 50%;
  border: 2px solid rgba(245, 197, 24, 0.55);
  pointer-events: none;
  animation: ar-assistant-fab-pulse 2.2s ease-out infinite;
}
.ar-assistant__fab-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 50%;
  display: block;
}
.ar-assistant__fab-badge {
  position: absolute;
  right: -2px;
  bottom: -2px;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: var(--ar-fab-yellow);
  color: #0b2a4a;
  border: 2px solid #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.2);
  font-size: 0.72rem;
  line-height: 1;
}
.ar-assistant__fab:hover,
.ar-assistant__fab:focus {
  transform: translateY(-3px) scale(1.04);
  border-color: #123a63;
  box-shadow:
    0 14px 30px rgba(11, 42, 74, 0.34),
    0 0 0 4px rgba(245, 197, 24, 0.45);
  outline: none;
}
.ar-assistant__fab:active {
  transform: translateY(-1px) scale(0.98);
}
.ar-assistant.is-open .ar-assistant__fab { display: none; }

@keyframes ar-assistant-fab-in {
  0% {
    opacity: 0;
    transform: translateY(18px) scale(0.72);
  }
  70% {
    opacity: 1;
    transform: translateY(-3px) scale(1.06);
  }
  100% {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}
@keyframes ar-assistant-fab-pulse {
  0% {
    transform: scale(0.92);
    opacity: 0.85;
  }
  70% {
    transform: scale(1.18);
    opacity: 0;
  }
  100% {
    transform: scale(1.18);
    opacity: 0;
  }
}
@media (prefers-reduced-motion: reduce) {
  .ar-assistant__fab,
  .ar-assistant__fab-ring {
    animation: none !important;
  }
}

.ar-assistant__panel {
  width: min(380px, calc(100vw - 24px));
  height: min(560px, calc(100vh - 32px));
  background: #fff;
  border-radius: 18px;
  box-shadow: 0 18px 48px rgba(15, 23, 42, 0.22);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  position: relative;
  transition: width 0.18s ease, height 0.18s ease, border-radius 0.18s ease;
}
.ar-assistant__panel[hidden] { display: none !important; }
.ar-assistant.is-expanded .ar-assistant__panel {
  width: min(520px, calc(100vw - 24px));
  height: min(720px, calc(100vh - 28px));
}

.ar-assistant__toolbar {
  display: flex;
  gap: 0.15rem;
  flex: 0 0 auto;
  margin-left: 0.25rem;
}
.ar-assistant__close,
.ar-assistant__expand {
  width: 34px;
  height: 34px;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--ar-as-muted);
  cursor: pointer;
}
.ar-assistant__close:hover,
.ar-assistant__expand:hover {
  color: var(--ar-as-navy);
  background: #f1f5f9;
}

.ar-assistant__head {
  display: flex;
  gap: 0.65rem;
  align-items: flex-start;
  padding: 1rem 0.75rem 0.85rem 1rem;
  border-bottom: 1px solid #eef2f7;
}
.ar-assistant__head-copy {
  flex: 1 1 auto;
  min-width: 0;
}
.ar-assistant__mark {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: var(--ar-as-soft);
  color: var(--ar-as-blue);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  overflow: hidden;
}
.ar-assistant__avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  object-fit: cover;
  flex: 0 0 auto;
  display: block;
  background: var(--ar-as-soft);
}
.ar-assistant__mark .ar-assistant__avatar {
  width: 100%;
  height: 100%;
}
.ar-assistant__reply {
  display: flex;
  align-items: flex-start;
  gap: 0.65rem;
}
.ar-assistant__reply-bubble {
  flex: 1 1 auto;
  min-width: 0;
  background: #f1f5f9;
  border-radius: 14px;
  padding: 0.75rem 0.85rem;
}
.ar-assistant__head h2 {
  margin: 0;
  font-size: 1.18rem;
  font-weight: 800;
  color: var(--ar-as-navy);
  line-height: 1.25;
  padding-right: 0.25rem;
}
.ar-assistant__head p {
  margin: 0.2rem 0 0;
  font-size: 0.95rem;
  color: black;
  line-height: 1.35;
}

.ar-assistant__body {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  padding: 0.75rem 0.9rem;
  gap: 0.55rem;
  overflow: hidden;
}
.ar-assistant__stage {
  position: relative;
  flex: 1 1 auto;
  min-height: 180px;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.ar-assistant__faq-view {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  min-height: 0;
  flex: 1 1 auto;
  overflow: hidden;
}
.ar-assistant__faq-view[hidden] { display: none !important; }
.ar-assistant__label {
  margin: 0;
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #94a3b8;
}
.ar-assistant__faqs {
  list-style: none;
  margin: 0;
  padding: 0;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  flex: 1 1 auto;
  min-height: 0;
}
.ar-assistant__empty {
  color: var(--ar-as-muted);
  font-size: 0.98rem;
  padding: 0.5rem 0.25rem;
}
.ar-assistant__faq {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 0.45rem;
  text-align: left;
  border: 1px solid #e2e8f0;
  background: #fff;
  border-radius: 12px;
  padding: 0.65rem 0.75rem;
  color: var(--ar-as-navy);
  cursor: pointer;
  transition: border-color 0.15s ease, background 0.15s ease;
}
.ar-assistant__faq:hover {
  border-color: #bfdbfe;
  background: #f8fbff;
}
.ar-assistant__faq-go {
  color: #94a3b8;
  flex: 0 0 auto;
}
.ar-assistant__faq-q {
  flex: 1 1 auto;
  font-size: 1.02rem;
  font-weight: 600;
  line-height: 1.35;
}

.ar-assistant__detail,
.ar-assistant__chat-view,
.ar-assistant__support {
  position: absolute;
  inset: 0;
  background: #fff;
  border: 1px solid #dbeafe;
  border-radius: 12px;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  z-index: 2;
}
.ar-assistant__chat-view { z-index: 3; }
.ar-assistant__support { z-index: 4; }
.ar-assistant__detail[hidden],
.ar-assistant__chat-view[hidden],
.ar-assistant__support[hidden] { display: none !important; }
.ar-assistant__detail-bar {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  padding: 0.65rem 0.75rem;
  border-bottom: 1px solid #e2e8f0;
  background: #f8fbff;
  flex: 0 0 auto;
}
.ar-assistant__back {
  width: 34px;
  height: 34px;
  border: 0;
  border-radius: 50%;
  background: #fff;
  color: var(--ar-as-blue);
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.08);
  cursor: pointer;
  flex: 0 0 auto;
}
.ar-assistant__back:hover { background: #eff6ff; }
.ar-assistant__detail-q {
  font-size: 1.12rem;
  font-weight: 800;
  color: var(--ar-as-navy);
  line-height: 1.3;
}
.ar-assistant__detail-body {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  padding: 0.95rem 1rem;
  font-size: 1.1rem;
  line-height: 1.55;
  color: #0f172a;
}
.ar-assistant__detail-body p,
.ar-assistant__msg p {
  margin: 0 0 0.55rem;
}
.ar-assistant__detail-body p:last-child,
.ar-assistant__msg p:last-child {
  margin-bottom: 0;
}
.ar-assistant__detail-body a,
.ar-assistant__msg a {
  color: var(--ar-as-blue);
  font-weight: 600;
}

.ar-assistant__chat {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  padding: 0.85rem 0.9rem;
}
.ar-assistant--no-chat .ar-assistant__chat-view { display: none !important; }
.ar-assistant--no-wa .ar-assistant__wa,
.ar-assistant__wa[hidden] { display: none !important; }
.ar-assistant__detail-body ol,
.ar-assistant__detail-body ul {
  margin: 0 0 0.75rem 1.15rem;
  padding: 0;
}
.ar-assistant__detail-body li { margin: 0 0 0.5rem; }
.ar-assistant__msg {
  max-width: 96%;
  font-size: 1.08rem;
  line-height: 1.5;
}
.ar-assistant__msg--user {
  align-self: flex-end;
  background: var(--ar-as-blue);
  color: #fff;
  padding: 0.65rem 0.8rem;
  border-radius: 14px;
}
.ar-assistant__msg--bot {
  align-self: flex-start;
  display: flex;
  align-items: flex-start;
  gap: 0.55rem;
  background: transparent;
  color: #0f172a;
  padding: 0;
}
.ar-assistant__msg-bubble {
  background: #f1f5f9;
  border-radius: 14px;
  padding: 0.65rem 0.8rem;
  min-width: 0;
}

.ar-assistant__foot {
  border-top: 1px solid #eef2f7;
  padding: 0.65rem 0.8rem 0.8rem;
  display: grid;
  gap: 0.55rem;
  background: #fff;
}
.ar-assistant__wa {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  width: 100%;
  text-align: left;
  border: 0;
  cursor: pointer;
  text-decoration: none !important;
  background: var(--ar-as-soft);
  border-radius: 12px;
  padding: 0.65rem 0.75rem;
  color: var(--ar-as-navy) !important;
}
.ar-assistant__wa:hover { filter: brightness(0.98); }

.ar-assistant__support-body {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  padding: 0.85rem 0.9rem;
}
.ar-assistant__support-lead {
  margin: 0 0 0.75rem;
  font-size: 0.95rem;
  color: var(--ar-as-muted);
  line-height: 1.4;
}
.ar-assistant__support-topics {
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
}
.ar-assistant__support-topic {
  width: 100%;
  display: grid;
  grid-template-columns: 1fr auto;
  grid-template-rows: auto auto;
  column-gap: 0.5rem;
  text-align: left;
  border: 1px solid #e2e8f0;
  background: #fff;
  border-radius: 12px;
  padding: 0.7rem 0.8rem;
  cursor: pointer;
  color: var(--ar-as-navy);
}
.ar-assistant__support-topic:hover {
  border-color: #bfdbfe;
  background: #f8fbff;
}
.ar-assistant__support-topic strong {
  grid-column: 1;
  grid-row: 1;
  font-size: 1.1rem;
}
.ar-assistant__support-topic span {
  grid-column: 1;
  grid-row: 2;
  font-size: 1rem;
  color: black;
  margin-top: 0.15rem;
}
.ar-assistant__support-topic .fa {
  grid-column: 2;
  grid-row: 1 / span 2;
  align-self: center;
  color: #94a3b8;
}
.ar-assistant__support-form { display: grid; gap: 0.55rem; }
.ar-assistant__support-label {
  margin: 0;
  font-size: 0.88rem;
  font-weight: 700;
  color: var(--ar-as-navy);
}
.ar-assistant__support-where {
  display: grid;
  gap: 0.35rem;
  font-size: 0.92rem;
  color: #0f172a;
}
.ar-assistant__support-where label {
  display: flex;
  gap: 0.45rem;
  align-items: center;
  font-weight: 500;
  cursor: pointer;
}
.ar-assistant__support-input,
.ar-assistant__support-textarea {
  width: 100%;
  border: 1px solid #d0d7e2;
  border-radius: 12px;
  padding: 0.65rem 0.75rem;
  font-size: 0.95rem;
  color: #0f172a;
  outline: none;
  resize: vertical;
}
.ar-assistant__support-input:focus,
.ar-assistant__support-textarea:focus {
  border-color: #93c5fd;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.15);
}
.ar-assistant__support-actions {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
  margin-top: 0.35rem;
}
.ar-assistant__support-secondary,
.ar-assistant__support-primary {
  border: 0;
  border-radius: 999px;
  padding: 0.55rem 0.95rem;
  font-size: 0.9rem;
  font-weight: 700;
  cursor: pointer;
}
.ar-assistant__support-secondary {
  background: #f1f5f9;
  color: var(--ar-as-navy);
}
.ar-assistant__support-primary {
  background: #25d366;
  color: #fff;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
}
.ar-assistant__support-primary:hover { filter: brightness(0.96); }

.ar-assistant__cta-wrap {
  margin: 0.65rem 0 0;
}
.ar-assistant__cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  border: 0;
  border-radius: 999px;
  padding: 0.55rem 0.95rem;
  background: var(--ar-as-blue);
  color: #fff !important;
  font-size: 0.92rem;
  font-weight: 700;
  cursor: pointer;
  text-align: center;
}
.ar-assistant__cta + .ar-assistant__cta-wrap,
.ar-assistant__cta-wrap + .ar-assistant__cta-wrap {
  margin-top: 0.45rem;
}
.ar-assistant__cta:hover {
  filter: brightness(0.96);
}
.ar-assistant__wa-ico {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: #fff;
  color: var(--ar-as-blue);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
}
.ar-assistant__wa-copy {
  flex: 1 1 auto;
  display: grid;
  gap: 0.1rem;
  min-width: 0;
}
.ar-assistant__wa-copy strong {
  font-size: 0.98rem;
  font-weight: 800;
}
.ar-assistant__wa-copy small {
  font-size: 0.84rem;
  color: var(--ar-as-muted);
  line-height: 1.3;
}
.ar-assistant__form {
  display: flex;
  gap: 0.45rem;
  align-items: center;
}
.ar-assistant__form[hidden] { display: none !important; }
.ar-assistant__form input {
  flex: 1 1 auto;
  border: 1px solid #d0d7e2;
  border-radius: 999px;
  padding: 0.65rem 0.95rem;
  font-size: 1rem;
  color: #0f172a;
  outline: none;
}
.ar-assistant__form input:focus {
  border-color: #93c5fd;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.15);
}
.ar-assistant__send {
  width: 42px;
  height: 42px;
  border: 0;
  border-radius: 50%;
  background: var(--ar-as-blue);
  color: #fff;
  cursor: pointer;
  flex: 0 0 auto;
}
.ar-assistant__send:disabled {
  opacity: 0.55;
  cursor: wait;
}

@media (max-width: 480px) {
  .ar-assistant {
    left: 10px;
    bottom: 10px;
  }
  .ar-assistant__panel {
    width: calc(100vw - 20px);
    height: min(620px, calc(100vh - 20px));
  }
}
/* Mensajes globales (admin broadcast) */
.ar-bc-lead { margin: 0 0 1rem; color: #475569; font-size: 0.92rem; }
.ar-bc-history { margin-top: 1.5rem; }
.ar-bc-history h3 { margin: 0 0 0.75rem; font-size: 1.05rem; font-weight: 800; color: #0f172a; }
.ar-bc-user-results {
  display: flex; flex-direction: column; gap: 0.25rem;
  max-height: 220px; overflow: auto; margin: 0.35rem 0 0.5rem;
  border: 1px solid #e2e8f0; border-radius: 10px; background: #fff; padding: 0.35rem;
}
.ar-bc-user-results[hidden] { display: none !important; }
.ar-bc-user-hit {
  display: block; width: 100%; text-align: left; border: 0; background: transparent;
  padding: 0.45rem 0.6rem; border-radius: 8px; font-size: 0.86rem; color: #0f172a; cursor: pointer;
}
.ar-bc-user-hit:hover { background: #f1f5f9; }
.ar-bc-user-hit.is-picked { color: #64748b; }
.ar-bc-user-chips { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-top: 0.45rem; min-height: 0.5rem; }
.ar-bc-chip {
  display: inline-flex; align-items: center; gap: 0.35rem;
  background: #ecfdf5; color: #166534; border-radius: 999px;
  padding: 0.2rem 0.35rem 0.2rem 0.65rem; font-size: 0.8rem; font-weight: 600;
}
.ar-bc-chip button {
  border: 0; background: transparent; color: #166534; font-size: 1.1rem;
  line-height: 1; cursor: pointer; padding: 0 0.25rem;
}

.ar-bc-notify__row {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
  gap: 0.5rem 1rem; margin-top: 0.45rem;
}
.ar-bc-notify__row .ar-lv-notify__hint { margin: 0; flex: 1 1 220px; }
.ar-bc-notify__actions { display: flex; flex-wrap: wrap; gap: 0.4rem; }
.ar-bc-notify__actions[hidden] { display: none !important; }
.ar-bc-btn-cancel {
  background: #fff !important; color: #b91c1c !important; border: 1px solid #fecaca !important;
}
.ar-bc-btn-cancel:hover { background: #fef2f2 !important; }
.ar-bc-notify.is-paused .ar-lv-notify__bar span { background: #f59e0b; }
.ar-bc-notify.is-cancelled .ar-lv-notify__bar span { background: #94a3b8; }