@charset "UTF-8";
@font-face {
  font-family: "Blacker";
  font-weight: 700;
  src: url("/css/Fonts/BlackerProDis-Bd.woff") format("woff");
}
@font-face {
  font-family: "NeueHass";
  font-weight: 700;
  src: url("/css/Fonts/NeueHaasDisplayBold.woff") format("woff");
}
@font-face {
  font-family: "NeueHass";
  font-weight: 400;
  src: url("/css/Fonts/NeueHaasDisplayRoman.woff") format("woff");
}
@font-face {
  font-family: "NeueHass";
  font-weight: 400;
  font-style: italic;
  src: url("/css/Fonts/NeueHaasDisplayRomanItalic.woff") format("woff");
}
@font-face {
  font-family: "NeueHass";
  font-weight: 700;
  font-style: italic;
  src: url("/css/Fonts/NeueHaasDisplayBoldItalic.woff") format("woff");
}
/* Global Font Rules */
* {
  font-family: "NeueHass", sans-serif;
}

h1, h2, h3, h4, h5, h6, .pdf-header .header-tagline {
  font-family: "Blacker", serif;
  font-weight: 700;
}

:root {
  --primary-color: #130E70;
  --primary-light: #AFE3E3;
  --secondary-color: #3BE2E2;
  --secondary-light: #A93DE2;
  --bs-light: #F4F7FE;
  --pink: #F8CAF8;
  --lavender: #A93DE2;
  --lime: #DBFD57;
  --bs-border-radius: 6px;
  --bs-border-radius-sm: 6px;
  --bs-border-radius-lg: 6px;
  --bs-border-radius-xl: 6px;
  --bs-border-radius-xxl: 6px;
  --bs-border-radius-2xl: 6px;
  --refresh-bg: #fde68a;
  --pay-bg: #aecdef;
  --cancel-bg: #fca5a5;
  --action-positive: #99dd9d;
  --action-neutral: #fde68a;
  --action-negative: #fca5a5;
  --status-cancelled: #fca5a5;
  --status-paid: #99dd9d;
}

.nav {
  --bs-nav-link-color: $primary;
}

.nav-link:hover {
  color: #130E70;
}

.text-primary {
  color: #130E70 !important;
}

.colourwhite {
  color: #FFFFFF;
}

.bg-light-primary {
  background-color: rgba(19, 14, 112, 0.1) !important;
}

.bg-primary {
  background: #130E70 !important;
}

.bg-lime {
  background: #DBFD57;
}

.bg-pink {
  background: #F8CAF8;
}

.bg-draft {
  background-color: #8dc0f7;
}

.bg-proposed {
  background-color: #d2aaf3;
}

.bg-secondary {
  background: #3BE2E2 !important;
}

.bg-save-green {
  background: #2fba8c !important;
}

.btn-refresh {
  background-color: var(--refresh-bg) !important;
  border-color: var(--refresh-bg) !important;
  color: #000 !important;
  border-radius: var(--bs-border-radius) !important;
}

.btn-pay {
  background-color: var(--pay-bg) !important;
  border-color: var(--pay-bg) !important;
  color: #ffffff !important;
  border-radius: var(--bs-border-radius) !important;
}

.btn-cancel {
  background-color: var(--cancel-bg) !important;
  border-color: var(--cancel-bg) !important;
  color: #000 !important;
  border-radius: var(--bs-border-radius) !important;
}

.btn-action-positive {
  background-color: var(--action-positive) !important;
  border-color: var(--action-positive) !important;
  color: #000 !important;
  border-radius: var(--bs-border-radius) !important;
}
.btn-action-positive:hover {
  background-color: transparent !important;
  border-color: var(--action-positive) !important;
  color: var(--action-positive) !important;
}

.btn-action-neutral {
  background-color: var(--action-neutral) !important;
  border-color: var(--action-neutral) !important;
  color: #000 !important;
  border-radius: var(--bs-border-radius) !important;
}
.btn-action-neutral:hover {
  background-color: transparent !important;
  border-color: var(--action-neutral) !important;
  color: var(--action-neutral) !important;
}

.btn-action-negative {
  background-color: var(--action-negative) !important;
  border-color: var(--action-negative) !important;
  color: #000 !important;
  border-radius: var(--bs-border-radius) !important;
}
.btn-action-negative:hover {
  background-color: transparent !important;
  border-color: var(--action-negative) !important;
  color: var(--action-negative) !important;
}

.btn-outline-action-positive {
  background-color: transparent !important;
  border-color: var(--action-positive) !important;
  color: var(--action-positive) !important;
  border-radius: var(--bs-border-radius) !important;
}
.btn-outline-action-positive:hover {
  background-color: var(--action-positive) !important;
  border-color: var(--action-positive) !important;
  color: #000 !important;
}

.btn-outline-action-negative {
  background-color: transparent !important;
  border-color: var(--action-negative) !important;
  color: var(--action-negative) !important;
  border-radius: var(--bs-border-radius) !important;
}
.btn-outline-action-negative:hover {
  background-color: var(--action-negative) !important;
  border-color: var(--action-negative) !important;
  color: #000 !important;
}

.btn-sm.btn-action-positive {
  background-color: var(--action-positive) !important;
  border-color: var(--action-positive) !important;
  color: #000 !important;
  border-radius: var(--bs-border-radius) !important;
}

.btn-sm.btn-action-neutral {
  background-color: var(--action-neutral) !important;
  border-color: var(--action-neutral) !important;
  color: #000 !important;
  border-radius: var(--bs-border-radius) !important;
}

.btn-group .btn-pay:not(:first-child):not(:last-child),
.btn-group .btn-cancel:not(:first-child):not(:last-child),
.btn-group .btn-action-positive:not(:first-child):not(:last-child),
.btn-group .btn-action-neutral:not(:first-child):not(:last-child),
.btn-group .btn:not(:first-child):not(:last-child) {
  border-radius: 0 !important;
}
.btn-group .btn-pay:first-child:not(:last-child),
.btn-group .btn-cancel:first-child:not(:last-child),
.btn-group .btn-action-positive:first-child:not(:last-child),
.btn-group .btn-action-neutral:first-child:not(:last-child),
.btn-group .btn:first-child:not(:last-child) {
  border-top-right-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}
.btn-group .btn-pay:last-child:not(:first-child),
.btn-group .btn-cancel:last-child:not(:first-child),
.btn-group .btn-action-positive:last-child:not(:first-child),
.btn-group .btn-action-neutral:last-child:not(:first-child),
.btn-group .btn:last-child:not(:first-child) {
  border-top-left-radius: 0 !important;
  border-bottom-left-radius: 0 !important;
}

.mw800 {
  max-width: 800px;
}

.card-shadow {
  box-shadow: rgba(0, 0, 0, 0.04) 14px 17px 40px 40px;
  background: #fff;
}

.mt-6 {
  margin-top: 5rem;
}

.mt-7 {
  margin-top: 7rem;
}

.mt-8 {
  margin-top: 10rem;
}

.mt-9 {
  margin-top: 15rem;
}

.mt-10 {
  margin-top: 20rem;
}

.mb-6 {
  margin-bottom: 5rem;
}

.mb-7 {
  margin-bottom: 7rem;
}

.mb-8 {
  margin-bottom: 10rem;
}

.mb-9 {
  margin-bottom: 15rem;
}

.mb-10 {
  margin-bottom: 20rem;
}

.mw-100 {
  max-width: 100%;
}

.hide-controls-until-hover .controls {
  display: none;
}
.hide-controls-until-hover:hover .controls {
  display: block;
}

.clearfix::after {
  display: block;
  content: "";
  clear: both;
}

.cursor-pointer {
  cursor: pointer;
}

.booking-indicator {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  display: inline-block;
}

.booking-indicator-positive {
  background-color: var(--action-positive) !important;
}

.booking-indicator-neutral {
  background-color: var(--action-neutral) !important;
}

.booking-indicator-negative {
  background-color: var(--action-negative) !important;
}

.booking-indicator-info {
  background-color: #0dcaf0 !important;
}

.status-indicator {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  display: inline-block;
}
.status-indicator.active {
  background-color: #28a745;
  box-shadow: 0 0 0 2px rgba(40, 167, 69, 0.2);
}
.status-indicator.inactive {
  background-color: #6c757d;
  box-shadow: 0 0 0 2px rgba(108, 117, 125, 0.2);
}
.status-indicator.pending {
  background-color: #ffc107;
  box-shadow: 0 0 0 2px rgba(255, 193, 7, 0.2);
}
.status-indicator.expired {
  background-color: #dc3545;
  box-shadow: 0 0 0 2px rgba(220, 53, 69, 0.2);
}

.badge {
  font-size: 1.4rem;
}

.blue-table-badge {
  background-color: white;
  color: #0d6efd;
  border: 1px solid #0d6efd;
}

.orange-table-badge {
  background-color: white;
  color: #fd7e14;
  border: 1px solid #fd7e14;
}

.red-table-badge {
  background-color: white;
  color: #dc3545;
  border: 1px solid #dc3545;
}

.mw35 {
  min-width: 35px;
}

.wspl {
  white-space: pre-line;
}

html {
  font-size: 10px;
}

body {
  font-family: "NeueHass", sans-serif;
  font-size: 1.6rem;
}

h1, h2, h3, h4, h5, h6 {
  font-family: "Blacker";
}

h1:focus {
  outline: none;
}

.text-purple {
  color: #130E70;
}

.text-lime {
  color: #DBFD57;
}

code {
  font-size: 1.2rem;
}

p {
  line-height: 2.4rem;
  padding-bottom: 20px;
}

.rte p {
  padding-bottom: 0px;
}

h1 {
  font-size: 3.5rem;
  color: #130E70;
  padding-bottom: 10px;
  font-weight: bold;
}

h2 {
  font-size: 2.5rem;
  color: #130E70;
  font-weight: bold;
}

h3 {
  color: #130E70;
  font-weight: bold;
  font-size: 2rem;
  display: inline-block;
  margin-bottom: 20px;
}

h4 {
  font-size: 1.75rem;
  color: #130E70;
  font-weight: bold;
}

h5 {
  font-size: 1.65rem;
  color: #130E70;
}

h6 {
  font-size: 1.5rem;
  color: #130E70;
}

.smaller-text {
  font-size: 60%;
}

label {
  font-weight: 900;
  color: #999;
}

small {
  font-size: 1.15rem;
}

a, .btn-link {
  color: #130E70;
  transition: 0.3s all ease-in-out;
}

.btn-primary {
  color: #130E70;
  background-color: #DBFD57;
  border-color: #DBFD57;
  border-width: 2px;
  font-weight: bold;
  padding: 6px 10px;
  border-radius: 6px;
  font-size: 1.2rem;
}
.btn-primary:hover {
  color: #DBFD57;
  border-color: #DBFD57;
  background-color: #130E70;
}

.btn-reverse-primary {
  color: #DBFD57;
  background-color: #130E70;
  border-color: #130E70;
  border-width: 2px;
  font-weight: bold;
  padding: 6px 10px;
  border-radius: 6px;
  font-size: 1.2rem;
}
.btn-reverse-primary:hover {
  color: #130E70;
  border-color: #130E70;
  background-color: #DBFD57;
}

.btn-outline-primary {
  border-color: #130E70;
  color: #130E70;
  border-radius: 25px;
}
.btn-outline-primary:hover {
  color: #FFFFFF;
  background-color: #130E70;
  border-color: #130E70;
}

.btn-red {
  color: #FFFFFF;
  background-color: #B54229;
  border-color: #B54229;
  border-width: 2px;
  font-weight: bold;
  padding: 6px 10px;
  border-radius: 6px;
  font-size: 1.2rem;
}
.btn-red:hover {
  color: #B54229;
  background-color: #FFFFFF;
  border-color: #B54229;
}

.btn-outline-red {
  border-color: #B54229;
  color: #B54229;
  border-radius: 25px;
}
.btn-outline-red:hover {
  color: #FFFFFF;
  background-color: #B54229;
  border-color: #B54229;
}

.btn-success {
  color: #FFFFFF;
  background-color: #2fba8c;
  border-color: #2fba8c;
  border-width: 2px;
  font-weight: bold;
  padding: 6px 10px;
  border-radius: 6px;
  font-size: 1.2rem;
}
.btn-success:hover {
  color: #2fba8c;
  background-color: #FFFFFF;
  border-color: #2fba8c;
}

.btn-small-green {
  color: #FFFFFF;
  background-color: #2fba8c;
  border-color: #2fba8c;
  border-width: 2px;
  padding: 5px 10px;
  border-radius: 6px;
  font-size: 1rem;
}
.btn-small-green:hover {
  color: #2fba8c;
  background-color: #FFFFFF;
  border-color: #2fba8c;
}

.btn-secondary {
  color: #130E70;
  background-color: #FFFFFF;
  border-color: #130E70;
  border-width: 2px;
  font-weight: bold;
  padding: 6px 10px;
  border-radius: 6px;
  font-size: 1.2rem;
}
.btn-secondary:hover {
  color: #FFFFFF;
  background-color: #130E70;
  border-color: #130E70;
}

.btn:disabled {
  background: #707070;
  border-color: #999;
}

.btn-danger {
  color: #FFFFFF;
  border-width: 2px;
  font-weight: bold;
  padding: 6px 10px;
  border-radius: 6px;
  font-size: 1.2rem;
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem #FFFFFF, 0 0 0 0.25rem #258cfb;
}

.btn-sm {
  font-size: 1rem !important;
  padding: 0.375rem 0.75rem !important;
}

.btn-sm.btn-primary,
.btn-sm.btn-danger,
.btn-sm.btn-secondary,
.btn-sm.btn-success {
  font-size: 1rem !important;
  padding: 0.375rem 0.75rem !important;
}

.btn:focus,
.btn:active,
.btn:hover,
.btn:active:focus {
  outline: none !important;
  box-shadow: none !important;
}

.btn-light {
  color: #130E70;
  background-color: #E9E9E9;
  border-color: #E9E9E9;
}
.btn-light:hover {
  color: #FFFFFF;
  background-color: #130E70;
  border-color: #130E70;
}

.todo-status-circle {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 2px solid white;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
  position: relative;
}

.todo-count {
  color: white;
  font-size: 12px;
  font-weight: bold;
  line-height: 1;
}

.todo-status-circle.clickable {
  cursor: pointer;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.todo-status-circle.clickable:hover {
  transform: scale(1.1);
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
}

.todo-notification-overlay {
  position: absolute;
  top: -8px;
  right: -8px;
  display: flex;
  flex-direction: row;
  gap: 2px;
  z-index: 10;
}

.todo-notification-overlay.multiple {
  right: -24px;
}

body {
  font-size: 1.4rem;
}

.logo {
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--primary-color);
  padding-top: 1.5rem;
  padding-bottom: 1rem;
  margin-bottom: 1rem;
  text-align: left;
  margin-left: 20px;
  max-width: 300px;
}
.logo.center {
  margin-left: auto;
  margin-right: auto;
}
.logo img {
  width: 135px;
}

#main {
  padding: 0;
  background: #fff;
  min-height: 100vh;
}

/* Make space for main content */
.main-content {
  margin-left: 200px;
}

/* Dashboard exception - no secondary nav */
.dashboard .main-content {
  margin-left: 50px;
}

/* Responsive adjustments */
@media (max-width: 992px) {
  .main-content {
    margin-left: 250px;
  }
}
#pageHeader {
  padding-right: 300px;
}
#pageHeader h1 {
  font-size: 2.5rem;
  font-weight: 600;
}
#pageHeader .page-heading-info {
  font-size: 1.4rem;
  color: #fff;
  margin-top: 0.25rem;
}
#pageHeader .page-heading-info .info-item {
  margin-right: 1.5rem;
}
#pageHeader .page-heading-info .info-item:last-child {
  margin-right: 0;
}

#blazor-error-ui {
  background: lightyellow;
  bottom: 0;
  box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
  display: none;
  left: 0;
  padding: 0.6rem 1.25rem 0.7rem 1.25rem;
  position: fixed;
  width: 100%;
  z-index: 1000;
}
#blazor-error-ui .dismiss {
  cursor: pointer;
  position: absolute;
  right: 0.75rem;
  top: 0.5rem;
}

