@charset "UTF-8";
/* ========================================================================
    from B4
 ========================================================================== */
/* label ---> badge */
.btn .label {
  position: relative;
  top: -1px;
}

.btn .label {
  position: relative;
  top: -1px;
}

/* B4 pagination */
.table-footer {
  margin-top: 0.5rem;
}

.pagination > li > a, .pagination > li > span {
  position: relative;
  float: left;
  padding: 8px 14px;
  line-height: 1.42857143;
  text-decoration: none;
  color: #656565;
  background-color: #ffffff;
  border: 1px solid #eeeeee;
  margin-left: -1px;
}
.pagination > li > a:hover, .pagination > li > a:focus, .pagination > li > span:hover, .pagination > li > span:focus {
  color: #00818D;
  background-color: #eeeeee;
  border-color: #eeeeee;
}
.pagination > .active a, .pagination > .active span, .pagination > .active a:hover, .pagination > .active span:hover, .pagination > .active a:focus, .pagination > .active span:focus {
  z-index: 2;
  color: #ffffff;
  background-color: #00818D;
  border-color: #00818D;
  cursor: default;
}
.pagination > .disabled a, .pagination > .disabled span, .pagination > .disabled a:hover, .pagination > .disabled span:hover, .pagination > .disabled a:focus, .pagination > .disabled span:focus {
  color: #e1e1e1;
  background-color: #ffffff;
  border-color: #eeeeee;
  cursor: not-allowed;
}

fieldset {
  display: flex;
  flex-direction: row;
}

/* ========================================================================
    from B5
 ========================================================================== */
/* col-sm-offset-2 ---> col-offset-2 */
.col-sm-offset-2 {
  margin-left: 16.66666667%;
}

/* B5 used .bg-text- */
.bg-primary,
.bg-success,
.bg-info,
.bg-warning,
.bg-danger,
.bg-inverse,
.bg-green,
.bg-pink,
.bg-purple {
  color: #ffffff;
}

/* ========================================================================
    All page
 ========================================================================== */
.panel-body .table-responsive .table {
  /* B5 td border color */
  --bs-table-border-color: #eeeeee;
  border-color: var(--bs-table-border-color) !important;
}
.panel-body .table-responsive .table a {
  color: #00818D;
  text-decoration: none;
}
.panel-body .table-responsive .table a:hover, .panel-body .table-responsive .table a:focus {
  color: #5CAEB7;
  text-decoration: underline;
}
.panel-body .table-responsive .table a:focus {
  outline: thin dotted;
  outline: 5px auto -webkit-focus-ring-color;
  outline-offset: -2px;
}
.panel-body .table-responsive .btn-secondary {
  background-color: #fff !important;
  color: #000 !important;
  padding: 6px 12px !important;
  border-color: #ccc;
}

table {
  /* B5 td border color */
  --bs-table-border-color: #dee2e6;
  border-color: var(--bs-table-border-color) !important;
}

.fixed-table-pagination .btn-secondary {
  background-color: #fff !important;
  color: #000 !important;
  padding: 6px 12px !important;
}

.placeholder {
  color: #919292 !important;
  background-color: #ffffff;
}

/* 1. 移除綠色邊框與打勾圖示 */
.was-validated .form-control:not([readonly]),
.was-validated .form-control:valid:not([readonly]) {
  border-color: #dee2e6 !important;
  background-image: none !important;
  padding-right: 0.75rem !important;
}
.was-validated .form-control:not([readonly]):focus,
.was-validated .form-control:valid:not([readonly]):focus {
  box-shadow: 0 0 0 0.05rem rgba(0, 129, 141, 0.5764705882) !important;
}

.form-group .is-valid:not([readonly]),
.form-group .is-valid:valid:not([readonly]) {
  border-color: #dee2e6 !important;
  background-image: none !important;
  padding-right: 0.75rem !important;
}
.form-group .is-valid:not([readonly]):focus,
.form-group .is-valid:valid:not([readonly]):focus {
  box-shadow: 0 0 0 0.05rem rgba(0, 129, 141, 0.5764705882) !important;
}

.was-validated .form-select:valid {
  border-color: #dee2e6 !important;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e") !important;
}
.was-validated .form-select:valid:focus {
  box-shadow: 0 0 0 0.05rem rgba(0, 129, 141, 0.5764705882) !important;
}

.radio-wrapper input[type=radio],
.radio-wrapper .toggle-available {
  margin: 0.25rem 0;
}

.nav-tabs .nav-item .nav-link {
  font-weight: bolder;
  transition: color 0.2s ease-in;
}
.nav-tabs .nav-item .nav-link em {
  margin-right: 0.3rem;
}
.nav-tabs .nav-link:not(.active) {
  border: none;
}

