/* VR-освіта · доповнення до теми Filament */
.xr-bar { height: 6px; border-radius: 99px; background: rgb(0 0 0 / .08); overflow: hidden; margin-top: 6px; }
.dark .xr-bar { background: rgb(255 255 255 / .1); }
.xr-bar > span { display: block; height: 100%; background: #8b5cf6; border-radius: inherit; transition: width .3s; }
.xr-bar--lg { height: 10px; }
.xr-link { color: #7c3aed; font-weight: 500; text-decoration: underline; text-underline-offset: 2px; cursor: pointer; }
.dark .xr-link { color: #a78bfa; }

.xr-matrix { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 10px; }
.xr-matrix__cell { border: 1px solid rgb(0 0 0 / .1); border-radius: 10px; padding: 10px 12px; font-size: 13px; }
.dark .xr-matrix__cell { border-color: rgb(255 255 255 / .1); }
.xr-matrix__cell--on { border-color: #22c55e; background: rgb(34 197 94 / .06); }
.xr-matrix__cell--revoked { border-color: #ef4444; background: rgb(239 68 68 / .05); }
.xr-matrix__cell--none, .xr-matrix__cell--off { opacity: .65; }
.xr-matrix__title { font-weight: 600; margin-bottom: 4px; }
.xr-matrix__line { color: rgb(100 116 139); }

.xr-alerts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
@media (max-width: 1024px) { .xr-alerts { grid-template-columns: 1fr; } }
.xr-alerts__h { display: flex; align-items: center; gap: 8px; font-weight: 600; font-size: 14px; margin-bottom: 8px; }
.xr-alerts__item { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 8px 10px; border-radius: 8px; font-size: 13px; }
.xr-alerts__item:hover { background: rgb(0 0 0 / .04); }
.dark .xr-alerts__item:hover { background: rgb(255 255 255 / .05); }
.xr-alerts__item small { color: rgb(100 116 139); }
.xr-alerts__item code { font-size: 11px; }
.xr-alerts__empty { font-size: 13px; color: rgb(100 116 139); padding: 8px 10px; }
.xr-dot { width: 8px; height: 8px; border-radius: 50%; display: inline-block; }
.xr-dot--danger { background: #ef4444; } .xr-dot--warning { background: #f59e0b; }
.xr-count { margin-left: auto; font-size: 12px; color: rgb(100 116 139); }
.xr-pill { white-space: nowrap; font-size: 12px; font-weight: 600; padding: 2px 8px; border-radius: 99px; }
.xr-pill--danger { background: rgb(239 68 68 / .12); color: #dc2626; }
.xr-pill--warning { background: rgb(245 158 11 / .15); color: #b45309; }

.xr-upload__drop { display: flex; gap: 12px; align-items: center; padding: 18px; border: 2px dashed rgb(0 0 0 / .15); border-radius: 12px; cursor: pointer; font-size: 13px; }
.dark .xr-upload__drop { border-color: rgb(255 255 255 / .15); }
.xr-upload__drop:hover { border-color: #8b5cf6; }
.xr-upload__icon { font-size: 22px; }
.xr-upload__progress, .xr-upload__done { padding: 12px 14px; border: 1px solid rgb(0 0 0 / .1); border-radius: 12px; font-size: 13px; }
.xr-upload__done { display: flex; justify-content: space-between; border-color: #22c55e; }
.xr-upload__row { display: flex; justify-content: space-between; gap: 12px; }
.xr-upload__meta { margin-top: 6px; color: rgb(100 116 139); }
.xr-upload__error { color: #dc2626; font-size: 13px; margin-top: 6px; }
.xr-sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ============================================================
   Тема VR-освіти: світла, сіро-біла
   ============================================================ */
.fi-body { background: #f5f6f7; }
.fi-sidebar { background: #ffffff; border-right: 1px solid #e5e7eb; }
.fi-topbar { background: #ffffff; --tw-ring-color: #e5e7eb; }
.fi-sidebar-nav-groups .fi-sidebar-group-label { color: #6b7280; letter-spacing: .04em; }
.fi-sidebar-item-btn { border-radius: 8px; }
.fi-sidebar-item-active .fi-sidebar-item-btn,
.fi-sidebar-item.fi-active > .fi-sidebar-item-btn { background: #f1f2f4; }
.fi-sidebar-item-active .fi-sidebar-item-icon, .fi-sidebar-item-active .fi-sidebar-item-label { color: #111827; }

.fi-section, .fi-ta-ctn, .fi-wi-stats-overview-stat, .fi-wi-chart, .fi-fo-tabs, .fi-in-entry-wrp-section, .fi-ta-empty-state {
  background: #ffffff;
  --tw-ring-color: #e5e7eb;
  box-shadow: 0 1px 2px rgba(0, 0, 0, .04);
  border-radius: 12px;
}
.fi-ta-header-cell, .fi-ta-header { background: #fafafa; }
.fi-ta-row:hover { background: #f7f8f9; }
.fi-wi-stats-overview-stat-value { color: #111827; }

.fi-btn { border-radius: 8px; }
.fi-badge { border-radius: 999px; }

/* сторінка входу */
.fi-simple-layout { background: linear-gradient(180deg, #ffffff 0%, #eef0f2 100%); }
.fi-simple-main { border: 1px solid #e5e7eb; border-radius: 16px; --tw-ring-color: transparent; box-shadow: 0 12px 32px rgba(0, 0, 0, .06); }
.fi-simple-main .fi-logo { margin-bottom: 1.25rem; }
.fi-simple-main .fi-logo img { height: 2rem; }
.fi-simple-main .fi-btn.fi-color-primary { width: 100%; justify-content: center; padding-block: .75rem; font-size: 1rem; font-weight: 600; }
.xr-login-sub { text-align: center; font-weight: 500; font-size: 12px; letter-spacing: 3px; text-transform: uppercase; color: #6b7280; margin: -.75rem 0 1.5rem; }
.xr-bar > span { background: #4b5563; }
.xr-link { color: #374151; }

/* VR-освіта: заголовки предметів у матриці доступів */
.xr-matrix__subject { margin: 14px 0 8px; font-size: 12px; font-weight: 700; letter-spacing: .6px; text-transform: uppercase; color: var(--c); }
.xr-matrix__subject:first-child { margin-top: 0; }