/* 기본 스타일 */
body{background-color:#ccc;font-family:verdana,arial,helvetica,sans-serif;font-size:.8em;margin:0;padding:0;}
a{color:#C00;cursor:pointer;text-decoration:none;}
a:hover{color:#900;text-decoration:underline;}
a img{border:0;}

/* 컨테이너 */
#container{max-width:1000px;width:90%;margin:50px auto;padding:20px;background-color:#fff;border-radius:12px;box-shadow:0 0 15px rgba(0,0,0,.2);display:flex;flex-wrap:wrap;gap:20px;}

/* 메뉴 */
#menu{width:220px;padding:15px;background-color:#f8f8f8;border-radius:10px;box-sizing:border-box;height:fit-content;}
#menu ul{list-style-type:none;text-indent:-25px;}
a.menulink{color:black;text-decoration:none;}
a.menulink:hover{color:black;text-decoration:none;}

/* 메인 영역 */
#main{flex:1;min-width:0;}
#logo{padding-top:18px;text-align:center;}

/* 테이블 */
.table-wrapper{overflow-x:auto;}
table{width:100%;border:0;border-collapse:collapse;table-layout:auto;}
th{background-color:#f8f8f8;padding:12px;text-align:left;font-size:1.2em;}
td{padding:10px 10px 10px 12px;font-size:1em;vertical-align:middle;word-break:break-word;}
.row-classic{background-color:#fff;}
.row-alternate{background-color:#eee;}
.no-fax{text-align:center;}

/* 버튼/아이콘 */
.icon,.command_button{width:32px;text-align:center;}
.command_button a{font-weight:bold;}

/* 레이블/필드 */
.label,.field{background-color:#eee;text-align:left;font-size:1.1em;}

/* 로그인 전용 */
#login-container{max-width:400px;margin:50px auto;background-color:#fff;padding:30px;border-radius:12px;box-shadow:0 0 10px rgba(0,0,0,.2);}
#login-container h2{text-align:center;color:#C00;}
#login-container form{display:flex;flex-direction:column;}
#login-container label{margin-bottom:15px;font-size:1em;}
#login-container input[type="text"],#login-container input[type="password"]{width:100%;padding:8px 10px;font-size:1em;border:1px solid #999;border-radius:6px;box-sizing:border-box;}
#login-container button{background-color:#C00;color:#fff;padding:10px;font-size:1em;border:none;border-radius:6px;cursor:pointer;}
#login-container button:hover{background-color:#900;}
#login-container .error{color:red;margin-bottom:15px;text-align:center;}

/* 폴더트리 모달 */
#folderDialog{position:fixed;top:0;left:0;width:100%;height:100%;font-family:Arial,sans-serif;display:none;z-index:2000;}
#folderDialogBackdrop{position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.5);z-index:1990;}
#folderDialogContent{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:400px;max-width:90%;max-height:80%;background:#fff;overflow-y:auto;padding:15px;box-sizing:border-box;display:flex;flex-direction:column;z-index:2001;}
#folderTree{flex:1;overflow-y:auto;padding:10px;background:#f8f8f8;border-radius:10px;}
#folderTree ul{list-style:none;margin-left:20px;padding-left:0;}
.folder-item{margin:5px 0;cursor:pointer;touch-action:manipulation;}
.folder-toggle{display:inline-block;width:16px;}
.folder-item ul{display:block;}
.folder-name.selected{font-weight:bold;color:#1976D2;}
#btnMove{background-color:#C00;color:#fff;padding:10px;font-size:16px;border:none;margin-top:10px;border-radius:6px;cursor:pointer;}
#btnMove:hover{background-color:#900;}
#menuToggle{display:none;}

/* 팩스 전송 - 배지 */
.fax-status-badge{display:flex;align-items:center;gap:6px;font-size:13px;font-weight:600;}

/* 반응형 768px */
@media screen and (max-width:768px){
body{font-size:1em;line-height:2em;}
#container{max-width:87%;min-width:87%;flex-direction:column;margin:20px 10px;padding:15px;}
#menu{position:fixed;top:0;left:-250px;width:220px;height:100%;background:#fff;box-shadow:2px 0 5px rgba(0,0,0,.3);transition:left .3s ease;z-index:2100;overflow-y:auto;padding:20px;}
#menu.show{left:0;}#main{padding:10px;width:100%;}
#menuToggle{display:block;position:fixed;top:10px;right:10px;z-index:2100;background:#C00;color:#fff;padding:10px;border-radius:6px;cursor:pointer;}
th,td{font-size:.95em;padding:8px;}
table{width:96%;}
.icon,.command_button{width:40px!important;}
#btnMove{font-size:1em;padding:12px 20px;width:100%;}
}

/* 반응형 500px */
@media screen and (max-width:500px){
body{font-size:1em;line-height:2em;}
#login-container{margin:20px;padding:20px;}
#folderDialogContent{width:95%;height:90%;top:50%;left:50%;transform:translate(-50%,-50%);padding:10px;}
#folderTree{max-height:70%;}
.label{width:30%;}
.field{width:70%;}
}
