@charset "utf-8";

@import "../initial";

//
// Widget
//
// Widget
// ## gerenral styles
.archives-ul{
    background: transparent!important;
    border: 0!important;
}
.i-archive__item-wrap{
  background-color: transparent!important;
  background: transparent !important;
    border-bottom: 3px solid rgba(0, 0, 0, 0.15) !important;
    border-radius: 0 !important;
    border-left: 0 !important;
    border-right: 0 !important;
    border-top: 0 !important;
}
.i-archive__category-list{
  background: transparent!important;
  border:0!important;
  border-radius: 0!important;
  @media(min-width:769px){
        width: 80%;
    margin: auto;
            text-align: center;
  }
}
.i-archive{
  .fa-file{
    display: none;
  }
  dd{
    margin-bottom: 0.5em;
        width: 100%;
  }
}
.i-archive__file-wrap{
      font-size: 1.2em;
}
.i-archive__list{
  .date-thead{
    min-width: 4em;
  }
}
.i-items{
      border: 1px solid #ccc;
  @media(min-width: 768px){
      background-color: #fff;
  }
}
.w-archive__title{
  font-weight: bold;
  @extend .i-title;
}
.w-archive__list{
  padding-left: 0.8em;
}
.w-archive__item{
    list-style: none;
    @extend .i-subtitle;
}
.w-archive {
  .w-archive__widget-title {
    @extend .unity-title;
    margin: 0.5rem 0;
  }
  .widget-title {
    @extend .unity-title;
  }
}
.panel-title{
  @extend .i-title;
}
// Widget 1
.widget-archive-1 {
  .w-archive__list.level-1 {
    padding: 0.5rem;
  }

  .w-archive__item.level-1 {
    list-style-position: inside;
    margin-bottom: 0.8rem;
  }

  .w-archive__item-heading {
    display: inline-block;
    // font-size: $w-item-heading-font-size;
    // color: $theme-gray;
    font-family: $main-font;
    margin: 0;
    padding-bottom: 0.25rem;
  }

  .w-archive__list.level-2 {
    margin: 0;
    padding: 0;
  }

  .w-archive__item.level-2 {
    border-bottom: 0.0625em dashed $w-border-color;
    padding: 0 0 0.5rem 0.4rem;
    .w-archive__list.level-3 {
      list-style-type: none;
      padding: 0;
      & > li:before {
        content:"";
        background: url(/assets/arr.gif) 0 0 no-repeat;
        display:inline-block;
        width:0.3125em;
        height: 0.5em;
        padding: 0 0.3rem;
      }
    }
  }

  .w-archive__link {
    @extend .i-subtitle;
  }
}

