@charset "utf-8";

html, body{min-height:100%;} /* 2017-06-05 Modification */
input[readonly] {background-color: #ddd; /* light gray */color: #7d7f7c; /* dark gray */}
input[disabled] {background-color: #ddd; /* light gray */color: #7d7f7c; /* dark gray */}
select[readonly] {background-color: #ddd; /* light gray */color: #7d7f7c; /* dark gray */}
select[disabled] {background-color: #ddd; /* light gray */color: #7d7f7c; /* dark gray */}
select[multiple] {-webkit-appearance: none; /* for Chrome, Safari, and Opera */-moz-appearance: none; /* for Firefox */appearance: none; /* standard property *//* Styles to add your own custom dropdown indicator or other styling */background: white no-repeat right center; /* Add your custom arrow */border: 2px solid #ccc; /* example border */padding-right: 30px; /* Add padding to make room for the custom arrow image */}

#wrap{min-width:1200px; height:100%;}

/* header */
header{position:relative; display:table; width:100%; /*min-width:1024px;*/ height:80px; z-index:5;}
h1{display:table-cell; width:112px; min-width:112px; height:80px; text-align:center; vertical-align:middle; background-color:#243444; font-size:0; line-height:0;}

/* gnb */
#gnb{display:table-cell;}
.gnb_top{height:40px; padding:0; background-color:#40505f; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; display:table; table-layout:fixed; width:100%;}
.gnb_top h2{display:table-cell; width:50%; height:40px; font-size:18px; color:#fff; vertical-align:middle; padding-left:15px;}
.gnb_top .gnb_welcome{display:table-cell; width:50%; height:20px; font-size:12px; color:#fff; vertical-align:middle; padding-left:15px;}
.gnb_top .gnb_util{display:table-cell; width:50%; height:40px; color:#fff; font-size:0; text-align:right; vertical-align:middle; padding-right:6px;}
.gnb_top .gnb_util p{display:inline-block; vertical-align:middle; font-size:12px; max-width:300px; max-width:calc(100% - 290px);}
.gnb_top .gnb_util .logout{display:inline-block; min-width:70px; min-height:30px; line-height:1.2em; color:#fff; vertical-align:middle; background:#2d3b48; border:1px solid #273544; text-align:center; padding:7px 16px; font-size:12px; margin:3px 0 3px 5px;}
.gnb_top .gnb_util .lang{display:inline-block; vertical-align:middle; height:30px; line-height:30px; font-size:12px;  margin:3px 0 3px 5px; max-width:100%;}
.gnb_top .gnb_util .lang_select{/*width:80px;*/ height:29px; background-color:#fff;}
.gnb_top .gnb_util:after{content:''; display:block; height:0; clear:both;}
.gnb_top .gnb_util .category{display:inline-block; margin-left:25px; vertical-align:middle; font-size:12px;}
.gnb_top .gnb_util .category:after{content:''; display:block; clear:both;}
.gnb_top .gnb_util .category li{float:left; display:none;}
.gnb_top .gnb_util .category li.active{display:block;}
.gnb_top .gnb_util .category li a {display:block; padding:7px 18px; min-width:52px; min-height:30px; line-height:1.2em; font-size:12px; font-weight:bold; background-color:#21466f; color:#fff; border:1px solid #1b3d62; text-align:center; margin:3px 0 3px 5px;}
.gnb_top .gnb_util .category li:first-child.active a{color:#fff; background-color:#0f5aad; border-color:#07468b;}
.gnb_top .gnb_util .category li:last-child.active a{color:#fff; background-color:#21466f; border-color:#1b3d62;}
.gnb_top + .gnb_top{border-top:1px solid #304151;}
.gnb_bottom{display:block; min-height:40px; border-top:1px solid #304151; border-bottom:1px solid #304151; background-color:#4f5f6f;}
.gnb_m{min-width:980px; width:100%; display:none; position: relative;z-index: 99;}
.gnb_m.active{display:table; table-layout:fixed;}
.gnb_m > li{border-right:1px solid #304151; display:table-cell; width:160px; height:40px; vertical-align:middle; position:relative;z-index: 99;}
.gnb_m > li.menu_100{border-right:1px solid #304151; display:table-cell; width:auto; height:40px; vertical-align:middle; position:relative;}/* Jeongho.Park modify 2017/07/03 */
.gnb_m > li a{display:table; table-layout:fixed; width:100%; height:100%; padding:5px 15px; font-size:13px; font-weight:bold; color:#f0f3f6; text-align:left;}
.gnb_m > li a .gnb_txt{display:table-cell; width:100%; height:100%; vertical-align:middle;}
.gnb_m > li:hover{background-color:#0f5aad;}
.gnb_m > li a:hover{color:#fff;}
.gnb_m > li.active{background-color:#0f5aad;}
.gnb_m > li.active a{color:#fff;}
.gnb_m ul.dep2{ display:none; padding-top:1px; position:absolute; left:0; top:100%; width:calc(100% + 1px); z-index:99;}
.gnb_m ul.dep2 li {background-color:#f0f3f6; float:none; width:auto;}
.gnb_m ul.dep2 li a{display:block; padding:10px 15px; height:auto; border:none; line-height:20px; font-size:12px; text-align:left;}
.gnb_m ul.dep2 li:hover a {background-color:#0f5aad; color:#fff;}
.gnb_m ul a { color: black; }
.gnb_m ul ul { left: 100%; top: 0; }
.gnb_m ul ul li {float:left; margin-right:10px;}

/* wrap */
/* #con{display:block; width:100%; height:100%; margin-top:-133px; padding-top:133px; margin-bottom:-44px; padding-bottom:44px;} */
#con{display:block; width:100%; height:100%; margin-top:-133px; padding-top:133px; padding-bottom:44px;}
.con_wrap{display:none; vertical-align:top;}

/* navi */
#navi{border-bottom:1px solid #d2d8e0;}
#navi > ul{display:table; table-layout:fixed;}
#navi > ul li{display:table-cell; border-left:1px solid #d2d8e0; max-width:400px; vertical-align:middle;}
#navi > ul li:first-child{border-left:0 none;}
#navi > ul li.home{width:44px;}
#navi > ul li.home a{padding:15px 15px 14px 15px;}
#navi > ul li a{display: block; float:left; padding:15px 10px 14px 10px; font-weight:bold; color:#4f5f6f; min-width:160px;}
#navi > ul li span{display: block; float:left; padding:15px 10px 14px 10px; font-weight:bold; color:#4f5f6f; min-width:160px;} /* jeongho.Park add */
#navi > ul li:first-child a{min-width:44px;}
#navi > ul li strong{display: block; float:left; padding:15px 10px 14px 10px; font-weight:bold; color:#4f5f6f; min-width:160px;}

/* sub */
.con_main{/*min-width:745px;*/ padding:20px 20px 20px 20px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;}
.t_header{display:table; padding-bottom:10px;}
.t_header > h3 {display:table-cell; font-size:22px; color:#4f5f6f; margin-right:10px; white-space:nowrap;}
.t_header > p.summary{display:table-cell; padding:0 0 1px 5px; vertical-align:bottom;}
.ts_header{padding:5px 0;}
.ts_header > h4{background:url(../images/common/ico_subtitle.png) no-repeat left center; color:#0f5aad; font-size:13px; padding-left:23px;}
.menu_desc { font-weight: 500; font-style: italic; font-size: 16px; }

/* form controls */
select {/*width: 100%;*/ /*min-width:80px;*/ max-width:100%; height:26px; padding:.3125em 3em .3125em .3125em; color:#4f5f6f; border: 1px solid #d2d8e0; border-radius: 0px; background: url(../images/common/select_bg.png) right 0 no-repeat; -webkit-appearance: none; -moz-appearance: none; appearance: none; font-size:12px; line-height:14px;}
select::-ms-expand {display: none;}
input[type="text"], input[type="password"]{vertical-align:top; width: 100%; height:26px; line-height : 12px; padding:.488em .5em; color:#4f5f6f; border: 1px solid #d2d8e0; border-radius: 0; -webkit-appearance: none; -moz-appearance: none; appearance: none; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;}
textarea{width:100%; height:100%; border: 1px solid #d2d8e0; margin-top:7px;}
.search_select{/*width:100px;*/}
.search_input{width:240px;}
.search_input.type01, .search_input1{width:80%;}
.cal_input.hasDatepicker{width:120px; background:url(../images/common/icon_calendar.gif) no-repeat right 7px center; background-size:18px auto;}
.cal_input.hasDatepicker + span{line-height:26px;}
.check_notice{margin-left:10px;}
.check_notice:first-child{margin-left:0;}
.check_notice input{margin:0; margin-right:3px; vertical-align:middle;}
.check_notice span{vertical-align:middle;}
select.sel_type01{width:auto; max-width:100%; padding-right:34px;}

/* button wrap */
.searchT_bottom{position:relative; padding:10px 0;}
.searchT_bottom > label {display:inline-block; height:30px;}
.btn_basic{width:100%; margin-top:20px; text-align:center; font-size:0;}
.btn_basic.type01{margin-top:0; text-align:right;}
.btn_basic.type02{margin-top:0; text-align:left; width:auto;}
/*.btn_basic.type03{position:absolute; top:0; right:0; margin-top:-40px; width:auto;}*/
.btn_basic.type03{margin-top:0; text-align:right;}
.btn_basic:after{clear:both; content:''; display:block; }

/* button */
.btn_search{min-width:60px; height:30px; margin-left:5px; color:white; font-size:12px; border:1px solid lightblue; cursor:pointer; background:lightblue;}
.btn_search_disabled{min-width:60px; height:30px; margin-left:5px; color:#4f5f6f; font-size:12px; border:1px solid #304151; cursor:pointer; background:#cccccc;}
.btn_button{display:inline-block; min-width:60px; max-width:100%; height:auto; line-height:1.2; border:0; cursor:pointer; vertical-align:top; text-align:center; font-size:12px; padding:7px 10px; margin-left:5px; word-break:break-all;}
.btn_button.btn_ballotHeaderTagApplybtn_type01{background-color:#4f5f6f; border:1px solid #304151; color:#fff;}
.btn_button.btn_type01{background-color:#4f5f6f; border:1px solid #304151; color:#fff;}
.btn_button.btn_type01_disabled{background-color:#cccccc; border:1px solid #304151; color:#fff;}
.btn_button.btn_type02{background-color:#fff; border:1px solid #304151; color:#4f5f6f;}
.btn_button.btn_type02_disabled{background-color:#cccccc; border:1px solid #304151; color:#4f5f6f;}
.btn_button.btn_type03{background-color:#ececec; border:1px solid #304151; color:#304151;}
.btn_button.btn_type04{background-color:#e65100; border:1px solid #bf360c; color:#fff;}
.btn_button.btn_create{background-color:green; border:1px solid darkgreen; color:white;}
.btn_button.btn_modifySearch{background-color:lightblue; border:1px solid lightgray; color:white;}
.btn_button.btn_delCancelNo{background-color:orange; border:1px solid darkorange; color:white;}
.btn_button.btn_addSaveSubmitYes{background-color:blue; border:1px solid darkblue; color:white;}
.btn_button.btn_publ{background-color:#1d8ad5; border:1px solid #1871ab;  color:#fff;}
.btn_button.btn_upload{background:#25ad0f; border:1px solid #1a9207; color:#fff; min-width:65px;}
.btn_button.btn_upload_disabled{background:#cccccc; border:1px solid #1a9207; color:#fff; min-width:65px;}
.btn_button.btn_download{background:#fff; border:1px solid #1a9207; color:#25ad0f;}
.btn_basic .btn_button:last-child{margin-right:0;}

.search_table .btn_button, .basic_table .btn_button { height:26px; padding:5px 10px;}

/* button position */
.btn_ap_right{position:absolute; top:10px; right:0;}

/* text icon */
.ico_txt{display:inline-block; font-size:11px; vertical-align:top; line-height:1;}
.ico_txt.ico_notice{background:#0f5aad; border:1px solid #304151; border-radius:3px; color:#fff; padding:2px 4px;}
.ico_txt.ico_new{background:#465fff; border:1px solid #465fff; border-radius:3px; color:#fff; padding:0px 3px; font-size:8px;}

/* text align */
.td_left{text-align:left !important;}
.td_right{text-align:right !important;}
.td_center{text-align:center !important;}

/* font style */
.td_bold{font-weight:bold;}


/* table */
.table_box{position:relative;}

/* table - layout */
.t_header + .basic_table{margin:10px 0;}
.table_box + .ts_header{margin:20px 0 0;}
.basic_table + .ts_header{margin:20px 0 0;}

/* table - search */
.search_table{position:relative; margin:10px 0 0; border-top:3px solid #0f5aad; font-size:12px;}
.search_table table{width:100%; table-layout:fixed;}
.search_table tr th, .search_table tr td {padding:3px 10px;}
.search_table tr th {text-align:center;}
.search_table tr td {text-align:left;}
.search_table thead tr th{border:1px solid #d2d8e0; border-top:none; border-bottom:1px solid #d2d8e0; background-color:#f0f3f6;}
.search_table tbody tr th{border:1px solid #d2d8e0; background-color: #f0f3f6;}
.search_table tbody tr:first-child th{border-top:none;}
.search_table tbody tr td{border:1px solid #d2d8e0; background-color:#fff;}
.search_table tbody tr td a{font-weight:bold; color:#4f5f6f;}
.search_table tbody tr:first-child td{border-top:none;}
.search_table tfoot tr th{border:1px solid #d2d8e0; border-top:none; border-bottom:1px solid #d2d8e0;}
.search_table .th_bot{border-bottom:1px solid #d2d8e0;}
.search_table tbody tr .td_nobd_r{border-right:0 none;}
.search_table tbody tr .td_nobd_l{border-left:0 none;}

.lnbTab .tabbody { margin-top:0;}
.basic_table .btn_button { height:26px; padding:5px 10px;}

.text_ellipsis{
	white-space:nowrap;
	text-overflow:ellipsis;		/* IE, Safari */
	-o-text-overflow:ellipsis;		/* Opera under 10.7 */
	overflow:hidden;			/* "overflow" value must be different from "visible" */
}

/* table - top */
.tb_top{text-align:right;}
.tb_top:after{content:''; display:block; clear:both;}
.tb_top .tb_page{float:left; font-size:12px;}
.tb_body{width:100%;}
.tb_bottom{min-height:73px; position:relative;}
.tb_bottom .tb_page{font-size:12px; position:absolute; top:27px; left:0;}
.tb_bottom .tb_number{ position:absolute; top:20px; right:0;}
.tb_page em{font-style:normal;}

/* table - basic */
.basic_table{position:relative; border-top:3px solid #0f5aad;  margin:5px 0 0; font-size:12px; width:100%; overflow-x:auto;}
.basic_table table{table-layout:fixed; width:100%;}
.basic_table tr th, .basic_table tr td{padding:5px 10px; text-align:center; line-height:16px; height:33px;}
.basic_table tbody tr th{border:1px solid #d2d8e0; font-weight:normal; background-color:#fff;}
.basic_table thead tr th{border:1px solid #d2d8e0; border-top:none; border-bottom:1px solid #d2d8e0; background-color:#f0f3f6;}
.basic_table tbody tr:first-child th{border-top:none;}
.basic_table tbody tr td{border:1px solid #d2d8e0; background-color:#fff;overflow:hidden;word-wrap:break-word}
.basic_table tbody tr td a{font-weight:bold; color:#4f5f6f;}
.basic_table tbody tr:first-child td{border-top:none;}
.basic_table tbody tr td.none_page{border-left:1px solid #fff; border-right:1px solid #fff;}
.basic_table tfoot tr th{border:1px solid #d2d8e0; border-top:none; border-bottom:1px solid #d2d8e0;}
.basic_table .board_notice tr th, .basic_table .board_notice tr td{background-color:#f9f9f9;}
.basic_table .board_total tr th, .basic_table .board_total tr td{color:#0f5aad; font-weight:bold;}
/*
.basic_table tbody tr.highlight {background-color:#FF4848;}
.basic_table tbody tr.highlight td{background:none;color:white;}
.basic_table tbody tr.highlight td a {color:aqua;}
*/
.basic_table tbody tr.highlight td{color:red;}

.basic_table tbody tr .td_nobd_r{border-right:0 none;}
.basic_table tbody tr .td_nobd_l{border-left:0 none;}
.basic_table tbody tr td a { /*text-decoration: underline;*/ color:#1d8ad5; }
.basic_table.type01 tbody tr th{font-weight:bold;}
.basic_table.type01 tbody tr td{font-weight:bold;}

.basic_table.type01.template tbody tr td{font-weight:normal;}
.basic_table.type01.template{font-weight:normal;text-align:left} /* @@editor */

.basic_table.responsive-table{overflow-x:auto;}
.basic_table.responsive-table table{table-layout:auto; width:auto; border-collapse: collapse;}


/* table - basic - 1   Report for pages */
.basic_table1{position:relative; border-top:3px solid #0f5aad;  margin:5px 0 0; font-size:12px; width:100%; overflow-x:auto;}
.basic_table1 table{table-layout:fixed; width:100%;}
.basic_table1 tr th, .basic_table1 tr td{padding:5px 10px; text-align:center; line-height:16px; height:5px;}
.basic_table1 tbody tr th{border:1px solid #d2d8e0; font-weight:normal; background-color:#fff;}
.basic_table1 thead tr th{border:1px solid #d2d8e0; border-top:none; border-bottom:1px solid #d2d8e0; background-color:#f0f3f6;}
.basic_table1 tbody tr:first-child th{border-top:none;}
.basic_table1 tbody tr td{border:1px solid #d2d8e0; background-color:#fff;}
.basic_table1 tbody tr td a{font-weight:bold; color:#4f5f6f;}
.basic_table1 tbody tr:first-child td{border-top:none;}
.basic_table1 tbody tr td.none_page{border-left:1px solid #fff; border-right:1px solid #fff;}
.basic_table1 tfoot tr th{border:1px solid #d2d8e0; border-top:none; border-bottom:1px solid #d2d8e0;}
.basic_table1 .board_notice tr th, .basic_table1 .board_notice tr td{background-color:#f9f9f9;}
.basic_table1 .board_total tr th, .basic_table1 .board_total tr td{color:#0f5aad; font-weight:bold;}
/*
.basic_table tbody tr.highlight {background-color:#FF4848;}
.basic_table tbody tr.highlight td{background:none;color:white;}
.basic_table tbody tr.highlight td a {color:aqua;}
*/
.basic_table1 tbody tr.highlight td{color:red;}

.basic_table1 tbody tr .td_nobd_r{border-right:0 none;}
.basic_table1 tbody tr .td_nobd_l{border-left:0 none;}
.basic_table1 tbody tr td a { /*text-decoration: underline;*/ color:#1d8ad5; }
.basic_table1.type01 tbody tr th{font-weight:bold;}
.basic_table1.type01 tbody tr td{font-weight:bold;}

.basic_table1.responsive-table{overflow-x:auto;}
.basic_table1.responsive-table table{table-layout:auto; width:auto; border-collapse: collapse;}



/* table - view */
.view_table table{font-size:12px; width:100%; width:calc(100% - 1px);}
.view_table table tbody tr th{line-height:1.8; font-weight:bold; border-bottom:1px solid #d2d8e0; background-color:#f0f3f6;}
.view_table table tbody tr td{line-height:1.8; border-bottom:1px solid #d2d8e0;}
.view_table tr th, .view_table tr td{padding: 3px 10px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;}

.title_max > a{display:inline-block; max-width:80%; max-width:calc(100% - 60px); overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.title_max .board_multi{font-style:normal; vertical-align:top;}
.t_area{width:100%; height:200px; padding:.488em .5em; color:#4f5f6f; border: 1px solid #d2d8e0; border-radius: 0; -webkit-appearance: none; -moz-appearance: none; appearance: none; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;}

/* table  - sort-table */
.sort_table .tablesorter-header .tablesorter-header-inner{display:inline-block; position:relative; padding-right:15px;}
.sort_table .tablesorter-header .tablesorter-header-inner:after{content:'';background:url(../images/common/sort_default.png) no-repeat center center;  display:inline-block; width:9px; height:15px; position:absolute; top:50%; right:0; margin-top:-8px;}
.sort_table .tablesorter-header.tablesorter-headerAsc .tablesorter-header-inner:after{background:url(../images/common/sort_asc.png) no-repeat center center;}
.sort_table .tablesorter-header.tablesorter-headerDesc .tablesorter-header-inner:after{background:url(../images/common/sort_desc.png) no-repeat center center;}
.sort_table .tablesorter-header.sorter-false .tablesorter-header-inner:after{display:none;}

/* filebox */
.file_download_box li{margin-top:5px;}
.file_download_box li:first-child{margin-top:0;}
.file_count{position:absolute; top:3px; left:0;}
.file_box{position:relative; padding:0; vertical-align:top;}
.file_delete{position:absolute; top:0; right:0;}
.file_upload{position:relative; display:inline-block; width:100%; padding-right:90px; vertical-align:top; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;}
.file_upload input[type="file"]{position: absolute;width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip:rect(0,0,0,0); border: 0;}
.file_upload label{position:absolute; top:0; right:0; display: inline-block; width:86px; height:30px; line-height:27px; vertical-align:top; cursor: pointer; background:#4f5f6f; color:#fff; text-align:center;}
.file_upload .upload-name{display: inline-block; width:100%; padding: .5em .75em; font-size: inherit; line-height: normal; vertical-align: middle; background-color: #f5f5f5; border: 1px solid #ebebeb; border-bottom-color: #e2e2e2; -webkit-appearance: none; -moz-appearance: none; appearance: none; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;}
.file_down_text{display:inline-block; padding-left:20px; background:url(../images/common/icon_file.png) 0 5px no-repeat;}
.file_down_text span{display:inline-block; font-weight:normal !important; line-height:130%; border-bottom:1px solid #6f7c8a;}
.file_cell{display:table; width:100%;}
.file_cell li{display:table-cell; width:70%;}
.file_cell li.fc_log{padding-left:20px; width:30%;}
.file_name_box{line-height:30px; display:inline-block; vertical-align:middle;}
.file_cell .file_upload .upload_path{background:none; width:100%;}

/* pagination */
.pagination{clear:both; padding:20px 0; text-align:center;}
.pagination ul{display:inline-block;}
.pagination ul li{float:left;}
.pagination ul li.active{display:inline; color:#1a8769; font-weight:bold;}
.pagination ul li.first_num a{background:none;}
.pagination ul li.last_num a{border-right:1px solid #d2d8e0;}
.pagination ul li a img{border:none;}
.pagination ul li a{display:block; min-width:30px; width:auto; height:30px; line-height:28px; position:relative; color:#4f5f6f; font-weight:bold; text-align:center; text-decoration:none;  border-top:1px solid #d2d8e0; border-bottom:1px solid #d2d8e0; border-left:1px solid #d2d8e0; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; padding : 0 3px;}
.pagination ul li a:hover{background-color:#0f5aad; color:#fff; font-weight:bold; border-top:1px solid #0f5aad; border-bottom:1px solid #0f5aad; background-image:none;}
.pagination ul li.active a{background-color:#0f5aad; color:#fff; font-weight:bold; border-top:1px solid #0f5aad; border-bottom:1px solid #0f5aad; background-image:none;}
.pagination ul li.first{}
.pagination ul li.first > a{text-indent:-9999px; background:url(../images/common/btn_first.png) no-repeat center center; border-left:1px solid #d2d8e0;}
.pagination ul li.pre{margin-right:10px; border-right:1px solid #d2d8e0;}
.pagination ul li.pre > a{text-indent:-9999px; background:url(../images/common/btn_prev.png) no-repeat center center; border-left:1px solid #d2d8e0;}
.pagination ul li.next{margin-left:10px;}
.pagination ul li.next > a{text-indent:-9999px; background:url(../images/common/btn_next.png) no-repeat center center; border-left:1px solid #d2d8e0;}
.pagination ul li.last{border-right:1px solid #d2d8e0;}
.pagination ul li.last > a{text-indent:-9999px; background:url(../images/common/btn_last.png) no-repeat center center; border-left:1px solid #d2d8e0;}
.pagination ul li.pre a:hover, .pagination ul li.first a:hover, .pagination ul li.next a:hover, .pagination ul li.last a:hover{border-top:1px solid #d2d8e0; border-bottom:1px solid #d2d8e0;}
.pagination ul li.first > a, .pagination ul li.pre > a, .pagination ul li.next > a, .pagination ul li.last > a {width:30px;}

/* layer popup */
.popup-wrap .popup-layer{display:none;}
.popup-wrap .ui-widget-overlay{position:fixed; top:0; left:0; width:100%; height:100%; background:#000; opacity:.7; filter:Alpha(Opacity=70);}
.popup-wrap .ui-widget{font-weight:400; font-size:12px; color:#4f5f6f;}
.popup-wrap .ui-dialog{border:0 none; background:#fff; border-radius:0px; padding:0;}
.popup-wrap .ui-dialog .ui-dialog-titlebar{background:#fff; border:0 none; border-bottom:1px solid #d2d2d2; padding:1.3em 2.5em;}
.popup-wrap .ui-dialog .ui-dialog-title{font-size:18px;}
.popup-wrap .ui-dialog .ui-dialog-titlebar-close{height:27px; width:27px; padding:0; background:#fff; border:0 none; border-radius:0; right:2.5em;}
.popup-wrap .ui-button-icon-only .ui-icon{background:#fff url(../images/common/btn_layer_close.png) no-repeat; border:0 none; border-radius:0; height:27px; width:27px; margin-top:-13px; margin-left:-13px}
.popup-wrap .ui-icon-closethick{background-position:center center;}
.popup-wrap .ui-dialog .ui-dialog-content{padding:1.667em 2.5em;}

/* login */
.login_wrap{position:absolute; width:100%; height:100%; background:#243444; min-height:768px;}
.login_box{position:relative; top:50%; left:0; right:0; margin:-300px auto 0; width:700px;}
.login_input {left:0; right:0; margin-top:50px;margin-left:auto;margin-right:auto;width:300px;}
.login_top div{display:block; text-align:center; vertical-align:middle;}
.login_top .login_img{color:#fff; font-size:40px; padding:24px 0 34px;}
.login_input{border-top:1px solid #828282;}
.login_input .textbox label{display:none !important; padding: 1.125em .5em;}
.login_input .textbox input{padding: 1.125em .5em;}
.login_input li{border-bottom:1px solid #828282; margin-left:0px; padding:12px 0;}
.login_input li:last-child{border-bottom:0 none; padding:36px 0 0;}
.login_id, .login_pw{width:270px;}
.login_input .login_id input{padding-left:50px; background:transparent url(../images/common/icon_people.png) 20px center no-repeat; border:0 none; font-size:18px; color:#aba8a7;}
.login_input .login_pw input{padding-left:50px; background:transparent url(../images/common/icon_lock.png) 20px center no-repeat; border:0 none; font-size:18px; color:#aba8a7;}
.login_btn input{width:272px; height:56px; border:0 none; border-radius:5px; font-size:25px; color:#fff; font-weight:400; cursor:pointer; background:#0f5aad;}
.login_footer{font-size:11px; color:#fff; line-height:60px; text-align:center; position:absolute; bottom:0; left:0; width:100%; background:#243444;}
.login_input input::-webkit-input-placeholder { /* Chrome/Opera/Safari */color:#aba8a7;}
.login_input input::-moz-placeholder { /* Firefox 19+ */color:#aba8a7;}
.login_input input:-ms-input-placeholder { /* IE 10+ */color:#aba8a7;}
.login_input input:-moz-placeholder { /* Firefox 18- */color:#aba8a7;}
.login_input .placeholder { color:#aba8a7; }

/* login - dialog */
#dialog-box .ui-widget-overlay{position:fixed; top:0; left:0; width:100%; height:100%; background:#000; opacity:.3; filter:Alpha(Opacity=30);}
#dialog-box .ui-dialog{border:2px solid #0f5aad; background:#fff; border-radius:0px;}
#dialog-box .ui-dialog-titlebar{display:none;}
#dialog-box .ui-dialog-content{padding:20px; text-align:center;}
#dialog-box .ui-dialog-content .dialog_msg{color:#4f5f6f; font-size:16px; line-height:1.4;}
#dialog-box .ui-dialog-buttonpane{padding:0 0 23px 0; text-align:center; border:0 none; margin-top:0;}
#dialog-box .ui-dialog-buttonpane .ui-dialog-buttonset{float:none;}
#dialog-box .ui-dialog-buttonpane .ui-button{background:#4f5f6f; border:1px solid #304151; color:#ffffff; padding:0 16px; font-size:12px; line-height:30px;}

/* alert, confirm - dialog */
#dialogWrap .ui-widget-overlay{position:fixed; top:0; left:0; width:100%; height:100%; background:#000; opacity:.7; filter:Alpha(Opacity=70); z-index:200 !important;}
#dialogWrap .ui-dialog{border:2px solid #0f5aad; background:#fff; border-radius:0px; min-width:400px; max-width:600px;  z-index:201 !important;}
#dialogWrap .ui-dialog-titlebar{border:0 none; background:#fff; padding-top:10px;}
#dialogWrap .ui-dialog-titlebar .ui-dialog-title{visibility:hidden;}
#dialogWrap .ui-dialog-titlebar .ui-dialog-title-view{font-size:18px; line-height:1.4;}
#dialogWrap .ui-dialog .ui-dialog-titlebar-close{border:0 none; border-radius:0; right:11px; background:#fff;}
#dialogWrap .ui-dialog-titlebar .ui-button .ui-icon{background:#fff url(../images/common/btn_layer_close02.png) no-repeat center center;}
#dialogWrap .ui-dialog-content{padding:20px; text-align:center;}
#dialogWrap .ui-dialog-content .dialogMessage{color:#4f5f6f; font-size:16px; line-height:1.4;}
#dialogWrap .ui-dialog-content .dialogMessage-view{color:#4f5f6f; font-size:16px; line-height:1.4; text-align:left;}
#dialogWrap .ui-dialog-buttonpane{padding:0 0 23px 0; text-align:center; border:0 none; margin-top:0;}
#dialogWrap .ui-dialog-buttonpane .ui-dialog-buttonset{float:none; padding-top:.5em;}
#dialogWrap .ui-dialog-buttonpane .ui-button{background:blue; border:1px solid darkblue; border-radius:0; color:white; padding:8px 16px; font-size:12px; line-height:1.2; margin:0 .4em .5em 0;}
#dialogWrap .ui-dialog-buttonpane .ui-button.btn_no{background-color:orange; border:1px solid darkorange; font-size:12px; color:white;}
/* Result dialog severity accent. Info keeps the default blue title; error gets
   a light-red header band, dark-red title and a neutral (gray) OK button. */
#dialogWrap .ui-dialog.msg-error{border-color:#f1aeb5;}
#dialogWrap .ui-dialog.msg-error .ui-dialog-titlebar{background:#f8d7da; border-bottom:1px solid #f1aeb5;}
#dialogWrap .ui-dialog.msg-error .ui-dialog-titlebar .ui-dialog-titlebar-close{background:#f8d7da;}
#dialogWrap .ui-dialog.msg-error .ui-dialog-titlebar .ui-button .ui-icon{background-color:#f8d7da;}
#dialogWrap .ui-dialog.msg-error .ui-dialog-title-view{color:#b02a37;}
#dialogWrap .ui-dialog.msg-info{border-color:#0f5aad;}
#dialogWrap .ui-dialog.msg-info .ui-dialog-title-view{color:#0f5aad;}

/* footer */
/*footer{position:fixed; bottom:0; text-align:right; width:100%; background:#fff; border-top:1px solid #d2d8e0;}*/ /* 2017-05-24 Modification */
footer{position:fixed; bottom:0; width:100%; background:#fff; border-top:1px solid #d2d8e0;}
footer p.address{padding:10px 20px;} /* 2017-05-24 Modification */
footer p.title{padding:10px 2px;} /* 2017-05-24 Modification */

/* error */
.error_wrap{display:table; width:100%; height:100%;}
.error_wrap .error_box{display:table-cell; vertical-align:middle; text-align:center;}
.error_wrap .error_box .msg_title{font-size:40px; line-height:1.4em; color:#2e5498; padding:0 60px;}
.error_wrap .error_box .msg_detail{font-size:14px; line-height:1.5em; color:#4f5f6f; margin:30px 0; padding:0 200px;}

/* layout */
.div_wrap{display:table; table-layout:fixed;}
.div_col{display:table-cell;}
.div_col.col_left{padding-right:10px;}
.div_col.col_right{padding-left:10px;}
.col02 .div_col{width:50%;}

/* color */
.red{color:#d04242;}
.green{color:#008000FF;}
.yellow{color:#FFFF00FF;}
.blue{color:#0000FFFF;}
.black{color:#000000FF;}
.white{color:#FFFFFFFF;}

/* jquery ui re-style */
.ui-widget{font-weight:400; font-size:12px; color:#4f5f6f;}
.ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button{font-weight:400; font-size:12px; }
.ui-state-default a, .ui-state-default a:link, .ui-state-default a:visited, a.ui-button, a:link.ui-button, a:visited.ui-button, .ui-button{color:#4f5f6f;}
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default, .ui-button, html .ui-button.ui-state-disabled:hover, html .ui-button.ui-state-disabled:active{border:1px solid #b2b2b2; background:#fff; font-weight:normal; color:#4f5f6f;}

/* tabs */
.ui-tabs.ui-widget.ui-widget-content{border:0 none;}
.ui-tabs{padding:0;}
.ui-tabs .tab-nav-wrap{ border-bottom:1px solid #b2b2b2;}
.ui-tabs .ui-widget-header{background:#fff; border:0 none;}
.ui-tabs .ui-tabs-nav{display:table; border-spacing:1px 0; padding:0; margin-left:-2px;}
.ui-tabs .ui-tabs-nav li{display:table-cell; border-spacing:1px 0; border-radius:0; float:none; margin:0 1px 0; margin-bottom:-1px; padding-bottom:1px; vertical-align:middle; white-space:normal;}
.ui-tabs .ui-tabs-nav li.ui-tabs-active{border:1px solid #0f5aad; background:#0f5aad;}
.ui-tabs .ui-tabs-nav .ui-tabs-anchor{border-radius:0; padding:1em; min-width:155px; max-width:268px; text-align:center;}
.ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited{color:#fff;}
.ui-tabs .ui-tabs-panel{padding:2em 0;}

/* tab 20180329 */
.tab2018 .tab{margin-bottom:15px}
.tab2018 .tab ul li{display:inline-block;min-width:125px;background-color:#f8f8f8;}
.tab2018 .tab ul li a{display:block;padding:0 10px;height:34px;line-height:34px;color:#4d4d4d;text-align:center;border:1px solid #bdbdbd;overflow:hidden;}
.tab2018 .tab ul li.active a,
.tab2018 .tab ul li:hover a{color:#fff;font-weight:bold;border:1px solid #0f5aad;background-color:#0f5aad}

/* clearfix */
.clearfix,
.clearfix:after{content:"";display:block;clear:both;}
.lnbTab{position:relative;}
.lnbTab .tabmenu{
	width:170px;
	float:left;
}
.lnbTab .tabbody {
	width : calc(100% - 190px);
    width : -webkit-calc(100% - 190px); /* for Chrome, Safari */
    width : -moz-calc(100% - 190px); /* for Firefox */
	margin-left:20px;
	margin-right:0;
	float:left;
}
.lnbTab .tabbody .table_box .basic_table { margin-top:0;}
.lnbTab .tabmenu .title{line-height:20px;padding-bottom:10px;color:#0f5aad;font-size:16px;}
.lnbTab > nav > ul {border-top: 2px solid #777;border-bottom:1px solid #777}
.lnbTab > nav > ul li a{display: block;padding:10px;color:#5b5b5b;letter-spacing:-1px;border-top:1px solid #ccc;}
.lnbTab > nav > ul li:first-child a{border-top:0 none}
.lnbTab > nav > ul li.active a,
.lnbTab > nav > ul li:hover a{color:#fff;font-weight: bold;text-decoration: none;background-color:#0f5aad}
.lnbTab .tabbody .search_table { margin-top:0;}

/* page loading: translucent overlay with a centered card (brand ring + label); #loading is the
   global overlay, page-local overlays (e.g. the dashboard #local-loading) reuse the same classes */
.loading-overlay{display:none; position:fixed; top:0; left:0; width:100%; height:100%; z-index:10000; background:rgba(15,23,42,.40); backdrop-filter:blur(2.5px); -webkit-backdrop-filter:blur(2.5px);}
.loading-overlay .loading-content{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);}
#loading{display:block;} /* covers the initial page render; common.document.js hides it once scripts run */
.loading-card{display:inline-flex; align-items:center; gap:15px; padding:20px 24px; background:#fff; border-radius:14px; box-shadow:0 20px 44px -14px rgba(15,23,42,.5);}
/* SVG stroke ring: vector edges stay anti-aliased at any display scale (the old conic-gradient
   + mask ring rendered with hard, jagged edges on scaled Windows displays) */
.loading-ring{width:30px; height:30px; animation:loadingSpin .8s linear infinite; will-change:transform;}
.loading-ring circle{fill:none; stroke-width:5;}
.loading-ring .loading-ring-track{stroke:#e3eaf3;}
.loading-ring .loading-ring-arc{stroke:#0f5aad; stroke-linecap:round; stroke-dasharray:94 32;}
.loading-text{font-size:14px; font-weight:600; color:#16233b;}
@keyframes loadingSpin{to{transform:rotate(1turn);}}
@media (prefers-reduced-motion: reduce){.loading-ring{animation-duration:1.8s;}}

/************************************************************************************************************************
 - English is used as a selector as a .en class in HTML.
 - If the text is longer than two lines, specify the style.
************************************************************************************************************************/
.en body{font-weight:400; font-size:12px; color:#4f5f6f;}

/* gnb */
.en .gnb_top .gnb_util p{max-width:300px; max-width:calc(100% - 290px);}

/* layer popup */
.en .popup-wrap .ui-widget{font-weight:400; font-size:12px; color:#4f5f6f;}


/************************************************************************************************************************
 - arabic is a ar class in html using selector
 - Only things that aren't sorted by dir=rtl are handled by CSS
************************************************************************************************************************/
.ar body{font-weight:400; font-size:12px; color:#4f5f6f;}

/* gnb */
.ar .gnb_top h2{padding-right:15px; padding-left:15px;}
.ar .gnb_top .gnb_welcome{padding-right:15px; padding-left:15px;}
.ar .gnb_top .gnb_util{padding-left:6px; padding-right:0px; text-align:left;}
.ar .gnb_top .gnb_util .logout{margin-right:5px; margin-left:0px;}
.ar .gnb_top .gnb_util .lang{margin-right:5px; margin-left:0px;}
.ar .gnb_top .gnb_util .category{margin-right:25px; margin-left:0px;}
.ar .gnb_top .gnb_util p{max-width:300px; max-width:calc(100% - 290px);}
.ar .gnb_top .gnb_util .category li a{margin:3px 5px 3px 0;}
.ar .gnb_m > li{border-left:1px solid #304151; border-right:0 none;}
.ar .gnb_m > li a{text-align:right;}
.ar .gnb_m ul.dep2 li a{text-align:right;}

/* navi */
.ar #navi > ul li{border-right:1px solid #d2d8e0; border-left:0 none;}

/* sub */
/*.ar .t_header{text-align:right;}
.ar .t_header > h3{float:right; margin-right:0; margin-left:10px;}
.ar .t_header > p.summary{float:right;}*/
.ar .t_header > p.summary{padding:0 5px 1px 0;}
.ar .ts_header > h4{background:url(../images/ar/ico_subtitle.png) no-repeat right center; padding-left:0; padding-right:23px;}

/* form controls */
.ar select{background:url(../images/ar/select_bg.png) left 0 no-repeat; padding:.4125em .4125em .4125em 3em;}
.ar select.sel_type01{width:auto; max-width:100%; padding-right:.4125em; padding-left:34px;}
.ar .cal_input.hasDatepicker{background-position:left 7px center;}

/* button */
.ar .btn_button{margin: 0 0 5px 4px;}

/* button wrap */
.ar .btn_basic.type01{text-align:left;}
.ar .btn_basic.type02{text-align:right;}
.ar .btn_basic.type03{right:auto; left:0;}
/*.ar .btn_button + .btn_button{margin-left:0; margin-right:4px;}*/
.ar .btn_basic .btn_button:last-child{margin-right:auto; margin-left:0;}

/* button position */
.ar .btn_ap_right{right:auto; left:0;}

/* text align */
.ar .td_left{text-align:right !important;}
.ar .td_right{text-align:left !important;}

/* table */
/* table - search */
.ar .search_table tr td{text-align:right;}

/* filebox */
.ar .file_down_text{padding-left:0; padding-right:20px; background:url(../images/common/icon_file.png) right 5px no-repeat;}
.ar .file_upload label{right:auto; left:0;}
.ar .file_cell li.fc_log{padding-left:0; padding-right:20px;}

/* table - top */
.ar .tb_top .tb_page{float:right;}
.ar .tb_bottom .tb_page{left:auto; right:0;}
.ar .tb_bottom .tb_number{right:auto; left:0;}

/* table */
.ar .basic_table tbody tr td.td_nobd_r{border-left:0 none; border-right:1px solid #d2d8e0;}
.ar .basic_table tbody tr td.td_nobd_l{border-right:0 none; border-left:1px solid #d2d8e0;}
.ar .search_table tbody tr .td_nobd_r{border-right:1px solid #d2d8e0; border-left:0 none;}
.ar .search_table tbody tr .td_nobd_l{border-left:1px solid #d2d8e0; border-right:0 none;}

/* pagination */
.ar .pagination ul li{float:right;}
.ar .pagination ul li.last_num a{border-left:1px solid #d2d8e0; border-right:0 none; background-image:none;}
.ar .pagination ul li.first{}
.ar .pagination ul li.first > a{background:url(../images/ar/btn_first.png) no-repeat center center; border-left:0 none; border-right:1px solid #d2d8e0;}
.ar .pagination ul li.pre{margin-right:0; margin-left:10px; border-right:0 none; border-left:1px solid #d2d8e0;}
.ar .pagination ul li.pre > a{background:url(../images/ar/btn_prev.png) no-repeat center center; border-left:0 none; border-right:1px solid #d2d8e0;}
.ar .pagination ul li.next{margin-left:0; margin-right:10px;}
.ar .pagination ul li.next > a{background:url(../images/ar/btn_next.png) no-repeat center center; border-left:0 none; border-right:1px solid #d2d8e0;}
.ar .pagination ul li.last{border-right:0 none; border-left:1px solid #d2d8e0;}
.ar .pagination ul li.last > a{background:url(../images/ar/btn_last.png) no-repeat center center; border-left:0 none; border-right:1px solid #d2d8e0;}

/* layer popup */
.ar .popup-wrap .ui-widget{font-weight:400; font-size:12px; color:#4f5f6f;}
.ar .popup-wrap .ui-dialog .ui-dialog-title{float:right;}
.ar .popup-wrap .ui-dialog .ui-dialog-titlebar-close{right:auto; left:2.5em;}

/* login */
.ar .login_input .login_id input{padding-left:0px; padding-right:50px; background:transparent url(../images/common/icon_people.png) right 20px center no-repeat;}
.ar .login_input .login_pw input{padding-left:0px; padding-right:50px; background:transparent url(../images/common/icon_lock.png) right 20px center no-repeat;}

/* footer */
.ar footer{text-align:left;}

/* layout */
.ar .div_col.col_left{padding-right:0; padding-left:10px;}
.ar .div_col.col_right{padding-left:0; padding-right:10px;}

/* alert, confirm dialog */
.ar #dialogWrap .ui-dialog .ui-dialog-titlebar-close{left:11px; right:auto;}

/* tabs */
.ar .ui-tabs .ui-tabs-nav{margin-left:0; margin-right:-2px;}

/* jquery ui re-style */


.ar .lnbTab .tabmenu{
	float:right;
}
.ar .lnbTab .tabbody {
	float:right;
	margin-left:0;
	margin-right:20px;
}

.lang_kurdish {font-family: kurdish !important;}

/* progress bar */
.progress { position:relative; width:400px; border: 1px solid #ddd; padding: 1px; border-radius: 3px; }
.bar { background-color: #B4F5B4; width:0%; height:20px; border-radius: 3px; }
.percent { position:absolute; display:inline-block; top:3px; left:48%; }


.bar-container {position: relative;height: 100%;flex: 0 0 30%;margin: 0 auto;background-color: #deebe5f3;display: flex;align-items: center;justify-content: center;}
.bar-container .h2 {position: absolute;text-align: center;top: 10px;width: 100%;}
	/* // **** CSS progress bar **** */
.bar-container .ul {position: relative;padding: 0;list-style: none;width: 150px;}
.bar-container .ul .li {background-color: #fff;height:20px;border-radius:10px;}
.bar-container .ul .li .bar {position: absolute;border-radius: 10px;background-color: #35495e;height: 20px;}
.bar-container .ul .li .bar:after  {-webkit-box-sizing: border-box;box-sizing: border-box;content: "";width: 27px;height: 27px;position: absolute;top: -3px;right: 0;border-radius: 50%;background-color: #607d8b;}
.bar-container .ul .css-progressbar {width: 80%;-moz-animation: css-progressbar 2s ease-out;-webkit-animation: css-progressbar 2s ease-out;}
.progressTag {-webkit-appearance: none;-moz-appearance: none;appearance: none;display: block;width: 150px;height: 20px;border-radius: 7px;color: #93ebad;}

.contents_wrap{font-size: 20px;font-weight: bold;width: 150%;height: 150%;margin-left: 150px;vertical-align: middle;line-height: 40px;color: #35495e;}
.table_header {font-weight:bold;font-size:14px;}

/* Tooltip classes moved to common.css (dark bubble + arrow variants) */

.highlighted {background-color: #0f5aad !important;color:white !important;}

.div-view-readonly-inputbox {display: inline-block;padding: 5px 0 0 8px !important;width: 100% !important;border: 1px solid #ccc;border-radius: 1px;background-color: #ddd; /* light gray */color: #7d7f7c; /* dark gray */font-family: Arial, sans-serif;}

.close-button:focus {outline: none; /* Remove the default focus outline */}

.ui-dialog-titlebar-close:focus {outline: none; /* Remove the default focus outline */}

/* In-page section title shared by configuration screens (ACM/CCS/Ballot) */
.group_name {margin-top:10px; margin-bottom:10px; font-size:18px;}


/* ===========================================================================
   Ballot Definition editor (single screen: ballotTempContestInfo.jsp). Merged
   from the former ballotDefEditor.css — screen-specific, all #bdEditor/.bde-
   scoped; the reusable visual language lives in common.css (.ux-*).
   =========================================================================== */

#bdEditor {
  --bde-bg:#f3f4f6; --bde-panel:#fff; --bde-line:#b7c0cc; --bde-ink:#1f2937; --bde-dim:#6b7280;
  --bde-accent:#2563eb; --bde-auto:#b45309; --bde-autobg:#fef3c7; --bde-c1:#DAE8CF; --bde-c2:#9CC2C5;
  display:flex; flex-direction:column; border:1px solid var(--bde-line); border-radius:8px;
  background:var(--bde-panel); color:var(--bde-ink); margin-top:10px; overflow:hidden;
  font:14px/1.5 "Segoe UI",system-ui,sans-serif;
}
#bdEditor * { box-sizing:border-box; }

/* overflow notice banner: colors come from the common .ux-legend; flush edges here */
#bdEditor .bde-legend { border-left:0; border-right:0; border-top:0; }

/* set tabs */
#bdEditor .bde-settabs { display:flex; align-items:flex-end; gap:4px; padding:12px 16px 0; background:var(--bde-bg); }
#bdEditor .bde-settab { border:1px solid var(--bde-line); border-bottom:none; background:#e9ebee; border-radius:8px 8px 0 0;
  padding:8px 22px; cursor:pointer; font-weight:600; color:var(--bde-dim); }
#bdEditor .bde-settab.active { background:var(--bde-panel); color:var(--bde-ink); }
#bdEditor .bde-conf { margin-left:auto; font-size:12px; color:var(--bde-dim); padding-bottom:6px; }
#bdEditor .bde-conf b { color:var(--bde-ink); }

#bdEditor .bde-setbody { background:var(--bde-panel); border-top:1px solid var(--bde-line); display:flex; flex-direction:column; }
#bdEditor .bde-main { display:flex; align-items:stretch; }

/* editor (left) */
#bdEditor .bde-editor { flex:1 1 64%; min-width:0; display:flex; flex-direction:column; border-right:1px solid var(--bde-line); }
#bdEditor .bde-sheetview { min-height:430px; overflow:auto; display:flex; gap:16px; padding:18px 18px 10px; align-items:stretch; }
/* Fixed half-width pane: a lone FRONT keeps the same width as a FRONT|BACK pair,
   so the header strip (width-proportional image) never doubles in height. */
#bdEditor .bde-pane { flex:0 1 50%; border:1px solid var(--bde-line); border-radius:8px; background:#fcfcfd; display:flex; flex-direction:column; min-width:0; }
/* pane head look comes from the common .ux-cardhead; restore the editor's own
   padding/gap so it matches the original card model */
#bdEditor .bde-panehead { border-radius:7px 7px 0 0; padding:8px 12px; gap:0; }
#bdEditor .bde-panehead .bde-rm { margin-left:auto; background:transparent; border:1px solid rgba(255,255,255,.45);
  color:#f1f5f9; border-radius:5px; padding:3px 11px; font:inherit; font-size:12px; font-weight:600; letter-spacing:0; cursor:pointer; }
#bdEditor .bde-panehead .bde-rm:hover { background:#dc2626; border-color:#dc2626; color:#fff; }
#bdEditor .bde-hzone, #bdEditor .bde-fzone { padding:9px 12px; background:#f8fafc; display:flex; flex-direction:column; gap:7px; position:relative; }
#bdEditor .bde-hzone { border-bottom:2px solid #cbd5e1; }
#bdEditor .bde-fzone { border-top:2px solid #cbd5e1; border-radius:0 0 8px 8px; }
#bdEditor .bde-czone { flex:1; display:flex; flex-direction:column; gap:6px; padding:9px 12px; }
#bdEditor .bde-zhead { display:flex; align-items:center; gap:8px; }
#bdEditor .bde-czone .ux-badge { background:#94a3b8; }
/* authored on a different paper width than the set now uses */
.bde-wbadge { font-size:10px; font-weight:700; color:#92400e; background:#fef3c7; border:1px solid #f59e0b; border-radius:3px; padding:1px 6px; margin-left:6px; flex:0 0 auto; cursor:help; }
#bdEditor .bde-zname { flex:1; min-width:0; font-size:12px; font-weight:600; color:var(--bde-ink); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
#bdEditor .bde-zhint { font-size:11px; color:#9ca3af; }
#bdEditor .bde-items { flex:1; min-height:44px; }

/* miniature header/footer render */
#bdEditor .bde-mini { background:#fff; border:1px solid #b9c0c9; border-radius:3px; padding:8px 10px; display:flex; flex-direction:column; gap:4px;
  box-shadow:inset 0 0 0 3px #fff, inset 0 0 0 4px #e5e7eb; cursor:pointer; }
/* real render = the common .ux-strip (full band, true proportion) + .ux-chip */
#bdEditor .bde-mini.ux-strip { padding:0; box-shadow:none; }
#bdEditor .bde-mini .bde-r { display:flex; align-items:center; gap:9px; }
#bdEditor .bde-mseal, #bdEditor .bde-mlogo { width:34px; height:34px; border:1.5px solid #94a3b8; flex:0 0 auto;
  display:flex; align-items:center; justify-content:center; font-size:7px; color:#64748b; letter-spacing:.05em; }
#bdEditor .bde-mseal { border-radius:50%; }
#bdEditor .bde-mlogo { border-radius:4px; }
#bdEditor .bde-mtit { flex:1; text-align:center; min-width:0; }
#bdEditor .bde-mtit .bde-t1 { font-weight:800; font-size:13px; letter-spacing:.08em; color:#1f2937; }
#bdEditor .bde-mtit .bde-t2 { font-size:9px; color:#475569; letter-spacing:.04em; }
#bdEditor .bde-minst { font-size:9px; color:#64748b; font-style:italic; border-top:1px solid #e2e8f0; padding-top:4px; }
#bdEditor .bde-mline { font-size:9.5px; color:#374151; }
#bdEditor .bde-mqr { width:26px; height:26px; border:1px solid #111; flex:0 0 auto;
  background:repeating-linear-gradient(0deg,#111 0 3px,#fff 3px 6px),repeating-linear-gradient(90deg,#111 0 3px,#fff 3px 6px); background-blend-mode:screen; }
#bdEditor .bde-msm { width:16px; height:16px; background:#cbd5e1; border:1px solid #94a3b8; flex:0 0 auto;
  display:flex; align-items:center; justify-content:center; font-size:6px; color:#475569; }
#bdEditor .bde-mflag { width:12px; height:12px; background:#dbeafe; border:1px solid #60a5fa; transform:rotate(45deg); flex:0 0 auto; margin:0 3px; }
#bdEditor .bde-msp { flex:1; }

/* + back page rail */
#bdEditor .bde-backrail { flex:0 0 46px; border:1.5px dashed var(--bde-line); border-radius:8px; background:#fff; cursor:pointer;
  display:flex; align-items:center; justify-content:center; color:var(--bde-dim); font-size:12px; font-weight:600; }
#bdEditor .bde-backrail span { writing-mode:vertical-rl; letter-spacing:.12em; }
#bdEditor .bde-backrail:hover { border-color:var(--bde-accent); color:var(--bde-accent); }

/* contest item cards */
#bdEditor select, #bdEditor input[type=number] { font:inherit; border:1px solid var(--bde-line); border-radius:4px; padding:3px 5px; background:#fff; min-width:0; }
#bdEditor input[type=number] { width:54px; }
#bdEditor .bde-item { display:flex; flex-direction:column; gap:8px; border:1px solid var(--bde-line); border-radius:7px; padding:10px 12px; margin-bottom:10px; background:#fff; position:relative; transition:opacity .13s ease; }
#bdEditor .bde-item .bde-top { display:flex; align-items:center; gap:8px; min-height:26px; }
#bdEditor .bde-item .bde-ctrl { display:flex; flex-wrap:wrap; gap:13px; row-gap:7px; }
#bdEditor .bde-item .bde-nm { flex:1; font-weight:600; font-size:14px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; cursor:grab; }
#bdEditor .bde-item .bde-cnt { font-size:12px; color:var(--bde-dim); flex:0 0 auto; }
#bdEditor .bde-item.dragging { opacity:.35; }
#bdEditor .bde-item.ins-top::before { content:""; position:absolute; top:-8px; left:6px; right:6px; height:10px; border-radius:5px; background:var(--bde-accent); box-shadow:0 0 0 3px #dbeafe; z-index:5; }
#bdEditor .bde-item.ins-bot::after { content:""; position:absolute; bottom:-8px; left:6px; right:6px; height:10px; border-radius:5px; background:var(--bde-accent); box-shadow:0 0 0 3px #dbeafe; z-index:5; }
#bdEditor .bde-item label { font-size:12px; color:var(--bde-dim); display:flex; align-items:center; gap:4px; }
#bdEditor .bde-btn { font:inherit; font-size:13px; border:1px solid var(--bde-line); background:#fff; border-radius:5px; padding:4px 11px; cursor:pointer; color:var(--bde-ink); }
#bdEditor .bde-btn:hover { border-color:var(--bde-accent); color:var(--bde-accent); }
#bdEditor .bde-btn.mini { padding:2px 7px; font-size:12px; }
#bdEditor .bde-btn.danger:hover { border-color:#b91c1c; color:#b91c1c; }
#bdEditor .bde-empty-hint { color:#9ca3af; font-size:12px; text-align:center; padding:14px 0; }

/* sheet tabs (bottom) */
#bdEditor .bde-sheettabs { display:flex; align-items:flex-start; gap:3px; padding:0 18px 12px; border-top:1px solid var(--bde-line); background:#f9fafb; }
#bdEditor .bde-stab { border:1px solid var(--bde-line); border-top:none; border-radius:0 0 7px 7px; background:#e9ebee;
  padding:7px 18px; cursor:pointer; font-size:13px; color:var(--bde-dim); display:flex; align-items:center; gap:8px; }
#bdEditor .bde-stab.active { background:#fff; color:var(--bde-ink); font-weight:700; }
#bdEditor .bde-stab .bde-x { color:#9ca3af; cursor:pointer; font-weight:400; }
#bdEditor .bde-stab .bde-x:hover { color:#b91c1c; }
#bdEditor .bde-stab.add { font-weight:700; color:var(--bde-accent); border-style:dashed; background:#fff; }
#bdEditor .bde-stab .bde-hasback { font-size:10px; color:var(--bde-auto); }

/* palette */
#bdEditor .bde-palette { display:flex; flex-wrap:wrap; gap:6px; align-items:center; padding:12px 18px 0; }
#bdEditor .bde-palette .bde-ptitle { flex:0 0 100%; font-size:12px; font-weight:700; color:var(--bde-dim); letter-spacing:.05em; margin-bottom:2px; }
#bdEditor .bde-chip { border:1px solid var(--bde-line); border-radius:15px; background:#fff; padding:4px 12px; font-size:13px; cursor:grab; user-select:none; display:flex; gap:6px; align-items:center; }
#bdEditor .bde-chip .bde-grip { color:#9ca3af; }
#bdEditor .bde-chip:hover { border-color:var(--bde-accent); color:var(--bde-accent); }
#bdEditor .bde-chip.used { background:#eef0f2; color:#9ca3af; cursor:not-allowed; border-style:dashed; }
#bdEditor .bde-chip.used .bde-grip { visibility:hidden; }
#bdEditor .bde-items.dragover { outline:2px dashed var(--bde-accent); outline-offset:-2px; background:#eff6ff; border-radius:6px; }

/* preview (right) */
#bdEditor .bde-preview { flex:1 1 36%; min-width:300px; padding:16px; background:#f6f7f9; overflow:auto; max-height:78vh; }
#bdEditor .bde-pvbar { display:flex; align-items:center; gap:8px; margin-bottom:2px; }
#bdEditor .bde-pvbar h3 { margin:0; font-size:14px; }
#bdEditor .bde-zoomctl { margin-left:auto; display:flex; gap:4px; align-items:center; }
#bdEditor .bde-zoomctl .bde-zlv { font-size:12px; color:var(--bde-dim); min-width:42px; text-align:center; cursor:pointer; }
#bdEditor .bde-stats { font-size:13px; color:var(--bde-dim); margin-bottom:10px; }
#bdEditor .bde-stats .bde-auto { color:var(--bde-auto); font-weight:600; }
#bdEditor .bde-stats .bde-warn { color:#c0392b; font-weight:700; }
#bdEditor .bde-pages { display:flex; flex-wrap:wrap; gap:16px; }
#bdEditor .bde-pgwrap { display:flex; flex-direction:column; align-items:center; gap:4px; }
#bdEditor .bde-pglabel { font-size:12px; color:var(--bde-dim); }

/* page thumbnail (shared with the lightbox via .bde-lb .bde-page) */
.bde-page { position:relative; background:#fff; border:1px solid #9aa1ab; box-shadow:0 1px 3px rgba(0,0,0,.18); overflow:hidden; }
/* the blank back of a sheet with no back design: it prints, but empty */
.bde-page.blank { background:#f3f4f6; border-style:dashed; box-shadow:none; }
.bde-page .bde-tm { position:absolute; background:#111; width:4px; height:4px; }
.bde-page .bde-tm.clash { background:#c0392b; }
.bde-page .bde-fm { position:absolute; background:#111; }
.bde-page .bde-hd { position:absolute; left:8px; right:8px; background:#e5e7eb; border:1px solid #cbd0d6; display:flex; align-items:center; justify-content:center; font-size:9px; color:#4b5563; letter-spacing:.05em; text-align:center; }
.bde-page .bde-ft { position:absolute; left:8px; right:8px; background:#e5e7eb; border:1px solid #cbd0d6; display:flex; align-items:center; font-size:9px; color:#4b5563; padding:0 5px; gap:5px; }
.bde-page .bde-ft .bde-qr { width:14px; height:14px; background:repeating-linear-gradient(0deg,#111 0 2px,#fff 2px 4px),repeating-linear-gradient(90deg,#111 0 2px,#fff 2px 4px); background-blend-mode:screen; border:1px solid #111; }
.bde-page .bde-ft .bde-pn { margin-left:auto; }
.bde-page .bde-blocks { position:absolute; left:8px; right:8px; }
.bde-page .bde-tband { display:flex; align-items:center; justify-content:center; font-size:10px; font-weight:700; color:#1f2937; border:1px solid #b9c2b4; overflow:hidden; white-space:nowrap; }
.bde-page .bde-crow { display:flex; gap:2px; }
.bde-page .bde-cell { flex:1; border:1px solid #d3d8de; border-radius:2px; display:flex; align-items:center; gap:3px; padding:0 3px; overflow:hidden; background:#fff; }
.bde-page .bde-cell .bde-tgt { flex:0 0 auto; border:1.5px solid #c2410c; border-radius:50%; }
/* Photo rows honour the Ballot Configuration circle position; text rows always centre. */
.bde-page .bde-cell .bde-tgt.top { align-self:flex-start; margin-top:2px; }
.bde-page .bde-cell .bde-ph { flex:0 0 auto; background:#cbd5e1; border:1px solid #94a3b8; }
.bde-page .bde-cell .bde-nbox { flex:1; min-width:0; height:72%; background:#eef2f7; border-radius:2px; display:flex; align-items:center; padding:0 2px; }
.bde-page .bde-cell .bde-bar { flex:1; height:3px; background:#9ca3af; border-radius:2px; }
.bde-page .bde-cell.empty { visibility:hidden; }

/* body-level overlays */
.bde-gov { position:fixed; inset:0; z-index:1028; background:rgba(15,23,42,.35); backdrop-filter:blur(2px); }
.bde-gal { position:fixed; z-index:1030; background:#fff; border:1px solid #d7dbe0; border-radius:8px; box-shadow:0 10px 28px rgba(0,0,0,.25); padding:10px; display:flex; flex-wrap:wrap; gap:10px; max-height:60vh; overflow-y:auto; }
.bde-galopt { flex:0 0 220px; min-width:0; cursor:pointer; border:2px solid transparent; border-radius:6px; padding:7px; }
.bde-galopt:hover { border-color:#2563eb; }
.bde-galopt.cur { border-color:#2563eb; background:#eff6ff; }
.bde-galopt { min-width:220px; }
.bde-galopt .bde-gname { font-size:12px; font-weight:700; margin-bottom:5px; color:#1f2937; }
.bde-thumbimg { width:100%; display:block; border:1px solid #cbd0d6; border-radius:3px; }
.bde-lb { position:fixed; inset:0; z-index:1040; background:rgba(15,23,42,.5); backdrop-filter:blur(3px); display:flex; align-items:center; justify-content:center; cursor:zoom-out; }
.bde-lb .bde-pglabel { color:#e5e7eb; }
.bde-drag-ghost { position:fixed; top:-2000px; left:-2000px; z-index:1050; pointer-events:none; background:#fff; box-shadow:0 14px 30px rgba(0,0,0,.35); transform:rotate(2.5deg); border-radius:6px; padding:10px 12px; font:600 14px/1.4 "Segoe UI",system-ui,sans-serif; }
#bdToast { position:fixed; left:50%; bottom:22px; transform:translateX(-50%); background:#111827; color:#f9fafb; padding:8px 16px; border-radius:6px; font-size:12px; opacity:0; pointer-events:none; transition:opacity .2s; z-index:1050; }
#bdToast.show { opacity:.95; }

/* dnd dimming (mockup body.dnd) */
body.bde-dnd #bdEditor .bde-palette, body.bde-dnd #bdEditor .bde-hzone, body.bde-dnd #bdEditor .bde-fzone,
body.bde-dnd #bdEditor .bde-preview, body.bde-dnd #bdEditor .bde-settabs, body.bde-dnd #bdEditor .bde-sheettabs,
body.bde-dnd #bdEditor .bde-panehead { filter:blur(1.5px) grayscale(.3); opacity:.45; transition:filter .15s, opacity .15s; }

/* Reusable popup paged-list component (any popup can use these; wired by commonF.regionCascade /
   popupListBody / wirePopupPageSize). Layout = flex column: scrollable body + sticky header + bottom pager. */
.popup-list { display:flex; flex-direction:column; padding:4px 8px; }
.popup-list .popup-list-scroll { flex:1; min-height:0; overflow-y:auto; }  /* rows scroll; header + pager stay put */
.popup-list-table { width:100%; border-collapse:separate; border-spacing:0; font-size:12px; border-left:1px solid #ddd; }
.popup-list-table th, .popup-list-table td { border-right:1px solid #ddd; border-bottom:1px solid #ddd; padding:4px 6px; text-align:left; vertical-align:middle; }
/* border-collapse:separate (not collapse) so the sticky header actually pins in Chrome */
.popup-list-table thead th { position:sticky; top:0; z-index:1; background:#f4f4f4; border-top:1px solid #ddd; }
.popup-list-btn { min-width:58px; height:24px; margin:0 2px; cursor:pointer; font-size:11px; border:1px solid #bbb; border-radius:3px; background:#fff; }
.popup-list-empty { color:#888; padding:12px; }
.popup-list-table tr.row-disabled td { color:#aab2ba; background:#f7f9fb; }
/* Uniform row height for lists whose cells must never wrap (dates, counts, status pills) */
.popup-list-table.fixed-rows td, .popup-list-table.fixed-rows th { height:30px; white-space:nowrap; }
.popup-search { display:flex; gap:6px; align-items:center; flex-wrap:wrap; margin-top:8px; padding:0 8px; }
.popup-search .search_select { height:28px; width:150px; flex:0 0 auto; }
.popup-search input[type=text] { height:26px; width:180px; box-sizing:border-box; }
/* CCS "receive results" popup (#ccsResultLeft) only: narrow dual-pane left. The full-grid pager
   (Total left / numbers center / size-select right, absolute) overlaps at ~470px here. Drop the
   page-size select and center the layout. Other popups and the main grids keep the original pager. */
#ccsResultLeft .tb_bottom { position:static; min-height:0; text-align:center; padding:8px 0 10px; }
#ccsResultLeft .tb_bottom .pagination { padding:0; }
#ccsResultLeft .tb_bottom .tb_page { position:static; display:block; margin-top:8px; }
#ccsResultLeft .tb_bottom .tb_number { display:none; }

/* Ballot review workspace: 3-pane layout (queue cards / face viewer / decision panel).
   Scoped to .ui-dialog so the unopened popup stays hidden by .popup-wrap .popup-layer, and
   !important so the flex column survives the inline display jQuery UI stamps on open. */
.ui-dialog #ballotReviewPopup { display:flex !important; flex-direction:column; box-sizing:border-box; }
/* Pipeline stepper: chevron arrows say "ordered process", never switchable tabs. done = an
   upstream stage in a healthy state (tick), cur = this workspace (stage 3), rest = downstream. */
.rvw-funnel { display:flex; flex:none; }
.rvw-fstep { flex:1; position:relative; padding:6px 12px 7px 30px; background:#f3f6f9; }
.rvw-fstep:first-child { padding-left:14px; border-radius:6px 0 0 6px; }
.rvw-fstep:last-child { border-radius:0 6px 6px 0; }
.rvw-fstep:not(:last-child)::before { content:''; position:absolute; right:-16px; top:0; bottom:0; width:26px; z-index:1;
    background:#fff; clip-path:polygon(0 0, 55% 50%, 0 100%); }
.rvw-fstep:not(:last-child)::after { content:''; position:absolute; right:-13px; top:0; bottom:0; width:26px; z-index:2;
    background:inherit; clip-path:polygon(0 0, 55% 50%, 0 100%); }
.rvw-fstep .fk { font-size:11px; color:#6b7480; text-transform:uppercase; letter-spacing:.4px; }
.rvw-fstep .fv { font-size:12.5px; font-weight:bold; margin-top:1px; color:#33414e; }
.rvw-fstep.done { background:#e9f1fb; }
.rvw-fstep.done .fk { color:#3d5a7d; }
.rvw-fstep.done .fk::before { content:'\2713'; font-weight:bold; margin-right:4px; }
.rvw-fstep.done .fv { color:#3d5a7d; }
.rvw-fstep.cur { background:#0f5aad; }
.rvw-fstep.cur .fk, .rvw-fstep.cur .fv { color:#fff; }
.rvw-fstep .fv.bad { color:#c62828; }
.rvw-fstep .fv.good { color:#2e7d32; }
.rvw-body { flex:1; min-height:0; display:grid; grid-template-columns:300px 1fr 340px; margin-top:8px;
    border:1px solid #d5dae2; border-radius:6px; overflow:hidden; }

/* queue pane */
.rvw-queue { display:flex; flex-direction:column; min-height:0; border-right:1px solid #d5dae2; background:#fff; }
.rvw-chips { display:flex; flex-wrap:wrap; gap:4px; padding:8px 8px 4px; }
.rvw-chip { border:1px solid #c8d0dc; border-radius:12px; padding:2px 10px; font-size:11px; background:#f4f6fa; color:#48505e; cursor:pointer; }
.rvw-chip.on { background:#2f5fa8; border-color:#2f5fa8; color:#fff; font-weight:bold; }
.rvw-chip .cnt { font-weight:bold; }
.rvw-search { display:grid; grid-template-columns:1fr 1fr; gap:4px; padding:6px 8px; border-bottom:1px solid #eef0f4; }
.rvw-search .search_select { width:100%; box-sizing:border-box; }
.rvw-search input[type=text] { height:24px; box-sizing:border-box; padding:0 6px; }
.rvw-cards { flex:1; min-height:0; overflow-y:auto; padding:2px 8px 6px; }
.rvw-card { border:1px solid #dbe0e8; border-left-width:4px; border-left-color:#b57400; border-radius:6px;
    margin:5px 0; padding:7px 9px; background:#fff; cursor:pointer; font-size:12px; }
.rvw-card:hover { background:#f8fafd; }
.rvw-card.blocked { border-left-color:#c62828; }
.rvw-card.sub { border-left-color:#7a58c2; cursor:default; }
.rvw-card.dcd { border-left-color:#8a93a1; }
.rvw-card.var { border-left-color:#2f5fa8; }
.rvw-note { font-size:11.5px; color:#5b6472; background:#f4f7fb; border:1px solid #dde5f2;
    border-radius:5px; padding:6px 8px; margin:4px 0 6px; }
.rvw-card.sel { outline:2px solid #2f5fa8; outline-offset:-1px; background:#f5f9ff; }
.rvw-card .c1 { font-weight:bold; font-size:12.5px; }
.rvw-card .c2 { color:#6b7480; font-size:11px; margin-top:1px; }
.rvw-card .c3 { margin-top:4px; display:flex; gap:5px; flex-wrap:wrap; align-items:center; }
.rvw-bdg { display:inline-block; font-size:10.5px; font-weight:bold; border-radius:3px; padding:0 6px; background:#eceff3; color:#6b7480; }
.rvw-bdg.pf-FAIL { background:#fbe4e4; color:#c62828; }
.rvw-bdg.pf-WARN { background:#fdf1dc; color:#9a6b00; }
.rvw-bdg.pf-PASS { background:#e3f1e5; color:#2e7d32; }
.rvw-bdg.flags { background:#eceff1; color:#455a64; }
.rvw-bdg.flags.blk { background:#c62828; color:#fff; }
.rvw-bdg.st-PENDING { background:#efe9fb; color:#7a58c2; }
.rvw-bdg.st-APPROVED, .rvw-bdg.st-APPLIED, .rvw-bdg.rv-A { background:#e3f1e5; color:#2e7d32; }
.rvw-bdg.st-REJECTED, .rvw-bdg.st-FAILED, .rvw-bdg.rv-J { background:#fbe4e4; color:#c62828; }
.rvw-bdg.st-CANCELLED, .rvw-bdg.rv-O { background:#eceff3; color:#6b7480; }
.rvw-out { font-size:10.5px; color:#8a93a1; }
.rvw-empty { color:#888; font-size:12px; padding:14px 6px; }
.rvw-cardnav { text-align:center; padding:6px 0; font-size:12px; }
.rvw-cardnav .btn_button { min-width:0; width:24px; height:20px; padding:0; cursor:pointer; }
.rvw-ready { flex:none; margin:6px 8px 8px; border:1px dashed #9dbf9d; border-radius:6px; background:#f4faf4; padding:8px 10px; font-size:12px; }
/* no clean group to approve: neutral colours so the box does not read as "ready" */
.rvw-ready.none { border-color:#c8d0dc; background:#f7f8fa; }
.rvw-ready .r1 { font-weight:bold; color:#2e7d32; }
.rvw-ready .r2 { font-size:11px; color:#5f7060; margin-top:1px; }
.rvw-ready .r2.warn { color:#b57400; }
.rvw-ready .racts { margin-top:6px; display:flex; gap:6px; flex-wrap:wrap; }

/* viewer pane */
.rvw-viewer { display:flex; flex-direction:column; min-height:0; background:#e7eaf0; }
.rvw-vbar { flex:none; display:flex; align-items:center; gap:8px; padding:6px 10px; background:#f0f2f6; border-bottom:1px solid #d5dae2; font-size:12px; color:#48505e; }
.rvw-vtitle { font-weight:bold; }
.rvw-vtools { margin-left:auto; display:flex; gap:4px; }
.rvw-vtools .btn_button { min-width:0; height:22px; padding:0 8px; cursor:pointer; }
#rvwStage { flex:1; min-height:0; overflow:auto; position:relative; }
#rvwViewerEmpty { color:#777; font-size:12.5px; padding:40px 20px; text-align:center; }
#rvwImgWrap { position:relative; margin:10px auto; width:96%; }
#rvwImg { width:100%; display:block; box-shadow:0 2px 8px rgba(30,40,60,.25); }
#rvwPinForm { position:absolute; z-index:30; width:260px; background:#fff; border:1px solid #9aa2ab; border-radius:6px;
    box-shadow:0 4px 14px rgba(0,0,0,.25); padding:8px; }
#rvwPinForm select { width:110px; height:24px; margin-bottom:6px; }
#rvwPinForm textarea { width:100%; height:56px; box-sizing:border-box; resize:none; font-size:12px; }
#rvwPinForm .rvw-pinform-btns { margin-top:6px; text-align:right; }
.rvw-pages { flex:none; display:flex; align-items:center; justify-content:center; gap:8px; padding:5px 8px; background:#f0f2f6; border-top:1px solid #d5dae2; font-size:12px; }
.rvw-pages .btn_button { min-width:0; width:26px; height:22px; padding:0; cursor:pointer; }
.rvw-keys { color:#98a1ae; font-size:10.5px; margin-left:14px; }

/* side pane */
.rvw-side { display:flex; flex-direction:column; min-height:0; overflow-y:auto; border-left:1px solid #d5dae2; background:#fff; padding:8px 10px; font-size:12px; }
.rvw-sec { margin-bottom:8px; }
.rvw-sec h4 { font-size:11px; color:#39445a; text-transform:uppercase; letter-spacing:.4px; margin:6px 0 4px; }
.rvw-sec .kv { display:flex; gap:6px; margin:1px 0; }
.rvw-sec .kv b { width:92px; flex:none; color:#6b7480; font-weight:normal; }
.rvw-back { display:inline-block; margin-bottom:4px; color:#2f5fa8; text-decoration:none; }
.rvw-find { border:1px solid #ecd9ad; background:#fffaf0; border-radius:5px; padding:5px 7px; font-size:11.5px; margin:3px 0; }
.rvw-find .fh { font-weight:bold; color:#9a6b00; }
.rvw-mut { color:#999; font-size:11.5px; }
.rvw-pinrow { display:flex; gap:7px; border:1px solid #e2e6ec; border-radius:5px; padding:5px 7px; margin:3px 0; font-size:11.5px; align-items:flex-start; cursor:pointer; }
.rvw-pinrow:hover { background:#f8fafd; }
.rvw-pinrow.hl { background:#fff3cd; border-color:#e6c85a; }
.rvw-pinrow .dot { flex:none; width:16px; height:16px; border-radius:50%; color:#fff; font-size:9.5px; font-weight:bold; text-align:center; line-height:16px; margin-top:1px; }
.rvw-pinrow .dot.E { background:#c62828; }
.rvw-pinrow .dot.W { background:#e69900; }
.rvw-pinrow .dot.N { background:#1565c0; }
.rvw-pinrow .tx { flex:1; word-break:break-word; }
.rvw-pinrow .tx .who { display:block; color:#8a93a1; font-size:10.5px; }
.rvw-pinrow .del { min-width:0; height:20px; padding:0 6px; font-size:10.5px; white-space:nowrap; cursor:pointer; }
.rvw-member { display:flex; gap:6px; align-items:center; padding:3px 6px; border-radius:4px; cursor:pointer; font-size:11.5px; }
.rvw-member:hover { background:#f4f6fa; }
.rvw-member.sel { background:#eaf1fd; font-weight:bold; }
.rvw-member .rvw-bdg { margin-left:auto; }
/* layout group rows lead with the preflight badge, so only the flags badge floats right */
.rvw-member.vg .rvw-bdg { margin-left:0; }
.rvw-member.vg .rvw-bdg.flags { margin-left:auto; }

/* decision box */
.rvw-dec { border:1.5px solid #d5dae2; border-radius:7px; padding:9px; background:#fafbfd; margin-top:auto; flex:none; }
.rvw-dec .why { background:#fbe4e4; border:1px solid #efc4c4; color:#a02020; border-radius:5px; padding:6px 8px; font-size:11.5px; margin-bottom:7px; }
.rvw-dec .why.warn { background:#fdf1dc; border-color:#ecd9ad; color:#9a6b00; }
.rvw-dec textarea { width:100%; height:52px; box-sizing:border-box; resize:none; font-size:12px; border:1px solid #c8d0dc; border-radius:4px; padding:4px 6px; }
.rvw-dec .acts { display:flex; gap:8px; margin-top:7px; }
.rvw-dec .note { font-size:10.5px; color:#8a93a1; margin-top:6px; }
.rvw-outcome { font-weight:bold; font-size:13px; }
.rvw-outcome.rv-A { color:#2e7d32; }
.rvw-outcome.rv-J { color:#c62828; }
.rvw-outcome.rv-O { color:#888; }
/* reviewer / view-only status shown in place of the decision controls */
.rvw-roleinfo { border:1px solid #c6d5f0; border-radius:5px; padding:7px 9px; background:#f4f7fb; }
.rvw-roleinfo .t { font-weight:bold; color:#2f5fa8; font-size:12px; }
.rvw-roleinfo .s { font-size:11.5px; margin-top:3px; }
.rvw-roleinfo.none { border-color:#d5dae2; background:#f7f8fa; }
.rvw-roleinfo.none .t { color:#6b7480; }

/* Page arrows of the approval face viewer: shrink the btn_button box to an icon */
.afv-pager button { min-width:0; width:26px; height:22px; padding:0; margin-left:4px; cursor:pointer; }
/* markup pins: shared by the review workspace viewer and the approval face viewer */
.rvm-pin { position:absolute; width:18px; height:18px; margin:-9px 0 0 -9px; border-radius:50%;
    border:2px solid #fff; box-shadow:0 1px 3px rgba(0,0,0,.5); color:#fff; font-size:10px; font-weight:bold;
    line-height:14px; text-align:center; cursor:pointer; box-sizing:border-box; }
.rvm-pin.E { background:#c62828; }
.rvm-pin.W { background:#e69900; }
.rvm-pin.N { background:#1565c0; }
.rvm-pin.pending { opacity:.55; }