/* ============================================================
   TL DESIGN SYSTEM v10.9.8 — MASTER THIN LINE ICON FAMILY
   Unified typography, spacing and thin-line icon system.
   Loaded last so it is the single visual baseline across
   Public / Admin / Member / Profile / Content / Media / Auth.
   ============================================================ */

:root {
  --tl-font-body: 10pt;
  --tl-font-secondary: 9pt;
  --tl-font-page-title: 18pt;
  --tl-font-section-title: 13pt;
  --tl-font-card-title: 11pt;

  --tl-weight-regular: 400;
  --tl-weight-medium: 500;
  --tl-weight-semibold: 600;

  --tl-icon-primary-card: 56px;
  --tl-icon-section: 36px;
  --tl-icon-sidebar: 20px;
  --tl-icon-inline: 18px;
  --tl-icon-small: 16px;

  --tl-space-1: 4px;
  --tl-space-2: 8px;
  --tl-space-3: 12px;
  --tl-space-4: 16px;
  --tl-space-5: 20px;

  --tl-radius-card: 12px;
  --tl-radius-control: 8px;
  --tl-border: #E5E7EB;
  --tl-text: #111827;
  --tl-text-secondary: #64748B;
  --tl-primary: #2563EB;
}

/* ---------- Typography ---------- */
html, body {
  font-size: var(--tl-font-body);
}
body, button, input, select, textarea, table {
  font-size: var(--tl-font-body);
  font-weight: var(--tl-weight-regular);
}
h1, .page-title, .admin-page-title, .member-page-title {
  font-size: var(--tl-font-page-title) !important;
  line-height: 1.2 !important;
  font-weight: var(--tl-weight-semibold) !important;
  margin-bottom: var(--tl-space-1) !important;
}
h2, .section-title {
  font-size: var(--tl-font-section-title) !important;
  line-height: 1.25 !important;
  font-weight: var(--tl-weight-semibold) !important;
}
h3, h4, h5, h6, .card-title {
  font-size: var(--tl-font-card-title) !important;
  line-height: 1.3 !important;
  font-weight: var(--tl-weight-medium) !important;
}
small, .small, .text-secondary, .form-text, .caption {
  font-weight: var(--tl-weight-regular) !important;
}
.fw-bold, strong, b {
  font-weight: var(--tl-weight-semibold) !important;
}
.nav-link:not(.active), .dropdown-item, label, .form-label, td {
  font-weight: var(--tl-weight-regular) !important;
}
.nav-link.active, th {
  font-weight: var(--tl-weight-semibold) !important;
}

