/*
 * 1日の流れ：先輩ナースの1日とそろえるPOPタイムライン
 * 時計（.oneday_badge）と工程名（h4）を、同じ丸時計＋立体バッジの視覚言語に統一する。
 */
.oneday-pop {
  --oneday-ink: #17384a;
  --oneday-copy: #526a76;
}

.oneday-pop #tab_shougai {
  --ward-accent: #078b99;
  --ward-deep: #056a76;
  --ward-soft: #cceef0;
}

.oneday-pop #tab_kaifuku {
  --ward-accent: #79b92c;
  --ward-deep: #4e8518;
  --ward-soft: #e1f2c9;
}

.oneday-pop #tab_shougai .oneday_column_day {
  --shift-accent: #078b99;
  --shift-deep: #056a76;
  --shift-soft: #cceef0;
}

.oneday-pop #tab_shougai .oneday_column_night {
  --shift-accent: #6655a9;
  --shift-deep: #4c3d8e;
  --shift-soft: #ddd8f4;
}

.oneday-pop #tab_kaifuku .oneday_column_day {
  --shift-accent: #79b92c;
  --shift-deep: #4e8518;
  --shift-soft: #e1f2c9;
}

.oneday-pop #tab_kaifuku .oneday_column_night {
  --shift-accent: #df7c53;
  --shift-deep: #a85332;
  --shift-soft: #fae0d5;
}

/* POPタブ：どの病棟を開いているかをひと目で分かる色にする。 */
.oneday-pop .oneday_tab_area {
  max-width: 780px;
  margin: 34px auto 46px;
  padding: 8px;
  border: 1px solid #d9edf0;
  border-radius: 22px;
  background:
    radial-gradient(circle at 94% 20%, rgba(85, 203, 228, 0.2) 0 4px, transparent 4.5px),
    #ffffff;
  box-shadow: 0 12px 28px rgba(23, 56, 74, 0.08);
}

.oneday-pop .oneday_tab_area .tab_menu_list {
  gap: 9px;
}

.oneday-pop .oneday_tab_area .tab_menu_list .tab_item {
  display: flex;
  box-sizing: border-box;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  border: 1px solid transparent !important;
  background: #f5fafb !important;
  box-shadow: none !important;
  color: #55707a !important;
  font-weight: 700;
  text-align: center;
}

.oneday-pop .oneday_tab_area .tab_menu_list .tab_item[data-tab="tab_shougai"].active {
  border-color: #078b99 !important;
  background: #078b99 !important;
  color: #ffffff !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.14);
}

.oneday-pop .oneday_tab_area .tab_menu_list .tab_item[data-tab="tab_kaifuku"].active {
  border-color: #79b92c !important;
  background: #79b92c !important;
  color: #ffffff !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.14);
}

.oneday-pop .oneday_tab_area .tab_menu_list .tab_item[data-tab="tab_nurse_life"].active {
  border-color: #6655a9 !important;
  background: #6655a9 !important;
  color: #ffffff !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.14);
}

/* 各病棟のイントロを、淡いドット紙のヒーローにする。 */
.oneday-pop #tab_shougai,
.oneday-pop #tab_kaifuku {
  box-sizing: border-box;
  position: relative;
  margin: 0;
  padding: 1px clamp(18px, 3vw, 38px) clamp(32px, 5vw, 58px);
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--ward-accent) 20%, white);
  border-radius: 26px;
  background:
    radial-gradient(circle at 97% 11%, color-mix(in srgb, var(--ward-accent) 22%, transparent) 0 7px, transparent 7.5px),
    radial-gradient(circle at 94% 15%, color-mix(in srgb, var(--ward-accent) 13%, transparent) 0 13px, transparent 13.5px),
    linear-gradient(180deg, color-mix(in srgb, var(--ward-soft) 47%, white) 0%, #ffffff 34%);
}

.oneday-pop #tab_shougai .oneday_intro,
.oneday-pop #tab_kaifuku .oneday_intro {
  box-sizing: border-box;
  width: 100% !important;
  position: relative;
  z-index: 1;
  max-width: 920px;
  margin: clamp(26px, 4vw, 44px) auto clamp(30px, 5vw, 50px) !important;
  padding: clamp(22px, 4vw, 34px);
  border: 1px solid color-mix(in srgb, var(--ward-accent) 20%, white);
  border-radius: 20px;
  background:
    radial-gradient(circle, color-mix(in srgb, var(--ward-accent) 30%, transparent) 1.2px, transparent 1.8px) 2px 2px / 12px 12px,
    rgba(255, 255, 255, 0.88);
  box-shadow: 8px 9px 0 color-mix(in srgb, var(--ward-soft) 85%, white);
}

