index.css

:root {
  --sat: env(safe-area-inset-top);
  --sar: env(safe-area-inset-right);
  --sab: env(safe-area-inset-bottom);
  --sal: env(safe-area-inset-left);
}

html {
  -webkit-text-size-adjust: 100%; /* Prevent font scaling in landscape while allowing user zoom */
}

.ReactCollapse--collapse {
  transition: height 200ms;
}

ion-tab-button {
  opacity: 1 !important;
}

.left-align-buttons
  .action-sheet-button:not(.action-sheet-cancel)
  .action-sheet-button-inner.sc-ion-action-sheet-ios:not(
    .action-sheet-group-cancel
  ) {
  justify-content: flex-start;
}

ion-modal.small {
  --height: 50%;
  --width: 85%;
  --max-width: 400px;
  --max-height: 500px;
  --border-radius: 16px;
  --box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1),
    0 4px 6px -4px rgb(0 0 0 / 0.1);
}
ion-modal.small ion-header ion-toolbar:first-of-type {
  padding-top: 0px;
}

ion-alert.preserve-newlines {
  white-space: pre-line;
}

.pswp__img {
  -webkit-touch-callout: default;
}

ion-action-sheet .detail::before {
  content: "";
  z-index: 1;
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);

  /* Ion chevron right icon */
  background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" class="ionicon" viewBox="0 0 512 512"><path fill="none" stroke="%2392949c44" stroke-linecap="round" stroke-linejoin="round" stroke-width="48" d="M184 112l144 144-144 144"/></svg>');
  width: 24px;
  height: 24px;
}

ion-action-sheet .action-sheet-selected {
  font-weight: normal !important;
}

ion-action-sheet .action-sheet-selected.action-sheet-selected:after {
  background: none;
}

/* Double class to override ionic specificity */
ion-action-sheet .action-sheet-selected .action-sheet-button-inner::after {
  content: "";
  z-index: 1;
  position: absolute;
  right: -6px;
  top: 50%;
  transform: translateY(-50%);

  /* Ion check icon */
  background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" class="ionicon" viewBox="0 0 512 512"><path fill="none" stroke="%233880ff" stroke-linecap="round" stroke-linejoin="round" stroke-width="32" d="M416 128L192 384l-96-96"/></svg>');

  width: 24px;
  height: 24px;
}

ion-action-sheet
  .action-sheet-selected.detail
  .action-sheet-button-inner::after {
  right: 26px;
}

ion-action-sheet ion-icon {
  margin-inline-end: 16px !important;
}

/* photoswipe */

.pswp__top-bar {
  top: env(safe-area-inset-top, 0);
}

/* Let IonActionSheet be on top */
.pswp {
  --pswp-root-z-index: 100;
}

.ion-content-scroll-host {
  overflow-y: auto;
}

.ion-content-scroll-host::before,
.ion-content-scroll-host::after {
  position: absolute;
  width: 1px;
  height: 1px;
  content: "";
}

.ion-content-scroll-host::before {
  top: -1px;
}

.ion-content-scroll-host::after {
  bottom: -1px;
}