/* Le Mie Ore TEST · miglioramento layout dopo FASE 6 (build 25).
   Layout only: historical shifts, sync, holiday rule and delete handlers unchanged. */
#calendarPage .v30-day-number{display:inline-block;line-height:1.1;font-variant-numeric:tabular-nums}
/* National holidays and Sundays remain visible even when a work shift is registered.
   Semantic class comes from the original holiday()/sunday() helpers. */
#calendarPage .day.v30-holiday .v30-day-number,
#calendarPage .day.v30-sunday .v30-day-number{
  color:#b3213b!important;font-weight:900!important;
  text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:3px;
}
body.v22-night #calendarPage .day.v30-holiday .v30-day-number,
body.v22-night #calendarPage .day.v30-sunday .v30-day-number{color:#ff8797!important}
/* Compact selected-day card: all the existing action buttons and handlers survive. */
#calendarPage .calendar-preview.v30-day-preview{
  min-width:0;max-width:100%;border:1px solid var(--v24-primary,#f0cddd)!important;
  border-radius:12px!important;background:var(--v24-card,#fff9fc)!important;
  padding:8px 10px!important;margin:6px 0!important;
  box-shadow:none!important;
}
#calendarPage .v30-day-preview .calendar-preview-title{
  font-size:14px!important;line-height:1.25!important;margin:0 0 3px!important;
  font-weight:800;white-space:normal;
}
#calendarPage .v30-day-preview p{font-size:11px!important;line-height:1.32!important;margin:2px 0!important}
#calendarPage .v30-day-preview .day-preview-shift{
  display:flex!important;align-items:center;justify-content:space-between;gap:5px;
  min-width:0;min-height:0!important;padding:5px 7px!important;margin:3px 0!important;
  border-radius:8px!important;background:var(--v24-secondary,#fff0f6)!important;
  font-size:11px!important;line-height:1.25!important;
}
#calendarPage .v30-day-preview .day-preview-shift>div{
  display:flex;flex-wrap:wrap;align-items:center;gap:3px 9px;min-width:0;flex:1;
}
#calendarPage .v30-day-preview .day-preview-shift b{font-size:11px!important;margin:0!important;display:inline!important}
#calendarPage .v30-day-preview .day-preview-shift>div>div{font-size:11px!important;white-space:normal}
#calendarPage .v30-day-preview .day-preview-shift .confirm-shift{
  flex:0 0 auto;min-height:30px!important;padding:4px 6px!important;font-size:10px!important;
}
#calendarPage .v30-day-preview .preview-note{padding:3px 6px!important;font-size:11px!important;margin:3px 0!important}
#calendarPage .v30-day-preview .preview-actions.v29-day-actions{gap:5px!important;margin:4px 0 0!important}
#calendarPage .v30-day-preview .preview-actions.v29-day-actions button{
  min-height:34px!important;max-height:40px;padding:5px 3px!important;
  font-size:clamp(10px,2.7vw,12px)!important;line-height:1.15!important;
}
#calendarPage .v30-day-preview .v29-day-status:empty{display:none!important}
@media screen and (max-width:760px){
  /* Make the calendar and the selected shift simultaneously visible on typical phones. */
  body.v21-calendar-active #calendarPage>.card:first-child{padding-left:9px!important;padding-right:9px!important}
  #calendarPage .calendar{gap:3px!important;margin-top:3px!important}
  #calendarPage .wd{padding:2px 0 4px!important;font-size:10px!important;line-height:1.1!important}
  #calendarPage .day{
    height:48px!important;max-height:48px!important;min-height:48px!important;
    font-size:14px!important;padding:2px 0!important;line-height:1.1!important;
    border-radius:8px!important;
  }
  #calendarPage .day::before{height:9px!important;min-height:9px!important;line-height:9px!important;font-size:8px!important}
  #calendarPage .day .day-hours{margin-top:2px!important;font-size:9px!important;line-height:1.08!important}
  #calendarPage .day small{margin-top:1px!important;font-size:9px!important}
  #calendarPage .v29-month-area{margin:4px 0 2px!important}
  #calendarPage .v22-smart-tools.v29-one-row-actions{margin:3px 0 1px!important}
  #calendarPage .calendar-preview.v30-day-preview{padding:7px 8px!important;margin:5px 0 4px!important}
  #calendarPage .v30-day-preview .calendar-preview-title{font-size:13px!important}
  #calendarPage .v30-day-preview .day-preview-shift{padding:4px 6px!important}
}
@media screen and (max-width:360px){
  #calendarPage .day{height:45px!important;max-height:45px!important;min-height:45px!important;font-size:13px!important}
  #calendarPage .day::before{height:8px!important;min-height:8px!important;line-height:8px!important}
  #calendarPage .v30-day-preview .day-preview-shift b,
  #calendarPage .v30-day-preview .day-preview-shift>div>div{font-size:10px!important}
}
@media print{#calendarPage .v30-day-preview{display:none!important}}

/* Build 51 TEST: denser mobile calendar without removing features. */
@media screen and (max-width:760px){
  body.v21-calendar-active #calendarPage>.card:first-child{padding-left:8px!important;padding-right:8px!important}
  #calendarPage .calendar-preview.v30-day-preview{padding:6px 8px!important;margin:4px 0!important;border-radius:11px!important}
  #calendarPage .v30-day-preview .calendar-preview-title{font-size:12.5px!important;line-height:1.2!important;margin-bottom:2px!important}
  #calendarPage .v30-day-preview p{font-size:10.5px!important;line-height:1.24!important;margin:1px 0!important}
  #calendarPage .v30-day-preview .day-preview-shift{padding:4px 6px!important;margin:2px 0!important}
  #calendarPage .v30-day-preview .preview-actions.v29-day-actions{gap:4px!important;margin-top:3px!important}
  #calendarPage .v30-day-preview .preview-actions.v29-day-actions button{min-height:30px!important;max-height:34px!important;padding:4px 3px!important;font-size:10px!important}
  #calendarPage .calendar{gap:2px!important;margin-top:2px!important}
  #calendarPage .wd{padding:1px 0 3px!important;font-size:9.5px!important}
  #calendarPage .day{height:44px!important;max-height:44px!important;min-height:44px!important;font-size:13px!important;padding:2px 0 1px!important;border-radius:8px!important}
  #calendarPage .day .v30-day-number{font-size:12px!important;line-height:1.05!important}
  #calendarPage .day .shift-times{font-size:8px!important;line-height:1.05!important}
  #calendarPage .day .day-hours{font-size:8px!important;line-height:1.05!important;margin-top:1px!important}
  #calendarPage .day small{font-size:8px!important;line-height:1.05!important;margin-top:1px!important}
  #calendarPage .day::before{height:8px!important;min-height:8px!important;line-height:8px!important;font-size:7px!important}
  #calendarPage .v22-smart-tools.v29-one-row-actions{margin:4px 0 2px!important;gap:4px!important}
  #calendarPage .v22-smart-tools.v29-one-row-actions button{min-height:36px!important;padding:4px 3px!important;font-size:11px!important;line-height:1.1!important}
}
@media screen and (max-width:360px){
  #calendarPage .day{height:41px!important;max-height:41px!important;min-height:41px!important}
  #calendarPage .day .v30-day-number{font-size:11px!important}
}