/* ============================================================
   lesson-calendar.css
   添付デザイン準拠: ゴールド × クリーム
   ============================================================ */

/* ---------- CSS 変数 ---------- */
.lc-inner {
  --lc-gold: #cab956;
  --lc-gold-hover: #cab956;
  --lc-cream: #f8f5ec;
  --lc-gray-cell: #e9e6de;
  --lc-gray-txt: #c0bbb4;
  --lc-border: #b7a747;
  --lc-text: #402626;
  --lc-muted: #888078;
  --lc-white: #ffffff;
}

/* ============================================================
   ラッパー（.lc-inner は p-cookingEvent_body 直下の子として機能）
   ============================================================ */
.lc-inner {
  display: contents; /* 親の flex/grid レイアウトに干渉しない */
}

.lc-loading {
  opacity: 0.45;
  pointer-events: none;
  transition: opacity 0.2s;
}

/* ============================================================
   LEFT : カレンダーパネル
   ============================================================ */

/* ---- ヘッダー ---- */
.lc-cal-header {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 14px;
  flex-wrap: wrap;
}

.lc-ym {
  font-size: 25px;
  font-weight: 700;
  color: var(--lc-text);
  margin: 0;
}
.lc-ym__year {
  font-weight: 700;
}

/* ナビゲーションボタン */
.lc-nav {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border: none;
  border-radius: 50%;
  background: var(--lc-gold);
  color: var(--lc-white);
  font-size: 20px;
  cursor: pointer;
  transition: background 0.18s;
  flex-shrink: 0;
  padding: 0;
}
.lc-nav:hover {
  background: var(--lc-gold-hover);
}
.lc-nav.is-disabled {
  background: var(--lc-gray-cell);
  color: var(--lc-gray-txt);
  pointer-events: none;
}

/* 凡例 */
.lc-legend {
  display: flex;
  gap: 30px;
  list-style: none;
  margin: 0 0 0 auto;
  padding: 0;
  font-size: 13px;
  align-items: center;
}
.lc-legend li {
  display: flex;
  align-items: center;
  gap: 10px;
}
.lc-legend__swatch {
  display: inline-block;
  width: 20px;
  height: 20px;
  flex-shrink: 0;
}
.lc-legend__swatch--open {
  border: 1px solid var(--lc-border);
}
.lc-legend__swatch--close {
  background: var(--lc-gray-cell);
}
.lc-legend__swatch--event {
  background: var(--lc-gold);
}

/* ---- グリッド ---- */
.lc-grid {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
}
.lc-grid thead th {
  text-align: center;
  font-size: 15px;
  border: 1px solid var(--lc-border);
  height: 49px;
}
.lc-grid tbody td {
  border: 1px solid var(--lc-border);
  height: 69px;
  text-align: center;
  vertical-align: middle;
  font-size: 20px;
  cursor: pointer;
  transition:
    background 0.14s,
    outline 0.1s;
}

/* 空セル */
.lc-cell--empty {
  background: transparent !important;
}

/* 過去日 */
.lc-cell--past {
  background: var(--lc-gray-cell) !important;
  color: var(--lc-gray-txt);
}

/* 今日 */
/* .lc-cell--today {
  outline: 2px solid var(--lc-gold);
  outline-offset: -2px;
} */

/* イベントあり */
.lc-cell--event {
  background: var(--lc-gold) !important;
  color: var(--lc-white);
  cursor: pointer;
}
.lc-cell--event:hover,
.lc-cell--event:focus {
  background: var(--lc-gold-hover) !important;
  outline: none;
}

/* 選択中 */
.lc-cell.is-selected {
  outline: 2px solid var(--lc-border);
  outline-offset: -2px;
}

/* ============================================================
   RIGHT : イベントパネル
   ============================================================ */
.p-cookingEvent_body-right {
  padding-top: 4px;
}

/* 日付ラベル "3.18 WED" */
.lc-event__date {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 18px;
  font-weight: 700;
  color: var(--lc-text, #3a3530);
}
.lc-event__date-num {
  font-size: 25px;
}
.lc-event__date-num span {
  font-size: 25px;
}
.lc-event__date-dow {
  font-size: 12px;
  border: 1px solid var(--lc-gold);
  padding: 0px 6px;
  font-weight: 400;
}

/* イベント1件 */
.lc-event__item {
  border-top: 1px solid var(--lc-gold);
  padding: 20px 0;
}
.lc-event__item:last-child {
  border-bottom: 1px solid var(--lc-gold);
}

/* 時間 */
.lc-event__time {
  display: flex;
  gap: 10px;
  font-size: 15px;
  margin-bottom: 10px;
  line-height: calc(23 / 15);
}
.lc-event__time-icon {
  margin-top: 2px;
  display: inline-block;
  width: 18px;
  height: 18px;
  flex-shrink: 0;
  background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9.70677 18.9135C14.7915 18.9135 18.9135 14.7915 18.9135 9.70677C18.9135 4.62201 14.7915 0.5 9.70677 0.5C4.62201 0.5 0.5 4.62201 0.5 9.70677C0.5 14.7915 4.62201 18.9135 9.70677 18.9135Z' stroke='%23231815' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M9.70679 4.58252V10.7068H14.7057' stroke='%23402626' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-size: contain;
  background-repeat: no-repeat;
}

/* タイトル */
.lc-event__title {
  font-size: 17px;
  line-height: 1.8;
  font-weight: 700;
}
@media screen and (max-width: 736px) {
  .lc-event__title {
    font-size: 16px;
  }
}

.lc-event__title a {
  display: block;
  color: inherit;
  text-decoration: none;
}
.lc-event__title a:hover {
  text-decoration: underline;
}

/* イベントなし */
.lc-event__empty {
  font-size: 15px;
  padding: 20px 0;
  border-top: 1px solid #e0d8c4;
  border-bottom: 1px solid #e0d8c4;
}

/* 一覧ボタン */
.lc-event__more {
  display: flex;
  align-items: center;
  gap: 10px;
  width: fit-content;
  margin-left: auto;
  margin-top: 20px;
  padding: 18px 32px 15px;
  border: 2px solid #cab956;
  border-radius: 30px;
  font-size: 13px;
  line-height: 1;
  font-weight: 700;
  color: #cab956;
  text-decoration: none;
  transition:
    background-color 0.35s,
    color 0.35s;
  background-color: var(--lc-white);
}
.lc-event__more:hover {
  background-color: #cab956;
  color: #fff;
}

/* ============================================================
   レスポンシブ
   ============================================================ */
@media (max-width: 768px) {
  .p-cookingEvent_body {
    flex-direction: column;
  }
  .lc-grid tbody td {
    height: 40px;
    font-size: 0.8rem;
  }
  .lc-legend {
    margin-left: 0;
    width: 100%;
  }
  .lc-event__more {
    margin-right: auto;
  }
}

/* lesson-calendar.css に追加 */
.lc-cell--close {
  background: var(--lc-gray-cell) !important;
}
