@charset "UTF-8";

/*
 * Camada responsiva global do PedeAí.
 * Carregada por último para corrigir componentes legados sem alterar o design desktop.
 */

:root {
    --pedeai-mobile-gutter: 15px;
    --pedeai-topbar-height: 60px;
    --pedeai-touch-size: 44px;
    --pedeai-sidebar-width: min(86vw, 290px);
}

html {
    width: 100%;
    min-height: 100%;
    overflow-x: hidden;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

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

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

img,
video {
    height: auto;
}

iframe {
    border: 0;
}

input,
select,
textarea,
button,
.input-group,
.form-control {
    min-width: 0;
    max-width: 100%;
}

textarea.form-control {
    height: auto;
    min-height: 96px;
    resize: vertical;
}

pre,
code,
.break-word {
    max-width: 100%;
    overflow-wrap: anywhere;
    word-break: break-word;
    white-space: pre-wrap;
}

.table-responsive,
.mobile-table-scroll,
.estat-table-wrap {
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    border: 0;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-inline: contain;
}

.mobile-table-scroll {
    margin-bottom: 18px;
}

.mobile-table-scroll:focus-visible,
.table-responsive:focus-visible {
    outline: 2px solid #2cabe3;
    outline-offset: 2px;
}

.table-responsive > .table,
.mobile-table-scroll > table {
    margin-bottom: 0;
}

.modal {
    padding-left: env(safe-area-inset-left);
    padding-right: env(safe-area-inset-right);
}


/* Modais públicos de horário e endereço.
 * Ambos usam esta mesma classe, portanto têm exatamente a mesma largura.
 */
:root {
    --pedeai-store-modal-width: 560px;
    --pedeai-store-modal-radius: 8px;
    --pedeai-store-modal-space: 24px;
}

.store-info-modal .store-info-modal__dialog {
    width: var(--pedeai-store-modal-width);
    max-width: calc(100% - 20px);
    margin: 30px auto;
}

.store-info-modal .store-info-modal__content {
    display: flex;
    width: 100%;
    max-width: 100%;
    max-height: calc(100vh - 32px);
    max-height: calc(100dvh - 32px);
    flex-direction: column;
    overflow: hidden;
    border: 0;
    border-radius: var(--pedeai-store-modal-radius);
    background: #fff;
    box-shadow: 0 18px 50px rgba(0, 0, 0, .28);
    text-align: center;
}

.store-info-modal .store-info-modal__header {
    flex: 0 0 auto;
    padding: 22px var(--pedeai-store-modal-space) 18px;
    border-bottom: 1px solid #ededed;
    color: #61617a;
    font-size: 16px;
    line-height: 1.4;
}


.store-info-modal .store-info-modal__header .modal-title {
    margin: 0;
    padding: 0 34px;
    color: inherit;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.4;
    text-align: center;
}

.store-info-modal .store-info-modal__header .close {
    margin-top: -2px;
}

.store-info-modal .store-info-modal__body {
    display: flex;
    min-height: 0;
    padding: 22px var(--pedeai-store-modal-space);
    flex: 1 1 auto;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    overflow-x: hidden;
    overflow-y: auto;
    color: #61617a;
    text-align: center;
    -webkit-overflow-scrolling: touch;
}

/* Centralização compartilhada de todo o conteúdo dos dois modais. */
.store-info-modal .store-info-modal__header,
.store-info-modal .store-info-modal__body,
.store-info-modal .store-info-modal__footer,
.store-info-modal .store-info-modal__business-name,
.store-info-modal .store-info-modal__text,
.store-info-modal .store-info-modal__section-title,
.store-info-modal .store-info-modal__table-wrap,
.store-info-modal .store-info-modal__table,
.store-info-modal .store-info-modal__hours-row {
    text-align: center !important;
}

.store-info-modal .store-info-modal__body > * {
    width: 100%;
    margin-right: auto;
    margin-left: auto;
}

.store-info-modal .store-info-modal__header > :not(.close),
.store-info-modal .store-info-modal__footer > * {
    margin-right: auto;
    margin-left: auto;
}

.store-info-modal i {
    display: inline-block;
    vertical-align: middle;
}

.store-info-modal .store-info-modal__business-name {
    display: block;
    margin-bottom: 10px;
    color: #61617a;
}

.store-info-modal .store-info-modal__text {
    margin: 0;
    color: #61617a;
    font-size: 15px;
    line-height: 1.55;
    overflow-wrap: anywhere;
}

.store-info-modal .store-info-modal__section-title {
    margin: 24px 0 14px;
    color: #61617a;
}

.store-info-modal .store-info-modal__table-wrap {
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.store-info-modal .store-info-modal__table {
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    table-layout: fixed;
}

.store-info-modal .store-info-modal__table th,
.store-info-modal .store-info-modal__table td {
    padding: 9px 8px;
    text-align: center;
    vertical-align: middle;
    overflow-wrap: anywhere;
}

.store-info-modal .store-info-modal__body--hours {
    display: flex;
    gap: 10px;
    align-items: center;
}

.store-info-modal .store-info-modal__hours-row {
    display: grid;
    gap: 2px;
    padding: 8px 10px;
    border-radius: 4px;
    text-align: center;
}

.store-info-modal .store-info-modal__hours-row span {
    display: block;
}

.store-info-modal .store-info-modal__hours-row.is-closed span {
    color: #c62828;
}

.store-info-modal .store-info-modal__hours-row.is-closed {
    background: #efefef;
}

.store-info-modal .store-info-modal__footer {
    display: flex;
    min-height: 68px;
    padding: 14px var(--pedeai-store-modal-space);
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    border-top: 1px solid #ededed;
    background: #fff;
    text-align: center;
}

.store-info-modal .store-info-modal__footer::before,
.store-info-modal .store-info-modal__footer::after {
    display: none;
}

.store-info-modal .store-info-modal__footer .btn {
    min-width: 130px;
    margin: 0 !important;
}

@media (max-width: 575px) {
    :root {
        --pedeai-store-modal-space: 18px;
        --pedeai-store-modal-mobile-width: 420px;
    }

    .store-info-modal .store-info-modal__dialog {
        width: auto;
        max-width: var(--pedeai-store-modal-mobile-width);
        margin: 10px auto;
    }

    .store-info-modal .store-info-modal__content {
        width: 100% !important;
        max-width: 100% !important;
        max-height: calc(100vh - 28px);
        max-height: calc(100dvh - 28px);
        border-radius: 10px;
    }

	.modal-header.store-info-modal__header {
		position: relative;
		display: flex;
		min-height: 60px;
		padding: 17px 50px 15px;
		align-items: center;
		justify-content: center;
	}
	
	.modal-header.store-info-modal__header .close {
		position: absolute;
		top: 50%;
		right: 15px;
		left: auto;
		float: none;
		margin: 0;
		transform: translateY(-50%);
	}

    .store-info-modal .store-info-modal__header b {
        display: inline-flex;
        max-width: 100%;
        align-items: center;
        justify-content: center;
        gap: 7px;
        text-align: center;
        line-height: 1.35;
    }

    .store-info-modal .store-info-modal__body {
        padding: 18px var(--pedeai-store-modal-space);
        align-items: center;
        justify-content: flex-start;
        text-align: center;
    }

    .store-info-modal .store-info-modal__business-name,
    .store-info-modal .store-info-modal__text,
    .store-info-modal .store-info-modal__section-title,
    .store-info-modal .store-info-modal__table-wrap {
        width: 100%;
        max-width: 100%;
        margin-right: auto;
        margin-left: auto;
        text-align: center !important;
    }

    .store-info-modal .store-info-modal__text {
        font-size: 14px;
        line-height: 1.55;
    }

    .store-info-modal .store-info-modal__section-title {
        margin-top: 20px;
        margin-bottom: 10px;
    }

    .store-info-modal .store-info-modal__table th,
    .store-info-modal .store-info-modal__table td {
        padding: 9px 6px;
        text-align: center !important;
        vertical-align: middle;
    }

    .store-info-modal .store-info-modal__body--hours {
        width: 100%;
        gap: 8px;
        align-items: center;
    }

    .store-info-modal .store-info-modal__hours-row {
        width: 100%;
        max-width: 340px;
        margin-right: auto;
        margin-left: auto;
        padding: 9px 12px;
        justify-items: center;
        text-align: center !important;
    }

    .store-info-modal .store-info-modal__hours-row b,
    .store-info-modal .store-info-modal__hours-row span {
        width: 100%;
        text-align: center;
    }

    .store-info-modal .store-info-modal__footer {
        min-height: 66px;
        padding: 12px var(--pedeai-store-modal-space);
        justify-content: center;
    }

    .store-info-modal .store-info-modal__footer .btn {
        width: min(100%, 220px);
        min-width: 0;
        margin: 0 auto !important;
    }
}

/* Navegação do site e do painel do negócio. */
@media (max-width: 991px) {
    body.mobile-menu-open {
        overflow: hidden !important;
    }

    header .container-fluid {
        padding-right: var(--pedeai-mobile-gutter);
        padding-left: var(--pedeai-mobile-gutter);
    }

    header nav {
        position: static;
        min-height: 60px;
    }

    .cmn-toggle-switch {
        top: 15px !important;
        right: max(15px, env(safe-area-inset-right)) !important;
        z-index: 10020;
        width: 34px !important;
        height: 34px !important;
    }

    .cmn-toggle-switch span {
        top: 16px !important;
    }

    .main-menu {
        position: fixed !important;
        z-index: 10010 !important;
        top: 0 !important;
        right: auto !important;
        bottom: 0 !important;
        left: 0 !important;
        width: min(88vw, 380px) !important;
        height: 100vh !important;
        height: 100dvh !important;
        padding-bottom: max(24px, env(safe-area-inset-bottom));
        overflow-x: hidden !important;
        overflow-y: auto !important;
        opacity: 1 !important;
        visibility: hidden;
        pointer-events: none;
        transform: translate3d(-105%, 0, 0);
        transition: transform .28s ease, visibility 0s linear .28s !important;
        box-shadow: 8px 0 30px rgba(0, 0, 0, .24) !important;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior: contain;
    }

    .main-menu.show {
        visibility: visible;
        pointer-events: auto;
        transform: translate3d(0, 0, 0);
        transition: transform .28s ease, visibility 0s linear 0s !important;
    }

    #header_menu {
        position: sticky !important;
        z-index: 2;
        top: 0;
        min-height: 72px;
        padding: 16px 52px 16px 18px !important;
    }

    #header_menu img {
        width: auto;
        max-height: 40px;
    }

    #close_in {
        position: absolute !important;
        z-index: 4;
        top: 20px !important;
        right: 18px !important;
        display: inline-flex !important;
        width: 38px !important;
        height: 38px !important;
        align-items: center;
        justify-content: center;
        cursor: pointer;
    }

    .main-menu > ul {
        width: 100%;
        padding: 0 0 28px;
    }

    .main-menu > ul > li,
    .main-menu > ul > li > a {
        width: 100%;
    }

    .main-menu ul li a {
        min-height: var(--pedeai-touch-size);
        padding: 12px 18px !important;
        line-height: 20px;
        white-space: normal;
        overflow-wrap: anywhere;
    }

    .main-menu ul li.submenu > a {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
    }

    .main-menu ul li.submenu > a i {
        flex: 0 0 auto;
        transition: transform .2s ease;
    }

    .main-menu ul li.submenu > a[aria-expanded="true"] i {
        transform: rotate(180deg);
    }

    .main-menu ul li.submenu ul {
        margin: 0 0 8px 18px !important;
        padding-left: 8px;
    }

    .layer {
        position: fixed !important;
        z-index: 10000 !important;
        inset: 0 !important;
        display: block !important;
        width: 100% !important;
        min-width: 0 !important;
        min-height: 100% !important;
        background: rgba(0, 0, 0, .52) !important;
        opacity: 0 !important;
        visibility: hidden;
        pointer-events: none;
        transition: opacity .25s ease, visibility 0s linear .25s;
    }

    .layer.layer-is-visible {
        opacity: 1 !important;
        visibility: visible;
        pointer-events: auto;
        transition: opacity .25s ease, visibility 0s linear 0s;
    }

    .business-session .main-menu,
    .customer-session .main-menu,
    .public-session .main-menu {
        max-width: 100%;
    }
}

