.header-container {
    min-width: auto;
}

/*
 * Config pages (vip/family, mov, etc.) usam height: -webkit-fill-available no prepend.
 * No Safari iOS isso estoura a altura. Este ficheiro só carrega em max-width: 992px (layout.ejs).
 * Especificidade alta para ganhar a estilos inline das páginas .config-page-container.
 */
.config-page-container .input-group-prepend,
.config-page-container section.input-group-prepend,
.family-page .input-group-prepend,
.family-page section.input-group-prepend {
    height: auto !important;
    max-height: none !important;
    min-height: 42px;
    align-self: center;
    display: flex;
    align-items: center;
}

.config-page-container .input-group-prepend .input-group-text,
.config-page-container section.input-group-prepend .input-group-text,
.family-page .input-group-prepend .input-group-text,
.family-page section.input-group-prepend .input-group-text {
    min-height: 0;
    height: auto;
}

/* Regras aplicadas apenas em telas menores que 520px estão em responsive.css */
/* Manter estas regras básicas para mobile geral */
.nav-item .nav-link:not(.selected) .menu-title {
    display: none;
}

.nav-item .nav-link.selected {
    display: flex;
}

.nav-item .nav-link.selected .menu-title {
    display: block;
}

.menu-top-bar {
    justify-content: space-between !important;
    width: 100%;
    gap: 4px;
}

.menu-top-bar > li {
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: center;
}

.menu-top-bar > li .nav-link {
    padding: 10px 12px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
}

.menu-top-bar .nav-item.selected .nav-link {
    padding: 10px 12px;
}

.nav-item.selected:has(> .selected) {
    height: 46px;
    margin-bottom: -8px;
}

.header-container.down {
    margin-top: 10px;
}

.content-home {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    max-width: 100%;
    margin: 40px auto 60px;
    padding: 0 15px;
}

.content-home .content-left,
.content-home .content-right {
    width: 100%;
    margin: 0;
    text-align: center;
}

.content-center {
    margin: 0 auto;
    width: 90%;
    max-width: 100%;
    text-align: center;
    padding: 0 10px;
}

.content-center h1 {
    font-size: 28px !important;
    line-height: 1.4;
    margin-bottom: 15px;
}

.content-center p {
    font-size: 14px !important;
    line-height: 1.6;
    margin-bottom: 20px;
}

.content-center .buttons {
    display: flex;
    flex-direction: column;
    gap: 15px;
    align-items: center;
    width: 100%;
}

.content-center .buttons .btn {
    width: 100%;
    max-width: 300px;
    margin: 0 !important;
}

.btn-login svg {
    width: 58px;
    height: 58px;
}

.content-footer .footer-info {
    width: fit-content;
    flex-direction: column;
}

.footer-pages {
    margin-bottom: 20px;
    width: 100%;
}

.footer-policies {
    margin-bottom: 20px;
    width: 100%;
}

.footer-socials {
    margin-bottom: 20px;
    width: 100%;
}

.content-store-list {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 0;
}

.content-store-card.center {
    margin: 0 auto;
    width: 100%;
    max-width: 100%;
}

.layout-content-spacing {
    width: 100%;
}

.content-store {
    padding: 0 15px;
}

.content-footer {
    padding: 20px 15px 0 15px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 18px;
}

.footer-bottom {
    padding: 18px 0 28px 0;
    text-align: center;
    line-height: 1.5;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    word-break: break-word;
    width: 100%;
    height: fit-content;
    vertical-align: middle;
}

.footer-bottom-left {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    align-self: center;
    width: fit-content;
    min-width: auto;
    padding-left: 0;
    vertical-align: middle;
}

.footer-bottom-right {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding-right: 0;
}

.footer-bottom p {
    vertical-align: middle;
    text-align: center;
    width: 181px;
    max-width: 100%;
}

