/* This file is reserved for overriding and extending the template styles. */

/* -------------------------------------------------------------------------- */
/* School horizontal top bar (see app/Views/school/navbars/top-bar.php)        */
/* -------------------------------------------------------------------------- */

.school-top-bar {
  background: var(--foreground, #fff);
  border-color: var(--separator, rgba(0, 0, 0, 0.08)) !important;
}
.school-top-bar__inner {
  height: 70px;
}

.school-top-bar__brand {
  position: relative;
}
.school-top-bar__logo_holder {
  width: 70px;
  height: 70px;
  position: absolute;
  top: calc(50% - 35px);
  left: 0;
  padding: 5px;
}
.school-top-bar__brand {
  position: relative;
  padding-left: 70px;
}

.school-top-bar__logo {
  width: 100%;
  height: 100%;
}

.school-top-bar__school-name {
  font-size: 1.0rem;
  max-width: min(40vw, 20rem);
  font-family: var(--font-heading);
}

.school-top-bar__branch-pill {
  background: var(--separator-light, #f3f4f6);
  color: var(--body, #343a40);
  border-radius: 999px;
  padding: 6.5px 16px;
  font-size: 0.875rem;
  max-width: 16rem;
}

.school-top-bar__branch-pill.dropdown-toggle::after {
  display: none;
}

.school-top-bar__branch-pin {
  color: var(--primary);
  font-size: 0.95rem;
}

.school-top-bar__branch-chevron {
  font-size: 0.65rem;
  opacity: 0.65;
}

.dropdown-menu .school-top-bar__branch-item {
  padding: 10px 20px;
}
.dropdown-menu .school-top-bar__branch-item--active {
  font-weight: 700;
  background-color: rgba(0, 0, 0, 0.06) !important;
  color: var(--primary) !important;
  border-left: 5px solid var(--primary) !important;
  padding-left: calc(20px - 5px);
}

.school-top-bar__icon-btn {
  text-decoration: none;
  border-radius: var(--border-radius-md, 0.5rem);
}

.school-top-bar__icon-btn:hover,
.school-top-bar__icon-btn:focus {
  color: var(--primary) !important;
  background: var(--separator-light, rgba(0, 0, 0, 0.04)) !important;
}

.school-top-bar__divider {
  width: 1px;
  align-self: stretch;
  min-height: 1.75rem;
  background: var(--separator, rgba(0, 0, 0, 0.12));
  margin: 0 0.25rem;
}

.school-top-bar__user-trigger.dropdown-toggle::after {
  display: none;
}

.school-top-bar__user-name {
  font-size: 0.9rem;
}

.school-top-bar__user-role {
  letter-spacing: 0.02em;
}

.school-top-bar__avatar-img {
  object-fit: cover;
  width: 2.5rem;
  height: 2.5rem;
}

.school-top-bar__avatar-initials {
  width: 2.5rem;
  height: 2.5rem;
  font-size: 0.85rem;
  background: rgba(var(--primary-rgb, 30, 136, 229), 0.12);
  color: var(--primary);
}

/* Notification badge: default unread dot (notifications-inbox.js may override) */

.school-top-bar .notification-dot:not(:empty) {
  min-width: 1.125rem;
  height: 1.125rem;
}

.school-top-bar .notification-dot:empty {
  width: 8px;
  height: 8px;
  padding: 0;
  background: #dc3545;
  border: 2px solid var(--foreground, #fff);
}

.dropdown-menu.notification-dropdown {
  max-width: 320px;
  background: var(--foreground);
  padding: 10px 15px;
  border-radius: 0;
  box-shadow: var;
}
.notification-dropdown .os-host-resize-disabled.os-host-scrollbar-horizontal-hidden>.os-scrollbar-vertical {
  right: 5px;
  width: 10px;
  cursor: pointer;
}

.dropdown-menu.user-menu.wide {
  width: 300px;
  padding: 20px;
}

/* Dynamic list filter: advanced panel as overlay dropdown (see dynamic_list_filter.php) */

.maktabi-dynamic-list-filter__toggle-wrap {
  padding-bottom: 0;
}

.maktabi-dynamic-list-filter__clear-all {
  white-space: nowrap;
}

.maktabi-dynamic-list-filter__dropdown {
  z-index: 1055;
  overflow: visible;
  width: min(42rem, calc(100vw - 2rem));
  min-width: min(100%, 20rem);
}

/* Select2 dropdownParent: body (advanced list filter) — must stack above the filter panel */
body > .select2-container {
  z-index: 1080;
}
/* Quick-bar Select2 only; advanced panel uses normal bordered selects inside .maktabi-dynamic-list-filter__dropdown */
.maktabi-dynamic-list-filter .maktabi-filter-quick .select2-container--bootstrap4 .select2-selection {
  border: none !important;
  background: var(--separator-light);
  padding-right: 18px !important;
}
.maktabi-filter-w-xs {
  min-width:90px
}
.maktabi-filter-w-sm {
  min-width:120px
}
.maktabi-filter-w-md {
  min-width:200px
}
.maktabi-filter-w-lg {
  min-width:300px
}
.maktabi-dynamic-list-filter .select2-container--bootstrap4 .select2-dropdown {
  min-width: 200px;
}

@media screen and (min-width: 768px) {
  .maktabi-dynamic-list-filter {
      max-width: calc(100% - 22.6rem);
  }
}