@font-face {
    font-family: 'NotoSansThaiLooped Regular';
    font-style: normal;
    /* See note below */
    src: url(../fonts/NotoSansThaiLooped/NotoSansThaiLooped-Regular.ttf) format('woff2');
}

body {
    font-family: 'NotoSansThaiLooped Regular' !important;
}

h6 {
    font-family: 'NotoSansThaiLooped Regular' !important;
}

h5 {
    font-family: 'NotoSansThaiLooped Regular' !important;
}

p {
    font-family: 'NotoSansThaiLooped Regular' !important;
}


span {
    font-family: 'NotoSansThaiLooped Regular' !important;
}

label {
    font-family: 'NotoSansThaiLooped Regular' !important;
    font-weight: 100 !important;
}

.choices .choices__inner {
    font-family: 'NotoSansThaiLooped Regular' !important;
    font-size: 12.8px !important;
}

.choices .choices__list {
    font-family: 'NotoSansThaiLooped Regular' !important;
    font-size: 12.8px !important;
}

.form-control {
    font-family: 'NotoSansThaiLooped Regular' !important;
    font-weight: 100 !important;
}

.form-select {
    font-family: 'NotoSansThaiLooped Regular' !important;
    font-weight: 100 !important;
}

.choices .choices__input--cloned {
    font-family: 'NotoSansThaiLooped Regular' !important;
    font-weight: 100 !important;
}

/* การตั้งค่าเริ่มต้นสำหรับ .nav-item */
.nav-item.custom {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

/* การตั้งค่าเริ่มต้นสำหรับ .nav-link */
.nav-item.custom .nav-link {
    text-decoration: none;
    color: inherit;
    display: flex;
    align-items: center;
}

/* ซ่อนจุดไข่ปลาและไอคอน + เริ่มต้น */
.nav-item.custom .hover-icons {
    /* position: absolute;
     right: 0; */
    display: none;
}

/* แสดงจุดไข่ปลาและไอคอน + เมื่อเอาเมาส์ไปวาง */
.nav-item.custom:hover .hover-icons {
    display: inline-block;
}

.text-todo-dark {
    --phoenix-text-opacity: 1;
    color: #f7ca21 !important;
}

.w-120px {
    width: 120px;
}

.btn-sm,
.btn-group-sm>.btn,
.mapbox-container .mapbox-control-btn .btn-group-sm>.zoomIn,
.mapbox-container .mapbox-control-btn .btn-group-sm>.zoomOut,
.mapbox-container .mapbox-control-btn .btn-group-sm>.fullScreen,
.google-map-control-btn .btn-group-sm>.zoomIn,
.google-map-control-btn .btn-group-sm>.zoomOut,
.tox .tox-dialog__footer .btn-group-sm>.tox-button:last-child,
.tox .tox-dialog__footer .btn-group-sm>.tox-button--secondary,
.tox .btn-group-sm>.tox-button-secondary,
.tox .btn-group-sm>.tox-button,
[data-list] .btn-group-sm>.page,
.table-list .btn-group-sm>.page {
    --phoenix-btn-padding-y: 0.2rem;
    --phoenix-btn-padding-x: 0.2rem;
    --phoenix-btn-font-size: 0.6rem;
    --phoenix-btn-border-radius: 0.375rem;
}

.dropzone {
    min-height: 0px !important;
}

.dropzone .dz-message {
    text-align: center;
    margin: 0em 0 !important;
}

.dropdown-menu {
    --phoenix-dropdown-min-width: 14rem !important;
}

.urgent {
    color: red;
}

.high {
    color: rgb(255, 98, 31);
}

.normal {
    color: rgb(57, 106, 255);
}

.low {
    color: rgb(46, 169, 15);
}

.list-group-flush>.list-group-item {
    border: 0 0 var(--phoenix-list-group-border-width);
    font-size: 13px;
    border-radius: 5px;
}

.list-group-item-action:hover,
.list-group-item-action:focus {
    background-color: #f5f7fa !important;
}

.btn-icon {
    height: 1.5rem;
    width: 1.5rem;
    padding: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.font-14 {
    font-size: 14px !important;
}

.hover-actions-trigger:hover {
    background: #f5f7fa;
    border-radius: 5px;
}

.dropzone.dropzone-multiple .dz-message {
    padding: 2rem 2rem;
    border: 1px dashed var(--phoenix-border-color);
    border-radius: .5rem;
}

.modal-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: var(--phoenix-modal-header-padding);
    border-bottom: 0px;
    border-top-left-radius: var(--phoenix-modal-inner-border-radius);
    border-top-right-radius: var(--phoenix-modal-inner-border-radius);
}

.btn-phoenix-secondary,
.mapbox-container .mapbox-control-btn .zoomIn,
.mapbox-container .mapbox-control-btn .zoomOut,
.mapbox-container .mapbox-control-btn .fullScreen,
.google-map-control-btn .zoomIn,
.google-map-control-btn .zoomOut,
.tox .tox-dialog__footer .tox-button--secondary,
.tox .tox-button-secondary {
    --phoenix-btn-color: #31374a;
    --phoenix-btn-bg: #f5f7fa;
    --phoenix-btn-border-color: #e3e6ed;
    --phoenix-btn-hover-color: var(--phoenix-secondary-dark);
    --phoenix-btn-hover-bg: #e3e6ed;
    --phoenix-btn-hover-border-color: #e6e9ef;
    --phoenix-btn-focus-shadow-rgb: 200, 204, 213;
    --phoenix-btn-active-color: #31374a;
    --phoenix-btn-active-bg: #e3e6ed;
    --phoenix-btn-active-border-color: #e6e9ef;
    --phoenix-btn-active-shadow: initial;
    --phoenix-btn-disabled-color: #000000;
    --phoenix-btn-disabled-bg: #f5f7fa;
    --phoenix-btn-disabled-border-color: #e3e6ed;
}

.btn-nobg {
    --phoenix-btn-color: #31374a;
    --phoenix-btn-hover-bg: #e3e6ed;
    font-size: 12px;
}

.nav2 {
    height: 50px;
    align-content: center;
}

.text-red {
    color: red;
}

.text-stone-400 {
    color: rgb(168 162 158);
}