/* Planner Routines — habits sidebar + calendar + entry list + modal.
   Tokens from .t-body (today.css); shared layout from planner.css (.p-*). */

/* Narrow habits column, wide calendar/entries (Nexus-style). */
.p-routines {
  grid-template-columns: minmax(14rem, 17.5rem) minmax(0, 1fr);
}
@media (max-width: 1000px) {
  .p-routines { grid-template-columns: minmax(0, 1fr); }
}

.p-routines .p-card--selected {
  border-color: #4553a8;
  background: rgba(139, 156, 247, .08);
  box-shadow: 0 0 0 1px rgba(139, 156, 247, .22);
}
.p-routines .pr-habit-card__hit { text-decoration: none; }
.p-routines .pr-habit-card:hover .p-card__title { color: #fff; }

/* —— Calendar —— */
.pr-cal-section { overflow: hidden; }
.pr-cal { display: flex; flex-direction: column; gap: .45rem; }
.pr-cal__hint { margin-top: .55rem; }

.pr-cal__weekdays,
.pr-cal__cells {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: .3rem;
}
.pr-cal__weekday {
  text-align: center;
  font-size: .7rem;
  font-weight: 600;
  letter-spacing: .04em;
  color: var(--t-dim);
  padding: .35rem 0 .15rem;
}
.pr-cal__weekday--sun { color: var(--t-red); }
.pr-cal__weekday--sat { color: var(--t-blue); }

.pr-cal__cell {
  position: relative;
  min-height: 4.75rem;
  border: 1px solid var(--t-line);
  border-radius: 10px;
  background: var(--t-panel-2);
  padding: .4rem .4rem .35rem;
  display: flex;
  flex-direction: column;
  gap: .25rem;
  transition: border-color .12s ease, background-color .12s ease, box-shadow .12s ease;
}
.pr-cal__cell--interactive { cursor: pointer; }
.pr-cal__cell--interactive:hover,
.pr-cal__cell--interactive:focus-visible {
  border-color: #4553a8;
  background: #1c1c24;
  box-shadow: 0 0 0 1px rgba(139, 156, 247, .18);
  outline: none;
}
.pr-cal__cell--today {
  border-color: var(--t-accent);
  box-shadow: inset 0 0 0 1px rgba(139, 156, 247, .35);
}
.pr-cal__cell--out { opacity: .28; pointer-events: none; }
.pr-cal__cell--future { opacity: .42; }
.pr-cal__cell--good { background: rgba(74, 222, 128, .11); }
.pr-cal__cell--mid { background: rgba(250, 204, 21, .11); }
.pr-cal__cell--bad { background: rgba(248, 113, 113, .11); }
.pr-cal__cell--interactive.pr-cal__cell--good:hover { background: rgba(74, 222, 128, .16); }
.pr-cal__cell--interactive.pr-cal__cell--mid:hover { background: rgba(250, 204, 21, .16); }
.pr-cal__cell--interactive.pr-cal__cell--bad:hover { background: rgba(248, 113, 113, .16); }

.pr-cal__day {
  font-size: .8rem;
  font-weight: 650;
  color: #e4e4e7;
  font-variant-numeric: tabular-nums;
  line-height: 1.2;
}
.pr-cal__day--sun { color: var(--t-red); }
.pr-cal__day--sat { color: var(--t-blue); }
.pr-cal__day--today { color: var(--t-accent); }

.pr-cal__pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  align-self: flex-start;
  max-width: 100%;
  margin-top: auto;
  padding: .18rem .45rem;
  border-radius: 6px;
  font-size: .68rem;
  font-weight: 650;
  line-height: 1.25;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  border: 0;
}
.pr-cal__pill--red {
  color: #fecaca;
  background: rgba(248, 113, 113, .22);
}
.pr-cal__pill--green {
  color: #bbf7d0;
  background: rgba(74, 222, 128, .22);
}
.pr-cal__pill--yellow {
  color: #fef08a;
  background: rgba(250, 204, 21, .2);
}

.pr-cal__empty {
  margin-top: auto;
  align-self: flex-start;
  width: 1.15rem;
  height: 1.15rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 5px;
  border: 1px dashed var(--t-line);
  color: var(--t-faint);
  font-size: .72rem;
  line-height: 1;
  opacity: 0;
  transition: opacity .12s ease;
}
.pr-cal__cell--interactive:hover .pr-cal__empty,
.pr-cal__cell--interactive:focus-visible .pr-cal__empty { opacity: 1; }

.pr-cal__ratio {
  margin-top: auto;
  font-size: .7rem;
  font-weight: 600;
  color: var(--t-dim);
  font-variant-numeric: tabular-nums;
}
.pr-cal__dots { display: flex; flex-wrap: wrap; gap: .18rem; }
.pr-cal__dot {
  width: .4rem; height: .4rem; border-radius: 50%; background: var(--t-gray);
}
.pr-cal__dot--red { background: var(--t-red); }
.pr-cal__dot--green { background: var(--t-green); }
.pr-cal__dot--yellow { background: var(--t-yellow); }