.oneday-pop #tab_shougai .oneday_intro::before,
.oneday-pop #tab_kaifuku .oneday_intro::before {
  display: inline-flex;
  margin-bottom: 10px;
  padding: 4px 10px;
  border: 1px solid color-mix(in srgb, var(--ward-accent) 27%, white);
  border-radius: 999px;
  background: color-mix(in srgb, var(--ward-soft) 48%, white);
  color: var(--ward-deep);
  font-family: Arial, sans-serif;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  content: "WARD SCHEDULE";
}

.oneday-pop #tab_shougai .oneday_intro::before {
  content: "DISABILITY WARD / SCHEDULE";
}

.oneday-pop #tab_kaifuku .oneday_intro::before {
  content: "RECOVERY WARD / SCHEDULE";
}

.oneday-pop #tab_shougai .oneday_intro h2,
.oneday-pop #tab_kaifuku .oneday_intro h2 {
  display: inline-block !important;
  box-sizing: border-box;
  width: auto !important;
  max-width: 100%;
  margin: 0 0 14px !important;
  padding: 0.42rem 0.95rem 0.48rem !important;
  border: 2px solid #ffffff !important;
  border-radius: 14px !important;
  background: rgba(255, 255, 255, 0.97) !important;
  box-shadow: 0.35rem 0.38rem 0 color-mix(in srgb, var(--ward-soft) 92%, white) !important;
  color: var(--oneday-ink) !important;
  font-size: clamp(1.4rem, 2.6vw, 2rem) !important;
  line-height: 1.5 !important;
  text-align: center !important;
  translate: none !important;
}

.oneday-pop #tab_shougai .oneday_intro h2::before,
.oneday-pop #tab_shougai .oneday_intro h2::after,
.oneday-pop #tab_kaifuku .oneday_intro h2::before,
.oneday-pop #tab_kaifuku .oneday_intro h2::after {
  display: none !important;
  content: none !important;
}

.oneday-pop #tab_shougai .oneday_intro .intro_text,
.oneday-pop #tab_kaifuku .oneday_intro .intro_text {
  display: inline-block;
  box-sizing: border-box;
  max-width: 100%;
  margin: 0 auto !important;
  padding: 0.55rem 0.9rem;
  border: 2px solid #ffffff;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0.25rem 0.3rem 0 color-mix(in srgb, var(--ward-soft) 86%, white);
  color: var(--oneday-copy);
  font-weight: 500;
}

.oneday-pop #tab_kaifuku .oneday_kaifuku_desc {
  max-width: 42rem;
  margin: 0 auto 15px;
  padding: 13px 17px;
  border: 1px dashed color-mix(in srgb, var(--ward-accent) 42%, white);
  outline: 2px solid #ffffff;
  outline-offset: -1px;
  border-radius: 13px;
  background: color-mix(in srgb, var(--ward-soft) 44%, white);
  color: #4f6d35;
  line-height: 1.75;
}

/* 日勤／夜勤のカラムタイトルも、各色のPOPな見出しに。 */
.oneday-pop .oneday_column_title {
  position: relative;
  overflow: hidden;
  margin-bottom: 28px;
  padding: 16px 24px;
  border: 1px solid color-mix(in srgb, var(--shift-accent) 20%, white);
  border-radius: 18px;
  background: linear-gradient(118deg, var(--shift-accent), var(--shift-deep)) !important;
  box-shadow: 7px 8px 0 color-mix(in srgb, var(--shift-soft) 95%, white) !important;
  color: #ffffff;
}

.oneday-pop .oneday_column_title::after {
  position: absolute;
  top: 10px;
  right: 19px;
  width: 11px;
  height: 11px;
  border-radius: 50%;
  background: color-mix(in srgb, white 75%, transparent);
  box-shadow: -17px 14px 0 -3px color-mix(in srgb, white 45%, transparent);
  content: "";
}