/* Painéis administrativo e de revenda. */
.sidebar-backdrop {
    position: fixed;
    z-index: 1039;
    inset: 0;
    display: block;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: rgba(18, 25, 33, .56);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .2s ease, visibility 0s linear .2s;
}

@media (max-width: 767px) {
    body.admin-shell.show-sidebar,
    body.reseller-shell.show-sidebar {
        overflow: hidden !important;
    }

    body.admin-shell .navbar-static-top,
    body.reseller-shell .navbar-static-top {
        height: var(--pedeai-topbar-height);
        min-height: var(--pedeai-topbar-height);
    }

    body.admin-shell .navbar-header,
    body.reseller-shell .navbar-header {
        display: flex;
        width: 100%;
        height: var(--pedeai-topbar-height);
        min-height: var(--pedeai-topbar-height);
        align-items: center;
    }

    body.admin-shell .navbar-top-links,
    body.reseller-shell .navbar-top-links {
        min-width: 0;
        margin: 0;
    }

    body.admin-shell .navbar-top-links.navbar-right,
    body.reseller-shell .navbar-top-links.navbar-right {
        display: flex;
        min-width: 0;
        margin-left: auto;
        align-items: center;
    }

    body.admin-shell .navbar-top-links > li > a,
    body.reseller-shell .navbar-top-links > li > a {
        display: flex;
        min-width: var(--pedeai-touch-size);
        min-height: var(--pedeai-topbar-height);
        align-items: center;
        justify-content: center;
    }

    body.admin-shell .navbar-top-links .profile-pic,
    body.reseller-shell .navbar-top-links .profile-pic {
        max-width: calc(100vw - 112px);
    }

    body.admin-shell .navbar-top-links .profile-pic > span:not(.caret),
    body.reseller-shell .navbar-top-links .profile-pic > span:not(.caret) {
        max-width: 150px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    body.admin-shell .sidebar,
    body.reseller-shell .sidebar {
        position: fixed !important;
        z-index: 1040 !important;
        top: var(--pedeai-topbar-height) !important;
        bottom: 0 !important;
        left: 0 !important;
        display: block !important;
        width: var(--pedeai-sidebar-width) !important;
        height: auto !important;
        padding: 0 0 max(18px, env(safe-area-inset-bottom)) !important;
        overflow: hidden !important;
        visibility: hidden;
        transform: translate3d(-105%, 0, 0);
        transition: transform .25s ease, visibility 0s linear .25s !important;
        box-shadow: 8px 0 28px rgba(0, 0, 0, .2);
    }

    body.admin-shell.show-sidebar .sidebar,
    body.reseller-shell.show-sidebar .sidebar {
        visibility: visible;
        transform: translate3d(0, 0, 0);
        transition: transform .25s ease, visibility 0s linear 0s !important;
    }

    body.admin-shell.show-sidebar .sidebar-backdrop,
    body.reseller-shell.show-sidebar .sidebar-backdrop {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transition: opacity .2s ease, visibility 0s linear 0s;
    }

    body.admin-shell .sidebar-nav,
    body.admin-shell .slimscrollsidebar,
    body.admin-shell .slimScrollDiv,
    body.reseller-shell .sidebar-nav,
    body.reseller-shell .slimscrollsidebar,
    body.reseller-shell .slimScrollDiv {
        width: 100% !important;
        height: 100% !important;
        max-height: 100% !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior: contain;
    }

    body.admin-shell .sidebar-head,
    body.reseller-shell .sidebar-head {
        position: sticky !important;
        z-index: 2 !important;
        top: 0 !important;
        left: auto !important;
        display: block !important;
        width: 100% !important;
    }

    body.admin-shell .sidebar .hide-menu,
    body.reseller-shell .sidebar .hide-menu {
        display: inline !important;
    }

    body.admin-shell .sidebar #side-menu > li > a,
    body.reseller-shell .sidebar #side-menu > li > a {
        display: flex;
        min-height: 46px;
        padding: 12px 18px;
        align-items: center;
        gap: 10px;
        white-space: normal;
    }

    body.admin-shell .sidebar #side-menu > li > a i,
    body.reseller-shell .sidebar #side-menu > li > a i {
        flex: 0 0 24px;
        margin-right: 0;
        text-align: center;
    }

    body.admin-shell #page-wrapper,
    body.reseller-shell #page-wrapper {
        width: 100%;
        min-width: 0;
        margin: var(--pedeai-topbar-height) 0 0 !important;
        padding-bottom: 70px;
    }

    body.admin-shell .container-fluid,
    body.reseller-shell .container-fluid {
        width: 100%;
        padding-right: var(--pedeai-mobile-gutter);
        padding-left: var(--pedeai-mobile-gutter);
    }

    body.admin-shell .bg-title,
    body.reseller-shell .bg-title {
        margin-right: calc(-1 * var(--pedeai-mobile-gutter));
        margin-left: calc(-1 * var(--pedeai-mobile-gutter));
        padding-right: var(--pedeai-mobile-gutter);
        padding-left: var(--pedeai-mobile-gutter);
    }

    body.admin-shell .panel,
    body.admin-shell .white-box,
    body.reseller-shell .panel,
    body.reseller-shell .white-box {
        max-width: 100%;
    }

    body.admin-shell .panel-heading,
    body.reseller-shell .panel-heading {
        min-height: 46px;
        overflow: visible;
    }

    body.admin-shell .panel-heading .pull-right,
    body.reseller-shell .panel-heading .pull-right {
        float: none !important;
        margin-top: 10px;
    }

    body.admin-shell .panel-heading .btn,
    body.reseller-shell .panel-heading .btn {
        white-space: normal;
    }

    body.admin-shell .table-responsive > table,
    body.admin-shell .mobile-table-scroll > table,
    body.reseller-shell .table-responsive > table,
    body.reseller-shell .mobile-table-scroll > table,
    body.business-session .table-responsive > table,
    body.business-session .mobile-table-scroll > table {
        min-width: 680px;
    }

    body.admin-shell table.table_summary,
    body.reseller-shell table.table_summary,
    body.business-session table.table_summary,
    body.business-session table.cart-list {
        min-width: 0 !important;
    }

    body.admin-shell .btn,
    body.reseller-shell .btn,
    body.business-session .btn,
    body.account-page .btn,
    body.status-page .btn {
        min-height: 40px;
    }

    body.admin-shell .btn-group,
    body.reseller-shell .btn-group,
    body.business-session .btn-group,
    body.admin-shell .table-actions,
    body.reseller-shell .table-actions,
    body.business-session .table-actions {
        display: flex;
        max-width: 100%;
        flex-wrap: wrap;
        gap: 6px;
    }

    body.admin-shell .pagination,
    body.reseller-shell .pagination,
    body.business-session .pagination {
        display: flex;
        max-width: 100%;
        flex-wrap: wrap;
        gap: 4px;
    }

    body.admin-shell .pagination > li,
    body.reseller-shell .pagination > li,
    body.business-session .pagination > li {
        display: inline-flex;
    }

    body.admin-shell .dropdown-menu,
    body.reseller-shell .dropdown-menu {
        max-width: calc(100vw - 20px);
    }

    body.admin-shell .footer,
    body.reseller-shell .footer {
        padding: 16px var(--pedeai-mobile-gutter);
        font-size: 12px;
    }
}

