@charset "utf-8";

/* Medilook v3 Common CSS
 * 2025-08-06
 * jquery-ui.min.css 에서 font-family 삭제함
 * AdminLTE.min.css 에서 font-family 삭제함
 */

* {font-family:'Char', 'Roboto', 'Noto Sans KR', '맑은 고딕', 'Malgun Gothic', '돋움', Dotum, Arial, sans-serif;}
html {height: 100%;}
body {height: 100%;-webkit-text-size-adjust:none;}
body, form, fieldset, legend, input, textarea, button, select {margin:0; padding:0;}
body, input, textarea, select, button, table, pre {font-size:1rem; color:#222; letter-spacing:normal; background-color: #f4f6f9;}
h1, h2, h3, h4, h5, th, strong, b {font-weight:600;}
header, footer, section, article, aside, nav, hgroup, details, menu, figure, figcaption {display:block;}
img, fieldset, button, iframe {border:0;}


/* 하단 websocket 상태 */
.footer-conn-on {
	color: #009c64;
}
.footer-conn-off {
	color: #e1e1e1;
}

/* AdminLTE 3.2.0 Custom */
/* 로그인 페이지의 body에 배경 이미지 적용 */
.login-page-web-bg {
	background-image: url('../images/login/login-bg-web.png');
	background-size: cover; /* 이미지가 전체 화면을 덮도록 설정합니다. */
	background-repeat: no-repeat; /* 이미지가 반복되지 않도록 합니다. */
	background-position: center; /* 이미지를 중앙에 배치합니다. */
}
.login-page-web-card-header {
	border: 0;
	padding: 1.25rem 1.25rem
}
.nav-icon {
	font-size: 1rem !important;
}

.nav-sidebar>.nav-item .nav-icon {
	margin-right: 0px !important;
}
.main-content-frame{
	width: 100%;
	height: calc(100vh - 73px); /*footer text-sm 일경우 -93px*/
	border: none;
}
/* main content margin */
.content-wrapper > .content-header {
	/* padding-left: 0px;*/
}
.content-wrapper > .content {
	/*padding-left: 0px;*/
}
.container-fluid {
	/*padding-left: 1px;*/
}
h6, .h6 {
	font-size: 1.125rem;
}
.row {
	/*
	margin-right: 0px;
	margin-left: 0px;
	*/
}

/* sidebar 하단 높이 영역
.layout-fixed.text-sm .main-sidebar-custom .sidebar {
  height: calc(100% - ((2.93725rem + 3.8rem) + 1px));
}
.layout-fixed.text-sm .main-sidebar-custom .sidebar-custom {
  height: 3.8rem;
  padding: 0.85rem 0.5rem;
}
*/
.zml-sidebar-custom-main {
    height: calc(100% - ((2.93725rem + 20rem) + 1px)) !important;
}
.zml-sidebar-custom-footer {
	height: 20rem !important;
}
/* 도착예정상태 card 바탕 dark mode */
.dark-mode .zml-sidebar-custom-footer > .card {
	background-color: #252525;
}

/* 드롭다운 메뉴 아이템과 푸터 사이에 스크롤 영역을 생성 */
.dropdown-scroll-container {
	max-height: 400px; /* 원하는 최대 높이로 설정 */
	overflow-y: auto;  /* 세로 스크롤바 자동 생성 */
}


/** 도착예정상태 *****************************************/
.zml-sidebar-status-color.green {
	/* 원할 */
	color: #4caf50;
}
.zml-sidebar-status-color.yellow {
	/* 지체 */
	color: #ffe744;
}
.zml-sidebar-status-color.red {
	/* 혼잡 */
	color: #ff4136;
}
/*********************************************************/

/* footer 영역 */
.dark-mode .main-footer {
	background-color: #2c2c2c !important;
}


/* Dashboard 색상 정의 정의 */
/* 상세보기 a tag */
.dark-mode .zml-ds-alink-dtl {
	color: #3f6791;
}


/* 이미지 버튼(a tag) 색상 */
.zml-alink-img {
	color: #999999;
}
.dark-mode .zml-alink-img {
	color: #999999;
}
.zml-alink-summary {
	color: #444444;
}
.dark-mode .zml-alink-summary {
	color: #f5f5f5;
}

/* Icon 기본 스타일 */
.zml-icon {
	display: inline-block; /* 텍스트와 함께 줄에 맞추기 위해 */
	background-repeat: no-repeat; /* 이미지 반복 방지 */
	background-position: center center; /* 이미지 중앙 정렬 */
	background-size: contain; /* 이미지가 요소 안에 꽉 차도록 (비율 유지) */
	vertical-align: middle; /* 텍스트와 세로 정렬 */
	margin-right: 5px; /* 아이콘과 텍스트 사이 간격 */
}
.zml-icon-emergency {
	background-image: url('../images/dashboard/zml-emergency.png');
	width: 40px;
	height: 40px;
}
.zml-icon-wait {
	background-image: url('../images/dashboard/zml-wait.png');
	width: 40px;
	height: 40px;
}
.zml-icon-delay {
	background-image: url('../images/dashboard/zml-delay.png');
	width: 40px;
	height: 40px;
}
.zml-icon-reservation {
	background-image: url('../images/dashboard/zml-reservation.png');
	width: 40px;
	height: 40px;
}
.zml-icon-transfer {
	background-image: url('../images/dashboard/zml-transfer.png');
	width: 40px;
	height: 40px;
}
.zml-icon-complete {
	background-image: url('../images/dashboard/zml-complete.png');
	width: 40px;
	height: 40px;
}
.dark-mode .zml-icon-emergency {
	background-image: url('../images/dashboard/zml-emergency-dark.png');
	width: 40px;
	height: 40px;
}
.dark-mode .zml-icon-wait {
	background-image: url('../images/dashboard/zml-wait-dark.png');
	width: 40px;
	height: 40px;
}
.dark-mode .zml-icon-delay {
	background-image: url('../images/dashboard/zml-delay-dark.png');
	width: 40px;
	height: 40px;
}
.dark-mode .zml-icon-reservation {
	background-image: url('../images/dashboard/zml-reservation-dark.png');
	width: 40px;
	height: 40px;
}
.dark-mode .zml-icon-transfer {
	background-image: url('../images/dashboard/zml-transfer-dark.png');
	width: 40px;
	height: 40px;
}
.dark-mode .zml-icon-complete {
	background-image: url('../images/dashboard/zml-complete-dark.png');
	width: 40px;
	height: 40px;
}
.zml-icon-mt {
	margin-top: -0.5rem;
}

/* info box custom */
.zml-info-box-dashboard {background-color: #f5f5f5; color: #444444; min-height: unset;}
.zml-info-box-search    {background-color: #f8f9fa;   border: 1px solid #dddddd; box-shadow: none; display: block; min-height: unset; padding: 0.5rem 0.5rem 0.25rem 0.5rem;}

.dark-mode .zml-info-box-dashboard {background-color: #2c2c2c; color: #f5f5f5; min-height: unset;}
.dark-mode .zml-info-box-search    {background-color: #2c2c2c; color: #f5f5f5; min-height: unset; border-color:#555;}


/* dashboard background color */
.zml-dashb-bg-wait {
	background-color: #f5f5f5;
}
.dark-mode .zml-dashb-bg-wait {
	background-color: #252525;
}
.zml-dashb-bg-transfer {
	background-color: #edf7f1;
}
.dark-mode .zml-dashb-bg-transfer {
	background-color: #252525;
}
.zml-dashb-bg-complete {
	background-color: #edf4f7;
}
.dark-mode .zml-dashb-bg-complete {
	background-color: #252525;
}

/* 대시보드 목록 카드 */
.dark-mode .zml-dashboard-list {
	background-color: #333333 !important;
}

/* 카드섹션 */
.zml-ds-path-label {
	display: flex;
	padding-left: 1px;		/* 아이콘 들여쓰기 간격 */
	align-items: baseline;	/* 아이콘과 텍스트를 중간 기준으로 정렬 */
	gap: 4px;				/* 아이콘과 텍스트 사이 간격 */
}
.zml-ds-message-label {
	display: flex;
	padding-left: 1px;		/* 아이콘 들여쓰기 간격 */
	align-items: baseline;	/* 아이콘과 텍스트를 중간 기준으로 정렬 */
	gap: 4px;				/* 아이콘과 텍스트 사이 간격 */
}

/* dashboard status btn 색상 */
.zml-ds-card            {padding: 0.75rem 0.75rem; border: 0;}
.zml-ds-card-body       {padding-top: 0 !important; display: none;}
 
.zml-ds-btn-wait        {color: #eeeeee; background-color: #afafaf; border-color: #afafaf;}
.zml-ds-btn-simple      {color: #eeeeee; background-color: #777777; border-color: #777777;}
.zml-ds-btn-emergency   {color: #eeeeee; background-color: #ff6666; border-color: #ff6666;}
.zml-ds-btn-reservation {color: #eeeeee; background-color: #78a7e9; border-color: #78a7e9;}
.zml-ds-btn-delay       {color: #eeeeee; background-color: #ff9e54; border-color: #ff9e54;}
.zml-ds-btn-waypoint    {color: #eeeeee; background-color: #b18aea; border-color: #b18aea;}
.zml-ds-btn-reassign    {color: #eeeeee; background-color: #F668B9; border-color: #F668B9;}
.zml-ds-btn-transfer    {color:#eeeeee; background-color:#6cc86e; border-color:#6cc86e; }
.zml-ds-btn-complete    {color:#eeeeee; background-color:#007bff; border-color:#007bff; }


.dark-mode .zml-ds-btn-wait        {color: #eeeeee; background-color: #777777; border-color: #777777;}
.dark-mode .zml-ds-btn-simple      {color: #eeeeee; background-color: #555555; border-color: #555555;}
.dark-mode .zml-ds-btn-emergency   {color: #eeeeee; background-color: #e25e52; border-color: #e25e52;}
.dark-mode .zml-ds-btn-reservation {color: #eeeeee; background-color: #608bc8; border-color: #608bc8;}
.dark-mode .zml-ds-btn-delay       {color: #eeeeee; background-color: #f28c45; border-color: #f28c45;}
.dark-mode .zml-ds-btn-waypoint    {color: #eeeeee; background-color: #a07be0; border-color: #a07be0;}
.dark-mode .zml-ds-btn-reassign    {color: #eeeeee; background-color: #db5da4; border-color: #db5da4;}
.dark-mode .zml-ds-btn-transfer    {color: #eeeeee; background-color: #4caf50; border-color: #4caf50;}
.dark-mode .zml-ds-btn-complete    {color: #eeeeee; background-color: #2196f3; border-color: #2196f3;}

/* 이송 상태 color */
.zml-status-00            {color: #6c757d;}		/* 접수예정 */
.zml-status-10            {color: #343a40;}		/* 접수대기 */
.zml-status-20            {color: #ffc107;}		/* 이관요청중 */
.zml-status-30            {color: #17a2b8;}		/* 이송접수 */
.zml-status-40            {color: #28a745;}		/* 이송중 */
.zml-status-50            {color: #007bff;}		/* 완료 */
.zml-status-60            {color: #8000ff;}		/* 예약 */
.zml-status-70            {color: #ffc107;}		/* 이송반장지정이관 */
.zml-status-80            {color: inherit;}			/* 없음 */
.zml-status-90            {color: #dc3545;}		/* 취소 */
/* Dark Mode */
.dark-mode .zml-status-00 {color: #6c757d !important;}	/* 접수예정 */
.dark-mode .zml-status-10 {color: #777777 !important;}	/* 접수대기 */
.dark-mode .zml-status-20 {color: #f39c12 !important;}	/* 이관요청중 */
.dark-mode .zml-status-30 {color: #3498db !important;}	/* 이송접수 */
.dark-mode .zml-status-40 {color: #00bc8c !important;}	/* 이송중 */
.dark-mode .zml-status-50 {color: #2492ff !important;}	/* 완료 */
.dark-mode .zml-status-60 {color: #a953ff !important;}	/* 예약 */
.dark-mode .zml-status-70 {color: #f39c12 !important;}	/* 이송반장지정이관 */
.dark-mode .zml-status-80 {color: inherit !important;}		/* 없음 */
.dark-mode .zml-status-90 {color: #e74c3c !important;}	/* 취소 */

/* 이송 구분 상태 color */
.zml-reqtype-E            {color: #dc3545;}	/* 응급 */
.zml-reqtype-R            {color: inherit;}		/* 일반 */
.zml-reqtype-S            {color: inherit;}		/* 간편일반 */
.zml-reqtype-W            {color: #dc3545;}	/* 간편응급 */
/* Dark Mode */
.dark-mode .zml-reqtype-E {color: #e74c3c !important;}	/* 응급 */
.dark-mode .zml-reqtype-R {color: inherit !important;}		/* 일반 */
.dark-mode .zml-reqtype-S {color: inherit !important;}		/* 간편일반 */
.dark-mode .zml-reqtype-W {color: #e74c3c !important;}	/* 간편응급 */


/* Dashboard 이송 리스트 상세 정보 table */
.zml-ds-table {border: 1px solid #dee2e6 !important;}
.zml-ds-table th {background-color:#EAEAEA; border: 1px solid #dee2e6 !important; padding:0.25rem 0.5rem !important;}
.zml-ds-table td {background-color:#FAFAFA; border: 1px solid #dee2e6 !important; padding:0.25rem 0.5rem !important;}

.dark-mode .zml-ds-table {border: 1px solid #dee2e6 !important;}
.dark-mode .zml-ds-table th {background-color:#414141; border: 1px solid #555555 !important; padding:0.25rem 0.5rem !important;}
.dark-mode .zml-ds-table td {background-color:#3A3A3A; border: 1px solid #555555 !important; padding:0.25rem 0.5rem !important;}

.zml-show-route {cursor: pointer;}
.zml-show-route:hover {cursor: hand;}

/* Dashboard 경로 팝업 */
.zml-route-waypoint-item {
	display: flex;
	align-items: center;
	padding: 5px 0;
	margin: 5px 0;
}

/* 이미지 아이콘 스타일 */
.zml-route-waypoint-icon {
	background-image: url('../images/dashboard/ds-waypoint-light.png');
	width: 12px;
	height: 12px;
	margin-left: 2px; /* 텍스트와의 간격 */
	margin-right: 17px; /* 텍스트와의 간격 */
	border: 0;
}

.zml-route-waypoint-icon-active {
	background-image: url('../images/dashboard/ds-waypin-light.png');
	width: 16px;
	height: 16px;
	margin-right: 15px; /* 텍스트와의 간격 */
	border: 0;
}

/* 이미지 아이콘 스타일 */
.dark-mode .zml-route-waypoint-icon {
	background-image: url('../images/dashboard/ds-waypoint-dark.png');
	width: 12px;
	height: 12px;
	margin-left: 2px; /* 텍스트와의 간격 */
	margin-right: 17px; /* 텍스트와의 간격 */
}

.dark-mode .zml-route-waypoint-icon-active {
	background-image: url('../images/dashboard/ds-waypin-dark.png');
	width: 16px;
	height: 16px;
	margin-right: 15px; /* 텍스트와의 간격 */
}


/* 항목 텍스트 스타일 */
.zml-route-waypoint-active-text {
	font-weight: bold;
}

/* 항목 사이의 구분 점 스타일 */
.zml-route-waypoint-separator {
	width: 6px;
	height: 6px;
	background-color: #c2c2c2;
	border-radius: 50%;
	margin: 5px 0 5px 5px; /* 아이콘과 같은 들여쓰기를 위한 margin-left */
}
.dark-mode .zml-route-waypoint-separator {
	width: 6px;
	height: 6px;
	background-color: #999999;
	border-radius: 50%;
	margin: 5px 0 5px 5px; /* 아이콘과 같은 들여쓰기를 위한 margin-left */
}

/* width 범위 넘어가면 ... 처리  */
.zml-truncate-text {
	/* 1. Prevents text from wrapping to the next line */
	white-space: nowrap;
	/* 2. Hides any content that overflows the container */
	overflow: hidden;
	/* 3. Replaces the hidden text with an ellipsis */
	text-overflow: ellipsis;
	/* Optional: To make the span respect width/overflow properties */
	display: block; 
}

/* 일반 Table */
.zml-table {border: 1px solid #dee2e6 !important;}
.zml-table th {background-color:#EAEAEA; border: 1px solid #dee2e6 !important; padding:0.35rem 0.5rem !important;}
.zml-table td {background-color:#FFFFFF; border: 1px solid #dee2e6 !important; padding:0.35rem 0.5rem !important;}

.dark-mode .zml-table {border: 1px solid #dee2e6;}
.dark-mode .zml-table th {background-color:#414141; border: 1px solid #555555 !important; padding:0.35rem 0.5rem !important;}
.dark-mode .zml-table td {background-color:#3A3A3A; border: 1px solid #555555 !important; padding:0.35rem 0.5rem !important;}

.dark-mode .card-default {
	background-color: #252525;
}

/* card class 커스텀 */
/* Card Body padding 1.25rem -> 0.75rem 변경 */
.card-body {
	padding: 0.75rem;
}
/* Card Body에 스크롤을 적용 */
.card-body.scrollable-content {
	/* max-height: 1000px; */ /* 고정 높이 설정 (HTML style 속성 대신 CSS로 관리할 경우) */
	overflow-y: auto; /* 세로 스크롤바 자동 생성 */
	-webkit-overflow-scrolling: touch; /* iOS 장치에서 스크롤 부드럽게 */
	/* background-color: #f8f9fa; /* 예시 배경색 */
	/* border: 1px solid #dee2e6; /* 예시 테두리 */
	margin-bottom: 10px; /* 스크롤시 하단 여백 */
}

/* Card Class Header */
.zml-card-Primary:not(.card-outline)>.card-header {background-color: #608bc8;}
.zml-card-Primary:not(.card-outline)>.card-header, .zml-card-primary:not(.card-outline)>.card-header a {color: #f1f1f1;}
.zml-card-primary.card-outline {border-top: 3px solid #608bc8;}

/* Dark Card Class Header */
.zml-card-Primary:not(.card-outline)>.card-header {background-color: #446ca5;}
.zml-card-Primary:not(.card-outline)>.card-header, .zml-card-primary:not(.card-outline)>.card-header a {color: #f1f1f1;}
.zml-card-primary.card-outline {border-top: 3px solid #446ca5;}

/* CARD 버튼 위치 왼쪽으로 이동 */
.zml-card-title-left { 
	margin-left: 1.5rem;
}
.zml-card-tools-left { 
	position: absolute;
	top: 0.5rem;
	left: 0.625rem;
	float: left;
}

/* 버튼 */
.zml-btn-header-margin {margin-top: -0.1rem !important; margin-left: 0.25rem !important;}
.zml-btn-sm            {padding: 0 10px; font-size: .875rem; /* line-height: 1.5; border-radius: .2rem; height:2rem; */}
.zml-btn-status-sm     {padding: 0 10px; font-size: .75rem;  line-height: 1.5; border-radius: .2rem; height:1.5rem;}

.zml-grid-btn-sm       {font-size:0.875rem;}
.zml-grid-btn-icon     {font-size:1rem !important; background-color: transparent; margin-top: -1px;}

.btn.btn-xs {
	font-size:0.75rem !important;
}


/* 박스 없는 아이콘 버튼 */
.zml-ico-danger {
  color: #ff6666;
  background-color: transparent;
  border-color: transparent;
  box-shadow: none;
}

.zml-ico-danger:hover {
  color: #e25e5e;
}

.zml-ico-danger:focus, .zml-ico-danger.focus {
  color: #e25e5e;
}

.zml-ico-danger.disabled, .zml-ico-danger:disabled {
  color: #f1f1f1;
}

.dark-mode .zml-ico-danger {
  color: #fff;
  background-color: #e74c3c;
  border-color: #e74c3c;
  box-shadow: none;
}

.dark-mode .zml-ico-danger:hover {
  color: #fff;
  background-color: #e12e1c;
  border-color: #d62c1a;
}

.dark-mode .zml-ico-danger:focus, .dark-mode .zml-ico-danger.focus {
  color: #fff;
  background-color: #e12e1c;
  border-color: #d62c1a;
  box-shadow: 0 0 0 0 rgba(235, 103, 89, 0.5);
}

.dark-mode .zml-ico-danger.disabled, .dark-mode .zml-ico-danger:disabled {
  color: #fff;
  background-color: #e74c3c;
  border-color: #e74c3c;
}


/* Default */
.zml-btn-light  {color: #444444; background-color: #f8f9fa; border-color: #dddddd; box-shadow: none;}
.zml-btn-silver {color: #f1f1f1; background-color: #afafaf; border-color: #afafaf; box-shadow: none;}
.zml-btn-gray   {color: #f1f1f1; background-color: #777777; border-color: #777777; box-shadow: none;}
.zml-btn-red    {color: #f1f1f1; background-color: #ff6666; border-color: #ff6666; box-shadow: none;}
.zml-btn-orange {color: #f1f1f1; background-color: #ff9e54; border-color: #ff9e54; box-shadow: none;}
.zml-btn-purple {color: #f1f1f1; background-color: #b18aea; border-color: #b18aea; box-shadow: none;}
.zml-btn-green  {color: #f1f1f1; background-color: #64c38a; border-color: #64c38a; box-shadow: none;}
.zml-btn-sky    {color: #f1f1f1; background-color: #78a7e9; border-color: #78a7e9; box-shadow: none;}
.zml-btn-blue   {color: #f1f1f1; background-color: #3a78e5; border-color: #608bc8; box-shadow: none;}

/* Hover */
.zml-btn-light:hover, .zml-btn-light:active, .zml-btn-light.hover    {color: #2b2b2b; background-color: #e9ecef; border-color: #dddddd;}
.zml-btn-silver:hover, .zml-btn-silver:active, .zml-btn-silver.hover {color: #f1f1f1; background-color: #0069d9; border-color: #0062cc;}
.zml-btn-red:hover    {color: #fff; background-color: #c82333; border-color: #bd2130;}    
.zml-btn-green:hover  {color: #fff; background-color: #218838; border-color: #1e7e34;}
.zml-btn-blue:hover   {color: #fff; background-color: #0069d9; border-color: #0062cc;}

/* disable */
.zml-btn-light.disabled, .zml-btn-light:disabled {color: #777777; background-color: #f8f9fa; border-color: #dddddd; box-shadow: none;}
.zml-btn-red.disabled,   .zml-btn-red:disabled   {color: #777777; background-color: #f8f9fa; border-color: #dddddd; box-shadow: none;}
.zml-btn-green.disabled, .zml-btn-green:disabled {color: #777777; background-color: #f8f9fa; border-color: #dddddd; box-shadow: none;}
.zml-btn-blue.disabled,  .zml-btn-blue:disabled  {color: #777777; background-color: #f8f9fa; border-color: #dddddd; box-shadow: none;}

/* Dark Default */
.dark-mode .zml-btn-light  {color: #f1f1f1; background-color: #3a4047; border-color: #6c757d; box-shadow: none;}
.dark-mode .zml-btn-silver {color: #f1f1f1; background-color: #777777; border-color: #777777; box-shadow: none;}
.dark-mode .zml-btn-gray   {color: #f1f1f1; background-color: #555555; border-color: #555555; box-shadow: none;}
.dark-mode .zml-btn-red    {color: #f1f1f1; background-color: #e25e5e; border-color: #e25e5e; box-shadow: none;}
.dark-mode .zml-btn-orange {color: #f1f1f1; background-color: #f28c45; border-color: #f28c45; box-shadow: none;}
.dark-mode .zml-btn-purple {color: #f1f1f1; background-color: #a07be0; border-color: #a07be0; box-shadow: none;}
.dark-mode .zml-btn-green  {color: #f1f1f1; background-color: #45ac6b; border-color: #45ac6b; box-shadow: none;}
.dark-mode .zml-btn-sky    {color: #f1f1f1; background-color: #608bc8; border-color: #608bc8; box-shadow: none;}
.dark-mode .zml-btn-blue   {color: #f1f1f1; background-color: #446ca5; border-color: #446ca5; box-shadow: none;}

/* Dark Hover */
.dark-mode .zml-btn-light:hover, .dark-mode .zml-btn-light:active, .dark-mode .zml-btn-light.hover    {color: #dee2e6; background-color: #3f474e; border-color: #727b84;}
.dark-mode .zml-btn-silver:hover, .dark-mode .zml-btn-silver:active, .dark-mode .zml-btn-silver.hover {color: #f1f1f1; background-color: #0069d9; border-color: #0062cc;}
.dark-mode .zml-btn-red:hover    {color: #fff; background-color: #e12e1c; border-color: #d62c1a;}
.dark-mode .zml-btn-green:hover  {color: #fff; background-color: #009670; border-color: #008966;}
.dark-mode .zml-btn-blue:hover   {color: #fff; background-color: #335476; border-color: #304e6d;}
    
/* disable */
.dark-mode .zml-btn-light.disabled, .dark-mode .zml-btn-light:disabled {color: #aaaaaa; background-color: #3c3c3c; border-color: #3a3a3a; box-shadow: none;}
.dark-mode .zml-btn-red.disabled,   .dark-mode .zml-btn-red:disabled   {color: #aaaaaa; background-color: #3c3c3c; border-color: #3a3a3a; box-shadow: none;}
.dark-mode .zml-btn-green.disabled, .dark-mode .zml-btn-green:disabled {color: #aaaaaa; background-color: #3c3c3c; border-color: #3a3a3a; box-shadow: none;}
.dark-mode .zml-btn-blue.disabled,  .dark-mode .zml-btn-blue:disabled  {color: #aaaaaa; background-color: #3c3c3c; border-color: #3a3a3a; box-shadow: none;}
    
/* Form Control */
.zml-form-control {
	font-size: 0.875rem;
	/*     height: 2rem;
        padding: 0rem 0.375rem; */
}
.zml-form-margin {margin-left: 0.25rem; margin-right: 0.25rem; margin-bottom: 0.25rem;} /* form 좌우 여백 */
.zml-form-inline-search {margin-bottom: 0px; margin-left: -7.5px; margin-right: -7.5px;}
.zml-form-check-input {
	/* position: absolute; */
	margin-top: 0.5rem;
	/* margin-left: -1.25rem; */
	vertical-align: text-bottom;
	margin-bottom: 0.125rem;
}

.zml-input-group-text {
	background-color: #fff;
	border: 1px solid transparent;
}
/* input-group 내 input에 50% 너비를 강제 적용 */
.input-group .form-control.zml-w50-percent {
	flex: 0 0 50% !important; /* flex-grow, flex-shrink, flex-basis */
	max-width: 50% !important; /* 최대 너비 제한 */
}

/* input-group-append에 50% 너비를 강제 적용 */
.input-group .input-group-append.zml-w50-percent {
	flex: 0 0 50% !important;
	max-width: 50% !important;
}

/* 텍스트가 잘리지 않도록 줄 바꿈 방지 (필요 시) */
.input-group .input-group-append.zml-w50-percent .input-group-text {
	white-space: nowrap; /* 텍스트가 길 경우 줄 바꿈 방지 */
	overflow: hidden; /* 넘치는 텍스트 숨김 */
	text-overflow: ellipsis; /* 넘치는 텍스트에 ... 표시 (선택 사항) */
}

/* dark-mode에서 form-control */
.dark-mode .form-control:disabled, .dark-mode .form-control[readonly] {
    background-color: #2c2c2c !important;
    opacity: 1;
    color: #999999 !important;
}

/* Form border 라운드 강제 적용하기 */
.zml-form-control-radius {border-radius: .25rem !important;}

/* select box 마진*/
.zml-select-padding {
	padding-left: 0.25rem;
	padding-right: 0.25rem;
}

.zml-cmmt-color-silver {color: #777777;}


/* select2 custom */
select.form-control-sm~.select2-container--default {font-size:inherit; width:100% !important;;}
.text-sm .select2-container--default .select2-selection--single .select2-selection__rendered, select.form-control-sm~.select2-container--default .select2-selection--single .select2-selection__rendered {margin: -0.5rem;}
.select2-container--default .select2-selection--single{border-color: #ced4da; border-radius: .25rem; /* 외곽 라운드 */}
.select2-container .select2-selection--single .select2-selection__rendered{padding-left: 4px; /* selectbox 좌측 여백 */}
.select2-container--default.select2-container--open .select2-selection--single{border-color: #ced4da; /* 선택된 border 컬러 */} 
.select2-container--default .select2-dropdown {border-color: #ced4da; /* dropdownlist border 컬러 */}
.select2-container--default .select2-search--dropdown .select2-search__field{border-color: #ced4da; /* filter input box border 색상 */}
.select2-search--dropdown .select2-search__field{font-size:0.875rem; padding:.25rem .5rem; /* filter input box */}
.text-sm .select2-container--default .select2-selection--single .select2-selection__arrow, select.form-control-sm~.select2-container--default .select2-selection--single .select2-selection__arrow{top:1px; /* 화살표 버튼 위치 */}

.dark-mode .select2-container--default .select2-selection--single{color: #fff; border-color: #6c757d; background-color: #343a40;} 
.dark-mode .select2-container--default.select2-container--open .select2-selection--single{border-color: #ced4da; /* 선택된 border 컬러 */}
.dark-mode .select2-container--default .select2-dropdown {border-color: #ced4da; /* dropdownlist border 컬러 */}
.dark-mode .select2-container--default .select2-search--dropdown .select2-search__field{border-color: #ced4da; /* filter input box border 색상 */}
/* .dark-mode .text-sm .select2-container--default .select2-selection--single .select2-selection__rendered, select.form-control-sm~.select2-container--default .select2-selection--single .select2-selection__rendered {color: #fff;} */
.dark-mode .select2-container--default .select2-selection--single .select2-selection__rendered {color:#fff;}
.dark-mode .select2-container--default.select2-container--disabled .select2-selection--single {
    background-color: #2c2c2c !important;
    color: #999999 !important;	
}


/* jquery-ui datapicker */
.ui-datepicker {
    z-index: 9999 !important;
}
/* "Today" 버튼의 배경색과 글자색을 변경 */
.ui-datepicker-current {
	background-color: #007bff !important;
	color: white !important;
	border-radius: 5px;
}
/* "Close" 버튼의 스타일 변경 */
.ui-datepicker-close {
	background-color: #f8f9fa !important;
	color: #333 !important;
	border-radius: 5px;
}

/* 하이라이트 된 날짜 색상 */
.ui-state-highlight{
	border: 1px solid #dad55e;
    background: #fffa90;
    color: #777620;
}

/* 선택된 날짜 색상 */
.ui-state-active {
    border: 1px solid #003eff;
    background: #007fff;
    font-weight: normal;
    color: #fff;
}


.label-cell {
	background-color: #f2f2f2;  /* 밝은 회색 */
	color: #000;               /* 글자는 검정 */
	font-weight: bold;         /* 강조 */
}

/***************************************************************/
/* label 풍선도움말 박스 */
.zml-tooltip-label {
	cursor: pointer;
}
/* 풍선도움말 박스 label 바로 아래에 위치 */
#zml-tooltip-bubble {
	display: none; /* Hidden by default */
	position: absolute;
	background-color: #fff9c4; /* 노란색 계열 배경색 (연한 노랑) */
	border: 1px solid #fbc02d; /* 노란색 계열 테두리 색상 (진한 노랑) */
	border-radius: 5px;
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
	padding: 8px 12px;
	white-space: nowrap;
	font-size: 1rem;
	z-index: 999;
}
/* 풍선도움말 위에 삼각뿔 생성 */
.zml-tooltip-triangle {
	position: absolute;
	top: -8px; /* Position above the tooltip bubble */
	left: 50px;  /* 풍선도움말 박스 시작에서 10px 떨어지게 */
	/* left: 50%; */ /* 풍선도움말 박스 중앙에 위치 */
	/* transform: translateX(-50%); */ /* 풍선도움말 박스 중앙에 위치 */
	width: 0;
	height: 0;
	border-left: 8px solid transparent;
	border-right: 8px solid transparent;
	border-bottom: 8px solid #fbc02d; /* 삼각뿔 테두리 색상 */
}
/* 삼각뿔 내부 */
.zml-tooltip-triangle::after {
	content: '';
	position: absolute;
	top: 1px;
	left: -8px;
	width: 0;
	height: 0;
	border-left: 8px solid transparent;
	border-right: 8px solid transparent;
	border-bottom: 8px solid #fff9c4; /* 삼각뿔 내부 색상 */
}
.zml-tooltip-content {
	font-size: 0.875rem;
}
.dark-mode .zml-tooltip-content {
	color: #333;
	font-size: 0.875rem;
}
/***************************************************************/


/* .dark-mode 클래스가 없을 때 (기본 라이트 모드) 적용 */
/* 모든 스크롤바의 기본 스타일 (라이트 모드) */
::-webkit-scrollbar {
	width: 10px;
}
::-webkit-scrollbar-track {
	background: #f8f9fa;				/* 배경색 */
	border-radius: 10px;
}
::-webkit-scrollbar-thumb {
	background: #ced4da;				/* 핸들 */
	border-radius: 10px;
}
::-webkit-scrollbar-thumb:hover {
	background: #adb5bd;				/* 호버 시 약간 어두운 색으로 변경 */
}
body {
	scrollbar-width: thin;
	scrollbar-color: #ced4da #f8f9fa;	/* 핸들, 트랙 색상 */
}

/* 다크 모드 스타일 (.dark-mode 클래스가 있을 때 오버라이드) */
.dark-mode::-webkit-scrollbar-track {
	background: #1a202c;				/* 배경색 */
}
.dark-mode::-webkit-scrollbar-thumb {
	background: #4a5568;				/* 핸들 */
}
.dark-mode::-webkit-scrollbar-thumb:hover {
	background: #718096;				/* 호버 시 약간 어두운 색으로 변경 */
}
.dark-mode {
	background-color: #1c1c1c !important;
	scrollbar-width: thin;
	scrollbar-color: #4a5568 #1a202c;	/* 핸들, 트랙 색상 */
}
/***************************************************************/

/* 상단 바 */
.navbar {
	padding: .25rem 0rem;
}

/* Dark Mode */
/* 기본 바탕 */
.dark-mode .content-wrapper {
	background-color: #1c1c1c !important;
}
/* 상단 바탕 */
.dark-mode .navbar-dark {
	background-color: #2c2c2c !important;
}

/* 사이드바 바탕 */
[class*=sidebar-dark-] {
    background-color: #2c2c2c;
}

/* 상단 로고 높이 */
.brand-link {
	padding: 0.725rem .5rem !important;
	height: 2.8125rem !important; /* 45px*/
}
/* 상단 logo 바탕 */
.layout-navbar-fixed .wrapper .sidebar-dark-primary .brand-link:not([class*=navbar]) {
    background-color: #2c2c2c;
}
/* 사이드바 하단 도착예정상태 */
[class*=sidebar-dark] .sidebar-custom {
    border-top: 0px solid #4f5962;
}

/* 배경 컬러 색상 */
.dark-mode .bg-primary {
	background-color: #3f6791 !important;
}


/* smartedor */
.se2_inputarea {
	/* dark mode 일때 배경 흰색 유지 */
	background-color: #fff !important;
}

 /* 공지 내용 영역은 기본적으로 일반 두께 */
#contentView {
 font-weight: normal;
}

/* 에디터에서 들어온 <b>, <strong>도 굵게 안 보이게 */
#contentView b,
#contentView strong {
	/* font-weight: normal !important; */  /* 필요하면 !important 붙여주기 */
}

/* 검색영역의 dropdown  item */
.zml-dropdown-item-sb {
 	background-color: transparent;
}
.zml-dropdown-item-sb:hover {
 	background-color: #f0f3f8;
}
a.zml-dropdown-item-sb {
 	color: #444;
}
a.zml-dropdown-item-sb:hover {
 	color: #1967d2;
	background-color: #f0f3f8;
}

.dark-mode .zml-dropdown-item-sb {
 	background-color: transparent;
}
.dark-mode .zml-dropdown-item-sb:hover {
 	background-color: #335476;
}
.dark-mode a.zml-dropdown-item-sb {
 	color: #fff;
}
.dark-mode a.zml-dropdown-item-sb:hover {
 	color: #fff;
}