html {
    font-size: 14px;
}

@media (min-width: 768px) {
    html {
        font-size: 16px;
    }
}

.btn:focus,
.btn:active:focus,
.btn-link.nav-link:focus,
.form-control:focus,
.form-check-input:focus {
    box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
    position: relative;
    min-height: 100%;
    font-family: "Inter", "Segoe UI", Roboto, Arial, sans-serif;
}

body {
    margin-bottom: 60px;
    font-family: "Inter", "Segoe UI", Roboto, Arial, sans-serif;
    color: #1f2937;
}

body,
button,
input,
select,
textarea,
.btn,
.form-control,
.form-select,
.dropdown-menu,
.nav-link,
.navbar,
.table,
.badge,
.pagination,
.modal-title,
.card,
h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: "Inter", "Segoe UI", Roboto, Arial, sans-serif;
}

h1,
h2,
h3,
h4,
h5,
h6,
.btn,
.navbar-brand,
.dropdown-item,
.form-label,
th {
    letter-spacing: 0;
}

@keyframes ldio-yzaezf3dcmj {
    0% {
        transform: rotate(0);
    }

    100% {
        transform: rotate(360deg);
    }
}

.loading-container {
    display: none; /* Ẩn mặc định */
    position: fixed !important;
    top: 0 !important;
    left: 0 !important; /* Thay thế start-0 bằng left-0 */
    width: 100% !important;
    height: 100% !important;
    background-color: rgba(255, 255, 255, 0.8) !important;
    display: flex; /* Sử dụng flexbox */
    justify-content: center !important; /* Canh giữa theo chiều ngang */
    align-items: center !important; /* Canh giữa theo chiều dọc */
    z-index:999;
}

    .loading-container.show {
        display: flex; /* Hiển thị khi có lớp show */
    }

.loader {
    width: 48px;
    height: 48px;
    border: 3px solid #FFF;
    border-radius: 50%;
    display: inline-block;
    position: relative;
    box-sizing: border-box;
    animation: rotation 1s linear infinite;
    z-index: 999;
}

    .loader::after {
        content: '';
        box-sizing: border-box;
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        width: 56px;
        height: 56px;
        border-radius: 50%;
        border: 3px solid;
        border-color: #FF3D00 transparent;
        z-index: 999;
    }

@keyframes rotation {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

.text-truncate-2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}