.components-reconnect-modal {
  transition: opacity 0.3s ease-in-out, visibility 0.3s ease-in-out;
}
.components-reconnect-modal.components-reconnect-hide {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.components-reconnect-show {
  animation: fadeInReconnect 0.5s ease-in;
}

@keyframes fadeInReconnect {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.icon-wrapper {
  width: 40px;
  height: 40px;
  min-width: 40px;
}

.dropdown-menu {
  min-width: 300px;
}

.dropdown-item {
  transition: all 0.2s ease-in-out;
}

.dropdown-item:hover {
  background-color: var(--bs-light);
}

main.account {
  max-width: 400px;
  margin: 0 auto;
}

main.account.wide {
  max-width: 750px;
}

/* Auth Layout Styles */
.auth-layout {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #dbfd57;
  padding: 2rem 1rem;
}

.auth-content {
  width: 100%;
  max-width: 450px;
}

.input {
  border-radius: 10px;
  font-size: 1.4rem;
}

.form-control {
  border-radius: 10px;
  font-size: 1.4rem;
}

.alert-danger {
  border-radius: 5px;
}

.rightbarform {
  border-bottom: 5px solid #130E70;
  padding-bottom: 15px;
  margin-bottom: 15px;
  background: #E9E9E9;
  padding: 2rem;
}

.form-floating > .form-control-plaintext ~ label, .form-floating > .form-control:focus ~ label, .form-floating > .form-control:not(:placeholder-shown) ~ label, .form-floating > .form-select ~ label {
  color: rgba(var(--bs-body-color-rgb), 0.65);
  transform: scale(0.85) translateY(-2rem) translateX(0.15rem);
}

.list-group-item.active {
  background-color: #130E70;
  border-color: #130E70;
}
.list-group-item.active .text-muted {
  color: #FFFFFF !important;
}
.list-group-item.active .nav-icon-wrapper {
  background-color: #FFFFFF !important;
}

.radio-group {
  border: none;
  padding: 0;
  margin: 0;
}
.radio-group legend {
  border: none;
  width: auto;
  padding: 0;
  margin-bottom: 1rem;
  font-size: 1rem;
  font-weight: 600;
  color: var(--bs-dark);
}
.radio-group .form-check {
  margin-bottom: 0.75rem;
  padding: 0.75rem 1rem;
  border: 1px solid rgba(0, 0, 0, 0.125);
  border-radius: 8px;
  transition: all 0.2s ease-in-out;
  background-color: var(--bs-light);
}
.radio-group .form-check:hover {
  border-color: #130E70;
  background-color: rgba(var(--bs-primary-rgb), 0.05);
}
.radio-group .form-check:has(.form-check-input:checked) {
  border-color: #130E70;
  background-color: rgba(var(--bs-primary-rgb), 0.1);
  box-shadow: 0 0 0 0.125rem rgba(var(--bs-primary-rgb), 0.25);
}
.radio-group .form-check:last-child {
  margin-bottom: 0;
}
.radio-group .form-check-input {
  margin-top: 0.25em;
  margin-right: 0.75rem;
}
.radio-group .form-check-input:checked {
  background-color: #130E70;
  border-color: #130E70;
}
.radio-group .form-check-input:focus {
  border-color: #130E70;
  box-shadow: 0 0 0 0.125rem rgba(var(--bs-primary-rgb), 0.25);
}
.radio-group .form-check-label {
  font-weight: 500;
  color: var(--bs-dark);
  cursor: pointer;
  margin-bottom: 0;
  line-height: 1.4;
}

.search-input {
  border-radius: 20px;
  border: 1px solid #dee2e6;
  padding-left: 35px;
  padding-right: 15px;
  background-color: #f8f9fa;
  transition: all 0.2s ease-in-out;
}
.search-input:focus {
  background-color: white;
  border-color: #80bdff;
  box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
}

.search-icon {
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  color: #6c757d;
  font-size: 14px;
  pointer-events: none;
}

.form-select {
  color: #212529;
}
.form-select option {
  color: #212529;
  background-color: #ffffff;
}

.sidebar {
  background-color: #FFFFFF;
  border-right: 1px solid #edf2f7;
  padding-top: 0;
  min-height: 100vh;
  position: fixed;
  height: 100vh;
  max-height: 700px;
  overflow-y: auto;
  width: 200px;
}
.sidebar nav.nav {
  display: flex;
  flex-direction: column;
  height: calc(100% - 100px);
}
.sidebar .nav-item:nth-last-child(2) {
  border-top: 1px solid #E0E5F2;
  padding-top: 1rem;
  margin-top: auto;
}
.sidebar .nav-link {
  color: #333333;
  padding: 1.2rem 2rem;
  font-size: 1.4rem;
  display: flex;
  align-items: center;
  margin: 0;
  transition: all 0.2s ease;
}
.sidebar .nav-link i {
  width: 2.4rem;
  font-size: 1.6rem;
  margin-right: 1rem;
}
.sidebar .nav-link:hover {
  background-color: var(--primary-light);
  color: var(--secondary-color);
}
.sidebar .nav-link.active {
  color: #130E70;
  background-color: #f8caf8;
  font-weight: 500;
}
.sidebar .nav-link.active:hover {
  background-color: #f8caf8;
  color: var(--primary-color);
}

.subnav {
  background-color: #DBFD57;
}
.subnav .nav-link {
  color: #130E70;
}
.subnav .nav-link.active {
  color: #130E70;
  border-bottom: #130E70 3px solid;
  font-weight: 700;
}

.scheduled-course-subnav {
  background-color: #3BE2E2;
  padding: 1rem 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.scheduled-course-subnav .dropdown {
  position: relative;
}
.scheduled-course-subnav .dropdown .btn-outline-light {
  color: #FFFFFF;
  border-color: rgba(255, 255, 255, 0.3);
  background-color: transparent;
}
.scheduled-course-subnav .dropdown .btn-outline-light:hover {
  background-color: rgba(255, 255, 255, 0.1);
  border-color: rgba(255, 255, 255, 0.5);
}
.scheduled-course-subnav .dropdown .btn-outline-light:focus {
  box-shadow: 0 0 0 0.2rem rgba(255, 255, 255, 0.25);
}
.scheduled-course-subnav .dropdown .dropdown-menu {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 1000;
  min-width: 300px;
  max-height: 300px;
  overflow-y: auto;
  background-color: #FFFFFF;
  border: 1px solid rgba(0, 0, 0, 0.15);
  border-radius: 0.375rem;
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.175);
  margin-top: 0.125rem;
}
.scheduled-course-subnav .dropdown .dropdown-item {
  display: block;
  width: 100%;
  padding: 0.5rem 1rem;
  clear: both;
  font-weight: 400;
  color: #333333;
  text-align: inherit;
  text-decoration: none;
  white-space: nowrap;
  background-color: transparent;
  border: 0;
  transition: all 0.2s ease;
}
.scheduled-course-subnav .dropdown .dropdown-item:hover {
  color: #130E70;
  background-color: rgba(19, 14, 112, 0.1);
}
.scheduled-course-subnav .dropdown .dropdown-item.active {
  background-color: #130E70;
  color: #FFFFFF;
}
.scheduled-course-subnav .nav .nav-link {
  color: rgba(255, 255, 255, 0.8);
  padding: 0.5rem 1rem;
  font-size: 1.4rem;
  transition: all 0.2s ease;
  border-radius: 0.375rem;
  margin-right: 0.5rem;
}
.scheduled-course-subnav .nav .nav-link:hover {
  color: #FFFFFF;
  background-color: rgba(255, 255, 255, 0.1);
}
.scheduled-course-subnav .nav .nav-link.active {
  color: #FFFFFF;
  background-color: rgba(255, 255, 255, 0.2);
  font-weight: 600;
}

.list-filter {
  height: 80px;
  background: #FFFFFF;
}
.list-filter::after {
  content: "";
  display: table;
  clear: both;
}
.list-filter ul {
  list-style-type: none;
  position: relative;
  z-index: 10;
}
.list-filter ul > li {
  position: relative;
  height: 80px;
  float: left;
  width: 200px;
}
.list-filter ul > li label {
  position: absolute;
  left: 30px;
  top: 14px;
  font-size: 1.2rem;
  color: #999;
  z-index: 2;
  z-index: 11;
  font-weight: bold;
}
.list-filter ul > li label span {
  display: block;
  padding: 5px 0;
  color: #130E70;
  max-height: 45px;
  overflow: hidden;
  position: relative;
  padding-right: 20px;
}
.list-filter ul > li label span.overflowing::after {
  content: " +";
  position: absolute;
  right: 0;
  color: #3BE2E2;
  pointer-events: none;
}
.list-filter ul > li ul {
  position: absolute;
  margin-top: 10px;
  width: 200px;
  border-radius: 25px;
  background: #F4F7FE;
  max-height: 500px;
  overflow-y: auto;
}
.list-filter ul > li ul li {
  display: none;
  width: 100%;
  height: auto;
  padding: 5px 0;
}
.list-filter ul > li ul li label {
  text-decoration: none;
  color: #130E70;
  font-size: 1.4rem;
  padding: 5px 10px 5px 10px;
  display: block;
  position: relative;
  font-weight: 400;
  left: 0;
  top: 0;
  cursor: pointer;
}
.list-filter ul > li ul li input {
  display: none;
}
.list-filter ul > li ul li input[type=checkbox]:checked + label {
  font-weight: bold;
  position: relative;
}
.list-filter ul > li ul li input[type=checkbox]:checked + label:before {
  content: "";
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background-color: #3BE2E2;
  position: absolute;
  left: -10px;
  top: 10px;
}
.list-filter ul > li:hover:not(.textinput) label {
  display: none;
}
.list-filter ul > li:hover:not(.textinput) ul li {
  display: block;
}
.list-filter ul > li:hover:not(.textinput) ul li label {
  display: block;
}
.list-filter ul > li.textinput input {
  margin-top: 35px;
  position: relative;
  left: 25px;
  width: 140px;
  font-size: 1.2rem;
  color: #130E70;
}

.list-container {
  position: relative;
  overflow: auto;
}
.list-container table {
  width: 100%;
  border-collapse: collapse;
}
.list-container table thead tr th {
  padding: 0.75rem 1rem;
  text-align: left;
  font-weight: bold;
  border-bottom: 2px solid #e9ecef;
  box-shadow: none !important;
  background: none;
}
.list-container table tbody .list-row {
  background-color: #ffffff;
  border-bottom: 1px solid #e9ecef;
  cursor: pointer;
  transition: background-color 0.2s ease;
  /* Avatar */
  /* Name and ID */
  /* Status Badge */
  /* Dot Indicators */
  /* Additional Fields */
}
.list-container table tbody .list-row:hover {
  background-color: #f8f9fa;
}
.list-container table tbody .list-row td {
  padding: 0.75rem 1rem;
  vertical-align: middle;
  border-bottom: none;
  box-shadow: none !important;
  font-size: 1.4rem;
  background: none;
}
.list-container table tbody .list-row .avatar {
  width: 48px;
  height: 48px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  background-color: #e9ecef;
}
.list-container table tbody .list-row .avatar-initials {
  width: 100%;
  height: 100%;
  font-weight: bold;
  color: #ffffff;
  font-size: 1rem;
  display: flex;
  align-items: center;
  justify-content: center;
  text-transform: uppercase;
}
.list-container table tbody .list-row .avatar-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.list-container table tbody .list-row .list-name {
  font-size: 1.4rem;
  font-weight: bold;
  margin: 0;
}
.list-container table tbody .list-row .list-id {
  font-size: 0.85rem;
  color: #6c757d;
}
.list-container table tbody .list-row .badge {
  font-size: 1.4rem;
  border-radius: 4px;
  padding: 0.5rem 0.75rem;
  display: inline-block;
  text-align: center;
}
.list-container table tbody .list-row .dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  display: inline-block;
  margin-right: 4px;
}
.list-container table tbody .list-row .additional-field {
  font-size: 0.9rem;
  color: #6c757d;
}

.toast-container {
  position: fixed;
  bottom: 20px;
  right: 20px;
  z-index: 1000;
}

.toast-message {
  padding: 1rem 1.5rem;
  margin: 0.5rem;
  border-radius: 10px;
  color: white;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  transition: all 0.3s ease-in-out;
}

.toast.show {
  transform: translateX(0);
  opacity: 1;
  background-color: #ccc;
}

.toast-success {
  background-color: #48bb78;
}

.toast-error {
  background-color: #f56565;
}

.toast-info {
  background-color: #4299e1;
}

@keyframes slideIn {
  from {
    transform: translateX(100%);
    opacity: 0;
  }
  to {
    transform: translateX(0);
    opacity: 1;
  }
}
.blade {
  background: #F5F5F5;
  position: relative;
  padding-left: 60px;
  padding-top: 60px;
}
.blade .nav {
  background: #E9E9E9;
  position: absolute;
  left: 0;
  top: 55px;
  height: 100%;
  width: 60px;
  display: block;
  padding: 0px;
}
.blade .nav li {
  width: 60px;
  background: none;
  border: none;
  border-bottom: 1px solid #707070;
}
.blade .nav li button {
  font-size: 2rem;
  padding: 15px;
  color: #130E70;
  display: block;
  text-align: center;
  width: 100%;
}
.blade .nav li button.active {
  background: #130E70;
  color: #FFFFFF;
}
.blade .nav li button:hover {
  background: #3BE2E2;
  color: #FFFFFF;
}
.blade .blade-title {
  line-height: 50px;
  background: #130E70;
  color: #FFFFFF;
  position: absolute;
  top: 0;
  left: 0px;
  padding-left: 80px;
  width: 100%;
}

.editable-field {
  border-bottom: 1px solid #efefef;
  margin-bottom: 10px;
}
.editable-field label {
  color: #707070;
  font-size: 1.4rem;
}
.editable-field:last-child {
  border-bottom: none;
}
.editable-field:last-of-type {
  border-bottom: none;
}

#pageHeader {
  background: #130E70;
}
#pageHeader h1 {
  color: #FFFFFF;
}

.header-section {
  padding: 20px;
}

.header-section .inner {
  padding: 1.2rem 1.5rem;
  width: 100%;
  border-radius: 20px;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

#pagebreadcrumb {
  background: #130E70;
}

.breadcrumb {
  margin: 0;
}

.breadcrumb-item a {
  color: #FFFFFF;
  font-size: 1.3rem;
  text-decoration: none;
}

.breadcrumb-item.active span {
  font-weight: 700;
  color: #FFFFFF;
  font-size: 1.3rem;
}

.breadcrumb-item + .breadcrumb-item::before {
  color: #FFFFFF;
}

.search-box {
  position: relative;
  margin-right: 1.5rem;
}

.search-box input {
  background-color: #FFFFFF;
  border: 1px solid #E0E5F2;
  border-radius: 3rem;
  padding: 1rem 1rem 1rem 4rem;
  font-size: 1.4rem;
  width: 30rem;
}

.search-box input:focus {
  border-color: var(--secondary-color);
  box-shadow: 0 0 0 2px var(--secondary-light);
}

.search-box i {
  position: absolute;
  left: 1.5rem;
  top: 50%;
  transform: translateY(-50%);
  color: #A3AED0;
  font-size: 1.6rem;
}

.profile-image {
  width: 4.8rem;
  height: 4.8rem;
  border-radius: 1rem;
}

.modal-backdrop {
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 1040;
}

.modal {
  z-index: 1050;
}

.modal-dialog {
  z-index: 1055;
}

.person-name-edit-section {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease-out, opacity 0.3s ease-out, padding 0.3s ease-out;
  opacity: 0;
  padding: 0;
  margin: 0;
}
.person-name-edit-section.show {
  max-height: 500px;
  opacity: 1;
  padding-top: 0.5rem;
}

.sms-preview-container {
  background-color: #f5f5f5;
  border-radius: 12px;
  padding: 20px;
  min-height: 300px;
}

.sms-preview-header {
  padding-bottom: 12px;
  border-bottom: 1px solid #e0e0e0;
}

.sms-avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background-color: #007bff;
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
  font-size: 24px;
}

.sms-message-bubble {
  margin-top: 16px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  max-width: 75%;
}

.sms-message-content {
  background-color: #007bff;
  color: white;
  padding: 12px 16px;
  border-radius: 18px 18px 18px 4px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
  word-wrap: break-word;
  white-space: pre-wrap;
  line-height: 1.4;
}

.sms-text {
  margin: 0;
  font-size: 15px;
}

.sms-timestamp {
  margin-top: 4px;
  padding-left: 4px;
  font-size: 12px;
}

.email-preview-modal .modal-dialog {
  max-width: 650px;
}

.modal-dialog.email-preview-dialog {
  max-width: 700px;
}

.collapsible-card .badge.bg-primary {
  background-color: #130E70 !important;
  color: white !important;
}
.collapsible-card .badge.bg-primary i {
  color: #DBFD57 !important;
}
.collapsible-card .badge.bg-primary:hover {
  opacity: 0.9;
}

.collapsible-card .badge.bg-info {
  background-color: #130E70 !important;
  color: white !important;
}
.collapsible-card .badge.bg-info i {
  color: #DBFD57 !important;
}
.collapsible-card .badge.bg-info:hover {
  opacity: 0.9;
}

.settings-nav .list-group-item {
  transition: all 0.2s ease-in-out;
  background-color: var(--bs-light);
}

.settings-nav .list-group-item:hover {
  background-color: var(--bs-light);
}

.settings-nav .list-group-item.active {
  background-color: #130E70;
  border-color: #130E70;
  color: white;
}

.settings-nav .list-group-item.active .nav-icon-wrapper {
  background-color: rgba(255, 255, 255, 0.2) !important;
}

.settings-nav .list-group-item.active .nav-icon-wrapper i {
  color: white;
}

.settings-nav .list-group-item.active .text-muted {
  color: rgba(255, 255, 255, 0.8) !important;
}

.settings-nav .nav-icon-wrapper {
  width: 40px;
  height: 40px;
  min-width: 40px;
  border-radius: 50%;
  background-color: rgba(var(--purple-rgb), 0.1);
}

.settings-nav .nav-icon-wrapper i {
  color: #130E70;
}

.date-card {
  display: flex;
  align-items: center;
  border-radius: 8px;
  padding: 1rem;
  width: 100%;
  background-color: #F4F7FE;
  margin-bottom: 1.5rem;
  position: relative;
}
.date-card .event-date {
  display: flex;
  flex-direction: column;
  align-items: center;
  background: #FFFFFF;
  color: #130E70;
  border-radius: 0.4rem;
  padding: 1rem 1.5rem;
  margin-right: 1.5rem;
}
.date-card .event-date .event-day {
  font-size: 1.2rem;
  font-weight: bold;
}
.date-card .event-date .event-number {
  font-size: 3rem;
  font-weight: bold;
  line-height: 1.2;
}
.date-card .event-initials {
  display: flex;
  flex-direction: column;
  align-items: center;
  background: #FFFFFF;
  color: #130E70;
  border-top-left-radius: 0.4rem;
  border-bottom-right-radius: 0.4rem;
  padding: 1rem 1.5rem;
  font-size: 1.4rem;
  font-weight: bold;
  position: absolute;
  bottom: 0;
  right: 0;
}
.date-card .event-details {
  display: flex;
  flex-direction: column;
}
.date-card .event-details .event-title {
  font-size: 1.4rem;
  color: #130E70;
  margin-bottom: 0.5rem;
  font-weight: bold;
}
.date-card .event-details .event-title i {
  margin-left: 0.5rem;
  margin-right: 0.5rem;
  font-size: 1.2rem;
  color: #130E70;
}
.date-card .event-details .event-time,
.date-card .event-details .event-location {
  display: flex;
  align-items: center;
  font-size: 1.2rem;
  color: #8694B3;
  margin-bottom: 0.25rem;
}
.date-card .event-details .event-time i,
.date-card .event-details .event-location i {
  margin-right: 0.5rem;
  font-size: 1.2rem;
  color: #130E70;
}
.date-card.self {
  background-color: #130E70;
}
.date-card.self .event-details .event-title {
  color: #FFFFFF;
}
.date-card.self .event-details .event-title i {
  color: #FFFFFF;
}
.date-card.self .event-details .event-time,
.date-card.self .event-details .event-location {
  color: #FFFFFF;
}
.date-card.self .event-details .event-time i,
.date-card.self .event-details .event-location i {
  color: #FFFFFF;
}
.date-card.someone-elses-task .event-date, .date-card.someone-elses-task .event-title, .date-card.someone-elses-task .event-description, .date-card.someone-elses-task .event-time {
  opacity: 0.5;
}
.date-card.overdue {
  background-color: rgb(239.4864864865, 195.972972973, 186.5135135135);
}
.date-card.overdue .event-date {
  color: #B54229;
}

.info-card {
  display: flex;
  align-items: center;
  border-radius: 8px;
  padding: 1rem;
  width: 100%;
  background-color: #F4F7FE;
  margin-bottom: 1.5rem;
}
.info-card .info-card-avatar {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 50px;
  height: 50px;
  border-radius: 5px;
  background-color: #E9E9E9;
  color: #FFFFFF;
  font-size: 1.4rem;
  font-weight: bold;
  text-transform: uppercase;
  margin-right: 1rem;
}
.info-card .info-card-avatar .initials-avatar {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  border-radius: 5px;
  font-size: 1.6rem;
}
.info-card .info-card-avatar .profile-avatar {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 5px;
}
.info-card .info-card-details {
  flex: 1;
}
.info-card .info-card-details .info-card-title {
  font-size: 1.4rem;
  font-weight: bold;
  color: #130E70;
}
.info-card .info-card-details .info-card-title .info-card-subtitle {
  font-size: 1.2rem;
  color: #8694B3;
  margin-left: 0.5rem;
}
.info-card .info-card-details .info-card-content {
  font-size: 1.2rem;
  color: #333333;
}
.info-card .info-card-details .info-card-content i {
  margin-right: 0.5rem;
  font-size: 1.2rem;
  color: #130E70;
}
.info-card .info-card-details .info-card-content .label {
  font-weight: bold;
  color: #999;
  margin-right: 0.3rem;
}

.info-card-link {
  text-decoration: none;
  color: inherit;
  display: block;
  border-radius: 8px;
}
.info-card-link:hover {
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
  text-decoration: none;
}

.note-list {
  list-style-type: none;
  padding: 0;
}
.note-list li {
  margin: 1rem 0;
  background: #ffffff;
  border-radius: 1rem;
  padding: 1.5rem;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}
.note-list li .d-flex {
  align-items: center;
  justify-content: space-between;
  margin-bottom: 1rem;
}
.note-list li p {
  white-space: pre-line;
  margin: 0 0 1rem 0;
}
.note-list li .btn {
  margin-top: 1rem;
}
.note-list li .controls {
  display: none;
}
.note-list li:hover .controls {
  display: block;
}

.accordion-item {
  border: none;
  margin-bottom: 1rem;
}
.accordion-item .accordion-header .accordion-button {
  border-radius: 1rem;
  background-color: #f8f9fa;
  border: none;
}
.accordion-item .accordion-header .accordion-button:focus {
  box-shadow: none;
}
.accordion-item .accordion-body {
  border-radius: 1rem;
  background: #ffffff;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  padding: 1.5rem;
}
.accordion-item .accordion-body p {
  margin: 0 0 1rem 0;
}
.accordion-item .accordion-body .btn {
  margin-top: 1rem;
}

.editable-field {
  padding-bottom: 13px;
}
.editable-field label {
  color: #999;
  font-weight: bold;
}

.user-select.editable-field .editable-field {
  margin-bottom: 1rem;
}
.user-select.editable-field .editable-display {
  cursor: pointer;
  padding: 0.375rem 0;
  min-height: 1.5rem;
  border-radius: 0.25rem;
  transition: background-color 0.15s ease-in-out;
}
.user-select.editable-field .editable-display:hover:not(.disabled) {
  background-color: rgba(0, 0, 0, 0.05);
}
.user-select.editable-field .editable-display.disabled {
  cursor: not-allowed;
  opacity: 0.65;
}

.multi-relations.editable-field .dropdown-item {
  max-width: 90%;
}
.multi-relations.editable-field .editable-display {
  cursor: pointer;
  padding: 0.375rem 0;
  min-height: 1.5rem;
  border-radius: 0.25rem;
  transition: background-color 0.15s ease-in-out;
}
.multi-relations.editable-field .editable-display:hover:not(.disabled) {
  background-color: rgba(0, 0, 0, 0.05);
}
.multi-relations.editable-field .editable-display.disabled {
  cursor: not-allowed;
  opacity: 0.65;
}
.multi-relations.editable-field .multiselect-label {
  padding: 5px;
}
.multi-relations.editable-field .multiselect-check {
  margin: 5px;
}
.multi-relations.editable-field .dropdown-menu {
  padding: 0;
}
.multi-relations.editable-field .dropdown-item:hover {
  background-color: rgba(0, 0, 0, 0.05);
}
.multi-relations.editable-field .dropdown-item label {
  color: #333;
}
.multi-relations.editable-field .dropdown-menu-content {
  padding: 0.5rem 0;
}
.multi-relations.editable-field .selected-text {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 90%;
}
.multi-relations.editable-field .dropdown-menu.show {
  display: block;
  width: 100%;
  position: absolute;
  inset: 0px auto auto 0px;
  margin: 0px;
  transform: translate(0px, 40px);
}
.multi-relations.editable-field .dropdown-toggle {
  white-space: normal;
  min-height: 38px;
}

.multi-select.editable-field {
  cursor: pointer;
  min-height: 1.5rem;
  border-radius: 0.25rem;
  transition: background-color 0.15s ease-in-out;
}
.multi-select.editable-field .dropdown-item {
  max-width: 90%;
}
.multi-select.editable-field .editable-display:hover:not(.disabled) {
  background-color: rgba(0, 0, 0, 0.05);
}
.multi-select.editable-field .editable-display.disabled {
  cursor: not-allowed;
  opacity: 0.65;
}
.multi-select.editable-field .multiselect-label {
  padding: 5px;
}
.multi-select.editable-field .multiselect-check {
  margin: 5px;
}
.multi-select.editable-field .dropdown-menu {
  padding: 0;
}
.multi-select.editable-field .dropdown-item:hover {
  background-color: rgba(0, 0, 0, 0.05);
}
.multi-select.editable-field .dropdown-item label {
  color: #333;
}
.multi-select.editable-field .dropdown-menu-content {
  padding: 0.5rem 0;
}
.multi-select.editable-field .selected-text {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 90%;
}
.multi-select.editable-field .dropdown-menu.show {
  display: block;
  width: 100%;
  position: absolute;
  inset: 0px auto auto 0px;
  margin: 0px;
  transform: translate(0px, 40px);
}
.multi-select.editable-field .dropdown-toggle {
  white-space: normal;
  min-height: 38px;
}

.option-select.editable-field .editable-display {
  cursor: pointer;
  padding: 0.375rem 0;
  min-height: 1.5rem;
  border-radius: 0.25rem;
  transition: background-color 0.15s ease-in-out;
}
.option-select.editable-field .editable-display:hover:not(.disabled) {
  background-color: rgba(0, 0, 0, 0.05);
}
.option-select.editable-field .editable-display.disabled {
  cursor: not-allowed;
  opacity: 0.65;
}

.text-area.editable-field .editable-display pre {
  white-space: pre-wrap;
  word-wrap: break-word;
}
.text-area.editable-field .editable-display p {
  white-space: pre-line;
  word-wrap: break-word;
}
.text-area.editable-field .input-group textarea {
  min-height: 100px;
  resize: vertical;
}

.editable-display {
  cursor: pointer;
}

.editable-display .text-muted {
  color: #130E70 !important;
  opacity: 0.2;
}