/* Painel do negócio e páginas internas. */
@media (max-width: 767px) {
    body.business-session main,
    body.business-session section,
    body.business-session .container,
    body.business-session .container-fluid,
    body.account-page .container,
    body.status-page .container {
        max-width: 100%;
    }

    body.business-session .container,
    body.account-page .container,
    body.status-page .container {
        padding-right: var(--pedeai-mobile-gutter);
        padding-left: var(--pedeai-mobile-gutter);
    }

    body.business-session .white_bg,
    body.business-session .box_style_1,
    body.business-session .box_style_2,
    body.business-session .box_style_3,
    body.business-session .content,
    body.business-session .content section {
        max-width: 100%;
    }

    body.business-session .content section,
    body.business-session .panel-body,
    body.business-session .white-box {
        padding: 18px;
    }

    body.business-session .tabs nav {
        max-width: 100%;
        margin-left: 0;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    body.business-session .tabs nav ul {
        display: flex;
        width: max-content;
        min-width: 100%;
    }

    body.business-session .tabs nav ul li {
        flex: 0 0 auto;
    }

    body.business-session .form-horizontal .form-group {
        margin-right: 0;
        margin-left: 0;
    }

    body.business-session .input-group,
    body.admin-shell .input-group,
    body.reseller-shell .input-group {
        max-width: 100%;
    }

    body.business-session .chart-container,
    body.business-session canvas,
    body.admin-shell .chart-container,
    body.admin-shell canvas,
    body.reseller-shell .chart-container,
    body.reseller-shell canvas {
        max-width: 100% !important;
    }
}

@media (max-width: 575px) {
    :root {
        --pedeai-mobile-gutter: 10px;
    }

    .modal-dialog {
        width: auto !important;
        margin: 10px !important;
    }

    .modal-content {
        max-width: calc(100vw - 20px);
    }

    .modal-header,
    .modal-body,
    .modal-footer {
        padding-right: 15px;
        padding-left: 15px;
    }

    .modal-footer .btn {
        width: 100%;
        margin: 6px 0 0 !important;
    }

    .form-control,
    select.form-control,
    input.form-control {
        width: 100%;
    }

    .input-group.mobile-stack {
        display: flex;
        width: 100%;
        flex-direction: column;
        gap: 8px;
    }

    .input-group.mobile-stack > .form-control,
    .input-group.mobile-stack > .input-group-addon,
    .input-group.mobile-stack > .input-group-btn {
        display: block;
        width: 100%;
    }

    body.admin-shell .panel-body,
    body.admin-shell .white-box,
    body.reseller-shell .panel-body,
    body.reseller-shell .white-box,
    body.business-session .panel-body,
    body.business-session .white-box,
    body.business-session .content section {
        padding: 14px;
    }

    body.admin-shell h1,
    body.reseller-shell h1,
    body.business-session h1 {
        font-size: 28px;
        line-height: 1.2;
    }

    body.admin-shell h2,
    body.reseller-shell h2,
    body.business-session h2 {
        font-size: 22px;
        line-height: 1.25;
    }

    body.admin-shell .panel-heading,
    body.reseller-shell .panel-heading,
    body.business-session .panel-heading {
        padding-right: 14px;
        padding-left: 14px;
    }

    .reseller-summary {
        grid-template-columns: 1fr !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
    }
}

/* Evita dois controles de fechamento simultâneos no menu móvel da loja. */
body.mobile-menu-open .cmn-toggle-switch {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

body.admin-shell .sidebar-head h3,
body.reseller-shell .sidebar-head h3 {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}


/* Ajustes finais de navegação móvel e rolagem — 2026-06-22 */
@media (max-width: 991px) {
    /* Mantém logo e botão do menu alinhados na barra do painel do negócio. */
    body.business-session header {
        height: var(--pedeai-topbar-height);
        min-height: var(--pedeai-topbar-height);
        padding-top: 0 !important;
    }

    body.business-session header .container-fluid,
    body.business-session header .row {
        height: 100%;
        min-height: var(--pedeai-topbar-height);
    }

    body.business-session header .row {
        display: flex;
        margin-right: -15px;
        margin-left: -15px;
        align-items: center;
    }

    body.business-session header .row > div:first-child {
        display: flex;
        width: auto;
        height: 100%;
        min-width: 0;
        flex: 1 1 auto;
        float: none;
        align-items: center;
    }

    body.business-session header nav {
        position: relative;
        display: flex;
        width: 60px;
        height: 100%;
        min-width: 60px;
        flex: 0 0 60px;
        float: none;
        align-items: center;
        justify-content: flex-end;
    }

    body.business-session header #logo {
        display: inline-flex;
        height: 100%;
        min-width: 0;
        align-items: center;
        line-height: 1;
    }

    body.business-session header #logo img {
        display: block;
        width: auto !important;
        max-width: min(180px, calc(100vw - 100px));
        max-height: 40px;
        margin: 0;
    }

    body.business-session .cmn-toggle-switch {
        position: relative !important;
        top: auto !important;
        right: auto !important;
        display: block;
        width: var(--pedeai-touch-size) !important;
        height: var(--pedeai-touch-size) !important;
        margin: 0 !important;
        flex: 0 0 var(--pedeai-touch-size);
    }

    body.business-session .cmn-toggle-switch span {
        top: 21px !important;
        right: 5px;
        left: 5px;
    }

    /* Uma única rolagem nativa, sem barra duplicada, no menu do negócio. */
    body.business-session .main-menu {
        scrollbar-width: thin;
        scrollbar-color: rgba(79, 91, 103, .62) transparent;
        scrollbar-gutter: stable;
        overscroll-behavior-y: contain;
    }

    body.business-session .main-menu::-webkit-scrollbar {
        width: 8px;
    }

    body.business-session .main-menu::-webkit-scrollbar-track {
        background: transparent;
    }

    body.business-session .main-menu::-webkit-scrollbar-thumb {
        border: 2px solid transparent;
        border-radius: 999px;
        background: rgba(79, 91, 103, .62);
        background-clip: padding-box;
    }
}

