/* ===== Injection 007: controls, popup and one red theme ===== */
:root{
  --calendar-red:#df151d;
  --calendar-red-dark:#a70b12;
  --calendar-red-deep:#78070c;
  --calendar-cream:#fff7df;
  --calendar-border:#c7d8bd;
}

html,
body{
  min-height:100%;
  background:#eff4ec !important;
}

body.page-calendar-2026{
  margin:0 !important;
  padding:0 !important;
}

.page-calendar-2026 .page-wrap{
  min-height:0 !important;
  margin-bottom:0 !important;
  padding-bottom:0 !important;
}

.page-calendar-2026 .page-wrap::after{
  display:none !important;
  content:none !important;
}

.page-calendar-2026 .page-wrap:empty{
  display:none !important;
}

.page-calendar-2026 .lite-page-content{
  width:min(1540px,calc(100% - 14px)) !important;
  max-width:none !important;
  margin:7px auto 10px !important;
  padding-bottom:0 !important;
}

.page-calendar-2026 .screen-help,
.page-calendar-2026 .title-box,
.page-calendar-2026 .month-title{
  background:#df151d !important;
  background-image:none !important;
}

.page-calendar-2026 .screen-help{
  position:sticky !important;
  top:0 !important;
  z-index:1000 !important;
  display:flex !important;
  align-items:center !important;
  gap:10px !important;
  flex-wrap:wrap !important;
  min-height:58px !important;
  margin:0 0 14px !important;
  padding:8px 12px !important;
  border:0 !important;
  border-radius:10px !important;
  box-shadow:0 8px 23px rgba(91,4,9,.22) !important;
  color:#fff !important;
}

.page-calendar-2026 .screen-help .hint{
  flex:1 1 420px !important;
  margin:0 !important;
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
  font-size:13px !important;
  font-weight:1000 !important;
  line-height:1.35 !important;
}

.page-calendar-2026 .screen-help a[href="#team-1"],
.page-calendar-2026 .screen-help a[href="#team-2"],
.page-calendar-2026 .screen-help a[href="#night-shift-a"],
.page-calendar-2026 .screen-help button{
  position:relative !important;
  appearance:none !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-width:104px !important;
  min-height:42px !important;
  margin:0 !important;
  padding:9px 15px !important;
  overflow:visible !important;
  background:#b50e15 !important;
  border:2px solid #fff !important;
  border-radius:9px !important;
  box-shadow:0 3px 10px rgba(0,0,0,.2) !important;
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
  opacity:1 !important;
  visibility:visible !important;
  text-indent:0 !important;
  text-decoration:none !important;
  font-family:Arial,"Helvetica Neue",sans-serif !important;
  font-size:15px !important;
  font-weight:1000 !important;
  line-height:1 !important;
  white-space:nowrap !important;
  cursor:pointer !important;
  transition:
    background-color .14s ease,
    color .14s ease,
    border-color .14s ease,
    box-shadow .14s ease,
    transform .14s ease !important;
}

.page-calendar-2026 .screen-help a[href="#team-1"]:hover,
.page-calendar-2026 .screen-help a[href="#team-2"]:hover,
.page-calendar-2026 .screen-help a[href="#night-shift-a"]:hover,
.page-calendar-2026 .screen-help button:hover{
  transform:translateY(-1px) !important;
  background:var(--calendar-red-deep) !important;
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
}

.page-calendar-2026 .screen-help a:focus-visible,
.page-calendar-2026 .screen-help button:focus-visible{
  outline:none !important;
  box-shadow:
    0 0 0 3px rgba(255,255,255,.28),
    0 0 0 6px rgba(120,7,12,.25),
    0 4px 12px rgba(0,0,0,.24) !important;
}

.page-calendar-2026 .screen-help a.is-active{
  background:#fff !important;
  border-color:#fff !important;
  color:var(--calendar-red-dark) !important;
  -webkit-text-fill-color:var(--calendar-red-dark) !important;
  box-shadow:
    0 0 0 3px rgba(255,255,255,.28),
    0 4px 12px rgba(0,0,0,.24) !important;
}

.page-calendar-2026 .screen-help a.is-active::after{
  content:"✓" !important;
  display:grid !important;
  place-items:center !important;
  width:18px !important;
  height:18px !important;
  margin-left:7px !important;
  border-radius:50% !important;
  background:var(--calendar-red) !important;
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
  font-size:11px !important;
  font-weight:1000 !important;
}

.page-calendar-2026 .title-box{
  min-height:112px !important;
  border-radius:0 !important;
}

.page-calendar-2026 .title-box h1{
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
  font-size:clamp(34px,4.2vw,62px) !important;
  font-weight:1000 !important;
  line-height:1.02 !important;
  letter-spacing:-.035em !important;
  text-wrap:balance !important;
}

.page-calendar-2026 .sheet{
  margin-bottom:0 !important;
  border:1px solid var(--calendar-border) !important;
  border-radius:13px !important;
  overflow:hidden !important;
  background:#fff !important;
  box-shadow:0 10px 28px rgba(45,76,38,.13) !important;
}

