/*******************************
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%;
}
.location-availability th {
  text-align: left;
  text-wrap: nowrap;
}
.location-availability thead, .location-availability tbody, .location-availability tfoot {
  border: none;
}
.location-availability tbody tr:nth-child(2n) {
  background-color: transparent;
}
.location-availability tbody tr:first-child {
  border-bottom: 1px solid #d1d5db;
}
.location-availability tbody tr th:first-child,
.location-availability tbody tr td:first-child {
  padding-inline-start: 0;
}
.location-availability tbody th td:last-child,
.location-availability tbody tr td:last-child {
  padding-inline-end: 0;
}
.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 {
    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,
.location-availability {
  border: 1px solid #d1d5db;
  border-radius: 6px;
  padding: 0.8rem;
}

/*******************************
Availability Header
*******************************/
@media screen and (min-width: 40em) {
  .location-availability-header {
    display: flex;
    justify-content: space-between;
  }
}
@media screen and (max-width: 39.9375em) {
  .location-availability-header {
    border-bottom: 1px solid #e5e7eb;
    margin-bottom: 0.5rem;
    padding: 0.5rem;
  }
}
.location-availability-header h6 {
  font-weight: 600;
}
@media screen and (min-width: 40em) {
  .location-availability-header h6 {
    font-size: 1.3rem;
  }
}
.location-availability-header .items-count {
  font-weight: 500;
  padding-inline-end: 0.5rem;
}
.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/_colors.scss%22,%22../../../../../../themes/base_theme/scss/abstracts/_mixins.scss%22,%22../../../../../../themes/base_theme/scss/abstracts/_icon-variables.scss%22%5D,%22names%22:%5B%5D,%22mappings%22:%22AAAA;AAAA;AAAA;AAAA;AASA;EACE;EAGA;AACA;AAAA;AAAA;AAAA;;AAIA;EACE;;AAGF;EACE;EACA;;AAGF;EACE;EACA;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;AAAA;EAEE;;AAGF;AAAA;EAEE;;AAGF;EACE;EACA,qBCpCO;;AC6TP;EFxUJ;IAmDI;;;AEiRA;EF7QA;IACE;IACA;;EAGF;IACE;;EAGF;IACE;;EAGF;AAAA;IAEE;IACA;IACA;;EAGF;IACE;;EAGF;IACE;;;;AAKN;AAAA;AAAA;AE+OI;EF1OA;IACE;;EAEF;IACE;;EAEF;IACE;;EAEF;IACE;;;;AAKN;AAAA;AAAA;AAGA;AAAA;EAEE;EACA;EACA;;;AAGF;AAAA;AAAA;AEqNI;EFlNJ;IAEI;IACA;;;AE2MA;EF9MJ;IAOI;IACA;IACA;;;AAGF;EACE;;AEqMA;EFtMF;IAII;;;AAIJ;EACE;EACA;;AAEA;EG3IF;EH6II;;AAGF;EACE,OCSQ;;ADPR;EACE;;AAIJ;EACE,OC/GI;;ADiHJ;EACE;;;AAOR;AAAA;AAAA;AAIE;EGvKA;EHyKE;;AAGF;EACE,OCnBU;;ADoBV;EACE;;AAIJ;EACE,OCzKO;;AD0KP;EACE;;AAIJ;EACE,OCjJM;;ADkJN;EACE;;AAIJ;EACE,OCxJM;;ADyJN;EACE;;;AAKN;AAAA;AAAA;AAGA;EACE;EACA;EACA;;AAEA;EAGE;EACA;EACA,OClBM;;ADqBR;EACE;;AEuGA;EFrHJ;IAkBI;;;;AAIJ;AAAA;AAAA;AAGA;EACE,OClCQ;EDmCR;EACA;;;AAGF;AAAA;AAAA;AAGA;EACE;EACA;EACA;EACA,OC9CQ;ED+CR;EACA;EACA;EACA;EACA;EACA;EACA%22,%22file%22:%22location-availability.css%22%7D */
