@import url('css2_Noto.css');

body {
    font-family: 'Noto Sans TC',"Poppins",sans-serif;
    font-size: 1rem;
    background-color: #FFFFFF;
}

.text-bluegreen{
  color: #000000;
}

.btn-bluegreen {
    color: #fff;
    background-color: #197D9C;
    border-color: #197D9C;
}

.btn-bluegreen:hover {
    color: #fff;
    background-color: #105368;
    border-color: #105368;
}

/*===== 登入頁 =====*/
.auth-one-bg {
  background-image: url("../images/auth-one-bg.png");
  background-position: center;
  background-size: cover;
}

.auth-one-bg .bg-overlay {
  background: -webkit-gradient(linear, right top, left top, from(#197D9C), to(#197D9C));
  background: linear-gradient(to left, #197D9C, #197D9C);
  opacity: 0.7;
}

.nav-tabs .nav-link{
  background: #000000;
  margin-right: 10px;
}

.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
  color: #000000;
  background-color: #1268B3;
  border-color: var(--vz-gray-300) var(--vz-gray-300) var(--vz-nav-tabs-link-active-bg);
  font-weight: bold;
}

.auth-footer span::after{
  content: "|";
  margin-right: 13px;
  margin-left: 13px;

}

.auth-footer span:last-child::after{
  content: "";
}

.forgottenBox a::after{
  content: "|";
  margin-right: 13px;
  margin-left: 13px;
}

.forgottenBox a:last-child::after{
  content: "";
}

.authtitle{
  font-weight: 900;
  font-size: 1.5rem;
  letter-spacing: 2px;
  white-space: nowrap;
}

/*===== 內頁 =====*/

.container-fluid{
  z-index: 10;
}

.footer{
  z-index: 10;
  font-size: 0.85rem;
}

.page-bg{
  z-index: 0;
  position: absolute;
  bottom: 0;
  right: 0px;
  width: 50%;
}

.navbar-brand-box {
  padding: 0;
}

[data-layout=vertical][data-sidebar=dark] .navbar-menu {
  background: #FFFFFF;/*#197D9C;*/
  border-right: 0;
}

[data-layout=vertical][data-sidebar=dark] .navbar-nav .nav-link{
  color: #000000;
  font-size: 1rem;
  padding: 1rem 1.5rem;
}

[data-layout=vertical][data-sidebar=dark] .navbar-nav .menu-link{
  color: #000000;
  font-size: 1.1rem;
  padding: 1rem 1.5rem;
}

    [data-layout=vertical][data-sidebar=dark] .navbar-nav .menu-link:hover{
        color: #000000;
    }

[data-layout=vertical][data-sidebar=dark] .navbar-nav .nav-link[data-bs-toggle=collapse][aria-expanded=true] {
    color: #000000;
    background-color: #FFFFFF;
}

.navbar-menu .navbar-nav .nav-sm {
    color: #000000;
    background-color: #FFFFFF;
    padding-left: 0;
}

[data-layout=vertical][data-sidebar=dark] .navbar-nav .nav-sm .nav-link{
  color: gray;
}

[data-layout=vertical][data-sidebar=dark] .navbar-nav .nav-sm .nav-link:hover{
  background-color: #FFFFFF;
  color: #000000;
}

[data-layout=vertical][data-sidebar=dark] .navbar-nav .nav-sm .nav-link:before{
  display: none;
}

[data-layout=vertical][data-sidebar-size=sm] .navbar-menu .navbar-nav .nav-item:hover>.menu-dropdown{
  padding: 0;
}

[data-layout=vertical][data-sidebar-size=sm] .navbar-menu .navbar-nav .nav-item:hover > a.menu-link {
    background-color: #000000;
}

/*Top NavBar*/
.header-item{
  border-right: 1px solid #e9ebec;
  padding-right: 10px;
  padding-left: 10px;
}

.navbar-header{
  padding: 0 0 0 calc(1rem / 2);
  font-size: 0.85rem;
}

.btn-user-rwd{
  padding: 0.7rem;
}

.btn-user-rwd i{
  font-size: 2rem;
}

/*Right Content*/
.page-title-box{  
  background-color: azure;
  border-bottom: 0;
  margin: -23px -1.5rem 1rem -1.5rem
}

.page-title-box h3{
  border-left: 3px solid #197D9C;
  padding-left: 10px;
  font-size: 1.3rem;
}

/*Card Header*/
.card-header{
  background: #197d9c;
  background: -moz-linear-gradient(-45deg,  #197d9c 0%, #a6e9fa 100%, #2989d8 100%);
  background: -webkit-linear-gradient(-45deg,  #197d9c 0%,#a6e9fa 100%,#2989d8 100%);
  background: linear-gradient(135deg,  #197d9c 0%,#a6e9fa 100%,#2989d8 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#197d9c', endColorstr='#2989d8',GradientType=1 );

}
/*Card Footer*/
.card-footer {
    background-color: #f3f6f9;
    font-size: 0.8rem;
}

/*Tab*/
.nav-success .nav-link{
  font-size: 1.2rem;
  color: #FFF;
  background-color: #FFFFFF40;
  margin-right: 10px;
  padding: 0.5rem 1.5rem;
  border-radius: 0.25rem 0.25rem 0rem 0rem;
}
.nav-success .nav-link.active{
  background-color: #FFF;
  color: #197D9C;
  font-weight: 700;
  font-size: 1.2rem;
}

.card-header.-withTab{
  padding: 1rem 1rem 0rem 1rem; 
}

/*===== 通報頁 =====*/
/*========================*/
/*===== 通報頁 - RWD  =====*/
/*========================*/

/* laptop */
@media (max-width: 1366px) {  
   
}

/* tablets */
@media (max-width: 992px) {   
  .CODtext{
    font-size: 0.8rem;
    white-space: nowrap;
  }
}

/* phones */
@media (max-width: 576px) {  
  .CODtext>div{
    padding-bottom: 15px;
    margin-bottom: 15px;
    border-bottom: 0.5px solid #e3e3e3;
  }

  .CODtext>div:last-child{
    padding-bottom: 0;
    margin-bottom: 0;
    border-bottom: 0;
  }

  .CODtext .addBtn{
    padding-left: 0;
    padding-right: 0;
  }

  .exBtn>button{
    display: block;
    margin-bottom: 8px;
  }

}

/*===========================*/
/*===== 通報頁 - RWD  END=====*/
/*===========================*/


/*===0406 Modify===*/

/*箭頭改漢堡*/
.hamburger-icon.open span:nth-child(2) {
    left: -8px;
    top: 5px;
    width: 20px;
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    -webkit-transition-delay: 50ms;
    transition-delay: 50ms;
}

.hamburger-icon.open span:nth-child(3) {
    left: 9px;
    top: 5px;
    width: 20px;
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
    -webkit-transition-delay: .1s;
    transition-delay: .1s;
}

/* 登入頁RWD - phones */
@media (max-width: 576px) {  
  .nav-tabs .nav-link{
    margin-right: 0;
  }

}