@media only screen and (min-width: 768px) {
  #mega-menu {
    position: static;
  }
  #mega-menu #new-menu-ul {
    left: 300px;
  }
  #mega-menu #new-menu-ul #mega-menu-body .row {
    overflow: hidden;
    width: -moz-max-content;
    width: max-content;
    max-width: calc(100vw - 310px);
  }
  .aside-toggled #mega-menu {
    position: static;
  }
  .aside-toggled #mega-menu #new-menu-ul {
    left: 70px;
  }
  .aside-toggled #mega-menu #new-menu-ul #mega-menu-body .row {
    overflow: hidden;
    width: -moz-max-content;
    width: max-content;
    max-width: calc(100vw - 80px);
  }
}
/* ========================================================================
    StationStatus
 ========================================================================== */
#station-status .row .row h1 {
  font-size: 2.2rem;
  color: #656565;
}
#station-status .row .row h3 {
  font-size: 1.5rem;
  color: #656565;
  display: flex;
  justify-content: center;
  width: 100%;
}
#station-status .row .row h3 span {
  display: inline-block;
  margin-right: 5px;
}
#station-status .row .row h4 {
  font-size: 1.1rem;
}
#station-status .row .row h1, #station-status .row .row .m0 {
  font-weight: bold;
}
#station-status .row .row p {
  color: #656565;
}
#station-status .row .row #gauge {
  margin: auto;
}
#station-status .row .panel-default .panel-heading {
  color: #919292;
  align-items: center;
}
#station-status .row .panel-default .panel-heading .btn {
  color: #fff;
}
#station-status .row .panel-default .panel-heading .label {
  /* from btn-sm */
  --bs-btn-padding-y: 0.25rem;
  --bs-btn-padding-x: 0.5rem;
  --bs-btn-font-size: 0.875rem;
  --bs-btn-border-radius: 0.2rem;
}

/* ========================================================================
    MachineInfo
 ========================================================================== */
#machine-info .widget span {
  height: 0;
}
#machine-info .table-responsive > .row {
  width: 100%;
}

/* ========================================================================
    Statistics & Report --> Dashboard
 ========================================================================== */
#station-status fieldset {
  /* ChargeBox ID */
}
#station-status fieldset .col-lg-4 {
  display: flex;
  flex-direction: row;
  align-items: center;
}
#station-status fieldset .col-lg-4 .control-label {
  font-weight: bolder;
  padding-right: 0.5rem;
}
#station-status fieldset {
  /* month */
}
#station-status fieldset .col-lg-3 {
  display: flex;
  flex-direction: row;
  align-items: center;
}
#station-status fieldset .col-lg-3 .control-label {
  font-weight: bolder;
  padding-right: 0.5rem;
}
#station-status fieldset .col-lg-3 #yyyy_mm {
  width: 60%;
}
#station-status .isactive {
  margin-top: 1rem;
}
#station-status .isactive .col-lg-12 {
  /* check box */
}
#station-status .isactive .col-lg-12 label {
  padding-bottom: 0.5rem;
  font-weight: bolder;
}

/* ========================================================================
    Statistics & Report --> EnergyDelivered、FaultsAnalysis、ChargingRecords、MachineStatus
 ========================================================================== */
#energy-delivered form,
#faults-analysis form,
#charging-records form {
  margin-bottom: 1rem;
}
#energy-delivered form fieldset .form-group,
#faults-analysis form fieldset .form-group,
#charging-records form fieldset .form-group {
  padding-left: 2.5rem;
  /* b5 row*/
  width: 100%;
  --bs-gutter-x: 1.5rem;
  --bs-gutter-y: 0;
  display: flex;
  flex-wrap: wrap;
}
#energy-delivered form fieldset .form-group .control-label,
#faults-analysis form fieldset .form-group .control-label,
#charging-records form fieldset .form-group .control-label {
  font-weight: bolder;
}
#energy-delivered form fieldset .form-group .radio label,
#faults-analysis form fieldset .form-group .radio label,
#charging-records form fieldset .form-group .radio label {
  margin-bottom: 0.5rem;
}
#energy-delivered form fieldset .form-group .radio label input,
#faults-analysis form fieldset .form-group .radio label input,
#charging-records form fieldset .form-group .radio label input {
  margin-right: 0.25rem;
}
#energy-delivered form fieldset .form-group #customerized,
#faults-analysis form fieldset .form-group #customerized,
#charging-records form fieldset .form-group #customerized {
  padding-left: 1.25rem;
}
#energy-delivered,
#faults-analysis,
#charging-records {
  /* ChargingRecords */
}
#energy-delivered .list-table,
#faults-analysis .list-table,
#charging-records .list-table {
  padding: 0;
}

