/* Ridhya Academy admin theme — built on Bootstrap 5.3 */

:root {
  --ra-font: "Inter", "Segoe UI", system-ui, -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif;
  --ra-bg: #f4f6fa;
  --ra-surface: #ffffff;
  --ra-border: #e6e9f0;
  --ra-text: #182235;
  --ra-muted: #667085;
  --ra-primary: #2f5bea;
  --ra-primary-hover: #2549c7;
  --ra-primary-soft: #eef2fe;
  --ra-sidebar: #0f1b2d;
  --ra-sidebar-text: #b6c2d6;
  --ra-sidebar-active: #1c2b44;
  --ra-success-soft: #e7f6ee;
  --ra-success: #1a7f4b;
  --ra-warning-soft: #fff4e0;
  --ra-warning: #a35c00;
  --ra-danger-soft: #fdecec;
  --ra-danger: #b42318;
  --ra-neutral-soft: #eef0f4;
  --ra-radius: 12px;
  --ra-shadow: 0 1px 2px rgba(16, 24, 40, 0.04), 0 1px 3px rgba(16, 24, 40, 0.06);
  --ra-sidebar-width: 248px;

  --bs-body-font-family: var(--ra-font);
  --bs-body-color: var(--ra-text);
  --bs-body-bg: var(--ra-bg);
  --bs-primary: var(--ra-primary);
  --bs-primary-rgb: 47, 91, 234;
  --bs-link-color: var(--ra-primary);
  --bs-link-color-rgb: 47, 91, 234;
  --bs-link-hover-color: var(--ra-primary-hover);
  --bs-border-color: var(--ra-border);
  --bs-border-radius: 8px;
}

html { font-size: 15px; }

