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

@layer base {

  /* Form labels */
  .form-label {
    @apply block text-base font-medium text-gray-700 mb-1;
  }

  .form-label-required {
    @apply block text-base font-medium text-gray-700 mb-1;
  }

  .form-label-required::after {
    content: '*';
    @apply text-red-500 ml-1;
  }
}

@layer components {
  /* モバイル: サイドバー初期状態で非表示 */
  @media (max-width: 1023px) {
    aside[data-mobile-sidebar-target="sidebar"] {
      transform: translateX(-100%);
    }

    aside[data-mobile-sidebar-target="sidebar"].mobile-open {
      transform: translateX(0);
    }
  }

  /* デスクトップ: サイドバーは常に表示 */
  @media (min-width: 1024px) {
    aside[data-mobile-sidebar-target="sidebar"] {
      transform: translateX(0) !important;
    }
  }
}