.dynamic-select-save {
  border-radius: 0;
  text-align: center;
  font-weight: bold;
  margin: 0;
  color: #fff;
  height: 31px;
  background: #2fba8c;
}
.dynamic-select-save.list {
  border-radius: 3px;
}
.dynamic-select-save:hover {
  background: rgb(36.7124463519, 145.2875536481, 109.356223176);
  color: #fff;
}
.dynamic-select-cancel {
  border-radius: 0 10px 10px 0;
  text-align: center;
  margin: 0;
  font-weight: bold;
  color: #fff;
  height: 31px;
  background: #dc3545;
}
.dynamic-select-cancel:hover {
  background: rgb(189.2151898734, 32.7848101266, 47.7721518987);
  color: #fff;
}
.dynamic-select-cancel.list {
  margin-right: 20px;
  border-radius: 3px;
}

.floating-save {
  position: absolute;
  bottom: 10px;
  right: 10px;
}
.floating-save .dynamic-select-save {
  border-radius: 10px 0 0 10px;
}

.form-check-input {
  width: 20px;
  height: 20px;
  margin-right: 10px;
  z-index: 10;
}
.form-check-input:checked {
  background-color: #2fba8c;
  border: 0;
}

.tutor-select.editable-field {
  cursor: pointer;
  min-height: 1.5rem;
  border-radius: 0.25rem;
  transition: background-color 0.15s ease-in-out;
}
.tutor-select.editable-field .dropdown-item {
  max-width: 90%;
}
.tutor-select.editable-field .editable-display:hover:not(.disabled) {
  background-color: rgba(0, 0, 0, 0.05);
}
.tutor-select.editable-field .editable-display.disabled {
  cursor: not-allowed;
  opacity: 0.65;
}
.tutor-select.editable-field .multiselect-label {
  padding: 5px;
}
.tutor-select.editable-field .multiselect-check {
  margin: 5px;
}
.tutor-select.editable-field .dropdown-menu {
  padding: 0;
}
.tutor-select.editable-field .dropdown-item:hover {
  background-color: rgba(0, 0, 0, 0.05);
}
.tutor-select.editable-field .dropdown-item label {
  color: #333;
}
.tutor-select.editable-field .dropdown-menu-content {
  padding: 0.5rem 0;
}
.tutor-select.editable-field .selected-text {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 90%;
}
.tutor-select.editable-field .dropdown-menu.show {
  display: block;
  width: 100%;
  position: absolute;
  inset: 0px auto auto 0px;
  margin: 0px;
  transform: translate(0px, 40px);
}
.tutor-select.editable-field .dropdown-toggle {
  white-space: normal;
  min-height: 38px;
}

.int-slider.editable-field .badge {
  font-size: 1rem;
  font-weight: 600;
  padding: 0.5rem 0.75rem;
}

.editable-field .rte {
  cursor: pointer;
  padding: 0.375rem 0;
  min-height: 1.5rem;
  border-radius: 0.25rem;
  transition: background-color 0.15s ease-in-out;
}
.editable-field .rte:hover:not(.disabled) {
  background-color: rgba(0, 0, 0, 0.05);
}
.editable-field .rte.disabled {
  cursor: not-allowed;
  opacity: 0.65;
}
.editable-field .rte .ql-indent-2 {
  padding-left: 6em;
}
.editable-field .rte .ql-indent-3 {
  padding-left: 9em;
}
.editable-field .rte .ql-indent-4 {
  padding-left: 12em;
}
.editable-field .rte .ql-indent-5 {
  padding-left: 15em;
}
.editable-field .quill-editor-container {
  background-color: #fefefe !important;
  min-height: 200px !important;
}
.editable-field .quill-editor-container .ql-editor {
  background-color: #fefefe !important;
  min-height: 200px !important;
}

.attachmentsAccordion .accordion-button {
  font-size: 1.4rem;
  font-weight: bold;
  color: #000000;
}
.attachmentsAccordion .list-group-item {
  border: none;
  border-bottom: 2px solid #E9E9E9;
  padding: 1rem 0;
  border-radius: 0;
}
.attachmentsAccordion .list-group-item button {
  text-align: left;
  color: #333333;
  text-decoration: none;
  padding: 0;
}

.calendar {
  width: 100%;
  border: 1px solid #e9ecef;
  border-radius: 8px;
  overflow: hidden;
  background: #ffffff;
}

.calendar-header {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  background-color: #f8f9fa;
  border-bottom: 1px solid #e9ecef;
}

.calendar-day-header {
  padding: 0.75rem 0.5rem;
  text-align: center;
  font-weight: bold;
  font-size: 0.875rem;
  color: #6c757d;
  border-right: 1px solid #e9ecef;
}
.calendar-day-header:last-child {
  border-right: none;
}

.calendar-body {
  display: flex;
  flex-direction: column;
}

.calendar-week {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  border-bottom: 1px solid #e9ecef;
}
.calendar-week:last-child {
  border-bottom: none;
}

.calendar-day {
  min-height: 80px;
  padding: 0.5rem;
  border-right: 1px solid #e9ecef;
  position: relative;
  background-color: #ffffff;
}
.calendar-day:last-child {
  border-right: none;
}
.calendar-day.other-month {
  background-color: #f8f9fa;
  color: #adb5bd;
}
.calendar-day.today {
  background-color: #e3f2fd;
  font-weight: bold;
}
.calendar-day:hover {
  background-color: #f8f9fa;
}

.calendar-date {
  font-size: 0.875rem;
  font-weight: 500;
  margin-bottom: 0.25rem;
}

.calendar-events {
  display: flex;
  flex-direction: column;
  gap: 0.125rem;
}

.calendar-event {
  padding: 0.125rem 0.25rem;
  border-radius: 3px;
  font-size: 0.75rem;
  color: #ffffff;
  cursor: pointer;
  position: relative;
}
.calendar-event.event-confirmed {
  background-color: #28a745;
}
.calendar-event.event-pending {
  background-color: #ffc107;
  color: #212529;
}
.calendar-event.event-other {
  background-color: #6c757d;
}
.calendar-event:hover {
  opacity: 0.8;
}
.calendar-event .badge {
  font-size: 0.925rem;
  padding: 0.125rem 0.25rem;
  display: inline-block;
  margin-bottom: 0.125rem;
  font-weight: 600;
  top: 0;
  right: 0;
  position: absolute;
}

.calendar-event-more {
  padding: 0.125rem 0.25rem;
  border-radius: 3px;
  font-size: 0.75rem;
  color: #6c757d;
  background-color: #f8f9fa;
  text-align: center;
  font-style: italic;
}

.calendar-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  align-items: center;
  margin-top: 1rem;
}
.calendar-legend .legend-item {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.calendar-legend .legend-item .badge {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  padding: 0;
  display: inline-block;
}
.calendar-legend .legend-item .legend-label {
  font-size: 0.875rem;
  color: #6c757d;
}

@media (max-width: 768px) {
  .calendar-day {
    min-height: 60px;
    padding: 0.25rem;
  }
  .calendar-date {
    font-size: 0.75rem;
  }
  .calendar-event {
    font-size: 0.625rem;
    padding: 0.0625rem 0.125rem;
  }
  .calendar-day-header {
    font-size: 0.75rem;
    padding: 0.5rem 0.25rem;
  }
  .calendar-legend {
    gap: 0.75rem;
  }
  .calendar-legend .legend-item {
    gap: 0.375rem;
  }
  .calendar-legend .legend-item .badge {
    width: 10px;
    height: 10px;
  }
  .calendar-legend .legend-item .legend-label {
    font-size: 0.75rem;
  }
}
.finance-status-indicator {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  transition: all 0.3s ease;
}
.finance-status-indicator.completed {
  background-color: #28a745;
  color: white;
  box-shadow: 0 2px 4px rgba(40, 167, 69, 0.3);
}
.finance-status-indicator.pending {
  background-color: #6c757d;
  color: white;
  opacity: 0.6;
}
.finance-status-indicator:hover {
  transform: scale(1.1);
}

.finance-indicator {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  display: inline-block;
  transition: all 0.3s ease;
}
.finance-indicator:hover {
  transform: scale(1.2);
}

.email-preview-body {
  background-color: #ffffff;
  padding: 20px;
  border-radius: 8px;
  border: 1px solid #dee2e6;
  font-size: 14px;
  line-height: 1.5;
  max-width: 100%;
  overflow-x: auto;
}
.email-preview-body table {
  max-width: 100%;
  border-collapse: collapse;
}
.email-preview-body img {
  max-width: 100%;
  height: auto;
}
.email-preview-body h1, .email-preview-body h2, .email-preview-body h3 {
  margin-top: 0;
  margin-bottom: 16px;
}
.email-preview-body p {
  margin-bottom: 16px;
}

.modal-dialog.modal-lg {
  max-width: 800px;
}

.form-control:focus {
  border-color: #007bff;
  box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
}

.btn-payment-link {
  background-color: #10137E;
  border-color: #10137E;
  color: #ffffff;
}
.btn-payment-link:hover {
  background-color: #0d0f65;
  border-color: #0d0f65;
  color: #ffffff;
}
.btn-payment-link:focus {
  background-color: #10137E;
  border-color: #10137E;
  color: #ffffff;
  box-shadow: 0 0 0 0.2rem rgba(16, 19, 126, 0.25);
}

.email-display {
  word-break: break-all;
  word-wrap: break-word;
  overflow-wrap: break-word;
  hyphens: auto;
  max-width: 100%;
  display: inline-block;
}

.email-recipient-label {
  word-break: break-all;
  word-wrap: break-word;
  overflow-wrap: break-word;
  hyphens: auto;
  max-width: 100%;
  line-height: 1.4;
}
.email-recipient-label .email-address {
  color: #6c757d;
  font-size: 0.9em;
  display: inline-block;
  max-width: 100%;
}
.email-recipient-label .email-address.email-truncated {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 200px;
}

.form-check-label {
  word-break: break-all;
  word-wrap: break-word;
  overflow-wrap: break-word;
  max-width: 100%;
  line-height: 1.4;
}

.form-select option {
  word-break: break-all;
  word-wrap: break-word;
  overflow-wrap: break-word;
  white-space: normal;
  padding: 8px 12px;
}

.invoice-recipients-container {
  max-width: 100%;
  overflow-x: hidden;
}
.invoice-recipients-container .form-check {
  max-width: 100%;
  overflow: hidden;
  margin-bottom: 0.75rem;
}
.invoice-recipients-container .form-check .form-check-input {
  flex-shrink: 0;
  margin-top: 0.25rem;
}
.invoice-recipients-container .form-check .form-check-label {
  flex: 1;
  min-width: 0;
}
.invoice-recipients-container .card-body, .invoice-recipients-container .p-4 {
  overflow-x: hidden;
}
@media (max-width: 768px) {
  .invoice-recipients-container .email-recipient-label .email-address.email-truncated {
    max-width: 150px;
  }
  .invoice-recipients-container .form-check .form-check-input {
    margin-top: 0.125rem;
  }
}
@media (max-width: 576px) {
  .invoice-recipients-container .email-recipient-label .email-address.email-truncated {
    max-width: 120px;
  }
}

.invoice-line-item-clickable {
  transition: background-color 0.2s ease;
}
.invoice-line-item-clickable:hover {
  background-color: var(--bs-gray-50);
}
.invoice-line-item-clickable:active {
  background-color: var(--bs-gray-100);
}

.invoice-access-modal .employee-avatar .rounded-circle {
  font-weight: 600;
  font-size: 14px;
  transition: all 0.2s ease;
}
.invoice-access-modal .employee-avatar .rounded-circle:hover {
  transform: scale(1.05);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}
.invoice-access-modal .table {
  margin-bottom: 0;
}
.invoice-access-modal .table th {
  border-top: none;
  font-weight: 600;
  font-size: 0.875rem;
  color: var(--bs-gray-700);
  padding: 1rem 0.75rem;
}
.invoice-access-modal .table td {
  padding: 1rem 0.75rem;
  vertical-align: middle;
  border-color: var(--bs-gray-200);
}
.invoice-access-modal .table tbody tr {
  transition: background-color 0.15s ease;
}
.invoice-access-modal .table tbody tr:hover {
  background-color: var(--bs-gray-50);
}
.invoice-access-modal .table tbody tr.text-muted {
  opacity: 0.7;
}
.invoice-access-modal .table tbody tr.text-muted:hover {
  background-color: var(--bs-gray-100);
}
.invoice-access-modal .form-check-input {
  cursor: pointer;
  transition: all 0.15s ease;
}
.invoice-access-modal .form-check-input:hover:not(:disabled) {
  transform: scale(1.1);
}
.invoice-access-modal .form-check-input:focus {
  box-shadow: 0 0 0 0.2rem rgba(var(--bs-primary-rgb), 0.25);
}
.invoice-access-modal .form-check-input:disabled {
  cursor: not-allowed;
  opacity: 0.5;
}
.invoice-access-modal .employee-info .fw-medium {
  font-size: 0.95rem;
}
.invoice-access-modal .employee-info .badge {
  font-size: 0.7rem;
  padding: 0.25rem 0.5rem;
}

.form-switch .form-check-input {
  width: 2.5rem;
  height: 1.25rem;
}
.form-switch .form-check-input:checked {
  background-color: var(--bs-success);
  border-color: var(--bs-success);
}
.form-switch .form-check-input:focus:checked {
  box-shadow: 0 0 0 0.2rem rgba(var(--bs-success-rgb), 0.25);
}

.invoice-access-modal .spinner-border {
  width: 2rem;
  height: 2rem;
  color: var(--bs-primary);
}
.invoice-access-modal .loading-text {
  color: var(--bs-gray-600);
  margin-top: 1rem;
}

.invoice-access-modal .empty-state {
  padding: 3rem 1rem;
}
.invoice-access-modal .empty-state i {
  color: var(--bs-gray-400);
  margin-bottom: 1rem;
}
.invoice-access-modal .empty-state p {
  color: var(--bs-gray-600);
  margin-bottom: 0;
}

.invoice-access-modal .info-text {
  color: var(--bs-gray-600);
  font-size: 0.9rem;
}
.invoice-access-modal .info-text i {
  color: var(--bs-info);
}

@media (max-width: 768px) {
  .invoice-access-modal .table-responsive {
    font-size: 0.875rem;
  }
  .invoice-access-modal .employee-avatar .rounded-circle {
    width: 32px !important;
    height: 32px !important;
    font-size: 12px;
  }
  .invoice-access-modal th, .invoice-access-modal td {
    padding: 0.75rem 0.5rem !important;
  }
  .invoice-access-modal .form-switch .form-check-input {
    width: 2rem;
    height: 1rem;
  }
}
.financial-summary-card .border-end {
  border-right: 1px solid #dee2e6;
}
.financial-summary-card h4 {
  font-size: 2rem;
  font-weight: 600;
  margin-bottom: 0.5rem;
}
.financial-summary-card small {
  font-size: 0.875rem;
  opacity: 0.7;
}

.chart-container {
  position: relative;
  height: 300px;
  margin-top: 1rem;
}
.chart-container canvas {
  max-height: 100%;
}

.financial-table .table th {
  background-color: #f8f9fa;
  border-bottom: 2px solid #dee2e6;
  font-weight: 600;
  color: #495057;
}
.financial-table .table td {
  vertical-align: middle;
}
.financial-table .table .badge {
  font-size: 0.75rem;
  padding: 0.375rem 0.75rem;
}

.profit-positive {
  color: #28a745;
  font-weight: 600;
}

.profit-negative {
  color: #dc3545;
  font-weight: 600;
}

.year-header {
  background-color: #f8f9fa;
  font-weight: 600;
  color: #495057;
}

@media (max-width: 768px) {
  .financial-summary-card .row > div {
    margin-bottom: 1rem;
  }
  .financial-summary-card .row > div:last-child {
    margin-bottom: 0;
  }
  .financial-summary-card .border-end {
    border-right: none;
    border-bottom: 1px solid #dee2e6;
    padding-bottom: 1rem;
  }
  .chart-container {
    height: 250px;
    margin-top: 2rem;
  }
}
.financial-loading .spinner-border {
  width: 3rem;
  height: 3rem;
}

.table-striped > tbody > tr:nth-of-type(odd) > td {
  background-color: rgba(0, 0, 0, 0.02);
}

.table-hover > tbody > tr:hover > td {
  background-color: rgba(0, 0, 0, 0.05);
}

.venue-map-selector {
  margin-bottom: 1rem;
}
.venue-map-selector .editable-display {
  cursor: pointer;
  padding: 0.5rem;
  border: 1px solid #dee2e6;
  border-radius: 0.375rem;
  background-color: #fff;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
.venue-map-selector .editable-display:hover {
  border-color: #86b7fe;
  box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
}
.venue-map-selector .form-control-sm {
  font-size: 0.875rem;
  padding: 0.25rem 0.5rem;
}
.venue-map-selector .btn-sm {
  font-size: 0.875rem;
  padding: 0.25rem 0.5rem;
}
.venue-map-selector .gap-2 {
  gap: 0.5rem !important;
}

.map-container {
  border: 1px solid #dee2e6;
  border-radius: 0.375rem;
  padding: 1rem;
  background-color: #fff;
}

.google-map {
  border: 1px solid #dee2e6;
  border-radius: 0.375rem;
  overflow: hidden;
}

.gm-style .gm-style-iw-c {
  padding: 0 !important;
  border-radius: 8px !important;
}

.gm-style .gm-style-iw-d {
  overflow: hidden !important;
}

.gm-style .gm-style-iw-t::after {
  background: linear-gradient(45deg, rgb(255, 255, 255) 50%, rgba(255, 255, 255, 0) 51%, rgba(255, 255, 255, 0) 100%) !important;
}

.venue-map-picker .form-label.small {
  font-size: 0.875rem;
  font-weight: 500;
  color: #6c757d;
  margin-bottom: 0.25rem;
}
.venue-map-picker .btn-group-sm .btn {
  font-size: 0.75rem;
  padding: 0.25rem 0.5rem;
}
.venue-map-picker .form-text {
  font-size: 0.75rem;
  color: #6c757d;
  margin-top: 0.5rem;
}
.venue-map-picker .editable-field label {
  display: none;
}
.venue-map-picker .editable-field .form-control {
  font-size: 0.875rem;
  padding: 0.375rem 0.75rem;
}

.venue-booking-row {
  cursor: pointer;
  transition: background-color 0.2s ease;
}
.venue-booking-row:hover {
  background-color: rgba(var(--bs-primary-rgb), 0.05);
}
.venue-booking-row td {
  vertical-align: middle;
}

.table-hover tbody tr {
  cursor: pointer;
  transition: all 0.2s ease;
}
.table-hover tbody tr:hover {
  background-color: rgba(var(--bs-primary-rgb), 0.08);
  transform: translateY(-1px);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}
.table-hover tbody tr:active {
  transform: translateY(0);
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);
}

.table-hover tbody tr a {
  position: relative;
  z-index: 2;
}

.venue-subnav .subnav {
  background-color: var(--bs-primary);
}
.venue-subnav .subnav .nav-link {
  color: rgba(255, 255, 255, 0.8);
  padding: 0.75rem 1rem;
  font-size: 1.4rem;
  transition: all 0.2s ease;
  border-radius: 0.375rem;
  margin-right: 0.5rem;
}
.venue-subnav .subnav .nav-link:hover {
  color: white;
  background-color: rgba(255, 255, 255, 0.1);
}
.venue-subnav .subnav .nav-link.active {
  color: white;
  background-color: rgba(255, 255, 255, 0.2);
  font-weight: 600;
}

.venue-booking-status .badge {
  font-size: 0.75rem;
  padding: 0.375rem 0.75rem;
  border-radius: 0.375rem;
}

.venue-bookings-table .table th {
  font-weight: 600;
  color: var(--bs-gray-700);
  border-bottom: 2px solid var(--bs-gray-300);
}
.venue-bookings-table .table td {
  border-bottom: 1px solid var(--bs-gray-200);
}

.wizard-steps {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 2rem;
}
.wizard-steps .step {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex: 1;
  position: relative;
}
.wizard-steps .step .step-number {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background-color: #e9ecef;
  color: #6c757d;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  margin-bottom: 0.5rem;
  transition: all 0.3s ease;
}
.wizard-steps .step .step-label {
  font-size: 0.875rem;
  color: #6c757d;
  text-align: center;
  transition: all 0.3s ease;
}
.wizard-steps .step.active .step-number {
  background-color: #0d6efd;
  color: white;
}
.wizard-steps .step.active .step-label {
  color: #0d6efd;
  font-weight: 600;
}
.wizard-steps .step.completed .step-number {
  background-color: #198754;
  color: white;
}
.wizard-steps .step.completed .step-label {
  color: #198754;
}
.wizard-steps .step:not(:last-child)::after {
  content: "";
  position: absolute;
  top: 20px;
  left: 50%;
  width: 100%;
  height: 2px;
  background-color: #e9ecef;
  z-index: -1;
}
.wizard-steps .step.completed:not(:last-child)::after {
  background-color: #198754;
}

.resource-allocations-table .table-info {
  background-color: #d1ecf1 !important;
  border-color: #bee5eb !important;
}
.resource-allocations-table .table-info:hover {
  background-color: #c1e7e9 !important;
}
.resource-allocations-table .badge.bg-info {
  background-color: #17a2b8 !important;
}
.resource-allocations-table .alert-info {
  background-color: #d1ecf1;
  border-color: #bee5eb;
  color: #0c5460;
}
.resource-allocations-table .course-link {
  color: #0d6efd;
  text-decoration: none;
  font-weight: 600;
}
.resource-allocations-table .course-link:hover {
  color: #0a58ca;
  text-decoration: underline;
}
.resource-allocations-table .session-link {
  color: #6c757d;
  text-decoration: none;
}
.resource-allocations-table .session-link:hover {
  color: #495057;
  text-decoration: underline;
}
.resource-allocations-table .overlap-info .course-link {
  font-size: 0.875rem;
  font-weight: 600;
}
.resource-allocations-table .overlap-info .session-link {
  font-size: 0.75rem;
}
.resource-allocations-table .equal-height-cards .col-md-4 {
  display: flex;
}
.resource-allocations-table .equal-height-cards .col-md-4 .card-shadow {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.stats-list .stat-item {
  display: flex;
  align-items: center;
  padding: 12px 0;
  border-bottom: 1px solid #efefef;
}
.stats-list .stat-item:last-child {
  border-bottom: none;
}
.stats-list .stat-item .stat-icon {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background-color: #f8f9fa;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 12px;
  flex-shrink: 0;
}
.stats-list .stat-item .stat-icon i {
  color: #6c757d;
  font-size: 16px;
}
.stats-list .stat-item .stat-content {
  flex: 1;
  min-width: 0;
}
.stats-list .stat-item .stat-content .stat-title {
  font-weight: 600;
  font-size: 14px;
  color: #212529;
  margin-bottom: 2px;
}
.stats-list .stat-item .stat-content .stat-description {
  font-size: 12px;
  color: #6c757d;
  line-height: 1.2;
}
.stats-list .stat-item .stat-value {
  font-weight: 600;
  font-size: 16px;
  color: #212529;
  text-align: right;
  margin-left: 12px;
  flex-shrink: 0;
}
.stats-list .stat-item.stat-warning .stat-icon {
  background-color: #fff3cd;
}
.stats-list .stat-item.stat-warning .stat-icon i {
  color: #856404;
}
.stats-list .stat-item.stat-warning .stat-title {
  color: #856404;
}
.stats-list .stat-item.stat-warning .stat-value {
  color: #856404;
}
.stats-list .stat-item.stat-alert .stat-icon {
  background-color: #f8d7da;
}
.stats-list .stat-item.stat-alert .stat-icon i {
  color: #721c24;
}
.stats-list .stat-item.stat-alert .stat-title {
  color: #721c24;
}
.stats-list .stat-item.stat-alert .stat-value {
  color: #721c24;
}

.description-text {
  white-space: pre-line;
  color: black;
  font-size: 1.5rem;
}

.action-items-summary .position-relative .badge {
  position: absolute;
  right: -15px;
  top: 50%;
  transform: translateY(-50%);
  border-radius: 0;
  padding: 5px 10px;
  font-size: 0.95rem;
  font-weight: bold;
  color: #fff;
  display: block;
}

.action-item-keyline {
  border-top: 1px solid #ddd;
  opacity: 0.3;
  margin: 1rem 0;
}

.action-item {
  position: relative;
  padding-right: 25px;
}
.action-item span.badge {
  position: absolute;
  right: -15px;
  border-radius: 0;
  padding: 5px 10px;
  font-size: 0.95rem;
  font-weight: bold;
  color: #fff;
  display: block;
}

.item {
  position: relative;
}
.item span.badge {
  position: absolute;
  right: -15px;
  border-radius: 0;
  padding: 5px 10px;
  font-size: 0.95rem;
  display: block;
}

.card-title-warning-icon {
  font-size: 1.1rem;
  margin-left: 0.5rem;
}
.card-title-warning-icon.text-danger {
  color: #dc3545 !important;
  animation: pulse-red 2s infinite;
}
.card-title-warning-icon.text-warning {
  color: #ffc107 !important;
  animation: pulse-yellow 2s infinite;
}

@keyframes pulse-red {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0.7;
  }
  100% {
    opacity: 1;
  }
}
@keyframes pulse-yellow {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0.8;
  }
  100% {
    opacity: 1;
  }
}
.organisation-initials-avatar {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 200px;
  height: 200px;
  border-radius: 10px;
  font-size: 3rem;
  font-weight: bold;
  color: white;
  text-transform: uppercase;
  text-align: center;
  line-height: 1;
}

