@tailwind base;
@tailwind components;
@tailwind utilities;

@layer base {
  button:not(:disabled),
  [role="button"]:not([aria-disabled="true"]),
  [type="button"]:not(:disabled),
  [type="submit"]:not(:disabled),
  [type="reset"]:not(:disabled),
  summary {
    cursor: pointer;
  }
}

@layer components {
  .sheen-sweep {
    position: relative;
    overflow: hidden;
    isolation: isolate;
  }

  .sheen-sweep::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
      115deg,
      transparent 35%,
      rgba(255, 255, 255, 0.75) 50%,
      transparent 65%
    );
    mix-blend-mode: overlay;
    transform: translateX(-120%);
    animation: sheen-sweep 3s linear infinite;
    pointer-events: none;
  }

  @keyframes sheen-sweep {
    0%   { transform: translateX(-120%); }
    40%  { transform: translateX(120%); }
    100% { transform: translateX(120%); }
  }

  @media (prefers-reduced-motion: reduce) {
    .sheen-sweep::after { animation: none; display: none; }
  }
}
/*
 * 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.
 *


 */