/* 新規イベント行 */
    .new-event-row {
    margin-bottom: 12px;
    }

/* カレンダー全体 */

    /* ★ 日ごとカラムを横に並べるコンテナ */
    #cal {
        display: flex;
        gap: 12px;
        align-items: flex-start;
        overflow-x: auto;          /* 横スクロール */
        padding-bottom: 8px;
    }

    /* スクロールバーを少し細く（対応ブラウザのみ） */
    #cal::-webkit-scrollbar {
        height: 8px;
    }
    #cal::-webkit-scrollbar-track {
        background: #e5e7eb;
    }
    #cal::-webkit-scrollbar-thumb {
        background: #9ca3af;
        border-radius: 999px;
    }


    /* 日ごとカラム */
    .day {
        min-width: 260px;          /* 1カラムの幅 */
        max-width: 320px;
        flex: 0 0 auto;            /* 幅固定で横に並べる */
        background: #eef2ff;
        border-radius: 16px;
        padding: 8px 8px 10px;
        box-shadow: 0 2px 8px rgba(0,0,0,.08);
        box-sizing: border-box;
    }

    /* 今日のカラムだけちょっと強調 */
    .day.today {
        border: 2px solid #ff6b81;
        padding: 6px 6px 8px;  /* 枠線分だけ内側少し縮める */
    }

/* calendar 専用の「意味づけ・強調」 */


    /* 予定イベント専用 */
    /* ---------- 予定(tt_events) 用カード ---------- */
    .block.event-block {
        border-left-color: #ccc; /* 初期値（後でJSで上書き） */
        background: #fff;        /* デフォルト背景（後でJS上書き） */
        color: #000; /* 全体の文字色を黒に */
    }

    .block.event-block .title {
        color: #000; /* 黒に戻した */
    }
    .badge.event-badge {
        background: #ff6b81;
        color: #fff;
    }

    /* タグピル（calendar 専用表現） */
    
    .tag-pill {
        font-size: .75rem;
        padding: 2px 6px;
        border-radius: 999px;
        background: #fee2e2;
        color: #7f1d1d;
        white-space: nowrap;
    }


/* common / calendar の境界が曖昧なもの */
    h1 {
        font-size: 1.4rem;
        margin-bottom: 8px;
    }
    



    #message {
        margin-bottom: 8px;
        color: #666;
        font-size: .9rem;
    }

    @media (max-width: 480px) {
        body { margin: 10px; }
        .day { min-width: 240px; }
    }

/* そのほか */
    .day-header {
        margin-bottom: 6px;
        padding: 4px 6px 6px;
        border-bottom: 1px solid #c7d2fe;
    }

    .day-header-main {
        font-size: 1.0rem;
        font-weight: 700;
    }

    .day-header-sub {
        font-size: .8rem;
        color: #6b7280;
    }