@charset "utf-8";
@import url(general.css); /* 공통스타일 */
@import url(layout.css); /* 메인 및 서브 레이아웃 */
@import url(content.css); /* 서브 컨텐츠 */
@import url(/resource/css/web/fonts/pretendard/font_pre.css); /* 서체 */


/* 테마 선언 */
:root, :root.light {
	/* 	color */
	--bg-color:#fff;  /*흰색 배경*/
	--bg02-color:#fff;  /*흰색 배경, 실시간객실상태 room_li */
	--main-bg-color: #f4f5f8;  /*메인 백그라운드 컬러, 좌측메뉴 및 테이블 th*/
	--table-bg-color: #fff;  /*테이블 흰색 배경 td, */
	--table-sub-color: #f8f8f8;  /*테이블 하단 tfoot 컬러*/
	--table-roomname-color: #f7f7f7;  /*객실현황 룸이름 및 호수 부분*/
	--button-color: #fff;  /*우측상단 버튼*/
	--main-green-color: #437855; /*메인 녹색 컬러, 대메뉴 제목 및*/
	--sub01-bg-color: #c3c6d4;  /*검색 버튼*/
	--top-menu-color: #d0d4e4;  /*헤더 탑메뉴 라인 컬러*/
	--menu-inout-color: #d5d5d5; /*좌측 메뉴 호버 시 색상*/
	--scroll-bg-color: #f5f5f5; /*스크롤바 밑의 배경*/
	--scroll-thumb-color: #bdbfc7; /*실질적 스크롤바*/
	--w2ui-table-main-color: #fff;  /*검색팝업 테이블 tr 마다 다른 색-흰색배경*/
	--w2ui-table-sub-color: #f3f6fa;  /*검색팝업 테이블 tr 마다 다른 색-하늘*/
	--w2ui-table-head-color: #f5f5f5;  /*검색팝업 테이블 thead 컬러*/
	--w2ui-table-selcet-color: #b6d5ff;  /*검색팝업 테이블 셀릭 시 컬러*/
	--w2ui-selcet02-color: #d0d0d0;  /*검색팝업 테이블 셀릭 시 컬러02*/
	--w2ui-tabel-hover-color :#E6F0FF;  /*검색팝업 테이블 호버 시 컬러*/
	--today-bg-color: #CCE5FF; /*객실현황 투데이버튼 팝업 관련*/
	--popup-bg-color: #fff;  /*팝업 백그라운드*/
	--popok-bg-color: #e3e3e3;  /*팝업 ok 버튼 bg*/
	--drag-bg-color: #8e8e8c;  /*드레그 백그라운드 컬러*/
	
	--cancle-btn-color: #6d6d6d;  /*예약등록>예약금취소 color, 체크인아웃 입금취소,  */
	--calander-notmonth-color: #f8f8f8; /*예약캘린더 이번달 아닌 배경색*/
	--calander-today-color: #e5f2ff;  /*예약캘린더 투데이*/
	--calander-active-color: #e4f5e5;  /*예약캘린더 선택 배경색*/
	--calander-sat-color: #4141ff;  /*객실현황, 예약캘린더 달력 토요일*/
		
	--main-border-color: #e6e9ef;  /*메인 보더컬러, 테이블 및 인풋박스*/
	--sub01-border-color: #b9bdc7;  /*체크박스 보더*/
	--sub02-border-color: #d0d4e4;  /*헤더 탑메뉴, 좌측 메뉴 라인 보더*/
	--sub03-border-color: #000;  /*객실현황 객실타입 분리 보더*/
	--main-before-workdate-color:#e3e3e3; /* 객실현황 영업일자 이전 td 색상 */
	--button-border-color: #dcdfec; /*우측상단 버튼 보더*/
	--popup-boder-color: #d5d8d8;  /*팝업 확인버튼 탑보더*/
	--card-table-border-color: #ddd;  /*고객등록카드 테이블 보더 css 별도*/
	--card-bg-color: #eee;  /*고객등록카드 .pp_agree01 bg*/
	--cms-bg-color: #ffffe9;  /*cms 노랑배경*/
	
	--hover-color: #CCE5FF; /*우측 버튼 호버 시, */
	--menu-hover-color: #EAECF1; /*좌측 메뉴 메뉴 호버 시 색상*/
	--menu-active-bg : #2c2c2c; /*좌측 메뉴 메뉴엑티브 시 색상*/
	--active-td-bg : #bbdbc9;  /*테이블 셀렉, 엑티브 시 녹색*/
	--popup-active-bg: #ccc;  /*팝업 버튼 클릭 시 배경*/
	--popup-disabled-bg: #F1F1F1; /*tb_popup_01 select:disabled*/
	
	--main-txt-color: #323338;
	--main-hover-txt-color: #000;
	--sub-txt-color: #676879;
	--sub02-txt-color: #676879; /*서브컬러와 동일, 다크모드 시 좀더 어둡게*/
	--menu-txt-color: #fff;  /*좌측 소메뉴 엑티브 시 텍스트 색*/
	--date-txt-color: #808080;  /*객실현황 테이블 요일 컬러*/
	--money-txt-color: red;  /*총매출 인라인*/
	
	--dashbd-txt-color: #666;   /*대시보드 #666*/
	--dashbd-active-color: #1A73E8;  /*대시보드 테이블 엑티브*/
	
	--checkin-cancel-color: #ffdddd; /*예약 등록 -> 체크인 취소 색상*/
	--reve-cancel-color: #ffdddd; /*예약 등록 -> 예약 취소 색상*/
	--tr-cancel-color: #a3a3a3; /*매출/입금 당일 취소 tr 색상 >> 다음날 취소 */
	--tr-cancel2-color: #c9c9c9; /*매출/입금 전일 취소 tr 색상 >> 당일 취소*/
	--tr-cancel3-color: #ffcccc; /* 현금/카드 승인내역 조회 실패 tr 색상 , 미결산페이지 취소 */
	--tr-transfer-color: #98acbf; /* 빌이체 tr 색상 */
	--tr-bal-checkout-color:#efefef; /*미결산내역 체크아웃 tr 색상*/
	
	--input-cancel-color:#fff;	/*취소상태 tr의 인풋 백그라운드 원복*/
	
	/* 	font-weight */
	--weight-semi-bold: 500;
	--weight-regular: 400;
	
	/*svg filter*/
	--main-green-filter: invert(39%) sepia(19%) saturate(949%) hue-rotate(88deg) brightness(99%) contrast(82%);  /*svg 메인 그린컬러 #437855*/
	--menu-icon-filter: invert(42%) sepia(4%) saturate(1499%) hue-rotate(199deg) brightness(93%) contrast(82%); /*좌측 메뉴 바로가기 아이콘 #676879, */
	--menu-icon-hover-filter:invert(0%) sepia(90%) saturate(7500%) hue-rotate(166deg) brightness(101%) contrast(92%);  /*좌측 메뉴 arrow 아이콘 호버 및 액티브 시 색상 #000*/
	--login-filter: invert(0);  /*로그인 아이콘 반전 속성*/
	--top-menu-icon-filter: none;
	
	/*box-shadow*/
	--box-shadow: 1px 1px 5px -0.5px #d5d5d5; /*실시간 객실상태 박스쉐도우*/
	--box-shadow-popup : 3px 3px 7px #aaaaaa;  /*팝업 박스쉐도우*/
	--box-shadow-w2uipop : 0px 0px 25px #797979;  /*w2ui 팝업 (알림팝업)*/
	
}

