/* 디자인 0번 — 기본 (깔끔한 처음 디자인).
   :root 에도 걸어 두어, data-theme 이 없거나 모르는 값일 때 이 값으로 보인다. */

:root,
:root[data-theme="basic"] {
  /* 색 */
  --bg: #ffffff;
  --text: #1f2328;
  --muted: #6a6e73; /* 대비 4.5 이상 (흰 바탕 5.1, 버튼 바탕 4.6) — 처음 값 #9aa0a6 */
  --line: #e3e6ea;
  --sun: #d93025;
  --sat: #1a73e8;
  --today-bg: #1a73e8;
  --today-text: #ffffff;
  --done: #188038;
  --btn-bg: #f1f3f4;
  --btn-text: #1f2328;
  --btn-pressed-bg: #dadce0;
  --shadow: rgba(0, 0, 0, 0.15);

  /* 글꼴 */
  --font-body: system-ui, -apple-system, "Segoe UI", "Malgun Gothic", "Apple SD Gothic Neo", sans-serif;
  --font-title: var(--font-body);
  --font-num: var(--font-body);
  --title-size: 1.6rem;
  --title-weight: 700;
  --weekday-size: 0.9rem;
  --weekday-weight: 600;
  --day-size: 1rem;
  --today-weight: 700;

  /* 모양 */
  --unit: 4px;
  --line-width: 1px;
  --radius: 8px;
  --today-radius: 50%;
  --done-width: 2px;

  /* 계획 색 0~11 (뜻: 0 빨강 1 주황 2 노랑 3 연두 4 초록 5 청록 6 하늘 7 파랑 8 보라 9 자주 10 분홍 11 회색) */
  --plan-0: #f8c9c4;
  --plan-0-text: #7a1f17;
  --plan-1: #fbd8b5;
  --plan-1-text: #7a3d0a;
  --plan-2: #f9eaa6;
  --plan-2-text: #6b5300;
  --plan-3: #dcefb8;
  --plan-3-text: #3f5a12;
  --plan-4: #bfe5c9;
  --plan-4-text: #1f5c34;
  --plan-5: #b9e6e0;
  --plan-5-text: #145a52;
  --plan-6: #c3e3f6;
  --plan-6-text: #15506f;
  --plan-7: #c8d6f7;
  --plan-7-text: #213f8a;
  --plan-8: #dccdf5;
  --plan-8-text: #4a2f86;
  --plan-9: #efc6e6;
  --plan-9-text: #6e2464;
  --plan-10: #f9cfdc;
  --plan-10-text: #7d2346;
  --plan-11: #dde0e4;
  --plan-11-text: #3c4249;
}

@media (prefers-color-scheme: dark) {
  :root,
  :root[data-theme="basic"] {
    --bg: #17191c;
    --text: #e8eaed;
    --muted: #979ca1; /* 대비 4.5 이상 (바탕 6.4, 버튼 바탕 4.6) — 처음 값 #6b7178 */
    --line: #2f3338;
    --sun: #f28b82;
    --sat: #8ab4f8;
    --today-bg: #8ab4f8;
    --today-text: #17191c;
    --done: #81c995;
    --btn-bg: #2f3338;
    --btn-text: #e8eaed;
    --btn-pressed-bg: #3c4043;
    --shadow: rgba(0, 0, 0, 0.5);

    /* 계획 색 0~11 (뜻: 0 빨강 1 주황 2 노랑 3 연두 4 초록 5 청록 6 하늘 7 파랑 8 보라 9 자주 10 분홍 11 회색) */
    --plan-0: #d39992;
    --plan-0-text: #43110d;
    --plan-1: #d3b392;
    --plan-1-text: #432206;
    --plan-2: #d3c792;
    --plan-2-text: #3b2e00;
    --plan-3: #bcd392;
    --plan-3-text: #23320a;
    --plan-4: #92d3a3;
    --plan-4-text: #11331d;
    --plan-5: #92d3ca;
    --plan-5-text: #0b322d;
    --plan-6: #92bbd3;
    --plan-6-text: #0c2c3d;
    --plan-7: #92a6d3;
    --plan-7-text: #12234c;
    --plan-8: #aa92d3;
    --plan-8-text: #291a4a;
    --plan-9: #d392c5;
    --plan-9-text: #3d1437;
    --plan-10: #d392a6;
    --plan-10-text: #451327;
    --plan-11: #aeb2b7;
    --plan-11-text: #212428;
  }
}

@media (max-width: 420px) {
  :root,
  :root[data-theme="basic"] {
    --title-size: 1.3rem;
    --day-size: 0.9rem;
  }
}

/* ======================================================================
   M3 루틴 부품 — 기본 꾸미기 + 4번 그리너리 (구조는 base.css 개발자 M3 구역)
   ====================================================================== */

:root[data-theme="basic"] .routine-item-open:hover,
:root[data-theme="greenery"] .routine-item-open:hover,
:root[data-theme="basic"] .weekday-check:hover,
:root[data-theme="greenery"] .weekday-check:hover {
  background: var(--btn-bg);
}

:root[data-theme="basic"] .weekday-check:has(input:checked),
:root[data-theme="greenery"] .weekday-check:has(input:checked) {
  background: var(--btn-bg);
  font-weight: 600;
}

/* ======================================================================
   M4 미완료 넘기기 부품 — 기본 꾸미기 + 4번 그리너리 (구조는 base.css 개발자 M4 구역)
   ====================================================================== */

/* 넘김 기록: 흐림 + 점선 테두리 (지나간 자리 느낌) */
:root[data-theme="basic"] .plan.carried,
:root[data-theme="greenery"] .plan.carried,
:root[data-theme="basic"] .unscheduled-item.carried,
:root[data-theme="greenery"] .unscheduled-item.carried {
  border-style: dashed;
}

:root[data-theme="basic"] .unscheduled-title,
:root[data-theme="greenery"] .unscheduled-title {
  font-weight: 600;
}

/* ======================================================================
   F12 공휴일 — 기본 꾸미기 + 4번 그리너리 (구조는 base.css 개발자 F12 구역)
   ====================================================================== */

:root[data-theme="basic"] .holiday-name,
:root[data-theme="greenery"] .holiday-name,
:root[data-theme="basic"] .day-title-holiday,
:root[data-theme="greenery"] .day-title-holiday {
  font-weight: 600;
}

@media (max-width: 420px) {
  /* 휴대폰: "대체공휴일"(5글자)도 좁은 칸에 다 들어가게 */
  :root[data-theme="basic"] .holiday-name,
  :root[data-theme="greenery"] .holiday-name {
    font-size: 9px;
    letter-spacing: -0.05em;
  }
}