/* =========================================================
 * 50-consultation.css — 展示相談スケジュール（作家募集導線）
 *
 * 対応テンプレート: parts/sections/section-consultation.php
 * 構造: lr-consultation > __list > __item（カード）
 *        __item 内: __body(__date / __meta(__status __deadline)) / __link
 * 移植: al固有
 * ======================================================= */
.lr-consultation__list {
    display: grid;
    gap: var(--lr-space-sm);
}

/* --- 1枠＝カード --- */
.lr-consultation__item {
    display: flex;
    flex-direction: column;
    gap: var(--lr-space-sm);
    padding: var(--lr-space-sm);
    border: 1px solid var(--lr-border);
    border-radius: var(--lr-radius);
    background-color: var(--lr-bg-subtle);
}

/* 左ブロック：日付 → メタ（相談可＋受付目安） */
.lr-consultation__body {
    display: flex;
    flex-direction: column;
    gap: var(--lr-space-2xs);
}

/* メタ行：相談可 と 受付目安 を横並び */
.lr-consultation__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: var(--lr-space-xs);
}

/* --- 日付（主役） --- */
.lr-consultation__date {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: var(--lr-space-2xs);
    font-family: var(--lr-font-sans);
    font-size: var(--lr-font-lg);
    font-weight: var(--lr-weight-bold);
    color: var(--lr-text);
}

.lr-consultation__dash {
    color: var(--lr-text-muted);
    font-weight: var(--lr-weight-normal);
}

/* --- ステータス --- */
.lr-consultation__status {
    font-size: var(--lr-font-sm);
    font-weight: var(--lr-weight-bold);
    line-height: 1;
    color: var(--lr-accent);
}

/* --- 受付目安 --- */
.lr-consultation__deadline {
    font-size: var(--lr-font-xs);
    color: var(--lr-text-muted);
}

/* --- 相談リンク（ボタン） --- */
.lr-consultation__link {
    align-self: flex-start;
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    padding: var(--lr-space-2xs) var(--lr-space-md);
    font-size: var(--lr-font-sm);
    font-weight: var(--lr-weight-bold);
    color: var(--lr-white);
    background-color: var(--lr-accent);
    border-radius: var(--lr-radius);
    text-decoration: none;
    transition: background-color var(--lr-ease);
}

.lr-consultation__link:hover,
.lr-consultation__link:focus-visible {
    background-color: var(--lr-accent-ink);
    text-decoration: none;
}

/* =========================================================
 * タブレット以上：カードを横組みに（左=日付＋メタ / 右=ボタン）
 * ======================================================= */
@media (min-width: 600px) {

    .lr-consultation__item {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        gap: var(--lr-space-md);
    }

    .lr-consultation__body {
        flex: 1 1 auto;
    }

    .lr-consultation__link {
        align-self: center;
        flex: 0 0 auto;
    }
}