/* Application-only progress; Journey and Atelier indicators retain their own styles. */
#portrait-works-app .pw-content .pw-progress.pw-application-progress {
  display:flex;
  justify-content:center;
  align-items:center;
  gap:20px;
  margin:0 auto 44px;
  padding:0;
  height:7px;
  border:0;
  background:transparent;
  transform:none;
}
#portrait-works-app .pw-application-progress > span {
  display:block;
  flex:0 0 7px;
  box-sizing:border-box;
  width:7px;
  height:7px;
  border:1px solid var(--pw-line);
  border-radius:50%;
  background:transparent;
  transition:background-color .18s ease-in-out,border-color .18s ease-in-out;
}
#portrait-works-app .pw-application-progress > .completed {
  background:#638275;
  border-color:#638275;
}
#portrait-works-app .pw-application-progress > .active {
  background:var(--pw-green);
  border-color:var(--pw-green);
}
/* Date selection only: center the whole group without resizing the calendar. */
#portrait-works-app .pw-content:has(> .pw-calendar-shell) {
  box-sizing:border-box;
  min-height:calc(100svh - var(--wp-admin--admin-bar--height,0px));
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding-block:clamp(48px,6svh,72px);
}
#portrait-works-app .pw-content:has(> .pw-calendar-shell) > * {flex-shrink:0;}
#portrait-works-app .pw-content:has(> .pw-calendar-shell) > .pw-application-progress {margin:0 auto 68px;}
#portrait-works-app .pw-content:has(> .pw-calendar-shell) > h1 {margin:0!important;}
#portrait-works-app .pw-content:has(> .pw-calendar-shell) > .pw-calendar-shell {width:100%;margin:60px auto 0;}
@media(max-height:800px) {
  #portrait-works-app .pw-content:has(> .pw-calendar-shell) {padding-block:32px;}
  #portrait-works-app .pw-content:has(> .pw-calendar-shell) > .pw-application-progress {margin-bottom:60px;}
  #portrait-works-app .pw-content:has(> .pw-calendar-shell) > .pw-calendar-shell {margin-top:52px;}
}
@media(max-height:650px) {
  #portrait-works-app .pw-content:has(> .pw-calendar-shell) {padding-block:24px;}
  #portrait-works-app .pw-content:has(> .pw-calendar-shell) > .pw-application-progress {margin-bottom:44px;}
  #portrait-works-app .pw-content:has(> .pw-calendar-shell) > .pw-calendar-shell {margin-top:40px;}
}
@media (prefers-reduced-motion:reduce) {
  #portrait-works-app .pw-application-progress > span {transition:none;}
}