/* 전체 보기: habit emoji in round tier-colored badges, ordered by sort_order */
.pr-cal__badges {
  margin-top: auto;
  display: flex;
  flex-wrap: wrap;
  gap: .22rem;
  align-items: center;
}
.pr-cal__badge {
  width: 1.35rem;
  height: 1.35rem;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: .72rem;
  line-height: 1;
  flex: none;
  border: 1px solid transparent;
}
.pr-cal__badge--red {
  background: rgba(248, 113, 113, .28);
  border-color: rgba(248, 113, 113, .35);
}
.pr-cal__badge--yellow {
  background: rgba(250, 204, 21, .28);
  border-color: rgba(250, 204, 21, .35);
}
.pr-cal__badge--green {
  background: rgba(74, 222, 128, .28);
  border-color: rgba(74, 222, 128, .35);
}

@media (max-width: 720px) {
  .pr-cal__cell { min-height: 3.6rem; padding: .3rem .28rem; border-radius: 8px; }
  .pr-cal__day { font-size: .74rem; }
  .pr-cal__pill { font-size: .62rem; padding: .12rem .32rem; }
  .pr-cal__badge { width: 1.15rem; height: 1.15rem; font-size: .62rem; }
  .pr-cal__weekdays, .pr-cal__cells { gap: .2rem; }
}

