/* Faculty Filter Bar Styling */
.faulkner-faculty-search-bar {
  background: transparent;
  padding: 20px 0;
  border-radius: 0;
  margin-bottom: 0px;
  border-bottom: 1px solid rgba(0, 93, 170, 0.3);
}

/* Filters button: visible only on mobile (drawer trigger), icon + label */
.directory-filters-trigger {
  display: none;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  gap: 10px;
  height: 38px;
  padding: 0 12px;
  margin-bottom: 10px;
  background: var(--Primary-Blue, #005daa);
  color: var(--white, #fff);
  border: none;
  border-radius: 0;
  cursor: pointer;
  transition: background 0.2s ease;
}
.directory-filters-trigger:hover {
  background: rgba(0, 93, 170, 0.9);
}
.directory-filters-trigger-icon {
  display: flex;
  align-items: center;
  justify-content: center;
}
.directory-filters-trigger-icon svg {
  display: block;
}
.directory-filters-trigger-text {
  font-family: var(--fira);
  font-size: 1.3rem;
  font-weight: 400;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

/* Drawer overlay and panel (mobile) */
.directory-filters-drawer-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.4);
  z-index: 9998;
  opacity: 0;
  transition: opacity 0.25s ease;
}
/* Open state uses body class so drawer works when moved to body (viewport-fixed) */
body.directory-filters-drawer-open .directory-filters-drawer-overlay {
  display: block;
  opacity: 1;
}

/* Drawer: brand styling (Primary Blue, Fira, spacing) */
.directory-filters-drawer {
  position: fixed;
  top: 0;
  right: 0;
  width: 100%;
  max-width: 340px;
  height: 100%;
  background: var(--white, #fff);
  z-index: 9999;
  box-shadow: -4px 0 24px rgba(0, 93, 170, 0.12);
  transform: translateX(100%);
  transition: transform 0.3s ease;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  font-family: var(--fira);
}
body.directory-filters-drawer-open .directory-filters-drawer {
  transform: translateX(0);
}

.directory-filters-drawer-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 24px;
  border-bottom: 2px solid var(--Primary-Blue, #005daa);
  flex-shrink: 0;
  background: var(--white, #fff);
}
.directory-filters-drawer-title {
  margin: 0;
  font-size: 2rem;
  font-weight: 600;
  color: var(--Primary-Blue);
  font-family: var(--fira);
  letter-spacing: 0.02em;
  padding-bottom: 0;
}
.directory-filters-drawer-close {
  background: none;
  border: none;
  font-size: 36px;
  line-height: 1;
  color: var(--default-color, #121212);
  cursor: pointer;
  padding: 0;
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition:
    color 0.2s ease,
    background 0.2s ease;
  border-radius: 4px;
}
.directory-filters-drawer-close:hover {
  color: var(--Primary-Blue);
  background: rgba(0, 93, 170, 0.08);
}

.directory-filters-drawer-inner {
  padding: 24px;
  flex: 1;
  overflow-y: auto;
  font-family: var(--fira);
}
.directory-filters-drawer-inner .search-row {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.directory-filters-drawer-inner .filter-row {
  flex-direction: column;
  align-items: stretch;
  gap: 20px;
  margin-top: 20px;
  padding-top: 20px;
  border-top: 1px solid rgba(0, 93, 170, 0.2);
}
.directory-filters-drawer-inner .search-filter-group {
  max-width: none;
}

/* In drawer: hide selects, show list UI */
.directory-filters-drawer-inner .directory-select-input {
  display: none !important;
}
.directory-filters-drawer-inner .directory-drawer-list {
  display: flex;
  flex-direction: column;
  gap: 0;
}
/* Desktop inline bar: hide toggle + list UI, show selects; hide drawer-only section header */
.faulkner-faculty-search-bar .directory-drawer-toggle {
  display: none;
}
.faulkner-faculty-search-bar .directory-drawer-section-header {
  display: none;
}

/* Drawer: flatten rows so we can order sections (search, type, dept, college, alphabet) */
.directory-filters-drawer-inner .search-row,
.directory-filters-drawer-inner .filter-row {
  display: contents;
}
.directory-filters-drawer-inner {
  display: flex;
  flex-direction: column;
  gap: 0;
}
.directory-filters-drawer-inner .directory-filter-search {
  order: -5;
}
.directory-filters-drawer-inner .directory-filter-type {
  order: -4;
  padding: 14px 0;
  border-bottom: 1px solid rgba(0, 93, 170, 0.2);
}
.directory-filters-drawer-inner .directory-filter-department {
  order: -3;
}
.directory-filters-drawer-inner .directory-filter-college {
  order: -2;
}
.directory-filters-drawer-inner .directory-alphabet-section {
  order: -1;
}

/* Section header (same style as toggle headers, no icon) */
.directory-drawer-section-header {
  padding: 14px 0;
  border-bottom: 1px solid rgba(0, 93, 170, 0.2);
  color: var(--Primary-Blue);
  font-family: var(--fira);
  font-size: 1.5rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.directory-filters-drawer-inner .directory-alphabet-section .alphabet-filter {
  padding-top: 12px;
}

/* Search bar at top of drawer (styled) */
.directory-filters-drawer-inner .directory-filter-search .search-input-group {
  display: flex;
  width: 100%;
  /* border: 1px solid rgba(0, 93, 170, 0.3); */
  border-radius: 0 4px 4px 0;
  overflow: hidden;
  background: var(--white);
}
.directory-filters-drawer-inner .directory-filter-search input[type='text'] {
  flex: 1;
  min-width: 0;
  padding: 14px 18px;
  border: 1px solid rgba(0, 93, 170, 0.3);
  border-radius: 0;
  font-family: var(--fira);
  font-size: 1.4rem;
}
.directory-filters-drawer-inner
  .directory-filter-search
  input[type='text']::placeholder {
  color: rgba(0, 93, 170, 0.6);
}
.directory-filters-drawer-inner
  .directory-filter-search
  input[type='text']:focus {
  box-shadow: none;
  outline: none;
}
.directory-filters-drawer-inner .directory-filter-search #faculty-search-btn {
  flex-shrink: 0;
  width: 52px;
  background: var(--Primary-Blue);
  border: none;
  border-radius: 0;
  cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cpath d='m21 21-4.35-4.35'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 20px;
}
.directory-filters-drawer-inner
  .directory-filter-search
  #faculty-search-btn:hover {
  background-color: rgba(0, 93, 170, 0.9);
}

/* Toggle sections (Departments / Colleges) */
.directory-drawer-toggle {
  border-bottom: 1px solid rgba(0, 93, 170, 0.15);
}
.directory-drawer-toggle:last-of-type {
  border-bottom: none;
}

.directory-drawer-toggle-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 14px 0;
  border: none;
  border-bottom: 1px solid rgba(0, 93, 170, 0.2);
  background: none;
  color: var(--Primary-Blue);
  font-family: var(--fira);
  font-size: 1.5rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  cursor: pointer;
  transition:
    color 0.2s ease,
    background 0.2s ease;
}
.directory-drawer-toggle-header:hover {
  color: rgba(0, 93, 170, 0.85);
}

.directory-drawer-toggle-icon {
  display: inline-block;
  width: 12px;
  height: 12px;
  margin-left: 8px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg);
  transition: transform 0.2s ease;
}
.directory-drawer-toggle.is-expanded .directory-drawer-toggle-icon {
  transform: rotate(-135deg);
}

.directory-drawer-toggle .directory-drawer-list {
  max-height: 0;
  overflow: hidden;
  border: none;
  border-radius: 0;
  background: transparent;
  padding: 0;
  margin: 0 0 8px;
  transition: max-height 0.25s ease;
}
.directory-drawer-toggle.is-expanded .directory-drawer-list {
  max-height: 200px;
  overflow-y: auto;
  overflow-x: hidden;
  border: 0px solid rgba(0, 93, 170, 0.15);
  border-radius: 4px;
  background: transparent;
  padding: 4px 0;
  margin: 0 0 16px;
}
.directory-drawer-toggle.is-expanded .directory-drawer-list::-webkit-scrollbar {
  width: 8px;
}
.directory-drawer-toggle.is-expanded
  .directory-drawer-list::-webkit-scrollbar-track {
  background: rgba(0, 93, 170, 0.06);
  border-radius: 4px;
}
.directory-drawer-toggle.is-expanded
  .directory-drawer-list::-webkit-scrollbar-thumb {
  background: rgba(0, 93, 170, 0.35);
  border-radius: 4px;
}
.directory-drawer-toggle.is-expanded
  .directory-drawer-list::-webkit-scrollbar-thumb:hover {
  background: var(--Primary-Blue);
}

/* Scrollable taxonomy lists in drawer (brand) */
.directory-drawer-list {
  max-height: 200px;
  overflow-y: auto;
  overflow-x: hidden;
  border: 1px solid rgba(0, 93, 170, 0.25);
  border-radius: 4px;
  background: var(--lightGrey, #f5f5f5);
  padding: 4px 0;
}
.directory-drawer-list::-webkit-scrollbar {
  width: 8px;
}
.directory-drawer-list::-webkit-scrollbar-track {
  background: rgba(0, 93, 170, 0.06);
  border-radius: 4px;
}
.directory-drawer-list::-webkit-scrollbar-thumb {
  background: rgba(0, 93, 170, 0.35);
  border-radius: 4px;
}
.directory-drawer-list::-webkit-scrollbar-thumb:hover {
  background: var(--Primary-Blue);
}

.directory-drawer-list-item {
  display: block;
  width: 100%;
  text-align: left;
  padding: 12px 16px;
  border: none;
  background: transparent;
  color: var(--default-color, #121212);
  font-family: var(--fira);
  font-size: 1.4rem;
  line-height: 1.3;
  cursor: pointer;
  transition:
    background 0.2s ease,
    color 0.2s ease;
}
.directory-drawer-list-item:hover {
  background: rgba(0, 93, 170, 0.08);
  color: var(--Primary-Blue);
}
.directory-drawer-list-item.active {
  background: var(--Primary-Blue);
  color: var(--white);
  font-weight: 600;
}

/* Drawer search input (brand) */
.directory-filters-drawer-inner input[type='text'] {
  max-width: none;
  width: 100%;
  padding: 12px 16px;
  border: 1px solid rgba(0, 93, 170, 0.3);
  border-radius: 4px;
  font-family: var(--fira);
  font-size: 1rem;
}
.directory-filters-drawer-inner input[type='text']:focus {
  border-color: var(--Primary-Blue);
  outline: none;
  box-shadow: 0 0 0 2px rgba(0, 93, 170, 0.2);
}
.directory-filters-drawer-inner .faculty-staff-toggle,
.directory-filters-drawer-inner .alphabet-filter {
  text-align: left;
}
.directory-filters-drawer-inner .alphabet-filter {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.directory-filters-drawer-inner .alphabet-link {
  color: var(--Primary-Blue);
  font-weight: 600;
}
.directory-filters-drawer-inner .alphabet-link.active {
  text-decoration: underline;
}
.directory-filters-drawer-inner .faculty-staff-toggle .faculty-text,
.directory-filters-drawer-inner .faculty-staff-toggle .staff-text,
.directory-filters-drawer-inner .faculty-staff-toggle .type-all {
  color: var(--Primary-Blue);
}
.directory-filters-drawer-inner .faculty-staff-toggle .type-all.active,
.directory-filters-drawer-inner .faculty-staff-toggle .faculty-text.active,
.directory-filters-drawer-inner .faculty-staff-toggle .staff-text.active {
  font-weight: 700;
  text-decoration: underline;
}
.directory-filters-drawer-inner .faculty-staff-toggle .separator {
  color: rgba(0, 93, 170, 0.5);
}

/* Body scroll lock when drawer open (mobile) */
body.directory-filters-drawer-open {
  overflow: hidden;
}

/* Desktop: drawer and overlay never shown */
@media (min-width: 982px) {
  .directory-filters-drawer-overlay,
  .directory-filters-drawer {
    display: none !important;
  }
  body.directory-filters-drawer-open {
    overflow: visible;
  }
}

/* Row containers */
.faulkner-faculty-search-bar .search-row {
  display: flex;
  align-items: flex-end;
  gap: 20px;
  margin-bottom: 15px;
}

.faulkner-faculty-search-bar .filter-row {
  display: flex;
  align-items: center;
  gap: 30px;
  justify-content: space-between;
}

.faulkner-faculty-search-bar .search-filter-group {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-width: 0;
}

.faulkner-faculty-search-bar .search-filter-group:last-child {
  margin-right: 0;
}

/* Labels removed - using placeholders instead */

.faulkner-faculty-search-bar select,
.faulkner-faculty-search-bar input[type='text'] {
  padding: 12px 15px;
  border: none;
  border-radius: 0;
  background: rgba(0, 93, 170, 0.1);
  font-size: var(--tinyText);
  color: var(--default-color);
  font-family: var(--fira);
  transition: all 0.3s ease;
  position: relative;
}

.faulkner-faculty-search-bar input[type='text']::placeholder {
  color: var(--default-color);
}

.faulkner-faculty-search-bar select:focus,
.faulkner-faculty-search-bar input[type='text']:focus {
  outline: none;
  border-color: var(--primary-color);
  box-shadow: 0 0 0 3px rgba(0, 93, 170, 0.1);
}

.faulkner-faculty-search-bar select {
  background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='13' height='7' viewBox='0 0 13 7' fill='none'%3e%3cg clip-path='url(%23clip0_327_269)'%3e%3cpath fill-rule='evenodd' clip-rule='evenodd' d='M6.49989 5.45049L0.808838 0L0 0.774648L6.49989 7L13 0.774648L12.1909 0L6.49989 5.45049Z' fill='%23005DAA'/%3e%3c/g%3e%3cdefs%3e%3cclipPath id='clip0_327_269'%3e%3crect width='13' height='7' fill='white'/%3e%3c/clipPath%3e%3c/defs%3e%3c/svg%3e");
  background-repeat: no-repeat;
  background-position: right 12px center;
  background-size: 13px 7px;
  padding-right: 35px;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
}

.faulkner-faculty-search-bar .search-input-group {
  position: relative;
  display: inline-block;
}

.faulkner-faculty-search-bar input[type='text'] {
  width: 100%;
  padding-right: 45px;
}

.faulkner-faculty-search-bar #faculty-search-btn {
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  background: none;
  border: none;
  color: var(--primary-color);
  font-size: var(--smallestFontMax);
  cursor: pointer;
  padding: 0;
  width: 20px;
  height: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none'%3e%3cg clip-path='url(%23clip0_327_277)'%3e%3cpath d='M11.7951 10.8144L8.63604 7.67862C8.69387 7.60366 8.7496 7.52704 8.80297 7.44863C9.06236 7.06756 9.26803 6.64682 9.40881 6.19749C9.54962 5.74824 9.62534 5.27037 9.6253 4.77717C9.62542 4.11949 9.49065 3.48938 9.24682 2.91745C8.88098 2.05926 8.2717 1.33124 7.50395 0.816237C7.12006 0.558757 6.69619 0.3546 6.24353 0.214861C5.79099 0.0751231 5.30953 -3.91308e-05 4.81267 7.75002e-08C4.15011 -0.000117547 3.51528 0.133661 2.93914 0.375694C2.07458 0.73884 1.34112 1.34363 0.822336 2.10572C0.562944 2.48678 0.357271 2.90753 0.216496 3.35685C0.0756807 3.8061 -3.94212e-05 4.28401 7.80754e-08 4.77721C-0.00011842 5.43489 0.134653 6.06501 0.378482 6.6369C0.744325 7.49509 1.35364 8.22311 2.12135 8.73811C2.50528 8.99559 2.92911 9.19975 3.38177 9.33948C3.83435 9.47926 4.31581 9.55442 4.81267 9.55439C5.47523 9.5545 6.11003 9.42072 6.68616 9.17869C7.0236 9.03695 7.34098 8.85824 7.63351 8.64789L10.8056 11.7966C11.0788 12.0678 11.5218 12.0678 11.7951 11.7966C12.0683 11.5254 12.0683 11.0856 11.7951 10.8144ZM5.82796 8.01315C5.50778 8.11195 5.16765 8.16531 4.81267 8.16535C4.33943 8.16524 3.89226 8.07055 3.48427 7.89936C2.87262 7.64271 2.35005 7.21216 1.98188 6.67105C1.79777 6.40055 1.65226 6.10269 1.55268 5.78498C1.45314 5.46716 1.39938 5.12954 1.39934 4.77717C1.39946 4.30746 1.49485 3.86354 1.6673 3.45856C1.92587 2.85142 2.35961 2.3327 2.90474 1.96723C3.17724 1.78449 3.47732 1.64004 3.79738 1.5412C4.11756 1.44239 4.45769 1.38903 4.81267 1.38899C5.28587 1.38911 5.73308 1.4838 6.14107 1.65498C6.75272 1.91164 7.27529 2.34218 7.64347 2.8833C7.82757 3.15383 7.97309 3.45166 8.07267 3.76936C8.1722 4.08719 8.22596 4.42481 8.226 4.77717C8.22588 5.24689 8.13049 5.6908 7.95804 6.09579C7.69948 6.70293 7.26573 7.22165 6.7206 7.58711C6.4481 7.76986 6.14802 7.9143 5.82796 8.01315Z' fill='%23005DAA'/%3e%3c/g%3e%3cdefs%3e%3cclipPath id='clip0_327_277'%3e%3crect width='12' height='12' fill='white'/%3e%3c/clipPath%3e%3c/defs%3e%3c/svg%3e");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 12px 12px;
}

.faulkner-faculty-search-bar #faculty-search-btn:hover {
  color: var(--Primary-Blue);
}

/* Faculty/Staff Toggle and Alphabet Filter */
.faulkner-faculty-search-bar .faculty-staff-toggle {
  display: inline-block;
}

.faulkner-faculty-search-bar .faculty-staff-toggle .toggle-text {
  font-weight: 400;
  font-size: var(--tinyText);
  color: var(--Primary-Blue, #005daa);
  font-family: var(--fira);
  cursor: pointer;
}

.faulkner-faculty-search-bar .faculty-staff-toggle .faculty-text {
  color: var(--Primary-Blue, #005daa);
  font-weight: 400;
}

.faulkner-faculty-search-bar .faculty-staff-toggle .type-all {
  color: var(--Primary-Blue, #005daa);
  font-weight: 400;
}

.faulkner-faculty-search-bar .faculty-staff-toggle .type-all.active {
  color: var(--Primary-Blue, #005daa);
  font-weight: 700;
}

.faulkner-faculty-search-bar .faculty-staff-toggle .faculty-text.active {
  color: var(--Primary-Blue, #005daa);
  font-weight: 700;
}

.faulkner-faculty-search-bar .faculty-staff-toggle .staff-text {
  color: var(--Primary-Blue, #005daa);
  font-weight: 400;
}

.faulkner-faculty-search-bar .faculty-staff-toggle .staff-text.active {
  color: var(--Primary-Blue, #005daa);
  font-weight: 700;
}

.faulkner-faculty-search-bar .faculty-staff-toggle .separator {
  color: var(--Primary-Blue, #005daa);
  margin: 0 5px;
}

.faulkner-faculty-search-bar .alphabet-filter {
  display: inline-block;
}

.faulkner-faculty-search-bar .alphabet-filter span {
  font-weight: 600;
  color: var(--default-color);
  margin-right: 10px;
  font-size: var(--tinyText);
  font-family: var(--fira);
}

.faulkner-faculty-search-bar .alphabet-filter .alphabet-link {
  color: var(--Primary-Blue, #005daa);
  text-decoration: none;
  font-weight: 400;
  font-size: 16px;
  font-family: var(--fira);
  line-height: 35px;
  padding: 4px;
  border-radius: 4px;
  transition: all 0.2s ease;
  display: inline-block;
}

.faulkner-faculty-search-bar .alphabet-filter .alphabet-link:hover,
.faulkner-faculty-search-bar .alphabet-filter .alphabet-link.active {
  background: var(--primary-color);
  color: var(--white);
  text-decoration: none;
}

/* Special styling for ALL button */
.faulkner-faculty-search-bar
  .alphabet-filter
  .alphabet-link[data-letter='all'] {
  background: transparent;
  color: var(--Primary-Blue);
  font-weight: 700;
  padding: 4px;
  border-radius: 6px;
}

/* Responsive Design */
@media (max-width: 981px) {
  .faulkner-faculty-search-bar {
    padding: 15px;
  }

  /* Mobile/tablet: show Filters button, hide inline bar (content moved to drawer by JS) */
  .directory-filters-trigger {
    display: flex;
  }
  .directory-filters-inline {
    display: none !important;
  }

  .faulkner-faculty-search-bar .search-filter-group {
    display: block;
    margin-right: 0;
    margin-bottom: 15px;
    width: 100%;
  }

  .faulkner-faculty-search-bar select,
  .faulkner-faculty-search-bar input[type='text'] {
    width: 100%;
    max-width: 300px;
  }

  .faulkner-faculty-search-bar .faculty-staff-toggle,
  .faulkner-faculty-search-bar .alphabet-filter {
    display: block;
    margin-bottom: 10px;
    text-align: center;
  }

  .faulkner-faculty-search-bar .alphabet-filter .alphabet-link {
    margin: 2px;
    font-size: var(--standardFontMax);
    padding: 3px 5px;
  }
}

@media (max-width: 480px) {
  .faulkner-faculty-search-bar .alphabet-filter .alphabet-link {
    font-size: var(--standardFontMin);
    padding: 2px 4px;
    margin: 1px;
  }
}

/* Faculty Directory Grid Styling */
.faulkner-faculty-directory-grid {
  display: grid;
  gap: 30px;
  margin-top: 30px;
  /* Default to 4 columns if data-grid-columns attribute is missing or invalid */
  grid-template-columns: repeat(4, 1fr);
}

.faulkner-faculty-directory-grid[data-grid-columns='4'] {
  grid-template-columns: repeat(4, 1fr);
}

.faulkner-faculty-directory-grid[data-grid-columns='3'] {
  grid-template-columns: repeat(3, 1fr);
}

.faulkner-faculty-directory-grid[data-grid-columns='2'] {
  grid-template-columns: repeat(2, 1fr);
}

.faulkner-faculty-directory-grid[data-grid-columns='1'] {
  grid-template-columns: repeat(4, 1fr);
}

/* Handle extra wrapper divs that Divi or WordPress might add */
/* display: contents makes the wrapper "disappear" so grid items become direct children */
.faulkner-faculty-directory-grid
  > div:not(.faculty-member-card):not(.faculty-pagination) {
  display: contents;
}

/* Fallback: If display: contents isn't supported, make the wrapper also a grid */
@supports not (display: contents) {
  .faulkner-faculty-directory-grid
    > div:not(.faculty-member-card):not(.faculty-pagination) {
    display: grid;
    grid-template-columns: inherit;
    gap: inherit;
  }
}

.faculty-member-card {
  cursor: pointer;
  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease;
  padding: 10px;
}

.faculty-member-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 4px 12px rgba(0, 93, 170, 0.15);
}

/* Faculty sidebar (single profile contact block) */
.faculty-sidebar .faculty-contact-label {
  font-size: clamp(var(--postContentFontMin), 2vw, var(--postContentFontMax));
  color: var(--Primary-Blue);
  font-weight: 600;
  line-height: 35px;
}
.faculty-sidebar .faculty-contact-value {
  font-size: clamp(var(--postContentFontMin), 2vw, var(--postContentFontMax));
  font-weight: 400;
  color: var(--black);
}
.faculty-sidebar .faculty-contact-info a.faculty-contact-value,
.faculty-sidebar .faculty-contact-info a {
  color: var(--black);
}
.faculty-sidebar .faculty-contact-info a:hover {
  color: var(--Primary-Blue);
}

/* Faculty profile main column: college line */
p.faculty-college {
  font-size: clamp(var(--postContentFontMin), 2vw, var(--postContentFontMax));
  font-weight: 600;
}

.faculty-member-card .faculty-photo {
  margin-bottom: 15px;
  width: 188px;
  height: 188px;
  flex-shrink: 0;
  margin-left: auto;
  margin-right: auto;
}

.faculty-member-card .faculty-photo img {
  width: 188px;
  height: 188px;
  border-radius: 188px;
  object-fit: cover;
  display: block;
}

.faculty-member-card .faculty-photo.no-image {
  width: 188px;
  height: 188px;
  border-radius: 188px;
  background: var(--lightGrey);
  display: flex;
  align-items: center;
  justify-content: center;
}

.faculty-member-card .faculty-info {
  text-align: center;
}

.faculty-member-card .faculty-name {
  color: var(--Primary-Blue);
  line-height: 35px;
  font-weight: 400;
  margin: 0;
  padding: 0;
}

.faculty-member-card .faculty-position {
  color: var(--black);
  text-align: center;
  font-weight: 600;
  line-height: 35px;
  margin: 0;
}

/* Faculty Modal Styling */
.faculty-modal-overlay {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.7);
  z-index: 9999;
  overflow-y: auto;
  padding: 20px;
}

body.faculty-modal-open {
  overflow: hidden;
}

.faculty-modal-content {
  position: relative;
  max-width: 370px;
  margin: 50px auto;
  background: var(--white);
  border-radius: 0;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.3);
  padding: 40px;
}

.faculty-modal-close {
  position: absolute;
  top: 15px;
  right: 15px;
  background: none;
  border: none;
  font-size: 32px;
  color: var(--black);
  cursor: pointer;
  line-height: 1;
  padding: 0;
  width: 30px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: color 0.2s ease;
  font-weight: 300;
}

.faculty-modal-close:hover {
  color: var(--Primary-Blue);
}

.faculty-modal-body {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.faculty-modal-photo {
  width: 188px;
  height: 188px;
  flex-shrink: 0;
  margin-bottom: 20px;
}

.faculty-modal-photo img {
  width: 188px;
  height: 188px;
  border-radius: 188px;
  object-fit: cover;
  display: block;
}

.faculty-modal-name {
  color: var(--Primary-Blue);
  font-weight: 400;
  /* line-height: 35px; */
  margin: 0;
  padding: 0;
}

.faculty-modal-position {
  color: var(--black);
  text-align: center;
  font-weight: 600;
  line-height: 35px;
  margin: 0;
}

.faculty-modal-bio {
  margin: 20px 0;
  color: var(--default-color);
}

.faculty-modal-contact {
  width: 100%;
  text-align: left;
  color: var(--default-color);
  padding-top: 30px;
}

.faculty-modal-contact-item {
  display: flex;
  align-items: baseline;
  margin-bottom: 15px;
}

.faculty-modal-label {
  color: var(--Primary-Blue);
  font-weight: 600;
  margin-right: 8px;
}

.faculty-modal-contact-item a {
  color: var(--black);
  text-decoration: none;
}

.faculty-modal-contact-item a:hover {
  color: var(--Primary-Blue);
  text-decoration: underline;
}

.faculty-modal-value {
  color: var(--black);
}

/* Faculty Single Page Content */
.faculty-content {
  max-width: 650px;
}

/* Responsive Grid Layout */
/* Tablet and smaller desktop (1024px and below) */
@media (max-width: 1024px) {
  .faulkner-faculty-directory-grid[data-grid-columns='4'] {
    grid-template-columns: repeat(3, 1fr);
  }

  .faulkner-faculty-directory-grid {
    gap: 25px;
  }
}

/* Tablet (768px and below) */
@media (max-width: 768px) {
  .faulkner-faculty-directory-grid[data-grid-columns='4'],
  .faulkner-faculty-directory-grid[data-grid-columns='3'],
  .faulkner-faculty-directory-grid[data-grid-columns='1'] {
    grid-template-columns: repeat(2, 1fr);
  }

  .faulkner-faculty-directory-grid {
    gap: 20px;
    margin-top: 20px;
  }

  .faculty-member-card {
    padding: 8px;
  }

  .faculty-member-card .faculty-photo {
    width: 160px;
    height: 160px;
    margin-bottom: 12px;
  }

  .faculty-member-card .faculty-photo img {
    width: 160px;
    height: 160px;
  }

  .faculty-member-card .faculty-photo.no-image {
    width: 160px;
    height: 160px;
  }
}

/* Mobile (480px and below) */
@media (max-width: 480px) {
  .et-db #et-boc .et-l .faulkner-faculty-directory-grid[data-grid-columns='4'],
  .et-db #et-boc .et-l .faulkner-faculty-directory-grid[data-grid-columns='3'],
  .et-db #et-boc .et-l .faulkner-faculty-directory-grid[data-grid-columns='2'],
  .et-db #et-boc .et-l .faulkner-faculty-directory-grid[data-grid-columns='1'] {
    grid-template-columns: repeat(2, 1fr);
  }

  .et-db #et-boc .et-l.faulkner-faculty-directory-grid {
    gap: 15px;
    margin-top: 15px;
  }

  .et-db #et-boc .et-l .faculty-member-card {
    padding: 10px;
    max-width: 100%;
  }

  .et-db #et-boc .et-l .faculty-member-card .faculty-photo {
    width: 120px;
    height: 120px;
    margin-bottom: 10px;
  }

  .et-db #et-boc .et-l .faculty-member-card .faculty-photo img {
    width: 120px;
    height: 120px;
  }

  .et-db #et-boc .et-l .faculty-member-card .faculty-photo.no-image {
    width: 120px;
    height: 120px;
  }

  .et-db #et-boc .et-l .faculty-member-card .faculty-name {
    font-size: var(--smallHeaderMin, 1.2rem);
    line-height: 1.3;
  }

  .et-db #et-boc .et-l .faculty-member-card .faculty-position {
    font-size: var(--postHeaderInlineMin, 0.9rem);
    line-height: 1.4;
  }
}

/* Pagination Styles */
.faulkner-directory-grid-wrapper.faulkner-directory-loading {
  opacity: 0.7;
  pointer-events: none;
  transition: opacity 0.2s ease;
}

.faculty-no-results {
  margin-top: 24px;
  text-align: center;
  color: var(--black, #000000);
}

.faculty-pagination {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin-top: 40px;
  padding: 20px 0;
  width: 100%;
  clear: both;
}

/* Keep order: prev arrow | Page X of Y | next arrow (below grid content) */
.faculty-pagination .slick-prev {
  order: 1;
}
.faculty-pagination .pagination-info {
  order: 2;
}
.faculty-pagination .slick-next {
  order: 3;
}

/* Arrow style (same as slider: slick-arrow + vt-arrow-icon) — keep in flow below content, no absolute */
.faculty-pagination.vt-nav-wrapper .slick-arrow {
  position: static !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  transform: none !important;
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  min-width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: opacity 0.2s ease;
}

.faculty-pagination.vt-nav-wrapper .slick-arrow .vt-arrow-icon {
  width: 17px;
  height: 32px;
  display: block;
  pointer-events: none;
}

.faculty-pagination.vt-nav-wrapper .slick-arrow:hover:not(.slick-disabled) {
  opacity: 0.7;
}

.faculty-pagination.vt-nav-wrapper .slick-arrow.slick-disabled {
  opacity: 0.35;
  cursor: default;
  pointer-events: none;
}

.faculty-pagination.vt-nav-wrapper a.slick-arrow {
  text-decoration: none;
}

.pagination-btn {
  background: var(--Primary-Blue, #005daa);
  color: var(--white, #ffffff);
  border: none;
  border-radius: 4px;
  padding: 10px 20px;
  font-size: 18px;
  cursor: pointer;
  transition:
    background-color 0.3s ease,
    opacity 0.3s ease;
  min-width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
}

a.pagination-btn {
  text-decoration: none;
}

.pagination-btn:hover:not(:disabled):not(.slick-disabled) {
  background: rgba(0, 93, 170, 0.9);
}

.pagination-btn:disabled,
.pagination-btn.disabled {
  opacity: 0.5;
  cursor: not-allowed;
  pointer-events: none;
}

.pagination-info {
  font-size: var(--standardFontMax, 1rem);
  color: var(--black, #000000);
  font-weight: 500;
}

/* Responsive Pagination */
@media (max-width: 768px) {
  .faculty-pagination {
    margin-top: 30px;
    gap: 12px;
  }

  .pagination-btn {
    padding: 8px 16px;
    font-size: 16px;
    min-width: 40px;
    height: 40px;
  }

  .pagination-info {
    font-size: var(--standardFontMin, 0.9rem);
  }
}

@media (max-width: 480px) {
  .faculty-pagination {
    margin-top: 25px;
    gap: 10px;
    flex-wrap: wrap;
  }

  .pagination-btn {
    padding: 8px 12px;
    font-size: 16px;
    min-width: 36px;
    height: 36px;
  }

  .pagination-info {
    width: 100%;
    text-align: center;
    font-size: var(--standardFontMin, 0.85rem);
  }
}

/* Responsive Modal */
@media (max-width: 768px) {
  .faculty-modal-body {
    flex-direction: column;
    text-align: center;
  }

  .faculty-modal-photo {
    width: 120px;
    height: 120px;
    margin: 0 auto;
  }

  .faculty-modal-photo img {
    width: 120px;
    height: 120px;
    border-radius: 120px;
  }

  .faculty-modal-content {
    padding: 30px 20px;
    margin: 20px;
  }
}

/* Single directory profile: mobile reorder [faulkner_directory_sidebar] + [faulkner_directory_content]
   Desired order: Headshot → Name → Title → Contact → Bio (then map, button) */
@media (max-width: 768px) {
  .et_pb_row:has(.faculty-sidebar) {
    display: flex;
    flex-direction: column;
  }

  .et_pb_row:has(.faculty-sidebar) > .et_pb_column_1_4,
  .et_pb_row:has(.faculty-sidebar) > .et_pb_column_3_4 {
    display: contents;
  }

  /* Flatten sidebar column so photo and contact become row flex children */
  .et_pb_row:has(.faculty-sidebar)
    .et_pb_column_1_4
    > .et_pb_module:first-child,
  .et_pb_row:has(.faculty-sidebar) .et_pb_column_1_4 .et_pb_code_inner,
  .et_pb_row:has(.faculty-sidebar) .faculty-sidebar {
    display: contents;
  }

  /* Flatten first module of main column so name, title, college, bio become row flex children */
  .et_pb_row:has(.faculty-sidebar)
    .et_pb_column_3_4
    > .et_pb_module:first-child,
  .et_pb_row:has(.faculty-sidebar)
    .et_pb_column_3_4
    .et_pb_module:first-child
    .et_pb_code_inner,
  .et_pb_row:has(.faculty-sidebar) .faculty-content {
    display: contents;
  }

  /* Visual order: 1 Headshot, 2 Name, 3 Title, 4 Contact, 5 College, 6 Bio, 7 Image, 8 Button */
  .et_pb_row:has(.faculty-sidebar) .faculty-photo-container {
    order: 1;
  }
  .et_pb_row:has(.faculty-sidebar) .faculty-name-large {
    order: 2;
  }
  .et_pb_row:has(.faculty-sidebar) .faculty-title-large {
    order: 3;
  }
  .et_pb_row:has(.faculty-sidebar) .faculty-college {
    order: 4;
  }
  .et_pb_row:has(.faculty-sidebar) .faculty-contact-info {
    order: 5;
  }
  .et_pb_row:has(.faculty-sidebar) .faculty-biography-content {
    order: 6;
  }
  .et_pb_row:has(.faculty-sidebar) .et_pb_column_3_4 .et_pb_image {
    order: 7;
  }
  .et_pb_row:has(.faculty-sidebar)
    .et_pb_column_3_4
    .et_pb_button_module_wrapper {
    order: 8;
  }
}