.hidden {
  display: none !important;
}
.text-danger {
  color: #a94442;
}

.bg-orange {
  background-color: #e6d68e  !important;
}
.text-center {
  text-align: center;
}


.navbar-home .nav-link {
    color: #ffffff !important;  /* 強制白色 */
    font-size: 1.4rem !important; /* 比原本大一點 */
}

.navbar-home .nav-link:hover {
  
    color: #f3ba00f8 !important;  /* 滑鼠滑過也白色 */
    font-size: 1.4rem !important; /* 滑過時維持一樣大小 */
     
}





.social-card .icon-wrapper {
  width: 200px;
  height: 200px;
  background-color: #e0e0e0;  /* 灰色背景，對比度要足夠 */
  border-radius: 12px;        /* 圓角方框 */
  display: flex;
  align-items: center;
  justify-content: center;
  margin: auto;
}

.social-card .icon-img {
  width: 140px;
  height: 140px;
  border-radius: 50%;  /* 圓形圖片 */
  object-fit: cover;
}


#tab-1 {
  width: 100% !important;
}

#datatables-ajax1 {
  width: 100% !important;
}

#tab-2 {
  width: 100% !important;
}

#datatables-ajax2 {
  width: 100% !important;
}

#tab-3 {
  width: 100% !important;
}

#datatables-ajax3 {
  width: 100% !important;
}


.h1-title {
  color: #817908f8;
}




.croppie-container {
    height: auto !important;   /* 讓高度自動 */
    max-height: 250px;         /* 或直接限制最大高度 */
}


/* 所有可聚焦元素，如按鈕、連結、input */
button:focus,
a:focus,
input:focus,
select:focus,
textarea:focus {
  outline: none; /* 移除預設藍色框 */
  background-color:  #f2f701e0; /* 高亮背景 */
  /* 圓角 */
  border-radius: 10%;  /* 如果是圓形按鈕 */
  
  box-shadow: 0 0 8px 3px rgba(255, 200, 0, 0.7);
  
  /* 文字顏色 */
  color: #000;
  
  /* 過渡效果 */
  transition: box-shadow 0.2s ease, color 0.2s ease;
}

  table {
    font-size: 1.125rem; /* 約等於 18px */
  }

  th, td {
    vertical-align: middle !important;
  /*  text-align: center;*/
  }

  div.dataTables_scrollBody {
  overflow: auto !important;
}