/* Functional utilities only — the visual theme (fonts, colours, component
   skins) lives in my-app-theme.css. Do not re-declare `body` here: it would
   override the theme's --font-body (Instrument Sans). */

/* === Responsive sidebar layout === */
@media (min-width: 992px) {
  body:has(#sidebar) {
    display: flex;
  }
  #sidebar {
    width: 280px;
    flex-shrink: 0;
    position: sticky;
    top: 0;
    height: 100vh;
    overflow-y: auto;
    /* background is set by the theme layer (ink / dark-palco) */
  }
  /* .offcanvas-body layout is deliberately left to the theme layer: it needs to
     stay a flex column so .sidebar-tools can be pushed to the bottom with
     margin-top:auto. Re-declaring `display:block` here used to win the cascade
     (same specificity, loaded later) and broke that. */
}

a {
  text-decoration: none;
  /* link color comes from the theme (--bs-link-color = brass) */
}

/* === Searchbar (hidden items) === */
.hidden-by-searchbar {
  display: none;
}

/* === Sortable Table Headers === */
.sortable-cell {
  cursor: pointer;
  position: relative;
}
.sortable-cell:after {
  content: "";
  display: inline-block;
  vertical-align: top;
  width: 16px;
  height: 16px;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20fill%3D'%23000000'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%20width%3D'24'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'M0%200h24v24H0V0z'%20fill%3D'none'%2F%3E%3Cpath%20d%3D'M20%2012l-1.41-1.41L13%2016.17V4h-2v12.17l-5.58-5.59L4%2012l8%208%208-8z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E");
  background-size: 100% auto;
  background-position: center;
  background-repeat: no-repeat;
  transition-duration: 300ms;
  transform: rotate(0);
  opacity: 0;
  margin-left: 8px;
}
.sortable-cell:hover:after {
  opacity: 0.54;
}
.sortable-cell.sortable-cell-active:after,
.sortable-cell.sortable-desc:after,
.sortable-cell.sortable-asc:after {
  opacity: 0.87;
}
.sortable-cell.sortable-desc:after {
  transform: rotate(180deg);
}

/* === Preloader overlay === */
.preloader-overlay {
  z-index: 9999;
  background: rgba(0, 0, 0, 0.5);
}

/* === Date picker (native input overlaid on readonly field) === */
.calendar-field {
  position: relative;
}
.calendar-picker-overlay {
  position: absolute;
  /* longhand edges, not inset: the iOS versions this exists for are old */
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  border: 0;
  opacity: 0;
  -webkit-appearance: none;
  appearance: none;
}

/* === Utilities === */
.icon-table {
  font-size: 18px;
}
.mw-400 {
  max-width: 400px;
}
.mh-120 {
  max-height: 120px;
}