@media (max-width: 767px) {
    /* Normaliza a barra superior dos painéis administrativo e de revenda. */
    body.admin-shell .navbar-header,
    body.reseller-shell .navbar-header {
        padding-right: max(4px, env(safe-area-inset-right));
        padding-left: max(4px, env(safe-area-inset-left));
    }

    body.admin-shell .top-left-part:empty {
        display: none !important;
        width: 0 !important;
    }

    body.reseller-shell .top-left-part {
        display: flex;
        width: auto !important;
        min-width: 0;
        height: var(--pedeai-topbar-height);
        flex: 0 1 auto;
        align-items: center;
    }

    body.reseller-shell .reseller-brand {
        display: inline-flex;
        min-height: var(--pedeai-touch-size);
        padding: 0 10px;
        align-items: center;
        line-height: 1.1;
    }

    body.admin-shell .navbar-top-links.navbar-left,
    body.reseller-shell .navbar-top-links.navbar-left {
        display: flex;
        float: none !important;
        align-items: center;
    }

    body.admin-shell .navbar-top-links.navbar-right,
    body.reseller-shell .navbar-top-links.navbar-right {
        float: none !important;
    }

    body.admin-shell .navbar-top-links > li,
    body.reseller-shell .navbar-top-links > li {
        display: flex;
        min-width: 0;
        align-items: center;
    }

    body.admin-shell .navbar-top-links > li > a.open-close,
    body.reseller-shell .navbar-top-links > li > a.open-close {
        width: var(--pedeai-touch-size);
        padding: 0;
        font-size: 23px;
    }

    body.admin-shell .navbar-top-links .profile-pic,
    body.reseller-shell .navbar-top-links .profile-pic {
        min-height: var(--pedeai-topbar-height);
        padding: 6px 10px;
        line-height: 1.2 !important;
    }

    /* O plugin legado criava uma barra dentro de outra. O contêiner fica fixo
       e somente o conteúdo do menu recebe rolagem vertical nativa. */
    body.admin-shell .sidebar > .slimScrollDiv,
    body.reseller-shell .sidebar > .slimScrollDiv {
        position: relative !important;
        width: 100% !important;
        height: 100% !important;
        max-height: 100% !important;
        overflow: hidden !important;
    }

    body.admin-shell .sidebar .slimscrollsidebar,
    body.reseller-shell .sidebar .slimscrollsidebar {
        width: 100% !important;
        height: 100% !important;
        max-height: 100% !important;
        padding-bottom: max(18px, env(safe-area-inset-bottom));
        overflow-x: hidden !important;
        overflow-y: auto !important;
        scrollbar-width: thin;
        scrollbar-color: rgba(255, 255, 255, .45) transparent;
        scrollbar-gutter: stable;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior-y: contain;
        touch-action: pan-y;
    }

    body.admin-shell .sidebar .slimScrollBar,
    body.admin-shell .sidebar .slimScrollRail,
    body.reseller-shell .sidebar .slimScrollBar,
    body.reseller-shell .sidebar .slimScrollRail {
        display: none !important;
    }

    body.admin-shell .sidebar .slimscrollsidebar::-webkit-scrollbar,
    body.reseller-shell .sidebar .slimscrollsidebar::-webkit-scrollbar {
        width: 8px;
    }

    body.admin-shell .sidebar .slimscrollsidebar::-webkit-scrollbar-track,
    body.reseller-shell .sidebar .slimscrollsidebar::-webkit-scrollbar-track {
        background: transparent;
    }

    body.admin-shell .sidebar .slimscrollsidebar::-webkit-scrollbar-thumb,
    body.reseller-shell .sidebar .slimscrollsidebar::-webkit-scrollbar-thumb {
        border: 2px solid transparent;
        border-radius: 999px;
        background: rgba(255, 255, 255, .45);
        background-clip: padding-box;
    }
}