/* 先輩ナースの1日と同じ、丸時計＋アウトラインバッジの組み合わせ。 */
.oneday-pop .oneday_time_card {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  margin-bottom: 25px !important;
  padding: 24px 26px 25px !important;
  border: 1px solid color-mix(in srgb, var(--shift-accent) 25%, white) !important;
  border-radius: 18px;
  background:
    radial-gradient(circle, color-mix(in srgb, var(--shift-accent) 19%, transparent) 1.1px, transparent 1.7px) right 20px top 19px / 11px 11px no-repeat,
    #ffffff;
  box-shadow: 0 11px 25px color-mix(in srgb, var(--shift-accent) 10%, transparent) !important;
  transition: translate 0.26s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.26s ease, border-color 0.26s ease;
}

.oneday-pop .oneday_time_card::before {
  position: absolute;
  top: 0;
  left: 21px;
  z-index: 1;
  width: 96px;
  height: 4px;
  border-radius: 0 0 999px 999px;
  background: var(--shift-accent);
  content: "";
}

.oneday-pop .oneday_time_card::after {
  position: absolute;
  right: -16px;
  bottom: -16px;
  z-index: 0;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: color-mix(in srgb, var(--shift-accent) 28%, transparent);
  box-shadow: -18px -18px 0 -7px color-mix(in srgb, var(--shift-accent) 25%, transparent);
  content: "";
  transform: scale(1);
  transition: transform 0.42s cubic-bezier(0.22, 1, 0.36, 1);
}

.oneday-pop .oneday_time_card > * {
  position: relative;
  z-index: 1;
}

.oneday-pop .oneday_time_card .oneday_badge {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  display: inline-flex;
  width: 3.65rem;
  height: 3.65rem;
  margin: 0 0 0.8rem;
  transform: none !important;
  border: 2px solid #ffffff;
  outline: 1px solid color-mix(in srgb, var(--shift-accent) 22%, white);
  background: var(--shift-accent) !important;
  box-shadow: 0 0.35rem 0.9rem color-mix(in srgb, var(--shift-accent) 30%, transparent) !important;
  color: #ffffff;
  font-size: 0.78rem;
  letter-spacing: 0;
}

.oneday-pop .oneday_time_card h4 {
  position: relative;
  z-index: 2;
  display: inline-block;
  width: fit-content;
  max-width: 100%;
  margin: 0 0 0.85rem !important;
  padding: 0.34rem 0.8rem 0.38rem !important;
  border: 1px solid var(--shift-accent) !important;
  border-radius: 0.7rem !important;
  background: #ffffff !important;
  box-shadow: 0.42rem 0.42rem 0 var(--shift-soft) !important;
  color: var(--shift-deep) !important;
  font-size: 1rem !important;
  line-height: 1.55 !important;
}

.oneday-pop .oneday_time_card h4::before,
.oneday-pop .oneday_time_card h4::after {
  display: none !important;
  content: none !important;
}

.oneday-pop .oneday_time_card h5 {
  position: relative;
  z-index: 2;
  color: var(--shift-deep);
}

.oneday-pop .oneday_time_card p,
.oneday-pop .oneday_time_card .oneday_task_list li {
  color: var(--oneday-copy);
}

.oneday-pop .oneday_time_card .oneday_task_list li::marker {
  color: var(--shift-accent);
}

.oneday-pop .oneday_card_thumb img {
  border-color: color-mix(in srgb, var(--shift-accent) 28%, white);
  box-shadow: 0 6px 14px color-mix(in srgb, var(--shift-accent) 13%, transparent);
}

@media (hover: hover) and (pointer: fine) {
  .oneday-pop .oneday_time_card:hover {
    z-index: 2;
    border-color: color-mix(in srgb, var(--shift-accent) 58%, white) !important;
    box-shadow: 0 19px 34px color-mix(in srgb, var(--shift-accent) 19%, transparent) !important;
    translate: 0 -5px;
  }

  .oneday-pop .oneday_time_card:hover::after {
    transform: scale(5.3);
  }
}

@media screen and (max-width: 959px) {
  .oneday-pop #tab_shougai,
  .oneday-pop #tab_kaifuku {
    padding-right: 10px;
    padding-left: 10px;
    border-radius: 20px;
  }

  .oneday-pop .oneday_schedule_flex_container {
    padding-right: 8px;
    padding-left: 8px;
  }

  .oneday-pop .oneday_time_card {
    padding: 21px 20px 22px !important;
  }
}

