/* ------------------------------------------------------------------
   ボタンの部品（resources/views/components/button.blade.php）
   種類：主・副・危険・枠・文字だけ ／ 大きさ：md・sm
   状態：通常・マウスを乗せた・フォーカス・押せない・送信中
------------------------------------------------------------------ */
.ui-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    box-sizing: border-box;
    border: 1px solid transparent;
    border-radius: 5px;
    font-family: inherit;
    line-height: 1;
    font-weight: 400;
    text-align: center;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    transition: background-color 0.2s, border-color 0.2s, color 0.2s, opacity 0.2s;
}
.ui-btn.ui-btn--md {
    height: 40px;
    min-width: 112px;
    padding: 0 20px;
    font-size: 16px;
}
.ui-btn.ui-btn--sm {
    height: 32px;
    padding: 0 12px;
    font-size: 13px;
}

/* 主：その画面でいちばん押してほしいもの */
.ui-btn.ui-btn--primary {
    background-color: #eca16a;
    border-color: #eca16a;
    color: #fff;
}
.ui-btn.ui-btn--primary:hover {
    background-color: #cd6521;
    border-color: #cd6521;
}
/* 副：もどる・閉じる・補助の操作 */
.ui-btn.ui-btn--secondary {
    background-color: #fff;
    border-color: #bbb;
    color: #333;
}
.ui-btn.ui-btn--secondary:hover {
    background-color: #f5f5f5;
    border-color: #888;
}
/* 危険：削除など、取り消せない操作 */
.ui-btn.ui-btn--danger {
    background-color: #d33535;
    border-color: #d33535;
    color: #fff;
}
.ui-btn.ui-btn--danger:hover {
    background-color: #b02a2a;
    border-color: #b02a2a;
}
/* 枠：一覧の行の「詳細」「編集」「PDFを保存」など。行の中で強すぎず、押せるものだと分かる形 */
.ui-btn.ui-btn--outline {
    min-width: 64px;
    background-color: #fff;
    border-color: #eca16a;
    color: #cd6521;
}
.ui-btn.ui-btn--outline:hover {
    background-color: #fdf1e7;
}
/* 文字だけ：ボタンらしく見せなくてよいもの */
.ui-btn.ui-btn--text {
    background-color: transparent;
    color: #cd6521;
    min-width: 0;
    padding: 0 4px;
}
.ui-btn.ui-btn--text:hover {
    text-decoration: underline;
}

/* キーボードで選んだとき */
.ui-btn.ui-btn:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px #fbe3d1;
}

/* 押せない（押せないチェックボックスと同じ薄さ） */
.ui-btn:disabled,
.ui-btn[aria-disabled="true"] {
    opacity: 0.5;
    cursor: default;
    pointer-events: none;
}

/* 送信中：押せない上に、回る印を出す */
.ui-btn.is-submitting {
    opacity: 0.7;
    cursor: wait;
}
.ui-btn.is-submitting::before {
    content: "";
    width: 1em;
    height: 1em;
    border: 2px solid currentColor;
    border-right-color: transparent;
    border-radius: 50%;
    animation: ui-btn-spin 0.8s linear infinite;
}
@keyframes ui-btn-spin {
    to { transform: rotate(360deg); }
}

/* 画面側の button の指定（.modal_item button など）より強くするため、
   種類・大きさは .ui-btn を2つ重ねて書いている */

/* 確認の小窓の「もどる」と実行ボタンの間 */
.block_action .ui-btn + .ui-btn {
    margin-left: 20px;
}

/* 横に並べたボタンの間。並べる側で間を取っていないときの既定 */
.ui-btn + .ui-btn {
    margin-left: 12px;
}
