body{color:#414042;max-width:100%;margin:0;padding:0}
body.no-scroll{overflow:hidden}
.dosing-calendar{margin:0 auto}
.dosing-calendar .error{color:red}
.dosing-calendar>div:first-child{color:#005670;font-weight:700;padding:25px 15px 15px;font-size:20px;line-height:1.3;padding-top:25px;text-align:left;font-family:"century-gothic",sans-serif}
.controls-modal{padding:0 5px}
.controls{display:flex;gap:1.1rem;margin:0 auto;padding:1rem 0 2.5rem;font-size:11px;font-weight:600;color:white;flex-wrap:nowrap}
.controls .error{font-size:1rem;color:#005670;margin-top:.5rem;font-weight:400;text-transform:none}
.controls .error:before{background-image:url(/content/dam/oneabbvieoncology/images/varning.png);background-size:14px 14px;background-repeat:no-repeat;display:inline-block;width:14px;height:14px;content:"";margin-right:2px}
.controls label,.controls .label{display:flex;flex-direction:column;font-size:14px}
.controls label>span,.controls .label>span{display:none}
.controls .label input,.controls label select{border:2px solid #005670;border-radius:10px;box-shadow:rgba(0,0,0,0.5) 0 0 3px;font-size:1.4rem;font-family:"century-gothic",sans-serif;font-weight:700;color:#005670;width:auto;height:54px;padding:10px;line-height:1;box-sizing:border-box;max-height:inherit}
.controls .label .custom-datepicker:hover{border:2px solid #005670;box-shadow:rgba(0,0,0,0.5) 0 0 3px}
.controls label select{appearance:none;-webkit-appearance:none;background:url(/content/dam/oneabbvieoncology/images/down-arrow.png) no-repeat 98% 18px;background-size:25px;padding-right:30px}
.controls input.select-error,.controls label select.select-error{border:2px solid red}
.controls .buttons-wrapper{display:flex;flex-direction:row;gap:.5rem}
.controls .buttons-wrapper button{border-radius:10px;box-shadow:rgba(0,0,0,0.5) 0 0 3px;font-size:1.4rem;font-family:"century-gothic";font-weight:700;color:#fff;width:auto;height:54px;padding:10px 10px 12px 10px;line-height:1;box-sizing:border-box;background:#0a9c96;background-image:url(/content/dam/oneabbvieoncology/images/refresh.png);background-repeat:no-repeat;background-size:35px;background-position:8px 13px;padding-left:50px;border:0;cursor:pointer;white-space:nowrap}
.controls .buttons-wrapper button:last-child{background-image:url(/content/dam/oneabbvieoncology/images/print.png)}
.controls .react-datepicker{font-family:"century-gothic"}
.controls .react-datepicker__tab-loop{position:relative}
.controls .react-datepicker-popper{transform:none !important;width:100%}
.controls .react-datepicker-popper .react-datepicker__navigation{top:10px}
.controls .react-datepicker-popper .react-datepicker__navigation--previous{left:20px}
.controls .react-datepicker-popper .react-datepicker__navigation--next{right:20px}
.controls .react-datepicker-popper .react-datepicker,.controls .react-datepicker-popper .react-datepicker__month-container{width:100%}
.controls .react-datepicker-popper .react-datepicker{border:1px solid #ccc;border-radius:10px;background-color:#fff}
.controls .react-datepicker-popper .react-datepicker__header{background-color:transparent;border:0}
.controls .react-datepicker-popper .react-datepicker__month{margin-top:0}
.controls .react-datepicker-popper .react-datepicker__day-name,.controls .react-datepicker-popper .react-datepicker__day,.controls .react-datepicker-popper .react-datepicker__time-name{width:calc((100% / 7) - 2px);display:inline-flex;align-items:center;justify-content:center}
.controls .react-datepicker-popper .react-datepicker__day-name{color:#41798c;font-weight:700;font-family:"century-gothic";font-size:.93rem;text-transform:uppercase;margin:0;padding:0}
.controls .react-datepicker-popper .react-datepicker__day{color:#005670;font-size:1rem;font-weight:200;margin:0;padding:1px;height:36px}
.controls .react-datepicker-popper .react-datepicker__day--outside-month{pointer-events:none;opacity:0}
.controls .react-datepicker-popper .react-datepicker__day--keyboard-selected{background-color:transparent}
.controls .react-datepicker-popper .react-datepicker__day:hover{background-color:transparent}
.controls .react-datepicker-popper .react-datepicker__day--selected{position:relative;font-weight:700;color:#005670;background-color:#fac90e;border-radius:50%}
.controls .label .custom-datepicker{background-image:url(/content/dam/oneabbvieoncology/images/calendar.png) !important;background-repeat:no-repeat;background-size:27px,22px;background-position:8px 12px,calc(100% - 5px) center;padding:0 0 0 40px;width:100%}
.controls .react-datepicker-popper .react-datepicker__navigation-icon::before{border:0;background-image:url("/content/dam/oneabbvieoncology/images/down-arrow.png");background-repeat:no-repeat;background-position:center;background-size:15px 10px;width:22px;height:14px}
.controls .react-datepicker-popper .react-datepicker__navigation-icon--previous::before{transform:rotate(90deg)}
.controls .react-datepicker-popper .react-datepicker__navigation-icon--next::before{transform:rotate(-90deg)}
.controls .react-datepicker-popper h2.react-datepicker__current-month{font-size:1.3rem;font-weight:bold;line-height:1.8em;color:#005670}
.controls .react-datepicker-popper .react-datepicker__triangle{display:none}
.calendar{display:flex;flex-direction:column;gap:10px;color:#071d49}
.calendar.scrolled{padding:50px 0}
.calendar .calendar-grid{display:flex;flex-direction:column}
.calendar .calendar-grid .week{display:grid;grid-template-columns:repeat(7,1fr);gap:0;border-bottom:1px solid #e6e7e7}
.calendar .calendar-grid .week:last-child{border-bottom:0}
.day{background:white;border-right:1px solid #e6e7e7;min-height:106px;font-size:12px;box-sizing:border-box;display:flex;flex-direction:column}
.day:nth-child(7n-7){border-right:0}
.day .bands{display:flex;flex-direction:column;gap:0}
.day .items{padding:0 7px 1px 5px;display:flex;flex-wrap:wrap}
.day-number .band.yellowBand,.day-number .band.cyanBand{border-bottom:1px solid #e6e7e7}
.band{font-size:11px;padding:0 7px;margin:0;border-radius:2px;color:#000;display:flex;justify-content:space-between;min-height:15px}
.band .band-label{flex:1;white-space:nowrap;font-size:14px;font-family:"century-gothic";font-weight:700;color:#414042}
.band .band-label.hidden{color:transparent}
.band .day-number-name{flex:1;text-align:right;font-size:1rem;font-weight:bold;color:#071d49}
.band.yellowBand{background-color:#fefae7;color:#404041}
.band.cyanBand{background-color:#e6e7e7;color:#404041}
.band.greyBand{background-color:#e7f8f7;color:#404041}
.item{margin-top:4px;display:flex;align-items:flex-start;gap:2px;font-size:12px;letter-spacing:normal;color:#000 !important;flex:100%}
.item:last-child{margin-bottom:10px}
.item.Allopurinol,.item.Hospitalization,.item.IvHydration,.item.Labs,.item.OralHydration{color:#414042 !important}
.item.Rituximab,.item.Obinutuzumab{color:#ac8d3c !important}
.item.VEN20{color:#cc8f27 !important}
.item.VEN50{color:#d43856 !important}
.item.VEN100{color:#1bb1aa !important}
.item.VEN200{color:#3f1735 !important}
.item.VEN400{color:#094b63 !important}
.item.merged{display:inline-flex;flex:none;padding-right:5px}
.item .icon{width:16px;height:16px;text-align:center;position:relative;top:2px;display:block;flex:none}
.item.OralHydration .icon{top:1px}
.month{border:1px solid #c3c3c3;border-radius:7px;overflow:hidden}
.month-header{text-align:center}
.month-header h3{margin:0;padding:.5rem 0;font-size:1.2rem;background-color:#cddde2;text-transform:uppercase;color:#005570;font-family:"century-gothic" !important;font-weight:bold}
.calendar .weekdays{display:grid;grid-template-columns:repeat(7,1fr);font-weight:bold;font-size:14px;color:#666;overflow:hidden}
.calendar .weekday{font-size:1.3rem;line-height:2.2;padding:0;border-right:1px solid #fff;height:50px;font-weight:600;background-color:#005570;color:#fff;text-transform:uppercase;display:flex;align-items:center;justify-content:center}
.weekday:last-child{border:0}
.blank{background-color:transparent;border:0}
.blank+.day:not(.blank){border-left:1px solid #e6e7e7}
.day-number{font-weight:bold;font-size:14px;line-height:normal}
.day-number-name span{display:none}
.week-selector{display:flex;overflow-x:auto;padding:.5rem;background:#f9f9f9;scroll-snap-type:x mandatory;white-space:nowrap;touch-action:pan-y}
.week-day{display:inline-block;min-width:80px;padding:0 10px;text-align:center;cursor:pointer;user-select:none;scroll-snap-align:center}
.week-day span{display:block}
.week-day .name{text-transform:uppercase}
.week-day .number{display:block}
.week-selector .week-day:last-child{margin-right:0}
@media screen and (max-width:985px){.controls-modal{position:fixed;top:0;left:0;width:100%;height:100vh;background:rgba(0,0,0,0.6);display:flex;align-items:flex-start;justify-content:center;opacity:0;transition:all .5s linear;padding:0}
.controls-modal.open{opacity:1;z-index:20}
.controls{flex-direction:column;background-color:#fff;border-radius:20px;padding:2rem;max-width:350px}
.controls-modal.open .controls{margin-top:20px}
.controls>p{color:#005670;margin-bottom:0;line-height:1.2;font-size:1.25rem}
.controls label,.controls .label{font-size:1rem;text-transform:uppercase}
.controls label .input,.controls label input,.controls .label input,.controls label select{width:100%;border-radius:10px;padding:.5rem;font-size:1.25rem;font-weight:bold;margin-top:0}
.controls .label .custom-datepicker{background-image:url(/content/dam/oneabbvieoncology/images/calendar.png),url(/content/dam/oneabbvieoncology/images/down-arrow.png) !important}
.controls .modal-buttons{display:flex;justify-content:space-between;gap:1rem;margin-top:0}
.controls .modal-buttons button{width:100%;max-width:148px;font-size:1rem;font-weight:bold;border-radius:10px;box-shadow:rgba(0,0,0,0.5) 0 0 3px;font-family:"century-gothic",sans-serif;color:#fff !important;height:38px;padding:10px 10px 12px 10px;line-height:1;box-sizing:border-box;background:#b2b2b2;border:0;cursor:pointer;white-space:nowrap}
.controls .modal-buttons button:last-child{width:100%;max-width:148px;font-size:1rem;font-weight:bold;border-radius:10px;box-shadow:rgba(0,0,0,0.5) 0 0 3px;font-family:"century-gothic";color:#fff;height:38px;padding:10px 10px 12px 10px;line-height:1;box-sizing:border-box;background:#0a9c96;background-image:url(/content/dam/oneabbvieoncology/images/refresh.png);background-repeat:no-repeat;background-size:25px;background-position:21px 9px;padding-left:40px;border:0;cursor:pointer;white-space:nowrap}
.calendar,.calendar.scrolled{padding:32px 15px}
.calendar .day-number{text-transform:uppercase;text-align:center;color:#005670;font-size:24px}
.calendar .day-number span{display:block;color:#005670;opacity:.5;font-family:"century-gothic";font-size:12px}
.calendar .month{margin:0;border:0;border-radius:0;overflow:visible}
.calendar .weekdays,.calendar .month-header h3,.calendar .blank,.calendar .day.blank{display:none}
.calendar .calendar-grid{display:flex;flex-direction:column}
.calendar .calendar-grid .week{display:flex;flex-direction:column;border:0}
.item .icon{top:5px}
.calendar .day{display:grid;grid-template-columns:2fr 10fr;margin-bottom:20px}
.calendar .day>div:last-child{display:flex;flex-direction:column;gap:10px}
.calendar .day,.calendar .blank+.day:not(.blank){border:0;min-height:1px;height:auto}
.calendar .day .items{padding:.5rem 0}
.calendar .band{font-size:14px;margin-top:2px;color:#000;display:flex;justify-content:space-between;padding:3px 5px;border-radius:5px}
.item{font-size:1rem}
.item.OralHydration .icon{top:4px}
.minimalist-calendar{margin:20px -20px;box-shadow:0 5px 6px 1px rgba(0,0,0,0.1);padding:0 10px}
.minimalist-calendar .day,.minimalist-calendar .blank+.day:not(.blank){border:0;min-height:1px;height:auto}
.minimalist-calendar .band.yellowBand{background-color:rgba(250,201,14,0.5)}
.minimalist-calendar .band.cyanBand{background-color:rgba(0,0,0,0.4)}
.minimalist-calendar .band.greyBand{background-color:rgba(14,185,179,0.5)}
.calendar-mobile{transition:all .5s linear;padding:0 15px}
.calendar-mobile.fixed .minimalist-calendar{margin:20px 0}
.calendar-grid-wrapper{transition:height .4s ease}
.calendar-grid-wrapper .calendar-grid{display:flex;flex-direction:row}
.calendar-grid-wrapper.collapsed{overflow-x:auto;overflow-y:hidden;white-space:nowrap;-webkit-overflow-scrolling:touch;scroll-snap-type:x mandatory}
.calendar-grid-wrapper.collapsed .week{flex:0 0 100%;scroll-snap-align:start;display:flex;justify-content:space-between}
.calendar-grid-wrapper.expanded{overflow-y:auto;position:relative;white-space:normal;padding-bottom:20px;-webkit-overflow-scrolling:touch;scroll-snap-type:y mandatory}
.calendar-grid-wrapper.expanded .week{scroll-snap-align:start}
.calendar-grid-wrapper.expanded .calendar-grid{display:block}
.calendar-mobile.fixed{position:sticky;top:0;left:0;width:100%;z-index:10;padding:0}
.calendar-mobile .calendar-days{background:#fff}
.calendar-mobile .calendar-days .week{display:grid;grid-template-columns:repeat(7,1fr);gap:0}
.calendar-mobile .calendar-days .day{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:0;margin:0;padding:5px 0 0 0}
.calendar-mobile .calendar-days .day .bands{width:100%;gap:3px}
.calendar-mobile .calendar-days .day .band{padding:1px;width:100%;margin:0;min-height:1px}
.calendar-mobile .calendar-days .day-number{font-weight:normal;font-size:18px;width:30px;height:30px;display:flex;align-items:center;justify-content:center;margin-bottom:5px;color:#005670}
.calendar-mobile .calendar-days .day.starting-date{opacity:1}
.calendar-mobile .calendar-days .day.starting-date .day-number{background-color:#f9c74f;border-radius:50%;opacity:1;font-size:20px;font-weight:700}
.calendar-mobile .weekdays{display:grid;grid-template-columns:repeat(7,1fr);font-size:12px;color:#005670;text-align:center;margin-bottom:10px;text-transform:uppercase;font-family:"century-gothic";opacity:.5}
.calendar-mobile.fixed .calendar-controls{padding:0 20px}
.calendar-controls--month{display:flex;align-items:center;padding-top:20px}
.calendar-controls--month>div{flex:1;display:flex;justify-content:flex-end;gap:1rem}
.calendar-controls--month button,.calendar-controls--month a{border:0;background-color:transparent;width:24px;height:24px;background-size:20px;background-repeat:no-repeat;background-position:center center;display:flex;align-items:center;justify-content:center}
.calendar-controls--month .month-toggle-button{width:auto;height:auto;font-size:1.25rem;padding:0 1.7rem 0 0;position:relative;color:#005670;font-weight:700}
.calendar-controls--month .month-toggle-button::after{content:"";display:block;width:20px;height:20px;position:absolute;right:0;top:.1rem;background-image:url(/content/dam/oneabbvieoncology/nurse-calendar-v2/img/chevron_forward.svg);background-repeat:no-repeat;background-position:center -1px;transform-origin:center center;transition:all .3s linear}
.calendar-controls--month .month-toggle-button.expanded::after{transform:rotate(180deg);background-position:center -2px}
.calendar-controls--month .reload{background-image:url(/content/dam/oneabbvieoncology/nurse-calendar-v2/img/refresh.svg)}
.calendar-controls--month .print{background-image:url(/content/dam/oneabbvieoncology/nurse-calendar-v2/img/print.svg)}
.calendar-controls--month .info{background-image:url(/content/dam/oneabbvieoncology/nurse-calendar-v2/img/info.svg);color:transparent}
}
@media screen and (max-width:1400px){.controls label,.controls .label{flex:1;max-width:240px;min-width:fit-content}
.controls{flex-wrap:wrap}
}
@media screen and (max-width:1200px){.controls label,.controls .label{flex:1;max-width:initial;min-width:initial}
}
@media screen and (max-width:895px){.controls{flex-direction:column}
.controls .buttons-wrapper{justify-content:center}
}
@media print{*{-webkit-print-color-adjust:exact !important;color-adjust:exact !important;print-color-adjust:exact !important}
.calendar-mobile,.controls-modal{display:none}
.controls{display:flex;gap:1rem;margin:1.5rem 0;flex-wrap:wrap}
.controls label{display:flex;flex-direction:column;font-size:14px}
.calendar .weekday{font-size:11px;height:20px;line-height:.5}
.calendar .calendar-grid .week{display:flex;flex-wrap:nowrap}
.calendar .calendar-grid .week .day{width:calc(100% / 7)}
.calendar .month{break-before:page;page-break-before:always}
.calendar .month:first-child{break-before:none;page-break-before:none}
.month-header h3{font-size:.6rem}
.band .band-label{font-size:9px}
.band .day-number-name{font-size:.6rem}
.calendar .item{font-size:9px}
.item .icon{width:12px;height:12px;top:2px}
}