.offcanvas_slide{
    transition: transform 500ms ease 0s;
    width:800px;
    height:100%;
    position:fixed;
    top:0;
    right:-800px;
    bottom:0;
    z-index: 9000;
}
.offcanvas_slide_sub{
    width:800px;
    height:100%;
    position:fixed;
    top:0;
    right:-800px;
    bottom:0;
    z-index: 9000;
}

.offcanvas_show{
    transform: translate3d(-800px, 0px, 0px);
}
.offcanvas_show_sub{
    left: 0px;
}
.offcanvas_close{
    transform: translate3d(800px, 0px, 0px);
}

@media screen and (min-width: 0px) and (max-width: 810px) {
    .offcanvas_slide{
        width: 100% !important;
        right : -100% !important;
    }
    .offcanvas_slide_sub{
        width: 100% !important;
        right : -100% !important;
    }
    .offcanvas_show{
        transform: translate3d(-100%, 0px, 0px) !important
    }
    #doz_alarm_offcanvas.offcanvas_close{
        transform: translate3d(100%, 0px, 0px) !important;
    }

}

#tooltip {
  position: absolute;
  top: 0;
  left: 0;
  background-color: white;
  z-index: 20;
}

.datepicker-input {
	display: flex;
	align-items: center;
	gap: 8px;
	height: 40px;
	padding: 0 11px;
	border: 1px solid #DBDEE3;
	border-radius: 8px;
	background-color: #FFFFFF;
	cursor: pointer;
}

.datepicker-input:hover {
	border-color: #70A2FF;
}

.datepicker-input .calendar-icon-wrapper {
	flex-shrink: 0;
	display: flex;
	font-size: 18px;
}

.datepicker-input .date-text-container {
	flex: 1;
	display: flex;
	align-items: center;
	gap: 4px;
}

.datepicker-input .date-text {
	min-width: 84px;
	font-size: 14px;
	font-weight: 400;
	line-height: 20px;
}

.datepicker-input .middle-icon {
	font-size: 18px;
	transform: rotate(45deg);
}

.datepicker-input.same .date-text-container > *:not(:nth-child(1)) {
	display: none;
}

.datepicker-input.same .date-text-container > *:nth-child(1) {
	min-width: 192px;
}

/**
 * Chrome 146 의 outline-width/outline-style decoupling 변경 대응
 * Bootstrap3 계열 vendor CSS 가 `outline: 5px auto -webkit-focus-ring-color;` 를 사용하는데
 * 146부터 width/style 이 분리 파싱되어 의도치 않게 포커스 테두리가 강제 노출됨
 * 기존엔 -webkit-focus-ring-color 가 유효 키워드가 아니어서 선언 전체가 무효화됐던 동작에 의존한 코드
 *
 * 해결 전략
 * 1. outline-color 만 transparent 로 덮어 Bootstrap3 파싱 결과의 시각 노출을 차단
 *    (outline-width, outline-style 은 남겨 다른 스타일 영향 최소화)
 * 2. :not(:focus-visible) 로 마우스 클릭/포커스 잔상에만 적용
 *    키보드 Tab 포커스(:focus-visible) 는 Bootstrap outline 을 그대로 유지하여 접근성 보장
 * 3. element selector 만 사용하여 specificity 를 낮게 유지
 *    기존에 자체 클래스로 outline 을 의도적으로 선언한 컴포넌트는 덮지 않음
 */
a:focus:not(:focus-visible),
button:focus:not(:focus-visible),
.btn:focus:not(:focus-visible),
input[type="file"]:focus:not(:focus-visible),
input[type="radio"]:focus:not(:focus-visible),
input[type="checkbox"]:focus:not(:focus-visible) {
	outline: 0;
}