.organisation-profile-avatar {
  width: 200px;
  height: 200px;
  object-fit: cover;
  border-radius: 10px;
  max-width: 100%;
}

.logo-upload-section {
  margin-top: 1rem;
}
.logo-upload-section .btn {
  font-size: 0.875rem;
  padding: 0.375rem 0.75rem;
  border-radius: 0.375rem;
  transition: all 0.2s ease;
}
.logo-upload-section .btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
.logo-upload-section .progress {
  height: 0.5rem;
  border-radius: 0.25rem;
  margin-top: 0.5rem;
}
.logo-upload-section .progress .progress-bar {
  background-color: #0d6efd;
  border-radius: 0.25rem;
}

.permissions-matrix .table .group-header th {
  font-size: 0.9rem;
  font-weight: 700;
  text-align: center;
  vertical-align: middle;
  background-color: #e9ecef;
  border-bottom: 2px solid #dee2e6;
  color: #495057;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.permissions-matrix .table .group-header th:first-child {
  text-align: left;
  text-transform: none;
  letter-spacing: normal;
}
.permissions-matrix .table .group-header th.group-booking {
  background-color: #d1ecf1;
  border-left: 3px solid #17a2b8;
  border-right: 3px solid #17a2b8;
}
.permissions-matrix .table .group-header th.group-visibility {
  background-color: #d4edda;
  border-left: 3px solid #28a745;
  border-right: 3px solid #28a745;
}
.permissions-matrix .table .group-header th.group-management {
  background-color: #fff3cd;
  border-left: 3px solid #ffc107;
  border-right: 3px solid #ffc107;
}
.permissions-matrix .table .group-header th.group-notifications {
  background-color: #e2e3e5;
  border-left: 3px solid #6c757d;
  border-right: 3px solid #6c757d;
}
.permissions-matrix .table .permission-headers th {
  font-size: 0.8rem;
  font-weight: 600;
  text-align: center;
  vertical-align: middle;
  background-color: #f8f9fa;
  border-bottom: 1px solid #dee2e6;
  padding: 0.5rem 0.25rem;
}
.permissions-matrix .table .permission-headers th:first-child {
  text-align: left;
}
.permissions-matrix .table .permission-headers th.group-booking {
  background-color: #f0f8ff;
  border-left: 1px solid #17a2b8;
  border-right: 1px solid #17a2b8;
}
.permissions-matrix .table .permission-headers th.group-visibility {
  background-color: #f0fff4;
  border-left: 1px solid #28a745;
  border-right: 1px solid #28a745;
}
.permissions-matrix .table .permission-headers th.group-management {
  background-color: #fffbf0;
  border-left: 1px solid #ffc107;
  border-right: 1px solid #ffc107;
}
.permissions-matrix .table .permission-headers th.group-notifications {
  background-color: #f8f9fa;
  border-left: 1px solid #6c757d;
  border-right: 1px solid #6c757d;
}
.permissions-matrix .table td {
  vertical-align: middle;
  font-size: 0.9rem;
}
.permissions-matrix .table td:first-child {
  font-weight: 500;
}
.permissions-matrix .table td:nth-child(4), .permissions-matrix .table td:nth-child(5), .permissions-matrix .table td:nth-child(6) {
  background-color: rgba(23, 162, 184, 0.05);
  border-left: 1px solid rgba(23, 162, 184, 0.2);
  border-right: 1px solid rgba(23, 162, 184, 0.2);
}
.permissions-matrix .table td:nth-child(7), .permissions-matrix .table td:nth-child(8) {
  background-color: rgba(40, 167, 69, 0.05);
  border-left: 1px solid rgba(40, 167, 69, 0.2);
  border-right: 1px solid rgba(40, 167, 69, 0.2);
}
.permissions-matrix .table td:nth-child(9), .permissions-matrix .table td:nth-child(10) {
  background-color: rgba(255, 193, 7, 0.05);
  border-left: 1px solid rgba(255, 193, 7, 0.2);
  border-right: 1px solid rgba(255, 193, 7, 0.2);
}
.permissions-matrix .table td:nth-child(11), .permissions-matrix .table td:nth-child(12), .permissions-matrix .table td:nth-child(13), .permissions-matrix .table td:nth-child(14) {
  background-color: rgba(108, 117, 125, 0.05);
  border-left: 1px solid rgba(108, 117, 125, 0.2);
  border-right: 1px solid rgba(108, 117, 125, 0.2);
}
.permissions-matrix .table .permission-indicator {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0.25rem;
  border-radius: 0.25rem;
  transition: all 0.2s ease;
}
.permissions-matrix .table .permission-indicator.active {
  background-color: rgba(25, 135, 84, 0.1);
}
.permissions-matrix .table .permission-indicator.active i {
  color: #198754 !important;
}
.permissions-matrix .table .permission-indicator.inactive {
  background-color: rgba(108, 117, 125, 0.1);
}
.permissions-matrix .table .permission-indicator.inactive i {
  color: #6c757d !important;
}
.permissions-matrix .table .permission-indicator i {
  font-size: 1.1rem;
  transition: all 0.2s ease;
}
.permissions-matrix .table .btn-group-sm .btn {
  padding: 0.25rem 0.5rem;
  font-size: 0.75rem;
}
.permissions-matrix .table .person-name-clickable {
  cursor: pointer;
  color: #0d6efd;
  text-decoration: underline;
  transition: all 0.2s ease;
}
.permissions-matrix .table .person-name-clickable:hover {
  color: #0a58ca;
  text-decoration: none;
}
.permissions-matrix .table .permission-legend .legend-item {
  padding: 0.25rem 0.5rem;
  border-radius: 0.25rem;
  font-size: 0.75rem;
  font-weight: 500;
}
.permissions-matrix .table .permission-legend .legend-item.booking {
  background-color: #d1ecf1;
  color: #0c5460;
  border: 1px solid #17a2b8;
}
.permissions-matrix .table .permission-legend .legend-item.visibility {
  background-color: #d4edda;
  color: #155724;
  border: 1px solid #28a745;
}
.permissions-matrix .table .permission-legend .legend-item.management {
  background-color: #fff3cd;
  color: #856404;
  border: 1px solid #ffc107;
}
.permissions-matrix .table .permission-legend .legend-item.notifications {
  background-color: #e2e3e5;
  color: #495057;
  border: 1px solid #6c757d;
}
.permissions-matrix .table-hover tbody tr:hover {
  background-color: rgba(13, 110, 253, 0.05);
}

@media (max-width: 768px) {
  .permissions-matrix .table-responsive {
    font-size: 0.8rem;
  }
  .permissions-matrix .table-responsive th, .permissions-matrix .table-responsive td {
    padding: 0.5rem 0.25rem;
  }
  .permissions-matrix .table-responsive th {
    font-size: 0.75rem;
  }
}
.permission-column {
  position: relative;
}
.permission-column::after {
  content: attr(data-tooltip);
  position: absolute;
  bottom: 100%;
  left: 50%;
  transform: translateX(-50%);
  background-color: #333;
  color: white;
  padding: 0.25rem 0.5rem;
  border-radius: 0.25rem;
  font-size: 0.75rem;
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s;
  z-index: 1000;
}
.permission-column:hover::after {
  opacity: 1;
}

.badge-sm {
  font-size: 0.75rem;
  padding: 0.25rem 0.5rem;
}

.permission-legend .legend-item {
  font-size: 0.75rem;
  padding: 0.25rem 0.5rem;
  border-radius: 0.25rem;
  background-color: #f8f9fa;
  border: 1px solid #dee2e6;
}
.permission-legend .legend-item.booking {
  background-color: #e3f2fd;
  border-color: #2196f3;
  color: #1976d2;
}
.permission-legend .legend-item.visibility {
  background-color: #f3e5f5;
  border-color: #9c27b0;
  color: #7b1fa2;
}
.permission-legend .legend-item.management {
  background-color: #fff3e0;
  border-color: #ff9800;
  color: #f57c00;
}
.permission-legend .legend-item.notifications {
  background-color: #e8f5e8;
  border-color: #4caf50;
  color: #388e3c;
}

.person-cards-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 1rem;
  margin-bottom: 1rem;
}

.person-card {
  background: #ffffff;
  border: 1px solid #dee2e6;
  border-radius: 8px;
  padding: 1rem;
  cursor: pointer;
  transition: all 0.2s ease;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}
.person-card:hover {
  border-color: var(--bs-primary);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
  transform: translateY(-2px);
}
.person-card.inactive {
  opacity: 0.65;
  background-color: #f8f9fa;
}
.person-card .person-card-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 0.75rem;
  padding-bottom: 0.75rem;
  border-bottom: 1px solid #e9ecef;
}
.person-card .person-card-header .person-card-name {
  font-size: 1.4rem;
  font-weight: 600;
  margin: 0;
  color: #212529;
  flex: 1;
}
.person-card .person-card-header .person-card-preset {
  font-size: 1rem;
  padding: 0.3rem 0.6rem;
  margin-left: 0.5rem;
  white-space: nowrap;
}
.person-card .person-card-header .person-card-preset.badge-hr {
  background-color: #DBFD57;
  color: #130E70;
}
.person-card .person-card-header .person-card-preset.badge-preset {
  background-color: #130E70;
  color: #DBFD57;
}
.person-card .person-card-body {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.person-card .person-card-body .person-card-field {
  display: flex;
  align-items: center;
  font-size: 1.2rem;
  color: #495057;
}
.person-card .person-card-body .person-card-field i {
  width: 16px;
  flex-shrink: 0;
}
.person-card .person-card-body .person-card-field span,
.person-card .person-card-body .person-card-field a {
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.person-card .person-card-body .person-card-field a {
  color: var(--bs-primary);
}
.person-card .person-card-body .person-card-field a:hover {
  text-decoration: underline;
}

@media (max-width: 768px) {
  .person-cards-grid {
    grid-template-columns: 1fr;
  }
  .person-card {
    padding: 0.75rem;
  }
  .person-card .person-card-header {
    flex-direction: column;
    gap: 0.5rem;
  }
  .person-card .person-card-header .person-card-preset {
    margin-left: 0;
    align-self: flex-start;
  }
}
.permissions-matrix {
  font-size: 1.1rem;
}
.permissions-matrix .table {
  font-size: 1.1rem;
}
.permissions-matrix .table th {
  font-size: 1.05rem;
  font-weight: 600;
}
.permissions-matrix .table td {
  font-size: 1.1rem;
  vertical-align: middle;
}
.permissions-matrix .person-name-clickable {
  font-size: 1.15rem;
  cursor: pointer;
}
.permissions-matrix .person-name-clickable:hover {
  color: var(--bs-primary);
  text-decoration: underline;
}
.permissions-matrix .badge {
  font-size: 0.85rem;
}

.organisation-details .avatar-container {
  position: relative;
}
.organisation-details .avatar-container .logo-upload-section {
  margin-top: 1rem;
  opacity: 0;
  visibility: hidden;
  transition: all 0.3s ease;
  transform: translateY(-10px);
}
.organisation-details .avatar-container:hover .logo-upload-section {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
.organisation-details .logo-upload-section {
  margin-top: 1rem;
}
.organisation-details .logo-upload-section .btn-group {
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  border-radius: 0.5rem;
  overflow: hidden;
}
.organisation-details .logo-upload-section .btn-group .btn {
  transition: all 0.2s ease;
  border: none;
  font-weight: 500;
  padding: 0.5rem 1rem;
}
.organisation-details .logo-upload-section .btn-group .btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}
.organisation-details .logo-upload-section .btn-group .btn:focus {
  box-shadow: 0 0 0 0.2rem rgba(var(--bs-primary-rgb), 0.25);
}
.organisation-details .logo-upload-section .btn-group .btn.disabled {
  opacity: 0.6;
  cursor: not-allowed;
}
.organisation-details .logo-upload-section .btn-group .btn.disabled:hover {
  transform: none;
  box-shadow: none;
}
@media (max-width: 576px) {
  .organisation-details .logo-upload-section .btn-group {
    flex-direction: column;
    width: 100%;
  }
  .organisation-details .logo-upload-section .btn-group .btn {
    border-radius: 0.5rem !important;
    margin: 0.25rem 0;
  }
}
.organisation-details .logo-upload-section .progress {
  height: 0.5rem;
  border-radius: 0.25rem;
  background-color: rgba(0, 0, 0, 0.05);
  margin-top: 1rem;
}
.organisation-details .logo-upload-section .progress .progress-bar {
  background-color: var(--bs-primary);
  border-radius: 0.25rem;
  transition: width 0.3s ease;
}
.organisation-details .organisation-profile-avatar {
  width: 100%;
  height: auto;
  max-width: 100%;
  object-fit: contain;
  border-radius: 10px;
  border: 4px solid #fff;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.15);
  transition: all 0.3s ease;
  aspect-ratio: 1;
}
.organisation-details .organisation-profile-avatar:hover {
  transform: scale(1.05);
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.2);
}
@media (max-width: 768px) {
  .organisation-details .organisation-profile-avatar {
    border-width: 3px;
  }
}
@media (max-width: 576px) {
  .organisation-details .organisation-profile-avatar {
    border-width: 2px;
  }
}
.organisation-details .organisation-initials-avatar {
  width: 100%;
  height: auto;
  max-width: 100%;
  aspect-ratio: 1;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: clamp(1.5rem, 4vw, 2.5rem);
  font-weight: bold;
  color: white;
  border: 4px solid #fff;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.15);
  transition: all 0.3s ease;
}
.organisation-details .organisation-initials-avatar:hover {
  transform: scale(1.05);
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.2);
}
@media (max-width: 768px) {
  .organisation-details .organisation-initials-avatar {
    border-width: 3px;
  }
}
@media (max-width: 576px) {
  .organisation-details .organisation-initials-avatar {
    border-width: 2px;
  }
}

.organisation-list .table .permission-indicator {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0.25rem;
  border-radius: 0.25rem;
  transition: all 0.2s ease;
}
.organisation-list .table .permission-indicator.active {
  background-color: rgba(25, 135, 84, 0.1);
}
.organisation-list .table .permission-indicator.active i {
  color: #198754 !important;
}
.organisation-list .table .permission-indicator.inactive {
  background-color: rgba(108, 117, 125, 0.1);
}
.organisation-list .table .permission-indicator.inactive i {
  color: #6c757d !important;
}
.organisation-list .table .permission-indicator i {
  font-size: 1.1rem;
  transition: all 0.2s ease;
}
.organisation-list .table .btn-group-sm .btn {
  padding: 0.25rem 0.5rem;
  font-size: 0.75rem;
}
.organisation-list .table-hover tbody tr:hover {
  background-color: rgba(13, 110, 253, 0.05);
}

@media (max-width: 768px) {
  .organisation-list .table-responsive {
    font-size: 0.8rem;
  }
  .organisation-list .table-responsive th, .organisation-list .table-responsive td {
    padding: 0.5rem 0.25rem;
  }
  .organisation-list .table-responsive th {
    font-size: 0.75rem;
  }
}
.person-initials-avatar {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 150px;
  height: 150px;
  border-radius: 10px;
  font-size: 2.5rem;
  font-weight: bold;
  color: white;
  text-transform: uppercase;
  text-align: center;
  line-height: 1;
  margin: 0 auto;
}

.person-profile-avatar {
  width: 150px;
  height: 150px;
  object-fit: cover;
  border-radius: 10px;
  max-width: 100%;
  margin: 0 auto;
  display: block;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.person-list-item {
  display: flex;
  align-items: center;
  padding: 1rem;
  border-radius: 8px;
  background-color: #ffffff;
  margin-bottom: 0.5rem;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
  transition: all 0.2s ease-in-out;
}
.person-list-item:hover {
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  transform: translateY(-1px);
}
.person-list-item .person-avatar {
  width: 48px;
  height: 48px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  background-color: #e9ecef;
  margin-right: 1rem;
}
.person-list-item .person-avatar .person-avatar-initials {
  width: 100%;
  height: 100%;
  font-weight: bold;
  color: #ffffff;
  font-size: 1rem;
  display: flex;
  align-items: center;
  justify-content: center;
  text-transform: uppercase;
}
.person-list-item .person-avatar .person-avatar-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.person-list-item .person-details {
  flex: 1;
}
.person-list-item .person-details .person-name {
  font-size: 1.4rem;
  font-weight: bold;
  color: #10137E;
  margin-bottom: 0.25rem;
}
.person-list-item .person-details .person-info {
  font-size: 1.2rem;
  color: #8694B3;
  margin-bottom: 0.25rem;
}
.person-list-item .person-details .person-info i {
  margin-right: 0.5rem;
  font-size: 1.2rem;
  color: #10137E;
}
.person-list-item .person-details .person-status {
  font-size: 1.1rem;
  color: #6c757d;
}
.person-list-item .person-actions {
  display: flex;
  gap: 0.5rem;
  align-items: center;
}

.person-details-header {
  background: linear-gradient(135deg, #F4F7FE 0%, #E8F4FD 100%);
  border-radius: 15px;
  padding: 2rem;
  margin-bottom: 2rem;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
}
.person-details-header .person-header-content {
  display: flex;
  align-items: center;
  gap: 2rem;
}
@media (max-width: 768px) {
  .person-details-header .person-header-content {
    flex-direction: column;
    text-align: center;
  }
}
.person-details-header .person-header-info {
  flex: 1;
}
.person-details-header .person-header-info .person-full-name {
  font-size: 2.4rem;
  font-weight: bold;
  color: #10137E;
  margin-bottom: 0.5rem;
}
.person-details-header .person-header-info .person-subtitle {
  font-size: 1.6rem;
  color: #8694B3;
  margin-bottom: 1rem;
}
.person-details-header .person-header-info .person-meta {
  display: flex;
  gap: 2rem;
  flex-wrap: wrap;
}
.person-details-header .person-header-info .person-meta .meta-item {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 1.3rem;
  color: #6c757d;
}
.person-details-header .person-header-info .person-meta .meta-item i {
  color: #10137E;
  font-size: 1.4rem;
}

.person-stats-card {
  background: #ffffff;
  border-radius: 12px;
  padding: 1.5rem;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
  transition: all 0.2s ease-in-out;
}
.person-stats-card:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
  transform: translateY(-2px);
}
.person-stats-card .stats-icon {
  width: 48px;
  height: 48px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 1rem;
  font-size: 1.8rem;
  color: white;
}
.person-stats-card .stats-value {
  font-size: 2rem;
  font-weight: bold;
  color: #10137E;
  margin-bottom: 0.5rem;
}
.person-stats-card .stats-label {
  font-size: 1.3rem;
  color: #8694B3;
  font-weight: 500;
}

.person-form-section {
  background: #ffffff;
  border-radius: 12px;
  padding: 2rem;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
  margin-bottom: 2rem;
}
.person-form-section .section-title {
  font-size: 1.8rem;
  font-weight: bold;
  color: #10137E;
  margin-bottom: 1.5rem;
  padding-bottom: 1rem;
  border-bottom: 2px solid #F4F7FE;
}

.person-merge-modal .modal-xl {
  max-width: 1200px;
}
.person-merge-modal .merge-preview-section .card {
  border: 1px solid #dee2e6;
  margin-bottom: 1rem;
}
.person-merge-modal .merge-preview-section .card .card-header {
  background-color: #f8f9fa;
  border-bottom: 1px solid #dee2e6;
  font-weight: 600;
}
.person-merge-modal .conflict-warning .alert-warning {
  border-left: 4px solid #ffc107;
}
.person-merge-modal .person-search .list-group-item {
  cursor: pointer;
  transition: background-color 0.2s ease;
}
.person-merge-modal .person-search .list-group-item:hover {
  background-color: #f8f9fa;
}
.person-merge-modal .person-search .list-group-item.active {
  background-color: #007bff;
  border-color: #007bff;
}
.person-merge-modal .merge-data-summary .badge {
  font-size: 0.75rem;
}
.person-merge-modal .loading-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(255, 255, 255, 0.8);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1000;
}

