@charset "utf-8";

.main-sidebar > .main-content {
    margin-left: 0;
    width: 100%;
    max-width: 100%;
}
.tt-menu {
    width: 100%;
    margin-top: 4px;
    padding: 8px 0;
    background-color: #fff;
    border: 1px solid rgba(0,0,0,.15);
    border-radius: 0.375rem; /* BS5 圓角 */
    box-shadow: 0 0.5rem 1rem rgba(0,0,0,.175);
    z-index: 1050;
}
.tt-suggestion {
    padding: 6px 12px;
    cursor: pointer;
}
.tt-suggestion:hover, .tt-suggestion.tt-cursor {
    color: #fff;
    background-color: #0d6efd; /* BS5 Primary Color */
}
.form-control ,.form-select{
	color: #000;
    font-size: 0.9rem;
    padding: 0.415rem 0.75rem;
    font-weight: 700;
}
.main-navbar .navbar .navbar-nav .dropdown-menu {
	width: auto;
}
.table {
    /*white-space: nowrap;*/
}
.main-sidebar .nav .nav-item, .main-sidebar .nav .nav-link {
    font-family:var(--bs-font-sans-serif)
}
.dataTables_length select {
    height: 2.1rem;
    margin: 0 0.1rem;
}
.js-table-head-wrapper[data-is-fixed="true"] {
	top:  3.75rem!important;
    min-height: 50px;
    background-color: white;
	z-index: 9999!important;
}
.js-table-head-wrapper[data-is-fixed="true"] tr th {
    height: 50px;
}
.js-table-head-wrapper::-webkit-scrollbar {
    height: 0px;
}
.main-sidebar .dropdown-toggle.active , .main-sidebar .dropdown-toggle.active i{
	background-color: #4a70a8!important;
	color: #fff!important;
}
.main-sidebar .dropdown-menu .dropdown-item.active {
	background-color: var(--bs-light);
    color: var(--bs-danger);
}
.post-upload .box .ajax-upload-dragdrop {
	display:flex;
	align-items:center;
}
.ajax-file-upload {
	width: 100%;
}
.post-upload .box .ajax-upload-dragdrop .ajax-file-upload {
	height: 100%;
}
.newpost-previews .ajax-file-upload-statusbar {
	display: inline-block;
  position: relative;
	width: 120px;
	border: 1px solid;
	margin: 5px;
  padding: 4px;
}
.newpost-previews .ajax-file-upload-statusbar.cover {
	border: 3px solid #17a2b8;
}
.newpost-previews .ajax-file-upload-preview {
}
.newpost-previews .ajax-file-upload-statusbar.cover .ajax-file-upload-preview {
	opacity: 0.6;
}
.newpost-previews .cancel , .newpost-previews .delete {
	position: absolute;
	top: 10px;
	right: 10px;
	background-color: #e7e7e7;
	cursor: pointer;
	padding: 0 3px;
	color: #177887;
}
.navbar-toggler {
	border-color: #000;
}
.navbar-toggler[aria-expanded="true"] {
	color: #fff;
	border-color: #000;
	background-color: #000;
}
.newpost-previews {
	white-space: nowrap;
	overflow-y: hidden;
    width: 100%;
	overflow-x: auto;
}
.ajax-file-upload-statusbar {
    height: auto;
    width: 120px;
}
.ajax-file-upload-preview{
    height: 100%;
    width: 100%;;
}
.ajax-file-upload-statusbar .progress {
    height: 15px;
    margin-bottom: 0;
}
.dropzone .dz-preview .dz-details .dz-filename span, .dropzone .dz-preview .dz-details .dz-size span {}
.newpost-previews .dz-preview .dz-image[num="1"]{
	border: 2px dashed #17a2b8;
}
.newpost-previews .ajax-file-upload-statusbar .ajax-file-upload-abort ,
.newpost-previews .ajax-file-upload-statusbar .ajax-file-upload-cover {
	position: absolute;
	top: 0;
	width: 100%;
	height: 100%;
	text-align: center;
	display: flex;
	font-size: 3rem;
	align-items: center;
}
.newpost-previews .ajax-file-upload-statusbar .ajax-file-upload-abort {
	cursor: pointer;
}
.newpost-previews .ajax-file-upload-statusbar .ajax-file-upload-cover {
	display: none;
}
.newpost-previews .ajax-file-upload-statusbar.cover .ajax-file-upload-cover {
	display: flex;
}
.newpost-previews .ajax-file-upload-statusbar .ajax-file-upload-abort .fas ,
.newpost-previews .ajax-file-upload-statusbar .ajax-file-upload-cover .far {
	width: 100%;
}
.newpost-previews .ajax-file-upload-statusbar .ajax-file-upload-abort .fas.upblink:before {
	content: "\f0aa";
  /*color: #fff;*/
	cursor: pointer;
}
.newpost-previews .ajax-file-upload-statusbar .ajax-file-upload-cover .far:before {
	content: "\f14a";
  color: #17a2b8;
}
.newpost-previews .ajax-file-upload-statusbar:hover .ajax-file-upload-abort .fas.upblink:before {
	content: "\f057";
  color: #b22b38;
}
.newpost-previews .ajax-file-upload-statusbar .ajax-file-upload-abort:not(:hover) .fas.upblink {
    animation: upblink 1.5s infinite steps(100, start);
}
.clone-head-table-wrap {
    z-index: 9999!important;
}
.sticky-wrap {
	z-index: 9999;
}
.sticky-wrap div[class^='sticky'] {
	z-index: 9999;
	padding: 1rem 0;
	text-align: center;
	background-color: white;
}
.modal {
	z-index: 10000;
}
.input-group-text {
    color: var(--bs-primary);
}
@media (max-width: 991px) {
    .main-sidebar .nav .nav-item .nav-link ,.main-sidebar .dropdown-menu .dropdown-item{
        font-size: 0.9rem;
        padding: 0.8175rem 1.5625rem;
        font-weight: 400;
    }
}
.table-sm td, .table-sm th {
	padding: 0.3rem 0;
    font-size: 1rem;
    font-weight: 400;
    font-family: 'Noto Sans TC';
}
/*凍結表頭/行頭*/
/*sticky會跟著上一層的overfloat跑！！因此要定義一個外框*/
.table-sticky-wrapper{
	width: 100%;
	height: 60vh;/*外框的高度*/
	overflow:auto;
  }
  table.table-sticky {
	table-layout: fixed;
	min-width: 100%;
	width: auto;
	overflow: unset!important
  }
  .table-sticky th {
	position:sticky;
	word-break: keep-all;
	background: #fff
  }

  .table-sticky td {
	border-right: 1px solid #ddd;
  }

  .table-sticky thead tr th:first-of-type {
	left:0;/*sticky要用 上下左右定位*/
	z-index:3;
	border-right: 0;
	box-shadow: -2px -2px 0 inset #ddd
  }
  .table-sticky thead tr th{
	top:0;/*sticky要用 上下左右定位*/
	background: #f7f7f7;
	vertical-align: top;
	border-bottom: 0;
	border-right: 1px solid #ddd;
	box-shadow: 0 -2px 0 inset #ddd;
	z-index: 2;
  }
  /*sticky要用 上下左右定位*/
  .table-sticky tbody th {
	left: 0;/*定位用*/
	z-index: 2;/*遮蓋表格內容的圖層層級設定*/
	box-shadow: -2px 0 0 inset #ddd;/*內框線*/
  }
  .table-sticky .card-header{
	background: #f7f7f7
  }
  .table-sticky td a{
	float: left
  }/*為了按鈕設定的，刪除不影響*/
  .table-sticky th a{
	display: inline-block
  }/*為了按鈕設定的，刪除不影響*/

  /*表格做記號：群組底色*/
  table [data-group="0"],table tr[data-group="0"]>th{
	  background: #ffffff!important;
  }
  table [data-group="1"],table tr[data-group="1"]>th{
	  background: #F5F6F7!important;
  }
  @media screen and (max-width: 767px) {
	.table-sticky tbody th,
	.table-sticky thead tr th:first-of-type{
		width: unset!important;/*th有時會自帶寬度設定，用以清除*/
		word-break: break-word;
		min-width: 100px;
		max-width: 150px;
		overflow: auto;
	}
  }/*讓左邊第一直欄的寬度 手機尺寸時不要過寬遮蔽資訊*/