.page-calendar-2026 .month{
  position:relative !important;
  cursor:zoom-in !important;
}

.page-calendar-2026 .month::after{
  content:"Tap to enlarge" !important;
  position:absolute !important;
  right:7px !important;
  top:5px !important;
  z-index:4 !important;
  padding:3px 6px !important;
  border-radius:999px !important;
  background:rgba(255,255,255,.92) !important;
  color:var(--calendar-red-dark) !important;
  -webkit-text-fill-color:var(--calendar-red-dark) !important;
  font-size:8px !important;
  font-weight:1000 !important;
  opacity:0 !important;
  transform:translateY(-2px) !important;
  transition:opacity .15s ease,transform .15s ease !important;
  pointer-events:none !important;
}

.page-calendar-2026 .month:hover::after{
  opacity:1 !important;
  transform:none !important;
}

.calendar-popup-backdrop{
  position:fixed !important;
  inset:0 !important;
  z-index:5000 !important;
  background:rgba(9,15,20,.76) !important;
  backdrop-filter:blur(2px) !important;
}

.page-calendar-2026 .month.calendar-popup-open{
  position:fixed !important;
  top:50% !important;
  left:50% !important;
  right:auto !important;
  bottom:auto !important;
  z-index:5100 !important;
  width:min(920px,calc(100vw - 38px)) !important;
  max-height:86vh !important;
  margin:0 !important;
  overflow:auto !important;
  transform:translate(-50%,-50%) !important;
  background:#fff !important;
  border:3px solid var(--calendar-red) !important;
  border-radius:16px !important;
  box-shadow:0 28px 90px rgba(0,0,0,.48) !important;
  cursor:default !important;
}

.page-calendar-2026 .month.calendar-popup-open::after{
  display:none !important;
}

.page-calendar-2026 .month.calendar-popup-open .month-title{
  position:sticky !important;
  top:0 !important;
  z-index:3 !important;
  padding:16px 64px 16px 18px !important;
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
  font-size:25px !important;
  font-weight:1000 !important;
  line-height:1 !important;
}

.page-calendar-2026 .month.calendar-popup-open .month-grid{
  width:100% !important;
  table-layout:fixed !important;
  font-size:16px !important;
}

.page-calendar-2026 .month.calendar-popup-open .month-grid th{
  height:43px !important;
  font-size:13px !important;
}

.page-calendar-2026 .month.calendar-popup-open .month-grid td{
  height:52px !important;
  padding:8px 5px !important;
  font-size:16px !important;
}

.calendar-popup-close{
  position:absolute !important;
  top:9px !important;
  right:10px !important;
  z-index:5200 !important;
  display:grid !important;
  place-items:center !important;
  width:39px !important;
  height:39px !important;
  padding:0 !important;
  border:2px solid #fff !important;
  border-radius:50% !important;
  background:#8c080e !important;
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
  box-shadow:0 4px 12px rgba(0,0,0,.25) !important;
  font-size:22px !important;
  font-weight:1000 !important;
  line-height:1 !important;
  cursor:pointer !important;
}

.calendar-popup-close:hover{
  background:#5f0509 !important;
}

body.calendar-popup-active{
  overflow:hidden !important;
}

.page-calendar-2026 .key,
.page-calendar-2026 .cal-legend{
  margin-bottom:0 !important;
  padding-bottom:14px !important;
}

@media(max-width:760px){
  .page-calendar-2026 .screen-help{
    position:relative !important;
  }

  .page-calendar-2026 .title-box{
    min-height:auto !important;
    padding:16px 14px !important;
  }

  .page-calendar-2026 .title-box h1{
    font-size:clamp(22px,7vw,30px) !important;
    line-height:1.1 !important;
    letter-spacing:-.02em !important;
    text-wrap:pretty !important;
  }

  .page-calendar-2026 .screen-help .hint{
    flex-basis:100% !important;
    font-size:11px !important;
    line-height:1.3 !important;
  }

  .page-calendar-2026 .screen-help a[href="#team-1"],
  .page-calendar-2026 .screen-help a[href="#team-2"],
  .page-calendar-2026 .screen-help a[href="#night-shift-a"],
  .page-calendar-2026 .screen-help button{
    flex:1 1 100px !important;
  }

  .page-calendar-2026 .month.calendar-popup-open{
    width:calc(100vw - 16px) !important;
    max-height:calc(100vh - 16px) !important;
  }

  .page-calendar-2026 .month.calendar-popup-open .month-grid td{
    height:46px !important;
    font-size:14px !important;
  }
}

@media print{
  .page-calendar-2026 .screen-help,
  .calendar-popup-backdrop,
  .calendar-popup-close{
    display:none !important;
  }

  .page-calendar-2026 .month.calendar-popup-open{
    position:static !important;
    width:auto !important;
    max-height:none !important;
    transform:none !important;
    border:0 !important;
    box-shadow:none !important;
  }
}