/* ---------- Thin-line mask icon primitive ---------- */
.tl-i {
  --tl-icon-mask: none;
  display: inline-block;
  width: var(--tl-icon-inline);
  height: var(--tl-icon-inline);
  min-width: var(--tl-icon-inline);
  flex: 0 0 var(--tl-icon-inline);
  vertical-align: -0.18em;
  background-color: currentColor;
  -webkit-mask-image: var(--tl-icon-mask);
  mask-image: var(--tl-icon-mask);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  mask-size: contain;
}
.tl-i-modules-add{--tl-icon-mask:url("/static/images/tl-ui/line/modules/add.svg");}
.tl-i-modules-audit{--tl-icon-mask:url("/static/images/tl-ui/line/modules/audit.svg");}
.tl-i-modules-backup{--tl-icon-mask:url("/static/images/tl-ui/line/modules/backup.svg");}
.tl-i-modules-categories{--tl-icon-mask:url("/static/images/tl-ui/line/modules/categories.svg");}
.tl-i-modules-content-review{--tl-icon-mask:url("/static/images/tl-ui/line/modules/content-review.svg");}
.tl-i-modules-dashboard{--tl-icon-mask:url("/static/images/tl-ui/line/modules/dashboard.svg");}
.tl-i-modules-edit{--tl-icon-mask:url("/static/images/tl-ui/line/modules/edit.svg");}
.tl-i-modules-help{--tl-icon-mask:url("/static/images/tl-ui/line/modules/help.svg");}
.tl-i-modules-knowledge{--tl-icon-mask:url("/static/images/tl-ui/line/modules/knowledge.svg");}
.tl-i-modules-learning-resources{--tl-icon-mask:url("/static/images/tl-ui/line/modules/learning-resources.svg");}
.tl-i-modules-media{--tl-icon-mask:url("/static/images/tl-ui/line/modules/media.svg");}
.tl-i-modules-news{--tl-icon-mask:url("/static/images/tl-ui/line/modules/news.svg");}
.tl-i-modules-overview{--tl-icon-mask:url("/static/images/tl-ui/line/modules/overview.svg");}
.tl-i-modules-projects{--tl-icon-mask:url("/static/images/tl-ui/line/modules/projects.svg");}
.tl-i-modules-publications{--tl-icon-mask:url("/static/images/tl-ui/line/modules/publications.svg");}
.tl-i-modules-reports{--tl-icon-mask:url("/static/images/tl-ui/line/modules/reports.svg");}
.tl-i-modules-research{--tl-icon-mask:url("/static/images/tl-ui/line/modules/research.svg");}
.tl-i-modules-roles{--tl-icon-mask:url("/static/images/tl-ui/line/modules/roles.svg");}
.tl-i-modules-system{--tl-icon-mask:url("/static/images/tl-ui/line/modules/system.svg");}
.tl-i-modules-tags{--tl-icon-mask:url("/static/images/tl-ui/line/modules/tags.svg");}
.tl-i-modules-teaching{--tl-icon-mask:url("/static/images/tl-ui/line/modules/teaching.svg");}
.tl-i-modules-trash{--tl-icon-mask:url("/static/images/tl-ui/line/modules/trash.svg");}
.tl-i-modules-users{--tl-icon-mask:url("/static/images/tl-ui/line/modules/users.svg");}
.tl-i-utility-archive{--tl-icon-mask:url("/static/images/tl-ui/line/utility/archive.svg");}
.tl-i-utility-arrow-left{--tl-icon-mask:url("/static/images/tl-ui/line/utility/arrow-left.svg");}
.tl-i-utility-arrow-right{--tl-icon-mask:url("/static/images/tl-ui/line/utility/arrow-right.svg");}
.tl-i-utility-bookmark{--tl-icon-mask:url("/static/images/tl-ui/line/utility/bookmark.svg");}
.tl-i-utility-box{--tl-icon-mask:url("/static/images/tl-ui/line/utility/box.svg");}
.tl-i-utility-calendar{--tl-icon-mask:url("/static/images/tl-ui/line/utility/calendar.svg");}
.tl-i-utility-calendar-plus{--tl-icon-mask:url("/static/images/tl-ui/line/utility/calendar-plus.svg");}
.tl-i-utility-cancel{--tl-icon-mask:url("/static/images/tl-ui/line/utility/cancel.svg");}
.tl-i-utility-check{--tl-icon-mask:url("/static/images/tl-ui/line/utility/check.svg");}
.tl-i-utility-chevron-left{--tl-icon-mask:url("/static/images/tl-ui/line/utility/chevron-left.svg");}
.tl-i-utility-chevron-right{--tl-icon-mask:url("/static/images/tl-ui/line/utility/chevron-right.svg");}
.tl-i-utility-clock{--tl-icon-mask:url("/static/images/tl-ui/line/utility/clock.svg");}
.tl-i-utility-close{--tl-icon-mask:url("/static/images/tl-ui/line/utility/close.svg");}
.tl-i-utility-copy{--tl-icon-mask:url("/static/images/tl-ui/line/utility/copy.svg");}
.tl-i-utility-database{--tl-icon-mask:url("/static/images/tl-ui/line/utility/database.svg");}
.tl-i-utility-delete{--tl-icon-mask:url("/static/images/tl-ui/line/utility/delete.svg");}
.tl-i-utility-download{--tl-icon-mask:url("/static/images/tl-ui/line/utility/download.svg");}
.tl-i-utility-envelope{--tl-icon-mask:url("/static/images/tl-ui/line/utility/envelope.svg");}
.tl-i-utility-error{--tl-icon-mask:url("/static/images/tl-ui/line/utility/error.svg");}
.tl-i-utility-external-link{--tl-icon-mask:url("/static/images/tl-ui/line/utility/external-link.svg");}
.tl-i-utility-filter{--tl-icon-mask:url("/static/images/tl-ui/line/utility/filter.svg");}
.tl-i-utility-folder{--tl-icon-mask:url("/static/images/tl-ui/line/utility/folder.svg");}
.tl-i-utility-globe{--tl-icon-mask:url("/static/images/tl-ui/line/utility/globe.svg");}
.tl-i-utility-grid{--tl-icon-mask:url("/static/images/tl-ui/line/utility/grid.svg");}
.tl-i-utility-home{--tl-icon-mask:url("/static/images/tl-ui/line/utility/home.svg");}
.tl-i-utility-inbox{--tl-icon-mask:url("/static/images/tl-ui/line/utility/inbox.svg");}
.tl-i-utility-info{--tl-icon-mask:url("/static/images/tl-ui/line/utility/info.svg");}
.tl-i-utility-link{--tl-icon-mask:url("/static/images/tl-ui/line/utility/link.svg");}
.tl-i-utility-lock{--tl-icon-mask:url("/static/images/tl-ui/line/utility/lock.svg");}
.tl-i-utility-login{--tl-icon-mask:url("/static/images/tl-ui/line/utility/login.svg");}
.tl-i-utility-logout{--tl-icon-mask:url("/static/images/tl-ui/line/utility/logout.svg");}
.tl-i-utility-menu{--tl-icon-mask:url("/static/images/tl-ui/line/utility/menu.svg");}
.tl-i-utility-more{--tl-icon-mask:url("/static/images/tl-ui/line/utility/more.svg");}
.tl-i-utility-notification{--tl-icon-mask:url("/static/images/tl-ui/line/utility/notification.svg");}
.tl-i-utility-person-plus{--tl-icon-mask:url("/static/images/tl-ui/line/utility/person-plus.svg");}
.tl-i-utility-play{--tl-icon-mask:url("/static/images/tl-ui/line/utility/play.svg");}
.tl-i-utility-plus{--tl-icon-mask:url("/static/images/tl-ui/line/utility/plus.svg");}
.tl-i-utility-print{--tl-icon-mask:url("/static/images/tl-ui/line/utility/print.svg");}
.tl-i-utility-profile{--tl-icon-mask:url("/static/images/tl-ui/line/utility/profile.svg");}
.tl-i-utility-refresh{--tl-icon-mask:url("/static/images/tl-ui/line/utility/refresh.svg");}
.tl-i-utility-search{--tl-icon-mask:url("/static/images/tl-ui/line/utility/search.svg");}
.tl-i-utility-send{--tl-icon-mask:url("/static/images/tl-ui/line/utility/send.svg");}
.tl-i-utility-server{--tl-icon-mask:url("/static/images/tl-ui/line/utility/server.svg");}
.tl-i-utility-share{--tl-icon-mask:url("/static/images/tl-ui/line/utility/share.svg");}
.tl-i-utility-shield{--tl-icon-mask:url("/static/images/tl-ui/line/utility/shield.svg");}
.tl-i-utility-star{--tl-icon-mask:url("/static/images/tl-ui/line/utility/star.svg");}
.tl-i-utility-success{--tl-icon-mask:url("/static/images/tl-ui/line/utility/success.svg");}
.tl-i-utility-unlock{--tl-icon-mask:url("/static/images/tl-ui/line/utility/unlock.svg");}
.tl-i-utility-upload{--tl-icon-mask:url("/static/images/tl-ui/line/utility/upload.svg");}
.tl-i-utility-view{--tl-icon-mask:url("/static/images/tl-ui/line/utility/view.svg");}
.tl-i-utility-warning{--tl-icon-mask:url("/static/images/tl-ui/line/utility/warning.svg");}