body {
  font-family: var(--ra-font);
  background: var(--ra-bg);
  color: var(--ra-text);
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6 { letter-spacing: -0.01em; font-weight: 650; }

.text-muted, .form-text { color: var(--ra-muted) !important; }

/* Buttons */
.btn { font-weight: 550; border-radius: 8px; padding: 0.5rem 0.95rem; }
.btn-sm { padding: 0.3rem 0.65rem; font-size: 0.85rem; }
.btn-primary { --bs-btn-bg: var(--ra-primary); --bs-btn-border-color: var(--ra-primary);
  --bs-btn-hover-bg: var(--ra-primary-hover); --bs-btn-hover-border-color: var(--ra-primary-hover);
  --bs-btn-active-bg: var(--ra-primary-hover); --bs-btn-disabled-bg: #9db1f3; --bs-btn-disabled-border-color: #9db1f3; }
.btn-outline-primary { --bs-btn-color: var(--ra-primary); --bs-btn-border-color: #c9d4fa;
  --bs-btn-hover-bg: var(--ra-primary); --bs-btn-hover-border-color: var(--ra-primary); }
.btn-light { --bs-btn-bg: #fff; --bs-btn-border-color: var(--ra-border); --bs-btn-hover-bg: #f7f8fb; --bs-btn-hover-border-color: #d5dae4; }
.btn .ra-icon { margin-right: 0.35rem; margin-top: -2px; }
.btn:focus-visible, .form-control:focus, .form-select:focus, .form-check-input:focus {
  box-shadow: 0 0 0 3px rgba(47, 91, 234, 0.18);
  border-color: #8fa6f2;
}

/* Forms */
.form-label { font-weight: 550; font-size: 0.875rem; margin-bottom: 0.35rem; }
.form-control, .form-select { border-radius: 8px; border-color: #d5dae4; padding: 0.55rem 0.75rem; }
.form-check-input:checked { background-color: var(--ra-primary); border-color: var(--ra-primary); }
.input-icon { position: relative; }
.input-icon .ra-icon { position: absolute; left: 0.75rem; top: 50%; transform: translateY(-50%); color: var(--ra-muted); }
.input-icon .form-control { padding-left: 2.3rem; }

/* Icons */
.ra-icon { width: 18px; height: 18px; flex-shrink: 0; vertical-align: middle; }
.ra-icon-sm { width: 15px; height: 15px; }

/* App shell */
.ra-shell { min-height: 100vh; }

.ra-sidebar {
  --bs-offcanvas-width: var(--ra-sidebar-width);
  --bs-offcanvas-bg: var(--ra-sidebar);
  --bs-offcanvas-color: var(--ra-sidebar-text);
  width: var(--ra-sidebar-width);
  /* Bootstrap's .offcanvas-lg makes the panel transparent on wide screens; keep the sidebar colour. */
  background-color: var(--ra-sidebar) !important;
  color: var(--ra-sidebar-text);
  display: flex;
  flex-direction: column;
}

@media (min-width: 992px) {
  .ra-sidebar { position: fixed; inset: 0 auto 0 0; z-index: 1030; }
  .ra-main { margin-left: var(--ra-sidebar-width); }
}

.ra-sidebar .offcanvas-body { display: flex; flex-direction: column; padding: 0; height: 100%; }

.ra-brand {
  display: flex; align-items: center; gap: 0.7rem;
  padding: 1.25rem 1.25rem 1rem;
  color: #fff; text-decoration: none;
}
.ra-brand:hover { color: #fff; }
.ra-brand-mark {
  display: inline-flex; align-items: center; justify-content: center;
  width: 36px; height: 36px; border-radius: 10px;
  background: linear-gradient(135deg, #4c7cff, #2f5bea);
  color: #fff; font-weight: 700; font-size: 0.85rem; letter-spacing: 0.5px;
}
.ra-brand-name { font-weight: 650; line-height: 1.1; }
.ra-brand-sub { display: block; font-size: 0.72rem; color: var(--ra-sidebar-text); font-weight: 500; }

.ra-nav { padding: 0.5rem 0.75rem; flex: 1; overflow-y: auto; }
.ra-nav-section {
  font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.08em;
  color: #6d7d97; padding: 1rem 0.6rem 0.4rem; font-weight: 600;
}
.ra-nav-link {
  display: flex; align-items: center; gap: 0.7rem;
  padding: 0.55rem 0.7rem; border-radius: 8px;
  color: var(--ra-sidebar-text); text-decoration: none; font-weight: 500; font-size: 0.93rem;
}
.ra-nav-link:hover { background: rgba(255, 255, 255, 0.05); color: #fff; }
.ra-nav-link.active { background: var(--ra-sidebar-active); color: #fff; box-shadow: inset 3px 0 0 #4c7cff; }
.ra-nav-link.disabled { opacity: 0.45; pointer-events: none; }
.ra-nav-link .ra-soon { margin-left: auto; font-size: 0.65rem; padding: 0.1rem 0.4rem; border-radius: 6px; background: rgba(255,255,255,0.08); }

.ra-user {
  display: flex; align-items: center; gap: 0.7rem;
  padding: 0.9rem 1rem; margin: 0.75rem; border-radius: 10px;
  background: rgba(255, 255, 255, 0.04);
}
.ra-user-name { color: #fff; font-weight: 600; font-size: 0.88rem; line-height: 1.2; }
.ra-user-email { font-size: 0.75rem; color: var(--ra-sidebar-text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ra-user .btn-signout {
  margin-left: auto; color: var(--ra-sidebar-text); background: none; border: 0; padding: 0.35rem; border-radius: 6px;
}
.ra-user .btn-signout:hover { color: #fff; background: rgba(255, 255, 255, 0.08); }

.ra-avatar {
  display: inline-flex; align-items: center; justify-content: center;
  width: 36px; height: 36px; border-radius: 50%;
  background: #dfe7ff; color: #2549c7; font-weight: 650; font-size: 0.8rem; flex-shrink: 0;
}
.ra-sidebar .ra-avatar { background: #2a3b5c; color: #dbe4ff; }

.ra-topbar {
  display: flex; align-items: center; gap: 1rem;
  padding: 1.5rem 2rem 0.5rem;
}
.ra-topbar h1 { font-size: 1.5rem; margin: 0; }
.ra-topbar .ra-subtitle { color: var(--ra-muted); margin: 0.2rem 0 0; font-size: 0.92rem; }
.ra-topbar .ra-actions { margin-left: auto; display: flex; gap: 0.5rem; flex-wrap: wrap; }
.ra-menu-btn { display: inline-flex; }
@media (min-width: 992px) { .ra-menu-btn { display: none; } }

.ra-content { padding: 1rem 2rem 2.5rem; }
@media (max-width: 575.98px) {
  .ra-topbar { padding: 1.1rem 1rem 0.25rem; flex-wrap: wrap; }
  .ra-content { padding: 0.75rem 1rem 2rem; }
}

.ra-breadcrumb { font-size: 0.82rem; color: var(--ra-muted); margin-bottom: 0.2rem; }
.ra-breadcrumb a { color: var(--ra-muted); text-decoration: none; }
.ra-breadcrumb a:hover { color: var(--ra-primary); }

/* Cards */
.card { border: 1px solid var(--ra-border); border-radius: var(--ra-radius); box-shadow: var(--ra-shadow); }
.card-header { background: transparent; border-bottom: 1px solid var(--ra-border); padding: 1rem 1.25rem; }
.card-header h2, .card-title { font-size: 1rem; margin: 0; }
.card-body { padding: 1.25rem; }

.ra-stat { display: flex; align-items: center; gap: 1rem; }
.ra-stat-icon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 44px; height: 44px; border-radius: 10px; background: var(--ra-primary-soft); color: var(--ra-primary);
}
.ra-stat-value { font-size: 1.6rem; font-weight: 700; line-height: 1.1; }
.ra-stat-label { color: var(--ra-muted); font-size: 0.85rem; }

.ra-module { display: flex; gap: 0.9rem; align-items: flex-start; text-decoration: none; color: inherit; height: 100%; }
a.ra-module:hover .ra-module-title { color: var(--ra-primary); }
.ra-module-icon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 40px; height: 40px; border-radius: 10px; background: var(--ra-neutral-soft); color: #475467; flex-shrink: 0;
}
.ra-module-title { font-weight: 600; margin-bottom: 0.2rem; }

/* Tables */
.ra-table { margin: 0; }
.ra-table thead th {
  font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.05em; color: var(--ra-muted);
  font-weight: 600; background: #f9fafc; border-bottom: 1px solid var(--ra-border); padding: 0.75rem 1rem; white-space: nowrap;
}
.ra-table tbody td { padding: 0.85rem 1rem; vertical-align: middle; border-color: var(--ra-border); }
.ra-table tbody tr:hover { background: #fafbfd; }
.ra-table tbody tr:last-child td { border-bottom: 0; }

.ra-person { display: flex; align-items: center; gap: 0.75rem; }
.ra-person-name { font-weight: 600; }
.ra-person-email { color: var(--ra-muted); font-size: 0.85rem; }

/* Badges / pills */
.ra-pill {
  display: inline-flex; align-items: center; gap: 0.35rem;
  padding: 0.2rem 0.6rem; border-radius: 999px; font-size: 0.76rem; font-weight: 600; white-space: nowrap;
}
.ra-pill::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.ra-pill-success { background: var(--ra-success-soft); color: var(--ra-success); }
.ra-pill-warning { background: var(--ra-warning-soft); color: var(--ra-warning); }
.ra-pill-danger { background: var(--ra-danger-soft); color: var(--ra-danger); }
.ra-pill-neutral { background: var(--ra-neutral-soft); color: #475467; }

.ra-role {
  display: inline-block; padding: 0.15rem 0.55rem; border-radius: 6px;
  font-size: 0.76rem; font-weight: 600; background: var(--ra-primary-soft); color: #2549c7; margin: 0 0.25rem 0.25rem 0;
}
.ra-role-Admin { background: #f1ecff; color: #5b34c7; }
.ra-role-Academic { background: #e8f4ff; color: #135d9c; }
.ra-role-Support { background: #e8f8f3; color: #11785a; }
.ra-role-Finance { background: #fff3e6; color: #a2560c; }

/* Role picker */
.ra-role-option {
  display: flex; gap: 0.75rem; align-items: flex-start;
  border: 1px solid var(--ra-border); border-radius: 10px; padding: 0.8rem 0.9rem; cursor: pointer; height: 100%;
  transition: border-color 0.15s, background 0.15s;
}
.ra-role-option:hover { border-color: #c9d4fa; }
.ra-role-option:has(input:checked) { border-color: var(--ra-primary); background: var(--ra-primary-soft); }
.ra-role-option .form-check-input { margin-top: 0.2rem; flex-shrink: 0; }
.ra-role-option strong { display: block; font-size: 0.92rem; }
.ra-role-option span { font-size: 0.82rem; color: var(--ra-muted); }

/* Alerts */
.alert { border-radius: 10px; border: 1px solid transparent; font-size: 0.9rem; }
.alert-success { background: var(--ra-success-soft); color: #0f5e36; border-color: #c4e9d4; }
.alert-danger { background: var(--ra-danger-soft); color: #912018; border-color: #f6c9c5; }
.alert-warning { background: var(--ra-warning-soft); color: #7a4500; border-color: #f7dcae; }
.alert-info { background: var(--ra-primary-soft); color: #1d3fb0; border-color: #d3ddfc; }

.ra-empty { text-align: center; padding: 3rem 1rem; color: var(--ra-muted); }
.ra-empty .ra-icon { width: 36px; height: 36px; margin-bottom: 0.5rem; color: #98a2b3; }

.ra-section-title { font-size: 0.95rem; font-weight: 650; margin-bottom: 0.25rem; }
.ra-danger-zone { border-color: #f6c9c5; }

/* Login */
.ra-auth { min-height: 100vh; display: grid; grid-template-columns: 1fr; background: var(--ra-bg); }
@media (min-width: 992px) { .ra-auth { grid-template-columns: minmax(380px, 44%) 1fr; } }

.ra-auth-brand {
  display: none;
  background: radial-gradient(circle at 20% 15%, rgba(76, 124, 255, 0.35), transparent 45%),
              linear-gradient(160deg, #0f1b2d 0%, #15274a 60%, #1d3a7a 100%);
  color: #e6ecf8; padding: 3rem; flex-direction: column; justify-content: space-between;
}
@media (min-width: 992px) { .ra-auth-brand { display: flex; } }
.ra-auth-brand h1 { color: #fff; font-size: 2.1rem; line-height: 1.2; margin: 0 0 1rem; max-width: 26ch; }
.ra-auth-brand p { color: #b6c2d6; max-width: 42ch; }
.ra-auth-points { list-style: none; padding: 0; margin: 2rem 0 0; display: grid; gap: 0.9rem; }
.ra-auth-points li { display: flex; gap: 0.75rem; align-items: flex-start; color: #dbe4f3; }
.ra-auth-points .ra-icon { color: #7ea2ff; margin-top: 2px; }
.ra-auth-foot { font-size: 0.8rem; color: #8494b0; }

.ra-auth-panel { display: flex; align-items: center; justify-content: center; padding: 2rem 1rem; }
.ra-auth-inner { width: 100%; max-width: 440px; }
.ra-auth-inner .ra-brand { padding: 0 0 1.5rem; color: var(--ra-text); }
.ra-auth-inner .ra-brand-sub { color: var(--ra-muted); }
@media (min-width: 992px) { .ra-auth-inner .ra-brand-mobile { display: none; } }

.ra-db-card summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 0.75rem; }
.ra-db-card summary::-webkit-details-marker { display: none; }
.ra-db-card summary .ra-chevron { margin-left: 0.25rem; transition: transform 0.2s; color: var(--ra-muted); }
.ra-db-card details[open] summary .ra-chevron { transform: rotate(180deg); }
.ra-db-meta { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.5rem; margin: 1rem 0; }
.ra-db-meta div { background: #f9fafc; border: 1px solid var(--ra-border); border-radius: 8px; padding: 0.55rem 0.7rem; }
.ra-db-meta small { display: block; color: var(--ra-muted); font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.04em; }
.ra-db-meta strong { font-size: 0.95rem; }

.footer-note { font-size: 0.8rem; color: var(--ra-muted); }

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

/* Inline edit popover (details/summary) */
.ra-inline-edit { position: relative; }
.ra-inline-edit > summary { list-style: none; }
.ra-inline-edit > summary::-webkit-details-marker { display: none; }
.ra-popover {
  position: absolute; right: 0; top: calc(100% + 6px); z-index: 20; width: 260px;
  box-shadow: 0 12px 32px rgba(16, 24, 40, 0.16);
}

/* Tutor pipeline */
.ra-pipeline { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 0.75rem; }
@media (max-width: 767.98px) { .ra-pipeline { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.ra-pipeline-step { position: relative; }
.ra-pipeline-step:hover { border-color: #c9d4fa; }
.ra-pipeline-step.active { border-color: var(--ra-primary); box-shadow: 0 0 0 3px rgba(47, 91, 234, 0.12); }
.progress { background: var(--ra-neutral-soft); }
.progress-bar { background: var(--ra-primary); }

/* Toggle chips (btn-check) */
.ra-chip { border: 1px solid #d5dae4; background: #fff; color: #344054; border-radius: 999px; font-weight: 500; padding: 0.3rem 0.8rem; }
.ra-chip:hover { border-color: #b4c3f5; background: #f7f9ff; }
.btn-check:checked + .ra-chip { background: var(--ra-primary-soft); border-color: var(--ra-primary); color: #1d3fb0; }
.btn-check:focus-visible + .ra-chip { box-shadow: 0 0 0 3px rgba(47, 91, 234, 0.18); }

.btn-check:checked + .ra-chip-present { background: var(--ra-success-soft); border-color: var(--ra-success); color: var(--ra-success); }
.btn-check:checked + .ra-chip-absent { background: var(--ra-danger-soft); border-color: var(--ra-danger); color: var(--ra-danger); }

/* Score rubric */
.ra-score-total { font-size: 2.2rem; font-weight: 700; line-height: 1; }

/* Filters bar */
.ra-filters .form-select, .ra-filters .form-control { min-width: 0; }

/* Course and batch labels */
.ra-code { font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 0.82rem; color: #344054; }
.ra-meta { color: var(--ra-muted); font-size: 0.82rem; }

/* Timetable grid */
.ra-timetable { min-width: 860px; }
.ra-timetable th { text-align: center; }
.ra-timetable td { vertical-align: top; min-width: 120px; padding: 0.5rem !important; }
.ra-timetable td.ra-time { font-weight: 600; white-space: nowrap; color: var(--ra-muted); font-size: 0.82rem; vertical-align: middle; text-align: center; width: 90px; min-width: 90px; }
.ra-slot {
  display: block; text-decoration: none; color: inherit;
  border-left: 3px solid var(--ra-primary); background: var(--ra-primary-soft);
  border-radius: 6px; padding: 0.35rem 0.5rem; margin-bottom: 0.35rem; font-size: 0.78rem; line-height: 1.3;
}
.ra-slot:hover { filter: brightness(0.97); }
.ra-slot strong { display: block; font-size: 0.82rem; }
.ra-slot.ra-slot-clash { border-left-color: var(--ra-danger); background: var(--ra-danger-soft); }
.ra-slot.ra-slot-planned { border-left-color: #98a2b3; background: var(--ra-neutral-soft); }