@media screen and (max-width: 575px) {
  .oneday-pop .oneday_tab_area {
    margin-top: 24px;
    padding: 6px;
    border-radius: 18px;
  }

  .oneday-pop .oneday_tab_area .tab_menu_list {
    gap: 6px;
  }

  .oneday-pop .oneday_tab_area .tab_menu_list .tab_item {
    min-height: 42px;
    padding: 10px 7px;
    font-size: 0.78rem;
  }

  .oneday-pop #tab_shougai .oneday_intro,
  .oneday-pop #tab_kaifuku .oneday_intro {
    padding: 21px 16px;
    border-radius: 16px;
    text-align: center;
  }

  .oneday-pop #tab_shougai .oneday_intro h2,
  .oneday-pop #tab_kaifuku .oneday_intro h2 {
    font-size: 1.3rem !important;
    padding: 0.4rem 0.7rem 0.44rem !important;
  }

  .oneday-pop .oneday_column_title {
    margin-bottom: 21px;
    padding: 14px 18px;
    border-radius: 15px;
    font-size: 1.05rem;
  }

  .oneday-pop .oneday_time_card .oneday_badge {
    width: 3.35rem;
    height: 3.35rem;
    font-size: 0.74rem;
  }

  .oneday-pop .oneday_time_card h4 {
    font-size: 0.94rem !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .oneday-pop .oneday_time_card,
  .oneday-pop .oneday_time_card::after {
    transition: none !important;
  }
}

/* 先輩ナースの1日も、ほかの病棟と同じドット紙＋白縁ラベルで統一。 */
.oneday-pop #tab_nurse_life {
  --life-accent: #087c80;
  --life-deep: #05666a;
  --life-soft: #cceceb;
  box-sizing: border-box;
  position: relative;
  margin: 0;
  padding: 1px clamp(18px, 3vw, 38px) clamp(36px, 5vw, 62px);
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--life-accent) 20%, white);
  border-radius: 26px;
  background:
    radial-gradient(circle at 97% 11%, color-mix(in srgb, var(--life-accent) 22%, transparent) 0 7px, transparent 7.5px),
    radial-gradient(circle at 94% 15%, color-mix(in srgb, var(--life-accent) 13%, transparent) 0 13px, transparent 13.5px),
    linear-gradient(180deg, color-mix(in srgb, var(--life-soft) 48%, white) 0%, #ffffff 34%);
}

.oneday-pop .oneday_tab_area .tab_menu_list .tab_item[data-tab="tab_nurse_life"].active {
  border-color: #087c80 !important;
  background: #087c80 !important;
}

.oneday-pop #tab_nurse_life .nurse-life-story {
  position: relative;
  z-index: 1;
  margin-top: clamp(26px, 4vw, 44px);
}

.oneday-pop #tab_nurse_life .nurse-life-story__hero {
  position: relative;
  overflow: hidden;
  max-width: 58rem;
  border: 1px solid color-mix(in srgb, var(--life-accent) 23%, white);
  border-radius: 22px;
  background:
    radial-gradient(circle, color-mix(in srgb, var(--life-accent) 31%, transparent) 1.2px, transparent 1.8px) 2px 2px / 12px 12px,
    rgba(255, 255, 255, 0.9);
  box-shadow: 8px 9px 0 color-mix(in srgb, var(--life-soft) 86%, white);
}

.oneday-pop #tab_nurse_life .nurse-life-story__hero::after {
  position: absolute;
  right: -24px;
  bottom: -26px;
  width: 74px;
  height: 74px;
  border-radius: 50%;
  background: color-mix(in srgb, var(--life-accent) 18%, transparent);
  box-shadow: -40px -42px 0 -16px color-mix(in srgb, var(--life-accent) 15%, transparent);
  content: "";
}

.oneday-pop #tab_nurse_life .nurse-life-story__copy {
  position: relative;
  z-index: 1;
  max-width: 46rem;
  padding: clamp(2rem, 4vw, 3.3rem) clamp(1.15rem, 4vw, 3rem);
}

.oneday-pop #tab_nurse_life .nurse-life-story__eyebrow {
  display: inline-flex;
  margin-bottom: 11px;
  padding: 4px 10px;
  border: 1px solid color-mix(in srgb, var(--life-accent) 28%, white);
  border-radius: 999px;
  background: color-mix(in srgb, var(--life-soft) 50%, white);
  color: var(--life-deep);
  letter-spacing: 0.12em;
}