//Widget 2
.widget-archive-2 {
.panel-default > .panel-heading {
  cursor: pointer;
  padding: 0;
  transition: all 0.5s;
  -moz-transition: all 0.5s;
  -webkit-transition: all 0.5s;
  -o-transition: all 0.5s;
  &:hover {
    background-color: darken($color: #f5f5f5, $amount: 10);
  }
}
.panel {
  font-family: $main-font;
  margin-bottom: 0.625em;
}

.panel-title {
  font-family: $main-font;
  a {
    display: block;
    padding: 0.625em 0.9375em;
    .fa { padding-right: 0.5em; }
  }
}
}
//index setting
.i-archive{
  .date-thead,.title-thead,.file-thead,.description-thead{
    padding-bottom: 0.5em;
    padding-top: 0.5em;
    font-size: 1em;
    font-weight: bold;

  }
}
.archive-items{
  font-size: 1em;
  background-color: #fff;
}
.i-items{
  .thead{
    border-bottom: 0.0625em solid #ddd;
  }
}
.i-archive-title {
  @extend .unity-title;
}
/* 1. 定義玻璃基礎樣式 (共同類別，例如 .label) */
.i-archive-files-item .label {
    /* 核心：背景模糊 (iOS 關鍵) */
    -webkit-backdrop-filter: blur(10px) saturate(180%);
    backdrop-filter: blur(10px) saturate(180%);
    
    /* 核心：細微的半透明白色邊框，營造玻璃邊緣感 */
    border: 1px solid rgba(255, 255, 255, 0.2);
    
    /* 核心：多重陰影 */
    /* 陰影 1: 外部柔和陰影，增加立體感 */
    /* 陰影 2: 內部上方亮光，增加玻璃厚度感 */
    box-shadow: 
        0 4px 6px rgba(0, 0, 0, 0.1),
        inset 0 1px 0 rgba(255, 255, 255, 0.3);
    
    /* 修正樣式：確保文字清晰 */
    color: #fff !important;
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
    
    /* 樣式優化 */
    padding: 4px 8px;
    border-radius: 6px; /* iOS 偏好的圓角 */
    font-weight: 600;
    letter-spacing: 0.5px;
    display: inline-block;
    margin-right: 0.5em;
    transition: all 0.3s ease; /* 增加滑鼠移入動畫 */
}

/* 滑鼠移入時讓玻璃感更明顯 (可選) */
.i-archive-files-item:hover .label {
    -webkit-backdrop-filter: blur(15px) saturate(200%);
    backdrop-filter: blur(15px) saturate(200%);
    border: 1px solid rgba(255, 255, 255, 0.4);
    transform: translateY(-1px);
}

/* 2. 對應的檔案顏色 (轉為 iOS 半透明色調) */
.link { background-color: rgba(18, 115, 235, 0.6) !important; } /* iOS Blue */
.txt  { background-color: rgba(109, 187, 115, 0.6) !important; } /* iOS Green */
.xlsx { background-color: rgba(187, 109, 127, 0.6) !important; } /* iOS Pink/Red */
.pdf  { background-color: rgba(59, 131, 71, 0.7) !important; }  /* 深一點的 Green */
.docx { background-color: rgba(132, 109, 187, 0.6) !important; } /* iOS Purple */
.doc { background-color: rgba(132, 109, 187, 0.6) !important; } /* iOS Purple */
.pptx { background-color: rgba(109, 119, 187, 0.6) !important; } /* iOS Indigo */
.jpg  { background-color: rgba(187, 109, 109, 0.6) !important; } /* iOS Red */
.zip  { background-color: rgba(220, 185, 87, 0.6) !important; }  /* iOS Yellow/Orange */
.table>caption+thead>tr:first-child>td, .table>caption+thead>tr:first-child>th, .table>colgroup+thead>tr:first-child>td, .table>colgroup+thead>tr:first-child>th, .table>thead:first-child>tr:first-child>td, .table>thead:first-child>tr:first-child>th{
    // border-top: 0.0625em solid #ddd;
}

.i-archive__category-title {
    padding-bottom: 0.3125em;
    text-align: center;
    font-size: 2.2rem;
    color: #7f6000;
    font-family: Roboto, Arial;
    font-variant: normal;
    font-weight: 700;
    vertical-align: baseline;
}
// Archive index 1
.index-archive-1 {
  font-family: $main-font;
  .fa-file{
    display: none;
  }
  .i-archive__item-wrap{
    border-bottom: 1px solid #ccc;
    padding-bottom: 1em;
    line-height: 3;
    a{
      text-decoration: underline;
    }
    &:last-child{
      border-bottom: 0;
    }
  }

  .i-archive__archive-title {
    font-size: 1.8rem;
    margin-bottom: 0.625em;
    vertical-align: top;
    color: #5b0f00;
    font-family: Roboto, Arial;
    font-variant: normal;
    font-weight: 700;
    vertical-align: baseline;
  }

  .i-archive__status-wrap {
    vertical-align: top;
    display: inline-block;
    margin-bottom: 0.625em;
  }

  .i-archive__item {
    margin-bottom: 2.5em;
    list-style: none;
  }


  .i-archive__category-title {
    padding-bottom: 0.3125em;
  }

  .i-archive__archive-title-wrap {
    display: block;
    max-width: fit-content;
    text-align: justify;
    margin: auto;
  }

  .i-archive__file-list {
    margin-bottom: 0;
    max-width: fit-content;
    text-align: justify;
    margin: auto;

  }

  .i-archive__file-wrap {
    margin:0;
    padding:0 0 0.5em 0;
    border-radius: 0.125em;
        width: auto;
  }

  // .i-archive__file-name {
  //   font-size: 1rem;
  // }
}
// Archive index 1-2
.index-archive-1-2 {
  font-family: $main-font;
  .i-archive__file-name {
    padding: 0 0.5em;
  }
  .i-archive__file-wrap{
        display: flex;
    min-width: max-content;
    &:last-child{
    &:after{
      display: none;
    }
    }
    &:after{
      content: ' | ';
      position: relative;
    }
  }
  .fa-file{
    display: none;
  }
  .i-archive__item-wrap{
    padding-bottom: 1em;
        line-height: 3;
    a{
      text-decoration: underline;
    }

    @media(min-width:769px){
    display: flex;
    align-items: center;
    }
    &:last-child{
      border-bottom: 0;
    }
  }

  .i-archive__archive-title {
    font-size: 1.8rem;
    margin-bottom: 0.625em;
    vertical-align: top;
    color: #5b0f00;
    font-family: Roboto, Arial;
    font-variant: normal;
    font-weight: 700;
    vertical-align: baseline;
  }

  .i-archive__status-wrap {
    vertical-align: top;
    display: inline-block;
    margin-bottom: 0.625em;
  }

  .i-archive__item {
    margin-bottom: 2.5em;
    list-style: none;
  }


  .i-archive__category-title {
    padding-bottom: 0.3125em;
  }

  .i-archive__archive-title-wrap {
    display: inline;
    text-align: center;
  }

  .i-archive__file-list {
    margin-bottom: 0;
    max-width: 700px;
    text-align: justify;
    margin: auto;

  }

  .i-archive__file-wrap {
    margin:0;
    padding:0;
    border-radius: 0.125em;
        width: auto;
  }

  // .i-archive__file-name {
  //   font-size: 1rem;
  // }
}
.index-archive-4 {
  dt.i-archive-item-list { display: none; }
  dl.i-archive-files-list { padding: 0; }
  @media (min-width: 768px) {
    .dl-horizontal dd { margin-left: 0 !important; }
  }


}
.index-archive-3{
  .i-archive__item {
    list-style: none;
  }
  .i-archive__archive-title-wrap {
    display: inline;
    text-align: center;
    width: 100%;
    display: block;
  }

  .i-archive__file-list {
    margin-bottom: 0;
    max-width: 700px;
    text-align: justify;
    margin: auto;

  }
}
.index-archive-2,
.index-archive-4 {
  .panel-default>.panel-heading {
    cursor: pointer;
    padding: 0;
    transition: all 0.5s;
    -moz-transition: all 0.5s;
    -webkit-transition: all 0.5s;
    -o-transition: all 0.5s;
    &:hover {
      background-color: darken($color: #f5f5f5, $amount: 10);
    }
  }
  .panel {
    font-family: $main-font;
    margin-bottom: 0.625em;
  }

  .panel-title {
    font-family: $main-font;
    a {
      display: block;
      padding: 0.625em 0.9375em;
      .fa { padding-right: 0.5em; }
    }
  }

  .i-archive-tags {
    margin-bottom: 0;
  }

  .i-archive-files-item {
    font-size:1em;
    font-family: $main-font;
  }

  .i-archive-files-list {
    dd {
      margin-bottom: 0.3em;
    }
  }

  .i-archive-tag-name {
    margin-bottom: 0.5em;
    font-size: 0.9375rem;
    display: inline-block;
  }

  @media screen and (min-width: $screen-sm) {
    .dl-horizontal {
      dt {
        text-align: left;
      }
    }
    .dl-horizontal dt { overflow: unset; white-space: unset; }
    .dl-horizontal dd { margin-left: 1em; }
  }
}

.has-archive-tab {
  .i-tag__item {
    display: none;
  }

  .tab-content--active {
    display: block !important;
  }

  .i-archive__tag-name {
    cursor: pointer;
  }
}

.index-archive-3 {
  .i-archive__tag-name {
    background-color: $theme-color-main;
    color: $theme-white;
    font-family: $main-font;
    display: inline-block;
    padding: 0.625em 0.75em;
    margin-right: 0.3125em;
    border-radius: 0.25em;
    font-size: 0.938em;

    &:hover {
      background-color: darken($theme-color-main, 7%);
    }

    &.tab--active {
      background-color: darken($theme-color-main, 7%);
    }
  }

  .tab-content {
    background-color: lighten($theme-gray, 65%);
    padding: 20.3125em;
  }

  .i-archive__archive-title-wrap {
    margin-bottom: 0.5em;
  }

  .i-archive__category-title {
    font-family: $main-font;
  }

  .i-archive__archive-title {
    font-size: 0.938em;
  }

  .tab-content {
    margin-bottom: 0.625em;
  }

  .i-archive__file-name {
    font-size: 1em;
  }

  .i-archive__file-wrap {
    margin-bottom: 0.625em;
  }

  .i-archive__item-wrap {
    font-family: $main-font;
  }
}

.index-archive-5 {
  .head{

  }
  .i-archive__category-title {
    font-size: 1rem;
    margin-bottom: 0.625em;
    vertical-align: top;
  }
  .i-items {
    background: #fff;
    margin-bottom: 1.5em;
    position: relative;
    background: #fff;
    border-radius: 5px;
  }
  .thead.row {
    margin: 0;
    border-bottom: 0.0625em solid #ddd;
   @media (max-width: 767px) {
     display: none;
   }
  }
  .archive-items {
    padding-bottom: 0.5em;
    padding-top: 0.5em;

    &:nth-child(odd){
      background-color: #F3F3F3;
    }
     div:nth-child(1), div:nth-child(2) {

     }
  }
}

.index-archive-6 {

  .i-archive__category-title {
    font-size: 1rem;
    margin-bottom: 0.625em;
    vertical-align: top;
  }
  .i-items {
    background: #fff;
    margin-bottom: 1.5em;
    position: relative;
    background: #fff;
  }
  .head{
    @media(min-width: 821px){

    }
  }
  .i-archive__file { margin: 0; }
  .thead.row {
   @media (max-width: 767px) {
     display: none;
   }
  }

  .archive-items {
    border-bottom: 1px solid transparent;
    padding-bottom: 0.5em;
    padding-top: 0.5em;
    &:nth-child(odd) {
      background-color: #F3F3F3;
    }
     div:nth-child(1), div:nth-child(2) {
      // border-right: 1px solid #333;
     }
  }
}
.index-archive-7 {
  .i-archive__category-title {
    font-size: 1rem;
    margin-bottom: 0.625em;
    vertical-align: top;
  }
  .i-items {
    margin-bottom: 1.5em;
    position: relative;
    border-radius: 5px;
    @media(max-width: $screen-xs){
      padding: 1em;
    }
  }
  .thead.row {
    margin: 0;
   @media (max-width: 767px) {
     display: none;
   }
  }
  .archive-items {
    margin-bottom: 1em;
    line-height: 2;
     div:nth-child(1), div:nth-child(2) {

     }
  }
}
.index-archive-9{
  @media(max-width: $screen-xs){
    .thead{
      border:0;
      border-top: 0.0625em solid #ddd;
    }
    tr{
      margin-bottom: 1em;
    }
  }
  th{
    @media(max-width: $screen-xs){
      width: 100%;
    }
  }
}
.index-archive-10{
  @media(max-width: $screen-xs){
    tr{
      margin-bottom: 1em;
    }
  }
  .i-archive__category-title {
    font-size: 1rem;
    margin-bottom: 0.625em;
    vertical-align: top;
  }
  .i-items {
    margin-bottom: 1.5em;
    position: relative;
    border-radius: 5px;
  }
  .thead.row {
    margin: 0;
   @media (max-width: 767px) {
     display: none;
   }
  }
  .archive-items {
    line-height: 2;
    &:nth-child(odd){
      background-color: #F3F3F3;
    }
     div:nth-child(1), div:nth-child(2) {

     }
  }
}
.index-archive-13{
  .archives-ul{
        padding: 1em;
  }
  .archives-ul .archive-li{
    list-style-type: none!important;
  }
  li{
    list-style: none;
  }
}
.index-archive-14{
  label{
    margin-left: 0.5em;
  }
  @media(max-width: $screen-xs){
    .fa-file-text{
      display: none;
    }
    ul{
      padding: 0;
    }
  }

  .archives-ul .archive-li{
    list-style-type: none!important;
  }
  li{
    list-style: none;
  }
}
.index-archive-15{


  @media(min-width:821px){
    .i-archive__file-list {
    /* 強制分成三欄 */
    column-count: 3;
    margin: 0 auto;
    max-width: 1200px;
    list-style: none;
    }
    /* 2. 檔案項目：防止項目被「斬斷」跨欄 */
    .i-archive__file-wrap {
        /* 關鍵：防止一個項目內容被拆分到兩欄 */
        break-inside: avoid;
        display: flex;
        align-items: center;
        padding: 8px 0;
                justify-content: space-evenly;
    }
    .i-archive__file-wrap{
        margin-bottom: 0.5em;

    }
  }
  @media(min-width:480px)and(max-width:820px){
    .i-archive__file-list {
    /* 強制分成三欄 */
    column-count: 2;
    margin: 0 auto;
    max-width: 1200px;
    list-style: none;
    }
    /* 2. 檔案項目：防止項目被「斬斷」跨欄 */
    .i-archive__file-wrap {
        /* 關鍵：防止一個項目內容被拆分到兩欄 */
        break-inside: avoid;
        display: flex;
        align-items: center;
                justify-content: space-evenly;
        padding: 8px 0;
    }
    .i-archive__file-wrap{
        margin-bottom: 0.5em;
    
    }
  }
  .i-archive-files-item {
    float: right;
}
  label{
    margin-left: 0.5em;
  }
}
.index-archive-16{
  label{
    margin-left: 0.5em;
  }
  .archives-ul .archive-li{
    list-style-type: none!important;
  }
  li{
    list-style: none;
  }
  .i-archive-files-list{
     padding-left: 12%;
  }
  .panel-title {
    font-family: $main-font;
    display: flex;
    flex-wrap: wrap;
    align-items:center;
    a {
      @media(min-width: 769px){
        max-width: 80%;
      }
    }
  }
  .fa-file-text{
      padding-right: 5px;
    }
  .i-archive-files-list{
    @media(max-width: 768px){
      padding: 0;
    }
  }
  .head{
    width: 100%;
    border-bottom: 1px solid #ddd;
    padding: 0;
  }
  .description{
    width: 100%;
    padding: 0;
    padding-bottom: 5px;
    padding-top: 5px;
    padding-left: 12%;
    @media(max-width: $screen-xs){
      padding-left: 0;
    }
  }
  // .collapse.in{
  //       display: block ;
  // }
  // .panel-collapse{
  //     display: none;
  //   }
  .date{
    @media(min-width:1025px){
          width: 12%!important;
    }
    @media(max-width: 768px){
      padding: 0;
    }
  }
  .fa-file-text{
    @media(max-width: 768px){
      float: left;
      padding-right: 5px;
      display: none;
    }
  }
}
.i-archive-files-itemwrapper{
  width: 100%;
  border-top: 1px solid #ddd;
  padding: 0;
  display: flex;
  align-items: center;
  padding-bottom: 5px;
  padding-top: 5px;
}