/*
 * style.css - カスタムCSS（Tailwindでカバーできないもののみ）
 *
 * このファイルは、Tailwind CSSでカバーできないカスタムスタイルのみを含みます。
 * 基本的なスタイルは全てTailwindのユーティリティクラスで実装されています。
 *
 * 参考:
 * - Tailwind CSS設定: app/static/css/tailwind.config.js
 * - Tailwind生成CSS: app/static/css/tailwind.css（自動生成）
 * - 旧カスタムCSS: app/static/css/style.css.old（バックアップ）
 */

/*
 * カスタムCSS
 *
 * 現在、このファイルはほぼ空です。
 * Tailwindでカバーできない特殊なスタイル（複雑なアニメーション、特殊なレイアウト等）が
 * 必要になった場合のみ、ここに追加してください。
 *
 * 追加する際は、必ず以下を記載してください：
 * - 使用箇所（どのHTMLテンプレートで使用されているか）
 * - 理由（なぜTailwindでカバーできないのか）
 */

/*
 * トーストメッセージ
 * 使用箇所: members_invite_success.html, contractors.html
 * 理由: フェードイン・フェードアウトアニメーションとポジショニング
 */
.toast {
    position: fixed;
    top: 2rem;
    right: 2rem;
    padding: 1rem 1.5rem;
    border-radius: 0.5rem;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    font-size: 0.875rem;
    font-weight: 500;
    z-index: 9999;
    opacity: 0;
    transform: translateY(-1rem);
    transition: opacity 0.3s ease, transform 0.3s ease;
    pointer-events: none;
}

.toast.show {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}

.toast.toast-success {
    background-color: #10B981;
    color: white;
}

.toast.toast-error {
    background-color: #EF4444;
    color: white;
}

/*
 * Disabled状態のselect option要素
 * 使用箇所: contractor_create.html
 * 理由: disabled状態のoption要素のスタイルはTailwindでカバーできない
 */
select option:disabled {
    color: #9CA3AF;
}