/* Cabeçalho do index.php: logo e botão alinhados em qualquer tipo de sessão. */
@media (max-width: 991px) {
    body.app-shell header {
        height: var(--pedeai-topbar-height);
        min-height: var(--pedeai-topbar-height);
        padding: 0 !important;
    }

    body.app-shell header .container-fluid {
        height: 100%;
        min-height: var(--pedeai-topbar-height);
        padding-right: max(var(--pedeai-mobile-gutter), env(safe-area-inset-right));
        padding-left: max(var(--pedeai-mobile-gutter), env(safe-area-inset-left));
    }

    body.app-shell header .site-header-row {
        display: flex !important;
        width: 100%;
        height: 100%;
        min-height: var(--pedeai-topbar-height);
        margin: 0 !important;
        align-items: center;
        justify-content: space-between;
    }

    body.app-shell header .site-logo-column {
        display: flex !important;
        width: auto !important;
        max-width: calc(100% - 52px);
        height: 100%;
        min-width: 0;
        padding: 0 !important;
        flex: 1 1 auto;
        float: none !important;
        align-items: center;
    }

    body.app-shell header .site-nav-column {
        position: relative !important;
        display: flex !important;
        width: 44px !important;
        min-width: 44px;
        height: 100%;
        min-height: var(--pedeai-topbar-height);
        padding: 0 !important;
        flex: 0 0 44px;
        float: none !important;
        align-items: center;
        justify-content: center;
    }

    body.app-shell header #logo {
        display: inline-flex !important;
        width: auto;
        height: 100%;
        min-width: 0;
        margin: 0 !important;
        padding: 0 !important;
        align-items: center;
        line-height: 1;
    }

    body.app-shell header #logo img {
        display: block;
        width: auto !important;
        height: auto !important;
        max-width: min(180px, calc(100vw - 92px));
        max-height: 40px;
        margin: 0 !important;
        padding: 0 !important;
        object-fit: contain;
    }

    body.app-shell header .cmn-toggle-switch {
        position: relative !important;
        top: auto !important;
        right: auto !important;
        display: block !important;
        width: 44px !important;
        height: 44px !important;
        margin: 0 !important;
        padding: 0 !important;
        flex: 0 0 44px;
    }

    body.app-shell header .cmn-toggle-switch span {
        top: 21px !important;
        right: 7px !important;
        left: 7px !important;
    }
}

/* Página pública de contato.
 * O conteúdo já é renderizado dentro do container principal do Bootstrap;
 * por isso esta camada evita containers aninhados e mantém o formulário fluido.
 */
#contato_do_site.contact-page {
    width: 100%;
    max-width: 100%;
}

#contato_do_site .contact-page-panel {
    width: 100%;
    max-width: 100%;
    padding: 44px clamp(18px, 4vw, 48px);
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 8px 28px rgba(0, 0, 0, .08);
}

#contato_do_site .contact-page-heading {
    max-width: 760px;
    margin-right: auto;
    margin-bottom: 34px;
    margin-left: auto;
}

#contato_do_site .contact-page-heading h2 {
    overflow-wrap: anywhere;
}

#contato_do_site .contact-page-heading p {
    margin: 14px 0 0;
    line-height: 1.55;
}

#contato_do_site .contact-page-form .form-group {
    margin-bottom: 20px;
}

#contato_do_site .contact-page-form label {
    display: block;
    margin-bottom: 7px;
    color: #333;
    line-height: 1.35;
}

#contato_do_site .contact-page-form .form-control {
    width: 100%;
    min-height: 44px;
    padding: 10px 12px;
    border: 1px solid #d7d7d7;
    border-radius: 4px;
    background: #fff;
    font-size: 16px;
    line-height: 1.4;
}

#contato_do_site .contact-page-form textarea.form-control {
    min-height: 150px;
    height: auto;
    resize: vertical;
}

#contato_do_site .contact-page-form .form-control:focus {
    border-color: #777;
    outline: 0;
    box-shadow: 0 0 0 3px rgba(0, 0, 0, .08);
}

#contato_do_site .contact-form-actions {
    margin-top: 8px;
    padding-top: 24px;
    border-top: 1px solid #ddd;
    text-align: center;
}

#contato_do_site .contact-submit-button {
    display: inline-flex;
    width: auto;
    min-width: min(100%, 280px);
    min-height: 46px;
    align-items: center;
    justify-content: center;
    gap: 9px;
    margin: 0 auto;
    white-space: normal;
}

@media (max-width: 767px) {
    #contato_do_site .contact-page-panel {
        padding: 28px 15px;
        border-radius: 6px;
    }

    #contato_do_site .contact-page-heading {
        margin-bottom: 24px;
    }

    #contato_do_site .contact-page-heading h2 {
        font-size: clamp(24px, 8vw, 32px);
        line-height: 1.15;
    }

    #contato_do_site .contact-page-heading p {
        font-size: 15px;
        line-height: 1.5;
    }

    #contato_do_site .contact-page-form .form-group {
        margin-bottom: 16px;
    }

    #contato_do_site .contact-form-actions {
        padding-top: 20px;
    }

    #contato_do_site .contact-submit-button {
        width: 100%;
        min-width: 0;
    }
}

@media (max-width: 380px) {
    #contato_do_site .contact-page-panel {
        padding-right: 10px;
        padding-left: 10px;
    }
}

/*
 * Compensacao do cabecalho fixo nas paginas internas do painel do negocio.
 * A altura real e atualizada por responsive-navigation.js, inclusive quando
 * os itens do menu ocupam mais de uma linha em larguras intermediarias.
 */
