.modal__header:has(.schedule-hours-modal__header) {
	padding: 8px 8px 0 8px;
}

.modal__header:has(.schedule-hours-modal__header) > .in.flex_row {
	padding: 4px;
}

.modal__header:has(.schedule-hours-modal__header) > ws-btn {
	padding: 4px;
}

.schedule-hours-modal__header {
	gap: 12px
}

.schedule-hours-modal__header-avatar-block span{
	border-radius: 8px;
	transform: scale(0.75);
}

.schedule-hours-modal__header-text-block_text--primary {
	align-items: center;
	font: var(--font-ui-18-title-2-bold);
	color: var(--base-txt-primary);
}
.schedule-hours-modal__header-text-block_text--secondary {
	font: var(--font-ui-12-mini-reg);
	color: var(--base-txt-secondary);
	gap: 2px;
}
.schedule-hours-modal__header-text-block_text--secondary .stage, .schedule-hours-modal__header-text-block_text--secondary .stage  {
	--icon-size: 16px;
}


.schedule-hours-modal__body {
	flex: 1 1 auto;
	min-height: 0;
}
.modal__content:has(.schedule-hours-modal_body) {
	overflow: hidden;
	min-height: 0;
}
.schedule-hours-modal__scrollzone {
	flex: 1 1 auto;
	min-height: 0;
	overflow-y: auto;
	overscroll-behavior: contain;
	background: var(--base-cont-mod-low);
}
.modal .schedule-hours-modal__scrollzone {
	margin-top: 0;
}



.schedule-hours-modal__presets-block {
	display: flex;
	padding: 8px 16px 8px 14px;
	align-items: center;
	gap: 4px;
	align-self: stretch;
	border-bottom: 0.5px solid var(--base-line-secondary);
	background: var(--base-cont-mod-top);
	position: sticky;
	top: 0;
	z-index: 1;
}
.schedule-hours-modal__presets-block_checkbox {
	margin: 6px;
}
.schedule-hours-modal__presets-block_pie-block {
	display: flex;
	justify-content: flex-end;
	align-items: center;
	gap: 8px;
	flex: 1 0 0;
}
.schedule-hours-modal__presets-block_pie-block_main-text {
	display: flex;
	padding: 2px 4px;
	flex-direction: column;
	justify-content: center;
	align-items: flex-start;
	color: var(--base-hlt-invert);
	font: var(--font-ui-13-small-bold);
	letter-spacing: -0.078px;
	font-variant-numeric: tabular-nums;
}



.schedule-hours-modal__tracking-block {
	display: flex;
	padding: 12px 0;
	flex-direction: column;
	align-items: flex-start;
	align-self: stretch;
	/* background: var(--base-cont-mod-low); */
}
.schedule-hours-modal__tracking-block_days-list {
	display: flex;
	padding: 0 12px;
	flex-direction: column;
	align-items: flex-start;
	gap: 4px;
	align-self: stretch;
}

.schedule-hours-modal__footer {
	/* background: var(--base-cont-mod-low); */
	display: flex;
	padding: 8px 20px 20px 20px;
	flex-direction: column;
	align-items: center;
	align-self: stretch;
	@media screen and (max-width: 480px) {
		padding-bottom: calc(20px + var(--sa-bot));
	}
}
.schedule-hours-modal__footer ws-btn button {
	height: 20px;
	font: var(--font-ui-12-mini-reg) !important;
	border-radius: 50px;
}
.schedule-hours-modal__footer ws-btn button ws-icon {
	--icon-size: 12px;
}
.schedule-hours-modal__footer ws-btn button span {
	padding: 0 0 0 6px !important;
}


schedule-hours-pie, schedule-hours-pie > * {
	box-sizing: border-box;
}
.schedule-hours-pie {
	display: flex;
	width: 36px;
	height: 36px;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	flex-shrink: 0;
	aspect-ratio: 1/1;
	border-radius: 8px;
	border: 1px solid var(--base-txt-ghost);
}
.schedule-hours-pie--text {
	gap: -8px;
}
.schedule-hours-pie__text--primary {
	font: var(--font-ui-15-large-semi);
	color: var(--base-txt-tertiary);
	height: 20px;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 1;
	position: relative;
	top: 4px;
}
.schedule-hours-pie__text--secondary {
	height: 16px;
	font: var(--font-ui-10-nano-reg);
	color: var(--base-txt-muted);
	position: relative;
	bottom: 4px;
}


