:root {
    --bs-body-color:  #333f50; 
    --bs-primary: #333f50; 
    --primary-color: #333f50;     
    --bs-primary-emphasis:#44546A;
    --bs-primary-rgb: 51, 63, 80; 
    --bs-secondary: #A15E49;
    --secondary-color: #A15E49; 
    --bs-secondary-rgb: 161, 94, 73; 
    --bs-light:white;
    --bs-btn-close-color: white;
    --bs-info:#2385bd;
    --bs-info-rgb:35, 133, 189;
    
       
}
.limit-bar {
    width: 20px;
    height: 3px;
    background-color: #FF8C00;
  }
.ban-bar {
    width: 20px;
    height: 3px;
    background-color: #ec3314;
    }
.building-bar {
    width: 20px;
    height: 3px;
    background-color: #000000;
    }
.form-control, .form-select ,.form-label{
    font-weight:bold;border-color:var(--bs-info);border-radius:0}
.h6, h6 {
    font-size: .85rem;
}
.btn{border-radius:0}
.nav-tabs .nav-link{
    background: transparent;
    color:var(--bs-light);
}
.nav-tabs .nav-link.active{
    background: var(--bs-light);
    color:var(--bs-secondary);
}

.bg-primary-emphasis{background-color: var(--bs-primary-emphasis);}

.accordion-header .accordion-button.collapsed {
    color: var(--bs-light);
    background-color: var(--bs-primary-emphasis);}

.accordion-header .accordion-button:not(.collapsed) {
    color: var(--bs-light);
    background-color: var(--bs-secondary);}

    html, body {
        height: 100%;
        margin: 0;
        padding: 0;
    }
    #viewDiv {
        height: 100%;
        width: 100%;
    }
      .action-button {
        font-size: 1rem;
        background-color: #fff;
        border: 1px solid #d3d3d3;
        color: #6e6e6e;
        height: 32px;
        width: 32px;
        text-align: center;
        box-shadow: 0 0 1px rgba(217, 162, 162, 0.3);
        
      }

      .action-button:hover,
      .action-button:focus,.esri-widget--button:hover ,.esri-ui-corner .esri-component:hover{
        background: #0079c1;
        color: #e4e4e4;
      }
    .sidebar {
        /*width: 20%;*/
        flex-shrink: 0;
        padding: 1em;            
        background: #BBA093 url(/static/map/images/bg.svg) no-repeat top -16% right -6%;
        background-size: 200px 200px;
        background-blend-mode: soft-light;
        z-index: 2 ;
        overflow: auto;
        overflow-x: hidden; 
        max-height: 100%;
        box-shadow: 6px 0 9px rgba(0, 0, 0, .2);
    }
    .main-content {
        flex: 1;       
        z-index: 0;
    }
    .esri-attribution {
      display: none;
  }

  /*@media (max-width: 1680px) {
  .sidebar {
    width: 30%;
    flex-shrink: 0;
    padding: 1em;
    overflow: auto;
    overflow-x: hidden; 
    max-height: 100%;
}*/


  @media (max-width: 900px) {
    .responsive-title {
        display: none; /* 在小螢幕上隱藏長標題 */
    }
    .content-wrapper {
      flex-direction: column; /* 小螢幕上改為上下排列 */
  }
  .sidebar {
    width: 95%;        
    height: 100%;
}
#viewDiv {
    height: 100%;
    width: 100%;
}

}

.list-group-item{color:var(--bs-primary);border:0;}
.list-group-item .list-group-item{padding:0.1em}
::marker{color:rgb(214,137,115)}

.form-check-input {
    width: 15px; /* 調整大小 */
    height: 15px;
    border: 2px solid var(--bs-info); /* 自定義邊框顏色 */
    background-color: #ffffff; /* 未選中時的背景色 */
  }

  .form-check-input:checked {
    background-color:  var(--bs-info); /* 勾選時的背景色 */
    border-color:  var(--bs-info); /* 勾選時的邊框顏色 */
    color: var(--bs-light);
  }
  .form-check-input:disabled{
    background: #b1afaf;
    color:#b1afaf;
  }

  /* Webkit 核心瀏覽器 捲軸*/
::-webkit-scrollbar {
    width: 12px;
    height: 12px;
}
::-webkit-scrollbar-track {
    background: #9f8178;
    border-radius: 10px;
}
::-webkit-scrollbar-thumb {
    background: #9f8178;
    border-radius: 10px;
    border: 0;
    box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.3);
}
::-webkit-scrollbar-thumb:hover {
    background: #9f8178;
}

/* Firefox */
* {
    scrollbar-color: #9f8178 transparent;
    scrollbar-width: thin;
}

.alert.alert-info {
    background: #d9e5fa;
    border: 0;
    color: var(--bs-primary);
    box-shadow: 6px 5px 9px #e4e4e4;
    font-size: .88em;
    font-weight: bold;
}

.esri-expand__content-container {
    background: #f8f8f8;
    padding: 1em;
    color: var(--bs-primary);
    box-shadow: -5px 5px 0 rgb(102 102 102 / 30%);
    border: 1px solid #73869f;
    border-radius: .5em;
}

.esri-print__header-title{
    font-size: 1.5em;   
    color: var(--bs-primary);
}

.esri-widget--button:is(calcite-button):not(:hover) {
    --calcite-ui-icon-color: #395f95;
}
