/*******************************
Location Availability
Compile: sass --watch location-availability.scss:../css/location-availability.css
*******************************/
.location-availability {
  background: white;
  scrollbar-width: thin; /* For Firefox */
  /* 
    For Webkit-based browsers (Chrome, Safari, Edge)
    You can adjust this value to your liking
  */
}
.location-availability::-webkit-scrollbar {
  width: 8px;
}
.location-availability table {
  margin-bottom: 0;
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  overflow: hidden;
  border: none;
}
.location-availability thead, .location-availability tbody, .location-availability tfoot {
  border: none;
}
.location-availability thead tr {
  background-color: white;
}
.location-availability thead th {
  border-top: 1px solid #d1d5db;
  border-bottom: 1px solid #d1d5db;
  border-left: 1px solid #d1d5db;
}
@media screen and (min-width: 40em) {
  .location-availability thead tr th:last-child {
    border-right: 1px solid #d1d5db;
  }
}
.location-availability tbody tr:nth-child(2n) {
  background-color: transparent;
}
@media screen and (min-width: 40em) {
  .location-availability tbody tr:first-child {
    border-bottom: 1px solid #d1d5db;
  }
}
@media screen and (min-width: 40em) {
  .location-availability thead tr:first-child th:first-child {
    border-top-left-radius: 6px;
  }
}
@media screen and (min-width: 40em) {
  .location-availability thead tr:first-child th:last-child {
    border-top-right-radius: 6px;
  }
}
@media screen and (min-width: 40em) {
  .location-availability tbody tr:last-child td:first-child,
  .location-availability tr.last-visible td:first-child {
    border-bottom-left-radius: 6px;
  }
}
@media screen and (min-width: 40em) {
  .location-availability tbody tr:last-child td:last-child,
  .location-availability tr.last-visible td:last-child {
    border-bottom-right-radius: 6px;
  }
}
@media screen and (min-width: 40em) {
  .location-availability tbody tr td {
    border-left: 1px solid #d1d5db;
  }
}
@media screen and (min-width: 40em) {
  .location-availability tbody tr td:last-child {
    border-right: 1px solid #d1d5db;
  }
}
.location-availability th {
  text-align: left;
  text-wrap: nowrap;
}
.location-availability td {
  position: relative;
  top: -1px;
}
@media screen and (min-width: 40em) {
  .location-availability td {
    border-bottom: 1px solid #d1d5db;
  }
}
.location-availability hr {
  margin: 0.5rem 0 1rem;
  border-bottom-color: #e5e7eb;
}
@media screen and (min-width: 40em) {
  .location-availability {
    padding: 0.8rem;
  }
}
@media screen and (max-width: 39.9375em) {
  .location-availability table, .location-availability tbody, .location-availability th, .location-availability td, .location-availability tr {
    display: block;
    width: 100%;
  }
  .location-availability .table-heading {
    display: none;
  }
  .location-availability td {
    padding: 0;
  }
  .location-availability tbody tr:nth-child(2n),
  .location-availability tbody tr {
    border-bottom: 1px solid #e5e7eb;
    margin-bottom: 0.5rem;
    padding-bottom: 0.5rem;
  }
  .location-availability tbody tr.last-visible {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 0;
  }
  .location-availability tbody tr {
    padding-inline: 0.5rem;
  }
  .location-availability tbody tr:last-child {
    border-bottom: none;
  }
}

/*******************************
Column name
*******************************/
@media screen and (max-width: 39.9375em) {
  .location-availability td.col-location::before {
    content: "Location: ";
  }
  .location-availability td.col-volume::before {
    content: "Volume: ";
  }
  .location-availability td.col-call-number::before {
    content: "Call Number: ";
  }
  .location-availability td.col-status::before {
    content: "Status: ";
  }
}

/*******************************
Availability location override.
*******************************/
.ui-dialog .ui-widget-content.location-availability tbody,
.location-availability tbody {
  border: 1px solid #d1d5db;
  border-radius: 6px;
  padding: 0.8rem;
}

/*******************************
Availability Header
*******************************/
.location-availability-header {
  width: 100%;
}
@media screen and (min-width: 40em) {
  .location-availability-header {
    padding-inline: 0;
  }
}
@media screen and (max-width: 39.9375em) {
  .location-availability-header {
    margin-bottom: 0.5rem;
    padding: 0.5rem;
    display: flex;
    flex-direction: column;
    text-align: left;
  }
}
.location-availability-header .caption {
  font-weight: 600;
}
@media screen and (min-width: 40em) {
  .location-availability-header .caption {
    font-size: 1.3rem;
    float: left;
  }
}
.location-availability-header .items-count {
  font-weight: 500;
  padding-inline-end: 0.5rem;
}
@media screen and (min-width: 40em) {
  .location-availability-header .items-count {
    float: right;
  }
}
.location-availability-header .items-count::before {
  font-family: "Stacks Icons";
  margin-inline-end: 0.5rem;
}
.location-availability-header .items-count:not(.no-available) {
  color: #047857;
}
.location-availability-header .items-count:not(.no-available)::before {
  content: "\e82a";
}
.location-availability-header .items-count.no-available {
  color: #B91C1C;
}
.location-availability-header .items-count.no-available::before {
  content: "\e874";
}