/* Store page: layout and cards */
@media screen and (max-width: 992px) {
    .store-header .row {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
        margin-bottom: 16px;
        justify-content: stretch !important;
    }

    .store-header .row > * {
        width: 100%;
    }

    .store-header .search-wrapper,
    .store-header .cart-btn-wrapper {
        width: 100%;
        margin: 0;
    }

    .store-header .search-wrapper label.search {
        width: 100%;
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 10px 12px;
        background: var(--Gray120R028);
        border: 1px solid var(--Gray50R028);
        border-radius: 10px;
    }

    .store-header .search-wrapper input {
        width: 100%;
    }

    .store-header .cart-btn-wrapper {
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 10px;
    }

    .store-header .cart-btn-wrapper .btn-primary {
        flex: 1;
        justify-content: center;
        padding: 10px 12px;
        height: 44px;
        border-radius: 10px;
    }

    .store-header .cart-btn-wrapper .btn-secondary {
        width: 92px;
        min-width: 88px;
        height: 44px;
        border-radius: 10px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .filters-sort-container {
        flex-direction: column;
        align-items: stretch;
        gap: 12px;
        margin-bottom: 16px;
    }

    .filter-group,
    .sort-group {
        width: 100%;
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
    }

    .sort-group select {
        width: 100%;
        min-height: 44px;
    }

    .products-container {
        padding: 0 4px;
    }

    .products {
        display: flex;
        flex-direction: column;
        gap: 16px;
        align-items: stretch;
    }

    .products .product-item {
        width: 100% !important;
        margin: 0;
        padding: 0;
    }

    .products .product-item.shopbox {
        padding: 16px 16px 14px;
        width: 100%;
        max-width: 100%;
    }

    .product-item .shop-title {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 6px;
    }

    .product-item .shop-title .product-name {
        font-size: 18px;
        text-align: center;
        min-height: unset;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        line-clamp: 2;
        overflow: hidden;
    }

    .product-item .shop-title .info-text {
        margin: 0 auto;
        padding: 4px 12px;
        min-width: 120px;
    }

    .product-item .shop-icon {
        height: 160px;
        background: var(--BlackR028);
    }

    .product-item .shop-icon .avatar {
        width: 100%;
        height: 100%;
        background-size: contain;
        background-position: center;
    }

    .product-item .shop-price {
        align-items: flex-end;
    }

    .product-item .shop-price span {
        font-size: 16px;
        text-align: left;
    }

    .product-item .shop-price p {
        font-size: clamp(40px, 10vw, 56px);
        margin: 10px 0 6px;
        line-height: 1;
    }

    .product-item .btn-add-to-cart {
        width: 100%;
        margin: 12px 0 0 0;
        height: 44px;
        border-radius: 8px;
        font-size: 14px;
        padding: 0 12px;
    }
}

.search {
    width: 260px;
}

.layout-px-spacing {
    width: 90%;
}

.products {
    justify-content: center;
    margin: 0 auto;
}

.shopbox button {
    width: 85%;
}

.file-tree {
    flex: 1;
}

.commands-card {
    height: -webkit-fill-available;
}

.commands-card .sidebar-commands {
    min-width: 0;
    padding: 0;
    margin: 0;
    display: flex;
    padding-right: 0;
    border: var(--BlueR028) 2px solid;
    border-radius: 0 15px 15px 0px;
}

.commands-card .sidebar-commands .file-tree {
    display: none;
}

.commands-card .sidebar-commands.active {
    min-width: 100%;
    padding: 20px;
    margin: 0;
    display: flex;
    padding-right: 0;
    border: var(--BlueR028) 2px solid;
    border-radius: 0 15px 15px 0px;
}

.commands-card .sidebar-commands.active .file-tree {
    display: block;
}

.panel-commands {
    width: 100%;
    margin: 0;
    background: var(--Gray120R028);
}

.panel-commands .panel-visual {
    height: auto;
}

/* Helpers for layout fluidity on mobile screens */
@media screen and (max-width: 992px) {
    .layout-content-spacing,
    .layout-px-spacing,
    .content-store,
    .content-store-list {
        width: 100%;
        padding: 0 15px;
    }

    .content-right iframe,
    iframe.responsive-embed {
        width: 100%;
        height: auto;
        aspect-ratio: 16 / 9;
    }

    .invoice-header,
    .invoice-body,
    .invoice-total {
        display: flex;
        flex-wrap: wrap;
        gap: 16px;
    }

    .invoice-from,
    .invoice-to {
        flex: 1 1 240px;
    }

    .invoice-table {
        overflow-x: auto;
    }
}

.panel-commands .panel-body {
    padding: 30px 10px;
}

.panel-commands .panel-body .panel-content .panel-info {
    margin: 0 24px;
}

.sidebar-commands .toggle {
    width: 35px;
    background: var(--BlueR028);
    border-radius: 0 15px 15px 0px;
    margin: 0;
    padding: 280px 10px;
    cursor: pointer;
}

.sidebar-commands.active .toggle {
    margin: -20px 0;
    margin-left: 15px;
    content: url("data:image/svg+xml,%3Csvg width='11' height='18' viewBox='0 0 11 18' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10.6836 16.3638L10.6836 1.63622C10.6835 1.37553 10.6062 1.12072 10.4613 0.903981C10.3165 0.687247 10.1106 0.518326 9.86977 0.418573C9.62893 0.318821 9.36392 0.292715 9.10824 0.343557C8.85256 0.394399 8.61769 0.519907 8.43333 0.704212L1.06956 8.068C0.822428 8.3152 0.683594 8.65045 0.683594 9C0.683594 9.34956 0.822428 9.6848 1.06956 9.93201L8.43333 17.2958C8.61769 17.4801 8.85256 17.6056 9.10824 17.6564C9.36392 17.7073 9.62893 17.6812 9.86977 17.5814C10.1106 17.4817 10.3165 17.3128 10.4613 17.096C10.6062 16.8793 10.6835 16.6245 10.6836 16.3638Z' fill='%23EDF0F4'/%3E%3C/svg%3E%0A");
}

.webhook-topmenu {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-around;
    align-items: center;
    margin-bottom: 15px;
}

.webhook-arcodion .webhook-content .webhook-arcodion-content {
    width: 93%;
}

.menu-admin .nav-item .menu-title {
    display: block!important;
}

.menu-admin .nav-item.selected::before {
    display: none!important;
}

.user-card .user-data {
    flex-direction: column;
}

.user-card .user-data .user-datas {
    border-left: none;
}

.user-card .user-data .user-security {
    border-left: none;
}

.user-card .user-buttons {
    padding: 15px 0!important;
}

.user-card .user-buttons div {
    width: auto!important;
}

.payment-card .payment-data .payment-datas {
    flex-direction: column;
}

.payment-card .payment-data .payment-datas .payment-basic {
    border-right: none;
}

.terms {
    padding: 35px 20px!important;
}

.terms h2 {
    line-height: 32px;
}

.invoice-logo img {
    width: 100px;
}

.invoice-card {
    padding: 30px 15px;
    margin: 0 10px;
}

.invoice-card .invoice-payment .invoice-payment-item .invoice-payment-body .pix {
    flex-direction: column-reverse;
}

.invoice-card .invoice-payment .invoice-payment-item .invoice-payment-body .pix .pix-info {
    width: 89VW;
}

.panel-visual .message {
    height: fit-content;
}

.embeds-inputs .embed-color-form {
    display: flex;
    align-items: center;
}

.embeds-inputs .embed-footers-form .embed-footer-text-form {
    grid-column: 1;
}

.dataTables_filter {
    width: 300px;
}

div.dataTables_wrapper div.dataTables_filter input {
    width: 300px;
}

div.dataTables_wrapper .table-responsive {
    padding: 0 5px;
}

div.bar {
    /* bottom bar */
    border-bottom: 1px solid var(--WhiteR028);
}

.guild-info p {
    margin-bottom: 0;
}

/* Additional mobile-specific responsive fixes */
.content-client {
    padding: 40px 15px !important;
}

.content-client .title {
    font-size: 24px !important;
    margin-bottom: 15px;
}

.content-client .description {
    font-size: 14px !important;
    margin-bottom: 30px;
}

.content-client-list {
    padding: 20px 0;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
}

.content-client-item {
    min-width: 180px;
    flex-shrink: 0;
    margin: 0 10px;
}

.navbar {
    flex-wrap: wrap;
    padding: 10px 15px;
}

.navbar .navbar-item {
    width: 100%;
    flex-wrap: wrap;
    justify-content: space-between;
}

.navbar .navbar-item .nav-item {
    margin: 5px 8px !important;
}

.menu-top-bar2.user-top-bar {
    justify-content: center !important;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
}

.menu-top-bar2.user-top-bar > li {
    margin: 0 5px;
}

.navbar .navbar-item.menu-top-bar2.user-top-bar {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.main-content {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden;
    padding: 0;
}

body {
    overflow-x: hidden;
    width: 100%;
}

/* Config pages: container, sidebar, and content */
@media screen and (max-width: 992px) {
    .config-container {
        flex-direction: column;
        padding: 15px;
        gap: 15px;
    }

    .config-sidebar {
        width: 100%;
        position: relative;
    }

    .config-sidebar #sidebar {
        max-height: 400px;
        overflow-y: auto;
    }

    .config-content {
        width: 100%;
        min-width: 0;
    }

    .config-page-container {
        padding: 0 15px;
    }

    .scrn {
        padding: 0;
    }

    /* Forms and inputs */
    .config-page-container .form-control,
    .config-page-container input[type="text"],
    .config-page-container input[type="number"],
    .config-page-container input[type="email"],
    .config-page-container input[type="password"],
    .config-page-container select,
    .config-page-container textarea {
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
    }

    .config-page-container .select2-container {
        width: 100% !important;
        max-width: 100%;
    }

    .config-page-container .row {
        margin-left: 0;
        margin-right: 0;
    }

    .config-page-container .col-md-6,
    .config-page-container .col-md-10,
    .config-page-container .col-md-12,
    .config-page-container .col-xl-12,
    .config-page-container .col-sm-12,
    .config-page-container .col-12 {
        width: 100%;
        padding-left: 0;
        padding-right: 0;
    }

    /* Tables */
    .config-page-container .table-responsive {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        width: 100%;
    }

    .config-page-container table {
        width: 100%;
        min-width: 600px;
    }

    .config-page-container .dataTables_wrapper {
        overflow-x: auto;
    }

    /* Cards and panels */
    .config-page-container .widget,
    .config-page-container .card,
    .config-page-container .statbox {
        width: 100%;
        margin: 10px 0;
    }

    .config-page-container .widget-content-area {
        padding: 15px;
    }

    /* Buttons and button groups */
    .config-page-container .btn-group {
        width: 100%;
        display: flex;
        flex-direction: column;
        gap: 8px;
    }

    .config-page-container .btn-group .btn {
        width: 100%;
        margin: 0;
    }

    .config-page-container .btn {
        min-height: 44px;
        padding: 10px 16px;
    }

    /* Page headers */
    .config-page-container .page-header {
        font-size: 20px;
        margin-bottom: 15px;
    }

    .config-page-container h2,
    .config-page-container h3,
    .config-page-container h4 {
        word-wrap: break-word;
        overflow-wrap: break-word;
    }

    /* Switch toggles */
    .config-page-container .switch {
        display: flex;
        align-items: center;
        width: 100%;
        margin: 10px 0;
    }

    /* Modals */
    .config-page-container .modal-dialog {
        margin: 10px;
        max-width: calc(100% - 20px);
    }

    /* Accordions and collapsibles */
    .config-page-container .collapse,
    .config-page-container [data-toggle="collapse"] {
        width: 100%;
    }

    /* Sortable cards */
    .config-page-container .sortable {
        min-width: 100% !important;
        max-width: 100%;
    }

    /* Floating elements */
    .config-page-container .floating-div {
        position: fixed;
        right: 15px;
        bottom: 80px;
        z-index: 9999;
    }

    /* Alerts */
    #success,
    #error {
        right: 15px;
        left: 15px;
        width: auto;
        max-width: calc(100% - 30px);
    }

    /* Config page sections and categories */
    .config-page-container .cat {
        width: 100%;
        margin-bottom: 20px;
        padding: 15px;
        background: var(--Gray120R028);
        border-radius: 15px;
    }

    .config-page-container .cat .title {
        margin-bottom: 10px;
    }

    .config-page-container .cat .title h4 {
        font-size: 18px;
        margin: 0 0 8px 0;
    }

    .config-page-container .cat .description {
        margin-bottom: 15px;
    }

    .config-page-container .cat .description p {
        font-size: 14px;
        line-height: 1.5;
        margin: 0;
        color: var(--Gray30R028);
    }

    /* Form groups and labels */
    .config-page-container .form-group,
    .config-page-container .input-group {
        width: 100%;
        margin-bottom: 15px;
    }

    .config-page-container label {
        display: block;
        width: 100%;
        margin-bottom: 6px;
        font-size: 14px;
        font-weight: 500;
    }

    /* Input groups with buttons */
    .config-page-container .input-group {
        flex-wrap: wrap;
    }

    .config-page-container .input-group > .form-control,
    .config-page-container .input-group > .input-group-prepend,
    .config-page-container .input-group > .input-group-append {
        width: 100%;
        margin-bottom: 8px;
    }

    .config-page-container .input-group > .input-group-prepend:not(:first-child),
    .config-page-container .input-group > .input-group-append:not(:last-child) {
        margin-left: 0;
    }

    .config-page-container .input-group .btn {
        width: 100%;
        margin: 0;
    }

    /* Color picker and custom color buttons */
    .config-page-container .input-group .input-group-append .btn,
    .config-page-container .input-group .input-group-prepend .btn {
        width: 100%;
    }

    /* Status tags/chips (bot status field) */
    .config-page-container .select2-selection__choice,
    .config-page-container .select2-selection__choice__remove {
        font-size: 13px;
        padding: 4px 8px;
    }

    /* Notes and help text */
    .config-page-container .note,
    .config-page-container .help-block,
    .config-page-container small {
        display: block;
        width: 100%;
        margin-top: 6px;
        font-size: 12px;
        line-height: 1.4;
        color: var(--Gray30R028);
    }

    /* Command buttons/text */
    .config-page-container code,
    .config-page-container pre {
        font-size: 13px;
        word-break: break-all;
        white-space: pre-wrap;
    }

    /* Save button and action buttons */
    .config-page-container .floating-div .btn {
        width: 100%;
        max-width: 100%;
        min-height: 48px;
        font-size: 16px;
    }

    /* Responsive grid adjustments */
    .config-page-container .row {
        display: flex;
        flex-direction: column;
    }

    .config-page-container .row > [class*="col-"] {
        width: 100%;
        flex: 1 1 100%;
        margin-bottom: 15px;
    }
}