/* ========================================================================
    EVSE Control ---> ChargingProfile
 ========================================================================== */
#load-management .btn-primary a {
  color: #fff;
}
#load-management #tableData2 .ms-options-wrap {
  position: relative;
}
#load-management #tableData2 .ms-options-wrap .ms-options {
  min-width: 120%;
}

/* ========================================================================
    EVSE Control ---> ChargingProfile ---> ChargingProfileEdit
 ========================================================================== */
#station-edit fieldset .form-group {
  /* b5 row*/
  width: 100%;
  --bs-gutter-x: 1.5rem;
  --bs-gutter-y: 0;
  display: flex;
  flex-wrap: wrap;
}
#station-edit fieldset .form-group .control-label,
#station-edit fieldset .form-group .custom-control {
  font-weight: bolder;
  padding: 0.5rem;
}
#station-edit fieldset .form-group .chargingSchedules {
  width: 100%;
}
#station-edit fieldset .form-group .chargingSchedules .form-group div:not(:last-child) {
  padding-right: 0.5rem;
}

/* ========================================================================
    EVSE Control ---> UserAuthentication
 ========================================================================== */
#user-authentication .btn-primary a {
  color: #fff;
}
#user-authentication #tableData2 select {
  width: auto;
}

/* ========================================================================
    EVSE Control ---> UserAuthentication ---> LocalListEdit
 ========================================================================== */
#locallist-edit .panel .panel-body fieldset .form-group {
  width: 100%;
}
#locallist-edit .panel .panel-body .chargingSchedules {
  width: 100%;
  margin-left: 0.5rem;
}
#locallist-edit .panel .panel-body .chargingSchedules .DomRow {
  --bs-gutter-x: 1.5rem;
  --bs-gutter-y: 0;
  display: flex;
  flex-wrap: wrap;
  margin-top: calc(-1 * var(--bs-gutter-y));
  margin-right: calc(-0.5 * var(--bs-gutter-x));
  margin-left: calc(-0.5 * var(--bs-gutter-x));
  margin-bottom: 0.5rem;
}
#locallist-edit .panel .panel-body .chargingSchedules .DomRow input {
  width: 100%;
}

/* ========================================================================
    Diagnosis & Maintenance --> MaintenanceEvents
 ========================================================================== */
#maintenance-events #Maintenance .panel-heading > div {
  display: inline-flex !important;
  align-items: stretch !important;
  gap: 5px;
}
#maintenance-events #fancybox-container-2 #status_filter1 .form-label {
  font-weight: bolder;
}

/* ========================================================================
    Diagnosis & Maintenance --> Firmware Update
 ========================================================================== */
#firmware-update #tabpanel1 .panel-default > .panel-body .form-check {
  display: flex;
  margin-bottom: 0.5rem;
}
#firmware-update #tabpanel1 .panel-default > .panel-body .form-check .form-check-input {
  margin-right: 0.5rem;
}
#firmware-update #tabpanel1 .panel-default > .panel-body .form-check #flexRadioDefault2 {
  margin-left: 0.8rem;
}
#firmware-update #tabpanel1 .panel-default > .panel-body .form-group #fileUrl {
  width: calc(100% - 77px) !important;
}
#firmware-update #tabpanel1 .panel-default > .panel-default {
  border: 0px;
  background-color: #F8F9FA;
}
#firmware-update #tabpanel1 .panel-default > .panel-default #filter {
  float: right;
  margin-right: 1rem;
}
#firmware-update #tabpanel1 .panel-default > .panel-default .table-responsive th:first-child span,
#firmware-update #tabpanel1 .panel-default > .panel-default .table-responsive td:first-child span {
  margin: auto;
}

/* ========================================================================
    Diagnosis & Maintenance --> LogsData
 ========================================================================== */
#logs-data .Zebra_DatePicker_Icon_Wrapper {
  width: auto !important;
}
#logs-data #tabpanel1 .panel {
  margin-bottom: 1rem;
}

/* ========================================================================
    Diagnosis & Maintenance --> DataTransfer
 ========================================================================== */
#data-transfer .tab-content .panel {
  margin-bottom: 1rem;
}
#data-transfer .tab-content .panel .panel-body .form-group label {
  font-weight: bolder;
  margin-bottom: 0.3rem;
}
#data-transfer .tab-content #CMModed7 .form-group hr {
  border-top-color: #656565;
}
#data-transfer .tab-content #CMModed7 .form-group .col-md-12 {
  margin-bottom: 1rem;
}