@media (max-width: 767.98px) {
  .list-filter::after {
    content: "";
    display: table;
    clear: both;
  }
  .row.card-shadow {
    clear: both;
  }
}
.course-initials-avatar {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 150px;
  height: 150px;
  border-radius: 10px;
  font-size: 2.5rem;
  font-weight: bold;
  color: white;
  text-transform: uppercase;
  text-align: center;
  line-height: 1;
  margin: 0 auto;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.course-overview-header {
  background: linear-gradient(135deg, #F4F7FE 0%, #E8F4FD 100%);
  border-radius: 15px;
  padding: 2rem;
  margin-bottom: 2rem;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
}
.course-overview-header .course-header-content {
  display: flex;
  align-items: center;
  gap: 2rem;
}
@media (max-width: 768px) {
  .course-overview-header .course-header-content {
    flex-direction: column;
    text-align: center;
  }
}
.course-overview-header .course-header-info {
  flex: 1;
}
.course-overview-header .course-header-info .course-full-title {
  font-size: 2.4rem;
  font-weight: bold;
  color: #10137E;
  margin-bottom: 0.5rem;
}
.course-overview-header .course-header-info .course-subtitle {
  font-size: 1.6rem;
  color: #8694B3;
  margin-bottom: 1rem;
}
.course-overview-header .course-header-info .course-meta {
  display: flex;
  gap: 2rem;
  flex-wrap: wrap;
}
.course-overview-header .course-header-info .course-meta .meta-item {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 1.3rem;
  color: #6c757d;
}
.course-overview-header .course-header-info .course-meta .meta-item i {
  color: #10137E;
  font-size: 1.4rem;
}

.course-stats-card {
  background: #ffffff;
  border-radius: 12px;
  padding: 1.5rem;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
  transition: all 0.2s ease-in-out;
}
.course-stats-card:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
  transform: translateY(-2px);
}
.course-stats-card .stats-icon {
  width: 48px;
  height: 48px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 1rem;
  font-size: 1.8rem;
  color: white;
}
.course-stats-card .stats-value {
  font-size: 2rem;
  font-weight: bold;
  color: #10137E;
  margin-bottom: 0.5rem;
}
.course-stats-card .stats-label {
  font-size: 1.3rem;
  color: #8694B3;
  font-weight: 500;
}

.course-details-section {
  background: #ffffff;
  border-radius: 12px;
  padding: 2rem;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
  margin-bottom: 2rem;
}
.course-details-section .section-title {
  font-size: 1.8rem;
  font-weight: bold;
  color: #10137E;
  margin-bottom: 1.5rem;
  padding-bottom: 1rem;
  border-bottom: 2px solid #F4F7FE;
}
.course-details-section .detail-row {
  display: flex;
  justify-content: space-between;
  margin-bottom: 1rem;
  padding: 0.5rem 0;
}
.course-details-section .detail-row .detail-label {
  font-weight: 600;
  color: #10137E;
}
.course-details-section .detail-row .detail-value {
  color: #6c757d;
}

.course-content-preview {
  background: #ffffff;
  border-radius: 12px;
  padding: 2rem;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
  margin-bottom: 2rem;
}
.course-content-preview .preview-title {
  font-size: 1.6rem;
  font-weight: bold;
  color: #10137E;
  margin-bottom: 1rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.course-content-preview .preview-title i {
  color: #007bff;
}
.course-content-preview .preview-content {
  color: #6c757d;
  line-height: 1.6;
  font-size: 1.4rem;
}

.course-scheduled-table {
  background: #ffffff;
  border-radius: 12px;
  padding: 2rem;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
  margin-bottom: 2rem;
}
.course-scheduled-table .table-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 1.5rem;
}
.course-scheduled-table .table-header .table-title {
  font-size: 1.8rem;
  font-weight: bold;
  color: #10137E;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.course-scheduled-table .table-header .table-title i {
  color: #007bff;
}
.course-scheduled-table .table-responsive {
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}
.course-scheduled-table .table-responsive .table {
  margin-bottom: 0;
}
.course-scheduled-table .table-responsive .table th {
  background-color: #F8F9FA;
  border-bottom: 2px solid #DEE2E6;
  color: #10137E;
  font-weight: 600;
  padding: 1rem;
}
.course-scheduled-table .table-responsive .table td {
  padding: 1rem;
  vertical-align: middle;
  border-bottom: 1px solid #DEE2E6;
}
.course-scheduled-table .table-responsive .table tbody tr:hover {
  background-color: #F8F9FA;
}

.categories-container {
  max-width: 300px;
}

.org-emails-container {
  max-width: 250px;
}

.booking-items {
  max-width: 300px;
}

.booking-item {
  font-size: 0.875rem;
  margin-bottom: 0.25rem;
  color: #495057;
}
.booking-item:last-child {
  margin-bottom: 0;
}

.finance-summary-card {
  border: none;
}
.finance-summary-card.total-invoices {
  background-color: #E6E6FA;
}
.finance-summary-card.total-amount {
  background-color: #E0FFFF;
}
.finance-summary-card.outstanding {
  background-color: #FFC0CB;
}
.finance-summary-card.overdue {
  background-color: #D3D3D3;
}
.finance-summary-card .card-title {
  color: #4A4A4A;
}
.finance-summary-card .card-value {
  color: #2E2E2E;
}

.financial-summary-card {
  border: none;
}
.financial-summary-card.revenue {
  background-color: #E0FFFF;
}
.financial-summary-card.budget {
  background-color: #FFE4B5;
}
.financial-summary-card.expenses {
  background-color: #FFC0CB;
}
.financial-summary-card.variance-positive {
  background-color: #E6E6FA;
}
.financial-summary-card.variance-negative {
  background-color: #FFB6C1;
}
.financial-summary-card.profit-positive {
  background-color: #E6E6FA;
}
.financial-summary-card.profit-negative {
  background-color: #FFE4B5;
}
.financial-summary-card.profit-margin {
  background-color: #D3D3D3;
}
.financial-summary-card .card-title {
  color: #4A4A4A;
}
.financial-summary-card .card-value {
  color: #2E2E2E;
}
.financial-summary-card small {
  color: #4A4A4A;
}

.attendees-table .session-header {
  font-size: 0.8rem;
}
.attendees-table .status-icon {
  font-size: 1.2rem;
}
.attendees-table .feedback-table {
  max-height: 400px;
}

.exam-details-page .row.g-3 {
  margin-bottom: 2rem;
}
.exam-details-page .card-shadow {
  margin-bottom: 1.5rem;
}
.exam-details-page .card-shadow .card-title {
  color: var(--bs-primary);
  font-weight: 600;
  margin-bottom: 1.5rem;
  border-bottom: 2px solid var(--bs-light);
  padding-bottom: 0.75rem;
}
.exam-details-page .expense-section .card-header {
  background: linear-gradient(135deg, var(--bs-primary) 0%, var(--bs-primary-dark, #0056b3) 100%);
  color: white;
  border-radius: 0.5rem 0.5rem 0 0;
}
.exam-details-page .expense-section .card-header h5 {
  margin: 0;
  font-weight: 600;
}
.exam-details-page .expense-section .card-header h5 i {
  margin-right: 0.5rem;
}
.exam-details-page .expense-section .card-body {
  padding: 1.5rem;
}
.exam-details-page .expense-section .table {
  margin-bottom: 1.5rem;
}
.exam-details-page .expense-section .table thead th {
  background-color: var(--bs-light);
  border-bottom: 2px solid var(--bs-primary);
  font-weight: 600;
  color: var(--bs-primary);
  padding: 1rem 0.75rem;
}
.exam-details-page .expense-section .table tbody td {
  padding: 1rem 0.75rem;
  vertical-align: middle;
  border-bottom: 1px solid var(--bs-light);
}
.exam-details-page .expense-section .table tbody tr:hover {
  background-color: rgba(var(--bs-primary-rgb), 0.05);
  transition: background-color 0.2s ease;
}
.exam-details-page .expense-section .expense-summary .card {
  border: none;
  border-radius: 12px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.exam-details-page .expense-section .expense-summary .card:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}
.exam-details-page .expense-section .expense-summary .card .card-body {
  padding: 1.25rem;
  text-align: center;
}
.exam-details-page .expense-section .expense-summary .card .card-title {
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--bs-secondary);
  margin-bottom: 0.5rem;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.exam-details-page .expense-section .expense-summary .card h4 {
  font-weight: 700;
  margin: 0;
}
.exam-details-page .badge {
  padding: 0.5rem 1rem;
  font-size: 0.75rem;
  font-weight: 600;
  border-radius: 20px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.exam-details-page .modal-content {
  border-radius: 16px;
  border: none;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
}
.exam-details-page .modal-content .modal-header {
  background: linear-gradient(135deg, var(--bs-primary) 0%, var(--bs-primary-dark, #0056b3) 100%);
  color: white;
  border-radius: 16px 16px 0 0;
}
.exam-details-page .modal-content .modal-header .modal-title {
  font-weight: 600;
}
@media (max-width: 768px) {
  .exam-details-page .row.g-3 {
    margin-bottom: 1rem;
  }
  .exam-details-page .card-shadow {
    margin-bottom: 1rem;
  }
  .exam-details-page .expense-section .table-responsive {
    font-size: 0.875rem;
  }
  .exam-details-page .expense-section .btn-group .btn {
    min-width: 36px;
    height: 36px;
  }
  .exam-details-page .expense-section .btn-group .btn i {
    font-size: 0.875rem;
  }
}

.workflow-container {
  width: 65px;
  flex-shrink: 0;
  position: sticky;
  top: 0;
  align-self: flex-start;
  transition: width 0.3s ease;
  height: fit-content;
  margin-left: auto;
}
.workflow-container:hover {
  position: sticky;
  width: 350px;
  z-index: 1000;
  margin-left: auto;
}

.course-creation-workflow {
  width: 100%;
  height: calc(100vh - 80px);
  background-color: #222;
  color: white;
  overflow-y: auto;
  position: sticky;
  top: 0;
  transition: all 0.3s ease;
  overflow: hidden;
}
.course-creation-workflow .workflow-steps .workflow-step {
  justify-content: center;
  padding: 1rem 0.5rem;
}
.course-creation-workflow .workflow-steps .workflow-step .step-content {
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s ease;
  white-space: nowrap;
  width: 0;
  overflow: hidden;
}
.course-creation-workflow .workflow-steps .workflow-step .step-icon {
  margin-right: 0;
  transition: margin-right 0.2s ease;
}
.course-creation-workflow .workflow-sub-nav,
.course-creation-workflow .workflow-warnings,
.course-creation-workflow .status-summary,
.course-creation-workflow .quick-actions {
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s ease;
  height: 0;
  overflow: hidden;
}
.workflow-container:hover .course-creation-workflow {
  overflow-y: auto;
}
.workflow-container:hover .course-creation-workflow .workflow-steps .workflow-step {
  justify-content: flex-start;
  padding: 1rem;
}
.workflow-container:hover .course-creation-workflow .workflow-steps .workflow-step .step-content {
  opacity: 1;
  pointer-events: auto;
  transition: opacity 0.2s ease 0.1s;
  width: auto;
  overflow: visible;
}
.workflow-container:hover .course-creation-workflow .workflow-steps .workflow-step .step-icon {
  margin-right: 1rem;
  transition: margin-right 0.2s ease 0.1s;
}
.workflow-container:hover .course-creation-workflow .workflow-sub-nav,
.workflow-container:hover .course-creation-workflow .workflow-warnings,
.workflow-container:hover .course-creation-workflow .status-summary,
.workflow-container:hover .course-creation-workflow .quick-actions {
  opacity: 1;
  pointer-events: auto;
  transition: opacity 0.2s ease 0.1s;
  height: auto;
  overflow: visible;
}
.course-creation-workflow .workflow-steps .workflow-step {
  display: flex;
  align-items: center;
  padding: 1rem;
  background-color: rgba(255, 255, 255, 0.1);
  transition: all 0.3s ease;
}
.course-creation-workflow .workflow-steps .workflow-step.step-current {
  background-color: rgba(255, 255, 255, 0.2);
  border-left: 8px solid;
}
.course-creation-workflow .workflow-steps .workflow-step.step-completed {
  background-color: rgba(40, 167, 69, 0.2);
  border-left: 8px solid;
}
.course-creation-workflow .workflow-steps .workflow-step.step-pending {
  background-color: rgba(255, 255, 255, 0.05);
  border-left: 8px solid;
}
.course-creation-workflow .workflow-steps .workflow-step .step-icon {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background-color: rgba(255, 255, 255, 0.2);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 1rem;
  flex-shrink: 0;
}
.course-creation-workflow .workflow-steps .workflow-step .step-icon i {
  color: white;
  font-size: 1.2rem;
}
.course-creation-workflow .workflow-steps .workflow-step .step-content {
  flex: 1;
}
.course-creation-workflow .workflow-steps .workflow-step .step-content .step-title {
  color: white;
  font-weight: 600;
  margin-bottom: 0.5rem;
}
.course-creation-workflow .workflow-steps .workflow-step .step-content .step-description {
  color: rgba(255, 255, 255, 0.8);
  font-size: 0.9rem;
  margin-bottom: 1rem;
}
.course-creation-workflow .workflow-steps .workflow-step .step-content .step-actions .btn {
  font-size: 0.85rem;
  padding: 0.375rem 0.75rem;
}
.course-creation-workflow .workflow-action-link {
  width: 100%;
  text-align: left;
  border: none;
  background: none;
  display: block;
  padding: 8px 12px;
  text-decoration: none;
  transition: all 0.3s ease;
  color: white !important;
  font-weight: 400;
  border-radius: 4px;
  position: relative;
}
.course-creation-workflow .workflow-action-link:hover:not(.disabled) {
  text-decoration: none;
  font-weight: bold;
  background-color: rgba(255, 255, 255, 0.1);
  color: white !important;
}
.course-creation-workflow .workflow-action-link:hover:not(.disabled) .arrow {
  transform: translateX(4px);
}
.course-creation-workflow .workflow-action-link.disabled {
  opacity: 0.4;
  cursor: not-allowed;
  pointer-events: none;
}
.course-creation-workflow .workflow-action-link i {
  margin-right: 8px;
  color: white !important;
}
.course-creation-workflow .workflow-action-link .arrow {
  float: right;
  transition: transform 0.2s ease;
  color: white !important;
  opacity: 0.7;
}
.course-creation-workflow .workflow-action-link:hover:not(.disabled) .arrow {
  opacity: 1;
}
.course-creation-workflow .workflow-action-link.text-danger, .course-creation-workflow .workflow-action-link.text-secondary, .course-creation-workflow .workflow-action-link.text-success, .course-creation-workflow .workflow-action-link.text-primary, .course-creation-workflow .workflow-action-link.text-warning, .course-creation-workflow .workflow-action-link.text-info {
  color: white !important;
}
.course-creation-workflow .workflow-action-link.text-danger:hover:not(.disabled), .course-creation-workflow .workflow-action-link.text-secondary:hover:not(.disabled), .course-creation-workflow .workflow-action-link.text-success:hover:not(.disabled), .course-creation-workflow .workflow-action-link.text-primary:hover:not(.disabled), .course-creation-workflow .workflow-action-link.text-warning:hover:not(.disabled), .course-creation-workflow .workflow-action-link.text-info:hover:not(.disabled) {
  color: white !important;
}
.course-creation-workflow .workflow-sub-nav {
  margin-top: 0.5rem;
}
.course-creation-workflow .workflow-sub-nav .sub-nav-actions {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}
.course-creation-workflow .workflow-warnings {
  margin-top: 1rem;
  padding: 0.75rem;
  background-color: rgba(255, 193, 7, 0.2);
  border-radius: 0.5rem;
  border-left: 4px solid #ffc107;
}
.course-creation-workflow .workflow-warnings .warning-message {
  display: flex;
  align-items: center;
  margin-bottom: 0.5rem;
  font-size: 1.4rem;
  color: #856404;
  background-color: #fff3cd;
  padding: 0.75rem;
  border-radius: 0.25rem;
  border: 1px solid #ffeaa7;
}
.course-creation-workflow .workflow-warnings .warning-message:last-child {
  margin-bottom: 0;
}
.course-creation-workflow .workflow-warnings .warning-message i {
  margin-right: 0.5rem;
  font-size: 1.4rem;
  color: #856404;
}
.course-creation-workflow .workflow-warnings .permission-warning {
  color: #495057;
  background-color: #e2e3e5;
  border: 1px solid #d6d8db;
}
.course-creation-workflow .workflow-warnings .permission-warning i {
  color: #495057;
}
.course-creation-workflow .status-summary {
  background-color: rgba(255, 255, 255, 0.1);
  border-radius: 0.5rem;
  padding: 1rem;
  margin-top: 1.5rem;
}
.course-creation-workflow .status-summary h6 {
  color: white;
  margin-bottom: 0.5rem;
}
.course-creation-workflow .status-summary .badge {
  font-size: 0.8rem;
}
.course-creation-workflow .status-summary .text-muted {
  color: rgba(255, 255, 255, 0.7) !important;
}
.course-creation-workflow .quick-actions {
  margin-top: 1.5rem;
}
.course-creation-workflow .quick-actions h6 {
  color: white;
  margin-bottom: 0.5rem;
}
.course-creation-workflow .quick-actions .btn {
  font-size: 0.85rem;
  padding: 0.375rem 0.75rem;
  margin-bottom: 0.5rem;
  border-color: rgba(255, 255, 255, 0.3);
  color: white;
}
.course-creation-workflow .quick-actions .btn:hover {
  background-color: rgba(255, 255, 255, 0.1);
  border-color: rgba(255, 255, 255, 0.5);
}
.course-creation-workflow .quick-actions .btn.btn-outline-primary:hover {
  background-color: #007bff;
  border-color: #007bff;
}
.course-creation-workflow .quick-actions .btn.btn-outline-warning:hover {
  background-color: #ffc107;
  border-color: #ffc107;
  color: #212529;
}
.course-creation-workflow .quick-actions .btn.btn-outline-success:hover {
  background-color: #28a745;
  border-color: #28a745;
}
.course-creation-workflow .quick-actions .btn.btn-outline-info:hover {
  background-color: #17a2b8;
  border-color: #17a2b8;
}
.course-creation-workflow::-webkit-scrollbar {
  width: 6px;
}
.course-creation-workflow::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, 0.1);
  border-radius: 3px;
}
.course-creation-workflow::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.3);
  border-radius: 3px;
}
.course-creation-workflow::-webkit-scrollbar-thumb:hover {
  background: rgba(255, 255, 255, 0.5);
}

.course-setup .modal-container .tutor-search-section .form-control {
  border-radius: 6px;
  border: 1px solid #ced4da;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
.course-setup .modal-container .tutor-search-section .form-control:focus {
  border-color: #80bdff;
  box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
}
.course-setup .modal-container .tutor-list-container {
  border: 1px solid #dee2e6;
  border-radius: 6px;
  overflow: hidden;
}
.course-setup .modal-container .instructions-section .alert-info {
  border-left: 4px solid #17a2b8;
  background-color: #f8f9fa;
  border-color: #bee5eb;
  color: #0c5460;
}
.course-setup .modal-container .instructions-section .card {
  border: 1px solid #dee2e6;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}
.course-setup .modal-container .instructions-section .card .card-title {
  color: #495057;
  font-weight: 600;
}
.course-setup .modal-container .instructions-section .card ul {
  color: #6c757d;
}
.course-setup .modal-container .instructions-section .card ul li {
  margin-bottom: 0.25rem;
}
.course-setup .modal-container .instructions-section .card ul li:last-child {
  margin-bottom: 0;
}
.course-setup .tutor-item {
  transition: all 0.2s ease;
  border-radius: 4px;
  margin: 2px 0;
}
.course-setup .tutor-item.disabled {
  cursor: not-allowed !important;
  background-color: #f8f9fa !important;
  opacity: 0.6;
  position: relative;
}
.course-setup .tutor-item.disabled:hover {
  background-color: #f8f9fa !important;
  transform: none !important;
  box-shadow: none !important;
}
.course-setup .tutor-item.disabled:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: repeating-linear-gradient(45deg, transparent, transparent 3px, rgba(0, 0, 0, 0.03) 3px, rgba(0, 0, 0, 0.03) 6px);
  pointer-events: none;
  border-radius: 4px;
}
.course-setup .tutor-item.disabled:after {
  content: "✓";
  position: absolute;
  top: 8px;
  right: 8px;
  background: #28a745;
  color: white;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: bold;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}
.course-setup .tutor-item.disabled .tutor-name {
  color: #6c757d;
}
.course-setup .tutor-item.disabled .tutor-org {
  color: #adb5bd;
}
.course-setup .tutor-item.disabled .tutor-status {
  color: #28a745;
  font-weight: 500;
}
.course-setup .tutor-item:not(.disabled) {
  cursor: pointer;
}
.course-setup .tutor-item:not(.disabled):hover {
  background-color: #f8f9fa;
  transform: translateY(-1px);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
.course-setup .tutor-item:not(.disabled):active {
  transform: translateY(0);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}
.course-setup .tutor-item .tutor-name {
  font-weight: 600;
  color: #212529;
}
.course-setup .tutor-item .tutor-org {
  color: #6c757d;
  font-size: 0.875em;
}
.course-setup .tutor-item .tutor-status {
  font-size: 0.75em;
  font-weight: 500;
}
.course-setup .card.position-relative {
  overflow: visible;
}
.course-setup .card .position-absolute.bottom-0.end-0 {
  z-index: 10;
  margin-bottom: 0.75rem;
  margin-right: 0.75rem;
}
.course-setup .card .position-absolute.bottom-0.end-0 .btn-group .btn {
  border-radius: 0.375rem;
  transition: all 0.2s ease;
  min-width: 2.25rem;
  height: 2.25rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: rgba(255, 255, 255, 0.95);
  backdrop-filter: blur(4px);
  border: 1px solid rgba(0, 0, 0, 0.1);
}
.course-setup .card .position-absolute.bottom-0.end-0 .btn-group .btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  background-color: rgb(255, 255, 255);
}
.course-setup .card .position-absolute.bottom-0.end-0 .btn-group .btn:active {
  transform: translateY(0);
}
.course-setup .card .position-absolute.bottom-0.end-0 .btn-group .btn i {
  font-size: 0.75rem;
  color: var(--bs-primary);
}
.course-setup .card .card-body {
  padding-bottom: 3.5rem;
  position: relative;
}
.course-setup .card.mb-3 {
  transition: all 0.2s ease;
  border: 1px solid rgba(0, 0, 0, 0.125);
  position: relative;
}
.course-setup .card.mb-3:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
  border-color: rgba(0, 0, 0, 0.2);
}
.course-setup .card.mb-3 .card-header {
  background-color: rgba(0, 0, 0, 0.03);
  border-bottom: 1px solid rgba(0, 0, 0, 0.125);
}
.course-setup .card.mb-3 .position-absolute.bottom-0.end-0 {
  z-index: 10;
  margin-bottom: 0.75rem;
  margin-right: 0.75rem;
}
.course-setup .card.mb-3 .position-absolute.bottom-0.end-0 .btn-group .btn {
  border-radius: 0.375rem;
  transition: all 0.2s ease;
  min-width: 2.25rem;
  height: 2.25rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: rgba(255, 255, 255, 0.95);
  backdrop-filter: blur(4px);
  border: 1px solid rgba(0, 0, 0, 0.1);
}
.course-setup .card.mb-3 .position-absolute.bottom-0.end-0 .btn-group .btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  background-color: rgb(255, 255, 255);
}
.course-setup .card.mb-3 .position-absolute.bottom-0.end-0 .btn-group .btn:active {
  transform: translateY(0);
}
.course-setup .card.mb-3 .position-absolute.bottom-0.end-0 .btn-group .btn i {
  font-size: 0.75rem;
  color: var(--bs-primary);
}
.course-setup .card .card {
  border: 1px solid rgba(0, 0, 0, 0.08);
  margin-bottom: 1rem;
}
.course-setup .card .card .card-body {
  padding-bottom: 3rem;
}
.course-setup .card .card .position-absolute.bottom-0.end-0 .btn-group .btn {
  font-size: 0.75rem;
  padding: 0.25rem 0.5rem;
  min-width: 1.75rem;
  height: 1.75rem;
  background-color: rgba(255, 255, 255, 0.9);
}
.course-setup .card .card:hover {
  border-color: rgba(0, 0, 0, 0.15);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}
.course-setup .card.mb-3:not(.card .card) .card-body {
  padding-bottom: 3.5rem;
}
.course-setup .card + .card {
  margin-top: 1rem;
}

@media (max-width: 768px) {
  .course-setup .card .position-absolute.bottom-0.end-0 {
    margin-bottom: 0.5rem;
    margin-right: 0.5rem;
  }
  .course-setup .card .position-absolute.bottom-0.end-0 .btn-group .btn {
    font-size: 0.875rem;
    padding: 0.375rem 0.75rem;
    min-width: 2rem;
    height: 2rem;
  }
  .course-setup .card .card-body {
    padding-bottom: 3rem;
  }
  .course-setup .card .card .card-body {
    padding-bottom: 2.5rem;
  }
  .course-setup .card .card .position-absolute.bottom-0.end-0 .btn-group .btn {
    min-width: 1.75rem;
    height: 1.75rem;
  }
}
@media (max-width: 576px) {
  .course-setup .card .position-absolute.bottom-0.end-0 .btn-group .btn {
    min-width: 1.75rem;
    height: 1.75rem;
    font-size: 0.75rem;
    padding: 0.25rem 0.5rem;
  }
}
.create-booking-wizard .modal-dialog {
  max-width: 1200px;
}
.create-booking-wizard .modal-body {
  padding: 1.5rem;
}

.step-indicator {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 2rem;
  padding: 0 1rem;
}
.step-indicator .step {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex: 1;
  position: relative;
}
.step-indicator .step:not(:last-child)::after {
  content: "";
  position: absolute;
  top: 20px;
  left: 50%;
  width: 100%;
  height: 2px;
  background-color: #e9ecef;
  z-index: 1;
}
.step-indicator .step.active:not(:last-child)::after {
  background-color: #DBFD57;
}
.step-indicator .step .step-number {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background-color: #e9ecef;
  color: #6c757d;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  font-size: 1.1rem;
  margin-bottom: 0.5rem;
  position: relative;
  z-index: 2;
  transition: all 0.3s ease;
}
.step-indicator .step .step-label {
  font-size: 0.875rem;
  color: #6c757d;
  text-align: center;
  font-weight: 500;
  transition: all 0.3s ease;
}
.step-indicator .step.active .step-number {
  background-color: #DBFD57;
  color: #130E70;
  transform: scale(1.1);
}
.step-indicator .step.active .step-label {
  color: #DBFD57;
  font-weight: 600;
}

.step-content h6 {
  color: #495057;
  font-weight: 600;
  margin-bottom: 1.5rem;
  padding-bottom: 0.5rem;
  border-bottom: 2px solid #e9ecef;
}

.table-responsive {
  border-radius: 0.375rem;
  overflow: hidden;
  box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
}
.table-responsive .table {
  margin-bottom: 0;
}
.table-responsive .table th {
  background-color: #f8f9fa;
  border-bottom: 2px solid #dee2e6;
  font-weight: 600;
  color: #495057;
  white-space: nowrap;
  padding: 0.75rem 0.5rem;
}
.table-responsive .table td {
  vertical-align: middle;
  border-color: #e9ecef;
  padding: 0.2rem 0.5rem;
}
.table-responsive .table tbody tr:hover {
  background-color: #f8f9fa;
}
.table-responsive .table .table-warning {
  background-color: #fff3cd;
}
.table-responsive .table .table-warning:hover {
  background-color: #ffeaa7;
}
.table-responsive .table .btn-sm {
  padding: 0.25rem 0.5rem;
  font-size: 0.875rem;
  border-radius: 0.2rem;
}
.table-responsive .table .badge {
  padding: 0.375rem 0.75rem;
}
.table-responsive .table .badge.bg-success {
  background-color: #28a745 !important;
}
.table-responsive .table .badge.bg-warning {
  background-color: #ffc107 !important;
  color: #212529 !important;
}
.table-responsive .table .badge.bg-secondary {
  background-color: #6c757d !important;
}
.table-responsive .table .badge.bg-info {
  background-color: #17a2b8 !important;
}
.table-responsive .table .badge.bg-danger {
  background-color: #dc3545 !important;
}

.card {
  border: 1px solid #e9ecef;
  border-radius: 0.5rem;
  box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
}
.card .card-header {
  background-color: #f8f9fa;
  border-bottom: 1px solid #e9ecef;
  font-weight: 600;
  color: #495057;
}
.card .card-body {
  padding: 1.25rem;
}

.alert {
  border-radius: 0.5rem;
  border: none;
}
.alert.alert-info {
  background-color: #d1ecf1;
  color: #0c5460;
}
.alert.alert-warning {
  background-color: #fff3cd;
  color: #856404;
}
.alert.alert-success {
  background-color: #d4edda;
  color: #155724;
}
.alert.alert-danger {
  background-color: #f8d7da;
  color: #721c24;
}

.form-control, .form-select {
  border-radius: 0.375rem;
  border: 1px solid #ced4da;
}
.form-control:focus, .form-select:focus {
  border-color: #80bdff;
  box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
}

.form-check .form-check-input:checked {
  background-color: #007bff;
  border-color: #007bff;
}
.form-check .form-check-input:focus {
  box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
}

.input-group .input-group-text {
  background-color: #e9ecef;
  border-color: #ced4da;
  color: #495057;
}
.input-group.person-filter-group .form-control {
  border-right: 0;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}
.input-group.person-filter-group .btn {
  border-left: 0;
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}
.input-group.person-filter-group .btn:hover {
  background-color: #e9ecef;
  border-color: #ced4da;
}

.badge {
  padding: 0.375rem 0.75rem;
  border-radius: 0.375rem;
}
.badge.bg-primary {
  background-color: #007bff !important;
}
.badge.bg-secondary {
  background-color: #6c757d !important;
}

@media (max-width: 768px) {
  .step-indicator {
    flex-direction: column;
    gap: 1rem;
  }
  .step-indicator .step:not(:last-child)::after {
    display: none;
  }
  .step-content {
    min-height: 300px;
  }
  .modal-dialog {
    margin: 0.5rem;
    max-width: calc(100vw - 1rem);
  }
  .btn-group {
    flex-direction: column;
  }
  .btn-group .btn {
    margin-bottom: 0.5rem;
  }
}
.modal.fade.show {
  background-color: rgba(0, 0, 0, 0.5);
}
.modal.fade.show .modal-dialog {
  transform: none;
}

.swap-modal .modal-body p {
  margin-bottom: 1rem;
}
.swap-modal .modal-body p strong {
  color: #495057;
  font-weight: 600;
}
.swap-modal .form-select {
  margin-bottom: 1rem;
}

.confirmation-resend-modal .modal-body .alert-info {
  background-color: #d1ecf1;
  border-color: #bee5eb;
  color: #0c5460;
}
.confirmation-resend-modal .modal-body .alert-info strong {
  color: #0c5460;
}
.confirmation-resend-modal .modal-body .card {
  border: 1px solid #e9ecef;
  border-radius: 0.5rem;
}
.confirmation-resend-modal .modal-body .card .card-header {
  background-color: #f8f9fa;
  border-bottom: 1px solid #e9ecef;
  font-weight: 600;
  color: #495057;
}
.confirmation-resend-modal .modal-body .form-check {
  margin-bottom: 1rem;
}
.confirmation-resend-modal .modal-body .form-check .form-check-input:checked {
  background-color: #007bff;
  border-color: #007bff;
}
.confirmation-resend-modal .modal-body .form-control {
  border-radius: 0.375rem;
  border: 1px solid #ced4da;
}
.confirmation-resend-modal .modal-body .form-control:focus {
  border-color: #80bdff;
  box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
}

.booking-cancellation-modal .modal-body .alert-warning {
  background-color: #fff3cd;
  border-color: #ffeaa7;
  color: #856404;
}
.booking-cancellation-modal .modal-body .alert-warning strong {
  color: #856404;
}
.booking-cancellation-modal .modal-body .alert-info {
  background-color: #d1ecf1;
  border-color: #bee5eb;
  color: #0c5460;
}
.booking-cancellation-modal .modal-body .alert-info strong {
  color: #0c5460;
}
.booking-cancellation-modal .modal-body .alert-success {
  background-color: #d4edda;
  border-color: #c3e6cb;
  color: #155724;
}
.booking-cancellation-modal .modal-body .alert-success strong {
  color: #155724;
}
.booking-cancellation-modal .modal-body .card {
  border: 1px solid #e9ecef;
  border-radius: 0.5rem;
  margin-bottom: 1rem;
}
.booking-cancellation-modal .modal-body .card .card-header {
  background-color: #f8f9fa;
  border-bottom: 1px solid #e9ecef;
  font-weight: 600;
  color: #495057;
}
.booking-cancellation-modal .modal-body .card .card-body {
  padding: 1.25rem;
}
.booking-cancellation-modal .modal-body .form-check {
  margin-bottom: 1rem;
}
.booking-cancellation-modal .modal-body .form-check .form-check-input:checked {
  background-color: #007bff;
  border-color: #007bff;
}
.booking-cancellation-modal .modal-body .form-control, .booking-cancellation-modal .modal-body .form-select {
  border-radius: 0.375rem;
  border: 1px solid #ced4da;
}
.booking-cancellation-modal .modal-body .form-control:focus, .booking-cancellation-modal .modal-body .form-select:focus {
  border-color: #80bdff;
  box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
}
.booking-cancellation-modal .modal-body .input-group .input-group-text {
  background-color: #e9ecef;
  border-color: #ced4da;
  color: #495057;
}
.booking-cancellation-modal .modal-body .table th, .booking-cancellation-modal .modal-body .table td {
  padding: 0.75rem 0.5rem;
  vertical-align: middle;
}
.booking-cancellation-modal .modal-body .table .form-check {
  margin-bottom: 0;
}

.loading {
  opacity: 0.6;
  pointer-events: none;
}

.step-content {
  animation: fadeIn 0.3s ease-in-out;
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
/* Person avatar styles */
.person-initials-avatar {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
  font-weight: bold;
  font-size: 1.5rem;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}

.person-initials-avatar-sm {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
  font-weight: bold;
  font-size: 0.875rem;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}

.person-profile-avatar {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  object-fit: cover;
}

/* Invoice icon avatar for dashboard */
.invoice-icon-avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #ffc107;
  color: #212529;
  font-size: 1rem;
}

/* Students summary card avatar styles */
.avatar-sm {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
  font-weight: 600;
  font-size: 0.75rem;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}

.avatar-title {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Manager badge styles for schedule table */
.manager-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  border-radius: 3px;
  color: white;
  font-weight: 600;
  font-size: 1.1rem;
  min-width: 26px;
  padding: 0;
}

.report-card {
  border: 1px solid transparent;
  min-height: 200px;
}

.table-migrated {
  background-color: #d1ecf1 !important;
}
.table-migrated td {
  background-color: #d1ecf1 !important;
}
.table-migrated:hover {
  background-color: #bee5eb !important;
}
.table-migrated:hover td {
  background-color: #bee5eb !important;
}

.legacy-task-migrated {
  background-color: #d1ecf1 !important;
}
.legacy-task-migrated:hover {
  background-color: #bee5eb !important;
}

.legacy-task-highlighted {
  background-color: #d4edda !important;
}
.legacy-task-highlighted:hover {
  background-color: #c3e6cb !important;
}

@media (max-width: 768px) {
  .report-card {
    min-height: 180px;
  }
}
.collapsible-card .collapsible-card-title {
  cursor: pointer;
  user-select: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 0;
  transition: color 0.2s ease;
  flex: 1;
}
.collapsible-card .collapsible-card-title .collapsible-icon {
  transition: transform 0.3s ease;
  font-size: 0.875rem;
  color: var(--bs-secondary);
  transform: rotate(-90deg);
  margin-left: auto;
  flex-shrink: 0;
}
.collapsible-card .collapsible-card-title.expanded .collapsible-icon {
  transform: rotate(0deg);
}
.collapsible-card .collapsible-content {
  overflow: hidden;
  transition: max-height 0.3s ease, opacity 0.3s ease;
  max-height: 0;
  opacity: 0;
}
.collapsible-card .collapsible-content.expanded {
  max-height: none;
  opacity: 1;
  padding-top: 20px;
}

.btn-group.btn-group-sm .btn.btn-primary {
  border-radius: 6px;
}
.btn-group.btn-group-sm .btn.btn-outline-primary {
  border-radius: 6px;
}
.btn-group.btn-group-sm .btn:first-child {
  border-top-left-radius: 6px;
  border-bottom-left-radius: 6px;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}
.btn-group.btn-group-sm .btn:last-child {
  border-top-right-radius: 6px;
  border-bottom-right-radius: 6px;
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}
.btn-group.btn-group-sm .btn:only-child {
  border-radius: 6px;
}

.private-booking-modal .step-section {
  border: 1px solid #e9ecef;
  border-radius: 0.5rem;
  padding: 1.5rem;
  margin-bottom: 1.5rem;
  background: #f8f9fa;
}
.private-booking-modal .step-section .step-title {
  display: flex;
  align-items: center;
  margin-bottom: 1rem;
  font-weight: 600;
  color: #495057;
}
.private-booking-modal .step-section .step-title .step-number {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  background: #0d6efd;
  color: white;
  border-radius: 50%;
  font-size: 0.875rem;
  font-weight: 600;
  margin-right: 0.75rem;
}
.private-booking-modal .student-card {
  transition: all 0.2s ease;
  border: 2px solid #e9ecef;
  cursor: pointer;
}
.private-booking-modal .student-card:hover {
  border-color: #0d6efd;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}
.private-booking-modal .student-card.selected {
  border-color: #0d6efd;
  background: linear-gradient(135deg, rgba(13, 110, 253, 0.05) 0%, rgba(13, 110, 253, 0.1) 100%);
}
.private-booking-modal .student-card .form-check {
  margin-bottom: 0;
}
.private-booking-modal .student-card .form-check .form-check-input {
  margin-top: 0.25rem;
}
.private-booking-modal .student-card .form-check .form-check-label {
  cursor: pointer;
  width: 100%;
}
.private-booking-modal .student-card .avatar-sm {
  width: 2.5rem;
  height: 2.5rem;
  background: #0d6efd;
  color: white;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1rem;
}
.private-booking-modal .modal-dialog {
  max-width: 1200px;
}
.private-booking-modal .modal-body {
  max-height: 70vh;
  overflow-y: auto;
}
.private-booking-modal .step-indicator {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 2rem;
  position: relative;
}
.private-booking-modal .step-indicator::before {
  content: "";
  position: absolute;
  top: 1rem;
  left: 2rem;
  right: 2rem;
  height: 2px;
  background: #e9ecef;
  z-index: 1;
}
.private-booking-modal .step-indicator .step {
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
  z-index: 2;
}
.private-booking-modal .step-indicator .step .step-number {
  width: 2rem;
  height: 2rem;
  border-radius: 50%;
  background: #e9ecef;
  color: #6c757d;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 600;
  font-size: 0.875rem;
  margin-bottom: 0.5rem;
}
.private-booking-modal .step-indicator .step .step-label {
  font-size: 0.875rem;
  color: #6c757d;
  text-align: center;
  max-width: 120px;
}
.private-booking-modal .step-indicator .step.active .step-number {
  background: #0d6efd;
  color: white;
}
.private-booking-modal .step-indicator .step.active .step-label {
  color: #0d6efd;
  font-weight: 600;
}
.private-booking-modal .form-label {
  font-weight: 600;
  color: #495057;
  margin-bottom: 0.5rem;
}
.private-booking-modal .form-select,
.private-booking-modal .form-control {
  border: 1px solid #ced4da;
  border-radius: 0.375rem;
}
.private-booking-modal .form-select:focus,
.private-booking-modal .form-control:focus {
  border-color: #0d6efd;
  box-shadow: 0 0 0 0.2rem rgba(13, 110, 253, 0.25);
}
.private-booking-modal .alert {
  border-radius: 0.5rem;
  border: none;
}
.private-booking-modal .alert.alert-success {
  background: linear-gradient(135deg, rgba(25, 135, 84, 0.1) 0%, rgba(25, 135, 84, 0.05) 100%);
  color: #0f5132;
  border-left: 4px solid #198754;
}
.private-booking-modal .alert.alert-info {
  background: linear-gradient(135deg, rgba(13, 202, 240, 0.1) 0%, rgba(13, 202, 240, 0.05) 100%);
  color: #055160;
  border-left: 4px solid #0dcaf0;
}
.private-booking-modal .alert.alert-warning {
  background: linear-gradient(135deg, rgba(255, 193, 7, 0.1) 0%, rgba(255, 193, 7, 0.05) 100%);
  color: #664d03;
  border-left: 4px solid #ffc107;
}
.private-booking-modal .btn {
  border-radius: 0.375rem;
  font-weight: 500;
  padding: 0.5rem 1rem;
}
.private-booking-modal .btn.btn-primary {
  background: linear-gradient(135deg, #0d6efd 0%, #0b5ed7 100%);
  border: none;
}
.private-booking-modal .btn.btn-primary:hover {
  background: linear-gradient(135deg, #0b5ed7 0%, #0a58ca 100%);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(13, 110, 253, 0.3);
}
.private-booking-modal .btn.btn-outline-primary {
  border-color: #0d6efd;
  color: #0d6efd;
}
.private-booking-modal .btn.btn-outline-primary:hover {
  background: #0d6efd;
  border-color: #0d6efd;
  transform: translateY(-1px);
}
.private-booking-modal .btn.btn-outline-secondary {
  border-color: #6c757d;
  color: #6c757d;
}
.private-booking-modal .btn.btn-outline-secondary:hover {
  background: #6c757d;
  border-color: #6c757d;
  transform: translateY(-1px);
}
.private-booking-modal .spinner-border {
  width: 2rem;
  height: 2rem;
  border-width: 0.2rem;
}
@media (max-width: 768px) {
  .private-booking-modal .modal-dialog {
    margin: 0.5rem;
    max-width: calc(100% - 1rem);
  }
  .private-booking-modal .step-section {
    padding: 1rem;
  }
  .private-booking-modal .student-card {
    margin-bottom: 1rem;
  }
  .private-booking-modal .step-indicator .step .step-label {
    font-size: 0.75rem;
    max-width: 80px;
  }
}

.delivery-tasks-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1rem;
  margin-top: 1rem;
}

.session-delivery-tasks {
  border: 1px solid #e9ecef;
  border-radius: 8px;
  padding: 1rem;
  background-color: #f8f9fa;
  width: 100%;
}
.session-delivery-tasks .session-header {
  border-bottom: 1px solid #dee2e6;
  padding-bottom: 0.75rem;
}
.session-delivery-tasks .session-header h5 {
  color: #495057;
  font-weight: 600;
}
.session-delivery-tasks .delivery-tasks-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.75rem;
  margin-top: 0.75rem;
}

.delivery-task-item {
  background: white;
  border: 1px solid #e9ecef;
  border-radius: 6px;
  padding: 0.75rem;
  transition: all 0.2s ease;
  width: 100%;
  min-height: 80px;
}
.delivery-task-item:hover {
  border-color: #007bff;
  box-shadow: 0 2px 4px rgba(0, 123, 255, 0.1);
}
.delivery-task-item.completed {
  background-color: #d4edda;
  border-color: #c3e6cb;
}
.delivery-task-item.completed .task-name {
  text-decoration: line-through;
  color: #6c757d;
}
.delivery-task-item.urgent {
  border-color: #dc3545;
  background-color: #fff5f5;
}
.delivery-task-item.urgent .urgent-text {
  color: #dc3545;
  font-weight: 600;
}
.delivery-task-item .form-check {
  margin: 0;
}
.delivery-task-item .form-check .form-check-input {
  margin-top: 0.25rem;
  transform: scale(1.1);
}
.delivery-task-item .form-check .form-check-input:checked {
  background-color: #28a745;
  border-color: #28a745;
}
.delivery-task-item .form-check .form-check-label {
  cursor: pointer;
}
.delivery-task-item .form-check .form-check-label .task-name {
  font-weight: 500;
  color: #495057;
  display: block;
  margin-bottom: 0.25rem;
}
.delivery-task-item .form-check .form-check-label .task-expense-info {
  margin: 0.25rem 0;
}
.delivery-task-item .form-check .form-check-label .task-expense-info small {
  font-size: 1.1rem;
  color: #0d6efd;
  font-weight: 500;
  font-style: italic;
}
.delivery-task-item .form-check .form-check-label .task-completion-info {
  margin-top: 0.5rem;
}
.delivery-task-item .form-check .form-check-label .task-completion-info span {
  font-size: 1.3rem;
  font-weight: 500;
}
.delivery-task-item .form-check .form-check-label .task-notes {
  margin-top: 0.75rem;
}
.delivery-task-item .form-check .form-check-label .task-notes .form-label {
  font-size: 1.3rem;
  font-weight: 500;
  margin-bottom: 0.25rem;
  display: block;
}
.delivery-task-item .form-check .form-check-label .task-notes textarea {
  font-size: 1.3rem;
  resize: vertical;
  min-height: 60px;
}

@media (max-width: 1200px) {
  .session-delivery-tasks .delivery-tasks-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 768px) {
  .delivery-tasks-grid {
    grid-template-columns: 1fr;
    gap: 0.75rem;
  }
  .session-delivery-tasks {
    padding: 0.75rem;
  }
  .session-delivery-tasks .session-header h5 {
    font-size: 1rem;
  }
  .session-delivery-tasks .delivery-tasks-grid {
    grid-template-columns: 1fr;
  }
  .delivery-task-item {
    padding: 0.5rem;
  }
}
.course-pack-list {
  display: flex;
  flex-direction: column;
  width: 100%;
}
.course-pack-list .small {
  display: flex;
  flex-direction: column;
  width: 100%;
}
.course-pack-list .form-check {
  display: flex;
  flex-direction: row;
  align-items: center;
  width: 100%;
  margin-bottom: 0.5rem !important;
  min-height: 30px;
}
.course-pack-list .form-check:last-child {
  margin-bottom: 0 !important;
}
.course-pack-list .form-check .form-check-input {
  flex-shrink: 0;
  margin-top: 0;
  margin-right: 0.5rem;
}
.course-pack-list .form-check .form-check-label {
  flex: 1;
  display: flex;
  align-items: center;
  margin: 0;
  cursor: pointer;
}
.course-pack-list .form-check .form-check-label i {
  margin-right: 0.5rem;
}

.notification-card {
  background: #f8f9fa;
  border: 1px solid #e9ecef;
  border-radius: 8px;
  padding: 1.25rem;
  transition: all 0.2s ease;
}
.notification-card:hover {
  background: #ffffff;
  border-color: #dee2e6;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
.notification-card.due {
  border-color: #dc3545;
  background-color: #fff5f5;
}
.notification-card .notification-status {
  min-height: 2.5rem;
  display: flex;
  align-items: center;
}
.notification-card .notification-status .fas {
  font-size: 1.15rem;
}
.notification-card .notification-status span {
  font-size: 1.1rem;
  line-height: 1.5;
  font-weight: 500;
}
.notification-card h6 {
  font-size: 1.25rem;
  font-weight: 600;
  margin-bottom: 0.75rem;
}
.notification-card .btn {
  font-size: 1rem;
  padding: 0.5rem 1rem;
  white-space: nowrap;
  font-weight: 500;
}

.card .card-header {
  border-bottom: 1px solid #dee2e6;
}
.card .card-header .card-title {
  font-size: 1.3rem;
}
.card .card-header .text-muted {
  font-size: 1rem;
}
.card .card-body {
  padding: 1.25rem;
}

@media (max-width: 768px) {
  .notification-card {
    margin-bottom: 1rem;
    padding: 1rem;
  }
  .notification-card .d-flex.justify-content-between {
    flex-direction: column;
    align-items: flex-start !important;
    gap: 0.75rem;
  }
  .notification-card .btn {
    align-self: flex-end;
    font-size: 1rem;
    padding: 0.6rem 1.2rem;
  }
  .notification-card h6 {
    font-size: 1.15rem;
  }
  .notification-card .notification-status span {
    font-size: 1.05rem;
  }
}
.welcome-card {
  background: #130E70;
  color: white;
}
.welcome-card h3, .welcome-card h5, .welcome-card h6, .welcome-card p {
  color: white;
}
.welcome-card .text-muted {
  color: rgba(255, 255, 255, 0.8) !important;
}
.welcome-card .welcome-icon {
  font-size: 3rem;
  opacity: 0.9;
  animation: float 3s ease-in-out infinite;
  color: #3BE2E2;
}
.welcome-card .welcome-content .info-box {
  background: rgba(59, 226, 226, 0.15);
  border-radius: 12px;
  padding: 1rem;
  backdrop-filter: blur(10px);
  border: 1px solid rgba(59, 226, 226, 0.3);
}
.welcome-card .welcome-content .info-box h5 {
  font-size: 1.1rem;
  margin-bottom: 0.75rem;
}
.welcome-card .welcome-content .info-box .badge {
  background-color: #3BE2E2 !important;
  color: #130E70;
  font-weight: 600;
}
.welcome-card .welcome-content .encouragement-box {
  background: rgba(219, 253, 87, 0.15);
  border-left: 4px solid #DBFD57;
  padding: 0.75rem 1rem;
  border-radius: 4px;
  font-style: italic;
}
.welcome-card .welcome-content .contact-box {
  background: rgba(248, 202, 248, 0.15);
  border-radius: 12px;
  padding: 1rem;
  backdrop-filter: blur(10px);
  border: 1px solid rgba(248, 202, 248, 0.3);
}
.welcome-card .welcome-content .contact-box h6 {
  margin-bottom: 0.5rem;
  font-weight: 600;
}
.welcome-card .welcome-content .contact-box .contact-link {
  color: #130E70;
  background: #3BE2E2;
  text-decoration: none;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  padding: 0.5rem 1rem;
  border-radius: 6px;
  margin-top: 0.5rem;
  transition: all 0.3s ease;
}
.welcome-card .welcome-content .contact-box .contact-link:hover {
  background: #DBFD57;
  color: #130E70;
  transform: translateX(3px);
}

@keyframes float {
  0%, 100% {
    transform: translateY(0px);
  }
  50% {
    transform: translateY(-10px);
  }
}
.latest-updates-card .updates-list {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.latest-updates-card .updates-list .update-item {
  display: flex;
  gap: 1rem;
  padding: 1rem;
  border-radius: 10px;
  background: #f8f9fa;
  border-left: 4px solid #6c757d;
  transition: all 0.3s ease;
}
.latest-updates-card .updates-list .update-item:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
  transform: translateX(3px);
}
.latest-updates-card .updates-list .update-item .update-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  font-size: 1.2rem;
  flex-shrink: 0;
}
.latest-updates-card .updates-list .update-item .update-content {
  flex-grow: 1;
}
.latest-updates-card .updates-list .update-item .update-content h6 {
  font-weight: 600;
  margin-bottom: 0.25rem;
}
.latest-updates-card .updates-list .update-item .update-content p {
  color: #6c757d;
  line-height: 1.5;
}
.latest-updates-card .updates-list .update-item.update-feature {
  border-left-color: #DBFD57;
}
.latest-updates-card .updates-list .update-item.update-feature .update-icon {
  background: rgba(219, 253, 87, 0.2);
  color: #130E70;
}
.latest-updates-card .updates-list .update-item.update-enhancement {
  border-left-color: #3BE2E2;
}
.latest-updates-card .updates-list .update-item.update-enhancement .update-icon {
  background: rgba(59, 226, 226, 0.2);
  color: #130E70;
}
.latest-updates-card .updates-list .update-item.update-bugfix {
  border-left-color: #B54229;
}
.latest-updates-card .updates-list .update-item.update-bugfix .update-icon {
  background: rgba(181, 66, 41, 0.15);
  color: #B54229;
}
.latest-updates-card .updates-list .update-item.update-deployment {
  border-left-color: #A93DE2;
}
.latest-updates-card .updates-list .update-item.update-deployment .update-icon {
  background: rgba(169, 61, 226, 0.15);
  color: #A93DE2;
}

.feedback-card {
  border: 2px solid #E0E5F2;
}
.feedback-card h4 {
  color: #130E70;
}
.feedback-card textarea.form-control {
  resize: vertical;
  min-height: 120px;
  border: 2px solid #E0E5F2;
  border-radius: 8px;
}
.feedback-card textarea.form-control:focus {
  border-color: #3BE2E2;
  box-shadow: 0 0 0 0.2rem rgba(59, 226, 226, 0.15);
}
.feedback-card .btn-primary {
  background: #130E70;
  border: none;
  color: white;
  padding: 0.5rem 1.5rem;
  font-weight: 500;
  transition: all 0.3s ease;
}
.feedback-card .btn-primary:hover:not(:disabled) {
  background: #3BE2E2;
  color: #130E70;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(59, 226, 226, 0.4);
}
.feedback-card .btn-primary:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}
.feedback-card .btn-outline-primary {
  border-color: #130E70;
  color: #130E70;
}
.feedback-card .btn-outline-primary:hover {
  background: #130E70;
  color: white;
}
.feedback-card .alert-success {
  background: rgba(59, 226, 226, 0.1);
  border: 1px solid rgba(59, 226, 226, 0.3);
  color: #130E70;
  border-radius: 8px;
}

.dashboard-metrics .metric-card {
  background: white;
  border-radius: 12px;
  padding: 1.5rem;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
  height: 100%;
  display: flex;
  flex-direction: column;
}
.dashboard-metrics .metric-card .metric-header {
  margin-bottom: 1rem;
}
.dashboard-metrics .metric-card .metric-header .metric-month {
  color: rgb(0, 184, 148);
  font-size: 0.9rem;
  font-weight: 500;
}
.dashboard-metrics .metric-card .metric-content {
  flex-grow: 1;
  display: flex;
  flex-direction: column;
}
.dashboard-metrics .metric-card .metric-content .metric-value {
  font-size: 2.5rem;
  font-weight: 700;
  line-height: 1.2;
  margin-bottom: 0.5rem;
}
.dashboard-metrics .metric-card .metric-content .metric-value.metric-value-magenta {
  color: rgb(255, 0, 128);
}
.dashboard-metrics .metric-card .metric-content .metric-value.metric-value-teal {
  color: rgb(0, 184, 148);
}
.dashboard-metrics .metric-card .metric-content .metric-label {
  color: #6c757d;
  font-size: 0.9rem;
  font-weight: 500;
  margin-bottom: 1rem;
  line-height: 1.3;
}
.dashboard-metrics .metric-card .metric-content .metric-chart {
  flex-grow: 1;
  position: relative;
  height: 120px;
  margin-top: auto;
  padding: 0.5rem;
}
.dashboard-metrics .metric-card .metric-content .metric-chart canvas {
  max-height: 100%;
}
@media (max-width: 768px) {
  .dashboard-metrics .metric-card {
    margin-bottom: 1rem;
  }
  .dashboard-metrics .metric-card .metric-content .metric-value {
    font-size: 2rem;
  }
  .dashboard-metrics .metric-card .metric-content .metric-chart {
    height: 100px;
  }
}

.status-display {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 4px 8px;
  border: 1px solid #dee2e6;
  border-radius: 8px;
  width: fit-content;
}

.status-indicator {
  display: inline-block;
  width: 12px;
  height: 12px;
  border-radius: 3px;
  flex-shrink: 0;
}

.status-text {
  font-size: 1rem;
  color: #212529;
  white-space: nowrap;
  font-weight: 500;
}

.status-indicator.status-overdue {
  background-color: #dc3545 !important;
}

.status-indicator.status-in-progress {
  background-color: #0d6efd !important;
}

.status-indicator.status-overdue-in-progress {
  background: linear-gradient(135deg, rgb(220, 53, 69) 50%, rgb(13, 110, 253) 50%) !important;
}

.status-indicator.status-complete {
  background-color: #198754 !important;
}

.status-indicator.status-to-do {
  background-color: #ffc107 !important;
}

.status-indicator.status-inactive {
  background-color: #6c757d !important;
}

.status-indicator.status-upcoming {
  background-color: #17a2b8 !important;
}

.status-indicator.status-private {
  background-color: #8B1538 !important;
}

.dual-status-display {
  display: flex;
  align-items: center;
  gap: 0;
  padding: 0;
  border: 1px solid #dee2e6;
  border-radius: 8px;
  width: fit-content;
  overflow: hidden;
}

.dual-status-box {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  background-color: #f8f9fa;
}
.dual-status-box .status-indicator {
  width: 10px;
  height: 10px;
  border-radius: 2px;
  flex-shrink: 0;
}
.dual-status-box .status-text {
  font-size: 0.875rem;
  color: #212529;
  white-space: nowrap;
  font-weight: 500;
}
.dual-status-box.status-to-do {
  background-color: rgba(255, 193, 7, 0.15) !important;
}
.dual-status-box.status-to-do .status-indicator.status-to-do {
  background-color: #ffc107 !important;
}
.dual-status-box.status-private {
  background-color: rgba(139, 21, 56, 0.15) !important;
}
.dual-status-box.status-private .status-indicator.status-private {
  background-color: #8B1538 !important;
}
.dual-status-box.status-in-progress {
  background-color: rgba(13, 110, 253, 0.15) !important;
}
.dual-status-box.status-in-progress .status-indicator.status-in-progress {
  background-color: #0d6efd !important;
}

.dual-status-separator {
  padding: 0 4px;
  color: #6c757d;
  font-weight: 500;
  font-size: 0.875rem;
}

.sold-out-badge {
  background-color: #dc3545 !important;
  color: white !important;
  font-size: 0.7rem;
  font-weight: 700;
  padding: 0.25rem 0.5rem;
  border-radius: 0.25rem;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  display: inline-block;
  vertical-align: middle;
}

.clickable-row:hover {
  transform: translateY(-1px);
  transition: all 0.2s ease;
}

.attendance-matrix {
  border: none;
  width: 100%;
  min-width: max-content;
}
.attendance-matrix thead th {
  border: none;
  background-color: #f8f9fa;
  white-space: nowrap;
}
.attendance-matrix thead th.sticky-column {
  min-width: 200px;
  position: sticky;
  left: 0;
  z-index: 10;
  box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.1);
}
.attendance-matrix thead th:not(.sticky-column) {
  min-width: 50px;
  width: 50px;
  max-width: 50px;
  height: 150px;
  vertical-align: bottom;
  padding: 0.5rem;
  position: relative;
  border-right: 1px solid #dee2e6;
}
.attendance-matrix thead th:not(.sticky-column) > div {
  transform: rotate(-90deg);
  transform-origin: center;
  white-space: normal;
  word-wrap: break-word;
  position: absolute;
  left: 50%;
  top: 50%;
  margin-left: -50px;
  margin-top: -22.5px;
  width: 45px;
  height: 100px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  line-height: 1.2;
}
.attendance-matrix tbody td {
  border: none;
  white-space: nowrap;
}
.attendance-matrix tbody td.sticky-column {
  position: sticky;
  left: 0;
  z-index: 9;
  font-weight: 500;
  box-shadow: 2px 0 4px rgba(0, 0, 0, 0.1);
}
.attendance-matrix tbody td:not(.sticky-column) {
  height: 50px;
  width: 50px;
  min-width: 50px;
  max-width: 50px;
  text-align: center;
  border-right: 1px solid #dee2e6;
}