/*******************************
Status
*******************************/
.location-availability .status::before {
  font-family: "Stacks Icons";
  margin-inline-end: 0.5rem;
}
.location-availability .status.available {
  color: #047857;
}
.location-availability .status.available::before {
  content: "\e82a";
}
.location-availability .status.not-available {
  color: #6b7280;
}
.location-availability .status.not-available::before {
  content: "\e874";
}
.location-availability .status.checked-out {
  color: #B91C1C;
}
.location-availability .status.checked-out::before {
  content: "\f218";
}
.location-availability .status.in-transit {
  color: #B91C1C;
}
.location-availability .status.in-transit::before {
  content: "\e861";
}

/*******************************
Action buttons
*******************************/
.location-availability .stacks-button {
  font-size: 0.9rem;
  font-weight: 500;
  text-align: center;
}
.location-availability .stacks-button, .location-availability .stacks-button:hover, .location-availability .stacks-button:focus {
  background: white;
  border: 1px solid #0369A1;
  color: #0369A1;
}
.location-availability .stacks-button a::before {
  margin-inline-end: 0.5rem;
}
@media screen and (max-width: 39.9375em) {
  .location-availability .stacks-button {
    width: 100%;
  }
}

/*******************************
Toggle listings button
*******************************/
.location-availability .toggle-locations-lists {
  color: #0369A1;
  font-weight: 500;
  cursor: pointer;
}

/*******************************
Button
*******************************/
.location-availability .btn {
  align-items: center;
  border-radius: 4px;
  border: 1px solid #0369A1;
  color: #0369A1;
  display: flex;
  font-size: 0.9rem;
  font-weight: 500;
  gap: 10px;
  justify-content: center;
  padding: 0.2rem 0.7rem;
  width: fit-content;
}

/*# sourceMappingURL=data:application/json;charset=utf-8,%7B%22version%22:3,%22sourceRoot%22:%22%22,%22sources%22:%5B%22../scss/location-availability.scss%22,%22../../../../../../themes/base_theme/scss/abstracts/_mixins.scss%22,%22../../../../../../themes/base_theme/scss/abstracts/_colors.scss%22,%22../../../../../../themes/base_theme/scss/abstracts/_icon-variables.scss%22%5D,%22names%22:%5B%5D,%22mappings%22:%22AAAA;AAAA;AAAA;AAAA;AASA;EAGE;EAGA;AACA;AAAA;AAAA;AAAA;;AAIA;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;EACA;EACA;;ACqSA;EDlSF;IAEI;;;AAIJ;EACE;;AC2RA;EDxRF;IAEI;;;ACsRF;EDlRF;IAEI,wBAvDY;;;ACuUd;ED5QF;IAEI,yBA7DY;;;ACuUd;EDtQF;AAAA;IAGI,2BApEY;;;ACuUd;ED/PF;AAAA;IAGI,4BA3EY;;;ACuUd;EDxPF;IAEI;;;ACsPF;EDlPF;IAEI;;;AAIJ;EACE;EACA;;AAGF;EACE;EACA;;ACqOA;EDvOF;IAKI;;;AAIJ;EACE;EACA,qBEjGO;;AD6TP;EDxUJ;IAgHI;;;ACoNA;EDhNA;IACE;IACA;;EAGF;IACE;;EAGF;IACE;;EAGF;AAAA;IAEE;IACA;IACA;;EAGF;IACE;IACA;IACA;;EAGF;IACE;;EAGF;IACE;;;;AAKN;AAAA;AAAA;AC4KI;EDvKA;IACE;;EAEF;IACE;;EAEF;IACE;;EAEF;IACE;;;;AAKN;AAAA;AAAA;AAGA;AAAA;EAEE;EACA;EACA;;;AAGF;AAAA;AAAA;AAGA;EACE;;AC8IE;ED/IJ;IAII;;;ACuIA;ED3IJ;IAQI;IACA;IACA;IACA;IACA;;;AAGF;EACE;;AC+HA;EDhIF;IAII;IACA;;;AAIJ;EACE;EACA;;ACqHA;EDvHF;IAKI;;;AAGF;EGtNF;EHwNI;;AAGF;EACE,OElEQ;;AFoER;EACE;;AAIJ;EACE,OE1LI;;AF4LJ;EACE;;;AAOR;AAAA;AAAA;AAIE;EGlPA;EHoPE;;AAGF;EACE,OE9FU;;AF+FV;EACE;;AAIJ;EACE,OEpPO;;AFqPP;EACE;;AAIJ;EACE,OE5NM;;AF6NN;EACE;;AAIJ;EACE,OEnOM;;AFoON;EACE;;;AAKN;AAAA;AAAA;AAGA;EACE;EACA;EACA;;AAEA;EAGE;EACA;EACA,OE7FM;;AFgGR;EACE;;AC4BA;ED1CJ;IAkBI;;;;AAIJ;AAAA;AAAA;AAGA;EACE,OE7GQ;EF8GR;EACA;;;AAGF;AAAA;AAAA;AAGA;EACE;EACA;EACA;EACA,OEzHQ;EF0HR;EACA;EACA;EACA;EACA;EACA;EACA%22,%22file%22:%22location-availability.css%22%7D */