:root {
    font-size: 14px;
}

/*.form-control:focus,*/
/*.custom-select:focus,*/
/*.custom-file-input:focus~.custom-file-label,*/
/*.select2-container--bootstrap4.select2-container--focus .select2-selection {*/
/*    border-color: var(--blue);*/
/*}*/

/*.select2-container--bootstrap4.select2-container--focus .select2-selection {*/
/*    box-shadow: none;*/
/*}*/

/*.form-group.is-invalid .form-control,*/
/*.form-group.is-invalid .custom-select,*/
/*.form-group.is-invalid .custom-file-label,*/
/*.form-group.is-invalid .select2-container--bootstrap4 .select2-selection {*/
/*    border-color: var(--red);*/
/*}*/

/*.form-group.is-invalid .invalid-feedback {*/
/*    display: block;*/
/*}*/

/**
 * For AdminLTE Sidebar
 */
.nav-sidebar .nav-item>.nav-link {
    padding: .75rem 1rem;
}
.nav-sidebar .nav-item>.nav-link .right {
    top: 1rem;
}

/**
 * For AdminLTE content header
 */
.content-header h1 {
    font-size: 1.4rem;
}

/**
 * For AdminLTE nav-tabs of card
 */
.card.card-outline-tabs .card-header a {
    color: var(--dark);
}
.card.card-outline-tabs .card-header a.active:hover {
    border-top-color: var(--blue);
    cursor: default;
}
.card.card-outline-tabs .card-header a:not(.active):hover {
    border-color: transparent;
    color: #999;
    cursor: pointer;
}

/**
 * Form
 */
.form-asterisk label.required:after {
    color: var(--red);
    content: '*';
    margin-left: .25rem;
}

.form-group .invalid-feedback {
    font-size: .85rem;
    margin-top: .5rem;
    padding-left: 1.6rem;
}
.form-group .invalid-feedback+.invalid-feedback {
    margin-top: 0;
}
.form-group .invalid-feedback:not(:last-child) {
    margin-bottom: 0;
}

.form-errors ul {
    margin-bottom: 0;
    padding-left: 1.8rem;
}

/**
 * Select2
 */
.select2-container--bootstrap4.select2-container--focus .select2-selection {
    /* 使select2與AdminLTE inputs的樣式一致 */
    border-color: #99c5de;
    -webkit-box-shadow: none;
    box-shadow: none;
}
.select2-container--bootstrap4.select2-container--focus.select2-container--open .select2-selection {
    /* 避免select2-selection在關閉時，border-bottom出現明顯黑線 */
    border-bottom: 1px solid #ced4da;
}
.select2-container--bootstrap4 .select2-results__option[aria-disabled=true] {
    color: #ccc;
}

/**
 * DateTimePicker
 */
.input-group>.bootstrap-datetimepicker-widget+.form-control,
.input-group>.bootstrap-datetimepicker-widget+.custom-select,
.input-group>.bootstrap-datetimepicker-widget+.custom-file {
    margin-left: -1px;
}

/**
 * Material Form
 */
.form-material .custom-select,
.form-material .form-control,
.form-material .input-group-text,
.form-material .select2-container--bootstrap4 .select2-selection {
    border-top: 0;
    border-right: 0;
    border-left: 0;
    border-radius: 0;
}
.form-material .input-group-text {
    background-color: transparent;
}
.form-material .is-invalid .input-group-text {
    border-color: var(--red);
}

/**
 * Flat Form
 */
.form-flat .custom-select,
.form-flat .form-control,
.form-flat .input-group-text,
.form-flat .select2-container--bootstrap4 .select2-selection {
    border-radius: 0;
}

/**
 * Table
 */
.table {
    width: 100% !important;
}
.table>thead>tr>th,
.table>thead>tr>td,
.table>tbody>tr>th,
.table>tbody>tr>td,
.table>tfoot>tr>th,
.table>tfoot>tr>td {
    vertical-align: middle;
}
.table th.wrap-content,
.table td.wrap-content {
    width: 1%;
    white-space: nowrap;
}
.table-striped tbody tr:nth-of-type(odd) {
    background-color: #f9f9f9;
}
.table-hover tbody tr:hover {
    background-color: #f0f0f0;
}

/**
 * Custom responsive table scrollbar
 */
.table-responsive::-webkit-scrollbar {
    -webkit-appearance: none;
}
.table-responsive::-webkit-scrollbar:horizontal {
    height: 15px;
}
.table-responsive::-webkit-scrollbar-thumb {
    background-color: rgba(0, 0, 0, .1);
    border: 5px solid #fff;
    border-radius: 15px;
}
.table-responsive::-webkit-scrollbar-thumb:hover {
    background-color: rgba(0, 0, 0, .25);
}

/**
 * For DataTable DOM
 */
table.dataTable {
    margin-top: 0 !important;
}
div.dataTables_wrapper div.dataTables_length label,
div.dataTables_wrapper div.dataTables_filter label {
    margin-bottom: 0;
}
div.dataTables_wrapper div.dataTables_length select {
    width: 5.5rem;
}
div.dataTables_wrapper div.dataTables_info {
    padding-top: 0;
}
@media screen and (max-width: 767px) {
    div.dataTables_wrapper div.dataTables_info {
        margin-bottom: .5rem;
    }
}
/**
 * For DataTable merging header cells
 */

/**
 * For DataTable Sorting (with Font Awesome 5)
 */
/*
table.dataTable>thead .sorting:before,
table.dataTable>thead .sorting_asc:before,
table.dataTable>thead .sorting_desc:before,
table.dataTable>thead .sorting_asc_disabled:before,
table.dataTable>thead .sorting_desc_disabled:before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f0dd";
    right: .5em;
    bottom: .65em;
}

table.dataTable>thead .sorting:after,
table.dataTable>thead .sorting_asc:after,
table.dataTable>thead .sorting_desc:after,
table.dataTable>thead .sorting_asc_disabled:after,
table.dataTable>thead .sorting_desc_disabled:after {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f0de";
    right: .5em;
    bottom: .75em;
}
*/

/**
 * Utilities
 */
.overflow-visible { overflow: visible !important; }
.text-shadow      { text-shadow: 1px 1px 3px rgba(0 0 0 / 15%) !important; }
.text-shadow-none { text-shadow: none !important; }

/**
 * Others
 */
.task-progress {
    background-color: #f5f5f5;
    border-radius: .15rem;
    -webkit-box-shadow: inset 0 1px 2px rgb(0 0 0 / 12.5%);
    box-shadow: inset 0 1px 2px rgb(0 0 0 / 12.5%);
    height: 20px;
    min-width: 160px;
}
.custom-img {
    max-width: 100%;
    max-height: 100%;
    padding: 0px;
}

/* ESG專用區 */
.btn {
	width: 120px;
	font-size: 16px;
}

.btn-primary:hover {
    background-color: green;
    color: white;
    border-color: #66cc99; /* 添加此行來設置邊框顏色與背景顏色相匹配 */	
	width: 120px;
	font-size: 16px;
}

.data-row.highlighted {
    background-color: lightgreen!important; /* 反白颜色 */
}

.nav-item > .nav-link.active {
    background-color: #66cc99!important; /* 設置背景顏色為綠色 */
    color: white!important; /* 設置文字顏色為白色 */
    border-color: #66cc99!important; /* 添加此行來設置邊框顏色與背景顏色相匹配 */	
	
}