.attendance-matrix-wrapper {
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.attendance-matrix-wrapper::-webkit-scrollbar {
  height: 8px;
}
.attendance-matrix-wrapper::-webkit-scrollbar-track {
  background: #f1f1f1;
  border-radius: 4px;
}
.attendance-matrix-wrapper::-webkit-scrollbar-thumb {
  background: #888;
  border-radius: 4px;
}
.attendance-matrix-wrapper::-webkit-scrollbar-thumb:hover {
  background: #555;
}

.table-striped > tbody > tr:nth-of-type(even) > .sticky-column {
  background-color: #f8f9fa;
}

.table-striped > tbody > tr:nth-of-type(odd) > .sticky-column {
  background-color: white;
}

.attendance-not-attended {
  opacity: 0.3;
}

.completion-tasks {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.completion-task {
  display: flex;
  align-items: center;
  padding: 0.75rem;
  border-radius: 0.5rem;
  background-color: #f8f9fa;
  border: 1px solid #dee2e6;
  transition: all 0.3s ease;
}
.completion-task.completed {
  background-color: #d1edff;
  border-color: #0d6efd;
}

.task-icon {
  margin-right: 1rem;
  font-size: 1.25rem;
}

.task-content {
  flex: 1;
}

.task-title {
  font-weight: 600;
  margin-bottom: 0.25rem;
}

.task-description {
  font-size: 0.875rem;
  color: #6c757d;
}

.summary-items {
  list-style: none;
  padding: 0;
  margin: 0;
}

.summary-item {
  display: flex;
  align-items: center;
  margin-bottom: 0.75rem;
  font-size: 0.9rem;
  line-height: 1.4;
}
.summary-item:last-child {
  margin-bottom: 0;
}
.summary-item i {
  font-size: 1rem;
  width: 16px;
  text-align: center;
}

:root {
  --primary-color: #130E70;
  --primary-light: #AFE3E3;
  --secondary-color: #3BE2E2;
  --secondary-light: #A93DE2;
  --bs-light: #F4F7FE;
  --pink: #F8CAF8;
  --lavender: #A93DE2;
  --lime: #DBFD57;
  --bs-border-radius: 6px;
  --bs-border-radius-sm: 6px;
  --bs-border-radius-lg: 6px;
  --bs-border-radius-xl: 6px;
  --bs-border-radius-xxl: 6px;
  --bs-border-radius-2xl: 6px;
  --refresh-bg: #fde68a;
  --pay-bg: #aecdef;
  --cancel-bg: #fca5a5;
  --action-positive: #99dd9d;
  --action-neutral: #fde68a;
  --action-negative: #fca5a5;
  --status-cancelled: #fca5a5;
  --status-paid: #99dd9d;
}

.nav {
  --bs-nav-link-color: $primary;
}

.nav-link:hover {
  color: #130E70;
}

.text-primary {
  color: #130E70 !important;
}

.colourwhite {
  color: #FFFFFF;
}

.bg-light-primary {
  background-color: rgba(19, 14, 112, 0.1) !important;
}

.bg-primary {
  background: #130E70 !important;
}

.bg-lime {
  background: #DBFD57;
}

.bg-pink {
  background: #F8CAF8;
}

.bg-draft {
  background-color: #8dc0f7;
}

.bg-proposed {
  background-color: #d2aaf3;
}

.bg-secondary {
  background: #3BE2E2 !important;
}

.bg-save-green {
  background: #2fba8c !important;
}

.btn-refresh {
  background-color: var(--refresh-bg) !important;
  border-color: var(--refresh-bg) !important;
  color: #000 !important;
  border-radius: var(--bs-border-radius) !important;
}

.btn-pay {
  background-color: var(--pay-bg) !important;
  border-color: var(--pay-bg) !important;
  color: #ffffff !important;
  border-radius: var(--bs-border-radius) !important;
}

.btn-cancel {
  background-color: var(--cancel-bg) !important;
  border-color: var(--cancel-bg) !important;
  color: #000 !important;
  border-radius: var(--bs-border-radius) !important;
}

.btn-action-positive {
  background-color: var(--action-positive) !important;
  border-color: var(--action-positive) !important;
  color: #000 !important;
  border-radius: var(--bs-border-radius) !important;
}
.btn-action-positive:hover {
  background-color: transparent !important;
  border-color: var(--action-positive) !important;
  color: var(--action-positive) !important;
}

.btn-action-neutral {
  background-color: var(--action-neutral) !important;
  border-color: var(--action-neutral) !important;
  color: #000 !important;
  border-radius: var(--bs-border-radius) !important;
}
.btn-action-neutral:hover {
  background-color: transparent !important;
  border-color: var(--action-neutral) !important;
  color: var(--action-neutral) !important;
}

.btn-action-negative {
  background-color: var(--action-negative) !important;
  border-color: var(--action-negative) !important;
  color: #000 !important;
  border-radius: var(--bs-border-radius) !important;
}
.btn-action-negative:hover {
  background-color: transparent !important;
  border-color: var(--action-negative) !important;
  color: var(--action-negative) !important;
}

.btn-outline-action-positive {
  background-color: transparent !important;
  border-color: var(--action-positive) !important;
  color: var(--action-positive) !important;
  border-radius: var(--bs-border-radius) !important;
}
.btn-outline-action-positive:hover {
  background-color: var(--action-positive) !important;
  border-color: var(--action-positive) !important;
  color: #000 !important;
}

.btn-outline-action-negative {
  background-color: transparent !important;
  border-color: var(--action-negative) !important;
  color: var(--action-negative) !important;
  border-radius: var(--bs-border-radius) !important;
}
.btn-outline-action-negative:hover {
  background-color: var(--action-negative) !important;
  border-color: var(--action-negative) !important;
  color: #000 !important;
}

.btn-sm.btn-action-positive {
  background-color: var(--action-positive) !important;
  border-color: var(--action-positive) !important;
  color: #000 !important;
  border-radius: var(--bs-border-radius) !important;
}

.btn-sm.btn-action-neutral {
  background-color: var(--action-neutral) !important;
  border-color: var(--action-neutral) !important;
  color: #000 !important;
  border-radius: var(--bs-border-radius) !important;
}

.btn-group .btn-pay:not(:first-child):not(:last-child),
.btn-group .btn-cancel:not(:first-child):not(:last-child),
.btn-group .btn-action-positive:not(:first-child):not(:last-child),
.btn-group .btn-action-neutral:not(:first-child):not(:last-child),
.btn-group .btn:not(:first-child):not(:last-child) {
  border-radius: 0 !important;
}
.btn-group .btn-pay:first-child:not(:last-child),
.btn-group .btn-cancel:first-child:not(:last-child),
.btn-group .btn-action-positive:first-child:not(:last-child),
.btn-group .btn-action-neutral:first-child:not(:last-child),
.btn-group .btn:first-child:not(:last-child) {
  border-top-right-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}
.btn-group .btn-pay:last-child:not(:first-child),
.btn-group .btn-cancel:last-child:not(:first-child),
.btn-group .btn-action-positive:last-child:not(:first-child),
.btn-group .btn-action-neutral:last-child:not(:first-child),
.btn-group .btn:last-child:not(:first-child) {
  border-top-left-radius: 0 !important;
  border-bottom-left-radius: 0 !important;
}

.cpd-certificate-buttons .btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.btn-group.w-100 {
  display: flex;
}
.btn-group.w-100 .btn {
  border-radius: 0;
  border-left: none;
  flex: 1;
}
.btn-group.w-100 .btn:first-child {
  border-left: 1px solid #dee2e6;
  border-top-left-radius: 0.375rem;
  border-bottom-left-radius: 0.375rem;
}
.btn-group.w-100 .btn:last-child {
  border-top-right-radius: 0.375rem;
  border-bottom-right-radius: 0.375rem;
}
.btn-group.w-100 .btn.btn-secondary {
  background-color: #6c757d;
  border-color: #6c757d;
  color: white;
}
.btn-group.w-100 .btn.btn-outline-secondary:hover {
  background-color: #f8f9fa;
  color: #6c757d;
}

.form-control.is-invalid {
  border-color: #dc3545;
  box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.25);
}
.form-control.is-invalid:focus {
  border-color: #dc3545;
  box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.25);
}