body.app-shell.internal-page {
    --pedeai-app-header-height: 64px;
}

body.app-shell.internal-page .app-content {
    margin-top: var(--pedeai-app-header-height);
}

/*
 * Mantem as paginas carregadas por /includes alinhadas ao alerta de licença.
 * Alguns arquivos legados possuem um segundo .container, que sem esta regra
 * ultrapassa a largura útil do .app-content por causa do container aninhado.
 */
body.app-shell.internal-page .app-include-content {
    width: 100%;
    max-width: 100%;
    min-width: 0;
}

body.app-shell.internal-page .app-include-content > .container,
body.app-shell.internal-page .app-include-content > #contato_do_site > .container,
body.app-shell.internal-page .app-include-content > .contact-page > .container {
    width: 100%;
    max-width: 100%;
    margin-right: 0;
    margin-left: 0;
}

@media (max-width: 991px) {
    body.app-shell.internal-page {
        --pedeai-app-header-height: var(--pedeai-topbar-height);
    }
}

/* Correções de rolagem do cabeçalho, hero e sidebar da vitrine — 2026-07-03 */
body.app-shell {
    height: auto !important;
    min-height: 100vh;
    overflow-x: clip !important;
    overflow-y: visible !important;
}

body.app-shell > #site-header {
    position: fixed !important;
    z-index: 99999;
    top: 0;
    right: 0;
    left: 0;
    width: 100%;
    background-color: transparent !important;
    box-shadow: none !important;
    transition: background-color .3s ease, box-shadow .3s ease;
}

body.app-shell:not(.internal-page) > #site-header.is-scrolled,
body.app-shell.internal-page > #site-header {
    background-color: #000 !important;
    box-shadow: 0 2px 10px -2px rgba(0, 0, 0, .41) !important;
}

/*
 * O cabeçalho da loja usa uma imagem real posicionada atrás do conteúdo.
 * Isso é mais seguro no mobile do que depender apenas de ::before/background.
 */
body.app-shell:not(.internal-page) > #img-head-loja.store-hero {
    position: relative;
    z-index: 1;
    min-height: 470px;
    margin-top: 0 !important;
    overflow: hidden;
    isolation: isolate;
    background: #1f1f1f !important;
}

body.app-shell:not(.internal-page) > #img-head-loja.store-hero > .store-hero-image {
    position: absolute;
    z-index: 0;
    inset: -2px;
    width: calc(100% + 4px);
    height: calc(100% + 4px);
    max-width: none;
    display: block;
    object-fit: cover;
    object-position: center center;
    transform: scale(1.08);
    transform-origin: center center;
    will-change: transform;
    animation: store-hero-cover-zoom 1.6s cubic-bezier(.22, .61, .36, 1) both;
}

/* Desativa o pseudo-elemento antigo para não sobrepor nem duplicar a capa. */
body.app-shell:not(.internal-page) > #img-head-loja.store-hero::before {
    content: none !important;
    display: none !important;
}

body.app-shell:not(.internal-page) > #img-head-loja.store-hero > #subheader {
    position: relative;
    z-index: 1;
}

@keyframes store-hero-cover-zoom {
    from { transform: scale(1.08); }
    to { transform: scale(1); }
}

@media (prefers-reduced-motion: reduce) {
    body.app-shell:not(.internal-page) > #img-head-loja.store-hero > .store-hero-image {
        animation: none;
        transform: scale(1);
    }
}

@media (max-width: 767px) {
    body.app-shell:not(.internal-page) > #img-head-loja.store-hero {
        min-height: 350px;
    }
}

/* Proteção contra espelhos antigos gerados por cache ou scripts duplicados. */
body.app-shell > .parallax-mirror {
    display: none !important;
    visibility: hidden !important;
}

/*
 * Sidebar do carrinho fixa pelo scroll da própria página, sem criar uma
 * segunda área rolável e sem exibir barra de rolagem ao lado do carrinho.
 */
@media (min-width: 992px) {
    body.app-shell:not(.internal-page) .storefront-layout {
        display: flex;
        align-items: flex-start;
        flex-wrap: wrap;
    }

    body.app-shell:not(.internal-page) .storefront-layout > [class*="col-"] {
        float: none;
    }

    body.app-shell:not(.internal-page) #sidebar {
        position: sticky !important;
        top: 80px !important;
        align-self: flex-start;
        height: auto !important;
        min-height: 1px;
        max-height: none !important;
        overflow: visible !important;
    }

    body.app-shell:not(.internal-page) #sidebar > .theiaStickySidebar {
        position: static !important;
        top: auto !important;
        right: auto !important;
        bottom: auto !important;
        left: auto !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: visible !important;
        transform: none !important;
    }
}

@media (max-width: 991px) {
    body.app-shell #sidebar,
    body.app-shell #sidebar > .theiaStickySidebar {
        position: static !important;
        top: auto !important;
        width: auto !important;
        height: auto !important;
        max-height: none !important;
        overflow: visible !important;
        transform: none !important;
    }
}

/* Correções globais dos modais Bootstrap — integradas em 2026-07-03 */
/*
 * Padronização global dos modais para Bootstrap 3.4.1.
 * Este arquivo deve ser carregado depois dos estilos específicos das páginas.
 */

:root {
    --pedeai-modal-gap-x: max(12px, env(safe-area-inset-left), env(safe-area-inset-right));
    --pedeai-modal-gap-y: max(12px, env(safe-area-inset-top), env(safe-area-inset-bottom));
}

/*
 * Reserva permanentemente o espaço da barra vertical. Assim, a abertura de
 * um modal não altera a largura útil da página, do cabeçalho ou da sidebar.
 */
html {
    scrollbar-gutter: stable;
}

/* O modal ocupa a viewport e fica acima de todo o conteúdo da página. */
.modal {
    position: fixed !important;
    inset: 0 !important;
    z-index: 2147482000 !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    padding: var(--pedeai-modal-gap-y) var(--pedeai-modal-gap-x) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    outline: 0;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
}

/*
 * O Bootstrap define display:block. Com o modal aberto, flex centraliza o
 * diálogo no espaço visível. Se a tela for baixa, o conteúdo continua dentro
 * da viewport e somente o corpo do modal ganha rolagem.
 */
.modal.in {
    display: flex !important;
    align-items: center;
    justify-content: center;
}

.modal-backdrop {
    position: fixed !important;
    inset: 0 !important;
    z-index: 2147481900 !important;
}

.modal-backdrop.in {
    opacity: .5;
}

/*
 * Mantém o trilho da barra da página no lugar durante o modal. O modal cobre
 * toda a viewport e contém o gesto de rolagem, portanto o fundo não se move.
 * O padding inline que o Bootstrap 3 adiciona ao body também é neutralizado,
 * evitando o salto lateral do cabeçalho e da sidebar.
 */
html.bootstrap-modal-open {
    overflow-y: scroll !important;
    overscroll-behavior: none;
}

body.modal-open {
    overflow: visible !important;
    padding-right: 0 !important;
    overscroll-behavior: none;
}

