@charset "UTF-8";
/**
 * セミナー日程（ACF リピーター "nittei"）
 * - [seminar_schedule]     開催概要
 * - [seminar_date_select]  CF7 日程プルダウン
 * - [seminar_date_info]    CF7 選択中の日程
 *
 * 開催概要はセクション全体の枠・余白・背景を持たない。
 * 外側の囲みは Elementor 側（コンテナ／ショートコードウィジェット）で作る想定。
 */

/* -------------------------------------------------
 * 開催概要
 * ------------------------------------------------- */

/* ラッパーは見た目の指定を持たず、配色などのトークンだけを定義する */
.seminar-schedule {
    --seminar-accent: #0052A5;
    --seminar-label-bg: #f2f6fb;
    --seminar-text: #222;
    --seminar-muted: #777;
    --seminar-full: #ce0000;
    --seminar-border: #cdd6e0;
    --seminar-group-border: #0152a5;
    --seminar-label-width: 9em;
    --seminar-font-size: 1.0625rem;
}

/* 見出し。既定では出力されない（[seminar_schedule title="開催概要"] で表示） */
.seminar-schedule__title {
    display: flex;
    align-items: center;
    gap: .3em;
    margin: 0 0 .7em;
    color: var(--seminar-accent);
    font-size: 1.25em;
    font-weight: 700;
    line-height: 1.5;
}

.seminar-schedule__title-mark {
    font-size: .8em;
}

/* 会場ごとのブロック */
.seminar-schedule__group {
    margin: 0;
    border: solid 1px var(--seminar-group-border);
}

.seminar-schedule__group + .seminar-schedule__group {
    margin-top: 1.6em;
}

/* 1項目＝枠で囲んだ行。ラベル（左）と内容（右）
   ブロックの外周は .seminar-schedule__group の枠線が担当するため、
   項目側は下の区切り線だけを持つ */
.seminar-schedule__item {
    box-sizing: border-box;
    display: flex;
    align-items: stretch;
    margin: 0;
    border-bottom: 1px solid var(--seminar-border);
    color: var(--seminar-text);
    font-size: var(--seminar-font-size);
    line-height: 1.8;
}

.seminar-schedule__item:last-child {
    border-bottom: 0;
}

.seminar-schedule__label {
    box-sizing: border-box;
    flex: 0 0 var(--seminar-label-width);
    margin: 0;
    padding: .7em 1em;
    background: var(--seminar-label-bg);
    border-right: 1px solid var(--seminar-border);
    color: var(--seminar-accent);
    font-weight: 700;
    white-space: nowrap;
}

.seminar-schedule__value {
    box-sizing: border-box;
    flex: 1 1 auto;
    min-width: 0;
    margin: 0;
    padding: .7em 1.1em;
}

/* 開催日時の繰り返し */
.seminar-schedule__dates {
    margin: 0;
    padding: 0;
    list-style: none;
}

.seminar-schedule__date {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: .25em;
    margin: 0;
}

.seminar-schedule__date + .seminar-schedule__date {
    margin-top: .35em;
}

.seminar-schedule__marker {
    flex: 0 0 auto;
    color: var(--seminar-accent);
    line-height: 1;
}

.seminar-schedule__date-text {
    font-weight: 600;
}

.seminar-schedule__date.is-full .seminar-schedule__date-text {
    color: var(--seminar-muted);
}

/* 「満席」「残りN名」バッジ */
.seminar-schedule__status {
    flex: 0 0 auto;
    padding: .05em .7em;
    border-radius: 999px;
    background: #f0f0f0;
    color: #555;
    font-size: .8em;
    font-weight: 700;
    line-height: 1.7;
    white-space: nowrap;
}

.seminar-schedule__status.is-full {
    background: var(--seminar-full);
    color: #fff;
}

.seminar-schedule__empty {
    margin: 0;
    color: var(--seminar-muted);
}

/* スマホはラベルを上、内容を下に */
@media (max-width: 767px) {
    .seminar-schedule {
        --seminar-font-size: 1rem;
    }

    .seminar-schedule__item {
        flex-direction: column;
        line-height: 1.7;
    }

    .seminar-schedule__label {
        flex: 0 0 auto;
        padding: .5em 1em;
        border-right: 0;
        border-bottom: 1px solid var(--seminar-border);
    }

    .seminar-schedule__value {
        padding: .7em 1em;
    }
}

/* -------------------------------------------------
 * CF7 日程プルダウン
 * ------------------------------------------------- */
select.seminar-date-select {
    max-width: 100%;
    font-size: 1.0625rem;
}

/* 満席の日程はグレーアウト（Safari 等は color が効かないため opacity も指定） */
select.seminar-date-select option:disabled,
select.seminar-date-select option[data-full="1"] {
    color: #999;
    opacity: .6;
}

/* -------------------------------------------------
 * CF7 選択中の日程
 * ------------------------------------------------- */
.seminar-date-info {
    --seminar-accent: #0052A5;
    --seminar-border: #d8dee7;
    --seminar-label-width: 7em;

    box-sizing: border-box;
    margin: .9em 0 0;
    padding: 1.1em 1.3em;
    background: #f5f8fc;
    border: 1px solid var(--seminar-border);
    border-left: 4px solid var(--seminar-accent);
    border-radius: 4px;
    font-size: 1.0625rem;
    line-height: 1.8;
}

.seminar-date-info[hidden] {
    display: none;
}

.seminar-date-info__title {
    margin: 0 0 .4em;
    color: var(--seminar-accent);
    font-size: 1.05em;
    font-weight: 700;
}

.seminar-date-info__item {
    margin: 0;
}

.seminar-date-info__item[hidden] {
    display: none;
}

.seminar-date-info__row {
    display: flex;
    align-items: flex-start;
    gap: .5em;
    margin: 0;
}

.seminar-date-info__label {
    flex: 0 0 auto;
    min-width: var(--seminar-label-width);
    margin: 0;
    font-weight: 700;
    white-space: nowrap;
}

.seminar-date-info__value {
    flex: 1 1 auto;
    min-width: 0;
    margin: 0;
}

@media (max-width: 767px) {
    .seminar-date-info {
        padding: 1em 1.1em;
        font-size: 1rem;
    }

    .seminar-date-info__row {
        flex-direction: column;
        gap: .1em;
    }

    .seminar-date-info__row + .seminar-date-info__row {
        margin-top: .4em;
    }

    .seminar-date-info__label {
        min-width: 0;
    }
}