.text-danger.small {
  font-size: 0.875em;
  margin-top: 0.25rem;
}

.form-text.text-muted {
  font-size: 0.875em;
  color: #6c757d !important;
}

.alert.alert-info {
  background-color: #d1ecf1;
  border-color: #bee5eb;
  color: #0c5460;
  border-radius: 0.375rem;
  padding: 0.75rem 1rem;
}
.alert.alert-info ul {
  padding-left: 1.25rem;
}
.alert.alert-info li {
  margin-bottom: 0.25rem;
}
.alert.alert-info li:last-child {
  margin-bottom: 0;
}

.toast-container {
  z-index: 9999 !important;
}

.toast {
  z-index: 10000 !important;
}

.modal-backdrop {
  z-index: 1040;
}

.modal {
  z-index: 1050;
}

.notification-row {
  background-color: #f8f9fa;
  border-top: 1px solid #e9ecef;
  border-bottom: 1px solid #e9ecef;
}

.notification-details {
  background-color: #f8f9fa;
  border-left: 3px solid #007bff;
}
.notification-details h6 {
  color: #495057;
  font-weight: 600;
}

.notification-row .table-sm th {
  font-size: 0.875rem;
  font-weight: 600;
  color: #495057;
  border-bottom: 1px solid #dee2e6;
}
.notification-row .table-sm td {
  font-size: 0.875rem;
  vertical-align: middle;
}

