:root {
  --gray: hsla(0, 0%, 93%, 1);
  --orange: hsla(28, 100%, 48%, 1);
  --yellow: hsla(43, 100%, 59%, 1);
  --green: hsla(191, 48%, 45%, 1);
  --primary: hsla(211, 100%, 50%, 1);
  --blue: #5c91ef;

  accent-color: oklch(0.6265 0.0892 215.19);
}

/*=================================================================
                              通用
=================================================================*/
/*==================================
                Text
====================================*/
.text-orange {
  color: hsla(28, 100%, 48%, 1);
  color: var(--orange);
}
.text_red {
  color: red;
}
.text_blue {
  color: #427be1;
}
/*==================================
                 Bg
====================================*/
.bg-gray {
  background-color: #f8f8f8;
}
.bg_blue {
  background: #5c91ef;
}
/*==================================
                 Btn
====================================*/
.btn-orange {
  color: #fff;
  background-color: hsla(28, 100%, 48%, 1);
  background-color: var(--orange);
}
.btn-orange:hover,
.btn-orange:focus {
  color: #fff;
  background-color: hsla(26, 94%, 60%, 1);
}
/*==================================
               Pagination
====================================*/
.page-item.active .page-link {
  color: #fff;
  background-color: hsla(191, 48%, 45%, 1);
  background-color: var(--green);
  border-color: hsla(191, 48%, 45%, 1);
  border-color: var(--green);
}
/*==================================
                Sidebar
====================================*/
.sidebar {
  .nav-link {
    @media (hover: hover) and (pointer: fine) {
      &:hover {
        color: #333;
        background-color: #e6e6e6;
      }
    }
    &.active {
      color: #fff;
      background-color: var(--orange);
    }
  }
}
.edit {
  .sidebar {
    padding: 8px;
    background-color: #fff;
  }
}

/*=================================================================
                              Header
=================================================================*/
#mainNav {
  background-color: #fff;
  box-shadow: 0px 5px 9px 0px oklch(0.68 0 0 / 0.25);
}
/*== 社群分享 ==*/
.share_facebook i {
  color: hsla(221, 44%, 41%, 1);
}
.share_line i {
  color: hsla(120, 100%, 38%, 1);
}

/*=================================================================
                          【首頁】最新消息
=================================================================*/
.news_section .thumbnail {
  background-color: #fff;
  border-color: hsla(0, 0%, 93%, 1);
  border-color: var(--gray);
}
/*== 日期 ==*/
.news_section .inner .date {
  color: #999;
}
/*== NEW 標籤 ==*/
.news_section .inner .tag {
  color: #fff;
  background-color: hsla(28, 100%, 48%, 1);
  background-color: var(--orange);
}
/*== 標題 ==*/
.news_section .inner h3 {
  color: hsla(187, 93%, 43%, 1);
}

/*=================================================================
                           Scroll To Top
=================================================================*/
.go_top {
  background-color: hsla(191, 48%, 45%, 1);
  background-color: var(--green);
}

/*=================================================================
                             最新消息
=================================================================*/
/*== More ==*/
.news_table tr td span a,
.news_table tr td span a:hover {
  color: hsla(28, 100%, 48%, 1);
  color: var(--orange);
}

/*=================================================================
                      商圈資訊 / 線上申請作業
=================================================================*/
/*--------------------------------------*/
/*       商圈活動資訊 / 商圈基本資料      */
/*------------------------------------- */
/*-- Tab --*/
#navs_tab {
  .nav-link {
    background-color: #E6E6E6;
    border: 1px solid #BBB;
    @media (hover: hover) and (pointer: fine) {
      &:hover {
        color: #FFF;
        background-color: var(--blue);
        border-color: var(--blue);
      }
    }
    &.active {
      color: #FFF;
      background-color: #427be1;
      border-color: #427be1;
    }
  }  
}
#range .range_info {
  border-color: hsla(218, 86%, 75%, 1);
}
#range .range_title {
  color: hsla(218, 82%, 65%, 1);
  border-color: #bbb;
}

/*-- 縣市標題 --*/
#county_form .county_title,
#trader_form .county_title {
  color: #fff;
  background-color: hsla(11, 96%, 70%, 1);
}