schedule-date-progressbar, schedule-date-progressbar > * {
	box-sizing: border-box;
}
schedule-date-progressbar {
	width: 100%;
	display: flex;
	height: 40px;
	align-items: center;
	flex: 1 0 0;
	border-radius: 12px;
	border: 2px solid var(--base-cont-mod-top);
	background: var(--base-cont-mod-top);
	box-shadow: 0 0 0 1px var(--base-line-tertiary);
}
.schedule-date-progressbar__container {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 4px;
	flex: 1 0 0;
	border-radius: 10px;
	position: relative;
}
.schedule-date-progressbar__bar {
	display: flex;
	width: 100%;
	height: 100%;
	border-radius: 10px;
	overflow: hidden;
	background: transparent;
	position: absolute;
	z-index: 0;
}

.schedule-date-progressbar__seg { height: 100%; }

.schedule-date-progressbar__seg.seg-selected {
	background: var(--base-hlt-b-selected);
}
.schedule-date-progressbar__seg.seg-selected-new {
	background: var(--base-hlt-b-active);
}
.schedule-date-progressbar__seg.seg-overload {
	background: var(--base-hlt-w-invert);
}
.schedule-date-progressbar__seg.seg-rest {
	background: transparent;
}


.schedule-date-progressbar__text-container {
	display: flex;
	padding: 0 8px;
	align-items: center;
	gap: 8px;
	align-self: stretch;
}
.schedule-date-progressbar__text-container-inner-left {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}
.schedule-date-progressbar__text-inner-left--primary {
	display: flex;
	height: 20px;
	padding: 0 4px;
	justify-content: flex-end;
	align-items: center;
	align-self: stretch;
	overflow: hidden;
	color: var(--base-txt-primary);
	text-align: center;
	text-overflow: ellipsis;
	font: var(--font-ui-15-large-semi);
	position: relative;
	top: 2px;
}
.schedule-date-progressbar__text-inner-left--secondary {
	display: flex;
	height: 16px;
	padding: 0 4px;
	justify-content: center;
	align-items: center;
	align-self: stretch;
	color: var(--base-txt-tertiary);
	text-align: center;
	font: var(--font-ui-10-nano-reg);
	position: relative;
	bottom: 2px;
}
.schedule-date-progressbar__text-container-inner-right {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: flex-start;
	flex: 1 0 0;
}
.schedule-date-progressbar__text-inner-right--primary {
	display: flex;
	height: 20px;
	align-items: center;
	align-self: stretch;
	overflow: hidden;
	color: var(--base-txt-accent);
	text-overflow: ellipsis;
	font: var(--font-ui-13-small-reg);
	position: relative;
	top: 2px;
}
.schedule-date-progressbar__text-inner-right--secondary {
	display: flex;
	height: 16px;
	align-items: center;
	align-self: stretch;
	text-align: center;
	font: var(--font-ui-10-nano-reg);
	position: relative;
	bottom: 2px;
}
.schedule-date-progressbar__text-inner-right--secondary-base {
	font: var(--font-ui-10-nano-reg);
	color: var(--base-txt-primary);
}
.schedule-date-progressbar__text-inner-right--secondary-accent {
	font: var(--font-ui-10-nano-med);
	color: var(--base-txt-btn-w);
}
.schedule-date-progressbar__text-container-inner-holiday-icon {
	width: 16px;
	height: 16px;
}
.schedule-date-progressbar__scale {
	display: none;
	justify-content: space-between;
	width: 100%;
	position: absolute;
	bottom: 0;
	align-items: end;
}
.schedule-date-progressbar__scale {
	display: none;
	justify-content: space-between;
	align-items: flex-end;
	height: 6px;
}
.schedule-date-progressbar__scale::before,
.schedule-date-progressbar__scale::after,
.schedule-date-progressbar__scale {
	content: "";
	position: absolute;
	bottom: 0;
	width: 100%;
	clip-path: inset(-6px 1px 0px 1px);
}