.notification-row .badge {
  font-size: 0.75rem;
}

.expand-button {
  width: 32px;
  height: 32px;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background-color: #f8f9fa;
  border: 1px solid #dee2e6;
  transition: all 0.2s ease;
}
.expand-button:hover {
  background-color: #e9ecef;
  border-color: #adb5bd;
  transform: scale(1.05);
}
.expand-button .bi {
  font-size: 1rem;
  color: #6c757d;
  font-weight: bold;
}
.expand-button .badge {
  transform: translate(-50%, -50%);
  font-size: 0.6rem !important;
  min-width: 18px;
  height: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.expand-button .bi::before {
  content: "▶";
}

.expand-button .bi.bi-chevron-down::before {
  content: "▼";
}

.expand-button .bi.bi-chevron-right::before {
  content: "▶";
}

.status-icon {
  font-size: 1.2rem;
  cursor: help;
}
.status-icon.text-success {
  color: #198754 !important;
}
.status-icon.text-primary {
  color: #0d6efd !important;
}
.status-icon.text-muted {
  color: #6c757d !important;
}

.mark-as-run-checkbox {
  position: relative;
  display: inline-block;
}
.mark-as-run-checkbox input[type=checkbox] {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  width: 24px;
  height: 24px;
  border: 2px solid #6c757d;
  border-radius: 4px;
  background-color: white;
  cursor: pointer;
  position: relative;
  transition: all 0.2s ease;
  margin: 0;
  vertical-align: middle;
  flex-shrink: 0;
}
.mark-as-run-checkbox input[type=checkbox]:hover:not(:disabled) {
  border-color: #0d6efd;
  box-shadow: 0 0 0 3px rgba(13, 110, 253, 0.1);
}
.mark-as-run-checkbox input[type=checkbox]:checked {
  background-color: #0d6efd;
  border-color: #0d6efd;
}
.mark-as-run-checkbox input[type=checkbox]:checked::after {
  content: "";
  position: absolute;
  left: 7px;
  top: 3px;
  width: 6px;
  height: 10px;
  border: solid white;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}
.mark-as-run-checkbox input[type=checkbox]:focus {
  outline: none;
  box-shadow: 0 0 0 3px rgba(13, 110, 253, 0.25);
}
.mark-as-run-checkbox input[type=checkbox]:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.attendance-checkbox, .select-all-checkbox {
  position: relative;
  display: inline-block;
  width: 22px;
  height: 22px;
}
.attendance-checkbox input[type=checkbox], .select-all-checkbox input[type=checkbox] {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  width: 22px;
  height: 22px;
  border: 2px solid #6c757d;
  border-radius: 4px;
  background-color: white;
  cursor: pointer;
  position: relative;
  transition: all 0.2s ease;
  margin: 0;
  vertical-align: middle;
}
.attendance-checkbox input[type=checkbox]:hover:not(:disabled), .select-all-checkbox input[type=checkbox]:hover:not(:disabled) {
  border-color: #28a745;
  box-shadow: 0 0 0 3px rgba(40, 167, 69, 0.1);
}
.attendance-checkbox input[type=checkbox]:checked, .select-all-checkbox input[type=checkbox]:checked {
  background-color: #28a745;
  border-color: #28a745;
}
.attendance-checkbox input[type=checkbox]:checked::after, .select-all-checkbox input[type=checkbox]:checked::after {
  content: "";
  position: absolute;
  left: 6px;
  top: 2px;
  width: 5px;
  height: 10px;
  border: solid white;
  border-width: 0 3px 3px 0;
  transform: rotate(45deg);
}
.attendance-checkbox input[type=checkbox]:focus:not(:disabled), .select-all-checkbox input[type=checkbox]:focus:not(:disabled) {
  outline: none;
  box-shadow: 0 0 0 3px rgba(40, 167, 69, 0.25);
}
.attendance-checkbox input[type=checkbox]:disabled, .select-all-checkbox input[type=checkbox]:disabled {
  opacity: 0.5;
  cursor: not-allowed;
  background-color: #e9ecef;
}

.table th .attendance-checkbox,
.table th .select-all-checkbox,
.table td .attendance-checkbox,
.table td .select-all-checkbox {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0 auto;
}

.session-booking,
.exam-booking {
  opacity: 0.7;
  background-color: #f8f9fa;
}
.session-booking:hover,
.exam-booking:hover {
  background-color: #e9ecef;
  opacity: 0.8;
}

.venue-booking-row {
  cursor: pointer;
}
.venue-booking-row:hover {
  background-color: #f8f9fa;
}

.resource-section .card-sm .card-body {
  padding: 0.75rem;
}
.resource-section .card-sm .card-body .card-title {
  font-size: 0.875rem;
  font-weight: 600;
  margin-bottom: 0.25rem;
}
.resource-section .card-sm .card-body .badge {
  font-size: 0.75rem;
  padding: 0.25rem 0.5rem;
}
.resource-section .bg-light {
  background-color: #f8f9fa !important;
  border-top: 1px solid #dee2e6;
}
.resource-section h6 {
  color: #495057;
  font-weight: 600;
}
.resource-section h6 i {
  color: #007bff;
}
.resource-section .text-muted {
  font-size: 0.8rem;
}

.form-check-input:checked {
  background-color: #007bff;
  border-color: #007bff;
}

.form-check-label {
  font-weight: 500;
  color: #495057;
}
.form-check-label i {
  color: #6c757d;
}

.resource-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 1rem;
}

@media (max-width: 768px) {
  .resource-section .card-sm .card-body {
    padding: 0.5rem;
  }
  .resource-section .card-sm .card-body .card-title {
    font-size: 0.8rem;
  }
  .resource-section .card-sm .card-body .badge {
    font-size: 0.7rem;
    padding: 0.2rem 0.4rem;
  }
}
.everything-row-exam {
  background-color: #ffe5d9 !important;
}
.everything-row-exam td {
  background-color: transparent !important;
}

.everything-row-online {
  background-color: #d4edda !important;
}
.everything-row-online td {
  background-color: transparent !important;
}

.everything-row-non-gta-venue {
  background-color: #e7f3ff !important;
}
.everything-row-non-gta-venue td {
  background-color: transparent !important;
}

.user-avatar {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
  font-weight: bold;
  font-size: 14px;
  cursor: pointer;
  transition: all 0.2s ease;
  border: 2px solid transparent;
  margin: 0 auto;
}
.user-avatar:hover {
  transform: scale(1.1);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}
.user-avatar.selected {
  border-color: #0d6efd;
  box-shadow: 0 0 0 3px rgba(13, 110, 253, 0.25);
}

.user-name {
  font-size: 11px;
  line-height: 1.2;
  max-width: 60px;
  margin: 0 auto;
  word-wrap: break-word;
}

.user-avatar-container {
  padding: 5px;
}

.overdue-row {
  border-left: 10px solid #dc3545 !important;
  background-color: rgba(220, 53, 69, 0.05) !important;
}

.upcoming-item {
  opacity: 0.65;
  background-color: rgba(108, 117, 125, 0.03) !important;
  border-left: 3px solid #6c757d !important;
}
.upcoming-item:hover {
  opacity: 0.85;
  background-color: rgba(108, 117, 125, 0.08) !important;
}
.upcoming-item .status-column .badge {
  opacity: 0.8;
}

.today-table .status-column {
  width: 120px;
  min-width: 120px;
}
.today-table .date-column {
  width: 120px;
  min-width: 120px;
}
.today-table .actions-column {
  width: 200px;
  min-width: 200px;
}
.today-table .title-column {
  width: auto;
  min-width: 0;
}

.modal-show {
  display: block !important;
}

.modal-backdrop-show {
  z-index: 1040;
}

.modal-content-show {
  z-index: 1050;
}

.modal-fixed {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
}

.modal-dialog-centered {
  position: relative;
  top: 50%;
  transform: translateY(-50%);
  margin: 0 auto;
  max-width: 90%;
}

.z-index-1000 {
  z-index: 1000;
}

.z-index-1001 {
  z-index: 1001;
}

.z-index-1040 {
  z-index: 1040;
}

.z-index-1050 {
  z-index: 1050;
}

.z-index-1055 {
  z-index: 1055;
}

.display-block {
  display: block;
}

.display-block-important {
  display: block !important;
}

.font-size-3rem {
  font-size: 3rem;
}

.font-size-1-3rem {
  font-size: 1.3rem;
}

.table-no-shadow {
  box-shadow: none;
}

.list-scrollable {
  max-height: 300px;
  overflow-y: auto;
}

.max-width-500 {
  max-width: 500px;
}

.margin-auto {
  margin: 0 auto;
}

.transition-smooth {
  transition: all 0.3s ease-out;
}

.font-weight-normal {
  font-weight: normal;
}

.bg-modal-overlay {
  background-color: rgba(0, 0, 0, 0.5);
}

.position-relative {
  position: relative;
}

.flex-grow-1 {
  flex: 1;
}

.text-start {
  text-align: start;
}

.border-0 {
  border: 0;
}

.p-0 {
  padding: 0;
}

.h-100 {
  height: 100%;
}

.w-100 {
  width: 100%;
}

.max-w-90 {
  max-width: 90%;
}

.width-40 {
  width: 40px;
}

.width-100 {
  width: 100px;
}

.width-150 {
  width: 150px;
}

.badge-font-small {
  font-size: 0.6rem;
}

.max-height-200 {
  max-height: 200px;
}

.overflow-y-auto {
  overflow-y: auto;
}

.cursor-pointer {
  cursor: pointer;
}

.tooltip .tooltip-inner {
  font-size: 1.4rem;
  padding: 0.5rem 0.75rem;
}

.warning-actions .assignee-badge .assignee-circle {
  width: 25px !important;
  height: 25px !important;
  border-radius: 50% !important;
  color: white !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-weight: bold !important;
  font-size: 10px !important;
  text-transform: uppercase !important;
  border: 2px solid #fff !important;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1) !important;
  cursor: pointer;
  transition: all 0.2s ease;
}
.warning-actions .assignee-badge .assignee-circle:hover {
  transform: scale(1.05);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
}
.warning-actions .assignee-badge .assignee-circle span {
  color: white !important;
  font-weight: bold !important;
  font-size: 10px !important;
  line-height: 1 !important;
}
.warning-actions .btn-sm {
  padding: 0.25rem 0.5rem;
  font-size: 0.875rem;
  border-radius: 0.25rem;
}
.warning-actions .btn-outline-warning:hover {
  background-color: #ffc107;
  border-color: #ffc107;
  color: #212529;
}
.warning-actions .btn-outline-primary:hover {
  background-color: #007bff;
  border-color: #007bff;
  color: white;
}
.warning-actions .btn-outline-purple,
.warning-actions .warning-actions .btn-outline-purple {
  color: white !important;
  border-color: #6f42c1 !important;
  background-color: #6f42c1 !important;
  font-weight: bold !important;
}
.warning-actions .btn-outline-purple:hover,
.warning-actions .warning-actions .btn-outline-purple:hover {
  background-color: #5a32a3 !important;
  border-color: #5a32a3 !important;
  color: white !important;
}
.warning-actions .btn-outline-purple:focus,
.warning-actions .warning-actions .btn-outline-purple:focus {
  box-shadow: 0 0 0 0.2rem rgba(111, 66, 193, 0.25) !important;
}
.warning-actions .btn-outline-purple:active,
.warning-actions .warning-actions .btn-outline-purple:active {
  background-color: #5a32a3 !important;
  border-color: #5a32a3 !important;
  color: white !important;
}

.modal-content {
  border-radius: 0.5rem;
  border: none;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
}

.modal-header {
  border-bottom: 1px solid #dee2e6;
  background-color: #f8f9fa;
  border-radius: 0.5rem 0.5rem 0 0;
}

.modal-footer {
  border-top: 1px solid #dee2e6;
  background-color: #f8f9fa;
  border-radius: 0 0 0.5rem 0.5rem;
}

.warning-nav .nav-tabs {
  border-bottom: 2px solid #dee2e6;
}
.warning-nav .nav-tabs .nav-link {
  border: none;
  border-bottom: 3px solid transparent;
  color: #6c757d;
  font-weight: 500;
  padding: 0.75rem 1.5rem;
  transition: all 0.2s ease;
}
.warning-nav .nav-tabs .nav-link:hover {
  border-color: #dee2e6;
  color: #495057;
}
.warning-nav .nav-tabs .nav-link.active {
  border-color: #007bff;
  color: #007bff;
  background-color: transparent;
}
.warning-nav .nav-tabs .nav-link .badge {
  font-size: 0.75rem;
  padding: 0.25rem 0.5rem;
}

.ignored-warnings .assignee-circle {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: linear-gradient(135deg, #6c757d, #495057);
  color: white;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  font-size: 11px;
  text-transform: uppercase;
  border: 2px solid #fff;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}
.ignored-warnings .table th {
  border-top: none;
  font-weight: 600;
  color: #495057;
  background-color: #f8f9fa;
}
.ignored-warnings .table td {
  vertical-align: middle;
}
.ignored-warnings .btn-outline-success:hover {
  background-color: #28a745;
  border-color: #28a745;
  color: white;
}

.description-text {
  white-space: pre-line;
  color: black;
  font-size: 1.5rem;
}

.status-indicator {
  width: 15px;
  height: 15px;
  display: inline-block;
  flex-shrink: 0;
  border-radius: 4px;
}

.scheduled-course-todo-card .position-relative .badge {
  position: absolute;
  right: -15px;
  top: 50%;
  transform: translateY(-50%);
  border-radius: 0;
  padding: 5px 10px;
  font-size: 0.95rem;
  font-weight: bold;
  color: #fff;
  display: block;
}

.todo-overview-container .activity-section,
.action-item-activity-container .activity-section {
  margin-bottom: 1.5rem;
}
.todo-overview-container .activity-section h6,
.action-item-activity-container .activity-section h6 {
  font-weight: 600;
  text-transform: uppercase;
  font-size: 0.875rem;
  letter-spacing: 0.5px;
}
.todo-overview-container .activity-timeline .activity-item,
.action-item-activity-container .activity-timeline .activity-item {
  display: flex;
  align-items: start;
  padding: 0.5rem 0;
}
.todo-overview-container .activity-timeline .activity-item .activity-icon,
.action-item-activity-container .activity-timeline .activity-item .activity-icon {
  flex-shrink: 0;
  margin-top: 0.25rem;
}
.todo-overview-container .activity-timeline .activity-item .activity-icon i,
.action-item-activity-container .activity-timeline .activity-item .activity-icon i {
  font-size: 8px;
  color: #0d6efd;
}

.timeline-container {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.timeline-item {
  padding: 1rem;
  border-radius: 8px;
  border: 1px solid #e0e0e0;
  background: #fff;
  cursor: pointer;
  transition: all 0.2s ease;
}
.timeline-item:hover {
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  transform: translateX(2px);
}
.timeline-item .timeline-icon {
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.timeline-item .timeline-icon i {
  font-size: 1.2rem;
}
.timeline-item.timeline-item-completed {
  background: #f8f9fa;
  opacity: 0.8;
  border-left: 4px solid #28a745;
}
.timeline-item.timeline-item-blocked {
  background: #fff3cd;
  border-left: 4px solid #ffc107;
}
.timeline-item.timeline-item-overdue {
  background: #f8d7da;
  border-left: 4px solid #dc3545;
}
.timeline-item.timeline-item-upcoming {
  background: #d1ecf1;
  border-left: 4px solid #0dcaf0;
}
.timeline-item.timeline-item-active {
  border-left: 4px solid #0d6efd;
}

.course-type-selection .form-check {
  transition: all 0.3s ease;
  border: 2px solid transparent;
}
.course-type-selection .form-check:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}
.course-type-selection .form-check.border-primary {
  border-color: var(--bs-primary);
  background: linear-gradient(135deg, rgba(var(--bs-primary-rgb), 0.05) 0%, rgba(var(--bs-primary-rgb), 0.1) 100%);
}
.course-type-selection .form-check.border-primary .form-check-label {
  color: var(--bs-primary);
}
.course-type-selection .form-check .form-check-input:checked {
  background-color: var(--bs-primary);
  border-color: var(--bs-primary);
}

.payment-description .customer-info {
  display: flex;
  align-items: center;
  margin-bottom: 0.25rem;
  font-size: 0.875rem;
}
.payment-description .customer-info i {
  font-size: 0.75rem;
}
.payment-description .customer-info strong {
  color: #495057;
  font-weight: 600;
}
.payment-description .description-text {
  color: #6c757d;
  font-size: 0.875rem;
  line-height: 1.4;
  margin-top: 0.125rem;
}

.table-warning {
  background-color: #dc3545 !important;
}
.table-warning:hover {
  background-color: rgb(217.9841772152, 41.3658227848, 58.2873417722) !important;
}
.table-warning td {
  color: white !important;
}
.table-warning td strong {
  color: white !important;
}
.table-warning td .text-muted {
  color: rgba(255, 255, 255, 0.8) !important;
}

/*# sourceMappingURL=app.css.map */