.modal-dialog {
    position: relative;
    flex: 0 1 600px;
    width: min(600px, 100%) !important;
    max-width: 100% !important;
    margin: auto !important;
}

.modal-dialog.modal-sm {
    flex-basis: 300px;
    width: min(300px, 100%) !important;
}

.modal-dialog.modal-lg {
    flex-basis: 900px;
    width: min(900px, 100%) !important;
}

.modal-content {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: 100%;
    max-height: calc(100vh - 24px);
    max-height: calc(100dvh - var(--pedeai-modal-gap-y) - var(--pedeai-modal-gap-y));
    overflow: hidden;
}

.modal-header,
.modal-footer {
    flex: 0 0 auto;
}

/*
 * Muitos formulários administrativos envolvem toda a estrutura do modal:
 * .modal-content > form > (.modal-header + .modal-body + .modal-footer).
 * Sem transformar esse form em um contêiner flexível, a altura máxima fica
 * presa no .modal-content e o .modal-body não recebe uma área rolável.
 */
.modal-content > form {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    width: 100%;
    min-width: 0;
    min-height: 0;
    max-height: inherit;
    margin: 0;
    overflow: hidden;
}

.modal-content > form > .modal-header,
.modal-content > form > .modal-footer {
    flex: 0 0 auto;
}

.modal-content > form > .modal-body {
    flex: 1 1 auto;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
}

.modal-body {
    flex: 1 1 auto;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    overflow-wrap: anywhere;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    -ms-overflow-style: none;
    scrollbar-width: none;
}

/* Mantém a rolagem dos modais, mas oculta visualmente suas barras. */
.modal,
.modal-dialog,
.modal-content,
.modal-body {
    -ms-overflow-style: none !important;
    scrollbar-width: none !important;
}

.modal::-webkit-scrollbar,
.modal-dialog::-webkit-scrollbar,
.modal-content::-webkit-scrollbar,
.modal-body::-webkit-scrollbar {
    width: 0 !important;
    height: 0 !important;
    display: none !important;
}

.modal-header .close {
    position: static;
    width: auto;
    height: auto;
    margin-top: -2px;
    line-height: 1;
}

/* Evita que a sidebar mude de posição enquanto um modal está aberto. */
@media (min-width: 992px) {
    body.modal-open.app-shell:not(.internal-page) #sidebar,
    body.modal-open.app-shell:not(.internal-page) #sidebar > .theiaStickySidebar {
        transform: none !important;
    }
}

@media (max-width: 767px) {
    :root {
        --pedeai-modal-gap-x: max(10px, env(safe-area-inset-left), env(safe-area-inset-right));
        --pedeai-modal-gap-y: max(10px, env(safe-area-inset-top), env(safe-area-inset-bottom));
    }

    .modal-dialog,
    .modal-dialog.modal-sm,
    .modal-dialog.modal-lg {
        flex-basis: 100%;
        width: 100% !important;
    }

    .modal-content {
        max-height: calc(100vh - 20px);
        max-height: calc(100dvh - var(--pedeai-modal-gap-y) - var(--pedeai-modal-gap-y));
    }
}

/* Em telas muito baixas, mantém uma margem mínima e aproveita toda a altura. */
@media (max-height: 520px) {
    :root {
        --pedeai-modal-gap-y: max(6px, env(safe-area-inset-top), env(safe-area-inset-bottom));
    }
}

/* Refinamento do painel de gestão do negócio — mobile-first — 2026-07-09 */
body.business-session.internal-page {
    background-color: #f4f6f8 !important;
}

body.business-session.internal-page .app-content {
    width: min(100%, 1180px);
    min-width: 0;
    margin-right: auto;
    margin-left: auto;
}

body.business-session.internal-page .app-include-content,
body.business-session.internal-page .app-include-content > * {
    min-width: 0;
}

body.business-session.internal-page .panel,
body.business-session.internal-page .box_style_1,
body.business-session.internal-page .box_style_2,
body.business-session.internal-page .white-box,
body.business-session.internal-page .white_bg {
    max-width: 100%;
    border-color: rgba(120, 130, 140, .16);
    border-radius: 12px;
    box-shadow: 0 10px 28px rgba(31, 45, 61, .06);
}

body.business-session.internal-page .panel-heading {
    min-height: 50px;
    overflow: visible;
}

body.business-session.internal-page .panel-heading::before,
body.business-session.internal-page .panel-heading::after {
    display: none;
}

body.business-session.internal-page .panel-heading .pull-right,
body.business-session.internal-page .box_style_2 .pull-right,
body.business-session.internal-page .white_bg .pull-right {
    display: flex;
    max-width: 100%;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
}

body.business-session.internal-page .app-include-content .form-control,
body.business-session.internal-page .app-include-content select.form-control,
body.business-session.internal-page .app-include-content input.form-control,
body.business-session.internal-page .app-include-content textarea.form-control {
    max-width: 100%;
    border-radius: 7px;
}

body.business-session.internal-page .app-include-content textarea.form-control {
    min-height: 110px;
}

body.business-session.internal-page .app-include-content .input-group {
    width: 100%;
}

body.business-session.internal-page .app-include-content .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    line-height: 1.3;
    white-space: normal;
}

body.business-session.internal-page .app-include-content .label,
body.business-session.internal-page .app-include-content .badge {
    display: inline-flex;
    max-width: 100%;
    align-items: center;
    white-space: normal;
    line-height: 1.25;
}

body.business-session.internal-page .app-include-content img,
body.business-session.internal-page .app-include-content canvas,
body.business-session.internal-page .app-include-content svg,
body.business-session.internal-page .app-include-content iframe {
    max-width: 100% !important;
}

body.business-session.internal-page .app-include-content .modal-content {
    border: 0;
    border-radius: 12px;
    overflow: hidden;
}