.schedule-date-progressbar__scale {
	height: 3px; /* четверть часа */
	background: repeating-linear-gradient(to right,
	var(--base-txt-tertiary) 0 1px,
	transparent 1px calc(15 * 100% / var(--work-minutes, 480))
	);
}
.schedule-date-progressbar__scale::before {
	height: 4px; /* полчаса */
	background: repeating-linear-gradient(to right,
	rgb(from var(--base-txt-tertiary) r g b / 1) 0 1px,
	transparent 1px calc(30 * 100% / var(--work-minutes, 480))
	);
}
.schedule-date-progressbar__scale::after {
	height: 6px; /* часы */
	background: repeating-linear-gradient(to right,
	rgb(from var(--base-txt-tertiary) r g b / 1) 0 1px,
	transparent 1px calc(60 * 100% / var(--work-minutes, 480))
	);
}


schedule-date-progressbar:hover .schedule-date-progressbar__scale {
	display: flex;
}

.schedule-date-progressbar__end-text {
	overflow: hidden;
	color: var(--base-txt-primary);
	font: var(--font-ui-13-small-semi);
	text-align: right;
	text-overflow: ellipsis;
}



schedule-date-line, schedule-date-line > * {
	box-sizing: border-box;
}
schedule-date-line {
	width: 100%;
	display: flex;
	height: 40px;
	align-items: center;
	gap: 4px;
	align-self: stretch;
	border-radius: 12px;
	padding: 0 16px 0 2px;
}
schedule-date-line ws-checkbox {
	padding: 6px;
}



schedule-time-picker, schedule-time-picker > * {
	box-sizing: border-box;
}
schedule-time-picker {
	display: flex;
	height: 40px;
	padding: 4px;
	align-items: center;
	border-radius: 12px;
	background: var(--base-cont-mod-top);
	box-shadow: 0 0 0 1px var(--base-line-tertiary);
}
.schedule-time-picker__container {
	display: flex;
	justify-content: flex-end;
	align-items: center;
	gap: 4px;
}
.schedule-time-picker__button {
	width: 32px !important;
	height: 32px !important;;
	color:  var(--base-txt-secondary) !important;
	border-radius: 8px !important;
}
body.mobile .schedule-time-picker__button {
	opacity: .5;
}
body.desktop  .schedule-time-picker__button {
	opacity: .05;
}
.schedule-time-picker__button svg {
	fill: var(--base-txt-secondary) !important;
}
.schedule-time-picker__text {
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 5px;
	padding: 2px 8px;
	color: var(--base-txt-muted);
	font: var(--font-ui-13-small-med);
	white-space: nowrap;
	width: 28px;
	font-variant-numeric: tabular-nums;
}
schedule-time-picker:hover .schedule-time-picker__button {
	color: var(--base-txt-btn-a) !important;
	opacity: 1 !important;
}
schedule-time-picker:hover .schedule-time-picker__button svg {
	fill: var(--base-txt-btn-a) !important;
}
schedule-time-picker:hover .schedule-time-picker__button[disabled], .schedule-time-picker__container--filled .schedule-time-picker__button[disabled] {
	opacity: 0.25 !important;
}
schedule-time-picker:hover .schedule-time-picker__text {
	padding: 2px 6px;
	border: 2px solid var(--base-line-act-minor);
	background: var(--base-hlt-easy);
	color: var(--base-txt-accent);
}
.schedule-time-picker__container--filled .schedule-time-picker__text {
	background: var(--base-cont-mod-trans-low);
	color: var(--base-txt-primary);
}
.schedule-time-picker__container--filled .schedule-time-picker__button {
	opacity: 1 !important;
}
ws-btn:has(.schedule-time-picker__button) {
	display: none;
}
schedule-time-picker:hover ws-btn:has(.schedule-time-picker__button--hover) {
	display: inline-block;
}
schedule-time-picker:not(:hover) ws-btn:has(.schedule-time-picker__button--no-hover) {
	display: inline-block;
}