/* Module identity colours */
.tl-module-publications { color:#6366F1 !important; }
.tl-module-teaching { color:#F59E0B !important; }
.tl-module-projects { color:#3B82F6 !important; }
.tl-module-research { color:#10B981 !important; }
.tl-module-knowledge { color:#FBBF24 !important; }
.tl-module-learning-resources { color:#7C3AED !important; }
.tl-module-news { color:#EF4444 !important; }
.tl-module-media { color:#0EA5E9 !important; }

/* ---------- Icon sizing by context ---------- */
.tl-primary-card-icon,
.card-icon > .tl-i,
.dashboard-card > .card-icon .tl-i {
  width: var(--tl-icon-primary-card) !important;
  height: var(--tl-icon-primary-card) !important;
  min-width: var(--tl-icon-primary-card) !important;
  flex-basis: var(--tl-icon-primary-card) !important;
}
.tl-card-icon {
  width: var(--tl-icon-primary-card) !important;
  height: var(--tl-icon-primary-card) !important;
  min-width: var(--tl-icon-primary-card) !important;
  object-fit: contain !important;
  filter: none !important;
}
.tl-overview-item-icon,
.tl-overview-title-icon {
  width: var(--tl-icon-section) !important;
  height: var(--tl-icon-section) !important;
  min-width: var(--tl-icon-section) !important;
  object-fit: contain !important;
  filter: none !important;
}
.admin-sidebar .tl-sidebar-icon,
.member-sidebar .tl-sidebar-icon,
.app-sidebar .tl-sidebar-icon {
  width: var(--tl-icon-sidebar) !important;
  height: var(--tl-icon-sidebar) !important;
  min-width: var(--tl-icon-sidebar) !important;
  flex: 0 0 var(--tl-icon-sidebar) !important;
  object-fit: contain !important;
  filter: none !important;
}
.tl-quick-actions .tl-quick-action-icon,
.tl-quick-actions .tl-button-icon,
.btn .tl-i,
a.btn .tl-i {
  width: var(--tl-icon-inline) !important;
  height: var(--tl-icon-inline) !important;
  min-width: var(--tl-icon-inline) !important;
  flex: 0 0 var(--tl-icon-inline) !important;
}
.tl-media-placeholder-icon {
  width: 34px !important;
  height: 34px !important;
}

/* Keep primary-button icons white by inheritance. */
.btn-primary .tl-i, .btn-danger .tl-i, .btn-success .tl-i {
  color: inherit !important;
}

/* ---------- Card / panel / border consistency ---------- */
.dashboard-card,
.admin-panel,
.admin-form-card,
.card,
.modal-content {
  border: 1px solid var(--tl-border) !important;
  border-radius: var(--tl-radius-card) !important;
  box-shadow: none !important;
}
.dashboard-card,
.admin-panel,
.admin-form-card {
  padding: var(--tl-space-4);
}
.border, .list-group-item, table, .table > :not(caption) > * > * {
  border-color: var(--tl-border) !important;
}
.row.g-4, .g-4 {
  --bs-gutter-x: 16px;
  --bs-gutter-y: 16px;
}
.row.g-3, .g-3 {
  --bs-gutter-x: 12px;
  --bs-gutter-y: 12px;
}

/* ---------- Controls ---------- */
.btn, .form-control, .form-select {
  min-height: 34px;
  border-radius: var(--tl-radius-control) !important;
  font-size: var(--tl-font-body) !important;
}
.btn {
  font-weight: var(--tl-weight-regular) !important;
  padding: 6px 12px !important;
  display: inline-flex;
  align-items: center;
  gap: 7px;
}
.btn-primary {
  font-weight: var(--tl-weight-medium) !important;
}
.form-label {
  margin-bottom: 4px !important;
}
.table > :not(caption) > * > * {
  padding-top: 8px !important;
  padding-bottom: 8px !important;
}
.badge {
  font-weight: var(--tl-weight-medium) !important;
}

/* ---------- Sidebar rhythm ---------- */
.admin-sidebar .nav-link,
.member-sidebar .nav-link,
.app-sidebar .nav-link {
  min-height: 38px;
  gap: 9px !important;
  align-items: center;
}
.admin-sidebar .nav-link span,
.member-sidebar .nav-link span {
  line-height: 1.2;
}

/* ---------- Dashboard primary cards ---------- */
.dashboard-card .card-icon {
  margin-bottom: 8px !important;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 52px;
}
.dashboard-card > p.text-secondary.mb-2 {
  margin-bottom: 4px !important;
  font-weight: var(--tl-weight-regular) !important;
}
.dashboard-card > h2 {
  margin-bottom: 4px !important;
}
.tl-content-overview-item {
  grid-template-columns: 48px minmax(0,1fr) !important;
  gap: 12px !important;
}
.tl-overview-item-head {
  gap: 10px !important;
}

/* ---------- Public site ---------- */
.public-page h1,
.public-hero h1,
.page-hero h1 {
  font-size: var(--tl-font-page-title) !important;
  font-weight: var(--tl-weight-semibold) !important;
}
.public-page h2,
.public-page h3 {
  font-weight: var(--tl-weight-medium) !important;
}
.public-page .tl-i,
.public-header .tl-i,
.public-nav .tl-i {
  vertical-align: -0.18em;
}

/* ---------- Responsive ---------- */
@media (max-width: 767.98px) {
  :root {
    --tl-font-page-title: 16pt;
    --tl-icon-primary-card: 44px;
    --tl-icon-section: 30px;
    --tl-icon-sidebar: 19px;
  }
}


/* ---------- v10.9.8 MASTER LINE ICON ENFORCEMENT ---------- */
/* Direct SVG image icons now come exclusively from /tl-ui/line/. */
img.tl-card-icon,
img.tl-overview-item-icon,
img.tl-overview-title-icon,
img.tl-sidebar-icon,
img.tl-button-icon,
img.tl-quick-action-icon {
  object-fit: contain !important;
  object-position: center !important;
  background: transparent !important;
  box-shadow: none !important;
}
/* Active sidebar and solid primary buttons need a white line icon. */
.admin-sidebar .nav-link.active img.tl-sidebar-icon,
.member-sidebar .nav-link.active img.tl-sidebar-icon,
.app-sidebar .nav-link.active img.tl-sidebar-icon,
.btn-primary img.tl-button-icon,
.btn-primary img.tl-quick-action-icon,
.btn-danger img.tl-button-icon,
.btn-success img.tl-button-icon {
  filter: brightness(0) invert(1) !important;
}
/* Public/detail icon containers: make the master line icons visibly larger. */
.public-page .sidebar-icon .tl-i,
.public-page .sidebar-icon img,
.public-detail .sidebar-icon .tl-i,
.public-detail .sidebar-icon img,
main .sidebar-icon .tl-i,
main .sidebar-icon img {
  width: 34px !important;
  height: 34px !important;
}
/* Keep normal sidebar module colours from the SVG itself; no opacity dimming. */
.admin-sidebar img.tl-sidebar-icon,
.member-sidebar img.tl-sidebar-icon,
.app-sidebar img.tl-sidebar-icon {
  opacity: 1 !important;
}