:root.dark {
	--bg-color: #17181a; /*흰색 배경*/
	--bg02-color:#212527;  /*흰색 배경, 실시간객실상태 room_li */
	--main-bg-color: #212527;  /*메인 백그라운드 컬러, 좌측메뉴 및 테이블 th*/
	--table-bg-color: #2f3437;  /*테이블 흰색 배경 td, */
	--table-sub-color: #212527;  /*테이블 하단 tfoot 컬러*/
	--table-roomname-color: #212527;  /*객실현황 룸이름 및 호수 부분*/
	--button-color: #2f3437;  /*우측상단 버튼*/
	--main-green-color: #63bd87; /*메인 녹색 컬러, 대메뉴 제목 및*/
	--sub01-bg-color: #797e93;  /*검색 버튼*/
	--top-menu-color: #4d5057;  /*헤더 탑메뉴 라인 컬러*/
	--menu-inout-color: #303c4a; /*좌측 메뉴 호버 시 색상*/
	--scroll-bg-color: #17181a;; /*스크롤바 밑의 배경*/
	--scroll-thumb-color: #96979d; /*실질적 스크롤바*/
	--w2ui-table-main-color: #2f3437;  /*검색팝업 테이블 tr 마다 다른 색-흰색배경*/
	--w2ui-table-sub-color: #212527;  /*검색팝업 테이블 tr 마다 다른 색-하늘*/
	--w2ui-table-head-color: #797e93;  /*검색팝업 테이블 thead 컬러*/
	--w2ui-table-selcet-color: #4f6685;  /*검색팝업 테이블 셀릭 시 컬러*/
	--w2ui-selcet02-color: #4f6685;  /*검색팝업 테이블 셀릭 시 컬러02*/
	--w2ui-tabel-hover-color :#97a5b8;  /*검색팝업 테이블 호버 시 컬러*/
	--today-bg-color: #283964; /*객실현황 투데이버튼 팝업 관련*/
	--popup-bg-color: #2f3437;  /*팝업 백그라운드*/
	--popok-bg-color: #394d65;  /*팝업 ok 버튼 bg*/
	--drag-bg-color: #557fde;  /*드레그 백그라운드 컬러*/
	
	--cancle-btn-color: #d5d8df;  /*예약등록>예약금취소 color, */
	--calander-notmonth-color: #17181a; /*예약캘린더 이번달 아닌 배경색*/
	--calander-today-color: #5d84a5;  /*예약캘린더 투데이*/
	--calander-active-color: #394d65;  /*예약캘린더 선택 배경색*/
	--calander-sat-color: #1f84ec;  /*객실현황, 예약캘린더 달력 토요일*/
		 
	--main-border-color: #4c5255;  /*메인 보더컬러, 테이블 및 인풋박스*/
	--sub01-border-color: #b9bdc7;  /*체크박스 보더*/
	--sub02-border-color: #4d5057;   /*헤더 탑메뉴, 좌측 메뉴 라인 보더*/
	--sub03-border-color: #b9bdc7;  /*객실현황 객실타입 분리 보더*/
	--main-before-workdate-color:#3e3e3e; /* 객실현황 영업일자 이전 td 색상 */
	--button-border-color: #4d5057;  /*우측상단 버튼 보더*/
	--popup-boder-color: #4c5255;  /*팝업 확인버튼 탑보더*/
	--card-table-border-color: #4c5255;  /*고객등록카드 테이블 보더 css 별도*/
	--card-bg-color: #2f3437;  /*고객등록카드 .pp_agree01 bg*/
	--cms-bg-color: #4c5255;  /*cms 노랑배경*/
	
	--hover-color: #394d65;  /*우측 버튼 호버 시, */
	--menu-hover-color: #303c4a;  /*좌측 메뉴 메뉴 호버 시 색상*/
	--menu-active-bg : #394d65;  /*좌측 메뉴 메뉴엑티브 시 색상*/
	--active-td-bg : #4a7b65;  /*테이블 셀렉, 엑티브 시 녹색*/
	--popup-active-bg: #303c4a;  /*팝업 버튼 클릭 시 배경*/
	--popup-disabled-bg: #2f3437; /*tb_popup_01 select:disabled*/
	
	--main-txt-color: #d5d8df;
	--main-hover-txt-color: #e6e9ef;
	--sub-txt-color: #e6e9ef;
	--sub02-txt-color: #d5d8df; /*서브컬러와 동일, 다크모드 시 좀더 어둡게*/
	--menu-txt-color: #d5d8df;  /*좌측 소메뉴 엑티브 시 텍스트 색*/
	--date-txt-color: #e6e9ef;  /*객실현황 테이블 요일 컬러*/
	--money-txt-color: #f1d226;  /*총매출 인라인*/
	--dashbd-txt-color: #d5d8df;   /*대시보드 #666*/
	--dashbd-active-color: #6aa6f5;  /*대시보드 테이블 엑티브*/
	
	--checkin-cancel-color: #ffdddd; /*예약 등록 -> 체크인 취소 색상*/
	--reve-cancel-color: #ffdddd; /*예약 등록 -> 예약 취소 색상*/
	--tr-cancel-color: #777; /*매출/입금 당일 취소 tr 색상 */
	--tr-cancel2-color: #a3a3a3; /*매출/입금 전일 취소 tr 색상 >> 당일 취소*/
	--tr-cancel3-color: #d39090; /* 현금/카드 승인내역 조회 실패 tr 색상 , 미결산페이지 취소 */
	--tr-transfer-color: #7c92a8; /* 빌이체 tr 색상 */
	--tr-bal-checkout-color:#111111; /*미결산내역 체크아웃 tr 색상*/
	
	--input-cancel-color:#2f3437;  /*취소상태 tr의 인풋 백그라운드 원복*/
	
	/* 	font-weight */
	--weight-semi-bold: 400;
	--weight-regular: 300;
	
	/*svg filter*/
	--main-green-filter: invert(74%) sepia(10%) saturate(1538%) hue-rotate(91deg) brightness(88%) contrast(89%);  /*svg 메인 그린컬러, #63bd87*/
	--menu-icon-filter: invert(97%) sepia(2%) saturate(1236%) hue-rotate(187deg) brightness(91%) contrast(90%); /*좌측 메뉴 바로가기 아이콘, #d5d8df*/
	--menu-icon-hover-filter: invert(100%) sepia(1%) saturate(6516%) hue-rotate(178deg) brightness(94%) contrast(84%);  /*좌측 메뉴 arrow 아이콘 호버 및 액티브 시 색상 #d5d8df*/
	--login-filter: invert(100);  /*로그인 아이콘 반전 속성*/
	--top-menu-icon-filter: invert(97%) sepia(2%) saturate(1236%) hue-rotate(187deg) brightness(91%) contrast(90%); /*#d5d8df*/
	
	/*box-shadow*/
	--box-shadow: none; /*실시간 객실상태 박스쉐도우*/
	--box-shadow-popup : 3px 3px 7px #111111;  /*팝업 박스쉐도우*/	
	--box-shadow-w2uipop : 0px 0px 25px #111111;  /*w2ui 팝업 (알림팝업)*/
}