@media (max-width: 991px) {
    body.business-session.internal-page .app-content {
        width: 100% !important;
        margin-top: var(--pedeai-app-header-height);
        padding: 18px max(var(--pedeai-mobile-gutter), env(safe-area-inset-right)) 34px max(var(--pedeai-mobile-gutter), env(safe-area-inset-left));
    }

    body.business-session.internal-page .app-include-content > .container,
    body.business-session.internal-page .app-include-content > #contato_do_site > .container,
    body.business-session.internal-page .app-include-content > .contact-page > .container {
        padding-right: 0;
        padding-left: 0;
    }

    body.business-session.internal-page .app-include-content .row {
        min-width: 0;
    }

    body.business-session.internal-page .app-include-content [class*="col-"] {
        min-width: 0;
    }

    body.business-session.internal-page .panel,
    body.business-session.internal-page .box_style_1,
    body.business-session.internal-page .box_style_2,
    body.business-session.internal-page .white-box,
    body.business-session.internal-page .white_bg {
        margin-bottom: 16px;
        border-radius: 12px;
    }

    body.business-session.internal-page .panel-heading {
        display: flex;
        min-height: 0;
        padding: 14px 16px;
        flex-wrap: wrap;
        align-items: center;
        gap: 10px;
        line-height: 1.35;
    }

    body.business-session.internal-page .panel-heading > h1,
    body.business-session.internal-page .panel-heading > h2,
    body.business-session.internal-page .panel-heading > h3,
    body.business-session.internal-page .panel-heading > h4,
    body.business-session.internal-page .panel-heading > h5,
    body.business-session.internal-page .panel-heading > h6 {
        flex: 1 1 100%;
        margin: 0;
        line-height: 1.25;
    }

    body.business-session.internal-page .panel-heading .pull-right,
    body.business-session.internal-page .box_style_2 .pull-right,
    body.business-session.internal-page .white_bg .pull-right {
        width: 100%;
        margin-top: 8px;
        float: none !important;
        justify-content: flex-start;
    }

    body.business-session.internal-page .panel-body,
    body.business-session.internal-page .box_style_2,
    body.business-session.internal-page .white-box,
    body.business-session.internal-page .content section {
        padding: 16px;
    }

    body.business-session.internal-page .app-include-content .form-horizontal .control-label,
    body.business-session.internal-page .app-include-content .form-control-label {
        padding-top: 0;
        margin-bottom: 6px;
        text-align: left;
    }

    body.business-session.internal-page .app-include-content .form-group {
        margin-bottom: 16px;
    }

    body.business-session.internal-page .app-include-content .form-horizontal .form-group,
    body.business-session.internal-page .app-include-content .row.form-group {
        margin-right: 0;
        margin-left: 0;
    }

    body.business-session.internal-page .app-include-content .table-responsive,
    body.business-session.internal-page .app-include-content .mobile-table-scroll,
    body.business-session.internal-page .app-include-content .estat-table-wrap {
        margin-bottom: 16px;
        border-radius: 10px;
        box-shadow: inset 0 0 0 1px rgba(120, 130, 140, .12);
    }

    body.business-session.internal-page .app-include-content table.table:not(.table_summary):not(.cart-list),
    body.business-session.internal-page .app-include-content .table-responsive > table:not(.table_summary):not(.cart-list),
    body.business-session.internal-page .app-include-content .estat-table-wrap > table {
        min-width: 680px;
    }

    body.business-session.internal-page .app-include-content > table.table:not(.table_summary):not(.cart-list),
    body.business-session.internal-page .app-include-content .panel-body > table.table:not(.table_summary):not(.cart-list),
    body.business-session.internal-page .app-include-content .box_style_2 > table.table:not(.table_summary):not(.cart-list) {
        display: block;
        width: 100%;
        max-width: 100%;
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
    }

    body.business-session.internal-page .app-include-content .table > thead > tr > th,
    body.business-session.internal-page .app-include-content .table > tbody > tr > th,
    body.business-session.internal-page .app-include-content .table > tfoot > tr > th,
    body.business-session.internal-page .app-include-content .table > thead > tr > td,
    body.business-session.internal-page .app-include-content .table > tbody > tr > td,
    body.business-session.internal-page .app-include-content .table > tfoot > tr > td {
        vertical-align: middle;
        white-space: normal;
    }

    body.business-session.internal-page .app-include-content .modal-dialog {
        width: auto !important;
        max-width: min(620px, calc(100vw - 20px)) !important;
        margin: max(10px, env(safe-area-inset-top)) auto max(10px, env(safe-area-inset-bottom)) !important;
    }

    body.business-session.internal-page .app-include-content .modal-content,
    body.business-session.internal-page .app-include-content .modal-content form {
        max-height: calc(100vh - 20px);
        max-height: calc(100dvh - 20px);
    }

    body.business-session.internal-page .app-include-content .modal-content form {
        display: flex;
        min-height: 0;
        flex-direction: column;
    }

    body.business-session.internal-page .app-include-content .modal-body {
        min-height: 0;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }
}

@media (max-width: 767px) {
    body.business-session.internal-page .app-content {
        padding-top: 14px;
        padding-bottom: max(28px, env(safe-area-inset-bottom));
    }

    body.business-session.internal-page .app-include-content .alert {
        padding: 12px 38px 12px 14px;
        border-radius: 10px;
        line-height: 1.45;
        overflow-wrap: anywhere;
    }

    body.business-session.internal-page .app-include-content .alert .close {
        position: absolute;
        top: 8px;
        right: 8px;
        width: 28px;
        height: 28px;
        margin: 0;
        line-height: 28px;
        text-align: center;
    }

    body.business-session.internal-page .app-include-content .input-group {
        display: flex;
        align-items: stretch;
    }

    body.business-session.internal-page .app-include-content .input-group .form-control {
        width: 1%;
        flex: 1 1 auto;
    }

    body.business-session.internal-page .app-include-content .input-group-addon,
    body.business-session.internal-page .app-include-content .input-group-btn,
    body.business-session.internal-page .app-include-content .input-group-btn > .btn {
        width: auto;
        flex: 0 0 auto;
    }

    body.business-session.internal-page .app-include-content .btn-group,
    body.business-session.internal-page .app-include-content .table-actions,
    body.business-session.internal-page .app-include-content .form-actions,
    body.business-session.internal-page .app-include-content .export-actions {
        display: flex;
        width: 100%;
        flex-wrap: wrap;
        gap: 8px;
    }

    body.business-session.internal-page .app-include-content .btn-group > .btn,
    body.business-session.internal-page .app-include-content .table-actions > .btn,
    body.business-session.internal-page .app-include-content .form-actions > .btn,
    body.business-session.internal-page .app-include-content .export-actions > .btn {
        margin: 0 !important;
        flex: 1 1 auto;
    }

    body.business-session.internal-page .app-include-content .pagination {
        justify-content: center;
    }

    body.business-session.internal-page .app-include-content .modal-header,
    body.business-session.internal-page .app-include-content .modal-body,
    body.business-session.internal-page .app-include-content .modal-footer {
        padding-right: 16px;
        padding-left: 16px;
    }

    body.business-session.internal-page .app-include-content .modal-footer {
        display: flex;
        flex-direction: column;
        gap: 8px;
    }

    body.business-session.internal-page .app-include-content .modal-footer::before,
    body.business-session.internal-page .app-include-content .modal-footer::after {
        display: none;
    }

    body.business-session.internal-page .app-include-content .modal-footer .btn {
        width: 100%;
        margin: 0 !important;
    }
}

@media (max-width: 575px) {
    body.business-session.internal-page .panel-body,
    body.business-session.internal-page .box_style_2,
    body.business-session.internal-page .white-box,
    body.business-session.internal-page .content section {
        padding: 14px;
    }

    body.business-session.internal-page .app-include-content .btn:not(.btn-xs):not(.btn-sm),
    body.business-session.internal-page .app-include-content button.btn:not(.btn-xs):not(.btn-sm),
    body.business-session.internal-page .app-include-content input[type="submit"].btn:not(.btn-xs):not(.btn-sm) {
        width: 100%;
    }

    body.business-session.internal-page .app-include-content .btn-sm,
    body.business-session.internal-page .app-include-content .btn-xs {
        min-height: 36px;
    }
}
