/* Horizontally scrolling card rows (e.g. related products): keep the
   scrollbar visible at all times so the overflow is discoverable —
   overlay scrollbars on macOS/iOS otherwise hide it until first scroll.
   Styled to match the native macOS/Safari look: translucent gray thumb,
   no track.

   Note: the standard scrollbar-width/scrollbar-color properties must be
   scoped to Firefox only — when Chrome (121+) sees them it ignores every
   ::-webkit-scrollbar rule and falls back to overlay scrollbars. */
.scrollbar-always::-webkit-scrollbar {
  -webkit-appearance: none;
  height: 8px;
}

.scrollbar-always::-webkit-scrollbar-track {
  background: transparent;
}

.scrollbar-always::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.35);
  border-radius: 9999px;
}

.scrollbar-always::-webkit-scrollbar-thumb:hover {
  background: rgba(0, 0, 0, 0.5);
}

/* Firefox only (-moz-appearance is not parsed by WebKit/Blink) */
@supports (-moz-appearance: none) {
  .scrollbar-always {
    scrollbar-width: thin;
    scrollbar-color: rgba(0, 0, 0, 0.35) transparent;
  }
}
/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS (and SCSS, if configured) file within this directory, lib/assets/stylesheets, or any plugin's
 * vendor/assets/stylesheets directory can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any other CSS
 * files in this directory. Styles in this file should be added after the last require_* statement.
 * It is generally better to create a new file per style scope.
 *


 */