/* 収集希望日 カレンダーコンポーネント（予約サイト・変更画面の共通） */
.cdp-wrapper {
    margin: 8px 0;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    background: #fff;
    overflow: hidden;
}

.cdp-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 10px 14px;
    background: #f3f4f6;
    border-bottom: 1px solid #e5e7eb;
}

.cdp-nav-btn {
    background: #fff;
    border: 1px solid #d1d5db;
    color: #1f2937;
    border-radius: 6px;
    padding: 4px 10px;
    font-size: 14px;
    cursor: pointer;
    min-width: 44px;
}

.cdp-nav-btn:hover {
    background: #e5e7eb;
}

.cdp-nav-btn:disabled {
    opacity: 0.35;
    cursor: not-allowed;
}

.cdp-title {
    flex: 1;
    text-align: center;
    font-size: 16px;
    font-weight: 700;
}

.cdp-legend {
    display: flex;
    gap: 10px;
    padding: 6px 14px;
    background: #fafafa;
    font-size: 11px;
    color: #4b5563;
    flex-wrap: wrap;
}

.cdp-legend-item {
    display: flex;
    align-items: center;
    gap: 4px;
}

.cdp-legend-swatch {
    display: inline-block;
    width: 14px;
    height: 14px;
    border-radius: 3px;
    border: 1px solid #ccc;
}

.cdp-legend-swatch.avail { background: #e3f2fd; }
.cdp-legend-swatch.selected { background: #2196f3; }
.cdp-legend-swatch.past { background: #f5f5f5; }
.cdp-legend-swatch.closed { background: #fef3c7; }
.cdp-legend-swatch.unavail { background: #f5f5f5; color: #999; }
.cdp-legend-swatch.full { background: #ffebee; }

.cdp-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 2px;
    background: #e5e7eb;
    padding: 2px;
}

.cdp-dow {
    background: #333;
    color: #fff;
    padding: 8px 4px;
    text-align: center;
    font-weight: bold;
    font-size: 13px;
}

.cdp-dow.sun { background: #d32f2f; }
.cdp-dow.sat { background: #1976d2; }

.cdp-day {
    background: #fff;
    min-height: 54px;
    padding: 6px 4px;
    position: relative;
    font-size: 14px;
    color: #1f2937;
}

.cdp-day .cdp-num {
    font-weight: 600;
}

.cdp-day.other-month {
    background: #fafafa;
    color: #d1d5db;
}

.cdp-day.today {
    background: #fff3cd !important;
}
.cdp-day.today .cdp-num {
    background: transparent;
    border-radius: 0;
    padding: 0;
    color: #b45309;
    font-weight: 700;
    position: relative;
    z-index: 2;
}
.cdp-day .cdp-today-label {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 4px;
    text-align: center;
    color: #92400e;
    font-weight: 800;
    font-size: 11px;
    letter-spacing: 0.5px;
    pointer-events: none;
    z-index: 1;
}

.cdp-day.past {
    background: #f5f5f5;
    color: #9ca3af;
}

.cdp-day.unavailable {
    background: #f5f5f5;
    color: #9ca3af;
    cursor: not-allowed;
}

/* 受付期間内だが非公開日（白背景で「期間内だが予約不可」を表現） */
.cdp-day.in-range-blank {
    background: #ffffff;
    color: #9ca3af;
    cursor: not-allowed;
}

/* G-17.D: M09 由来の明示的な休業日（祝日・年末年始等） */
.cdp-day.closed {
    background: #fef3c7;
    color: #92400e;
    cursor: not-allowed;
}

.cdp-day.full {
    background: #ffebee;
    color: #c62828;
    cursor: not-allowed;
}

.cdp-day.available {
    background: #e3f2fd;
    cursor: pointer;
}

.cdp-day.available:hover {
    background: #bbdefb;
}

.cdp-day.selected {
    background: #2196f3;
    color: #fff;
}

.cdp-day .cdp-meta {
    font-size: 10px;
    color: inherit;
    opacity: 0.75;
    margin-top: 2px;
}

/* 選択可能な日のチェックボックス風マーク */
.cdp-day .cdp-check {
    display: block;
    width: 20px;
    height: 20px;
    margin: 4px auto 0;
    border: 2px solid #2563eb;
    border-radius: 4px;
    background: #fff;
    position: relative;
    transition: background 0.12s ease, border-color 0.12s ease;
}
.cdp-day.available:hover .cdp-check {
    background: #dbeafe;
}
.cdp-day.selected .cdp-check {
    background: #ffffff;
    border-color: #ffffff;
}
.cdp-day.selected .cdp-check::after {
    content: '';
    position: absolute;
    left: 5px;
    top: 0px;
    width: 6px;
    height: 12px;
    border: solid #2196f3;
    border-width: 0 3px 3px 0;
    transform: rotate(45deg);
}

.cdp-unresolved {
    padding: 16px;
    background: #fef2f2;
    color: #991b1b;
    text-align: center;
    font-weight: 600;
}

.cdp-loading {
    text-align: center;
    padding: 24px;
    color: #6b7280;
}

.cdp-error-message {
    color: #b91c1c;
    font-size: 13px;
    margin-top: 6px;
}

/* エラーカード（収集希望日未選択など） */
.cdp-error-card {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 10px;
    padding: 14px 18px;
    background: #fee2e2;
    border: 2px solid #dc2626;
    border-radius: 8px;
    color: #7f1d1d;
    font-size: 16px;
    font-weight: 700;
}
.cdp-error-card[hidden] {
    display: none;
}
.cdp-error-icon {
    flex-shrink: 0;
    font-size: 22px;
    color: #dc2626;
}
.cdp-error-text {
    flex: 1;
}

.cdp-selected-display {
    display: none; /* 旧表示は使用しない。cdp-success-card に統合 */
}

/* 成功カード（収集希望日 選択済み） — エラーカードと同サイズで青系 */
.cdp-success-card {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 10px;
    padding: 14px 18px;
    background: #dbeafe;
    border: 2px solid #2563eb;
    border-radius: 8px;
    color: #1e3a8a;
    font-size: 16px;
    font-weight: 700;
}
.cdp-success-card[hidden] {
    display: none;
}
.cdp-success-icon {
    flex-shrink: 0;
    font-size: 22px;
    color: #2563eb;
}
.cdp-success-text {
    flex: 1;
}

@media (max-width: 600px) {
    .cdp-day { min-height: 44px; font-size: 12px; padding: 4px 2px; }
    .cdp-dow { font-size: 11px; padding: 6px 2px; }
    .cdp-title { font-size: 14px; }
    .cdp-legend { font-size: 10px; gap: 6px; }
    .cdp-day .cdp-x { font-size: 14px; }
}

/* T144: 受付期間内だが選べない日(満了/休業/不可曜日・大田の指定曜日以外/非公開)に✕を表示。
   クリック不可は JS 側で担保(.cdp-day.available のみ click を付与)。 */
.cdp-day .cdp-x {
    color: #c0392b;
    font-weight: 700;
    font-size: 16px;
    line-height: 1;
    text-align: center;
    margin-top: 2px;
}
.cdp-day.full,
.cdp-day.closed,
.cdp-day.unavailable,
.cdp-day.in-range-blank {
    cursor: not-allowed;
}