@tailwind base;
@tailwind components;
@tailwind utilities;
/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS and SCSS 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/SCSS
 * 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.
 *


 */
@import "https://cdn.jsdelivr.net/npm/@splidejs/splide@4.1.4/dist/css/splide.min.css";

/* Custom Splide arrow positioning */
.splide__arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 1;
}

.splide__arrow--prev {
  left: 0.5rem;
}

.splide__arrow--next {
  right: 0.5rem;
}

/* Hide arrows on card carousels by default, show on hover */
.bg-white .splide__arrow {
  opacity: 0;
  transition: opacity 0.3s ease;
}

.bg-white:hover .splide__arrow {
  opacity: 1;
}