html {
    overflow-x: hidden;
}

body {
    overflow-x: hidden;
}

img,
svg,
canvas,
video {
    max-width: 100%;
}

main.container,
main.container-fluid {
    min-width: 0;
}

.table-responsive {
    -webkit-overflow-scrolling: touch;
}

.table-responsive > .table {
    min-width: 42rem;
}

.table td,
.table th {
    vertical-align: middle;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.text-truncate {
    max-width: 100%;
}

.d-flex.gap-2,
.d-flex.gap-3 {
    min-width: 0;
}

.btn,
.nav-link,
.badge,
summary {
    overflow-wrap: anywhere;
}

.app-nav {
    display: grid;
    grid-template-columns: auto minmax(18rem, 30rem) 1fr auto;
    align-items: center;
    column-gap: 1rem;
    row-gap: .75rem;
    width: 100%;
}

.app-search {
    grid-column: 2;
    justify-self: center;
    width: 100%;
    max-width: 30rem;
}

.app-menu {
    grid-column: 3;
    justify-self: end;
    min-width: 0;
}

.app-logout {
    grid-column: 4;
    justify-self: end;
}

.nav-dropdown {
    position: relative;
    font: inherit;
}

.nav-dropdown > summary {
    list-style: none;
    cursor: pointer;
    border-radius: .375rem;
    color: #212529;
    padding: .25rem .5rem;
    font: inherit;
    line-height: 1.5;
}

.nav-dropdown > summary::marker,
.nav-dropdown > summary::-webkit-details-marker {
    display: none;
    content: "";
}

.nav-dropdown[open] > summary,
.nav-dropdown > summary.active,
.app-menu .nav-link.active {
    background: #e9ecef;
    color: #000;
    font-weight: 600;
}

.nav-dropdown-menu {
    right: 0;
    min-width: 11rem;
    max-width: min(20rem, calc(100vw - 2rem));
}

.app-menu .nav-link,
.nav-dropdown-menu .nav-link {
    color: #212529;
    font: inherit;
    line-height: 1.5;
    border-radius: .25rem;
    padding: .25rem .5rem;
}

.nav-dropdown-menu .nav-link:hover,
.nav-dropdown-menu .nav-link.active {
    background: #f1f3f5;
}

.app-footer {
    margin-top: auto !important;
}

.cookie-notice {
    position: fixed;
    right: 1rem;
    bottom: 1rem;
    z-index: 1030;
    width: min(32rem, calc(100vw - 2rem));
}

.pricing-country-form {
    width: min(100%, 28rem);
}

.pricing-plan-action-cell {
    min-width: 9rem;
}

.admin-user-role-form {
    width: min(100%, 14rem);
}

.admin-pricing-currency {
    max-width: 5rem;
}

.admin-pricing-amount {
    max-width: 8rem;
}

@media (max-width: 991.98px) {
    .app-nav {
        grid-template-columns: 1fr;
    }

    .app-search,
    .app-menu,
    .app-logout {
        grid-column: auto;
        justify-self: stretch;
    }

    .app-menu {
        justify-content: flex-start;
    }

    .nav-dropdown-menu {
        left: 0;
        right: auto;
    }
}

@media (max-width: 575.98px) {
    main.container,
    .navbar.container {
        padding-left: .75rem;
        padding-right: .75rem;
    }

    main.container {
        padding-top: 1rem !important;
        padding-bottom: 1rem !important;
    }

    .bg-white.border.rounded.p-4 {
        padding: 1rem !important;
    }

    .d-flex.gap-2,
    .d-flex.gap-3,
    .btn-group {
        flex-wrap: wrap;
    }

    .btn-group {
        display: flex;
        width: 100%;
    }

    .btn-group > .btn {
        flex: 1 1 auto;
    }

    .btn.text-nowrap,
    .nav-link.text-nowrap,
    summary.text-nowrap,
    span.btn.text-nowrap {
        white-space: normal !important;
    }

    .app-menu {
        gap: .35rem !important;
    }

    .app-menu > .nav-link,
    .app-menu > .btn,
    .app-menu > .nav-dropdown {
        flex: 1 1 100%;
    }

    .nav-dropdown-menu {
        position: static !important;
        width: 100%;
        max-width: none;
        margin-top: .25rem;
        box-shadow: none !important;
    }

    .table-responsive > .table {
        min-width: 36rem;
    }

    .table-responsive > .table.table-mobile-stack {
        min-width: 100%;
    }

    .table-mobile-stack thead {
        display: none;
    }

    .table-mobile-stack tbody,
    .table-mobile-stack tr,
    .table-mobile-stack td {
        display: block;
        width: 100%;
    }

    .table-mobile-stack tr {
        border-bottom: 1px solid #dee2e6;
        padding: .85rem;
    }

    .table-mobile-stack tr:last-child {
        border-bottom: 0;
    }

    .table-mobile-stack td {
        border: 0;
        padding: .35rem 0;
        text-align: left !important;
    }

    .table-mobile-stack td::before {
        content: attr(data-label);
        display: block;
        margin-bottom: .1rem;
        color: #6c757d;
        font-size: .75rem;
        font-weight: 600;
    }

    .table-mobile-stack td[data-label=""]::before {
        content: none;
    }

    .table-mobile-stack .d-inline-flex {
        justify-content: flex-start !important;
    }

    .admin-user-role-form {
        width: 100%;
    }

    .cookie-notice {
        right: .75rem;
        bottom: .75rem;
        width: calc(100vw - 1.5rem);
    }
}