schedule-week-divider, .schedule-week-divider > * {
	box-sizing: border-box;
}
schedule-week-divider {
	width: 100%;
}
.schedule-week-divider {
	display: flex;
	padding: 8px 20px;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	align-self: stretch;

}
.schedule-week-divider--base {
	--divider-color: var(--base-hlt-g-notr-focus);
	--divider-text-color: var(--base-txt-tertiary);
}
.schedule-week-divider--accent {
	--divider-color: var(--base-txt-btn-w);
	--divider-text-color: var(--base-txt-btn-w);
}
.schedule-week-divider__text {
	display: flex;
	padding: 0 8px;
	flex-direction: column;
	align-items: flex-start;
	color: var(--divider-text-color);
	font: var(--font-ui-12-mini-reg);
	white-space: nowrap;
}
.schedule-week-divider__line {
	width: 100%;
	height: 1px;
	background: var(--divider-color);
	display: flex;
	align-items: center;
}
.schedule-week-divider__line:first-child {
	justify-content: flex-start;
}
.schedule-week-divider__line:first-child::before {
	background: var(--divider-color);
	content: "";
	display: block;
	height: 6px;
	width: 6px;
	border-radius: 100%;
}
.schedule-week-divider__line:last-child {
	justify-content: flex-end;
}
.schedule-week-divider__line:last-child::after {
	background: var(--divider-color);
	content: "";
	display: block;
	height: 6px;
	width: 6px;
	border-radius: 100%;
}



schedule-date-line:hover .schedule-date-progressbar__scale {
	display: flex;
}
schedule-date-line:hover .schedule-time-picker__button {
	color: var(--base-txt-btn-a) !important;
	opacity: 1 !important;
}
schedule-date-line:hover .schedule-time-picker__button svg {
	fill: var(--base-txt-btn-a) !important;
}
schedule-date-line:hover .schedule-time-picker__button[disabled], .schedule-time-picker__container--filled .schedule-time-picker__button[disabled] {
	opacity: 0.25 !important;
}
schedule-date-line:hover .schedule-time-picker__text {
	padding: 2px 6px;
	border: 2px solid var(--base-line-act-minor);
	background: var(--base-hlt-easy);
	color: var(--base-txt-accent);
}
schedule-date-line:hover ws-btn:has(.schedule-time-picker__button--hover) {
	display: inline-block;
}
schedule-date-line:hover ws-btn:has(.schedule-time-picker__button--no-hover) {
	display: none;
}



.schedule-tooltip__container {
	display: flex;
	width: 133px;
	padding: 4px 8px;
	flex-direction: column;
	align-items: flex-end;
	gap: 2px;
}
.schedule-tooltip__container--tasks {
	gap: 4px;
}
.schedule-tooltip__text--first {
	color: var(--lbl-yesterday-major, #C9C);
	font: var(--font-ui-10-nano-reg);
}
.schedule-tooltip__text--second {
	color: var(--colors-alpha-light-70, rgba(255, 255, 255, 0.70));
	font: var(--font-ui-13-small-reg);
	overflow: hidden;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	line-clamp: 2;
	-webkit-box-orient: vertical;
	text-overflow: ellipsis;
}
.schedule-tooltip__text--time {
	font: var(--font-ui-13-small-semi);
	color: var(--colors-alpha-light-100);
}

.schedule-tooltip__text--third {
	color: var(--colors-alpha-light-90);
	font: var(--font-ui-13-small-reg);
}
.schedule-tooltip__text-divider {
	padding: 6px 0;
	border-top: solid .5px var(--colors-alpha-light-30);
}
.schedule-tooltip__text--footer {
	color: var(--colors-alpha-light-70);
	font: var(--font-ui-10-nano-reg);
}
.schedule-tooltip__text--footer-accent {
	color: var(--base-hlt-w-invert-minor);
}