/* —— Entry list (under calendar) —— */
.pr-entries__list {
  list-style: none; margin: 0; padding: 0;
  display: flex; flex-direction: column;
}
.pr-entries__row {
  display: flex; align-items: baseline; gap: .55rem; flex-wrap: wrap;
  padding: .45rem .15rem;
  border-top: 1px solid var(--t-line);
  font-size: .85rem;
}
.pr-entries__row:first-child { border-top: 0; padding-top: .15rem; }
.pr-entries__row--interactive {
  cursor: pointer; border-radius: 8px; margin: 0 -.25rem; padding-left: .4rem; padding-right: .4rem;
}
.pr-entries__row--interactive:hover,
.pr-entries__row--interactive:focus-visible {
  background: rgba(139, 156, 247, .07);
  outline: none;
}
.pr-entries__date {
  color: var(--t-dim);
  min-width: 3.6rem;
  font-variant-numeric: tabular-nums;
  font-weight: 600;
}
.pr-entries__wday { color: var(--t-faint); font-weight: 500; margin-left: .1rem; }
.pr-entries__habit {
  color: var(--t-dim); font-size: .8rem; min-width: 5rem; white-space: nowrap;
}
.pr-entries__note {
  color: var(--t-dim); min-width: 0; flex: 1 1 8rem;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

/* —— Entry modal —— */
.pr-entry {
  width: min(24rem, calc(100vw - 2rem));
}
.pr-entry__form { gap: .9rem; padding: 1.15rem 1.15rem 1rem; }
.pr-entry__hero {
  display: flex; align-items: center; gap: .75rem;
  padding-bottom: .15rem;
}
.pr-entry__emoji {
  flex: none;
  width: 2.75rem; height: 2.75rem;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 12px;
  background: var(--t-panel-2);
  border: 1px solid var(--t-line);
  font-size: 1.45rem; line-height: 1;
}
.pr-entry__hero-text { min-width: 0; display: flex; flex-direction: column; gap: .1rem; }
.pr-entry__date { margin: 0; color: var(--t-dim); font-size: .82rem; font-variant-numeric: tabular-nums; }

.pr-entry__scores {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(5.2rem, 1fr));
  gap: .45rem;
}
.pr-entry__score {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: .2rem; min-height: 3.6rem; padding: .55rem .4rem; cursor: pointer;
  border-radius: 10px; border: 1px solid var(--t-line);
  background: var(--t-panel-2); color: inherit;
  transition: border-color .12s ease, background-color .12s ease, box-shadow .12s ease;
}
.pr-entry__score:hover { border-color: #3f3f48; background: #1e1e24; }
.pr-entry__score:focus-visible { outline: 2px solid var(--t-accent); outline-offset: 1px; }
.pr-entry__score--red { color: var(--t-red); border-color: rgba(248, 113, 113, .28); background: rgba(248, 113, 113, .08); }
.pr-entry__score--green { color: var(--t-green); border-color: rgba(74, 222, 128, .28); background: rgba(74, 222, 128, .08); }
.pr-entry__score--yellow { color: var(--t-yellow); border-color: rgba(250, 204, 21, .28); background: rgba(250, 204, 21, .08); }
.pr-entry__score--active {
  box-shadow: 0 0 0 2px currentColor;
  background: color-mix(in srgb, currentColor 16%, var(--t-panel-2));
}
.pr-entry__score-n { font-size: 1.2rem; font-weight: 700; line-height: 1; }
.pr-entry__score-l {
  font-size: .7rem; font-weight: 600; text-align: center;
  word-break: keep-all; line-height: 1.25; opacity: .92;
}
.pr-entry__note { min-height: 4.25rem; resize: vertical; }

.pr-entry__hint {
  margin-left: .35rem;
  font-size: .75rem;
  font-weight: 500;
  color: var(--t-muted);
}

.pr-entry__foot {
  margin-top: .15rem;
  padding-top: .15rem;
}
.pr-entry__foot .t-modal__actions { margin-left: auto; }
.t-btn--danger {
  border-color: rgba(248, 113, 113, .35);
  background: rgba(248, 113, 113, .12);
  color: var(--t-red);
}
.t-btn--danger:hover {
  border-color: rgba(248, 113, 113, .55);
  background: rgba(248, 113, 113, .2);
  color: #fecaca;
}


@media (max-width: 560px) {
  .pr-entry { width: 100%; max-width: 100%; border-radius: 14px 14px 0 0; }
  .pr-entry__scores { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pr-entry__foot .t-modal__actions .t-btn { padding: .55rem 1rem; }
}

/* —— Habit sidebar manage —— */
.pr-habits__meta {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
}
.pr-habits__add {
  width: 1.7rem;
  height: 1.7rem;
  font-size: 1.05rem;
  line-height: 1;
  flex: none;
}
.pr-habit-card {
  position: relative;
}
.pr-habit-card__hit {
  position: absolute;
  inset: 0;
  z-index: 0;
  border-radius: inherit;
}
.pr-habit-card__head {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .35rem;
  pointer-events: none; /* stretch-link receives title/padding clicks */
}
.pr-habit-card__head .p-card__title {
  flex: 1 1 auto;
  min-width: 0;
}
.pr-habit-card__edit {
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--t-dim);
  cursor: pointer;
  padding: .2rem;
  border-radius: 6px;
  opacity: .55;
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.55rem;
  height: 1.55rem;
  pointer-events: auto; /* edit stays clickable above stretch-link */
  position: relative;
  z-index: 2;
  transition: opacity .12s ease, color .12s ease, background-color .12s ease;
}
.pr-habit-card__edit-icon {
  display: block;
  pointer-events: none;
}
.pr-habit-card:hover .pr-habit-card__edit,
.pr-habit-card:focus-within .pr-habit-card__edit,
.p-card--selected .pr-habit-card__edit { opacity: 1; }
.pr-habit-card__edit:hover,
.pr-habit-card__edit:focus-visible {
  color: #e4e4e7;
  background: rgba(255, 255, 255, .06);
  outline: none;
}
.pr-habit-card__counts {
  position: relative;
  z-index: 1;
  display: flex;
  flex-wrap: wrap;
  gap: .2rem .45rem;
  color: var(--t-dim);
  font-size: .78rem;
  line-height: 1.35;
  pointer-events: none;
  margin-top: .1rem;
}
.pr-habit-card__count { white-space: nowrap; }

/* —— Habit CRUD modal —— */
.pr-habit {
  width: min(26rem, calc(100vw - 2rem));
}
.pr-habit__form { gap: .85rem; padding: 1.15rem 1.15rem 1rem; }
.pr-habit__row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: .6rem;
}
.pr-habit__criteria {
  display: flex;
  flex-direction: column;
  gap: .4rem;
}
.pr-habit__criteria-row {
  display: grid;
  grid-template-columns: 3.25rem minmax(0, 1fr) 5.25rem;
  align-items: center;
  gap: .45rem;
}
.pr-habit__criteria-tier {
  padding: .4rem .45rem;
  font-size: .78rem;
}
.pr-habit__criteria-score {
  font-size: .72rem;
  font-weight: 600;
  color: var(--t-dim);
  font-variant-numeric: tabular-nums;
}
.pr-habit__active {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  color: var(--t-dim);
  font-size: .82rem;
  cursor: pointer;
  user-select: none;
}
.pr-habit__active input { accent-color: var(--t-accent); }
.pr-habit__foot .t-modal__actions { margin-left: auto; }

@media (max-width: 560px) {
  .pr-habit { width: 100%; max-width: 100%; border-radius: 14px 14px 0 0; }
  .pr-habit__row { grid-template-columns: 1fr; }
  .pr-habit__criteria-row { grid-template-columns: 2.75rem minmax(0, 1fr) 4.75rem; gap: .3rem; }
  .pr-habit__foot .t-modal__actions .t-btn { padding: .55rem 1rem; }
}