/* ========================================================================
    Diagnosis & Maintenance --> ChangeConfiguration
 ========================================================================== */
#change-configuration #CMModed2 > .panel {
  margin-bottom: 1rem;
}
#change-configuration #CMModed2 .panel-heading {
  border: 0;
  background-color: rgba(255, 255, 255, 0);
}
#change-configuration #CMModed2 .form-group .container-fluid .row label {
  font-weight: bolder;
}
#change-configuration #CMModed2 div:has(> #refresh1) {
  display: inline-flex !important;
  gap: 5px;
  padding-bottom: 4px;
}
#change-configuration #CMModed2 #refresh1 {
  height: 2rem;
  width: 2rem;
  display: inline-flex;
  justify-content: center;
  align-items: center;
}
#change-configuration #CMModed2 .label-zoff {
  height: 2rem;
}
#change-configuration #CMModed2 .bootstrap-table th:first-child span,
#change-configuration #CMModed2 .bootstrap-table td:first-child span {
  margin: auto;
}

/* ========================================================================
    System --> StationList
 ========================================================================== */
#station-list .btn-primary:first-of-type {
  margin-left: 0.75rem;
}
#station-list .btn-primary:not(:first-of-type) {
  margin-left: 0.2rem;
}
#station-list .btn-primary {
  margin-bottom: 0.9rem;
}
#station-list .btn-primary a {
  color: #fff;
}
#station-list .row .panel-body #button2 {
  background-color: #fff;
  margin-bottom: 0.9rem;
}

#station-edit .panel .panel-body fieldset #BillingMethodDiv fieldset {
  width: 100%;
}

/* ========================================================================
    System --> MachineList
 ========================================================================== */
#machine-list .btn-primary:first-of-type {
  margin-left: 0.75rem;
}
#machine-list .btn-primary:not(:first-of-type) {
  margin-left: 0.2rem;
}
#machine-list .btn-primary {
  margin-bottom: 0.9rem;
}
#machine-list .btn-primary a {
  color: #fff;
}
#machine-list #mytab tbody tr td hr {
  margin: 0.5rem 0;
}

/* ========================================================================
    System --> MachineList --> MachineEdit
 ========================================================================== */
#machine-edit .panel {
  margin-bottom: 1rem;
}
#machine-edit .panel .panel-body fieldset > .form-group {
  width: 100%;
}
#machine-edit .panel .panel-body fieldset > .form-group .custom-control-label,
#machine-edit .panel .panel-body fieldset > .form-group .control-label {
  font-weight: 500;
}

/* ========================================================================
    System --> RoleList
 ========================================================================== */
#role-list .btn-primary:first-of-type {
  margin-left: 0.75rem;
}
#role-list .btn-primary:not(:first-of-type) {
  margin-left: 0.2rem;
}
#role-list .btn-primary {
  margin-bottom: 0.9rem;
}
#role-list .btn-primary a {
  color: #fff;
}

/* ========================================================================
    System --> RoleList --> RoleEdit
 ========================================================================== */
#login .panel-default .panel-body fieldset .form-group {
  /* b5 row*/
  width: 100%;
  --bs-gutter-x: 1.5rem;
  --bs-gutter-y: 0;
  display: flex;
  flex-wrap: wrap;
}
#login .panel-default .panel-body fieldset .form-group .control-label,
#login .panel-default .panel-body fieldset .form-group .custom-control {
  font-weight: bolder;
  padding: 0.5rem;
}
#login .panel-default .panel-body fieldset .form-group .list-group-item {
  border: 1px solid #dee2e6;
}

/* ========================================================================
    System --> CustomerList
 ========================================================================== */
#customer-list .btn-primary:first-of-type {
  margin-left: 0.75rem;
}
#customer-list .btn-primary:not(:first-of-type) {
  margin-left: 0.2rem;
}
#customer-list .btn-primary {
  margin-bottom: 0.9rem;
}
#customer-list .btn-primary a {
  color: #fff;
}

/* ========================================================================
    System --> CustomerList --> CustomerEdit
 ========================================================================== */
#customer-edit fieldset .form-group {
  /* b5 row*/
  width: 100%;
  --bs-gutter-x: 1.5rem;
  --bs-gutter-y: 0;
  display: flex;
  flex-wrap: wrap;
}
#customer-edit fieldset .form-group .control-label,
#customer-edit fieldset .form-group .custom-control {
  font-weight: bolder;
  padding: 0.5rem;
}
#customer-edit fieldset .form-group .list-group-item {
  border: 1px solid #dee2e6;
}
#customer-edit fieldset .form-group #id2[readonly] {
  background-color: #f8f9fa;
  cursor: not-allowed;
  border-color: #dee2e6;
  box-shadow: none;
}

