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

@layer components {
  /* 스크롤바 hide 기능 */
  /* Hide scrollbar for Chrome, Safari and Opera */
  .scrollbar-hide::-webkit-scrollbar {
    display: none;
  }
  /* Hide scrollbar for IE, Edge and Firefox */
  .scrollbar-hide {
    -ms-overflow-style: none; /* IE and Edge */
    scrollbar-width: none; /* Firefox */
  }

  .scrollbar-custom {
    scrollbar-width: thin; /* Firefox */
  }

  /* ===== 텍스트 드래그 방지 CSS ===== */
  * {
    -webkit-user-select: none; /* Chrome, Safari */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* 표준 */
  }

  img {
    -webkit-user-drag: none;
    -khtml-user-drag: none;
    -moz-user-drag: none;
    -o-user-drag: none;
    user-drag: none;
  }

  /* ===== Scrollbar CSS ===== */
  /* Firefox */
  * {
    scrollbar-width: auto;
    scrollbar-color: rgb(67, 79, 115) rgba(178, 199, 222, 0.5);
  }
  /* Chrome, Safari and Opera etc. */
  *::-webkit-scrollbar {
    width: 6px;
    /* height: 6px; */
  }
  *::-webkit-scrollbar-track {
    background-color: rgba(178, 199, 222, 0.5); /* eastbay-500 with opacity */
    border-radius: 9999px;
  }
  *::-webkit-scrollbar-thumb {
    background-color: rgb(67, 79, 115); /* eastbay-900 */
    border-radius: 9999px;
  }
  *::-webkit-scrollbar-thumb:hover {
    background-color: rgb(84, 103, 161); /* eastbay-700 */
  }

  /* 가로 스크롤바 변형 */
  .scrollbar-custom.horizontal::-webkit-scrollbar-track {
    background-color: rgba(178, 199, 222, 0.5);
  }
  .scrollbar-custom.horizontal::-webkit-scrollbar-thumb {
    background-color: rgb(67, 79, 115);
  }
}