.oneday-pop #tab_nurse_life .nurse-life-story h2.nurse-life-story__title {
  display: inline-block;
  max-width: 100%;
  margin: 0 0 14px;
  padding: 0.42rem 0.95rem 0.5rem !important;
  border: 2px solid #ffffff !important;
  border-radius: 14px !important;
  background: rgba(255, 255, 255, 0.97) !important;
  box-shadow: 0.35rem 0.38rem 0 color-mix(in srgb, var(--life-soft) 92%, white) !important;
  color: var(--oneday-ink) !important;
}

.oneday-pop #tab_nurse_life .nurse-life-story h2.nurse-life-story__title::before,
.oneday-pop #tab_nurse_life .nurse-life-story h2.nurse-life-story__title::after {
  display: none !important;
  content: none !important;
}

.oneday-pop #tab_nurse_life .nurse-life-story__copy > p:not(.nurse-life-story__eyebrow) {
  display: inline-block;
  max-width: 100%;
  margin: 0;
  padding: 0.55rem 0.9rem;
  border: 1px solid color-mix(in srgb, var(--life-accent) 34%, white);
  border-radius: 12px;
  background: var(--life-soft);
  box-shadow: none;
  color: var(--life-deep);
  font-weight: 500;
}

.oneday-pop #tab_nurse_life .nurse-life-story__facts {
  margin-top: 1.35rem;
}

.oneday-pop #tab_nurse_life .nurse-life-story__facts li {
  border: 2px solid #ffffff;
  outline: 1px solid color-mix(in srgb, var(--life-accent) 22%, white);
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0.26rem 0.3rem 0 color-mix(in srgb, var(--life-soft) 88%, white);
}

.oneday-pop #tab_nurse_life .nurse-life-story__facts strong {
  color: var(--life-deep);
}

.oneday-pop #tab_nurse_life .nurse-life-story__flow-head {
  max-width: 42rem;
  margin: 0 auto 1.8rem;
  padding: 20px;
  border: 1px solid color-mix(in srgb, var(--life-accent) 20%, white);
  border-radius: 18px;
  background:
    radial-gradient(circle, color-mix(in srgb, var(--life-accent) 28%, transparent) 1.1px, transparent 1.7px) 2px 2px / 11px 11px,
    rgba(255, 255, 255, 0.9);
  box-shadow: 6px 7px 0 color-mix(in srgb, var(--life-soft) 88%, white);
}

.oneday-pop #tab_nurse_life .nurse-life-story__flow-head > p {
  display: inline-flex;
  margin: 0 0 9px;
  padding: 4px 9px;
  border: 1px solid color-mix(in srgb, var(--life-accent) 27%, white);
  border-radius: 999px;
  background: color-mix(in srgb, var(--life-soft) 49%, white);
  color: var(--life-deep);
  letter-spacing: 0.12em;
}

.oneday-pop #tab_nurse_life .nurse-life-story__flow h3 {
  padding: 0.38rem 0.85rem 0.44rem;
  border: 2px solid #ffffff !important;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.97) !important;
  box-shadow: 0.3rem 0.35rem 0 color-mix(in srgb, var(--life-soft) 90%, white);
  color: var(--oneday-ink) !important;
}

/* On wider screens, let each photo join the timeline card instead of reading as a separate rounded tile. */
@media screen and (min-width: 960px) {
  .oneday-pop #tab_nurse_life .nurse-life-story__step figure {
    overflow: hidden;
    border-radius: 15px 0 0 15px;
  }

  .oneday-pop #tab_nurse_life .nurse-life-story__step figure img {
    display: block;
    border-radius: 0;
  }
}

@media screen and (max-width: 959px) {
  .oneday-pop #tab_nurse_life {
    padding-right: 10px;
    padding-left: 10px;
    border-radius: 20px;
  }
}

@media screen and (max-width: 575px) {
  .oneday-pop #tab_nurse_life .nurse-life-story__hero {
    border-radius: 17px;
  }

  .oneday-pop #tab_nurse_life .nurse-life-story h2.nurse-life-story__title {
    padding: 0.38rem 0.7rem 0.44rem !important;
    font-size: 1.55rem;
  }

  .oneday-pop #tab_nurse_life .nurse-life-story__flow-head {
    padding: 17px 13px;
    border-radius: 15px;
  }
}