/* ========================================================================
    System --> AccountList
 ========================================================================== */
#account-list .btn-primary:first-of-type {
  margin-left: 0.75rem;
}
#account-list .btn-primary:not(:first-of-type) {
  margin-left: 0.2rem;
}
#account-list .btn-primary {
  margin-bottom: 0.9rem;
}
#account-list .btn-primary a {
  color: #fff;
}

/* ========================================================================
    System --> AccountList --> AccountEdit
 ========================================================================== */
#account-edit fieldset .form-group {
  /* b5 row*/
  width: 100%;
  --bs-gutter-x: 1.5rem;
  --bs-gutter-y: 0;
  display: flex;
  flex-wrap: wrap;
}
#account-edit fieldset .form-group .control-label {
  font-weight: bolder;
  padding: 0.5rem;
}

/* ========================================================================
    System --> FirmwareOptions
 ========================================================================== */
#station-list #button2 {
  margin-bottom: 0.9rem;
}

/* ========================================================================
    Utility --> WhereIsCharger
 ========================================================================== */
/* ========================================================================
    System --> FirmwareList
 ========================================================================== */
#firmware-list .btn-primary:first-of-type {
  margin-left: 0.75rem;
}
#firmware-list .btn-primary:not(:first-of-type) {
  margin-left: 0.2rem;
}
#firmware-list .btn-primary {
  margin-bottom: 0.9rem;
}
#firmware-list .btn-primary a {
  color: #fff;
}
#firmware-list #tableData1 #tbody1 .btn {
  width: -moz-max-content;
  width: max-content;
}

/* ========================================================================
    Utility --> AlarmNotificationList
 ========================================================================== */
#alarmnotification-list .btn-primary:first-of-type {
  margin-left: 0.75rem;
}
#alarmnotification-list .btn-primary:not(:first-of-type) {
  margin-left: 0.2rem;
}
#alarmnotification-list .btn-primary {
  margin-bottom: 0.9rem;
}
#alarmnotification-list .btn-primary a {
  color: #fff;
}

/* ========================================================================
    Utility --> AlarmNotificationList --> AlarmNotificationEdit
 ========================================================================== */
#login #registrationForm fieldset .SumoUnder {
  position: absolute !important;
  top: 0;
  left: 0;
  width: 1px !important;
  height: 1px !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* ========================================================================
    LocalListImport
 ========================================================================== */
#locallist-import fieldset .col-lg-12.panel-body .col-lg-10 {
  margin-bottom: 0.5rem;
}
#locallist-import fieldset .col-lg-12.panel-body .col-lg-10 .control-label {
  font-weight: 500;
}
#locallist-import fieldset .col-lg-12.panel-body .col-lg-2 {
  margin-bottom: 0.5rem;
}
#locallist-import fieldset .form-group .control-label {
  font-weight: 500;
}
#locallist-import fieldset .form-group #CustomerId {
  width: auto;
}

/* ========================================================================
    MachineImport
 ========================================================================== */
#machine-import fieldset .col-lg-12.panel-body .col-lg-10 {
  margin-bottom: 0.5rem;
}
#machine-import fieldset .col-lg-12.panel-body .col-lg-10 .control-label {
  font-weight: 500;
}
#machine-import fieldset .col-lg-12.panel-body .col-lg-2 {
  margin-bottom: 0.5rem;
}
#machine-import fieldset .form-group .control-label {
  font-weight: 500;
}
#machine-import fieldset .form-group .col-sm-10 .chosen-container {
  min-width: 30%;
}
#machine-import fieldset .form-group .col-sm-4 label:nth-of-type(1) {
  margin-right: 0.5rem;
}
#machine-import fieldset .form-group .col-sm-4 label:nth-of-type(2) input:nth-of-type(2) {
  pointer-events: none;
  background-color: #f5f5f5;
  color: #a0a0a0;
  opacity: 1;
  border-radius: 0.375rem;
  border: 1px solid #e0e0e0;
  padding: 0.3rem;
}
#machine-import fieldset .form-group .col-sm-4 label:nth-of-type(2) #Type2:checked ~ #verdor {
  pointer-events: auto; /* 恢復可點擊輸入 */
  background-color: #ffffff; /* 白底 */
  color: #333333; /* 正常文字 */
  opacity: 1; /* 恢復透明度 */
}

#kvFileinputModal .btn-kv {
  width: 27.1px;
  height: 27.1px;
}/*# sourceMappingURL=B4toB5.css.map */