::-webkit-scrollbar {
    width: 20px;
}

::-webkit-scrollbar-track {
    background-color: transparent;
}

::-webkit-scrollbar-thumb {
    background-color: #d6dee1;
    border-radius: 20px;
    border: 6px solid transparent;
    background-clip: content-box;
}

::-webkit-scrollbar-thumb:hover {
    background-color: #a8bbbf;
}

html:focus-within {
    scroll-behavior: smooth;
}

body {
    font-family: "Plus Jakarta Display", sans-serif;
}

header {
    box-shadow: 11.6px 11.6px 2px rgba(0, 0, 0, 0.005),
        26.9px 26.9px 4.6px rgba(0, 0, 0, 0.01),
        48.4px 48.4px 8.3px rgba(0, 0, 0, 0.016),
        80.3px 80.3px 13.8px rgba(0, 0, 0, 0.022),
        132.3px 132.3px 22.8px rgba(0, 0, 0, 0.03),
        231.2px 231.2px 39.8px rgba(0, 0, 0, 0.042),
        500px 500px 86px rgba(0, 0, 0, 0.07);
}

.text-grey {
    color: #808080 !important;
}

.logo-list {
    padding: 20px 0;
    text-align: center;
}
.logo-list img {
    display: inline-block;
    max-width: 85%;
    padding: 15px 0;
    transition: all 0.3s ease-in-out;
    -webkit-filter: grayscale(100);
    -moz-filter: grayscale(100);
    filter: grayscale(100);
}
.logo-list img:hover {
    filter: none;
}

.img-video {
    border-radius: 10px;
}

.shadow-images {
    box-shadow: 0 2px 25px rgba(197, 178, 9, 0.774);
}

.overlay-container {
    position: relative;
}

.container__overlay {
    /* Position */
    left: 0;
    position: absolute;
    top: 0;

    /* Take full size */
    height: 100%;
    width: 100%;

    /* Center the content */
    align-items: center;
    display: flex;
    justify-content: center;
}

.play-button {
    font-size: 48px;
}

.card-borderless-shadow {
    border: none;
    box-shadow: rgba(0, 0, 0, 0.004) 0px 2.3px 1.9px 0px,
        rgba(0, 0, 0, 0.004) 0px 5.4px 4.3px 0px,
        rgba(0, 0, 0, 0.008) 0px 9.7px 7.7px 0px,
        rgba(0, 0, 0, 0.01) 0px 16.1px 12.8px 0px,
        rgba(0, 0, 0, 0.016) 0px 26.5px 21.2px 0px,
        rgba(0, 0, 0, 0.02) 0px 46.2px 37px 0px,
        rgba(0, 0, 0, 0.03) 0px 100px 80px 0px;
}

.background-cta {
    background-image: url("/images/landing-page/cta.png");
    background-position: center;
    background-repeat: no-repeat;
    background-size: 92%;
}

.img-jumbotron {
    width: 100%;
    height: 53vh;
    object-fit: cover;
}

.category-card-description {
    -webkit-line-clamp: 3;
}

.category-card-description-wrapper {
    display: flex;
    align-items: center;
    height: 80px;
}

.dropdown-toggle {
    outline: 0;
}

.nav-flush .nav-link {
    border-radius: 0;
}

.btn-toggle {
    display: inline-flex;
    align-items: center;
    padding: 0.25rem 0.5rem;
    font-weight: 600;
    color: #ffffff;
    background-color: transparent;
    border: 0;
}

.btn-toggle:hover,
.btn-toggle:focus {
    color: #ffffff;
    background-color: #fcca29;
}

.btn-toggle::before {
    width: 1.25em;
    line-height: 0;
    color: #ffffff;
    content: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='rgba(255,255,255, 0.7)' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M5 14l6-6-6-6'/%3e%3c/svg%3e");
    transition: transform 0.35s ease;
    transform-origin: 0.5em 50%;
}

.btn-toggle[aria-expanded="true"] {
    color: rgba(255, 255, 255, 0.85);
}

.btn-toggle[aria-expanded="true"]::before {
    transform: rotate(90deg);
}

.btn-toggle-nav a {
    display: inline-flex;
    padding: 0.1875rem 0.5rem;
    margin-top: 0.125rem;
    margin-left: 1.25rem;
    text-decoration: none;
}

.btn-toggle-nav a:hover,
.btn-toggle-nav a:focus {
    background-color: #c39603;
}

.menu-filter {
    top: 96px;
    max-height: calc(100vh - 8rem);
    overflow-y: auto;
    border-radius: 6px;
    z-index: 9;
}

.card-img-top-landing-page {
    background-position: cover;
    height: 260px;
    object-fit: cover;
}

.card-img-top-category-landing-page {
    background-position: cover;
    height: 240px;
    object-fit: cover;
}

.card-img-top-menus {
    background-position: cover;
    height: 200px;
    object-fit: cover;
}

.register_text_error {
    display: flex;
    justify-content: center;
    align-content: center;
    font-weight: 600;
    font-size: 14px;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    border-radius: 3px;
    padding: 3px 12px;
    background-color: #eb4a4a;
    color: #fefefe;
    margin-top: 8px;
}

footer {
    background-color: #fcca29;
}

/* Custom Utility Styles */

.fs-12 {
    font-size: 12px;
}

.fs-15 {
    font-size: 15px;
}

.fw-500 {
    font-weight: 500;
}

.my-100 {
    margin-top: 100px;
    margin-bottom: 100px;
}

.bg-warning {
    background-color: #fcca29 !important;
}

.text-warning {
    color: #fcca29 !important;
}

.btn-outline-warning {
    border-color: #fcca29 !important;
}

.btn-outline-warning:hover {
    color: white;
}

.no-effect-hover:hover {
    color: #808080 !important;
}

.btn-outline-light:hover {
    color: #fcca29 !important;
    background-color: #fff;
}

.rounded-logo {
    border-radius: 12px;
}

.section-margin {
    margin-top: 7rem !important;
    margin-bottom: 7rem !important;
}
