/* ===== GESTOR LAYOUT ===== */
/*
* gestor.css só é carregado nas páginas autenticadas do Gestor. O viewport
* pertence ao shell do painel; a rolagem deve acontecer em .gestor-content
* ou no scroller interno de cada módulo, nunca em /.
*
* Os containers do shell usam overflow: clip (não hidden): hidden ainda é
* rolável por foco/scrollIntoView — focar um input escondido deslocava o
* conteúdo inteiro; clip torna o box de fato não-rolável.
*/
html {
width: 100%;
height: 100vh;
height: 100dvh;
max-height: 100dvh;
overflow: clip;
overscroll-behavior: none;
}
.gestor-body {
/*
* Cor visual única do Gestor. Os aliases legados continuam disponíveis
* somente para componentes ainda não migrados, sem herdar a cor da unidade.
*/
--ss-button-primary-bg: #5c6687;
--ss-button-secondary-bg: #878bb4;
--ss-action-bg: var(--ss-button-primary-bg);
--ss-action-bg-hover: color-mix(in srgb, var(--ss-action-bg) 86%, #000);
--ss-action-focus: color-mix(in srgb, var(--ss-action-bg) 22%, transparent);
--ss-primary: var(--ss-action-bg);
--ss-primary-dark: var(--ss-action-bg-hover);
--cor-unidade: var(--ss-action-bg);
--cor-unidade-clara: color-mix(in srgb, var(--ss-action-bg) 50%, transparent);
--ss-secondary-action-bg: #8b80b6;
--ss-secondary-action-hover: #7d72a7;
--ss-success-action-bg: #08b84f;
--ss-success-action-hover: #069f44;
--ss-modal-header-bg: #313548;
--ss-sidebar-bg: color-mix(in srgb, var(--ss-modal-header-bg) 90%, #fff);
--ss-sidebar-font-size: 12px;
--ss-workspace-frame-bg: #ededed;
--ss-workspace-surface-bg: #fff;
--ss-cards-listas-bg: #f7f9fc;
--ss-cards-listas-border: #cbd5e1;
--ss-workspace-radius: 12px;
--ss-workspace-gap: 14px;
--ss-button-height: 27px;
--ss-button-radius: 15px;
--ss-button-neutral-bg: #eee;
--ss-button-font-size: 12px;
--ss-button-action-min-width: 85px;
--ss-modal-primary-btn-bg: var(--ss-button-primary-bg);
--ss-modal-secondary-btn-bg: var(--ss-button-secondary-bg);
--ss-table-head-footer-bg: #b8bec9;
--ss-table-head-footer-color: #263142;
--ss-table-head-footer-border: #9199a7;
--ss-table-striped-bg: color-mix(in srgb, var(--ss-sidebar-bg) 7%, #fff);
--ss-table-hover-bg: color-mix(in srgb, var(--ss-sidebar-bg) 12%, #fff);
--ss-step-number-bg: #0011bc;
--ss-step-number-color: #fff;
/*
* Fonte única do visual dos controles convencionais do Gestor.
* Exceções funcionais devem declarar data-ss-control-visual="custom".
*/
--ss-control-height: 27px;
--ss-control-padding: 0.16rem 0.32rem;
--ss-control-border: rgb(242, 242, 242);
--ss-control-border-bottom: #b5b5b5;
--ss-control-border-bottom-width: 1px;
--ss-control-focus: #000099;
--ss-control-radius: 0;
--ss-control-background: #fff;
--ss-control-color: #000;
--ss-control-font: var(--ss-font);
--ss-control-font-size: 13px;
width: 100%;
height: 100vh;
height: 100dvh;
min-height: 0;
overflow: clip;
background: var(--ss-light);
}
/* Estado global de campos sem edição no Gestor. */
.gestor-body input:disabled:not([type="checkbox"]):not([type="radio"]):not([type="button"]):not([type="submit"]):not([type="reset"]):not([data-ss-control-visual="custom"]),
.gestor-body input[readonly]:not([type="checkbox"]):not([type="radio"]):not([type="button"]):not([type="submit"]):not([type="reset"]):not([data-ss-control-visual="custom"]),
.gestor-body textarea:disabled:not([data-ss-control-visual="custom"]),
.gestor-body textarea[readonly]:not([data-ss-control-visual="custom"]),
.gestor-body select:disabled:not([data-ss-control-visual="custom"]) {
background-color: #f2f2f2 !important;
color: #6b7280 !important;
opacity: 1;
}
/* QR Code e Configurações migrados do gestor legado */
.qr-single-panel{max-width:920px}.qr-preview-card{display:grid;grid-template-columns:minmax(220px,320px) 1fr;gap:2rem;align-items:center}.qr-preview-card img{display:block;width:100%;aspect-ratio:1;object-fit:contain;border:1px solid #e5e7eb;border-radius:18px;padding:.75rem;background:#fff}.qr-preview-card h2,.config-card h2,.integration-card h2{margin:.65rem 0 .35rem;font-size:1.05rem}.qr-preview-card p,.config-card-head p,.integration-card p{margin:0;color:#64748b}.qr-public-link{display:block;margin-top:1rem;overflow-wrap:anywhere}.qr-praca-section{margin-bottom:1rem}.qr-praca-head{display:flex;justify-content:space-between;align-items:end;gap:1rem;margin-bottom:1rem}.qr-praca-head small{color:#64748b;text-transform:uppercase;font-weight:700}.qr-praca-head h2{font-size:1.05rem;margin:.15rem 0}.qr-praca-head>span{color:#64748b;font-size:.84rem}.qr-mesas-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:.85rem}.qr-mesa-card{display:flex;flex-direction:column;align-items:center;gap:.65rem;padding:1rem;border:1px solid #e5e7eb;border-radius:16px;background:#fff}.qr-mesa-card img{width:130px;max-width:100%;aspect-ratio:1;object-fit:contain}
.config-grid{display:grid;gap:1rem}.config-card-head{display:flex;align-items:flex-start;gap:.8rem;margin-bottom:1.1rem}.config-card-head>span,.permissao-icon{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:12px;background:#eef2ff;color:var(--ss-action-bg,#4e73df);flex:0 0 auto}.config-card-head h2{margin:0}.config-card-head p{font-size:.85rem}.config-card label,.integration-card label{display:grid;gap:.35rem;color:#334155;font-size:.84rem;font-weight:600}.config-switch-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem 1.25rem;margin-top:1rem}.config-switch-grid .form-check{display:flex;align-items:center;gap:.55rem;margin:0;min-height:30px}.config-switch-grid .form-check-input{flex:0 0 auto;margin:0}.config-subtitle{font-size:.86rem;margin:1.25rem 0 .5rem;color:#475569}.config-dias{display:flex;flex-wrap:wrap;gap:.55rem}.config-dias label{position:relative}.config-dias input{position:absolute;opacity:0;pointer-events:none}.config-dias span{display:inline-flex;align-items:center;justify-content:center;width:48px;height:38px;border:1px solid #cbd5e1;border-radius:10px;background:#fff;font-weight:700;cursor:pointer}.config-dias input:checked+span{background:var(--ss-action-bg,#4e73df);border-color:var(--ss-action-bg,#4e73df);color:#fff}.permissoes-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:.85rem}.permissao-card{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1rem}.permissao-card>div:first-child{display:flex;align-items:center;gap:.75rem;min-width:0}.permissao-card strong,.permissao-card small{display:block}.permissao-card small{color:#64748b}.permissao-actions{display:flex;gap:.4rem}.permissao-tree ul{list-style:none;margin:.4rem 0;padding-left:1.35rem}.permissao-tree>ul{padding-left:0}.permissao-tree li{margin:.35rem 0}.permissao-tree label{display:inline-flex;align-items:center;gap:.35rem}.whatsapp-message-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.85rem}.whatsapp-message-grid label{padding:.8rem;border:1px solid #e5e7eb;border-radius:14px}.whatsapp-message-grid small{display:block;color:#64748b;font-weight:400;margin:.2rem 0 .5rem}
.integracoes-nav{display:flex;flex-wrap:nowrap;gap:.4rem;overflow-x:auto;padding:.25rem 0 .75rem;margin-bottom:.5rem}.integracoes-nav .nav-link{white-space:nowrap;border:1px solid #dbe3ef;background:#fff;color:#475569}.integracoes-nav .nav-link.active{background:var(--ss-action-bg,#4e73df);border-color:var(--ss-action-bg,#4e73df);color:#fff}.integracoes-content>.tab-pane{padding:.5rem 0}.integration-card-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.integration-card-wide{grid-column:1/-1}.integration-head{display:flex;align-items:center;gap:.75rem;margin-bottom:1rem}.integration-head h2{margin:0}.integration-head small{color:#64748b}.integration-logo{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:13px;background:#eef2ff;color:#334155;font-weight:800}.integration-logo.is-whatsapp{background:#dcfce7;color:#15803d}.integration-logo.is-ifood{background:#fee2e2;color:#b91c1c}.integration-logo.is-mp{background:#dbeafe;color:#1d4ed8}.integration-logo.is-meta{background:#dbeafe;color:#1877f2}.integration-logo.is-google{background:#f8fafc;color:#4285f4;border:1px solid #e5e7eb}.integration-logo.is-anota{background:#fef3c7;color:#92400e}.integration-status{margin-left:auto;padding:.25rem .6rem;border-radius:999px;background:#f1f5f9;color:#64748b;font-size:.74rem;font-weight:700}.integration-status.is-on{background:#dcfce7;color:#15803d}.integration-card form{display:grid;gap:.8rem;margin-top:1rem}.integration-details{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem;margin:0}.integration-details div{padding:.6rem;border:1px solid #e5e7eb;border-radius:10px}.integration-details dt{font-size:.75rem;color:#64748b}.integration-details dd{margin:0;overflow-wrap:anywhere}.integration-actions{display:flex;flex-wrap:wrap;gap:.55rem;margin-top:.25rem}.integration-payment-list{display:grid;gap:.55rem}.integration-payment-row{display:grid;grid-template-columns:minmax(180px,1fr) minmax(180px,260px) auto;align-items:center;gap:.75rem;padding:.7rem;border:1px solid #e5e7eb;border-radius:12px}.integration-payment-row.is-mp-row{grid-template-columns:minmax(160px,1fr) 150px 130px auto}.integration-payment-row strong,.integration-payment-row small{display:block}.integration-payment-row small{color:#64748b}
@media(max-width:767.98px){.qr-preview-card{grid-template-columns:1fr;text-align:center}.qr-preview-card>a{width:min(100%,280px);margin:auto}.config-switch-grid,.whatsapp-message-grid,.integration-card-grid{grid-template-columns:1fr}.integration-card-wide{grid-column:auto}.integration-payment-row,.integration-payment-row.is-mp-row{grid-template-columns:1fr;align-items:start}.integration-payment-row .form-switch{justify-self:start}.integration-details{grid-template-columns:1fr}.qr-mesas-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.qr-mesa-card{padding:.75rem}.qr-mesa-card img{width:110px}}
@media print{.gestor-sidebar,.gestor-topbar,.unidades-page-head,.qr-mesa-card .btn{display:none!important}.gestor-main,.gestor-content{margin:0!important;padding:0!important}.qr-mesas-grid{grid-template-columns:repeat(4,1fr)}.qr-praca-section{box-shadow:none!important;border:0!important;break-inside:avoid}.qr-mesa-card{break-inside:avoid}}
@media print {
html,
.gestor-body,
.gestor-layout,
.gestor-main,
.gestor-content {
height: auto !important;
max-height: none !important;
overflow: visible !important;
}
}
.gestor-layout {
display: flex;
width: 100%;
height: 100%;
min-height: 0;
position: relative;
overflow: clip;
}
/* Sidebar */
.gestor-sidebar {
width: var(--ss-sidebar-width, 220px);
position: fixed;
top: 0; left: 0; bottom: 0;
z-index: 1040;
display: flex;
flex-direction: column;
overflow: hidden;
transition: transform 0.25s ease;
border-right: 1px solid rgba(0,0,0,0.16);
background: var(--ss-sidebar-bg);
box-shadow: none;
font-family: var(--ss-font);
font-size: var(--ss-sidebar-font-size);
line-height: 1.42857143;
}
.sidebar-header {
display: flex;
align-items: center;
justify-content: space-between;
padding: 1rem 1.25rem;
border-bottom: 1px solid rgba(255,255,255,0.12);
}
.sidebar-header-brand {
justify-content: center;
padding: 0.85rem 1rem;
position: relative;
min-height: 84px;
}
.sidebar-brand-logo-action {
width: 58px !important;
height: 58px !important;
padding: 0 !important;
border: 0 !important;
border-radius: 50%;
background: transparent !important;
cursor: pointer;
display: inline-flex;
align-items: center;
justify-content: center;
flex: 0 0 58px;
color: #fff;
line-height: 0;
text-decoration: none;
overflow: hidden;
}
.sidebar-brand-logo {
width: 52px !important;
height: 52px !important;
min-width: 52px;
max-width: 52px;
border-radius: 50%;
background: #fff;
border: 2px solid #d1d5db;
display: inline-flex; align-items: center; justify-content: center;
font-size: 1.35rem;
color: #000;
overflow: hidden !important;
flex: 0 0 52px;
box-shadow: 0 4px 12px rgba(15,23,42,0.12);
transition: transform 0.15s, box-shadow 0.15s;
}
.sidebar-brand-logo-action:hover .sidebar-brand-logo,
.sidebar-brand-logo-action:focus-visible .sidebar-brand-logo {
transform: scale(1.04);
box-shadow: 0 0 0 3px rgba(15,23,42,0.1);
}
.sidebar-brand-logo-action:focus-visible { outline: 2px solid rgba(255,255,255,0.85); outline-offset: 4px; }
.sidebar-brand-logo img {
display: block;
width: 100% !important;
height: 100% !important;
max-width: 100% !important;
max-height: 100% !important;
border-radius: 50% !important;
object-fit: cover !important;
}
.btn-close-sidebar {
background: none;
border: none;
color: #fff;
font-size: 1.1rem;
cursor: pointer;
position: absolute;
right: 0.85rem;
top: 0.85rem;
}
.sidebar-search {
position: relative;
flex: 0 0 auto;
padding: 0.55rem 0.8rem 0.4rem;
border-bottom: 1px solid rgba(255,255,255,0.12);
background: var(--ss-sidebar-bg);
}
.sidebar-search i {
position: absolute;
left: 1.15rem;
top: 50%;
transform: translateY(-44%);
color: rgba(255,255,255,0.9);
font-size: 0.9rem;
pointer-events: none;
}
.sidebar-search-input {
width: 100%;
height: 34px;
padding: 0.35rem 0.65rem 0.35rem 2rem;
border: 1px solid rgba(255,255,255,0.26);
border-radius: 7px;
background: rgba(255,255,255,0.08);
color: #fff;
font: inherit;
outline: 0;
}
.sidebar-search-input::placeholder {
color: rgba(255,255,255,0.66);
}
.sidebar-search-input:focus {
border-color: rgba(255,255,255,0.62);
background: rgba(255,255,255,0.12);
box-shadow: 0 0 0 2px rgba(255,255,255,0.08);
}
.sidebar-nav {
flex: 1;
overflow-y: auto;
padding: 0.8rem 0.55rem;
background: var(--ss-sidebar-bg);
}
.sidebar-section-label {
display: flex;
align-items: center;
gap: 0.65rem;
width: calc(100% - 0.5rem);
text-transform: none;
font-size: var(--ss-sidebar-font-size);
font-weight: 400;
letter-spacing: 0;
color: #fff;
padding: 0.58rem 0.75rem;
margin: 0.15rem 0.25rem;
border: 0;
border-radius: 0.4rem;
background: transparent;
text-shadow: none;
cursor: pointer;
text-align: left;
}
.sidebar-section-label,
.sidebar-section-label span,
.sidebar-section-label i,
.sidebar-link,
.sidebar-link span,
.sidebar-link i {
color: #fff !important;
opacity: 1 !important;
-webkit-text-fill-color: #fff !important;
}
.sidebar-section-label i { font-size: 0.9rem; }
.sidebar-section-label.active { color: #fff; }
.sidebar-section-label:hover {
background: rgba(255,255,255,0.09);
}
.sidebar-section-label .sidebar-collapse-icon {
margin-left: auto;
width: auto;
flex: 0 0 auto;
font-size: 0.78rem;
opacity: 0.85;
transition: transform 0.16s ease;
}
.sidebar-section-label.is-open .sidebar-collapse-icon {
transform: rotate(180deg);
}
.sidebar-submenu {
margin: 0.2rem 0 0.65rem 0;
padding: 0.1rem 0 0.1rem 2.55rem;
}
.sidebar-submenu[hidden] { display: none !important; }
.sidebar-sublink {
min-height: 36px;
padding: 0.43rem 0.65rem !important;
margin: 0;
border-radius: 0;
font-size: var(--ss-sidebar-font-size);
font-weight: 400;
color: rgba(255,255,255,0.78) !important;
-webkit-text-fill-color: rgba(255,255,255,0.78) !important;
background: transparent !important;
box-shadow: none !important;
}
.sidebar-sublink i { display: none; }
/* Cabeçalho de subgrupo dentro de um submenu (ex.: "Financeiro"/"Vendas"/"Estoque" dentro de Relatórios) */
.sidebar-subgroup-label {
display: block;
padding: 0.5rem 0.65rem 0.15rem;
font-size: 0.72rem;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.03em;
color: rgba(255,255,255,0.5);
}
.sidebar-subgroup-label:first-child { padding-top: 0.1rem; }
.sidebar-subsublink { padding-left: 1rem !important; }
/* Itens de menu que só fazem sentido no desktop (grids largos, ex.: Análise de Preços) */
@media (max-width: 991.98px) {
.sidebar-link-desktop { display: none !important; }
}
.sidebar-sublink span {
color: rgba(255,255,255,0.78) !important;
-webkit-text-fill-color: rgba(255,255,255,0.78) !important;
}
.sidebar-sublink:hover,
.sidebar-sublink.active {
color: #fff !important;
-webkit-text-fill-color: #fff !important;
background: rgba(255,255,255,0.12) !important;
}
.sidebar-sublink:hover span,
.sidebar-sublink.active span {
color: #fff !important;
-webkit-text-fill-color: #fff !important;
}
.sidebar-link {
display: flex;
align-items: center;
gap: 0.65rem;
padding: 0.58rem 0.75rem;
color: #fff;
border-radius: 0.4rem;
margin: 0.15rem 0.25rem;
font-size: var(--ss-sidebar-font-size);
font-weight: 400;
transition: all 0.15s;
}
.sidebar-link i { font-size: 1.05rem; width: 1.4rem; text-align: center; }
.sidebar-link:hover {
background: rgba(255,255,255,0.1);
color: #fff;
}
.sidebar-link.active {
background: rgba(255,255,255,0.18);
color: #fff !important;
box-shadow: none;
}
.sidebar-link.active span,
.sidebar-link.active i {
color: #fff !important;
-webkit-text-fill-color: #fff !important;
}
.sidebar-link.disabled {
opacity: 0.5;
pointer-events: none;
}
.sidebar-link .badge { font-size: 0.6rem; }
@media (min-width: 992px) {
.gestor-sidebar {
width: var(--ss-sidebar-collapsed-width, 64px) !important;
transition: width 0.18s ease, box-shadow 0.18s ease;
}
.gestor-sidebar:is(:hover, :has(:focus-visible)) {
width: var(--ss-sidebar-width, 220px) !important;
box-shadow: 10px 0 24px rgba(15,23,42,0.16);
}
.gestor-main {
margin-left: var(--ss-sidebar-collapsed-width, 64px) !important;
transition: none;
}
.sidebar-header {
padding-left: 3px !important;
padding-right: 3px !important;
}
.gestor-sidebar:is(:hover, :has(:focus-visible)) .sidebar-header {
padding-left: 0.85rem !important;
padding-right: 0.85rem !important;
}
.sidebar-search {
padding-left: 0.65rem;
padding-right: 0.65rem;
}
.sidebar-search i {
left: 50%;
transform: translate(-50%, -44%);
transition: left 0.18s ease, transform 0.18s ease;
}
.sidebar-search-input {
opacity: 0;
pointer-events: none;
visibility: hidden;
}
.gestor-sidebar:is(:hover, :has(:focus-visible)) .sidebar-search {
padding-left: 0.8rem;
padding-right: 0.8rem;
}
.gestor-sidebar:is(:hover, :has(:focus-visible)) .sidebar-search i {
left: 1.15rem;
transform: translateY(-44%);
}
.gestor-sidebar:is(:hover, :has(:focus-visible)) .sidebar-search-input {
opacity: 1;
pointer-events: auto;
visibility: visible;
}
.sidebar-nav {
overflow-x: hidden;
padding-left: 0.3rem;
padding-right: 0.3rem;
transition: padding 0.18s ease;
}
.gestor-sidebar:is(:hover, :has(:focus-visible)) .sidebar-nav {
padding-left: 0.55rem;
padding-right: 0.55rem;
}
.sidebar-link,
.sidebar-section-label {
justify-content: center;
gap: 0;
padding-left: 0.55rem !important;
padding-right: 0.55rem !important;
white-space: nowrap;
}
.gestor-sidebar:is(:hover, :has(:focus-visible)) .sidebar-link,
.gestor-sidebar:is(:hover, :has(:focus-visible)) .sidebar-section-label {
justify-content: flex-start;
gap: 0.65rem;
padding-left: 0.75rem !important;
padding-right: 0.75rem !important;
}
.gestor-sidebar:not(:hover):not(:has(:focus-visible)) .sidebar-submenu {
display: none !important;
}
.gestor-sidebar:is(:hover, :has(:focus-visible)) .sidebar-submenu.is-open:not([hidden]) {
display: block !important;
}
.sidebar-sublink {
padding-left: 0.65rem !important;
padding-right: 0.65rem !important;
}
.sidebar-link i,
.sidebar-section-label i {
flex: 0 0 1.4rem;
width: 1.4rem;
text-align: center;
}
.sidebar-link span,
.sidebar-section-label span {
display: inline-block;
max-width: 0;
overflow: hidden;
opacity: 0 !important;
visibility: hidden;
white-space: nowrap;
}
.sidebar-section-label .sidebar-collapse-icon {
display: none;
}
.gestor-sidebar:is(:hover, :has(:focus-visible)) .sidebar-link span,
.gestor-sidebar:is(:hover, :has(:focus-visible)) .sidebar-section-label span {
max-width: 155px;
opacity: 1 !important;
visibility: visible;
text-overflow: ellipsis;
}
.gestor-sidebar:is(:hover, :has(:focus-visible)) .sidebar-section-label .sidebar-collapse-icon {
display: inline-block;
}
}
.sidebar-backdrop {
display: none;
position: fixed;
inset: 0;
background: rgba(0,0,0,0.5);
z-index: 1035;
}
.sidebar-backdrop.show { display: block; }
/* Main */
.gestor-main {
flex: 1;
margin-left: var(--ss-sidebar-width, 220px);
display: flex;
flex-direction: column;
height: 100vh;
height: 100dvh;
min-width: 0;
min-height: 0;
}
/* Topbar */
.gestor-topbar {
height: 66px;
background: #fff;
border-bottom: 1px solid #e3e6f0;
display: flex;
align-items: center;
padding: 0 1rem;
gap: 0.75rem;
position: sticky;
top: 0;
z-index: 1020;
box-shadow: 0 4px 18px rgba(15,23,42,0.05);
}
.gestor-topbar::before { content: none; display: none; }
.topbar-title {
font-weight: 600;
color: #1f2937;
align-items: center;
}
.topbar-context {
display: flex;
align-items: center;
gap: 0.75rem;
min-width: 0;
}
.topbar-menu-btn,
.topbar-user-btn {
background: #fff;
border-color: #e5e7eb;
color: #374151;
}
.topbar-menu-btn:hover,
.topbar-menu-btn:focus,
.topbar-user-btn:hover,
.topbar-user-btn:focus,
.topbar-user-btn.show {
background: #fff !important;
border-color: #d1d5db !important;
color: #374151 !important;
}
.topbar-unidade-chip {
display: inline-flex;
align-items: center;
gap: 0.5rem;
min-height: 38px;
max-width: min(420px, 52vw);
background: #fff;
color: #111827 !important;
border: 1px solid rgba(17,24,39,0.14);
padding: 0.32rem 0.68rem 0.32rem 0.38rem;
border-radius: 999px;
cursor: pointer;
box-shadow: 0 8px 22px rgba(15,23,42,0.08);
transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}
.topbar-unidade-chip:hover {
background: #fff !important;
border-color: rgba(17,24,39,0.14) !important;
color: #111827 !important;
box-shadow: 0 8px 22px rgba(15,23,42,0.08);
}
.topbar-unidade-icon {
width: 28px;
height: 28px;
border-radius: 50%;
background: var(--cor-unidade, #2d3142);
color: #fff;
display: inline-flex;
align-items: center;
justify-content: center;
flex: 0 0 auto;
overflow: hidden;
font-size: 0.86rem;
}
.topbar-unidade-icon img {
display: block;
width: 28px;
height: 28px;
max-width: 28px;
max-height: 28px;
object-fit: cover;
border-radius: 50%;
}
.topbar-unidade-text {
display: flex;
flex-direction: column;
align-items: flex-start;
min-width: 0;
line-height: 1.05;
}
.topbar-unidade-name {
max-width: 310px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
font-size: 0.86rem;
font-weight: 700;
}
.topbar-unidade-arrow { opacity: 0.65; flex: 0 0 auto; color: #374151; }
.topbar-actions {
align-items: center;
display: flex;
gap: 0.5rem;
min-width: 0;
flex-wrap: nowrap;
white-space: nowrap;
}
.topbar-actions > .dropdown {
align-items: center;
display: flex;
}
.gestor-body .dropdown-menu .dropdown-item,
.gestor-body .dropdown-menu .dropdown-item-text {
font-size: var(--ss-sidebar-font-size) !important;
}
.topbar-action-btn,
.topbar-profile-btn {
align-items: center;
border: 1px solid #e5e7eb;
border-radius: 999px;
gap: 0.45rem;
height: 38px;
justify-content: center;
line-height: 1;
margin: 0;
min-height: 38px;
padding: 0.25rem 0.72rem 0.25rem 0.3rem;
vertical-align: middle;
white-space: nowrap;
}
/* Os botões globais usam 27px; os avatares precisam caber dentro dessa altura. */
.gestor-body .topbar-action-btn,
.gestor-body .topbar-profile-btn {
height: 27px;
min-height: 27px;
gap: 0.3rem;
padding: 0.12rem 0.55rem 0.12rem 0.22rem;
font-size: 0.72rem;
}
.topbar-action-btn > span:not(.avatar-circle),
.topbar-profile-btn > span:not(.avatar-circle) {
line-height: 1;
}
.topbar-profile-btn.dropdown-toggle::after {
margin-left: 0.05rem;
vertical-align: 0.1em;
}
.topbar-relatorios-menu {
max-height: 70vh;
overflow-y: auto;
min-width: 220px;
}
.topbar-relatorios-menu .dropdown-header {
font-size: 0.7rem;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.03em;
}
.topbar-relatorios-menu .dropdown-item {
font-size: var(--ss-sidebar-font-size);
}
.topbar-avisos-icon {
position: relative;
}
.topbar-avisos-badge {
position: absolute;
top: -2px;
right: -2px;
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 16px;
height: 16px;
padding: 0 3px;
border: 2px solid #fff;
border-radius: 999px;
background: #ef4444;
color: #fff;
font-size: 9px;
font-weight: 900;
line-height: 1;
box-shadow: 0 2px 5px rgba(127, 29, 29, 0.32);
}
.avisos-painel {
--bs-offcanvas-width: min(420px, calc(100vw - 24px));
top: 12px !important;
right: 12px !important;
bottom: 12px !important;
height: auto !important;
overflow: hidden;
border: 1px solid #e2e8f0;
border-radius: 14px;
box-shadow: 0 16px 40px rgba(15, 23, 42, 0.18);
}
.avisos-painel .offcanvas-header {
padding: 0.9rem 1rem;
border-bottom: 1px solid #eef1f5;
}
.avisos-painel .btn-close {
opacity: 0.85;
}
.avisos-painel .btn-close:hover {
opacity: 1;
}
.avisos-painel .offcanvas-body {
display: grid;
align-content: start;
gap: 0.5rem;
padding: 0.75rem;
overflow-x: hidden;
}
.avisos-item {
display: flex;
align-items: flex-start;
gap: 0.7rem;
padding: 0.75rem;
border: 1px solid #e5e7eb;
border-radius: 10px;
color: inherit;
text-decoration: none;
transition: border-color 0.12s, box-shadow 0.12s;
}
.avisos-item:hover {
border-color: #cbd5e1;
box-shadow: 0 3px 10px rgba(15, 23, 42, 0.08);
color: inherit;
}
.avisos-item-icone {
display: grid;
flex: 0 0 38px;
width: 38px;
height: 38px;
place-items: center;
border-radius: 10px;
background: #fef3c7;
color: #b45309;
font-size: 0.95rem;
}
.avisos-item.is-danger .avisos-item-icone {
background: #fee2e2;
color: #b91c1c;
}
.avisos-item.is-info .avisos-item-icone {
background: #e0f2fe;
color: #0369a1;
}
.avisos-item-texto {
display: grid;
gap: 2px;
min-width: 0;
}
.avisos-item-numero {
color: #dc2626;
font-weight: 900;
}
.avisos-item-linha-ponto {
display: inline-block;
width: 7px;
height: 7px;
margin-right: 5px;
border-radius: 50%;
background: #94a3b8;
vertical-align: middle;
}
.avisos-item-linha-ponto.is-danger {
background: #dc2626;
}
.avisos-item-linha-ponto.is-warning {
background: #eab308;
}
.avisos-item-linha-ponto.is-info {
background: #0369a1;
}
.avisos-item-nota {
margin: 1px 0 3px;
color: #b45309;
font-size: 0.72rem;
font-weight: 700;
}
.avisos-item-destaque {
margin: 2px 0 5px;
padding: 7px 10px;
border: 1px solid #fecaca;
border-radius: 8px;
background: linear-gradient(135deg, #fef2f2, #fee2e2);
color: #991b1b;
font-size: 0.78rem;
font-weight: 700;
line-height: 1.4;
}
.avisos-item-destaque-valor {
font-size: 1rem;
font-weight: 900;
color: #dc2626;
}
.avisos-item-ranking {
margin: 1px 0 4px;
}
.avisos-item-ranking > small {
display: block;
margin-bottom: 2px;
color: #64748b;
font-size: 0.68rem;
font-weight: 800;
text-transform: uppercase;
letter-spacing: 0.02em;
}
.avisos-item-ranking > ol {
display: grid;
gap: 2px;
margin: 0;
padding: 0;
list-style: none;
}
.avisos-item-ranking li {
display: flex;
align-items: center;
gap: 6px;
min-width: 0;
padding: 3px 6px;
border-radius: 6px;
background: #f8fafc;
}
.avisos-ranking-posicao {
display: grid;
flex: 0 0 16px;
width: 16px;
height: 16px;
place-items: center;
border-radius: 50%;
background: #e2e8f0;
color: #475569;
font-size: 0.62rem;
font-weight: 800;
}
.avisos-ranking-nome {
flex: 1 1 auto;
min-width: 0;
overflow: hidden;
color: #334155;
font-size: 0.72rem;
font-weight: 600;
text-overflow: ellipsis;
white-space: nowrap;
}
.avisos-ranking-valor {
flex: 0 0 auto;
color: #dc2626;
font-size: 0.74rem;
font-weight: 800;
}
.avisos-vazio {
padding: 1.5rem 1rem;
color: #94a3b8;
font-size: 0.8rem;
text-align: center;
}
/* Central de operação: prioridade, impacto e ação precisam ser lidos nessa ordem. */
.avisos-painel {
--bs-offcanvas-width: min(430px, calc(100vw - 24px));
}
.avisos-painel .offcanvas-header {
align-items: flex-start;
background: #fff;
max-width: 100%;
min-width: 0;
overflow: hidden;
}
.avisos-painel-titulo h5 {
margin: 0;
color: #172033;
font-size: 1.05rem;
font-weight: 850;
}
.avisos-painel-titulo h5 i {
color: #dc2626;
}
.avisos-painel-titulo small {
display: block;
margin-top: 2px;
color: #64748b;
font-size: 0.73rem;
}
.avisos-painel .offcanvas-body {
display: block;
padding: 0.75rem;
background: #f8fafc;
}
.avisos-resumo {
display: flex;
align-items: center;
justify-content: space-between;
gap: 0.75rem;
margin-bottom: 0.55rem;
padding: 0.6rem 0.7rem;
border: 1px solid #dbe3ee;
border-radius: 10px;
background: #fff;
}
.avisos-resumo > div {
min-width: 0;
}
.avisos-resumo > div > span {
display: block;
color: #334155;
font-size: 0.74rem;
font-weight: 800;
}
.avisos-resumo-niveis {
display: flex;
flex-wrap: wrap;
gap: 0.28rem 0.7rem;
margin-top: 3px;
font-size: 0.72rem;
}
.avisos-resumo-niveis .is-critica {
color: #b91c1c;
}
.avisos-resumo-niveis .is-alta {
color: #b45309;
}
.avisos-resumo-niveis .is-atencao {
color: #0369a1;
}
.avisos-resumo small {
display: block;
margin-top: 3px;
color: #94a3b8;
font-size: 0.66rem;
}
.avisos-atualizar {
display: inline-grid;
flex: 0 0 auto;
min-width: 32px;
min-height: 32px;
place-items: center;
padding: 0.35rem 0.6rem;
border: 1px solid #cbd5e1;
border-radius: 8px;
background: #fff;
color: #475569;
font-size: 0.72rem;
font-weight: 800;
}
.avisos-atualizar:hover {
border-color: #94a3b8;
color: #0f172a;
}
.avisos-lista {
display: grid;
gap: 0.5rem;
}
.avisos-item {
position: relative;
display: grid;
grid-template-columns: 34px minmax(0, 1fr) auto;
align-items: center;
gap: 0.75rem;
padding: 0.78rem 0.82rem;
border: 1px solid #dbe3ee;
border-left-width: 4px;
border-radius: 11px;
background: #fff;
box-shadow: 0 2px 7px rgba(15, 23, 42, 0.04);
}
.avisos-item:hover {
border-color: #cbd5e1;
box-shadow: 0 4px 12px rgba(15, 23, 42, 0.08);
}
.avisos-item.is-urgencia-critica {
border-left-color: #dc2626;
background: #fffafa;
}
.avisos-item.is-urgencia-alta {
border-left-color: #f59e0b;
background: #fffdf8;
}
.avisos-item.is-urgencia-atencao {
border-left-color: #0284c7;
background: #fafdff;
}
.avisos-item-mensagem {
display: block;
width: 100%;
max-width: 100%;
min-width: 0;
color: #263247;
font-size: 0.84rem;
font-weight: 780;
line-height: 1.38;
overflow-wrap: anywhere;
white-space: normal !important;
}
.avisos-item-conteudo {
display: grid;
width: 100%;
max-width: 100%;
min-width: 0;
gap: 0.38rem;
overflow: hidden;
white-space: normal !important;
}
.avisos-item-badge-financeiro {
display: block;
width: 100%;
max-width: 100%;
box-sizing: border-box;
padding: 0.3rem 0.48rem;
border: 1px solid #fecaca;
border-radius: 6px;
background: #fee2e2;
color: #991b1b;
font-size: 0.68rem;
font-weight: 750;
line-height: 1.25;
overflow-wrap: anywhere;
white-space: normal !important;
word-break: normal;
}
.avisos-item-badge-financeiro strong {
margin: 0 0.18rem;
color: #dc2626;
font-size: 0.76rem;
font-weight: 950;
}
.avisos-item-mensagem .avisos-item-numero {
color: #dc2626;
font-size: 0.98rem;
font-weight: 950;
}
.avisos-item > i {
color: #315fcb;
font-size: 0.72rem;
}
.avisos-item .avisos-item-icone {
width: 34px;
height: 34px;
flex-basis: 34px;
}
.avisos-item .avisos-item-icone.is-ifood {
background: transparent;
}
.avisos-item .avisos-item-icone.is-ifood img {
display: block;
width: 32px;
height: auto;
}
.avisos-item.is-urgencia-critica .avisos-item-icone {
background: #fee2e2;
color: #b91c1c;
}
.avisos-item.is-urgencia-alta .avisos-item-icone {
background: #fef3c7;
color: #b45309;
}
.avisos-item.is-urgencia-atencao .avisos-item-icone {
background: #e0f2fe;
color: #0369a1;
}
.avisos-item.is-urgencia-critica .avisos-item-icone.is-ifood,
.avisos-item.is-urgencia-alta .avisos-item-icone.is-ifood,
.avisos-item.is-urgencia-atencao .avisos-item-icone.is-ifood {
background: transparent;
}
.avisos-item-texto {
display: grid;
gap: 0.25rem;
}
.avisos-item-cabecalho {
display: flex;
align-items: flex-start;
justify-content: space-between;
gap: 0.5rem;
}
.avisos-item-cabecalho > strong {
color: #172033;
font-size: 0.84rem;
line-height: 1.25;
}
.avisos-item-urgencia {
flex: 0 0 auto;
padding: 3px 6px;
border-radius: 999px;
font-size: 0.59rem;
font-weight: 900;
letter-spacing: 0.035em;
line-height: 1;
}
.avisos-item-urgencia.is-critica {
background: #fee2e2;
color: #b91c1c;
}
.avisos-item-urgencia.is-alta {
background: #fef3c7;
color: #92400e;
}
.avisos-item-urgencia.is-atencao {
background: #e0f2fe;
color: #0369a1;
}
.avisos-item-impacto {
color: #334155;
font-size: 0.72rem;
font-weight: 650;
line-height: 1.35;
}
.avisos-item-linhas {
display: grid;
gap: 0.18rem;
padding-top: 0.05rem;
}
.avisos-item-linhas > span {
color: #526075;
font-size: 0.72rem;
font-weight: 650;
line-height: 1.32;
overflow-wrap: anywhere;
}
.avisos-item-nota {
margin: 0;
padding: 0.42rem 0.5rem;
border-radius: 6px;
background: #f8fafc;
color: #64748b;
font-size: 0.67rem;
font-weight: 600;
line-height: 1.35;
}
.avisos-item-destaque {
margin: 0;
}
.avisos-item-acao {
display: inline-flex;
align-items: center;
justify-content: flex-start;
gap: 0.55rem;
width: max-content;
max-width: 100%;
margin-top: 0.08rem;
padding: 0.34rem 0.5rem;
border-radius: 6px;
background: #eef3ff;
color: #315fcb;
font-size: 0.68rem;
font-weight: 850;
line-height: 1.2;
text-decoration: none;
}
.avisos-item-acao:hover {
background: #dfe8ff;
color: #244da8;
}
.avisos-item-acao i {
flex: 0 0 auto;
font-size: 0.65rem;
}
.avisos-erro {
display: grid;
grid-template-columns: auto 1fr auto;
align-items: center;
gap: 0.5rem;
margin-bottom: 0.65rem;
padding: 0.65rem 0.7rem;
border: 1px solid #fecaca;
border-radius: 9px;
background: #fef2f2;
color: #991b1b;
font-size: 0.7rem;
font-weight: 700;
line-height: 1.35;
}
.avisos-erro button {
padding: 0.32rem 0.48rem;
border: 1px solid #fca5a5;
border-radius: 6px;
background: #fff;
color: #991b1b;
font-size: 0.66rem;
font-weight: 850;
}
.avisos-vazio {
display: grid;
justify-items: center;
gap: 0.35rem;
padding: 2.25rem 1rem;
border: 1px dashed #cbd5e1;
border-radius: 10px;
background: #effaf4;
border-color: #bfe7d2;
}
.avisos-vazio > i {
margin-bottom: 0.2rem;
color: #16a34a;
font-size: 1.5rem;
}
.avisos-vazio > strong {
color: #334155;
font-size: 0.83rem;
}
.avisos-vazio > span {
color: #64748b;
font-size: 0.72rem;
}
.avisos-vazio .avisos-atualizar {
margin-top: 0.4rem;
}
@media (max-width: 575.98px) {
.avisos-painel {
--bs-offcanvas-width: calc(100vw - 12px);
top: 6px !important;
right: 6px !important;
bottom: 6px !important;
}
.avisos-item {
grid-template-columns: 34px minmax(0, 1fr) auto;
gap: 0.65rem;
padding: 0.72rem;
}
.avisos-item-icone {
width: 34px;
height: 34px;
flex-basis: 34px;
}
.avisos-erro {
grid-template-columns: auto 1fr;
}
.avisos-erro button {
grid-column: 1 / -1;
}
}
/* Configuração isolada dos provedores SmartTEF (sem efeitos nas telas de venda). */
.smarttef-page .config-standard-body{display:grid;gap:14px}.smarttef-scope-note{display:flex;align-items:flex-start;gap:9px;margin:0;font-size:.79rem}.smarttef-scope-note>i{margin-top:2px}.smarttef-provider-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.smarttef-provider-card.nav-link{display:grid;grid-template-columns:42px minmax(0,1fr);grid-template-rows:auto auto;align-items:center;gap:2px 10px;min-width:0;padding:11px;border:1px solid #dfe7f2;border-radius:13px;background:#fff;color:#1f2937;text-align:left;box-shadow:none}.smarttef-provider-card.nav-link:hover{border-color:#aebbd0;background:#f9fbff}.smarttef-provider-card.nav-link.active{border-color:#5d6b92;background:#f4f6ff;color:#172033;box-shadow:0 0 0 2px rgba(93,107,146,.1)}.smarttef-brand{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:#edf2f7;color:#334155;font-size:.76rem;font-weight:900;letter-spacing:-.02em}.smarttef-provider-card .smarttef-brand{grid-row:1/3}.smarttef-brand.is-itau{background:#ff7a00;color:#fff}.smarttef-brand.is-mp{background:#dff4ff;color:#008ad6}.smarttef-brand.is-pagbank{background:#b9ff39;color:#172400}.smarttef-brand.is-stone{background:#00a868;color:#fff}.smarttef-brand.is-cielo{background:#e7f7fb;color:#0099bd}.smarttef-brand.is-rede{background:#ff7a1a;color:#fff}.smarttef-provider-copy{display:grid;min-width:0}.smarttef-provider-copy strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.79rem}.smarttef-provider-copy small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#78869b;font-size:.65rem}.smarttef-provider-state{display:flex;align-items:center;gap:5px;color:#94a3b8;font-size:.62rem;font-weight:800;text-transform:uppercase}.smarttef-provider-state i{font-size:.42rem}.smarttef-provider-state.is-ready{color:#2563eb}.smarttef-provider-state.is-active{color:#15803d}.smarttef-provider-content{min-width:0}.smarttef-provider-content>.tab-pane{outline:0}.smarttef-connection-row{margin-top:11px}.smarttef-connection-row .integration-channel-copy>i{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:#eef3fa;color:#52617b}.smarttef-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.smarttef-terminal-block{padding:12px;border:1px solid #e3eaf3;border-radius:13px;background:#f9fbfe}.smarttef-terminal-head{margin-bottom:10px}.smarttef-terminal-search{display:grid;grid-template-columns:minmax(0,1fr) max-content;align-items:end;gap:8px}.smarttef-terminal-details{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin-top:9px}.smarttef-terminal-details>span{display:grid;gap:2px;padding:8px 10px;border:1px solid #e3eaf3;border-radius:10px;background:#fff}.smarttef-terminal-details small{color:#7b8799;font-size:.63rem;font-weight:700;text-transform:uppercase}.smarttef-terminal-details strong{overflow-wrap:anywhere;color:#334155;font-size:.72rem}.smarttef-terminal-details strong.is-pdv{color:#15803d}.smarttef-terminal-details strong.is-standalone{color:#b45309}.smarttef-form-actions{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:11px;border-top:1px solid #e7edf5}.smarttef-awaiting{display:flex;align-items:flex-start;gap:8px;margin-top:12px;padding:9px;border:1px solid #e2e8f0;border-radius:10px;background:#f8fafc;color:#64748b;font-size:.67rem;line-height:1.45}.smarttef-awaiting i{margin-top:2px;color:#94a3b8}
@media(max-width:1100px){.smarttef-provider-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.smarttef-provider-grid,.smarttef-form-grid,.smarttef-terminal-details{grid-template-columns:1fr}.smarttef-terminal-search{grid-template-columns:1fr}.smarttef-terminal-search .btn{width:100%}.smarttef-form-actions{align-items:stretch;flex-direction:column}.smarttef-form-actions .integration-actions,.smarttef-form-actions .integration-actions .btn{width:100%}}
@media(max-width:430px){.smarttef-provider-grid{grid-template-columns:1fr}.smarttef-provider-card.nav-link{grid-template-columns:38px minmax(0,1fr)}.smarttef-provider-card .smarttef-brand{width:38px;height:38px}.smarttef-page .config-standard-body{gap:10px}}
.topbar-print-client-btn,
.topbar-caixa-btn,
.topbar-whatsapp-btn,
.topbar-install-btn,
.topbar-admin-voltar-btn,
.topbar-relatorios-btn {
font-size: 0.86rem;
font-weight: 800;
}
.topbar-print-client-btn:hover,
.topbar-print-client-btn:focus,
.topbar-caixa-btn:hover,
.topbar-caixa-btn:focus,
.topbar-whatsapp-btn:hover,
.topbar-whatsapp-btn:focus,
.topbar-install-btn:hover,
.topbar-install-btn:focus,
.topbar-admin-voltar-btn:hover,
.topbar-admin-voltar-btn:focus,
.topbar-relatorios-btn:hover,
.topbar-relatorios-btn:focus {
background: #fff;
border-color: #d1d5db;
color: #111827;
outline: 0;
}
.topbar-print-client-icon,
.topbar-caixa-icon,
.topbar-whatsapp-icon,
.topbar-install-icon,
.topbar-admin-voltar-icon,
.topbar-avisos-icon,
.topbar-profile-avatar {
align-items: center;
background: #64748b;
border-radius: 50% !important;
color: #fff;
display: inline-flex;
flex: 0 0 28px;
height: 28px !important;
justify-content: center;
line-height: 1;
max-height: 28px;
max-width: 28px;
min-height: 28px;
min-width: 28px;
margin: 0 !important;
padding: 0;
width: 28px !important;
}
.topbar-relatorios-icon {
align-items: center;
background: #64748b !important;
border-radius: 50% !important;
color: #fff;
display: inline-flex;
flex: 0 0 28px;
height: 28px !important;
justify-content: center;
line-height: 1;
max-height: 28px;
max-width: 28px;
min-height: 28px;
min-width: 28px;
margin: 0 !important;
padding: 0;
width: 28px !important;
}
.gestor-body .topbar-print-client-icon,
.gestor-body .topbar-caixa-icon,
.gestor-body .topbar-whatsapp-icon,
.gestor-body .topbar-install-icon,
.gestor-body .topbar-admin-voltar-icon,
.gestor-body .topbar-avisos-icon,
.gestor-body .topbar-profile-avatar {
width: 20px !important;
min-width: 20px;
max-width: 20px;
height: 20px !important;
min-height: 20px;
max-height: 20px;
flex-basis: 20px;
font-size: 0.65rem;
}
.gestor-body .topbar-relatorios-icon {
width: 16px !important;
min-width: 16px !important;
max-width: 16px !important;
height: 16px !important;
min-height: 16px !important;
max-height: 16px !important;
flex: 0 0 16px !important;
font-size: 0 !important;
}
.gestor-body .topbar-relatorios-btn .topbar-relatorios-icon i {
font-size: 0.48rem !important;
line-height: 1 !important;
}
.topbar-print-client-icon i,
.topbar-caixa-icon i,
.topbar-whatsapp-icon i,
.topbar-install-icon i,
.topbar-admin-voltar-icon i,
.topbar-avisos-icon i,
.topbar-relatorios-icon i {
font-size: 0.62rem;
line-height: 1;
}
.topbar-caixa-btn--aberto .topbar-caixa-icon {
background: #16a34a !important;
}
.topbar-install-icon {
background: #4f628d !important;
}
.topbar-admin-voltar-btn {
color: #7c2d12 !important;
}
.topbar-admin-voltar-icon {
background: #9a3412 !important;
}
#modalInstalarGestor .modal-footer .btn-success {
--bs-btn-bg: var(--ss-success-action-bg);
--bs-btn-border-color: var(--ss-success-action-bg);
--bs-btn-hover-bg: var(--ss-success-action-hover);
--bs-btn-hover-border-color: var(--ss-success-action-hover);
--bs-btn-active-bg: var(--ss-success-action-hover);
--bs-btn-active-border-color: var(--ss-success-action-hover);
background: var(--ss-success-action-bg) !important;
border-color: var(--ss-success-action-bg) !important;
color: #fff !important;
}
#modalInstalarGestor .modal-footer .btn-success:hover,
#modalInstalarGestor .modal-footer .btn-success:focus {
background: var(--ss-success-action-hover) !important;
border-color: var(--ss-success-action-hover) !important;
opacity: 1;
}
.topbar-caixa-btn--aberto {
color: #166534 !important;
}
.topbar-caixa-btn--fechado .topbar-caixa-icon {
background: #dc2626 !important;
}
.topbar-caixa-btn--fechado {
color: #991b1b !important;
}
.topbar-whatsapp-btn--connected .topbar-whatsapp-icon {
background: #16a34a !important;
}
.topbar-whatsapp-btn--connected {
color: #166534 !important;
}
.topbar-whatsapp-btn--connecting .topbar-whatsapp-icon {
background: #f59e0b !important;
}
.topbar-whatsapp-btn--connecting {
color: #92400e !important;
}
.topbar-whatsapp-btn--disconnected .topbar-whatsapp-icon {
background: #dc2626 !important;
}
.topbar-whatsapp-btn--disconnected {
color: #991b1b !important;
}
.topbar-whatsapp-btn--checking .topbar-whatsapp-icon {
background: #64748b !important;
}
.topbar-whatsapp-btn--checking {
color: #475569 !important;
}
.topbar-whatsapp-btn--unavailable .topbar-whatsapp-icon {
background: #7c3aed !important;
}
.topbar-whatsapp-btn--unavailable {
color: #6d28d9 !important;
}
.topbar-whatsapp-menu {
width: min(320px, calc(100vw - 1rem));
padding: 0.45rem;
border: 1px solid #dbe3e9;
border-radius: 0.7rem;
box-shadow: 0 14px 34px rgba(15, 23, 42, 0.16);
white-space: normal;
}
.topbar-whatsapp-menu .dropdown-divider {
margin: 0.35rem 0;
}
.topbar-whatsapp-menu-head {
display: flex;
align-items: center;
gap: 0.65rem;
padding: 0.45rem 0.55rem;
}
.topbar-whatsapp-menu-head > span:last-child,
.topbar-whatsapp-menu-item > span,
.topbar-whatsapp-switch-copy {
display: flex;
flex: 1 1 auto;
min-width: 0;
flex-direction: column;
}
.topbar-whatsapp-menu-head strong,
.topbar-whatsapp-menu-item strong,
.topbar-whatsapp-switch-copy strong {
color: #172033;
font-size: 0.76rem;
font-weight: 750;
line-height: 1.2;
}
.topbar-whatsapp-menu-head small,
.topbar-whatsapp-menu-item small,
.topbar-whatsapp-switch-copy small {
margin-top: 0.13rem;
color: #667085;
font-size: 0.66rem;
line-height: 1.25;
}
.topbar-whatsapp-status-icon,
.topbar-whatsapp-menu-icon,
.topbar-whatsapp-menu-item > i {
display: inline-flex;
align-items: center;
justify-content: center;
width: 28px;
height: 28px;
flex: 0 0 28px;
border-radius: 0.48rem;
background: #f1f5f9;
color: #64748b;
font-size: 0.76rem;
}
.topbar-whatsapp-status-icon.is-connected {
background: #dcfce7;
color: #15803d;
}
.topbar-whatsapp-status-icon.is-connecting {
background: #fef3c7;
color: #b45309;
}
.topbar-whatsapp-status-icon.is-disconnected {
background: #fee2e2;
color: #b91c1c;
}
.topbar-whatsapp-status-icon.is-unavailable {
background: #ede9fe;
color: #6d28d9;
}
.topbar-whatsapp-menu-item {
display: flex;
align-items: center;
gap: 0.65rem;
min-height: 42px;
padding: 0.42rem 0.5rem;
border: 0;
border-radius: 0.5rem;
white-space: normal;
}
.topbar-whatsapp-menu-item:hover,
.topbar-whatsapp-menu-item:focus {
background: #f5f8fa;
}
.topbar-whatsapp-menu-item.is-danger > i {
background: #fff1f2;
color: #be123c;
}
.topbar-whatsapp-menu-item.is-danger strong {
color: #b42318;
}
.topbar-whatsapp-switch-row {
display: flex;
align-items: center;
gap: 0.65rem;
min-height: 42px;
padding: 0.42rem 0.5rem;
}
.topbar-whatsapp-switch {
flex: 0 0 auto;
}
.topbar-whatsapp-switch input:disabled + span:first-of-type {
opacity: 0.55;
cursor: wait;
}
.topbar-whatsapp-menu [disabled] {
cursor: wait;
opacity: 0.65;
}
.topbar-print-client-btn--online .topbar-print-client-icon {
background: #16a34a !important;
}
.topbar-print-client-btn--online {
color: #166534 !important;
}
.topbar-print-client-btn--offline .topbar-print-client-icon,
.topbar-print-client-btn--unlinked .topbar-print-client-icon {
background: #dc2626 !important;
}
.topbar-print-client-btn--offline,
.topbar-print-client-btn--unlinked {
color: #991b1b !important;
}
.topbar-print-client-btn--checking .topbar-print-client-icon {
background: #64748b !important;
}
.topbar-print-client-btn--checking {
color: #475569;
}
/* No desktop, os estados ficam em ícones; o balão global vive fora do topbar. */
@media (min-width: 768px) and (hover: hover) and (pointer: fine) {
.gestor-body :is(
.topbar-admin-voltar-btn,
.topbar-caixa-btn,
.topbar-whatsapp-btn,
.topbar-print-client-btn
) {
box-sizing: border-box;
flex: 0 0 27px;
gap: 0;
justify-content: center !important;
max-width: 27px;
min-width: 27px;
overflow: visible;
padding: 0 !important;
position: relative;
transition: background-color 0.22s ease, border-color 0.22s ease, color 0.22s ease;
width: 27px;
}
.gestor-body .topbar-whatsapp-dropdown {
flex: 0 0 27px;
height: 27px;
isolation: isolate;
max-width: 27px;
min-width: 27px;
position: relative;
width: 27px;
}
.gestor-body .topbar-whatsapp-btn.dropdown-toggle::after {
display: none !important;
}
.gestor-body :is(
.topbar-admin-voltar-text,
.topbar-caixa-text,
.topbar-whatsapp-text,
.topbar-print-client-text
) {
display: none !important;
}
}
/* Bootstrap anexa estes balões diretamente ao body, acima de qualquer módulo. */
.ss-action-balloon {
--bs-tooltip-bg: #1f2937;
--bs-tooltip-color: #fff;
--bs-tooltip-max-width: 280px;
--bs-tooltip-opacity: 1;
--bs-tooltip-padding-x: 8px;
--bs-tooltip-padding-y: 6px;
--bs-tooltip-zindex: 2147483647;
pointer-events: none !important;
z-index: 2147483647 !important;
}
.ss-action-balloon .tooltip-inner {
border-radius: 6px;
box-shadow: 0 6px 16px rgba(15, 23, 42, 0.3);
font-size: 0.68rem;
font-weight: 650;
white-space: nowrap;
}
.gestor-body .form-label {
margin: 0 0 0.35rem;
color: #111827;
font-size: 0.875rem;
font-weight: 400;
}
.gestor-body :is(.form-control, .form-select, .ss-control):not([data-ss-control-visual="custom"]):not(.form-control-color),
.gestor-body .input-group-text:not([data-ss-control-visual="custom"]) {
height: var(--ss-control-height) !important;
min-height: var(--ss-control-height) !important;
padding: var(--ss-control-padding) !important;
border: 1px solid var(--ss-control-border) !important;
border-bottom: var(--ss-control-border-bottom-width) solid var(--ss-control-border-bottom) !important;
border-radius: var(--ss-control-radius) !important;
background-color: var(--ss-control-background) !important;
color: var(--ss-control-color) !important;
font-family: var(--ss-control-font) !important;
font-size: var(--ss-control-font-size) !important;
line-height: 1.25;
box-shadow: none !important;
}
.gestor-body :is(.form-control, .form-select, .ss-control):not([data-ss-control-visual="custom"]):not(.form-control-color):is(:invalid, :required) {
border: 1px solid var(--ss-control-border) !important;
border-bottom: var(--ss-control-border-bottom-width) solid var(--ss-control-border-bottom) !important;
box-shadow: none !important;
}
.gestor-body :is(.form-control-sm, .form-select-sm):not([data-ss-control-visual="custom"]):not(.form-control-color) {
height: var(--ss-control-height) !important;
min-height: var(--ss-control-height) !important;
padding: var(--ss-control-padding) !important;
font-size: var(--ss-control-font-size) !important;
}
/* Todo select convencional do Gestor reserva uma faixa exclusiva para a seta.
O padding compacto global não pode permitir que opções longas passem sob o ícone. */
.gestor-body select.form-select:not([multiple]):not([size]):not([data-ss-control-visual="custom"]) {
padding-right: 2rem !important;
overflow: hidden;
background-position: right .55rem center !important;
background-size: 12px 9px;
text-overflow: ellipsis;
white-space: nowrap;
}
.gestor-body input[type="date"].form-control:not([data-ss-control-visual="custom"]),
.gestor-body input[type="time"].form-control:not([data-ss-control-visual="custom"]) {
height: var(--ss-control-height) !important;
min-height: var(--ss-control-height) !important;
line-height: 1.25;
}
.gestor-body textarea.form-control:not([data-ss-control-visual="custom"]) {
height: auto !important;
min-height: 68px !important;
resize: vertical;
}
.gestor-body :is(.form-control, .form-select, .ss-control):not([data-ss-control-visual="custom"]):not(.form-control-color):focus {
outline: 0;
box-shadow: none !important;
border-bottom: 2px solid var(--ss-control-focus) !important;
}
.gestor-body :is(.form-control, .form-select, .ss-control):not([data-ss-control-visual="custom"]):not(.form-control-color).is-invalid {
border-bottom-color: #dc3545 !important;
}
/*
* Busca com ícone dentro do campo.
* O controle global usa padding com !important; sobrescrever a variável no
* contêiner preserva o espaço do ícone em todas as páginas atuais e oferece
* .ss-search-field como padrão para novas telas.
*/
.gestor-body :is(.ss-search-field, .produtos-busca, .unidades-busca) {
--ss-control-padding: 0.16rem 0.5rem 0.16rem 2.25rem;
position: relative;
}
.gestor-body :is(.ss-search-field, .produtos-busca, .unidades-busca) > i:first-child {
position: absolute;
z-index: 2;
top: 50%;
left: 0.7rem;
display: inline-flex;
width: 1rem;
align-items: center;
justify-content: center;
transform: translateY(-50%);
color: #64748b;
font-size: 0.78rem;
line-height: 1;
pointer-events: none;
}
.gestor-body .btn {
height: var(--ss-button-height);
min-height: var(--ss-button-height);
display: inline-flex;
align-items: center;
justify-content: center;
gap: 0.25rem;
border-radius: var(--ss-button-radius);
font-size: var(--ss-button-font-size);
font-weight: 600;
line-height: 1.2;
}
.gestor-body .btn-sm {
padding: 0.16rem 0.65rem;
font-size: var(--ss-button-font-size);
}
.gestor-body .input-group > .btn {
border-radius: 0 !important;
}
/*
* Lookup global: mantém código + lupa unidos e separa visualmente o nome
* selecionado com o mesmo gap usado pelo editor de Produto.
*/
.gestor-body [data-lookup].input-group > [data-lookup-search] + [data-lookup-name] {
margin-left: 0.42rem !important;
}
.gestor-body .btn-primary {
--bs-btn-bg: var(--ss-button-primary-bg);
--bs-btn-border-color: var(--ss-button-primary-bg);
--bs-btn-hover-bg: var(--ss-button-primary-bg);
--bs-btn-hover-border-color: var(--ss-button-primary-bg);
--bs-btn-active-bg: var(--ss-button-primary-bg);
--bs-btn-active-border-color: var(--ss-button-primary-bg);
--bs-btn-disabled-bg: var(--ss-button-primary-bg);
--bs-btn-disabled-border-color: var(--ss-button-primary-bg);
border-color: var(--ss-button-primary-bg);
background: var(--ss-button-primary-bg);
color: #fff;
}
.gestor-body .btn-secondary {
--bs-btn-bg: var(--ss-button-secondary-bg);
--bs-btn-border-color: var(--ss-button-secondary-bg);
--bs-btn-hover-bg: var(--ss-button-secondary-bg);
--bs-btn-hover-border-color: var(--ss-button-secondary-bg);
--bs-btn-active-bg: var(--ss-button-secondary-bg);
--bs-btn-active-border-color: var(--ss-button-secondary-bg);
--bs-btn-disabled-bg: var(--ss-button-secondary-bg);
--bs-btn-disabled-border-color: var(--ss-button-secondary-bg);
border-color: var(--ss-button-secondary-bg);
background: var(--ss-button-secondary-bg);
color: #fff;
}
.gestor-body .btn-light {
--bs-btn-bg: var(--ss-button-neutral-bg);
--bs-btn-border-color: var(--ss-button-neutral-bg);
--bs-btn-hover-bg: var(--ss-button-neutral-bg);
--bs-btn-hover-border-color: var(--ss-button-neutral-bg);
--bs-btn-active-bg: var(--ss-button-neutral-bg);
--bs-btn-active-border-color: var(--ss-button-neutral-bg);
border-color: var(--ss-button-neutral-bg);
background: var(--ss-button-neutral-bg);
color: #333;
}
.gestor-body :is(button, input)[type="submit"].btn {
min-width: var(--ss-button-action-min-width);
border: 0;
}
.gestor-body :is(.btn-primary, .btn-secondary, .btn-light):hover {
opacity: .7;
}
/* Admin · Planos: as opções usam a largura inteira e redistribuem as colunas
automaticamente, sem deixar cartões estreitos ou espaços mortos. */
.plano-catalogo-tree {
display: grid;
gap: .6rem;
}
.plano-catalogo-solto {
padding: .15rem 0;
}
.plano-catalogo-modulo {
padding: .6rem .75rem;
border: 1px solid #e2e8f0;
border-radius: 8px;
}
.plano-catalogo-operacoes {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(min(180px, 100%), 1fr));
gap: .4rem .9rem;
margin-top: .45rem;
padding-left: 1.6rem;
}
.plano-catalogo-operacao {
width: 100%;
min-width: 0;
}
.plano-catalogo-grupo {
margin: 0;
}
.plano-catalogo-grupo > summary {
padding: .3rem 0;
cursor: pointer;
font-weight: 800;
}
.plano-catalogo-grupo-conteudo {
display: grid;
gap: .5rem;
margin-top: .4rem;
padding-left: .5rem;
}
@media (max-width: 575.98px) {
.plano-catalogo-operacoes,
.plano-catalogo-grupo-conteudo {
padding-left: 0;
}
}
.modal-unidade-preview {
display: flex;
align-items: center;
gap: 0.8rem;
padding: 0.85rem;
margin-bottom: 1rem;
border: 1px solid #edf0f5;
border-radius: 0.9rem;
background: #f8fafc;
}
.modal-unidade-logo {
width: 52px;
height: 52px;
border-radius: 50%;
background: #fff;
border: 2px solid #dbe3ef;
display: inline-flex;
align-items: center;
justify-content: center;
color: var(--cor-unidade, #2d3142);
font-size: 1.45rem;
overflow: hidden;
flex: 0 0 auto;
}
.modal-unidade-logo img { width: 100%; height: 100%; object-fit: cover; }
.modal-unidade-preview-text { min-width: 0; display: flex; flex-direction: column; }
.modal-unidade-preview-text strong {
color: #111827;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.modal-unidade-preview-text small { color: #6b7280; }
.modal-backdrop.show {
opacity: .55;
}
.modal .modal-content {
border: 1px solid #313548;
border-radius: 10px;
overflow: hidden;
box-shadow: 0 16px 38px rgba(45, 49, 66, .12);
background: #fff !important;
}
.modal .modal-header,
.modal-header-unidade {
height: auto;
min-height: 30px;
padding: 4px 12px;
border: 0;
border-radius: 10px 10px 0 0;
background: #313548 !important;
color: #fff;
justify-content: center;
position: relative;
}
.modal .modal-title {
margin: 0 auto;
color: #fff !important;
font-size: 13px !important;
font-weight: 600 !important;
line-height: 1.25;
text-align: center;
}
.modal .modal-header small,
.modal .modal-header > span {
color: rgba(255, 255, 255, .72) !important;
}
.modal .modal-header .btn-close {
position: absolute;
top: 50%;
right: 10px;
transform: translateY(-50%);
width: auto;
height: auto;
padding: 0;
margin: 0;
background: none;
border: 0;
opacity: 1;
color: #fff;
filter: none;
font-size: 0;
box-shadow: none;
}
.modal .modal-header .btn-close::before {
content: "×";
color: #fff;
font-size: 28px;
font-weight: 700;
line-height: 1;
}
.modal .modal-header .btn-close:focus {
box-shadow: none;
}
.modal .modal-body {
background: #fff !important;
padding: 20px;
}
.modal .modal-footer {
min-height: 38px;
height: auto !important;
gap: 8px;
padding: 5px 9px 4px !important;
border: 0;
border-top: 1px solid #e8ecf2;
background: #f8fafc;
}
.modal .modal-footer .btn {
min-width: var(--ss-button-action-min-width);
height: var(--ss-button-height);
border: 0;
border-radius: var(--ss-button-radius);
font-weight: 600;
}
.modal .modal-footer .btn-light,
.modal .modal-footer .btn-secondary {
--bs-btn-bg: var(--ss-modal-secondary-btn-bg);
--bs-btn-border-color: var(--ss-modal-secondary-btn-bg);
--bs-btn-hover-bg: var(--ss-modal-secondary-btn-bg);
--bs-btn-hover-border-color: var(--ss-modal-secondary-btn-bg);
--bs-btn-active-bg: var(--ss-modal-secondary-btn-bg);
--bs-btn-active-border-color: var(--ss-modal-secondary-btn-bg);
background: var(--ss-modal-secondary-btn-bg) !important;
border-color: var(--ss-modal-secondary-btn-bg) !important;
color: #fff !important;
}
.modal .modal-footer .btn-light:hover,
.modal .modal-footer .btn-secondary:hover {
opacity: .7;
}
.modal .modal-footer .btn-primary,
.modal .modal-footer .btn-success {
--bs-btn-bg: var(--ss-modal-primary-btn-bg);
--bs-btn-border-color: var(--ss-modal-primary-btn-bg);
--bs-btn-hover-bg: var(--ss-modal-primary-btn-bg);
--bs-btn-hover-border-color: var(--ss-modal-primary-btn-bg);
--bs-btn-active-bg: var(--ss-modal-primary-btn-bg);
--bs-btn-active-border-color: var(--ss-modal-primary-btn-bg);
--bs-btn-disabled-bg: var(--ss-modal-primary-btn-bg);
--bs-btn-disabled-border-color: var(--ss-modal-primary-btn-bg);
background: var(--ss-modal-primary-btn-bg) !important;
border-color: var(--ss-modal-primary-btn-bg) !important;
color: #fff !important;
}
.modal .modal-footer .btn-primary:hover,
.modal .modal-footer .btn-success:hover {
opacity: .7;
}
/* Ações fora de modal que devem manter exatamente a mesma linguagem dos
rodapés dos modais (login, licença e outros acessos de entrada). */
.gestor-body .ss-modal-actions {
display: flex;
min-height: 38px;
align-items: center;
justify-content: flex-end;
gap: 8px;
padding-top: 10px;
}
.gestor-body .ss-modal-actions .btn {
flex: 0 0 auto;
min-width: var(--ss-button-action-min-width);
height: var(--ss-button-height);
border: 0;
border-radius: var(--ss-button-radius);
font-weight: 600;
}
.gestor-body .ss-modal-actions .btn-light,
.gestor-body .ss-modal-actions .btn-secondary {
--bs-btn-bg: var(--ss-modal-secondary-btn-bg);
--bs-btn-border-color: var(--ss-modal-secondary-btn-bg);
--bs-btn-hover-bg: var(--ss-modal-secondary-btn-bg);
--bs-btn-hover-border-color: var(--ss-modal-secondary-btn-bg);
--bs-btn-active-bg: var(--ss-modal-secondary-btn-bg);
--bs-btn-active-border-color: var(--ss-modal-secondary-btn-bg);
--bs-btn-disabled-bg: var(--ss-modal-secondary-btn-bg);
--bs-btn-disabled-border-color: var(--ss-modal-secondary-btn-bg);
background: var(--ss-modal-secondary-btn-bg) !important;
border-color: var(--ss-modal-secondary-btn-bg) !important;
color: #fff !important;
}
.gestor-body .ss-modal-actions .btn-primary,
.gestor-body .ss-modal-actions .btn-success {
--bs-btn-bg: var(--ss-modal-primary-btn-bg);
--bs-btn-border-color: var(--ss-modal-primary-btn-bg);
--bs-btn-hover-bg: var(--ss-modal-primary-btn-bg);
--bs-btn-hover-border-color: var(--ss-modal-primary-btn-bg);
--bs-btn-active-bg: var(--ss-modal-primary-btn-bg);
--bs-btn-active-border-color: var(--ss-modal-primary-btn-bg);
--bs-btn-disabled-bg: var(--ss-modal-primary-btn-bg);
--bs-btn-disabled-border-color: var(--ss-modal-primary-btn-bg);
background: var(--ss-modal-primary-btn-bg) !important;
border-color: var(--ss-modal-primary-btn-bg) !important;
color: #fff !important;
}
.gestor-body .ss-modal-actions .btn:hover {
opacity: .7;
}
.gestor-body .ss-login-actions {
margin: 0;
}
.gestor-body.ss-access-page {
background:
radial-gradient(circle at 50% 28%, rgba(135, 139, 180, .12), transparent 34%),
#eef1f6;
}
.ss-access-wrapper {
max-width: 440px;
}
.ss-entry-card {
padding: 0;
overflow: hidden;
border: 0;
border-radius: 10px;
background: #fff;
box-shadow: 0 16px 38px rgba(45, 49, 66, .12) !important;
}
.ss-entry-card-header {
display: flex;
height: auto;
min-height: 30px;
align-items: center;
justify-content: center;
padding: 4px 12px;
border: 0;
border-radius: 10px 10px 0 0;
background: #313548;
color: #fff;
}
.ss-entry-card-header h1 {
margin: 0;
color: #fff;
font-size: 13px;
font-weight: 600;
line-height: 1;
}
.ss-entry-card-header i {
margin-right: 5px;
font-size: 12px;
}
.ss-entry-card-body {
padding: 24px 28px 20px;
}
.ss-entry-card-footer.ss-modal-actions {
min-height: 48px;
margin: 0;
padding: 10px 18px;
border-top: 1px solid #e8ecf2;
background: #f8fafc;
}
.ss-access-card {
max-width: 440px;
}
.ss-login-card {
padding: 0;
}
.ss-login-card-body {
padding: 22px 30px 18px;
}
.ss-login-brand {
margin-bottom: 20px;
}
.ss-login-brand .login-logo-img {
display: block;
max-width: 150px;
margin: 0 auto 10px;
}
.ss-login-signup {
margin-top: 16px;
padding-top: 13px;
border-top: 1px solid #edf0f5;
}
.ss-login-signup a {
font-size: 11px;
font-weight: 600;
}
.ss-access-summary {
display: flex;
align-items: flex-start;
gap: 14px;
text-align: left;
}
.ss-access-summary-text {
min-width: 0;
flex: 1 1 auto;
}
.ss-access-symbol {
--ss-access-accent: #ea580c;
display: flex;
width: 48px;
height: 48px;
flex: 0 0 48px;
align-items: center;
justify-content: center;
border-radius: 12px;
background: color-mix(in srgb, var(--ss-access-accent) 11%, #fff);
color: var(--ss-access-accent);
font-size: 21px;
}
.ss-access-symbol.is-danger {
--ss-access-accent: #dc2626;
}
.ss-license-status {
display: inline-flex;
margin-bottom: 5px;
align-items: center;
gap: 5px;
color: #9a3412;
font-size: 10px;
font-weight: 700;
line-height: 1;
text-transform: uppercase;
}
.ss-license-status i {
font-size: 6px;
}
.ss-license-status.is-blocked {
color: #b91c1c;
}
.ss-access-title {
margin: 0;
color: #182033;
font-size: 16px;
font-weight: 700;
line-height: 1.35;
}
.ss-access-copy {
margin: 6px 0 0;
color: #64748b;
font-size: 12px;
line-height: 1.45;
}
.ss-access-deadline {
display: flex;
margin: 18px 0 0 62px;
padding: 9px 12px;
align-items: center;
justify-content: space-between;
gap: 12px;
border: 1px solid #e5e9f0;
border-radius: 8px;
background: #f8fafc;
color: #64748b;
font-size: 11px;
text-align: left;
}
.ss-access-deadline i {
margin-right: 5px;
color: var(--ss-button-secondary-bg);
}
.ss-access-deadline.is-danger i {
color: #dc2626;
}
.ss-access-deadline strong {
color: #273047;
font-size: 12px;
}
@media (max-width: 575.98px) {
.ss-entry-card-body {
padding: 20px 18px 18px;
}
.gestor-body .ss-modal-actions {
flex-wrap: wrap;
}
.ss-access-deadline {
margin-left: 0;
}
}
@media (max-width: 575.98px) {
.modal .modal-dialog.modal-fullscreen-sm-down {
width: 100vw;
max-width: none;
height: 100dvh;
min-height: 0;
max-height: 100dvh;
margin: 0;
}
.modal .modal-dialog.modal-fullscreen-sm-down .modal-content {
height: 100%;
min-height: 0;
max-height: 100dvh;
border: 0;
border-radius: 0;
}
.modal .modal-dialog.modal-fullscreen-sm-down .modal-header,
.modal .modal-dialog.modal-fullscreen-sm-down .modal-footer {
border-radius: 0;
}
.modal .modal-dialog.modal-fullscreen-sm-down .modal-body {
flex: 1 1 auto;
min-height: 0;
max-height: none;
overflow-y: auto;
overscroll-behavior-y: contain;
-webkit-overflow-scrolling: touch;
}
.modal .modal-dialog.modal-fullscreen-sm-down.modal-dialog-scrollable .modal-content {
max-height: 100dvh;
}
}
.ss-toast-container {
z-index: 2080;
top: 20px !important;
width: min(390px, calc(100vw - 24px));
pointer-events: none;
}
.ss-toast {
width: 100%;
overflow: hidden;
border: 1px solid color-mix(in srgb, var(--ss-toast-accent, var(--ss-action-bg)) 38%, #dfe5ee);
border-left: 5px solid var(--ss-toast-accent, var(--ss-action-bg));
border-radius: 8px;
background:
linear-gradient(90deg, color-mix(in srgb, var(--ss-toast-accent, var(--ss-action-bg)) 8%, #fff), #fff 46%);
color: #111827;
box-shadow: 0 16px 40px rgba(15, 23, 42, 0.22), 0 0 0 1px rgba(255, 255, 255, 0.75) inset;
pointer-events: auto;
}
.ss-toast + .ss-toast {
margin-top: 10px;
}
.ss-toast .toast-header {
display: flex;
align-items: center;
gap: 8px;
padding: 10px 12px 6px;
border: 0;
background: transparent;
color: #111827;
}
.ss-toast-icon {
width: 22px;
height: 22px;
display: inline-flex;
align-items: center;
justify-content: center;
flex: 0 0 22px;
border-radius: 999px;
background: var(--ss-toast-accent, var(--ss-action-bg));
color: #fff;
font-size: 0.86rem;
box-shadow: 0 6px 14px color-mix(in srgb, var(--ss-toast-accent, var(--ss-action-bg)) 24%, transparent);
}
.ss-toast-title {
min-width: 0;
flex: 1 1 auto;
overflow: hidden;
color: #111827;
font-size: 0.92rem;
font-weight: 800;
text-overflow: ellipsis;
white-space: nowrap;
}
.ss-toast .btn-close {
width: 0.75rem;
height: 0.75rem;
margin: 0;
padding: 0.55rem;
box-shadow: none;
}
.ss-toast .toast-body {
padding: 0 12px 9px 42px;
color: #4b5563;
font-size: 0.88rem;
line-height: 1.35;
white-space: pre-line;
}
.ss-toast-progress {
height: 4px;
margin: 0 12px 10px 42px;
overflow: hidden;
border-radius: 999px;
background: color-mix(in srgb, var(--ss-toast-accent, var(--ss-action-bg)) 16%, #eef2f7);
}
.ss-toast-progress span {
display: block;
width: 100%;
height: 100%;
border-radius: inherit;
background: var(--ss-toast-accent, var(--ss-action-bg));
transform-origin: left center;
animation: ss-toast-progress var(--ss-toast-duration, 3000ms) linear forwards;
}
@keyframes ss-toast-progress {
from { transform: scaleX(1); }
to { transform: scaleX(0); }
}
.ss-toast--success { --ss-toast-accent: #08b84f; }
.ss-toast--error { --ss-toast-accent: #e11d48; }
.ss-toast--warning { --ss-toast-accent: #d97706; }
.ss-toast--info { --ss-toast-accent: #2563eb; }
@media (max-width: 767.98px) {
.ss-toast-container {
top: 12px !important;
right: 12px !important;
left: 12px !important;
width: auto;
padding: 0 !important;
}
}
.modal .alert:not([data-ss-inline-alert]) {
display: none !important;
}
.gestor-body .nav-tabs,
.gestor-body .nav-pills {
gap: 0.85rem;
flex-wrap: wrap;
border-bottom: 1px solid #dfe5ee;
}
.gestor-body .nav-tabs .nav-link,
.gestor-body .nav-pills .nav-link {
margin-bottom: -1px;
padding: 0.55rem 0 0.62rem;
border: 0 !important;
border-radius: 0 !important;
background: transparent !important;
color: #4b5563;
box-shadow: none !important;
font-weight: 800;
}
.gestor-body .nav-tabs .nav-link:hover,
.gestor-body .nav-pills .nav-link:hover {
color: #111827;
}
.gestor-body .nav-tabs .nav-link.active,
.gestor-body .nav-tabs .nav-link.show,
.gestor-body .nav-pills .nav-link.active,
.gestor-body .nav-pills .nav-link.show {
color: #111827 !important;
border-bottom: 2px solid var(--ss-action-bg) !important;
}
.ss-galeria-modal .modal-dialog {
max-width: min(1140px, calc(100vw - 32px));
}
.ss-galeria-content {
min-height: min(90vh, 900px);
max-height: 90vh;
}
.ss-galeria-modal .modal-body {
display: flex;
flex-direction: column;
min-height: 0;
padding: 20px;
}
.ss-galeria-toolbar {
position: sticky;
z-index: 5;
top: 0;
display: flex;
align-items: center;
gap: 12px;
margin-top: -10px;
margin-bottom: 14px;
padding: 10px 0 12px;
border-bottom: 1px solid #eef2f7;
background: #fff;
box-shadow: 0 5px 8px rgba(15, 23, 42, 0.04);
}
.ss-galeria-search {
flex: 1 1 auto;
min-width: min(100%, 280px);
margin: 0;
}
.ss-galeria-counter {
min-width: 92px;
color: #6b7280;
font-size: 0.86rem;
text-align: right;
white-space: nowrap;
}
.ss-galeria-load-counter {
min-height: 28px;
display: inline-flex;
flex: 0 0 auto;
align-items: center;
gap: 6px;
padding: 3px 9px;
border: 1px solid #dbe3f0;
border-radius: 999px;
background: #f8fafc;
color: #475569;
font-size: 0.72rem;
font-weight: 800;
white-space: nowrap;
}
.ss-galeria-load-counter.is-waiting {
border-color: #fde68a;
background: #fffbeb;
color: #92400e;
}
.ss-galeria-load-counter .spinner-border {
width: 0.8rem;
height: 0.8rem;
}
.ss-galeria-load-counter[hidden] {
display: none !important;
}
.ss-galeria-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
gap: 12px;
align-items: start;
}
.ss-galeria-card {
position: relative;
min-width: 0;
aspect-ratio: 1 / 1;
overflow: hidden;
border: 1px solid #dfe5ee;
border-radius: 8px;
background: #fff;
}
.ss-galeria-card:not(.ss-galeria-upload-card):not(.is-image-loading):not(.is-page-loading)::after {
position: absolute;
z-index: 1;
right: 0;
bottom: 0;
left: 0;
height: 58px;
background: linear-gradient(to top, rgba(15, 23, 42, 0.68), rgba(15, 23, 42, 0));
content: '';
pointer-events: none;
}
.ss-galeria-card.is-image-loading,
.ss-galeria-card.is-page-loading {
border-color: #dbe3f0;
background: #f1f5f9;
}
.ss-galeria-card-preview {
position: relative;
display: block;
width: 100%;
height: 100%;
padding: 0;
overflow: hidden;
border: 0;
background: #f1f5f9;
cursor: zoom-in;
}
.ss-galeria-card-preview:focus-visible {
outline: 2px solid var(--ss-action-bg);
outline-offset: -3px;
}
.ss-galeria-card-preview img {
display: block;
width: 100%;
height: 100%;
object-fit: contain;
padding: 4px;
}
.ss-galeria-image-loading {
position: absolute;
z-index: 1;
inset: 0;
display: grid;
place-items: center;
background: #f1f5f9;
color: var(--ss-action-bg);
pointer-events: none;
}
.ss-galeria-image-loading .spinner-border {
width: 1.45rem;
height: 1.45rem;
}
.ss-galeria-card-actions {
position: absolute;
z-index: 2;
right: 7px;
bottom: 7px;
left: 7px;
display: grid;
grid-template-columns: 1fr 1fr;
gap: 6px;
}
.ss-galeria-card-actions.has-single-action {
grid-template-columns: 1fr;
}
.ss-galeria-card-actions .btn {
min-width: 0;
min-height: 32px;
display: inline-flex;
align-items: center;
justify-content: center;
gap: 5px;
border: 0;
border-radius: 8px;
background: rgba(255, 255, 255, 0.94);
color: #0f172a;
font-size: 0.78rem;
font-weight: 700;
box-shadow: 0 2px 8px rgba(15, 23, 42, 0.18);
}
.ss-galeria-card-actions .btn:hover,
.ss-galeria-card-actions .btn:focus {
background: #e9eef5;
color: #0f172a;
}
.ss-galeria-card-actions .btn[disabled] {
opacity: 0.55;
}
.ss-galeria-card-actions .ss-galeria-delete {
color: #b00020;
}
.ss-galeria-upload-card {
border-style: dashed;
border-color: #aebbd0;
background: #f8fafc;
}
.ss-galeria-upload-trigger {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 8px;
padding: 16px;
border: 0;
background: transparent;
color: #27324a;
cursor: pointer;
}
.ss-galeria-upload-trigger:hover,
.ss-galeria-upload-trigger:focus-visible {
background: #eef2f7;
}
.ss-galeria-upload-trigger:focus-visible {
outline: 2px solid var(--ss-action-bg);
outline-offset: -3px;
}
.ss-galeria-upload-trigger:disabled {
cursor: wait;
opacity: 1;
}
.ss-galeria-upload-trigger > i {
width: 44px;
height: 44px;
display: inline-flex;
align-items: center;
justify-content: center;
border-radius: 50%;
background: var(--ss-action-bg);
color: #fff;
font-size: 1.35rem;
}
.ss-galeria-upload-trigger .spinner-border {
width: 2rem;
height: 2rem;
color: var(--ss-action-bg);
}
.ss-galeria-upload-trigger strong {
font-size: 0.82rem;
}
.ss-galeria-upload-trigger small {
color: #64748b;
font-size: 0.7rem;
}
.ss-galeria-loading,
.ss-galeria-empty {
width: 100%;
min-height: 110px;
display: flex;
align-items: center;
justify-content: center;
gap: 8px;
margin-top: 12px;
border: 1px dashed #d3d9e6;
border-radius: 8px;
color: #6b7280;
}
.ss-galeria-empty {
flex-direction: column;
text-align: center;
}
.ss-galeria-empty[hidden],
.ss-galeria-loading[hidden] {
display: none !important;
}
.ss-galeria-feedback {
border-radius: 999px;
}
.ss-galeria-scroll-sentinel {
min-height: 1px;
display: grid;
place-items: center;
color: var(--ss-action-bg);
}
.ss-galeria-scroll-sentinel.is-loading {
min-height: 36px;
}
.ss-galeria-scroll-sentinel .spinner-border {
display: none;
}
.ss-galeria-scroll-sentinel.is-loading .spinner-border {
display: inline-block;
}
.ss-galeria-scroll-sentinel[hidden] {
display: none !important;
}
.ss-galeria-feedback {
margin-top: 12px;
padding: 8px 12px;
background: #edf7ee;
color: #17663a;
font-size: 0.86rem;
font-weight: 600;
}
.ss-galeria-feedback.is-error {
background: #fff1f2;
color: #b00020;
}
@media (max-width: 767.98px) {
.ss-galeria-modal .modal-dialog {
max-width: calc(100vw - 16px);
margin-left: 8px;
margin-right: 8px;
}
.ss-galeria-content {
min-height: 92vh;
max-height: 92vh;
}
.ss-galeria-modal .modal-body {
padding: 16px;
}
.ss-galeria-toolbar {
align-items: stretch;
flex-direction: column;
}
.ss-galeria-counter {
min-width: 0;
text-align: left;
}
.ss-galeria-grid {
grid-template-columns: repeat(auto-fill, minmax(126px, 1fr));
gap: 12px;
}
}
.ss-label {
margin: 0 0 0.35rem;
color: #111827;
font-size: 0.875rem;
font-weight: 400;
}
.ss-form-grid {
display: grid;
grid-template-columns: 90px repeat(11, minmax(0, 1fr));
gap: 1rem 1.5rem;
}
.ss-col-1 { grid-column: span 1; }
.ss-col-2 { grid-column: span 2; }
.ss-col-3 { grid-column: span 3; }
.ss-col-4 { grid-column: span 4; }
.ss-col-5 { grid-column: span 5; }
.ss-col-6 { grid-column: span 6; }
.ss-col-7 { grid-column: span 7; }
.ss-col-8 { grid-column: span 8; }
.ss-col-9 { grid-column: span 9; }
.ss-col-10 { grid-column: span 10; }
.ss-col-11 { grid-column: span 11; }
.ss-col-12 { grid-column: span 12; }
.ss-field {
min-width: 0;
}
.ss-field > .form-control,
.ss-field > .form-select,
.ss-field > .ss-btn {
width: 100%;
}
.ss-section-title {
margin: 0 0 0.65rem;
color: #111827;
font-size: 0.9rem;
font-weight: 700;
}
.ss-muted {
color: #7b7d8f;
font-size: 0.84rem;
}
.ss-panel {
border: 1px solid #dfe5ee;
border-radius: 12px;
background: #f8fafc;
}
.ss-panel-pad {
padding: 1.05rem 1.2rem;
}
.ss-btn {
min-height: 27px;
display: inline-flex;
align-items: center;
justify-content: center;
gap: 0.25rem;
padding: 0.16rem 0.65rem;
border: 0;
border-radius: 999px;
background: var(--ss-action-bg);
color: #fff;
font-size: 0.86rem;
font-weight: 600;
line-height: 1.2;
text-decoration: none;
white-space: nowrap;
}
.ss-btn:hover,
.ss-btn:focus {
background: var(--ss-action-bg-hover);
color: #fff;
}
.ss-btn-success {
background: var(--ss-success-action-bg);
}
.ss-btn-success:hover,
.ss-btn-success:focus {
background: var(--ss-success-action-hover);
}
.ss-btn-danger {
width: 30px;
height: 30px;
padding: 0;
background: #f00446;
}
.ss-btn-danger:hover,
.ss-btn-danger:focus {
background: #cf003a;
}
.ss-switch {
/* position: relative ancora o input escondido (absolute) dentro do label;
sem isso o input fica fora do scroller e o foco rola o shell inteiro. */
position: relative;
display: inline-flex;
align-items: center;
gap: 0.5rem;
margin: 0;
color: #111827;
font-size: 0.88rem;
cursor: pointer;
vertical-align: middle;
}
.ss-switch input {
position: absolute;
width: 1px;
height: 1px;
opacity: 0;
pointer-events: none;
}
.ss-switch span:first-of-type {
width: 28px;
height: 16px;
display: inline-flex;
align-items: center;
flex: 0 0 28px;
border: 1px solid #bfc4d6;
border-radius: 999px;
background: #f4f5f8;
padding: 1px;
transition: background 0.14s ease, border-color 0.14s ease;
}
.ss-switch span:first-of-type::before {
content: "";
width: 12px;
height: 12px;
border-radius: 50%;
background: #a9a5bf;
transition: transform 0.14s ease, background 0.14s ease;
}
.ss-switch input:checked + span:first-of-type {
border-color: var(--ss-action-bg);
background: var(--ss-action-bg);
}
.ss-switch input:checked + span:first-of-type::before {
transform: translateX(12px);
background: #fff;
}
/* Foco de teclado inequívoco para controles sem caixa de texto. */
.gestor-body :is(.form-check-input, input[type="checkbox"], input[type="radio"]):focus {
border-color: var(--ss-control-focus, var(--ss-action-bg)) !important;
outline: 3px solid color-mix(in srgb, var(--ss-control-focus, var(--ss-action-bg)) 32%, transparent);
outline-offset: 2px;
box-shadow: 0 0 0 2px #fff !important;
}
.gestor-body .ss-switch input:focus + span:first-of-type {
border-color: var(--ss-control-focus, var(--ss-action-bg));
outline: 3px solid color-mix(in srgb, var(--ss-control-focus, var(--ss-action-bg)) 32%, transparent);
outline-offset: 2px;
box-shadow: 0 0 0 2px #fff;
}
.gestor-body .ss-switch:has(input:focus) .ss-switch-text,
.gestor-body .form-check:has(input:focus) .form-check-label {
color: var(--ss-control-focus, var(--ss-action-bg));
font-weight: 700;
}
.gestor-body [data-bs-toggle="collapse"]:focus {
outline: 3px solid color-mix(in srgb, var(--ss-control-focus, var(--ss-action-bg)) 34%, transparent) !important;
outline-offset: 2px;
}
.ss-switch-text {
white-space: nowrap;
}
/* Ícone de ajuda global: "?" que abre um tooltip do Bootstrap (data-bs-toggle="tooltip").
Use em qualquer label: ?. O gestor.js já inicializa
qualquer [data-bs-toggle="tooltip"] da página, então nenhum JS extra é necessário. */
.ss-help {
display: inline-flex;
align-items: center;
justify-content: center;
width: 14px;
height: 14px;
margin-left: .3rem;
border: 1px solid #cbd5e1;
border-radius: 50%;
background: #f1f5f9;
color: #64748b;
font-size: .58rem;
font-weight: 800;
line-height: 1;
cursor: help;
vertical-align: middle;
user-select: none;
}
.ss-help:hover,
.ss-help:focus-visible {
background: var(--ss-action-bg, #ea1d2c);
border-color: var(--ss-action-bg, #ea1d2c);
color: #fff;
outline: none;
}
.ss-table-wrap {
width: 100%;
overflow: auto;
border: 1px solid #d9dde6;
border-radius: 12px;
background: #fff;
}
.ss-table {
width: 100%;
border-collapse: collapse;
color: #111827;
}
.ss-table th {
height: 36px;
padding: 0.45rem 0.5rem;
background: #f1f1f2;
border-bottom: 1px solid #d9dde6;
color: #111827;
font-size: 0.88rem;
font-weight: 700;
text-align: left;
white-space: nowrap;
}
.ss-table td {
min-height: 46px;
padding: 0.45rem 0.5rem;
border-bottom: 1px solid #d9dde6;
vertical-align: middle;
}
.ss-table tbody tr:nth-child(even) {
background: #f0f0f0;
}
.ss-table tbody tr:last-child td {
border-bottom: 0;
}
.ss-table-empty {
height: 132px;
color: #88879a;
text-align: center;
}
.ss-segment {
display: inline-flex;
align-items: center;
gap: 0.35rem;
}
.ss-segment button {
width: 32px;
height: 29px;
display: inline-flex;
align-items: center;
justify-content: center;
border: 1px solid #d6ddeb;
border-radius: 7px;
background: #fff;
color: #4f5c72;
}
.ss-segment button.active {
background: var(--ss-action-bg);
border-color: var(--ss-action-bg);
color: #fff;
}
.avatar-circle {
width: 32px; height: 32px;
border-radius: 50%;
background: var(--ss-primary);
color: #fff;
display: inline-flex;
align-items: center;
justify-content: center;
font-weight: 600;
font-size: 0.9rem;
}
#btnToggleSidebar { display: none; }
/* Content */
.gestor-content {
flex: 1;
display: flex;
min-width: 0;
min-height: 0;
overflow: auto;
}
/*
* Moldura única dos módulos do Gestor, inspirada no painel do sistema legado.
* PDV, KDS e mapa mantêm seus shells operacionais próprios por dependerem de
* fullscreen e dimensionamento específico.
*/
.gestor-body .gestor-content:not(.pdv-content):not(.kds-content):not(.roteirizacao-content) {
box-sizing: border-box;
padding: var(--ss-workspace-gap) !important;
background: var(--ss-workspace-frame-bg) !important;
}
.gestor-body .gestor-content:not(.pdv-content):not(.kds-content):not(.roteirizacao-content) > :first-child {
flex: 1 1 auto;
width: 100%;
max-width: 100%;
min-width: 0;
min-height: 0;
border-radius: var(--ss-workspace-radius);
background: var(--ss-workspace-surface-bg) !important;
}
.gestor-body .gestor-content :is(
.unidades-lista,
.produtos-panel,
.vendas-workspace
) {
box-shadow: none !important;
}
.gestor-body .gestor-content :is(
.unidades-lista-toolbar,
.produtos-panel-toolbar
) {
background: var(--ss-workspace-surface-bg) !important;
}
/* Padrão único das áreas de cards-listas de Cadastros e Meu Catálogo. */
.gestor-body .gestor-content :is(
.unidades-lista,
.unidades-cards,
.cadastro-cards,
.catalogo-cards,
.taxas-entrega-cards,
.perfis-cards,
.usuarios-cards,
.historicos-cards,
.produtos-panel,
.produtos-table-wrap,
.produtos-cards-scroll,
.integracao-delivery-cards
) {
background: var(--ss-cards-listas-bg);
}
/* Borda única dos cards de listagem de Cadastros e Meu Catálogo. */
.gestor-body .gestor-content :is(
.unidades-cards,
.cadastro-cards,
.catalogo-cards,
.taxas-entrega-cards,
.perfis-cards,
.usuarios-cards,
.historicos-cards,
.historico-categorias-cards,
.produtos-cards-categorias,
.produto-categoria-grid,
.ficha-tecnica-opcoes-grid
) :is(
.unidade-card,
.fornecedor-card,
.catalogo-card,
.produto-categoria-card,
.produto-card,
.taxa-entrega-card,
.perfil-card,
.usuario-card,
.historico-card,
.historico-categoria-card,
.ficha-tecnica-item-card
) {
border-color: var(--ss-cards-listas-border);
}
@media (max-width: 575.98px) {
.gestor-body .gestor-content:not(.pdv-content):not(.kds-content):not(.roteirizacao-content) {
--ss-workspace-gap: 8px;
--ss-workspace-radius: 8px;
}
}
@media print {
.gestor-body .gestor-content:not(.pdv-content):not(.kds-content):not(.roteirizacao-content) {
padding: 0 !important;
background: #fff !important;
}
.gestor-body .gestor-content:not(.pdv-content):not(.kds-content):not(.roteirizacao-content) > :first-child {
border-radius: 0;
}
}
/*
* Estes módulos já possuem uma área interna limitada e rolável. Manter o
* overflow também em .gestor-content cria dois scrolls e deixa o conteúdo
* interno aumentar/deslocar o shell quando a lista fica longa.
*/
.gestor-content:has(> .unidades-page:not(.menufiscal-page) > .unidades-lista) {
overflow: clip;
overscroll-behavior-y: none;
}
.gestor-content:has(> .unidades-page:not(.menufiscal-page) > .unidades-lista) .unidades-lista,
.gestor-content:has(> .unidades-page:not(.menufiscal-page) > .unidades-lista) .config-standard-body,
.gestor-content:has(> .unidades-page:not(.menufiscal-page) > .unidades-lista) .qr-workspace-body,
.gestor-content:has(> .unidades-page:not(.menufiscal-page) > .unidades-lista) .marketing-single-body,
.gestor-content:has(> .unidades-page:not(.menufiscal-page) > .unidades-lista) .promocoes-workspace-body,
.gestor-content:has(> .unidades-page:not(.menufiscal-page) > .unidades-lista) .cashback-workspace-body {
overscroll-behavior-y: contain;
}
/* Responsive */
@media (max-width: 991.98px) {
.gestor-body {
width: 100%;
height: 100vh;
height: 100dvh;
min-height: 0;
overflow: clip;
}
.gestor-layout,
.gestor-main {
width: 100%;
height: 100%;
min-height: 0;
overflow: clip;
}
.gestor-sidebar { transform: translateX(-100%); }
.gestor-sidebar.show { transform: translateX(0); }
.gestor-main { margin-left: 0; }
#btnToggleSidebar { display: inline-flex; }
/* Menu Fiscal tem filtros extensos antes da grade; nele o único scroller é
o conteúdo do módulo, pois não há altura restante segura para a grade. */
.gestor-content:has(> .unidades-page.menufiscal-page) {
overflow: clip;
}
.unidades-page.menufiscal-page {
flex: 1 1 auto;
height: 100%;
max-height: 100%;
min-height: 0;
overflow-x: hidden;
overflow-y: auto;
overscroll-behavior-y: contain;
}
}
@media (max-width: 575.98px) {
.gestor-topbar {
--ss-topbar-mobile-control-size: 36px;
--ss-topbar-mobile-icon-size: 26px;
height: 60px;
padding-inline: 0.65rem;
gap: 0.5rem;
}
.topbar-context { gap: 0.45rem; }
.topbar-menu-btn,
.topbar-unidade-chip {
align-items: center;
border-radius: 12px;
display: inline-flex;
flex: 0 0 var(--ss-topbar-mobile-control-size);
height: var(--ss-topbar-mobile-control-size);
justify-content: center;
max-width: var(--ss-topbar-mobile-control-size);
min-height: var(--ss-topbar-mobile-control-size);
min-width: var(--ss-topbar-mobile-control-size);
padding: 0;
box-shadow: none;
width: var(--ss-topbar-mobile-control-size);
}
.topbar-menu-btn { font-size: 0.82rem; }
.topbar-unidade-icon,
.topbar-unidade-icon img {
display: inline-flex;
flex: 0 0 var(--ss-topbar-mobile-icon-size);
height: var(--ss-topbar-mobile-icon-size);
max-height: var(--ss-topbar-mobile-icon-size);
max-width: var(--ss-topbar-mobile-icon-size);
min-height: var(--ss-topbar-mobile-icon-size);
min-width: var(--ss-topbar-mobile-icon-size);
width: var(--ss-topbar-mobile-icon-size);
}
.topbar-unidade-text,
.topbar-unidade-arrow { display: none; }
.topbar-actions { gap: 0.3rem; }
.topbar-actions > .dropdown { flex: 0 0 auto; }
.gestor-body .topbar-action-btn,
.gestor-body .topbar-profile-btn {
border-radius: 12px;
flex: 0 0 var(--ss-topbar-mobile-control-size);
gap: 0;
height: var(--ss-topbar-mobile-control-size);
max-height: var(--ss-topbar-mobile-control-size);
max-width: var(--ss-topbar-mobile-control-size);
min-height: var(--ss-topbar-mobile-control-size);
min-width: var(--ss-topbar-mobile-control-size);
padding: 0 !important;
width: var(--ss-topbar-mobile-control-size);
}
.gestor-body :is(
.topbar-print-client-icon,
.topbar-caixa-icon,
.topbar-whatsapp-icon,
.topbar-install-icon,
.topbar-admin-voltar-icon,
.topbar-avisos-icon,
.topbar-relatorios-icon,
.topbar-profile-avatar
) {
flex: 0 0 var(--ss-topbar-mobile-icon-size) !important;
font-size: 0.76rem !important;
height: var(--ss-topbar-mobile-icon-size) !important;
max-height: var(--ss-topbar-mobile-icon-size) !important;
max-width: var(--ss-topbar-mobile-icon-size) !important;
min-height: var(--ss-topbar-mobile-icon-size) !important;
min-width: var(--ss-topbar-mobile-icon-size) !important;
width: var(--ss-topbar-mobile-icon-size) !important;
}
.gestor-body :is(
.topbar-print-client-icon,
.topbar-caixa-icon,
.topbar-whatsapp-icon,
.topbar-install-icon,
.topbar-admin-voltar-icon,
.topbar-avisos-icon,
.topbar-relatorios-icon
) i,
.gestor-body .topbar-relatorios-btn .topbar-relatorios-icon i {
font-size: 0.74rem !important;
line-height: 1 !important;
}
.topbar-profile-btn.dropdown-toggle::after,
.topbar-relatorios-btn.dropdown-toggle::after {
display: none;
}
.topbar-avisos-badge {
right: -5px;
top: -5px;
}
}
@media (max-width: 400px) {
.gestor-topbar {
--ss-topbar-mobile-control-size: 30px;
--ss-topbar-mobile-icon-size: 22px;
height: 56px;
padding-inline: 0.45rem;
gap: 0.3rem;
}
.topbar-context { gap: 0.3rem; }
.topbar-actions { gap: 0.18rem; }
.topbar-menu-btn { font-size: 0.75rem; }
}
/* Unidades */
.unidades-page {
flex: 1;
display: flex;
flex-direction: column;
min-height: 0;
padding: 1.35rem;
color: #111827;
}
.unidades-page-head {
flex: 0 0 auto;
display: flex;
align-items: center;
justify-content: space-between;
gap: 1rem;
margin-bottom: 1rem;
}
.unidades-title-block {
flex: 1 1 auto;
min-width: 0;
}
.unidades-kicker {
display: block;
color: var(--cor-unidade, #2d3142);
font-size: 0.72rem;
font-weight: 800;
letter-spacing: 0.08em;
text-transform: uppercase;
margin-bottom: 0.15rem;
}
.unidades-title-block h1 {
margin: 0;
font-size: 1.55rem;
font-weight: 800;
letter-spacing: 0;
}
.ss-title-row {
display: flex;
align-items: center;
gap: 0.55rem;
flex-wrap: wrap;
min-width: 0;
}
.ss-title-badges {
display: inline-flex;
align-items: center;
gap: 0.4rem;
flex-wrap: wrap;
min-width: 0;
}
.ss-title-badge {
display: inline-flex;
align-items: center;
gap: 0.28rem;
max-width: 260px;
min-height: 24px;
padding: 0.2rem 0.5rem;
border: 1px solid #dfe5ee;
border-radius: 999px;
background: #fff;
color: #475569;
font-size: .75rem;
font-weight: 800;
line-height: 1;
white-space: nowrap;
}
.ss-title-badge span {
overflow: hidden;
text-overflow: ellipsis;
}
.ss-title-badge strong {
min-width: 0;
overflow: hidden;
color: #111827;
font-weight: 900;
text-overflow: ellipsis;
}
.unidades-actions {
display: flex;
align-items: center;
gap: 0.5rem;
flex-wrap: wrap;
justify-content: flex-end;
}
/* Shell compartilhado dos módulos publicados em Ferramentas. */
.ferramentas-page {
width: 100%;
}
.ferramentas-filtros,
.ferramentas-panel {
flex: 0 0 auto;
border: 1px solid #dfe5ee;
border-radius: 8px;
background: #fff;
box-shadow: 0 10px 28px rgba(15,23,42,0.07);
}
.ferramentas-filtros {
padding: 0.85rem;
background: #f8fafc;
}
.ferramentas-resumo-card {
border: 1px solid #e5e7eb;
border-radius: 8px;
background: #fff;
padding: 0.85rem 1rem;
box-shadow: 0 8px 22px rgba(15,23,42,0.06);
}
.ferramentas-grade {
width: 100%;
min-width: 0;
border: 1px solid #dfe5ee;
border-radius: 8px;
overflow: hidden;
box-shadow: 0 10px 28px rgba(15,23,42,0.07);
}
/* Busca global reutilizada pelos módulos do gestor. */
.busca-global-dialog {
max-width: min(800px, calc(100vw - 16px));
}
.busca-global-body {
min-height: 0;
}
.busca-global-toolbar {
margin-bottom: 0.5rem;
}
.busca-global-toolbar .form-label {
margin-bottom: 0.2rem;
color: #111827;
font-size: 0.84rem;
font-weight: 400;
}
.busca-global-grid {
--ss-grid-height: 350px;
--ag-font-size: 0.84rem;
width: 100%;
height: 350px;
min-height: 350px;
max-height: 350px;
border: 1px solid #d9e2ef;
border-radius: 10px;
overflow: hidden;
}
.busca-global-grid .ag-row {
cursor: pointer;
}
.busca-global-grid .ag-header-cell-text {
font-size: 0.82rem;
}
.busca-global-grid .ag-cell {
font-size: 0.84rem;
}
.busca-global-produto-nome{display:flex;height:100%;min-width:0;align-items:center;gap:7px}
.busca-global-produto-thumb{display:grid;box-sizing:border-box;width:26px;min-width:26px;height:26px;place-items:center;padding:0;overflow:hidden;border:1px solid #d7deea;border-radius:5px;background:#f5f7fa;color:#9aa5b4;font-size:.7rem;line-height:1}
button.busca-global-produto-thumb,
button.busca-global-produto-thumb>img{cursor:zoom-in}
button.busca-global-produto-thumb:hover,button.busca-global-produto-thumb:focus-visible{border-color:#60a5fa;outline:2px solid rgba(59,130,246,.2);outline-offset:1px}
.busca-global-produto-thumb img{display:block;width:100%;height:100%;object-fit:cover}
.busca-global-produto-thumb.is-empty{cursor:default}
.busca-global-produto-texto{display:flex;min-width:0;align-items:center;gap:7px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.busca-global-produto-texto small{flex:0 0 auto;color:#dc3545;font-size:.6rem;font-weight:750}
.busca-global-cliente-nome{display:flex;height:100%;min-width:0;align-items:center;gap:6px;overflow:hidden}
.busca-global-cliente-texto{overflow:hidden;min-width:0;text-overflow:ellipsis;white-space:nowrap}
.busca-global-vinculo-badge{display:inline-flex;flex:0 0 auto;align-items:center;min-height:18px;padding:1px 6px;border:1px solid #bfdbfe;border-radius:999px;background:#eff6ff;color:#1d4ed8;font-size:.62rem;font-weight:800;line-height:1.15;white-space:nowrap}
.busca-global-vinculo-badge.is-fornecedor{border-color:#fde68a;background:#fffbeb;color:#a16207}
.busca-global-vinculo-badge.is-vendedor{border-color:#c4b5fd;background:#f5f3ff;color:#6d28d9}
.busca-global-vinculo-badge.is-transportador,.busca-global-vinculo-badge.is-entregador{border-color:#a7f3d0;background:#ecfdf5;color:#047857}
.busca-global-vinculo-badge.is-ff{border-color:#86efac;background:#dcfce7;color:#15803d}
.busca-global-ultima-compra{display:flex;overflow:hidden;align-items:center;gap:5px;min-width:0;max-width:100%;color:#334155;font-size:.78rem;font-weight:700;white-space:nowrap}
.busca-global-ultima-compra-valor{flex:0 0 auto;white-space:nowrap}
.busca-global-ultima-compra small{overflow:hidden;flex:0 1 auto;min-width:0;color:#8a94a3;font-size:.72rem;font-weight:600;text-overflow:ellipsis;white-space:nowrap}
.busca-global-ultima-compra.is-alta{color:#dc2626}
.busca-global-ultima-compra.is-baixa{color:#16a34a}
.busca-global-ultima-compra.is-estavel{color:#334155}
.busca-global-ultima-compra.is-vazio{color:#94a3b8}
.busca-global-variacao{display:inline-flex;align-items:center;gap:4px;font-size:.78rem;font-weight:700}
.busca-global-variacao.is-alta{color:#dc2626}
.busca-global-variacao.is-baixa{color:#16a34a}
.busca-global-variacao.is-estavel{color:#334155}
.busca-global-variacao.is-vazio{color:#94a3b8}
.busca-global-grid .ag-row.ss-busca-row-focus {
box-shadow: inset 0 0 0 2px var(--bs-primary);
}
.busca-global-crud-actions {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 0.4rem;
}
.busca-global-crud-actions[hidden] {
display: none !important;
}
@media (max-width: 575.98px) {
#modalBuscaGlobal .modal-footer {
align-items: stretch;
flex-wrap: wrap;
}
.busca-global-crud-actions {
flex: 1 0 100%;
margin-right: 0 !important;
}
.busca-global-grid {
--ss-grid-height: 350px;
height: 350px;
min-height: 350px;
max-height: 350px;
}
}
.unidades-metricas {
flex: 0 0 auto;
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 0.75rem;
margin-bottom: 1rem;
}
.clientes-page .unidades-metricas {
grid-template-columns: repeat(6, minmax(0, 1fr));
}
.unidades-metrica {
min-height: 76px;
border: 1px solid #e5e7eb;
background: #fff;
border-radius: 8px;
padding: 0.85rem 1rem;
box-shadow: 0 8px 22px rgba(15,23,42,0.06);
}
.unidades-metrica span {
display: block;
font-size: 0.76rem;
font-weight: 700;
color: #64748b;
text-transform: uppercase;
letter-spacing: 0.04em;
}
.unidades-metrica strong {
display: block;
margin-top: 0.2rem;
font-size: 1.55rem;
line-height: 1;
}
.unidades-lista {
flex: 1 1 auto;
display: flex;
flex-direction: column;
min-height: 0;
border: 1px solid #dfe5ee;
border-radius: 8px;
box-shadow: 0 10px 28px rgba(15,23,42,0.07);
overflow: hidden;
}
.unidades-lista-toolbar {
flex: 0 0 auto;
display: flex;
align-items: center;
justify-content: space-between;
gap: 0.75rem;
padding: 0.85rem;
border-bottom: 1px solid #e7ebf2;
background: #f8fafc;
}
.unidades-busca {
position: relative;
flex: 1 1 320px;
max-width: 520px;
}
.unidades-busca i {
position: absolute;
top: 50%;
left: 0.7rem;
transform: translateY(-50%);
color: #64748b;
pointer-events: none;
}
.unidades-busca .form-control {
padding-left: 2rem;
}
.unidades-cards {
flex: 1 1 auto;
display: grid;
grid-template-columns: repeat(auto-fill, minmax(310px, 1fr));
grid-auto-rows: max-content;
gap: 0.85rem;
align-content: start;
padding: 0.85rem;
overflow-y: auto;
}
.unidade-card {
display: flex;
flex-direction: column;
background: #fff;
border: 1px solid #dfe5ee;
border-radius: 10px;
overflow: hidden;
box-shadow: 0 4px 12px rgba(15,23,42,0.06);
transition: box-shadow 0.15s ease, transform 0.15s ease;
}
.unidade-card.is-clicavel {
cursor: pointer;
}
.unidade-card.is-clicavel:hover {
box-shadow: 0 10px 24px rgba(15,23,42,0.12);
transform: translateY(-2px);
}
.unidade-card-capa {
position: relative;
height: 96px;
background: linear-gradient(135deg, var(--unidade-cor, #2d3142), #64748b);
}
.unidade-card-capa img {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
}
.unidade-card-logo {
position: absolute;
left: 0.85rem;
bottom: -21px;
width: 52px;
height: 52px;
flex: 0 0 52px;
}
.unidade-card-img-editar {
position: absolute;
display: inline-flex;
align-items: center;
justify-content: center;
width: 26px;
height: 26px;
padding: 0;
border: none;
border-radius: 50%;
background: rgba(255,255,255,0.92);
color: #334155;
font-size: .75rem;
cursor: pointer;
box-shadow: 0 2px 6px rgba(15,23,42,0.25);
z-index: 2;
}
.unidade-card-img-editar:hover,
.unidade-card-img-editar:focus {
background: #fff;
color: #1d4ed8;
}
.unidade-card-img-editar--capa {
top: 0.5rem;
right: 0.5rem;
}
.unidade-card-img-editar--logo {
width: 22px;
height: 22px;
left: calc(0.85rem + 36px);
bottom: -26px;
font-size: .75rem;
}
.unidade-card-body {
display: flex;
flex-direction: column;
gap: 0.25rem;
padding: 1.7rem 0.85rem 0.6rem;
}
.unidade-card-nome {
font-size: 0.95rem;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.unidade-card-meta {
display: flex;
align-items: center;
gap: 0.4rem;
flex-wrap: wrap;
}
.unidade-card-meta small {
color: #64748b;
font-size: 0.8rem;
overflow: hidden;
text-overflow: ellipsis;
}
.unidade-card-atalhos {
display: flex;
flex-wrap: wrap;
gap: 0.4rem;
padding: 0 0.85rem 0.6rem;
}
.unidade-atalho-btn {
display: inline-flex;
align-items: center;
gap: 0.35rem;
min-height: 30px;
padding: 0.25rem 0.7rem;
border: 1px solid #dfe5ee;
border-radius: 999px;
background: #f8fafc;
color: #334155;
font-size: 0.78rem;
font-weight: 700;
white-space: nowrap;
cursor: pointer;
}
.unidade-atalho-btn--icon {
min-height: 28px;
padding: 0.2rem 0.45rem;
}
.unidade-atalho-btn:hover,
.unidade-atalho-btn:focus {
background: #eef2ff;
border-color: #c7d2fe;
color: #3730a3;
}
.unidade-card-foot {
display: flex;
align-items: center;
justify-content: space-between;
gap: 0.5rem;
margin-top: auto;
padding: 0.6rem 0.85rem 0.75rem;
border-top: 1px solid #eef1f6;
}
.unidade-card-foot--actions-only {
justify-content: flex-end;
}
.unidade-card-horario {
display: flex;
align-items: center;
gap: 0.45rem;
}
.unidade-card-horario > span {
color: #64748b;
font-size: 0.78rem;
font-weight: 700;
}
.unidade-card-acoes {
display: inline-flex;
gap: 0.3rem;
}
@media (max-width: 575.98px) {
.unidades-page {
flex: 1 1 auto;
min-height: 0;
width: 100%;
overflow: hidden;
}
.unidades-lista {
flex: 1 1 auto;
min-height: 0;
overflow: hidden;
}
.unidades-cards {
flex: 1 1 auto;
grid-auto-rows: max-content;
align-items: start;
min-height: 0;
overflow-y: auto;
-webkit-overflow-scrolling: touch;
}
.unidade-card {
align-self: start;
height: auto;
min-height: max-content;
}
.unidade-card-capa {
height: 130px;
}
.unidade-card-foot {
flex-wrap: wrap;
row-gap: 0.5rem;
padding-bottom: 0.85rem;
}
.unidade-card-horario {
flex-wrap: wrap;
}
.unidade-card-acoes {
margin-left: auto;
}
}
.unidades-table-wrap {
width: 100%;
overflow-x: auto;
}
.unidades-tabs {
position: sticky;
top: -22px;
z-index: 6;
display: flex;
flex-wrap: nowrap;
gap: 0.2rem;
margin: -22px -20px 0;
padding: 12px 20px 0;
overflow-x: auto;
overflow-y: hidden;
background: #fff;
scrollbar-width: thin;
scrollbar-color: #cbd5e1 transparent;
}
.unidades-tabs[hidden] {
display: none !important;
}
.unidades-tabs .nav-item {
flex: 0 0 auto;
}
.unidades-tabs .nav-link {
min-height: 38px;
display: inline-flex;
align-items: center;
gap: 0.38rem;
padding-inline: 0.72rem;
font-size: 0.8rem;
white-space: nowrap;
}
.unidades-tabs .nav-link i {
font-size: 0.9rem;
}
.unidades-tab-content {
padding-top: 1rem;
}
#modalUnidadeCadastro .ss-form-grid {
grid-template-columns: repeat(12, minmax(0, 1fr));
}
.unidade-tab-intro {
display: flex;
align-items: flex-start;
gap: 0.8rem;
margin-bottom: 1rem;
padding: 0.85rem 1rem;
border: 1px solid #dbe7f5;
border-radius: 12px;
background: #f4f8fd;
}
.unidade-tab-intro-icon {
width: 38px;
height: 38px;
flex: 0 0 38px;
display: inline-flex;
align-items: center;
justify-content: center;
border-radius: 10px;
background: color-mix(in srgb, var(--cor-unidade, #2d3142) 12%, #fff);
color: var(--cor-unidade, #2d3142);
font-size: 1.05rem;
}
.unidade-tab-intro > div {
min-width: 0;
display: grid;
gap: 0.18rem;
}
.unidade-tab-intro strong {
color: #0f172a;
font-size: 0.92rem;
}
.unidade-tab-intro > div > span {
color: #64748b;
font-size: 0.82rem;
line-height: 1.45;
}
.unidade-config-card {
margin-bottom: 1rem;
border-color: #e2e8f0;
background: #fff;
box-shadow: 0 8px 22px rgba(15, 23, 42, 0.045);
}
.unidade-config-card:last-child {
margin-bottom: 0;
}
.unidade-config-card-head {
display: flex;
align-items: flex-start;
gap: 0.7rem;
margin-bottom: 0.9rem;
}
.unidade-config-card-head > div {
min-width: 0;
}
.unidade-config-card-head h6,
.unidade-config-card-head p {
margin: 0;
}
.unidade-config-card-head h6 {
color: #0f172a;
font-size: 0.9rem;
font-weight: 800;
}
.unidade-config-card-head p {
margin-top: 0.16rem;
color: #64748b;
font-size: 0.79rem;
line-height: 1.4;
}
.unidade-step {
width: 28px;
height: 28px;
flex: 0 0 28px;
display: inline-flex;
align-items: center;
justify-content: center;
border-radius: 50%;
background: var(--ss-step-number-bg);
color: var(--ss-step-number-color);
font-size: 0.74rem;
font-weight: 800;
}
.unidade-avancado-card {
background: #f8fafc;
}
.unidade-simple-note {
display: flex;
align-items: flex-start;
gap: 0.5rem;
margin-bottom: 0.85rem;
padding: 0.65rem 0.75rem;
border-radius: 8px;
background: #eef6ff;
color: #475569;
font-size: 0.78rem;
line-height: 1.45;
}
.unidade-simple-note > i {
margin-top: 0.08rem;
color: #2563eb;
}
.unidade-simple-note--warning {
border: 1px solid #fde68a;
background: #fffbeb;
color: #854d0e;
}
.unidade-simple-note--warning > i {
color: #d97706;
}
.unidades-inner-grid {
width: 100%;
}
.unidade-pix-grid {
margin-top: 0;
}
.unidade-pedido-minimo-grid {
margin-bottom: 0.85rem;
}
.unidade-plataformas-pagamento-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 0.65rem;
}
.unidade-plataforma-pagamento-switch {
min-height: 52px;
padding: 0.65rem 0.75rem;
border: 1px solid #dbe3ee;
border-radius: 9px;
background: #f8fafc;
}
.unidade-plataforma-pagamento-switch .ss-switch-text {
display: grid;
min-width: 0;
white-space: normal;
}
.unidade-plataforma-pagamento-switch .ss-switch-text strong {
color: #0f172a;
font-size: 0.82rem;
}
.unidade-plataforma-pagamento-switch .ss-switch-text small {
color: #64748b;
font-size: 0.72rem;
}
@media (max-width: 640px) {
.unidade-plataformas-pagamento-grid { grid-template-columns: 1fr; }
}
.unidades-pagamentos-grid {
width: 100%;
overflow: hidden;
}
.ss-grid-input,
.ss-grid-select {
width: 100%;
height: 27px;
min-height: 27px;
max-height: 27px;
padding: 0.16rem 0.32rem;
font-size: 1rem;
line-height: 1.25;
}
.ss-grid-input--valor {
text-align: right;
font-variant-numeric: tabular-nums;
}
.ss-grid-switch {
justify-content: center;
width: 100%;
}
.unidade-ambientes-form {
align-items: end;
margin-bottom: 0.65rem;
}
.unidade-add-field {
align-self: end;
}
.unidade-ambientes-help {
margin: 0 0 0.65rem;
}
.unidades-ambientes-grid {
height: 190px;
}
.unidade-atendimentos-cards {
display: grid;
grid-template-columns: minmax(0, 1fr);
gap: 0.48rem;
}
.unidade-atendimento-card {
min-width: 0;
overflow: hidden;
display: flex;
flex-direction: column;
border: 1px solid #dfe6ef;
border-radius: 10px;
background: #fff;
box-shadow: 0 3px 10px rgba(15, 23, 42, 0.055);
transition: opacity 0.18s ease, filter 0.18s ease, box-shadow 0.18s ease;
}
.unidade-atendimento-card.is-inativo {
opacity: 0.55;
filter: saturate(0.35);
box-shadow: none;
}
.unidade-atendimento-card-head {
min-width: 0;
display: flex;
align-items: center;
gap: 0.6rem;
padding: 0.62rem 0.7rem;
border-bottom: 1px solid #eef2f7;
}
.unidade-atendimento-card-icone {
width: 34px;
height: 34px;
flex: 0 0 34px;
display: inline-flex;
align-items: center;
justify-content: center;
border-radius: 9px;
background: color-mix(in srgb, var(--cor-unidade, #2d3142) 14%, #fff);
color: var(--cor-unidade, #2d3142);
font-size: 0.92rem;
}
.unidade-atendimento-card-head > div {
min-width: 0;
display: grid;
gap: 0.08rem;
}
.unidade-atendimento-card-head strong {
color: #0f172a;
font-size: 0.86rem;
font-weight: 800;
}
.unidade-atendimento-card-head small {
overflow: hidden;
color: #64748b;
font-size: 0.72rem;
text-overflow: ellipsis;
white-space: nowrap;
}
.unidade-atendimento-card-campos {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 0.35rem;
padding: 0.45rem;
}
.unidade-atendimento-campo {
min-width: 0;
display: grid;
align-content: start;
gap: 0.28rem;
padding: 0.42rem 0.48rem;
border: 1px solid #e2e8f0;
border-radius: 8px;
background: #f8fafc;
}
.unidade-atendimento-campo > span {
color: #64748b;
font-size: 0.7rem;
font-weight: 800;
}
.unidade-atendimento-campo > span > i {
width: 0.8rem;
color: var(--cor-unidade, #2d3142);
text-align: center;
}
.unidade-atendimento-campo.is-indisponivel strong {
min-height: 31px;
display: flex;
align-items: center;
color: #94a3b8;
font-size: 0.75rem;
font-weight: 600;
}
.unidade-atendimento-controle {
min-width: 0;
display: grid;
grid-template-columns: auto minmax(0, 1fr);
align-items: center;
gap: 0.42rem;
}
.unidade-atendimento-controle .ss-switch {
margin: 0;
}
.unidade-atendimentos-cards .atendimento-preco-select {
width: 100%;
min-width: 0;
margin: 0;
}
.unidade-atendimento-card-opcoes {
min-height: 43px;
display: grid;
align-content: center;
gap: 0.25rem;
margin-top: auto;
padding: 0.5rem 0.7rem;
border-top: 1px solid #eef2f7;
background: #fbfdff;
}
.unidade-atendimento-card-opcoes .ss-switch {
margin: 0 !important;
}
.unidade-atendimento-opcoes-titulo {
color: #64748b;
font-size: 0.7rem;
font-weight: 800;
}
.unidade-atendimento-opcoes-titulo > i {
color: var(--cor-unidade, #2d3142);
}
.unidade-atendimento-card-opcoes small {
color: #94a3b8;
font-size: 0.72rem;
}
@media (min-width: 992px) {
.unidade-atendimento-card {
display: grid;
grid-template-columns: minmax(160px, 0.75fr) minmax(0, 2.55fr) minmax(145px, 0.7fr);
align-items: stretch;
}
.unidade-atendimento-card-head {
padding: 0.48rem 0.58rem;
border-right: 1px solid #eef2f7;
border-bottom: 0;
}
.unidade-atendimento-card-campos {
align-items: stretch;
}
.unidade-atendimento-campo {
align-content: center;
min-height: 57px;
padding: 0.34rem 0.4rem;
}
.unidade-atendimento-card-opcoes {
align-self: stretch;
margin: 0;
padding: 0.38rem 0.52rem;
border-top: 0;
border-left: 1px solid #eef2f7;
}
}
.unidade-fiscal-grid {
gap: 0.85rem 1.35rem;
align-items: start;
}
.unidade-fiscal-safe-note {
display: flex;
align-items: flex-start;
gap: 0.75rem;
margin: -0.15rem 0 1rem;
padding: 0.8rem 0.95rem;
border: 1px solid #bbf7d0;
border-radius: 10px;
background: #f0fdf4;
color: #166534;
}
.unidade-fiscal-safe-note > i {
margin-top: 0.05rem;
font-size: 1.05rem;
}
.unidade-fiscal-safe-note > div {
display: grid;
gap: 0.12rem;
}
.unidade-fiscal-safe-note strong {
font-size: 0.82rem;
}
.unidade-fiscal-safe-note span {
font-size: 0.77rem;
line-height: 1.45;
}
.unidade-fiscal-card {
border-left: 3px solid color-mix(in srgb, var(--cor-unidade, #2d3142) 65%, #fff);
}
.config-page .unidade-config-card {
border-left: 3px solid color-mix(in srgb, var(--cor-unidade, #2d3142) 65%, #fff);
}
.unidade-test-email {
align-self: end;
}
.unidade-fiscal-divider {
margin-top: 0.1rem;
}
.unidade-fiscal-divider .ss-section-title {
margin-bottom: 0;
}
.unidade-certificado-layout {
display: grid;
grid-template-columns: minmax(0, 1fr) minmax(320px, 40%);
gap: 0.9rem 2rem;
align-items: start;
}
.unidade-certificado-field,
.unidade-certificado-senha {
align-self: start;
}
.ss-cep-loading {
cursor: progress;
}
.unidade-certificado-line {
min-height: 28px;
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 0.45rem;
margin-bottom: 0.55rem;
}
.unidade-certificado-line .form-label {
margin: 0;
}
.certificado-validade-badge {
display: inline-flex;
align-items: center;
gap: 0.3rem;
max-width: 100%;
min-height: 24px;
padding: 0.26rem 0.55rem;
border: 1px solid #6ee7b7;
border-radius: 999px;
background: #d1fae5;
color: #047857;
font-size: .75rem;
font-weight: 700;
white-space: nowrap;
}
.certificado-validade-badge--alerta {
border-color: #fde68a;
background: #fef3c7;
color: #92400e;
}
.certificado-validade-badge--expirado {
border-color: #fecaca;
background: #fee2e2;
color: #b91c1c;
}
.certificado-validade-badge--indisponivel {
border-color: #d1d5db;
background: #f3f4f6;
color: #4b5563;
}
.certificado-upload {
position: relative;
width: 100%;
max-width: 640px;
}
.certificado-upload-label {
width: 100%;
min-height: 64px;
display: grid;
grid-template-columns: 40px 1fr auto;
align-items: center;
gap: 0.75rem;
padding: 0.75rem 0.85rem;
border: 1px dashed #bfc7dc;
border-radius: 8px;
background: #f8fafc;
color: #283044;
text-align: left;
cursor: pointer;
}
.certificado-upload-icon {
width: 34px;
height: 34px;
display: inline-flex;
align-items: center;
justify-content: center;
border-radius: 50%;
background: #eef2ff;
color: #665fbe;
}
.certificado-upload-text {
min-width: 0;
display: grid;
gap: 0.12rem;
}
.certificado-upload-text strong {
font-size: 0.82rem;
}
.certificado-upload-text small {
color: #6b7280;
font-size: .75rem;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.certificado-upload-action {
min-height: 28px;
padding-inline: 0.7rem;
background: var(--cor-unidade);
}
.certificado-file-input {
position: absolute;
width: 1px;
height: 1px;
opacity: 0;
pointer-events: none;
}
.certificado-acoes {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 0.45rem;
margin-top: 0.2rem;
}
.certificado-acoes[hidden],
.certificado-upload[hidden],
.certificado-validade-badge[hidden],
.unidade-certificado-remocao[hidden] {
display: none !important;
}
.unidade-certificado-remocao {
display: flex;
align-items: center;
justify-content: space-between;
gap: 0.65rem;
margin-top: 0.65rem;
padding: 0.65rem 0.75rem;
border: 1px solid #fecaca;
border-radius: 8px;
background: #fff1f2;
color: #b91c1c;
font-size: 0.77rem;
}
.unidade-certificado-remocao span {
display: inline-flex;
align-items: flex-start;
gap: 0.4rem;
}
.unidade-certificado-remocao .btn {
flex: 0 0 auto;
}
.unidade-fiscal-tabs {
display: flex;
margin-top: 0.1rem;
}
.unidade-fiscal-tabs .nav-link {
min-width: 150px;
display: inline-flex;
align-items: baseline;
justify-content: center;
gap: 0.35rem;
font-weight: 800;
}
.unidade-fiscal-tabs .nav-link small {
color: inherit;
font-size: 0.67rem;
font-weight: 500;
opacity: 0.75;
}
.unidade-fiscal-servicos {
margin-top: 0.1rem;
}
.unidade-fiscal-tab-content {
padding-top: 0.85rem;
}
.unidade-fiscal-switch {
flex: 0 0 auto;
}
.unidade-fiscal-tab-content > .tab-pane {
padding: 0.9rem;
border: 1px solid #e2e8f0;
border-radius: 10px;
background: #f8fafc;
}
.unidade-fiscal-service-head {
display: flex;
align-items: flex-start;
justify-content: space-between;
gap: 1rem;
margin-bottom: 1rem;
}
.unidade-fiscal-service-head > div {
min-width: 0;
display: grid;
gap: 0.15rem;
}
.unidade-fiscal-service-head strong {
color: #0f172a;
font-size: 0.85rem;
}
.unidade-fiscal-service-head > div > span {
color: #64748b;
font-size: 0.76rem;
}
.unidade-fiscal-service-grid {
align-items: end;
}
.unidade-fiscal-status-action {
align-self: end;
}
.unidade-fiscal-status-action .btn {
min-height: 31px;
}
.unidade-mesas-form {
align-items: end;
margin-bottom: 0.55rem;
}
.unidade-mesas-actions {
display: inline-flex;
align-items: end;
gap: 0.45rem;
}
.unidade-mesas-add .unidade-mesas-help {
margin: 0.2rem 0 0.75rem;
}
.unidade-avancado {
margin-top: 0.6rem;
}
.unidade-avancado summary {
font-size: 0.8rem;
font-weight: 600;
color: #64748b;
cursor: pointer;
}
.unidade-avancado summary:hover {
color: #334155;
}
.unidade-avancado > .ss-field {
margin-top: 0.5rem;
max-width: 320px;
}
.unidade-avancado > .ss-form-grid,
.unidade-avancado > .ss-panel,
.unidade-avancado > .unidades-form-grid {
margin-top: 0.6rem;
}
.unidade-tab-help {
margin: 0.2rem 0 0.85rem;
font-size: 0.83rem;
}
.unidade-horarios-add {
margin-bottom: 0.75rem;
}
.unidade-mesas-lista {
display: flex;
flex-direction: column;
gap: 0.5rem;
margin-top: 0.85rem;
}
.unidade-mesa-item {
display: flex;
align-items: center;
justify-content: space-between;
gap: 0.75rem;
padding: 0.55rem 0.85rem;
border: 1px solid #dfe5ee;
border-radius: 8px;
background: #fff;
}
.unidade-mesa-item-info {
display: flex;
flex-direction: column;
gap: 0.1rem;
min-width: 0;
}
.unidade-mesa-item-info strong {
font-size: 0.9rem;
}
.unidade-mesa-item-info span {
color: #64748b;
font-size: 0.8rem;
}
.unidades-horarios-grid {
--ss-grid-height: 450px;
}
.unidades-grid-actions,
.usuarios-grid-actions {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 4px;
width: 100%;
min-height: 100%;
}
.unidades-atendimentos-grid {
display: grid;
grid-template-columns: 1fr;
gap: 0.75rem;
}
.unidades-atendimento-row {
display: grid;
grid-template-columns: 110px repeat(6, minmax(110px, 1fr));
align-items: center;
gap: 0.5rem;
padding: 0.75rem;
border: 1px solid #e5e7eb;
border-radius: 8px;
background: #f8fafc;
}
.unidades-atendimento-row strong {
color: #0f172a;
font-size: 0.8rem;
}
.unidades-table {
width: 100%;
border-collapse: collapse;
min-width: 980px;
}
.unidades-table th,
.unidades-table td {
padding: 0.82rem 0.9rem;
vertical-align: middle;
border-bottom: 1px solid #edf0f5;
}
.unidades-table th {
background: #fbfcfe;
color: #475569;
font-size: .75rem;
font-weight: 800;
text-transform: uppercase;
letter-spacing: 0.04em;
}
.unidades-table tbody tr:hover {
background: #fafcff;
}
.unidades-name-cell {
display: flex;
align-items: center;
gap: 0.75rem;
min-height: 48px;
min-width: 250px;
padding: 3px 0;
}
.unidades-avatar {
width: 42px;
height: 42px;
flex: 0 0 42px;
border-radius: 50%;
display: inline-flex;
align-items: center;
justify-content: center;
overflow: hidden;
background: var(--unidade-avatar-cor, var(--cor-unidade, #2d3142));
color: #fff;
box-shadow: 0 0 0 3px #fff, 0 7px 16px rgba(15,23,42,0.18);
}
.unidades-avatar img {
width: 100%;
height: 100%;
display: block;
object-fit: cover;
border-radius: 50%;
}
.unidades-name-info {
min-width: 0;
display: flex;
flex-direction: column;
gap: 0.12rem;
}
.unidades-name-info strong {
max-width: 320px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
font-size: 0.94rem;
}
.unidades-name-info span {
display: flex;
align-items: center;
gap: 0.35rem;
flex-wrap: wrap;
}
.unidades-tipo {
display: inline-flex;
align-items: center;
min-height: 20px;
padding: 0 0.45rem;
border-radius: 999px;
background: #e9f7ef;
color: #166534;
font-size: .75rem;
font-weight: 800;
text-transform: uppercase;
}
.unidades-tipo.is-matriz {
background: #eef2ff;
color: #3730a3;
}
.unidades-name-info small,
.unidades-muted {
color: #64748b;
font-size: 0.82rem;
}
.unidades-status {
min-width: 122px;
min-height: 32px;
display: inline-flex;
align-items: center;
justify-content: center;
gap: 0.35rem;
border: 1px solid transparent;
border-radius: 999px;
padding: 0.25rem 0.65rem;
font-size: 0.78rem;
font-weight: 800;
white-space: nowrap;
background: #fff;
cursor: pointer;
}
.unidades-status:disabled {
opacity: 0.72;
cursor: not-allowed;
}
.unidades-status:not(:disabled):hover,
.unidades-status:not(:disabled):focus {
filter: brightness(0.98);
box-shadow: 0 0 0 3px rgba(79, 70, 229, 0.08);
}
.unidades-status--success { color: #166534; background: #ecfdf3; border-color: #bbf7d0; }
.unidades-status--warning { color: #92400e; background: #fffbeb; border-color: #fde68a; }
.unidades-status--danger { color: #991b1b; background: #fef2f2; border-color: #fecaca; }
.unidades-status--primary { color: #1d4ed8; background: #eff6ff; border-color: #bfdbfe; }
.cadastro-module-metricas {
grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}
.cadastro-ag-grid {
flex: 1 1 auto;
width: 100%;
--ss-grid-height: 100%;
}
.cadastro-inner-grid {
width: 100%;
--ss-grid-height: 360px;
border: 1px solid #dfe5ee;
border-radius: 8px;
overflow: hidden;
}
.cadastro-categorias-grid {
margin-top: 1rem;
}
.cadastro-categorias-actions {
display: flex;
align-items: end;
}
.cadastro-friendly-form .ss-form-grid {
grid-template-columns: repeat(12, minmax(0, 1fr));
}
.cadastro-friendly-form .unidade-config-card {
border-color: #e2e8f0;
background: #fff;
}
.cadastro-cards {
flex: 1 1 auto;
display: grid;
grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
grid-auto-rows: max-content;
gap: 0.85rem;
align-content: start;
min-height: 0;
padding: 0.85rem;
overflow-y: auto;
}
.catalogo-cards {
flex: 1 1 auto;
display: grid;
grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr));
grid-auto-rows: max-content;
gap: 0.85rem;
align-content: start;
min-height: 0;
padding: 0.85rem;
overflow-y: auto;
}
.catalogo-cards--compact {
grid-template-columns: repeat(auto-fill, minmax(min(100%, 255px), 1fr));
gap: 0.65rem;
padding: 0.65rem;
}
.catalogo-cards.catalogo-categorias-grupos {
grid-template-columns: minmax(0, 1fr);
gap: 0.85rem;
padding: 0.85rem;
}
.cards-lista-novo-cadastro-row {
display: flex;
align-items: center;
justify-content: flex-start;
}
.cards-lista-novo-cadastro {
min-width: 0;
}
.catalogo-categorias-grupo-grid {
grid-template-columns: repeat(auto-fill, minmax(min(100%, 255px), 1fr));
}
.catalogo-categorias-grupo-vazio {
grid-column: 1 / -1;
min-height: 66px;
}
.catalogo-categoria-cardapios-input-group {
flex-wrap: nowrap;
align-items: stretch;
}
.catalogo-categoria-cardapios-control {
flex: 1 1 auto;
min-width: 0;
}
.catalogo-categoria-cardapios-control .ss-tags-select-control {
border-top-right-radius: 0 !important;
border-bottom-right-radius: 0 !important;
}
.catalogo-categoria-cardapios-input-group > .btn {
flex: 0 0 30px;
width: 30px;
height: var(--ss-control-height);
min-height: var(--ss-control-height);
padding: 0;
border-top-left-radius: 0;
border-bottom-left-radius: 0;
font-size: 0.72rem;
}
.catalogo-card {
min-width: 0;
display: flex;
flex-direction: column;
border: 1px solid #dfe5ee;
border-radius: 12px;
background: #fff;
box-shadow: 0 6px 18px rgba(15, 23, 42, 0.06);
overflow: hidden;
transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}
.catalogo-card.is-clicavel {
cursor: pointer;
}
.catalogo-card.is-clicavel:hover {
border-color: color-mix(in srgb, var(--cor-unidade, #2d3142) 35%, #dfe5ee);
box-shadow: 0 10px 24px rgba(15, 23, 42, 0.1);
transform: translateY(-1px);
}
.catalogo-card.is-dragging {
opacity: 0.58;
box-shadow: 0 12px 28px rgba(15, 23, 42, 0.16);
}
.catalogo-card--compact .catalogo-card-head {
min-height: 62px;
gap: 0.55rem;
padding: 0.6rem 0.65rem;
}
.catalogo-card--compact .catalogo-card-icon {
width: 36px;
height: 36px;
border-radius: 9px;
font-size: 0.95rem;
}
.catalogo-card--compact .catalogo-card-identidade strong {
font-size: 0.86rem;
}
.catalogo-card--compact .catalogo-card-identidade span {
font-size: .75rem;
}
.catalogo-card--compact.catalogo-card--impressora .catalogo-card-head {
min-height: 86px;
}
.impressora-card-meta {
display: grid;
justify-items: start;
gap: 0.2rem;
min-width: 0;
max-width: 100%;
}
.catalogo-card-identidade .impressora-card-meta-badge {
display: inline-flex;
align-items: center;
gap: 0.28rem;
max-width: 100%;
min-height: 0;
padding: 0;
border: 0;
border-radius: 0;
background: transparent;
color: #64748b;
font-size: 0.68rem;
font-weight: 700;
line-height: 1.2;
}
.impressora-card-meta-badge i {
flex: 0 0 auto;
color: #94a3b8;
font-size: 0.62rem;
}
.catalogo-card-identidade .impressora-card-meta-badge > span {
min-width: 0;
overflow: hidden;
color: inherit;
font-size: inherit;
font-weight: inherit;
text-overflow: ellipsis;
white-space: nowrap;
}
.catalogo-card--compact .catalogo-card-badge {
min-height: 21px;
padding: 0.1rem 0.4rem;
font-size: .75rem;
}
.catalogo-card--compact .catalogo-card-foot {
min-height: 42px;
justify-content: flex-end;
padding: 0.42rem 0.65rem;
}
.catalogo-card--compact.catalogo-card--impressora .catalogo-card-foot {
justify-content: space-between;
}
.impressora-card-vinculos {
display: inline-flex;
align-items: center;
gap: 0.6rem;
min-width: 0;
}
.impressora-card-vinculo {
display: inline-flex;
align-items: center;
gap: 0.3rem;
min-width: 0;
color: #64748b;
font-size: 0.68rem;
font-weight: 700;
white-space: nowrap;
}
.impressora-card-vinculo i {
color: #94a3b8;
font-size: 0.64rem;
}
.catalogo-card--categoria .catalogo-card-foot {
justify-content: space-between;
}
.catalogo-card--compact .catalogo-card-actions .btn,
.catalogo-card--compact .catalogo-card-move {
width: 30px;
min-width: 30px;
height: 28px;
min-height: 28px;
padding: 0;
}
.catalogo-card-move {
cursor: grab;
touch-action: none;
user-select: none;
-webkit-user-select: none;
}
.catalogo-card-move:active {
cursor: grabbing;
}
.catalogo-card-badge--simple {
width: max-content;
min-height: 18px !important;
padding: 0.05rem 0.35rem !important;
border-color: #e2e8f0;
background: #f8fafc;
font-size: 0.61rem !important;
font-weight: 700;
}
.catalogo-card-head {
display: grid;
grid-template-columns: auto minmax(0, 1fr) auto;
align-items: center;
gap: 0.75rem;
padding: 0.85rem;
border-bottom: 1px solid #eef2f7;
}
.catalogo-card-icon {
width: 44px;
height: 44px;
display: inline-flex;
align-items: center;
justify-content: center;
border-radius: 11px;
background: color-mix(in srgb, var(--cor-unidade, #2d3142) 10%, #fff);
color: var(--cor-unidade, #2d3142);
font-size: 1.15rem;
}
.catalogo-card-identidade {
min-width: 0;
display: grid;
gap: 0.2rem;
}
.catalogo-card-identidade strong,
.catalogo-card-identidade span {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.catalogo-card-identidade strong {
color: #0f172a;
font-size: 0.94rem;
font-weight: 800;
}
.catalogo-card-identidade span {
color: #64748b;
font-size: 0.75rem;
}
.catalogo-card-badge {
min-height: 24px;
display: inline-flex;
align-items: center;
gap: 0.25rem;
padding: 0.15rem 0.5rem;
border: 1px solid #dbeafe;
border-radius: 999px;
background: #eff6ff;
color: #1d4ed8;
font-size: .75rem;
font-weight: 800;
white-space: nowrap;
}
.catalogo-card-badge.is-muted {
border-color: #e2e8f0;
background: #f8fafc;
color: #64748b;
}
.catalogo-card-badge.is-success {
border-color: #bbf7d0;
background: #f0fdf4;
color: #15803d;
}
.catalogo-card-badge.is-danger {
border-color: #fecaca;
background: #fef2f2;
color: #b91c1c;
}
.catalogo-card-body {
display: grid;
gap: 0.7rem;
padding: 0.8rem 0.85rem;
}
.catalogo-card-descricao {
min-height: 2.55em;
margin: 0;
color: #64748b;
font-size: 0.76rem;
line-height: 1.4;
}
.catalogo-card-metricas {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 0.5rem;
}
.catalogo-card-metrica {
min-width: 0;
display: grid;
gap: 0.12rem;
padding: 0.55rem 0.6rem;
border: 1px solid #e7ebf2;
border-radius: 9px;
background: #fbfcfe;
}
.catalogo-card-metrica span {
overflow: hidden;
color: #64748b;
font-size: .75rem;
font-weight: 700;
text-overflow: ellipsis;
white-space: nowrap;
}
.catalogo-card-metrica strong {
overflow: hidden;
color: #172033;
font-size: 0.82rem;
font-weight: 800;
text-overflow: ellipsis;
white-space: nowrap;
}
.catalogo-card-tags {
display: flex;
flex-wrap: wrap;
gap: 0.35rem;
}
.catalogo-card-foot {
display: flex;
align-items: center;
justify-content: space-between;
gap: 0.65rem;
margin-top: auto;
padding: 0.65rem 0.85rem;
border-top: 1px solid #eef2f7;
background: #fbfcfe;
}
.catalogo-card-foot small {
color: #64748b;
font-size: .75rem;
}
.catalogo-card-actions {
flex: 0 0 auto;
display: inline-flex;
gap: 0.35rem;
}
.catalogo-cards-vazio {
grid-column: 1 / -1;
}
.catalogo-friendly-form .modal-body {
display: grid;
grid-auto-rows: max-content;
align-content: start;
align-items: start;
gap: 1rem;
}
.catalogo-friendly-form .unidade-tab-intro {
margin-bottom: 0;
}
.catalogo-friendly-form .unidade-config-card {
margin: 0;
border-color: #e2e8f0;
background: #fff;
}
.catalogo-friendly-form .tab-pane > .unidade-config-card {
margin-top: 0.85rem;
}
.fornecedor-card {
min-width: 0;
display: flex;
flex-direction: column;
border: 1px solid #dfe5ee;
border-radius: 12px;
background: #fff;
box-shadow: 0 6px 18px rgba(15, 23, 42, 0.06);
overflow: hidden;
}
.fornecedor-card-head {
display: grid;
grid-template-columns: auto minmax(0, 1fr) auto;
align-items: center;
gap: 0.75rem;
padding: 0.85rem;
border-bottom: 1px solid #eef2f7;
}
.fornecedor-card .cadastro-lista-foto {
position: relative;
width: 58px;
height: 58px;
border-radius: 50%;
}
.fornecedor-card-foto-editar {
position: absolute;
right: 2px;
bottom: 2px;
width: 22px;
height: 22px;
display: inline-flex;
align-items: center;
justify-content: center;
border-radius: 50%;
background: rgba(255, 255, 255, 0.94);
color: #334155;
font-size: .75rem;
line-height: 1;
box-shadow: 0 2px 6px rgba(15, 23, 42, 0.25);
pointer-events: none;
}
.fornecedor-card-identidade {
min-width: 0;
display: grid;
gap: 0.2rem;
}
.fornecedor-card-identidade strong,
.fornecedor-card-identidade span {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.fornecedor-card-identidade strong {
color: #0f172a;
font-size: 0.94rem;
font-weight: 800;
}
.fornecedor-card-identidade span {
color: #64748b;
font-size: 0.76rem;
}
.fornecedor-card-identidade span i {
margin-right: 0.18rem;
color: #16a34a;
}
.fornecedor-card-body {
display: grid;
gap: 0.7rem;
padding: 0.8rem 0.85rem;
}
.fornecedor-card-tags {
display: flex;
flex-wrap: wrap;
gap: 0.28rem;
}
.fornecedor-card-tags > span {
min-height: 22px;
display: inline-flex;
align-items: center;
padding: 0.1rem 0.4rem;
border: 1px solid #dbeafe;
border-radius: 999px;
background: #eff6ff;
color: #1d4ed8;
font-size: .68rem;
font-weight: 800;
}
.fornecedor-card-tags > span.is-muted {
border-color: #e2e8f0;
background: #f8fafc;
color: #64748b;
}
.fornecedor-card-unidades {
min-width: 0;
display: flex;
align-items: flex-start;
gap: 0.45rem;
color: #475569;
font-size: 0.76rem;
line-height: 1.4;
}
.fornecedor-card-unidades i {
flex: 0 0 auto;
color: var(--cor-unidade, #2d3142);
}
.fornecedor-card-foot {
display: flex;
align-items: center;
justify-content: space-between;
gap: 0.65rem;
margin-top: auto;
padding: 0.65rem 0.85rem;
border-top: 1px solid #eef2f7;
background: #fbfcfe;
}
.fornecedor-card-foot small {
color: #64748b;
font-size: .75rem;
}
.fornecedor-card-actions {
flex: 0 0 auto;
display: inline-flex;
gap: 0.35rem;
}
.fornecedor-cards-vazio {
grid-column: 1 / -1;
}
.cadastro-tags {
display: inline-flex;
align-items: center;
gap: 0.25rem;
flex-wrap: wrap;
}
.cadastro-tags span {
display: inline-flex;
align-items: center;
min-height: 22px;
padding: 0.1rem 0.45rem;
border: 1px solid #dbe3ef;
border-radius: 999px;
background: #f8fafc;
color: #334155;
font-size: .75rem;
font-weight: 700;
}
.cadastro-grid-switch {
justify-content: center;
width: 100%;
}
.cadastro-lista-foto {
display: inline-grid;
width: 38px;
height: 38px;
place-items: center;
padding: 0;
overflow: hidden;
border: 1px solid #d7deea;
border-radius: 6px;
background: #f8fafc;
vertical-align: middle;
}
button.cadastro-lista-foto {
cursor: pointer;
}
button.cadastro-lista-foto:hover {
border-color: var(--ss-primary, #4f46e5);
box-shadow: 0 0 0 2px color-mix(in srgb, var(--ss-primary, #4f46e5) 18%, transparent);
}
.cadastro-lista-foto img {
width: 100%;
height: 100%;
object-fit: cover;
}
.cadastro-switch-field {
min-height: 31px;
}
.fornecedor-geral-form {
display: grid;
gap: 1rem;
}
.fornecedor-identidade-layout {
display: grid;
grid-template-columns: 150px minmax(0, 1fr);
gap: 1rem;
align-items: start;
}
.fornecedor-foto-field .form-label {
display: block;
}
.fornecedor-foto-preview {
position: relative;
display: flex;
align-items: center;
justify-content: center;
width: 120px;
height: 120px;
margin: 0 auto 0.35rem;
padding: 0;
overflow: hidden;
border: 2px dashed #dfe1e6;
border-radius: 8px;
background: #fff;
color: #9b96aa;
}
.fornecedor-foto-field {
text-align: center;
}
.fornecedor-foto-field > small {
display: block;
}
.fornecedor-foto-preview img {
width: 100%;
height: 100%;
object-fit: cover;
}
.fornecedor-foto-preview i {
position: absolute;
font-size: 2rem;
}
.fornecedor-foto-preview img:not([hidden]) + i {
width: 34px;
height: 34px;
display: inline-flex;
align-items: center;
justify-content: center;
border-radius: 50%;
background: rgba(17, 24, 39, 0.58);
color: #fff;
font-size: 1rem;
}
.fornecedor-status-principal {
margin-top: 0.8rem;
min-height: 31px;
}
.fornecedor-comissoes-details {
margin-top: 0.9rem;
padding-top: 0.75rem;
border-top: 1px solid #eef2f7;
}
.fornecedor-comissoes-details .unidade-simple-note {
margin-top: 0.75rem;
}
.fornecedor-perfis-grid,
.fornecedor-comissoes-grid {
display: grid;
grid-template-columns: repeat(5, minmax(0, 1fr));
gap: 0.75rem;
}
.fornecedor-contato-grid {
padding-top: 0.25rem;
}
.taxas-entrega-lista {
overflow: hidden;
}
.produtos-panel-toolbar.taxas-entrega-toolbar {
align-items: center;
justify-content: flex-start;
flex-direction: row;
flex-wrap: nowrap;
}
.taxas-entrega-toolbar .produtos-busca {
flex: 0 1 520px;
min-width: 210px;
width: min(100%, 520px);
}
.taxas-raio-filtro {
min-height: 32px;
display: inline-flex;
align-items: center;
flex: 0 0 auto;
gap: 0.35rem;
margin: 0;
padding: 0.18rem 0.42rem;
border: 1px solid #dbe3ed;
border-radius: 8px;
background: #f8fafc;
color: #64748b;
font-size: 0.7rem;
font-weight: 800;
white-space: nowrap;
}
.taxas-raio-filtro > i {
color: var(--cor-unidade, #2d3142);
}
.taxas-raio-filtro .form-control {
width: 66px;
min-height: 25px;
height: 25px;
padding: 0.12rem 0.3rem;
border-color: #dbe3ed;
font-size: 0.7rem;
text-align: center;
}
.taxas-raio-contador {
flex: 0 0 auto;
color: #64748b;
font-size: 0.7rem;
font-weight: 800;
white-space: nowrap;
}
.taxas-tipo-frete {
min-width: 0;
display: flex;
align-items: center;
justify-content: flex-start;
flex: 0 0 auto;
gap: 0.7rem;
margin: 0;
padding: 0;
border: 0;
color: #334155;
white-space: nowrap;
}
.taxas-tipo-frete legend {
width: auto;
margin: 0;
color: #64748b;
font-size: .75rem;
font-weight: 800;
text-transform: uppercase;
letter-spacing: 0.035em;
}
.taxas-tipo-frete label {
display: inline-flex;
align-items: center;
gap: 0.28rem;
margin: 0;
font-size: 0.78rem;
font-weight: 700;
cursor: pointer;
}
.taxas-tipo-frete input {
width: 0.95rem;
height: 0.95rem;
margin: 0;
accent-color: var(--cor-unidade, #2d3142);
}
.taxas-tipo-frete input:disabled,
.taxas-tipo-frete input:disabled + span {
cursor: not-allowed;
opacity: 0.62;
}
.taxas-massa-aviso {
width: fit-content;
max-width: 100%;
display: inline-flex;
align-items: flex-start;
gap: 0.45rem;
margin-bottom: 0.75rem;
padding: 0.42rem 0.7rem;
border: 1px solid #bfdbfe;
border-radius: 999px;
background: #eff6ff;
color: #1d4ed8;
font-size: 0.74rem;
font-weight: 750;
line-height: 1.35;
white-space: normal;
}
.taxas-massa-aviso i {
flex: 0 0 auto;
margin-top: 0.12rem;
}
.taxas-massa-aviso span {
min-width: 0;
overflow-wrap: anywhere;
}
.taxas-massa-campos {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 0.75rem;
}
.taxas-massa-confirmacao[hidden],
.taxas-massa-campos[hidden] {
display: none;
}
.taxas-massa-resumo {
display: flex;
flex-direction: column;
gap: 0.15rem;
margin-bottom: 0.65rem;
color: #334155;
}
.taxas-massa-resumo strong {
color: #0f172a;
font-size: 0.9rem;
}
.taxas-massa-resumo span {
font-size: 0.78rem;
}
.taxas-massa-tabela-wrap {
max-height: min(52vh, 440px);
border: 1px solid #dbe3ee;
border-radius: 0.7rem;
}
.taxas-massa-tabela {
min-width: 620px;
margin: 0;
}
.taxas-massa-tabela thead th {
position: sticky;
top: 0;
z-index: 1;
padding: 0.58rem 0.7rem;
border-bottom-color: #cbd5e1;
background: #f1f5f9;
color: #475569;
font-size: 0.72rem;
font-weight: 800;
text-transform: uppercase;
}
.taxas-massa-tabela tbody td {
padding: 0.55rem 0.7rem;
color: #334155;
font-size: 0.8rem;
}
.taxas-massa-bairro {
color: #0f172a !important;
font-weight: 800;
}
.taxas-massa-novo-valor {
color: #15803d !important;
font-weight: 800;
}
.taxas-massa-global-raio,
.taxas-massa-global-bloco {
min-width: 0;
border: 1px solid #e2e8f0;
border-radius: 10px;
background: #fff;
}
.taxas-massa-global-raio {
display: grid;
grid-template-columns: minmax(260px, 1fr) auto;
align-items: center;
gap: 0.8rem;
margin-bottom: 0.6rem;
padding: 0.58rem 0.65rem;
}
.taxas-massa-global-section-copy {
min-width: 0;
display: flex;
align-items: center;
gap: 0.5rem;
}
.taxas-massa-global-section-copy > span {
width: 28px;
height: 28px;
flex: 0 0 28px;
display: inline-flex;
align-items: center;
justify-content: center;
border-radius: 8px;
background: color-mix(in srgb, var(--cor-unidade, #2d3142) 10%, #fff);
color: var(--cor-unidade, #2d3142);
}
.taxas-massa-global-section-copy > div {
min-width: 0;
display: grid;
gap: 0.08rem;
}
.taxas-massa-global-section-copy strong {
color: #0f172a;
font-size: 0.76rem;
font-weight: 800;
}
.taxas-massa-global-section-copy small {
color: #64748b;
font-size: 0.75rem;
line-height: 1.3;
}
.taxas-massa-global-raio-campos {
display: grid;
grid-template-columns: repeat(2, 124px);
gap: 0.45rem;
}
.taxas-massa-global-raio-campos .ss-field,
.taxas-massa-global-regra .ss-field,
.taxas-massa-global-valor {
min-width: 0;
margin: 0;
}
.taxas-massa-global-raio-campos .form-label,
.taxas-massa-global-regra .form-label,
.taxas-massa-global-valor .form-label {
margin-bottom: 0.16rem;
color: #475569;
font-size: 0.62rem;
font-weight: 850;
}
.taxas-massa-global-km-input {
position: relative;
}
.taxas-massa-global-km-input .form-control {
padding-right: 2rem;
}
.taxas-massa-global-km-input > span {
position: absolute;
top: 50%;
right: 0.48rem;
color: #64748b;
font-size: 0.65rem;
font-weight: 800;
transform: translateY(-50%);
pointer-events: none;
}
.taxas-massa-global-opcoes {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
align-items: stretch;
gap: 0.55rem;
}
.taxas-massa-global-bloco {
display: flex;
flex-direction: column;
overflow: hidden;
}
.taxas-massa-global-bloco > header {
min-height: 70px;
display: grid;
grid-template-columns: minmax(0, 1fr) auto;
align-items: start;
gap: 0.5rem;
padding: 0.55rem;
border-bottom: 1px solid #eef2f7;
background: #f8fafc;
}
.taxas-massa-global-incluir {
flex: 0 0 auto;
display: inline-flex;
align-items: center;
gap: 0.3rem;
margin: 0;
color: #475569;
font-size: 0.75rem;
font-weight: 700;
cursor: pointer;
white-space: nowrap;
}
.taxas-massa-global-incluir input {
width: 0.92rem;
height: 0.92rem;
margin: 0;
accent-color: var(--cor-unidade, #2d3142);
}
.taxas-massa-global-bloco-body,
.taxas-massa-global-regra {
display: grid;
align-items: end;
gap: 0.5rem;
padding: 0.58rem;
}
.taxas-massa-global-bloco-body {
grid-template-columns: auto minmax(0, 1fr);
}
.taxas-massa-global-regra {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.taxas-massa-global-regra > .taxas-massa-global-switch {
grid-column: 1 / -1;
}
.taxas-massa-global-switch {
align-self: center;
min-height: 28px;
margin: 0;
white-space: nowrap;
}
.taxas-massa-global-bloco .promocoes-input-prefix,
.taxas-massa-global-bloco .promocoes-input-suffix {
width: 100%;
}
.taxas-massa-global-explicacao {
display: flex;
align-items: flex-start;
gap: 0.35rem;
margin: auto 0.58rem 0.58rem;
padding: 0.4rem 0.45rem;
border-radius: 7px;
background: #eef6ff;
color: #1d4ed8;
font-size: 0.62rem;
font-weight: 700;
line-height: 1.35;
}
.taxas-massa-global-explicacao i {
margin-top: 0.1rem;
}
.taxas-massa-global-bloco.is-disabled > :not(header),
.taxas-massa-global-bloco.is-disabled > header .taxas-massa-global-section-copy {
opacity: 0.48;
}
.taxas-massa-global-bloco input:disabled,
.taxas-massa-global-bloco .form-control:disabled {
cursor: not-allowed;
}
.taxas-massa-global-tabela {
min-width: 900px;
}
.taxas-massa-global-tabela tbody td:nth-child(n + 3) {
min-width: 180px;
font-size: 0.72rem;
}
@media (max-width: 991.98px) {
.taxas-massa-global-opcoes {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.taxas-massa-global-bloco:last-child {
grid-column: 1 / -1;
}
}
@media (max-width: 767.98px) {
.taxas-massa-global-raio {
grid-template-columns: 1fr;
}
.taxas-massa-global-raio-campos {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.taxas-massa-global-opcoes {
grid-template-columns: 1fr;
}
.taxas-massa-global-bloco:last-child {
grid-column: auto;
}
}
.taxas-entrega-workspace {
flex: 1 1 auto;
min-width: 0;
min-height: 0;
overflow: hidden;
}
.taxas-entrega-list-pane {
width: 100%;
height: 100%;
min-width: 0;
min-height: 0;
overflow-y: auto;
background: #f8fafc;
-webkit-overflow-scrolling: touch;
}
.taxa-entrega-editor-topo:empty {
display: none;
}
.taxa-entrega-editor-topo {
padding: 0.75rem 0.75rem 0;
background: #f8fafc;
}
.taxa-inline-editor {
width: 100%;
overflow: hidden;
border: 1px solid #cbd5e1;
border-radius: 10px;
background: #fff;
box-shadow: 0 8px 22px rgba(15, 23, 42, 0.1);
}
.taxa-inline-editor[hidden] {
display: none !important;
}
.taxa-inline-editor-head {
display: flex;
align-items: center;
justify-content: space-between;
gap: 0.75rem;
padding: 0.7rem 0.8rem;
border-bottom: 1px solid #dfe5ee;
background: #f8fafc;
}
.taxa-inline-editor-head > div {
min-width: 0;
display: flex;
align-items: center;
gap: 0.6rem;
}
.taxa-inline-editor-head > div > i {
width: 32px;
height: 32px;
flex: 0 0 32px;
display: inline-flex;
align-items: center;
justify-content: center;
border-radius: 8px;
background: var(--cor-unidade, #2d3142);
color: #fff;
}
.taxa-inline-editor-head span {
min-width: 0;
display: grid;
gap: 0.08rem;
}
.taxa-inline-editor-head strong {
color: #0f172a;
font-size: 0.86rem;
}
.taxa-inline-editor-head small {
color: #64748b;
font-size: 0.7rem;
}
.taxa-inline-editor-body {
padding: 0.8rem;
}
.taxa-inline-editor-actions {
display: flex;
align-items: center;
justify-content: flex-end;
gap: 0.5rem;
padding: 0.65rem 0.8rem;
border-top: 1px solid #dfe5ee;
background: #f8fafc;
}
.taxa-inline-editor .taxa-editor-layout {
grid-template-columns: minmax(0, 1fr);
align-items: start;
}
.taxa-config-unificada-grid {
display: grid;
grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
align-items: start;
gap: 0.85rem;
}
.taxa-config-unificada-grid .taxa-nome-local {
margin-top: 0;
}
.taxa-config-unificada-grid .taxa-raio-origem {
margin-top: 0.75rem;
}
@media (max-width: 767.98px) {
.taxa-inline-editor .taxa-editor-layout {
grid-template-columns: 1fr;
}
.taxa-config-unificada-grid {
grid-template-columns: 1fr;
}
}
.taxas-entrega-cards {
display: grid;
grid-template-columns: minmax(0, 1fr);
grid-auto-rows: max-content;
gap: 0.7rem;
align-content: start;
align-items: start;
min-height: 0;
padding: 0.75rem;
}
.taxas-entrega-mapa-geral-card {
display: none;
}
.taxa-entrega-card {
align-self: start;
height: auto;
min-height: max-content;
min-width: 0;
border-radius: 9px;
box-shadow: 0 3px 10px rgba(15, 23, 42, 0.055);
}
.taxa-entrega-card.is-editando {
display: block;
padding: 0;
border-color: var(--taxa-cor, #94a3b8);
}
.taxa-entrega-card.is-editando > :not(.taxa-inline-editor) {
display: none;
}
.taxa-entrega-card.is-editando > .taxa-inline-editor {
border: 0;
border-radius: inherit;
box-shadow: none;
}
.taxa-card-head {
display: flex;
align-items: center;
gap: 0.6rem;
padding: 0.68rem 0.75rem;
border-bottom: 1px solid #eef2f7;
}
.taxa-card-icone {
width: 36px;
height: 36px;
flex: 0 0 36px;
display: inline-flex;
align-items: center;
justify-content: center;
border-radius: 10px;
background: color-mix(in srgb, var(--taxa-cor, var(--cor-unidade, #2d3142)) 14%, #fff);
color: var(--taxa-cor, var(--cor-unidade, #2d3142));
font-size: 1rem;
}
.taxa-card-identidade {
min-width: 0;
display: grid;
gap: 0.2rem;
}
.taxa-card-identidade > strong {
overflow: hidden;
color: #0f172a;
font-size: 0.92rem;
font-weight: 800;
text-overflow: ellipsis;
white-space: nowrap;
}
.taxa-card-identidade > span {
min-width: 0;
display: flex;
align-items: center;
gap: 0.35rem;
color: #64748b;
font-size: 0.76rem;
}
.taxa-card-identidade > span > i {
color: var(--taxa-cor, var(--cor-unidade, #2d3142));
}
.taxa-card-identidade > span > span {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.taxa-card-metricas {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 0.4rem;
padding: 0.62rem 0.75rem;
}
.taxa-card-metrica {
min-width: 0;
display: grid;
gap: 0.18rem;
padding: 0.45rem 0.5rem;
border: 1px solid #e2e8f0;
border-radius: 8px;
background: #f8fafc;
}
.taxa-card-metrica > span {
color: #64748b;
font-size: .75rem;
font-weight: 700;
white-space: nowrap;
}
.taxa-card-metrica > strong {
overflow: hidden;
color: #1e293b;
font-size: 0.76rem;
font-variant-numeric: tabular-nums;
text-overflow: ellipsis;
white-space: nowrap;
}
.taxa-card-metrica.is-destaque {
border-color: #bbf7d0;
background: #f0fdf4;
}
.taxa-card-metrica.is-destaque > strong {
color: #166534;
}
.taxa-card-foot small {
min-width: 0;
display: flex;
align-items: center;
gap: 0.35rem;
color: #64748b;
font-size: .75rem;
}
.taxa-card-foot small span {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.taxa-card-foot {
justify-content: flex-end;
padding: 0.5rem 0.75rem 0.58rem;
}
.taxa-entrega-card.is-mapa-ativo {
border-color: color-mix(in srgb, var(--taxa-cor, var(--cor-unidade, #2d3142)) 58%, #fff);
box-shadow: 0 0 0 2px color-mix(in srgb, var(--taxa-cor, var(--cor-unidade, #2d3142)) 14%, transparent), 0 8px 20px rgba(15, 23, 42, 0.1);
}
@media (min-width: 1200px) {
.taxas-entrega-workspace {
display: grid;
grid-template-columns: minmax(500px, .95fr) minmax(390px, 1.05fr);
}
.taxas-entrega-list-pane {
border-right: 1px solid #dfe5ee;
}
.taxas-entrega-cards {
gap: 0.45rem;
padding: 0.65rem;
}
.taxa-entrega-card {
display: grid;
grid-template-columns: minmax(155px, .88fr) minmax(250px, 1.12fr) auto;
align-items: stretch;
min-height: 68px;
}
.taxa-card-head {
min-width: 0;
padding: 0.52rem 0.6rem;
border-right: 1px solid #eef2f7;
border-bottom: 0;
}
.taxa-card-icone {
width: 32px;
height: 32px;
flex-basis: 32px;
border-radius: 9px;
font-size: 0.88rem;
}
.taxa-card-identidade > strong {
font-size: 0.82rem;
}
.taxa-card-identidade > span {
font-size: 0.7rem;
}
.taxa-card-metricas {
align-items: center;
gap: 0.3rem;
padding: 0.46rem;
}
.taxa-card-metrica {
align-content: center;
min-height: 48px;
padding: 0.32rem 0.38rem;
border-radius: 7px;
}
.taxa-card-metrica > span,
.taxa-card-metrica > strong {
font-size: 0.68rem;
}
.taxa-card-foot {
align-items: center;
align-self: stretch;
margin: 0;
padding: 0.5rem;
border-top: 0;
border-left: 1px solid #eef2f7;
}
.taxa-card-foot .unidade-card-acoes {
flex-wrap: nowrap;
}
.taxas-entrega-mapa-geral-card {
--taxas-mapa-ink: #102044;
min-width: 0;
min-height: 0;
display: flex;
flex-direction: column;
background: #fff;
}
.taxas-entrega-mapa-geral-head {
min-height: 55px;
display: flex;
align-items: center;
justify-content: space-between;
gap: 0.75rem;
padding: 0.65rem 0.75rem;
border-bottom: 1px solid #dfe5ee;
}
.taxas-entrega-mapa-geral-head > div {
min-width: 0;
display: grid;
gap: 0.12rem;
}
.taxas-entrega-mapa-geral-head strong {
color: #0f172a;
font-size: 0.84rem;
}
.taxas-entrega-mapa-geral-head span {
overflow: hidden;
color: #64748b;
font-size: 0.72rem;
text-overflow: ellipsis;
white-space: nowrap;
}
.taxas-entrega-mapa-geral-badge {
display: inline-flex;
align-items: center;
gap: 0.35rem;
flex: 0 0 auto;
padding: 0.32rem 0.5rem;
border-radius: 999px;
background: #eef2ff;
color: #475569 !important;
font-weight: 800;
}
.taxas-entrega-mapa-geral-wrap {
position: relative;
flex: 1 1 auto;
min-height: 390px;
overflow: hidden;
background: var(--ss-light, #f8f9fc);
}
.taxas-entrega-mapa-geral {
position: absolute;
inset: 0;
z-index: 1;
}
.taxas-entrega-mapa-geral .leaflet-control-zoom a {
color: var(--taxas-mapa-ink);
}
.taxas-entrega-mapa-geral-status {
height: 25px;
display: flex;
flex: 0 0 25px;
align-items: center;
padding: 0 11px;
overflow: hidden;
border-top: 1px solid #dbe3f0;
background: #fff;
color: #475569;
font-size: 0.75rem;
text-overflow: ellipsis;
white-space: nowrap;
}
.taxas-entrega-mapa-geral-status.is-ok {
color: #166534;
}
.taxa-mapa-geral-popup {
min-width: 200px;
}
.taxa-mapa-geral-popup strong {
color: #0f172a;
font-size: 0.82rem;
}
.taxa-mapa-geral-popup span {
display: block;
margin-top: 3px;
color: #64748b;
font-size: 0.75rem;
}
.taxa-mapa-geral-popup b {
display: block;
margin-top: 3px;
color: #166534;
font-size: 0.76rem;
}
}
.taxas-entrega-cards-vazio {
grid-column: 1 / -1;
}
.perfis-cards-panel {
overflow: hidden;
}
.perfis-cards {
flex: 1 1 auto;
display: grid;
grid-template-columns: repeat(auto-fill, minmax(min(100%, 360px), 1fr));
grid-auto-rows: max-content;
align-content: start;
align-items: start;
gap: 0.7rem;
min-height: 0;
padding: 0.75rem;
overflow-y: auto;
-webkit-overflow-scrolling: touch;
}
.perfil-card {
align-self: start;
height: auto;
min-width: 0;
min-height: max-content;
border-radius: 9px;
box-shadow: 0 3px 10px rgba(15, 23, 42, 0.055);
}
.perfil-card-head {
display: flex;
align-items: center;
gap: 0.65rem;
padding: 0.7rem 0.75rem;
border-bottom: 1px solid #eef2f7;
}
.perfil-card-icone {
width: 38px;
height: 38px;
flex: 0 0 38px;
display: inline-flex;
align-items: center;
justify-content: center;
border-radius: 10px;
background: color-mix(in srgb, var(--cor-unidade, #2d3142) 12%, #fff);
color: var(--cor-unidade, #2d3142);
font-size: 1rem;
}
.perfil-card-identidade {
min-width: 0;
display: grid;
gap: 0.15rem;
}
.perfil-card-identidade strong {
overflow: hidden;
color: #0f172a;
font-size: 0.92rem;
font-weight: 800;
text-overflow: ellipsis;
white-space: nowrap;
}
.perfil-card-identidade span {
color: #64748b;
font-size: .75rem;
}
.perfil-card-body {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 0.45rem;
padding: 0.65rem 0.75rem;
}
.perfil-card-info {
min-width: 0;
display: flex;
align-items: center;
gap: 0.45rem;
padding: 0.5rem;
border: 1px solid #e2e8f0;
border-radius: 8px;
background: #f8fafc;
}
.perfil-card-info > i {
flex: 0 0 auto;
color: var(--cor-unidade, #2d3142);
}
.perfil-card-info > div {
min-width: 0;
display: grid;
gap: 0.1rem;
}
.perfil-card-info span {
color: #64748b;
font-size: .75rem;
font-weight: 700;
}
.perfil-card-info strong {
overflow: hidden;
color: #1e293b;
font-size: .75rem;
text-overflow: ellipsis;
white-space: nowrap;
}
.perfil-card-foot {
gap: 0.75rem;
padding: 0.55rem 0.75rem 0.62rem;
}
.perfil-card-toggles {
display: inline-flex;
align-items: center;
gap: 0.8rem;
}
.perfil-card-switch {
gap: 0.32rem;
margin: 0;
}
.perfil-card-switch .ss-switch-text {
color: #475569;
font-size: 0.7rem;
font-weight: 700;
}
.perfis-cards-vazio {
grid-column: 1 / -1;
}
.perfil-editor-intro {
margin-bottom: 1rem;
}
.perfil-editor-layout {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 0.9rem;
}
.perfil-config-card {
min-width: 0;
margin: 0;
}
.perfil-identificacao-grid,
.perfil-operacao-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 0.7rem;
}
.perfil-identificacao-grid > .ss-field:only-child {
grid-column: 1 / -1;
}
.perfil-recursos-card {
grid-column: 1 / -1;
}
.perfil-switches-grid {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 0.65rem;
}
.perfil-switches-grid .cadastro-switch-field {
min-height: 42px;
margin: 0;
padding: 0.55rem 0.65rem;
border: 1px solid #e2e8f0;
border-radius: 8px;
background: #f8fafc;
}
.perfil-switches-grid .cadastro-switch-field.is-disabled {
background: #f1f5f9;
opacity: 0.62;
cursor: not-allowed;
}
.perfil-fiscal-avisos {
display: flex;
flex-wrap: wrap;
gap: 0.45rem;
margin-top: 0.65rem;
}
.perfil-fiscal-avisos span {
display: inline-flex;
align-items: center;
gap: 0.35rem;
padding: 0.35rem 0.55rem;
border: 1px solid #fde68a;
border-radius: 999px;
background: #fffbeb;
color: #92400e;
font-size: .75rem;
font-weight: 700;
}
.perfil-fiscal-avisos span[hidden] {
display: none;
}
.perfil-fiscal-divider {
display: flex;
align-items: center;
gap: 0.65rem;
margin: 0.9rem 0 0.7rem;
color: #64748b;
font-size: .75rem;
font-weight: 800;
text-transform: uppercase;
letter-spacing: 0.04em;
}
.perfil-fiscal-divider::after {
content: '';
flex: 1 1 auto;
height: 1px;
background: #e2e8f0;
}
.perfil-fiscal-grid {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 0.7rem;
}
@media (max-width: 991.98px) {
.perfil-editor-layout {
grid-template-columns: 1fr;
}
.perfil-recursos-card {
grid-column: auto;
}
.perfil-switches-grid,
.perfil-fiscal-grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}
.taxa-editor-layout {
display: grid;
grid-template-columns: minmax(280px, 34%) minmax(0, 1fr);
gap: 1rem;
}
.taxa-config-card {
margin: 0;
}
.taxa-nome-local {
margin-top: 0.75rem;
}
.taxa-bairro-autocomplete {
min-width: 0;
}
.taxa-bairro-resultados {
max-height: 238px;
display: grid;
gap: 0.2rem;
margin-top: 0.35rem;
overflow-y: auto;
padding: 0.3rem;
border: 1px solid #cbd5e1;
border-radius: 8px;
background: #fff;
box-shadow: 0 10px 24px rgba(15, 23, 42, 0.12);
}
.taxa-bairro-resultados[hidden] {
display: none;
}
.taxa-bairro-opcao {
min-width: 0;
display: grid;
gap: 0.12rem;
padding: 0.48rem 0.55rem;
border: 0;
border-radius: 6px;
background: transparent;
color: #1e293b;
text-align: left;
}
.taxa-bairro-opcao:hover,
.taxa-bairro-opcao:focus-visible,
.taxa-bairro-opcao.is-active {
background: #eef2ff;
outline: none;
}
.taxa-bairro-opcao strong {
overflow: hidden;
color: #0f172a;
font-size: 0.78rem;
text-overflow: ellipsis;
white-space: nowrap;
}
.taxa-bairro-opcao small {
color: #64748b;
font-size: 0.68rem;
}
.taxa-bairro-vazio {
padding: 0.55rem;
color: #64748b;
font-size: 0.74rem;
text-align: center;
}
.taxa-raio-origem {
min-height: 76px;
display: flex;
align-items: center;
gap: 0.75rem;
padding: 0.8rem;
border: 1px solid color-mix(in srgb, var(--cor-unidade, #2d3142) 24%, #dbe3ee);
border-radius: 9px;
background: color-mix(in srgb, var(--cor-unidade, #2d3142) 6%, #fff);
}
.taxa-raio-origem-icone {
width: 42px;
height: 42px;
flex: 0 0 42px;
display: inline-flex;
align-items: center;
justify-content: center;
border-radius: 50%;
background: var(--cor-unidade, #2d3142);
color: #fff;
font-size: 1rem;
}
.taxa-raio-origem > div {
min-width: 0;
display: grid;
gap: 0.2rem;
}
.taxa-raio-origem strong {
color: #172033;
font-size: 0.84rem;
}
.taxa-raio-origem span:not(.taxa-raio-origem-icone) {
color: #64748b;
font-size: .75rem;
line-height: 1.35;
}
.taxa-mapa-card {
min-width: 0;
}
.taxa-localidade-grid,
.taxa-valores-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 0.7rem;
}
.taxa-valores-grid.is-por-bairro {
grid-template-columns: repeat(3, minmax(0, 1fr));
}
.taxa-zerar-campo {
align-content: end;
min-height: 31px;
padding-bottom: 4px;
}
.taxa-mapa-wrap {
min-width: 0;
}
.taxa-mapa-actions {
display: flex;
flex-wrap: wrap;
gap: 0.5rem;
margin-bottom: 0.65rem;
}
.taxa-mapa-canvas {
width: 100%;
height: 460px;
min-height: 460px;
overflow: hidden;
border: 1px solid #dbe3f1;
border-radius: 8px;
background: #eef3fb;
}
.taxa-entrega-mapa-bairro-label {
background: rgba(255, 255, 255, 0.96);
border: 2px solid #dc2626;
border-radius: 999px;
box-shadow: 0 8px 18px rgba(15, 23, 42, 0.16);
color: #b91c1c;
font-size: 13px;
font-weight: 700;
letter-spacing: 0.04em;
padding: 6px 10px;
text-transform: uppercase;
}
.taxa-entrega-mapa-bairro-label.leaflet-tooltip-top:before {
border-top-color: #dc2626;
}
.taxa-entrega-mapa-bairro-label.leaflet-tooltip-bottom:before {
border-bottom-color: #dc2626;
}
.taxa-entrega-mapa-bairro-label.leaflet-tooltip-left:before {
border-left-color: #dc2626;
}
.taxa-entrega-mapa-bairro-label.leaflet-tooltip-right:before {
border-right-color: #dc2626;
}
.taxa-entrega-mapa-origem-label,
.taxa-entrega-mapa-raio-label,
.taxa-entrega-mapa-ajuste-label {
border-radius: 999px;
box-shadow: 0 8px 18px rgba(15, 23, 42, 0.16);
font-size: 12px;
font-weight: 800;
letter-spacing: 0.035em;
padding: 5px 9px;
}
.taxa-entrega-mapa-origem-label {
background: var(--cor-unidade, #2d3142);
border: 2px solid #fff;
color: #fff;
}
.taxa-entrega-mapa-raio-label {
background: rgba(255, 255, 255, 0.96);
border: 2px solid var(--cor-unidade, #2d3142);
color: var(--cor-unidade, #2d3142);
}
.taxa-entrega-mapa-ajuste-label {
background: #fff7ed;
border: 2px solid #f97316;
color: #9a3412;
}
.taxa-mapa-raio-handle-wrap {
background: transparent;
border: 0;
}
.taxa-mapa-raio-handle {
width: 34px;
height: 34px;
display: inline-flex;
align-items: center;
justify-content: center;
border: 3px solid #fff;
border-radius: 50%;
background: #f97316;
box-shadow: 0 5px 14px rgba(15, 23, 42, 0.3);
color: #fff;
cursor: grab;
font-size: 0.9rem;
}
.taxa-mapa-raio-handle:active {
cursor: grabbing;
transform: scale(1.08);
}
.taxa-mapa-legenda {
display: flex;
flex-wrap: wrap;
gap: 0.4rem 0.9rem;
margin-top: 0.6rem;
padding: 0.6rem 0.7rem;
border: 1px solid #dbe3ee;
border-radius: 8px;
background: #f8fafc;
}
.taxa-mapa-legenda[hidden] {
display: none;
}
.taxa-mapa-legenda span {
display: inline-flex;
align-items: center;
gap: 0.28rem;
color: #64748b;
font-size: .75rem;
}
.taxa-mapa-legenda i {
color: var(--cor-unidade, #2d3142);
}
.taxa-mapa-legenda strong {
color: #334155;
}
.taxa-mapa-legenda b {
color: #0f172a;
font-weight: 800;
}
.taxa-mapa-status {
margin-top: 0.55rem;
color: #64748b;
font-size: 0.76rem;
}
.taxa-mapa-google {
display: inline-block;
margin-top: 0.35rem;
color: #2563eb;
font-size: 0.76rem;
font-weight: 700;
}
.taxa-mapa-google[hidden] {
display: none;
}
@media (max-width: 991.98px) {
.taxa-editor-layout {
grid-template-columns: 1fr;
}
.taxa-mapa-canvas {
height: 360px;
min-height: 360px;
}
}
/* Cadastro unificado: modo pizza novo (tabelas produtos_pizza_*). */
.produto-pizza-config {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 0.8rem 1.25rem;
margin-bottom: 0.9rem;
padding: 0.75rem 0.9rem;
border: 1px solid #dfe5ee;
border-radius: 9px;
background: #fff;
}
.produto-pizza-regra {
display: flex;
align-items: center;
gap: 0.55rem;
margin-left: auto;
font-size: 0.82rem;
font-weight: 700;
color: #334155;
}
.produto-pizza-regra select {
min-width: 180px;
}
.produto-pizza-card {
margin-bottom: 0.85rem;
padding: 0.75rem;
border: 1px solid #d9e0ea;
border-radius: 9px;
background: #fff;
}
.produto-pizza-card-head,
.produto-pizza-section-title,
.produto-pizza-categoria-head {
display: flex;
align-items: center;
justify-content: space-between;
gap: 0.75rem;
}
.produto-pizza-collapsible > summary {
cursor: pointer;
list-style: none;
}
.produto-pizza-collapsible > summary::-webkit-details-marker {
display: none;
}
.produto-pizza-collapsible > summary strong {
display: block;
color: #172033;
font-size: 0.9rem;
font-weight: 800;
}
.produto-pizza-collapsible > summary small {
display: block;
margin-top: 0.15rem;
color: #64748b;
font-size: 0.75rem;
font-weight: 400;
}
.produto-pizza-chevron {
flex: 0 0 auto;
transition: transform 0.18s ease;
}
.produto-pizza-collapsible:not([open]) .produto-pizza-chevron {
transform: rotate(-90deg);
}
.produto-pizza-collapse-body {
padding-top: 0.65rem;
}
.produto-pizza-card-head,
.produto-pizza-section-title {
margin-bottom: 0.65rem;
}
.produto-pizza-card h6,
.produto-pizza-section-title h6 {
margin: 0;
color: #172033;
font-size: 0.9rem;
font-weight: 800;
}
.produto-pizza-card p,
.produto-pizza-section-title p {
margin: 0.15rem 0 0;
color: #64748b;
font-size: 0.75rem;
}
.produto-pizza-categorias {
display: grid;
gap: 0.8rem;
}
.produto-pizza-categoria-head {
justify-content: flex-start;
gap: 0.4rem;
margin: -0.75rem -0.75rem 0;
padding: 0.6rem 0.75rem;
border-bottom: 1px solid #e2e8f0;
border-radius: 9px 9px 0 0;
background: #f7f8fc;
}
.produto-pizza-categoria-head > .form-control {
flex: 1 1 0;
width: 100%;
min-width: 0;
max-width: none;
font-weight: 800;
}
.produto-pizza-categoria-controls {
display: flex;
flex: 0 0 auto;
align-items: center;
justify-content: flex-end;
gap: 0.8rem;
margin-left: auto;
}
.produto-pizza-table-wrap {
border: 1px solid #e2e8f0;
border-radius: 7px;
}
.produto-pizza-table {
min-width: 760px;
margin: 0;
font-size: 0.78rem;
}
.produto-pizza-table > :not(caption) > * > * {
padding: 0.38rem;
border-color: #e8edf4;
vertical-align: middle;
}
.produto-pizza-table thead th {
white-space: nowrap;
background: #f8fafc;
color: #64748b;
font-size: .75rem;
font-weight: 800;
}
.produto-pizza-table td .form-control {
min-width: 105px;
}
.produto-pizza-sabores-table td:nth-child(3) .form-control {
min-width: 180px;
}
.produto-pizza-sabores-table td:nth-child(4) .form-control {
min-width: 230px;
}
.produto-pizza-drag-col {
width: 24px;
color: #94a3b8;
text-align: center;
}
.produto-pizza-drag-handle {
display: inline-grid;
width: 24px;
height: 30px;
place-items: center;
padding: 0;
border: 0;
background: transparent;
color: #94a3b8;
cursor: grab;
touch-action: none;
}
.produto-pizza-drag-handle:active {
cursor: grabbing;
}
[data-pizza-drop-type].is-pizza-dragging {
opacity: 0.45;
}
tr[data-pizza-drop-type].is-pizza-drag-over > td {
border-top: 2px solid var(--ss-primary, #4f46e5);
}
.produto-pizza-categoria.is-pizza-drag-over {
outline: 2px solid var(--ss-primary, #4f46e5);
outline-offset: 2px;
}
.produto-pizza-money {
width: 108px;
text-align: right;
}
.produto-pizza-max {
width: 92px;
}
.produto-pizza-row-actions {
display: flex;
justify-content: flex-end;
gap: 0.2rem;
white-space: nowrap;
}
.produto-pizza-icon {
width: 28px;
height: 28px;
padding: 0;
border: 1px solid #dbe2eb;
border-radius: 50%;
background: #fff;
color: #4f46e5;
}
.produto-pizza-icon:hover:not(:disabled) {
border-color: #4f46e5;
background: #eef2ff;
}
.produto-pizza-icon:disabled {
opacity: 0.35;
}
.produto-pizza-icon--danger {
color: #dc2626;
}
.produto-pizza-foto {
display: grid;
width: 38px;
height: 38px;
place-items: center;
padding: 0;
overflow: hidden;
border: 1px solid #dbe2eb;
border-radius: 6px;
background: #f8fafc;
color: #64748b;
}
.produto-pizza-foto img {
width: 100%;
height: 100%;
object-fit: cover;
}
.produto-pizza-add-row {
display: flex;
align-items: center;
gap: 0.45rem;
margin-top: 0.65rem;
}
.produto-pizza-add-row .form-control {
max-width: 220px;
}
.produto-pizza-add-sabor {
margin-top: 0.6rem;
}
.produto-pizza-empty {
padding: 1rem !important;
color: #64748b;
text-align: center;
}
.produto-pizza-empty--cards {
margin-bottom: 0.85rem;
border: 1px dashed #cbd5e1;
border-radius: 9px;
background: #f8fafc;
}
.produto-pizza-empty--compact {
padding: 0.75rem !important;
border: 1px dashed #cbd5e1;
border-radius: 8px;
background: #f8fafc;
}
.produto-pizza-sabores-lista {
display: grid;
gap: 0.75rem;
}
.produto-pizza-sabor-card {
min-width: 0;
overflow: visible;
border: 1px solid #dce3ed;
border-radius: 10px;
background: #fff;
box-shadow: 0 4px 14px rgba(15, 23, 42, 0.04);
}
.produto-pizza-sabor-head {
display: grid;
grid-template-columns: 28px 44px minmax(180px, 1fr) auto;
gap: 0.55rem;
align-items: center;
padding: 0.7rem;
border-bottom: 1px solid #e7ebf1;
border-radius: 10px 10px 0 0;
background: #f8fafc;
}
.produto-pizza-sabor-head .produto-pizza-foto {
width: 44px;
height: 44px;
border-radius: 9px;
}
.produto-pizza-sabor-title {
display: flex;
min-width: 0;
flex-direction: column;
gap: 0.2rem;
}
.produto-pizza-sabor-title > span,
.produto-pizza-sabor-descricao > span,
.produto-pizza-precos-grid label > span,
.produto-pizza-ficha-search > span,
.produto-pizza-ficha-add label > span,
.produto-pizza-ficha-qtd-inline label > span,
.produto-pizza-ficha-qtds label > span {
color: #64748b;
font-size: .75rem;
font-weight: 800;
letter-spacing: 0.025em;
text-transform: uppercase;
}
.produto-pizza-sabor-title .form-control {
font-weight: 800;
}
.produto-pizza-sabor-actions {
display: flex;
align-items: center;
gap: 0.75rem;
}
.produto-pizza-sabor-descricao,
.produto-pizza-sabor-precos {
display: flex;
min-width: 0;
flex-direction: column;
gap: 0.35rem;
margin: 0;
padding: 0.7rem 0.8rem 0;
}
.produto-pizza-sabor-precos > b {
color: #334155;
font-size: 0.75rem;
}
.produto-pizza-precos-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(132px, 1fr));
gap: 0.5rem;
}
.produto-pizza-precos-grid label {
display: flex;
min-width: 0;
flex-direction: column;
gap: 0.25rem;
}
.produto-pizza-precos-grid .produto-pizza-money {
width: 100%;
min-width: 0;
}
.produto-pizza-ficha-inline {
margin: 0.8rem;
border: 1px solid #d7deea;
border-radius: 9px;
background: #fbfdff;
}
.produto-pizza-ficha-inline > summary {
display: grid;
grid-template-columns: minmax(0, 1fr) auto 18px;
gap: 0.65rem;
align-items: center;
min-height: 54px;
padding: 0.65rem 0.75rem;
cursor: pointer;
list-style: none;
}
.produto-pizza-ficha-inline > summary::-webkit-details-marker {
display: none;
}
.produto-pizza-ficha-inline > summary > span:first-child {
display: flex;
min-width: 0;
align-items: center;
gap: 0.6rem;
}
.produto-pizza-ficha-inline > summary > span:first-child > i {
display: grid;
flex: 0 0 34px;
width: 34px;
height: 34px;
place-items: center;
border-radius: 9px;
background: #eef2ff;
color: #4f46e5;
font-size: 1rem;
}
.produto-pizza-ficha-inline > summary strong,
.produto-pizza-ficha-inline > summary small {
display: block;
}
.produto-pizza-ficha-inline > summary strong {
color: #172033;
font-size: 0.82rem;
}
.produto-pizza-ficha-inline > summary small {
margin-top: 0.12rem;
color: #64748b;
font-size: .75rem;
font-weight: 400;
}
.produto-pizza-ficha-inline:not([open]) .produto-pizza-chevron {
transform: rotate(-90deg);
}
.produto-pizza-ficha-count {
padding: 0.28rem 0.55rem;
border-radius: 999px;
background: #eef2ff;
color: #4338ca;
font-size: .75rem;
font-weight: 800;
white-space: nowrap;
}
.produto-pizza-ficha-body {
padding: 0.75rem;
border-top: 1px solid #e2e8f0;
}
.produto-pizza-ficha-add,
.produto-pizza-ficha-item {
display: grid;
grid-template-columns: minmax(220px, 1fr) minmax(240px, 34%) 104px;
gap: 0.55rem;
align-items: end;
}
.produto-pizza-ficha-add {
margin-bottom: 0.7rem;
}
.produto-pizza-ficha-add label,
.produto-pizza-ficha-add .produto-pizza-ficha-search {
display: flex;
min-width: 0;
flex-direction: column;
gap: 0.25rem;
margin: 0;
}
.produto-pizza-ficha-add .produto-pizza-ficha-search {
width: 100%;
}
.produto-pizza-ficha-qtd-inline,
.produto-pizza-ficha-qtds {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(72px, 1fr));
gap: 0.45rem;
width: 100%;
min-width: 0;
padding-bottom: 1px;
}
.produto-pizza-ficha-qtd-inline label,
.produto-pizza-ficha-qtds label {
display: flex;
min-width: 0;
flex-direction: column;
gap: 0.22rem;
margin: 0;
}
.produto-pizza-ficha-add > .btn {
width: 100%;
white-space: nowrap;
}
.produto-pizza-ficha-search {
position: relative;
}
.produto-pizza-ficha-search-results {
position: absolute;
z-index: 1090;
top: calc(100% + 3px);
right: 0;
left: 0;
max-height: 220px;
overflow: auto;
border-radius: 8px;
background: #fff;
box-shadow: 0 14px 32px rgba(15, 23, 42, 0.18);
}
.produto-pizza-ficha-search-results:empty {
display: none;
}
.produto-pizza-ficha-search-results button {
display: flex;
width: 100%;
flex-direction: column;
gap: 0.05rem;
padding: 0.55rem 0.65rem;
border: 0;
border-bottom: 1px solid #eef2f7;
background: #fff;
color: #172033;
text-align: left;
}
.produto-pizza-ficha-search-results button:hover,
.produto-pizza-ficha-search-results button:focus {
background: #f1f5f9;
}
.produto-pizza-ficha-search-results button strong { font-size: 0.78rem; }
.produto-pizza-ficha-search-results button small { color: #64748b; font-size: 0.68rem; }
.produto-pizza-ficha-search-empty {
padding: 0.7rem;
color: #64748b;
font-size: 0.75rem;
font-weight: 700;
}
.produto-pizza-ficha-alert {
margin: 0 0 0.7rem;
padding: 0.55rem 0.7rem;
font-size: 0.75rem;
}
.produto-pizza-ficha-lista {
display: grid;
gap: 0.55rem;
}
.produto-pizza-ficha-item {
padding: 0.65rem;
border: 1px solid #e1e7ef;
border-radius: 8px;
background: #fff;
}
.produto-pizza-ficha-item-head {
display: flex;
min-width: 0;
align-items: center;
gap: 0.75rem;
align-self: center;
}
.produto-pizza-ficha-item-head > div {
display: flex;
min-width: 0;
flex-direction: column;
}
.produto-pizza-ficha-item-head strong { color: #172033; font-size: 0.8rem; }
.produto-pizza-ficha-item-head small { color: #64748b; font-size: .75rem; }
.produto-pizza-ficha-qtds {
margin-top: 0;
}
.produto-pizza-ficha-item > .produto-pizza-icon {
justify-self: end;
margin-bottom: 1px;
}
.produto-pizza-ficha-totais {
display: flex;
align-items: center;
justify-content: space-between;
gap: 0.75rem;
margin-top: 0.7rem;
padding-top: 0.7rem;
border-top: 1px solid #e2e8f0;
color: #334155;
font-size: 0.75rem;
}
.produto-pizza-ficha-totais > div {
display: flex;
flex-wrap: wrap;
justify-content: flex-end;
gap: 0.4rem;
}
.produto-pizza-ficha-totais span {
display: flex;
flex-direction: column;
padding: 0.35rem 0.55rem;
border-radius: 7px;
background: #eef2ff;
color: #4338ca;
}
.produto-pizza-ficha-totais span small { font-size: .75rem; }
.produto-pizza-ficha-totais span strong { font-size: .75rem; }
@media (max-width: 767.98px) {
.produto-pizza-ficha-item {
grid-template-columns: minmax(0, 1fr) 36px;
}
.produto-pizza-ficha-item-head {
grid-column: 1;
}
.produto-pizza-ficha-qtds {
grid-column: 1 / -1;
grid-row: 2;
}
.produto-pizza-ficha-add {
grid-template-columns: minmax(0, 1fr);
}
.produto-pizza-ficha-add .produto-pizza-ficha-search,
.produto-pizza-ficha-qtd-inline {
width: 100%;
}
.produto-pizza-ficha-add > .btn {
width: 100%;
}
.produto-pizza-config {
display: grid;
grid-template-columns: 1fr;
gap: 0.7rem;
}
.produto-pizza-regra {
width: 100%;
margin-left: 0;
align-items: stretch;
flex-direction: column;
}
.produto-pizza-regra select { width: 100%; }
.produto-pizza-section-title {
align-items: stretch;
flex-direction: column;
}
.produto-pizza-section-title .btn { width: 100%; }
.produto-pizza-categoria-head {
align-items: flex-start;
flex-wrap: wrap;
}
.produto-pizza-categoria-head > .form-control {
flex: 1 1 70%;
}
.produto-pizza-categoria-controls {
margin-left: auto;
}
.produto-pizza-sabor-head {
grid-template-columns: 24px 44px minmax(0, 1fr);
}
.produto-pizza-sabor-actions {
grid-column: 2 / -1;
justify-content: space-between;
}
.produto-pizza-ficha-add {
grid-template-columns: minmax(0, 1fr);
}
.produto-pizza-ficha-add .btn { grid-column: 1 / -1; width: 100%; }
.produto-pizza-ficha-totais {
align-items: flex-start;
flex-direction: column;
}
.produto-pizza-ficha-totais > div { justify-content: flex-start; }
.produto-pizza-table-wrap {
overflow: visible;
border: 0;
}
.produto-pizza-table,
.produto-pizza-table tbody {
display: block;
width: 100%;
min-width: 0;
}
.produto-pizza-table thead { display: none; }
.produto-pizza-table tbody tr {
position: relative;
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 0.55rem;
margin-bottom: 0.6rem;
padding: 0.65rem;
border: 1px solid #e2e8f0;
border-radius: 9px;
background: #fff;
}
.produto-pizza-table tbody td {
display: flex;
min-width: 0;
flex-direction: column;
gap: 0.22rem;
padding: 0 !important;
border: 0;
}
.produto-pizza-table tbody td::before {
content: attr(data-label);
color: #64748b;
font-size: .75rem;
font-weight: 800;
letter-spacing: 0.025em;
text-transform: uppercase;
}
.produto-pizza-table tbody td:nth-child(2) {
grid-column: 1 / -1;
padding-right: 72px !important;
}
.produto-pizza-table tbody .produto-pizza-drag-col {
position: absolute;
z-index: 1;
top: 6px;
right: 42px;
width: 28px;
}
.produto-pizza-table tbody td:last-child {
position: absolute;
z-index: 1;
top: 8px;
right: 8px;
width: 30px;
}
.produto-pizza-table tbody .produto-pizza-money,
.produto-pizza-table tbody .produto-pizza-max,
.produto-pizza-table tbody td .form-control {
width: 100%;
min-width: 0;
}
.produto-pizza-table .produto-pizza-empty {
position: static;
display: block;
grid-column: 1 / -1 !important;
width: 100%;
}
}
@media (max-width: 479.98px) {
.produto-pizza-card { padding: 0.6rem; }
.produto-pizza-categoria-head { margin: -0.6rem -0.6rem 0; padding: 0.55rem 0.6rem; }
.produto-pizza-categoria-head > .form-control { flex-basis: calc(100% - 36px); }
.produto-pizza-categoria-controls { width: 100%; justify-content: space-between; }
.produto-pizza-sabor-head { grid-template-columns: 24px 40px minmax(0, 1fr); padding: 0.6rem; }
.produto-pizza-sabor-head .produto-pizza-foto { width: 40px; height: 40px; }
.produto-pizza-sabor-descricao,
.produto-pizza-sabor-precos { padding: 0.65rem 0.65rem 0; }
.produto-pizza-precos-grid,
.produto-pizza-ficha-qtds,
.produto-pizza-ficha-add { grid-template-columns: 1fr; }
.produto-pizza-ficha-inline { margin: 0.65rem; }
.produto-pizza-ficha-inline > summary { grid-template-columns: minmax(0, 1fr) 16px; }
.produto-pizza-ficha-count { display: none; }
.produto-pizza-ficha-add .btn { grid-column: auto; }
.produto-pizza-add-row { align-items: stretch; flex-direction: column; }
.produto-pizza-add-row .form-control,
.produto-pizza-add-row .btn { width: 100%; max-width: none; }
.produto-pizza-table tbody tr { grid-template-columns: 1fr; }
.produto-pizza-table tbody td:nth-child(2) { grid-column: 1; }
}
/* QR Code e Configurações — mesmo shell visual dos módulos já aprovados. */
.qr-config-page,
.config-page {
width: 100%;
min-width: 0;
}
.qr-config-page > .ss-panel,
.config-page .config-card,
.config-page .integration-card,
.config-page .permissao-card {
border-color: #e2e8f0;
border-radius: 10px;
background: #fff;
box-shadow: none;
}
.qr-config-page .qr-single-panel {
width: 100%;
max-width: 900px;
margin: 0;
}
.qr-config-page .qr-preview-card {
display: grid;
grid-template-columns: 220px minmax(0, 1fr);
align-items: center;
gap: 1.25rem;
}
.qr-config-page .qr-preview-card > a {
display: block;
width: 220px;
max-width: 100%;
}
.qr-config-page .qr-preview-card img {
display: block !important;
width: 220px !important;
height: 220px !important;
max-width: 100% !important;
object-fit: contain !important;
padding: 0.5rem;
border: 1px solid #e2e8f0;
border-radius: 10px;
background: #fff;
}
.qr-config-page .qr-preview-card h2 {
margin: 0.55rem 0 0.25rem;
color: #0f172a;
font-size: 1rem;
font-weight: 800;
}
.qr-config-page .qr-preview-card p,
.qr-config-page .qr-public-link {
font-size: 0.82rem;
line-height: 1.45;
}
.qr-config-page .qr-praca-section {
width: 100%;
margin: 0 0 0.8rem;
padding: 0.8rem;
}
.qr-config-page .qr-praca-head {
align-items: center;
margin-bottom: 0.7rem;
padding-bottom: 0.55rem;
border-bottom: 1px solid #e2e8f0;
}
.qr-config-page .qr-praca-head h2 {
font-size: 0.92rem;
font-weight: 800;
}
.qr-config-page .qr-mesas-grid {
display: grid !important;
grid-template-columns: repeat(auto-fill, minmax(145px, 1fr)) !important;
gap: 0.65rem !important;
}
.qr-config-page .qr-mesa-card {
min-width: 0;
display: flex !important;
flex-direction: column !important;
align-items: center !important;
justify-content: flex-start;
gap: 0.5rem !important;
padding: 0.65rem !important;
border: 1px solid #e2e8f0 !important;
border-radius: 9px !important;
background: #f8fafc !important;
text-align: center;
overflow: hidden;
}
.qr-config-page .qr-mesa-card strong {
font-size: 0.78rem;
font-weight: 800;
}
.qr-config-page .qr-mesa-card img {
display: block !important;
width: 112px !important;
height: 112px !important;
min-width: 112px !important;
max-width: 112px !important;
min-height: 112px !important;
max-height: 112px !important;
flex: 0 0 112px !important;
object-fit: contain !important;
padding: 0 !important;
margin: 0 auto !important;
}
.qr-config-page .qr-mesa-card .btn {
min-height: 27px;
padding: 0.22rem 0.58rem;
border-radius: 999px;
font-size: 0.72rem;
}
.config-page .config-grid {
width: 100%;
max-width: 1180px;
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 0.8rem;
align-items: start;
}
.config-page .config-card {
min-width: 0;
margin: 0;
padding: 0.8rem;
}
.config-page .config-card:nth-child(2),
.config-page .config-card:nth-child(3) {
grid-row: span 2;
}
.config-page .config-card-head {
gap: 0.65rem;
margin-bottom: 0.75rem;
padding-bottom: 0.6rem;
border-bottom: 1px solid #e2e8f0;
}
.config-page .config-card-head > span,
.config-page .permissao-icon,
.config-page .integration-logo {
width: 32px;
height: 32px;
flex: 0 0 32px;
border-radius: 9px;
}
.config-page .config-card-head h2,
.config-page .integration-head h2 {
margin: 0;
color: #0f172a;
font-size: 0.88rem;
font-weight: 800;
}
.config-page .config-card-head p,
.config-page .integration-head small,
.config-page .integration-card > p {
font-size: 0.75rem;
line-height: 1.4;
}
.config-page .config-card label,
.config-page .integration-card label {
margin: 0;
color: #475569;
font-size: 0.76rem;
font-weight: 700;
}
.config-page .config-switch-grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 0.45rem 0.75rem;
margin-top: 0.75rem;
}
.config-page .config-switch-grid .form-check {
min-width: 0;
min-height: 28px;
padding: 0.38rem 0.48rem 0.38rem 2.35rem;
border: 1px solid #e2e8f0;
border-radius: 8px;
background: #f8fafc;
font-size: 0.72rem;
}
.config-page .config-dias span {
width: 42px;
height: 32px;
border-radius: 7px;
font-size: 0.78rem;
}
.config-page .permissoes-cards {
width: 100%;
display: grid;
grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
gap: 0.65rem;
}
.config-page .permissao-card {
min-width: 0;
margin: 0;
padding: 0.75rem;
}
.config-page .whatsapp-message-grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 0.55rem;
}
.config-page .whatsapp-message-grid label {
min-width: 0;
padding: 0.6rem;
border-radius: 9px;
background: #f8fafc;
}
.config-page .integracoes-nav {
width: 100%;
margin: 0 0 0.7rem;
padding: 0.3rem;
border: 1px solid #e2e8f0;
border-radius: 9px;
background: #f8fafc;
}
.config-page .integracoes-nav .nav-link {
min-height: 30px;
padding: 0.3rem 0.65rem;
border: 0;
border-radius: 7px;
font-size: 0.75rem;
font-weight: 700;
}
.config-page .integration-card-grid {
gap: 0.75rem;
}
.config-page .integration-card {
min-width: 0;
margin: 0;
padding: 0.8rem;
}
.config-page .integration-head {
gap: 0.6rem;
margin-bottom: 0.7rem;
padding-bottom: 0.55rem;
border-bottom: 1px solid #e2e8f0;
}
.config-page .integration-payment-row,
.config-page .integration-payment-row.is-mp-row {
gap: 0.55rem;
padding: 0.55rem;
border-radius: 8px;
background: #f8fafc;
}
@media (max-width: 991.98px) {
.config-page .config-grid,
.config-page .integration-card-grid {
grid-template-columns: 1fr;
}
.config-page .config-card:nth-child(2),
.config-page .config-card:nth-child(3) {
grid-row: auto;
}
}
@media (max-width: 575.98px) {
.qr-config-page,
.config-page {
padding: 0.8rem;
}
.qr-config-page .qr-preview-card {
grid-template-columns: 1fr;
text-align: center;
}
.qr-config-page .qr-preview-card > a,
.qr-config-page .qr-preview-card img {
width: 190px !important;
height: 190px !important;
margin: 0 auto;
}
.qr-config-page .qr-mesas-grid {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
gap: 0.5rem !important;
}
.qr-config-page .qr-mesa-card img {
width: 96px !important;
height: 96px !important;
min-width: 96px !important;
max-width: 96px !important;
min-height: 96px !important;
max-height: 96px !important;
flex-basis: 96px !important;
}
.config-page .config-switch-grid,
.config-page .whatsapp-message-grid {
grid-template-columns: 1fr;
}
.config-page .integration-payment-row,
.config-page .integration-payment-row.is-mp-row {
grid-template-columns: 1fr;
}
}
/* Layout compacto de pizzas alinhado ao cadastro clássico do Gestor. */
.produto-pizza-config {
gap: 0.65rem 0.85rem;
margin-bottom: 0.8rem;
padding: 0;
border: 0;
border-radius: 0;
background: transparent;
font-size: 0.78rem;
}
.produto-pizza-check {
display: inline-flex;
align-items: center;
gap: 0.35rem;
min-height: 31px;
margin: 0;
padding-left: 0;
white-space: nowrap;
}
.produto-pizza-check .form-check-input,
.produto-pizza-check .form-check-label {
position: static;
float: none;
margin: 0;
}
.produto-pizza-regra {
gap: 0.4rem;
margin-left: 0;
color: #202938;
font-size: 0.78rem;
font-weight: 500;
white-space: nowrap;
}
.produto-pizza-regra select {
width: auto;
min-width: 180px;
}
.produto-pizza-card {
overflow: hidden;
margin-bottom: 0.55rem;
padding: 0;
border-color: #cfd5de;
border-radius: 6px;
box-shadow: none;
}
.produto-pizza-card-head,
.produto-pizza-categoria-head {
min-height: 38px;
margin: 0;
padding: 0.48rem 0.65rem;
border-bottom: 1px solid #dce1e8;
border-radius: 0;
background: #f6f7fa;
}
.produto-pizza-card-head > span,
.produto-pizza-categoria-head {
justify-content: flex-start;
}
.produto-pizza-card-head > span {
display: inline-flex;
align-items: center;
gap: 0.38rem;
}
.produto-pizza-card-head .produto-pizza-chevron,
.produto-pizza-categoria-head .produto-pizza-chevron {
font-size: .75rem;
}
.produto-pizza-collapsible > summary strong {
color: #101827;
font-size: 0.78rem;
}
.produto-pizza-collapse-body {
padding: 0.5rem 0.55rem 0.55rem;
}
.produto-pizza-table-wrap {
overflow-x: auto;
border: 0;
border-radius: 0;
}
.produto-pizza-table {
margin: 0 0 0.45rem;
color: #172033;
font-size: .75rem;
}
.produto-pizza-table > :not(caption) > * > * {
padding: 0.2rem 0.28rem;
border-color: #dfe4ec;
}
.produto-pizza-table thead th {
padding-top: 0.24rem;
padding-bottom: 0.24rem;
background: #fff;
color: #64748b;
font-size: .75rem;
font-weight: 500;
}
.produto-pizza-tamanhos-table {
width: 100%;
min-width: 560px;
}
.produto-pizza-tamanhos-table th:nth-child(1),
.produto-pizza-tamanhos-table td:nth-child(1) { width: 30px; }
.produto-pizza-tamanhos-table th:nth-child(3),
.produto-pizza-tamanhos-table td:nth-child(3) { width: 110px; }
.produto-pizza-tamanhos-table th:nth-child(4),
.produto-pizza-tamanhos-table td:nth-child(4) { width: 110px; }
.produto-pizza-tamanhos-table th:nth-child(5),
.produto-pizza-tamanhos-table td:nth-child(5) { width: 36px; }
.produto-pizza-check-col {
width: 30px;
text-align: center;
}
.produto-pizza-check-col .form-check-input {
float: none;
margin: 0;
}
.produto-pizza-tamanhos-table td:nth-child(2) .form-control {
max-width: 120px;
}
.produto-pizza-money,
.produto-pizza-max {
width: 100%;
min-width: 0;
text-align: center;
}
.produto-pizza-categorias {
gap: 0.55rem;
}
.produto-pizza-categoria-head > .form-control {
flex: 1 1 auto;
min-width: 90px;
max-width: 360px;
height: 28px;
padding: 0.15rem 0.25rem;
border: 0;
background: transparent;
color: #111827;
font-size: 0.76rem;
font-weight: 800;
text-transform: uppercase;
box-shadow: none;
}
.produto-pizza-categoria-controls {
gap: 0.25rem;
margin-left: auto;
}
.produto-pizza-sabores-table {
width: 100%;
min-width: 760px;
table-layout: auto;
border-collapse: collapse;
}
.produto-pizza-sabores-table .produto-pizza-drag-col { width: 24px; }
.produto-pizza-sabores-table .produto-pizza-foto-col { width: 46px; text-align: center; }
.produto-pizza-sabores-table .produto-pizza-sabor-nome-col { min-width: 150px; }
.produto-pizza-sabores-table .produto-pizza-sabor-descricao-col { min-width: 190px; }
.produto-pizza-sabores-table .produto-pizza-sabor-preco-col,
.produto-pizza-sabores-table td[data-label$="(R$)"] { width: 124px; min-width: 118px; }
.produto-pizza-sabores-table .produto-pizza-sabor-acoes-col { width: 96px; min-width: 96px; }
.produto-pizza-sabores-table .produto-pizza-foto {
width: 38px;
height: 38px;
margin: 0 auto;
border-radius: 4px;
background: #f1f1f1;
}
.produto-pizza-sabores-table .produto-pizza-row-actions {
justify-content: center;
}
.produto-pizza-sabor-row.is-inactive {
background: #f1f3f5;
}
.produto-pizza-icon {
width: 27px;
height: 27px;
border-color: #d7e0ec;
font-size: 0.72rem;
}
.produto-pizza-icon--ficha {
border-color: #b9d5ff;
background: #f2f7ff;
color: #1677ff;
}
.produto-pizza-icon--warning {
border-color: #f3d28b;
background: #fffaf0;
color: #d58a00;
}
.produto-pizza-icon--danger {
border-color: #ffc5c5;
background: #fff6f6;
color: #e11d2e;
}
.produto-pizza-ficha-row > td {
padding: 0.35rem !important;
background: #f8fafc;
}
.produto-pizza-ficha-row .produto-pizza-ficha-inline {
margin: 0;
}
.produto-pizza-add-row {
margin-top: 0.35rem;
}
.produto-pizza-add-row .form-control {
max-width: 120px;
}
.produto-pizza-add-row--sabor {
flex-wrap: wrap;
}
.produto-pizza-add-row--sabor .produto-pizza-novo-sabor-nome { max-width: 170px; }
.produto-pizza-add-row--sabor .produto-pizza-novo-sabor-descricao { max-width: 250px; }
.produto-pizza-add-row--categoria { margin: 0.35rem 0 0.75rem; }
.produto-pizza-add-row--categoria .form-control { max-width: 200px; }
@media (max-width: 767.98px) {
.produto-pizza-config {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 0.35rem 0.75rem;
}
.produto-pizza-regra {
grid-column: 1 / -1;
width: 100%;
align-items: center;
flex-direction: row;
}
.produto-pizza-regra select {
flex: 1 1 auto;
width: 100%;
min-width: 0;
}
.produto-pizza-card-head,
.produto-pizza-categoria-head {
margin: 0;
}
.produto-pizza-categoria-head {
align-items: center;
flex-wrap: nowrap;
}
.produto-pizza-categoria-head > .form-control {
flex-basis: auto;
}
.produto-pizza-tamanhos-table tbody .produto-pizza-check-col {
position: absolute;
z-index: 1;
top: 13px;
right: 49px;
display: block;
width: 22px;
}
.produto-pizza-tamanhos-table tbody .produto-pizza-check-col::before {
display: none;
}
.produto-pizza-tamanhos-table tbody td:nth-child(2) {
padding-right: 78px !important;
}
.produto-pizza-sabores-table {
min-width: 0;
}
.produto-pizza-sabores-table tbody .produto-pizza-sabor-row {
grid-template-columns: repeat(2, minmax(0, 1fr));
min-height: 58px;
padding-top: 0.65rem;
}
.produto-pizza-sabores-table tbody .produto-pizza-sabor-row > td:nth-child(2) {
grid-column: auto;
padding: 0 !important;
}
.produto-pizza-sabores-table tbody .produto-pizza-drag-col {
top: 8px;
right: 8px;
}
.produto-pizza-sabores-table tbody .produto-pizza-foto-col {
position: absolute;
top: 9px;
left: 9px;
width: 40px;
}
.produto-pizza-sabores-table tbody .produto-pizza-foto-col::before {
display: none;
}
.produto-pizza-sabores-table tbody .produto-pizza-sabor-nome-col {
grid-column: 1 / -1;
min-height: 40px;
padding-right: 35px !important;
padding-left: 48px !important;
}
.produto-pizza-sabores-table tbody .produto-pizza-sabor-descricao-col,
.produto-pizza-sabores-table tbody .produto-pizza-sabor-acoes-col {
grid-column: 1 / -1;
}
.produto-pizza-sabores-table tbody .produto-pizza-sabor-acoes-col {
position: static;
width: auto;
}
.produto-pizza-sabores-table tbody .produto-pizza-sabor-acoes-col .produto-pizza-row-actions {
justify-content: flex-end;
}
.produto-pizza-sabores-table tbody .produto-pizza-ficha-row {
display: block;
padding: 0 !important;
}
.produto-pizza-sabores-table tbody .produto-pizza-ficha-row > td {
position: static;
display: block;
width: 100%;
}
.produto-pizza-sabores-table tbody .produto-pizza-ficha-row > td::before {
display: none;
}
}
@media (max-width: 479.98px) {
.produto-pizza-ficha-qtd-inline,
.produto-pizza-ficha-qtds { grid-template-columns: repeat(auto-fit, minmax(72px, 1fr)); }
.produto-pizza-config { grid-template-columns: 1fr; }
.produto-pizza-regra { grid-column: auto; align-items: stretch; flex-direction: column; }
.produto-pizza-categoria-head { margin: 0; padding: 0.45rem 0.5rem; }
.produto-pizza-categoria-head > .form-control { flex-basis: auto; }
.produto-pizza-categoria-controls { width: auto; }
.produto-pizza-add-row--sabor,
.produto-pizza-add-row--categoria { align-items: stretch; flex-direction: column; }
.produto-pizza-add-row--sabor .form-control,
.produto-pizza-add-row--categoria .form-control,
.produto-pizza-add-row--sabor .btn,
.produto-pizza-add-row--categoria .btn { width: 100%; max-width: none; }
}
@media (max-width: 575.98px) {
.produtos-panel-toolbar.taxas-entrega-toolbar {
align-items: stretch;
flex-direction: column;
}
.taxas-entrega-toolbar .produtos-busca {
min-width: 0;
max-width: none;
width: 100%;
}
.taxas-raio-filtro {
width: 100%;
}
.taxas-raio-filtro .form-control {
width: auto;
min-width: 68px;
flex: 1 1 auto;
}
.taxas-massa-global-raio {
align-items: stretch;
flex-direction: column;
}
.taxas-massa-global-raio-campos,
.taxas-massa-global-opcoes,
.taxas-massa-global-regra {
grid-template-columns: 1fr;
}
.taxas-massa-global-bloco:first-child {
grid-column: auto;
}
.taxas-massa-global-bloco > header {
align-items: flex-start;
flex-direction: column;
}
.taxas-massa-global-bloco-body {
grid-template-columns: 1fr;
}
.taxas-tipo-frete {
justify-content: flex-start;
gap: 0.5rem 0.75rem;
flex-wrap: wrap;
}
.taxas-tipo-frete legend {
flex-basis: 100%;
}
.taxa-localidade-grid {
grid-template-columns: 1fr;
}
.taxa-valores-grid,
.taxa-valores-grid.is-por-bairro {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.taxas-massa-campos {
grid-template-columns: 1fr;
}
.taxas-entrega-cards {
grid-template-columns: 1fr;
grid-auto-rows: max-content;
align-items: start;
gap: 0.6rem;
padding: 0.6rem;
}
.taxa-entrega-card {
align-self: start;
height: auto;
min-height: max-content;
}
.taxa-card-metricas {
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 0.3rem;
padding: 0.55rem 0.6rem;
}
.taxa-card-metrica {
padding: 0.4rem 0.32rem;
}
.taxa-card-metrica > span {
font-size: .75rem;
}
.taxa-card-metrica > strong {
font-size: .75rem;
}
.taxa-card-foot {
flex-wrap: nowrap;
padding: 0.48rem 0.6rem 0.55rem;
}
.taxa-card-foot .unidade-card-acoes {
margin-left: auto;
}
.perfis-cards {
grid-template-columns: 1fr;
gap: 0.6rem;
padding: 0.6rem;
}
.perfil-card-body {
grid-template-columns: repeat(2, minmax(0, 1fr));
padding: 0.55rem 0.6rem;
}
.perfil-card-info {
padding: 0.42rem;
}
.perfil-card-foot {
flex-wrap: nowrap;
gap: 0.5rem;
padding: 0.5rem 0.6rem 0.55rem;
}
.perfil-card-toggles {
gap: 0.55rem;
}
.perfil-card-foot .unidade-card-acoes {
margin-left: auto;
}
.perfil-identificacao-grid,
.perfil-operacao-grid {
grid-template-columns: 1fr;
}
.perfil-switches-grid,
.perfil-fiscal-grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.cadastro-friendly-form .modal-body {
padding: 12px;
}
.cadastro-friendly-form .ss-form-grid > .ss-field {
grid-column: 1 / -1;
}
.cadastro-friendly-form .modal-footer {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 0.55rem;
}
.cadastro-friendly-form .modal-footer .btn {
width: 100%;
margin: 0;
}
.cadastro-cards {
flex: 1 1 auto;
grid-template-columns: 1fr;
grid-auto-rows: max-content;
align-items: start;
min-height: 0;
gap: 0.9rem;
padding: 0.8rem;
overflow-y: auto;
background: #f1f5f9;
-webkit-overflow-scrolling: touch;
}
.fornecedor-card {
align-self: start;
height: auto;
min-height: max-content;
border-color: #dfe5ee;
border-radius: 10px;
box-shadow: 0 4px 12px rgba(15, 23, 42, 0.06);
}
.fornecedores-funcionarios-content {
overflow: hidden;
}
.fornecedores-funcionarios-page {
flex: 1 1 auto;
min-height: 0;
overflow: hidden;
}
.fornecedores-funcionarios-panel {
flex: 1 1 auto;
min-height: 0;
overflow: hidden;
}
.fornecedor-card-head {
grid-template-columns: auto minmax(0, 1fr) auto;
gap: 0.7rem;
padding: 0.9rem;
border-bottom: 0;
}
.fornecedor-card-head > .clientes-status {
grid-column: auto;
justify-self: end;
min-width: 0;
min-height: 30px;
padding-inline: 0.6rem;
}
.fornecedor-card .cadastro-lista-foto {
width: 64px;
height: 64px;
border: 1px solid #dfe5ee;
box-shadow: none;
}
.fornecedor-card-identidade {
gap: 0.28rem;
}
.fornecedor-card-identidade strong {
font-size: 1rem;
line-height: 1.2;
}
.fornecedor-card-identidade span {
font-size: 0.82rem;
}
.fornecedor-card-body {
gap: 0.75rem;
padding: 0.8rem 0.9rem 0.9rem;
border-top: 1px solid #e2e8f0;
background: #f8fafc;
}
.fornecedor-card-tags {
gap: 0.4rem;
}
.fornecedor-card-tags > span {
min-height: 28px;
padding: 0.2rem 0.65rem;
font-size: 0.76rem;
}
.fornecedor-card-unidades {
align-items: center;
min-height: 30px;
padding: 0.4rem 0.55rem;
border: 1px solid #e2e8f0;
border-radius: 8px;
background: #fff;
color: #334155;
font-size: 0.8rem;
}
.fornecedor-identidade-layout {
grid-template-columns: 1fr;
}
.fornecedor-card-foot {
display: flex;
align-items: center;
flex-wrap: wrap;
row-gap: 0.5rem;
padding: 0.6rem 0.85rem 0.85rem;
background: #fff;
}
.fornecedor-card-foot > small {
display: block;
}
.fornecedor-card-actions {
display: inline-flex;
width: auto;
margin-left: auto;
gap: 0.3rem;
}
}
@media (max-width: 767.98px) {
.fornecedor-perfis-grid,
.fornecedor-comissoes-grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
#modalCadastroCrud .modal-smart-cards--commissions .modal-smart-fields--commissions,
#modalFornecedorFuncionarioCadastro .modal-smart-cards--commissions .modal-smart-fields--commissions {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
#modalCadastroCrud .modal-smart-cards--commissions .modal-smart-total,
#modalFornecedorFuncionarioCadastro .modal-smart-cards--commissions .modal-smart-total {
grid-column: 1 / -1;
}
}
@media (max-width: 479.98px) {
.fornecedor-perfis-grid {
grid-template-columns: 1fr;
}
.fornecedor-comissoes-grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.fornecedor-comissoes-grid .fornecedor-comissao--comissao {
grid-column: 1 / -1;
}
}
@media (max-width: 575.98px) {
#modalCadastroCrud .fornecedor-tab-fields--credito > .ss-field,
#modalCadastroCrud .fornecedor-tab-fields--endereco > .fornecedor-field--endereco_cep,
#modalCadastroCrud .fornecedor-tab-fields--endereco > .fornecedor-field--endereco_numero,
#modalFornecedorFuncionarioCadastro .fornecedor-tab-fields--credito > .ss-field,
#modalFornecedorFuncionarioCadastro .fornecedor-tab-fields--endereco > .fornecedor-field--endereco_cep,
#modalFornecedorFuncionarioCadastro .fornecedor-tab-fields--endereco > .fornecedor-field--endereco_numero {
grid-column: span 6;
}
}
.usuarios-ag-grid {
flex: 1 1 auto;
width: 100%;
--ss-grid-height: 100%;
}
.usuarios-cards {
flex: 1 1 auto;
display: grid;
grid-template-columns: repeat(auto-fill, minmax(310px, 1fr));
grid-auto-rows: max-content;
gap: 0.85rem;
align-content: start;
min-height: 0;
padding: 0.85rem;
overflow-y: auto;
-webkit-overflow-scrolling: touch;
}
.usuario-card {
min-width: 0;
}
.usuario-card-head {
display: flex;
align-items: center;
gap: 0.75rem;
padding: 0.85rem;
border-bottom: 1px solid #eef2f7;
}
.usuario-card-avatar {
width: 52px;
height: 52px;
flex: 0 0 52px;
display: inline-flex;
align-items: center;
justify-content: center;
border-radius: 50%;
background: var(--cor-unidade, #2d3142);
color: #fff;
font-size: 0.9rem;
font-weight: 800;
}
.usuario-card-identidade {
min-width: 0;
display: grid;
gap: 0.22rem;
}
.usuario-card-identidade > strong {
overflow: hidden;
color: #0f172a;
font-size: 0.95rem;
font-weight: 800;
text-overflow: ellipsis;
white-space: nowrap;
}
.usuario-card-identidade > span {
min-width: 0;
display: flex;
align-items: center;
gap: 0.35rem;
color: #64748b;
font-size: 0.78rem;
}
.usuario-card-identidade > span > span {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.usuario-card-body {
display: grid;
gap: 0.65rem;
padding: 0.8rem 0.85rem;
}
.usuario-card-permissao {
width: fit-content;
min-height: 24px;
display: inline-flex;
align-items: center;
gap: 0.35rem;
padding: 0.15rem 0.55rem;
border: 1px solid #dbeafe;
border-radius: 999px;
background: #eff6ff;
color: #1d4ed8;
font-size: .75rem;
font-weight: 800;
}
.usuario-card-permissao.is-master {
border-color: #bbf7d0;
background: #ecfdf3;
color: #166534;
}
.usuario-card-info {
min-width: 0;
display: flex;
align-items: flex-start;
gap: 0.45rem;
color: #475569;
font-size: 0.78rem;
line-height: 1.4;
}
.usuario-card-info i {
flex: 0 0 auto;
color: var(--cor-unidade, #2d3142);
}
.usuario-card-info .fa-whatsapp {
color: #16a34a;
}
.usuario-card-foot small {
color: #64748b;
font-size: .75rem;
}
.usuarios-cards-vazio {
grid-column: 1 / -1;
}
@media (max-width: 575.98px) {
.usuarios-cards {
grid-template-columns: 1fr;
grid-auto-rows: max-content;
align-items: start;
padding: 0.8rem;
}
.usuario-card {
align-self: start;
height: auto;
min-height: max-content;
}
.usuario-card-foot {
flex-wrap: wrap;
row-gap: 0.5rem;
}
.usuario-card-foot .unidade-card-acoes {
margin-left: auto;
}
}
.historicos-cards {
flex: 1 1 auto;
display: grid;
grid-template-columns: minmax(0, 1fr);
grid-auto-rows: max-content;
gap: 0.85rem;
align-content: start;
min-height: 0;
padding: 0.85rem;
overflow-y: auto;
-webkit-overflow-scrolling: touch;
}
.historico-categoria-grupo > .historico-categoria-grid {
grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
}
.produto-categoria-card-title > .historico-categoria-grupo-icone.is-receita {
color: #16a34a;
}
.produto-categoria-card-title > .historico-categoria-grupo-icone.is-despesa {
color: #dc2626;
}
.historico-card {
min-width: 0;
border-radius: 8px;
}
.historico-card-head {
display: flex;
align-items: center;
gap: 0.55rem;
min-height: 62px;
padding: 0.55rem 0.65rem;
}
.historico-card-icone {
width: 36px;
height: 36px;
flex: 0 0 36px;
display: inline-flex;
align-items: center;
justify-content: center;
border: 1px solid transparent;
border-radius: 50%;
font-size: 0.88rem;
}
.historico-card-icone.is-receita {
border-color: #bbf7d0;
background: #ecfdf3;
color: #166534;
}
.historico-card-icone.is-despesa {
border-color: #fecaca;
background: #fef2f2;
color: #991b1b;
}
.historico-card-identidade {
flex: 1 1 auto;
min-width: 0;
display: grid;
gap: 0.2rem;
}
.historico-card-identidade strong {
overflow: hidden;
color: #0f172a;
font-size: 0.86rem;
font-weight: 800;
text-overflow: ellipsis;
white-space: nowrap;
}
.historico-card-identidade span {
color: #64748b;
font-size: .75rem;
line-height: 1.2;
}
.historico-card-acoes {
flex: 0 0 auto;
margin-left: auto;
}
.historico-card-acoes .btn {
width: 30px;
min-width: 30px;
height: 30px;
min-height: 30px;
display: inline-flex;
align-items: center;
justify-content: center;
padding: 0;
}
.historico-card-body {
display: grid;
gap: 0.65rem;
padding: 0.8rem 0.85rem;
}
.historico-card-natureza {
width: fit-content;
min-height: 25px;
display: inline-flex;
align-items: center;
gap: 0.35rem;
padding: 0.15rem 0.55rem;
border: 1px solid transparent;
border-radius: 999px;
font-size: .75rem;
font-weight: 800;
}
.historico-card-natureza.is-receita {
border-color: #bbf7d0;
background: #ecfdf3;
color: #166534;
}
.historico-card-natureza.is-despesa {
border-color: #fecaca;
background: #fef2f2;
color: #991b1b;
}
.historico-card-categoria {
min-width: 0;
display: flex;
align-items: center;
gap: 0.45rem;
color: #475569;
font-size: 0.8rem;
}
.historico-card-categoria i {
flex: 0 0 auto;
color: var(--cor-unidade, #2d3142);
}
.historico-card-categoria span {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.historico-card-foot small {
color: #64748b;
font-size: .75rem;
}
.historicos-cards-vazio {
grid-column: 1 / -1;
}
.historico-categorias-modal-content .modal-body {
display: flex;
flex-direction: column;
min-height: 0;
}
.historico-categorias-intro,
.historico-categoria-form-card {
flex: 0 0 auto;
}
.historico-categoria-form-card {
margin-bottom: 0.85rem;
}
.historico-categorias-cards {
flex: 1 1 auto;
display: grid;
grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
grid-auto-rows: max-content;
gap: 0.65rem;
align-content: start;
min-height: 180px;
max-height: 420px;
padding: 0.75rem;
overflow-y: auto;
border: 1px solid #dfe5ee;
border-radius: 8px;
background: #f8fafc;
-webkit-overflow-scrolling: touch;
}
.historico-categoria-card {
min-width: 0;
min-height: 68px;
display: flex;
align-items: center;
gap: 0.65rem;
padding: 0.7rem;
border: 1px solid #dfe5ee;
border-radius: 10px;
background: #fff;
box-shadow: 0 4px 12px rgba(15, 23, 42, 0.05);
}
.historico-categoria-icone {
width: 38px;
height: 38px;
flex: 0 0 38px;
display: inline-flex;
align-items: center;
justify-content: center;
border-radius: 50%;
background: #eef2ff;
color: #3730a3;
}
.historico-categoria-info {
min-width: 0;
display: grid;
gap: 0.2rem;
}
.historico-categoria-info strong {
overflow: hidden;
color: #0f172a;
font-size: 0.82rem;
text-overflow: ellipsis;
white-space: nowrap;
}
.historico-categoria-tipo {
width: fit-content;
color: #1d4ed8;
font-size: .75rem;
font-weight: 700;
}
.historico-categoria-tipo.is-padrao {
color: #64748b;
}
.historico-categoria-acoes {
flex: 0 0 auto;
margin-left: auto;
}
@media (max-width: 575.98px) {
.historicos-cards {
grid-template-columns: 1fr;
grid-auto-rows: max-content;
align-items: start;
gap: 0.55rem;
padding: 0.65rem;
}
.historico-card {
align-self: start;
height: auto;
min-height: max-content;
}
.historico-card-foot {
flex-wrap: wrap;
row-gap: 0.5rem;
}
.historico-card-foot .unidade-card-acoes {
margin-left: auto;
}
.historico-categorias-modal-content .modal-body {
padding: 12px;
}
.historico-categorias-cards {
grid-template-columns: 1fr;
min-height: 0;
max-height: none;
}
}
.usuarios-form-section + .usuarios-form-section {
margin-top: 1.25rem;
padding-top: 1rem;
border-top: 1px solid #dfe5ee;
}
.usuarios-form-section-title {
margin: 0 0 0.85rem;
color: #111827;
font-size: 0.82rem;
font-weight: 800;
}
.usuarios-config-card,
.historico-config-card {
margin-bottom: 0.85rem;
}
.usuarios-form-section .form-label {
margin-bottom: 0.25rem;
color: #111827;
font-size: 0.82rem;
font-weight: 500;
}
.usuarios-acessos-cards {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 0.75rem;
align-items: start;
}
.usuarios-acesso-card {
min-width: 0;
overflow: hidden;
border: 1px solid #dbe3ee;
border-radius: 12px;
background: #fff;
box-shadow: 0 4px 12px rgba(15, 23, 42, 0.04);
transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.usuarios-acesso-card.is-active {
border-color: #aab8f5;
box-shadow: 0 5px 14px rgba(18, 35, 190, 0.08);
}
.usuarios-acesso-card-head {
min-width: 0;
display: flex;
align-items: center;
justify-content: space-between;
gap: 0.75rem;
padding: 0.75rem;
background: #f8fafc;
border-bottom: 1px solid #e7edf5;
}
.usuarios-acesso-identidade {
min-width: 0;
display: flex;
align-items: center;
gap: 0.6rem;
}
.usuarios-acesso-icone {
width: 34px;
height: 34px;
flex: 0 0 34px;
display: inline-flex;
align-items: center;
justify-content: center;
border-radius: 9px;
background: #e8edff;
color: var(--ss-action-bg, #1223be);
}
.usuarios-acesso-identidade > div {
min-width: 0;
display: grid;
gap: 0.08rem;
}
.usuarios-acesso-identidade small {
color: #64748b;
font-size: .75rem;
font-weight: 700;
letter-spacing: 0.05em;
text-transform: uppercase;
}
.usuarios-acesso-identidade strong {
overflow: hidden;
color: #0f172a;
font-size: 0.84rem;
font-weight: 800;
text-overflow: ellipsis;
white-space: nowrap;
}
.usuarios-acesso-estado {
flex: 0 0 auto;
display: flex;
align-items: center;
gap: 0.45rem;
}
.usuarios-acesso-estado > span {
color: #64748b;
font-size: .75rem;
font-weight: 700;
}
.usuarios-acesso-card.is-active .usuarios-acesso-estado > span {
color: #1223be;
}
.usuarios-acesso-switch {
flex: 0 0 auto;
}
.usuarios-acesso-perfis {
display: grid;
gap: 0.45rem;
padding: 0.7rem 0.75rem 0.75rem;
}
.usuarios-acesso-perfis-titulo {
color: #64748b;
font-size: .75rem;
font-weight: 800;
letter-spacing: 0.04em;
text-transform: uppercase;
}
.usuarios-acesso-perfil {
min-width: 0;
min-height: 38px;
display: flex;
align-items: center;
justify-content: space-between;
gap: 0.75rem;
padding: 0.5rem 0.6rem;
border: 1px solid #e3e8f0;
border-radius: 9px;
background: #fff;
}
.usuarios-acesso-perfil.is-active {
border-color: #c5cef8;
background: #f7f8ff;
}
.usuarios-acesso-perfil > span {
min-width: 0;
overflow-wrap: anywhere;
color: #1e293b;
font-size: 0.78rem;
font-weight: 700;
}
.usuarios-acesso-sem-perfis {
margin: 0;
padding: 0.6rem;
border: 1px dashed #d9e0ea;
border-radius: 9px;
color: #64748b;
font-size: .75rem;
text-align: center;
}
.usuarios-acessos-vazio {
grid-column: 1 / -1;
min-height: 90px;
display: flex;
align-items: center;
justify-content: center;
gap: 0.5rem;
padding: 1rem;
border: 1px dashed #d7dee9;
border-radius: 12px;
color: #64748b;
font-size: 0.8rem;
}
@media (max-width: 767.98px) {
.usuarios-acessos-cards {
grid-template-columns: 1fr;
}
}
@media (max-width: 575.98px) {
.usuarios-acesso-card-head {
align-items: flex-start;
padding: 0.7rem;
}
.usuarios-acesso-estado {
align-items: flex-end;
flex-direction: column-reverse;
gap: 0.2rem;
}
.usuarios-acesso-perfis {
padding: 0.65rem;
}
.usuarios-acesso-perfil {
min-height: 42px;
}
}
.usuarios-autofill-fake {
position: absolute;
left: -9999px;
top: -9999px;
opacity: 0;
pointer-events: none;
}
.unidades-btn-icon,
.btn.unidades-btn-icon {
width: 30px;
min-width: 30px;
height: 30px;
min-height: 30px;
display: inline-flex;
align-items: center;
justify-content: center;
padding: 0;
flex: 0 0 30px;
border-radius: 999px;
border-color: #facc15;
background: #facc15;
color: #111827;
line-height: 1;
box-shadow: none;
}
.unidades-btn-icon i {
font-size: 0.92rem;
line-height: 1;
}
.unidades-btn-icon:hover,
.unidades-btn-icon:focus {
border-color: #eab308;
background: #eab308;
color: #111827;
}
.unidades-btn-icon.unidades-btn-danger,
.btn.unidades-btn-icon.unidades-btn-danger {
border-color: #f00446;
background: #f00446;
color: #fff;
}
.unidades-btn-icon.unidades-btn-danger:hover,
.unidades-btn-icon.unidades-btn-danger:focus,
.btn.unidades-btn-icon.unidades-btn-danger:hover,
.btn.unidades-btn-icon.unidades-btn-danger:focus {
color: #fff;
background: #cf003a;
border-color: #cf003a;
}
.unidades-btn-icon.unidades-btn-copy,
.btn.unidades-btn-icon.unidades-btn-copy {
border-color: #111827;
background: #fff;
color: #111827;
}
.unidades-btn-icon.unidades-btn-copy:hover,
.unidades-btn-icon.unidades-btn-copy:focus,
.btn.unidades-btn-icon.unidades-btn-copy:hover,
.btn.unidades-btn-icon.unidades-btn-copy:focus {
border-color: #111827;
background: #f3f4f6;
color: #111827;
}
.unidades-vazio {
min-height: 180px;
display: flex;
align-items: center;
justify-content: center;
gap: 0.6rem;
color: #64748b;
font-weight: 600;
}
.unidades-vazio i {
font-size: 1.4rem;
color: var(--cor-unidade, #2d3142);
}
/* Clientes */
#modalClienteCadastro .ss-form-grid,
#modalClienteEndereco .ss-form-grid {
grid-template-columns: repeat(12, minmax(0, 1fr));
}
.clientes-config-card,
.clientes-endereco-card {
background: #fff;
}
.clientes-documentos-card {
margin-bottom: 1rem;
}
.clientes-documentos-card[open] .unidade-simple-note {
margin-top: 0.8rem;
}
.clientes-status-field {
align-self: start;
}
.clientes-enderecos-help {
margin: 0 0 0.7rem;
}
.clientes-endereco-intro {
margin-bottom: 1rem;
}
.clientes-ag-grid {
flex: 1 1 auto;
width: 100%;
}
.clientes-inner-grid {
width: 100%;
}
.clientes-unidades-grid {
--ss-grid-height: 330px;
}
.clientes-enderecos-grid {
--ss-grid-height: 230px;
}
.clientes-section-head {
display: flex;
align-items: flex-start;
justify-content: space-between;
gap: 0.75rem;
margin: 0 0 0.6rem;
}
.clientes-section-head .ss-section-title,
.clientes-section-head .unidade-config-card-head {
margin-bottom: 0;
}
.clientes-switch-field {
min-height: 31px;
align-items: center;
}
.clientes-name-cell {
display: flex;
align-items: center;
gap: 0.7rem;
min-height: 40px;
min-width: 230px;
padding: 3px 0;
}
.clientes-avatar {
width: 34px;
height: 34px;
flex: 0 0 34px;
border-radius: 50%;
display: inline-flex;
align-items: center;
justify-content: center;
background: var(--cor-unidade, #2d3142);
color: #fff;
font-size: 0.86rem;
font-weight: 800;
}
.clientes-name-info {
min-width: 0;
display: flex;
flex-direction: column;
gap: 0.1rem;
}
.clientes-name-info strong {
max-width: 320px;
overflow: hidden;
color: #111827;
font-size: 0.92rem;
font-weight: 800;
text-overflow: ellipsis;
white-space: nowrap;
}
.clientes-name-info small {
color: #64748b;
font-size: 0.78rem;
}
.clientes-status {
min-width: 84px;
min-height: 28px;
display: inline-flex;
align-items: center;
justify-content: center;
gap: 0.3rem;
border: 1px solid transparent;
border-radius: 999px;
padding: 0.18rem 0.55rem;
font-size: 0.76rem;
font-weight: 800;
white-space: nowrap;
}
.clientes-status--success {
border-color: #bbf7d0;
background: #ecfdf3;
color: #166534;
}
.clientes-status--danger {
border-color: #fecaca;
background: #fef2f2;
color: #991b1b;
}
@media (max-width: 767.98px) {
#modalClienteCadastro .ss-form-grid > .ss-field,
#modalClienteEndereco .ss-form-grid > .ss-field {
grid-column: 1 / -1;
}
.clientes-section-head {
align-items: stretch;
flex-direction: column;
}
.clientes-section-head .btn {
width: 100%;
}
}
@media (max-width: 575.98px) {
#modalClienteCadastro .modal-body,
#modalClienteEndereco .modal-body {
padding: 12px;
}
#modalClienteCadastro .modal-footer,
#modalClienteEndereco .modal-footer {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 0.55rem;
}
#modalClienteCadastro .modal-footer .btn,
#modalClienteEndereco .modal-footer .btn {
width: 100%;
margin: 0;
}
.clientes-config-card,
.clientes-endereco-card,
.clientes-documentos-card {
margin-bottom: 0.75rem;
padding: 0.85rem;
border-radius: 10px;
box-shadow: none;
}
}
.unidades-form-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 0.85rem;
}
.unidades-field-wide {
grid-column: span 2;
}
.unidades-field .form-label {
margin-bottom: 0.25rem;
font-size: 0.78rem;
font-weight: 800;
color: #334155;
}
.unidades-color-input {
min-width: 100%;
height: 34px;
padding: 0.2rem;
}
.unidades-form-section {
margin-top: 1rem;
padding-top: 1rem;
border-top: 1px solid #edf0f5;
}
.unidades-form-section h6 {
margin: 0 0 0.75rem;
font-size: 0.82rem;
font-weight: 900;
color: #0f172a;
text-transform: uppercase;
letter-spacing: 0.04em;
}
.unidades-check {
display: flex;
align-items: flex-start;
gap: 0.6rem;
margin-top: 1rem;
padding: 0.8rem;
border: 1px solid #e5e7eb;
border-radius: 8px;
background: #f8fafc;
}
.unidades-check input {
margin-top: 0.2rem;
}
.unidades-check span {
display: flex;
flex-direction: column;
gap: 0.1rem;
}
.unidades-check small {
color: #64748b;
}
.unidade-mapa-layout {
display: grid;
grid-template-columns: minmax(260px, 360px) minmax(0, 1fr);
gap: 1rem;
}
.unidade-mapa-card {
display: flex;
flex-direction: column;
gap: 0.85rem;
padding: 1rem;
border: 1px solid #e5e7eb;
border-radius: 8px;
background: #f8fafc;
}
.unidade-mapa-card strong {
color: #0f172a;
font-size: 0.9rem;
}
.unidade-mapa-card span {
color: #64748b;
font-size: 0.82rem;
}
.unidade-mapa-campos {
grid-template-columns: 1fr;
}
.unidade-mapa-campos .unidades-field-wide {
grid-column: span 1;
}
.unidade-mapa-actions {
display: flex;
flex-wrap: wrap;
gap: 0.45rem;
}
.unidade-mapa-status {
min-height: 38px;
padding: 0.65rem 0.75rem;
border: 1px solid #dbe4f0;
border-radius: 8px;
background: #fff;
color: #475569;
font-size: 0.82rem;
}
.unidade-mapa-link {
color: var(--ss-action-bg);
font-size: 0.82rem;
font-weight: 800;
text-decoration: none;
}
.unidade-mapa-link:hover {
color: var(--cor-unidade, #2d3142);
text-decoration: underline;
}
.unidade-mapa-canvas {
width: 100%;
min-height: 390px;
border: 1px solid #dfe5ee;
border-radius: 8px;
overflow: hidden;
background: #eef2f7;
}
.unidade-mapa-canvas .leaflet-container,
.leaflet-container.unidade-mapa-canvas {
font-family: var(--ss-font);
}
.unidade-imagens-tab {
display: grid;
grid-template-columns: minmax(230px, 0.75fr) minmax(0, 1.75fr);
gap: 0.85rem;
align-items: stretch;
}
.unidade-imagem-card {
min-width: 0;
}
.unidade-logo-preview,
.unidade-capa-preview {
position: relative;
display: flex;
align-items: center;
justify-content: center;
border: 0;
background: transparent;
overflow: hidden;
color: var(--ss-action-bg);
}
.unidade-logo-preview {
width: 166px;
height: 166px;
margin: 1.8rem auto 0.8rem;
border-radius: 50%;
background: #f3f4f8;
}
.unidade-capa-preview {
width: 100%;
height: 180px;
border: 2px dashed #dedee5;
border-radius: 0;
background: #fff;
}
.unidade-logo-preview img,
.unidade-capa-preview img {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
}
.unidade-logo-preview i,
.unidade-capa-preview i {
position: absolute;
width: 42px;
height: 42px;
display: inline-flex;
align-items: center;
justify-content: center;
border-radius: 50%;
background: rgba(118,111,149,0.78);
color: #fff;
font-size: 1.35rem;
}
.unidade-capa-preview img {
width: min(460px, 100%);
}
.unidade-imagens-help {
margin-top: 0.65rem;
color: #111827;
font-size: 0.88rem;
}
.unidade-aparencia-layout {
display: grid;
grid-template-columns: minmax(360px, 58%) minmax(260px, 1fr);
gap: 2rem;
align-items: start;
}
.unidade-aparencia-controls {
display: flex;
flex-direction: column;
gap: 0.55rem;
}
.unidade-color-wrap {
height: 28px;
display: grid;
grid-template-columns: 40px 1fr;
align-items: center;
border: 1px solid #d6ddeb;
border-radius: 7px;
overflow: hidden;
background: #fff;
}
.unidade-color-wrap input {
width: 40px;
height: 30px;
padding: 0;
border: 0;
background: transparent;
}
.unidade-color-wrap span {
padding: 0 0.65rem;
color: #111827;
font-size: 1rem;
}
.unidade-aparencia-switch {
margin: 0.35rem 0 0.5rem;
}
.unidade-tipografia-panel h6 {
margin: 0 0 0.95rem;
color: #283044;
font-size: 0.9rem;
font-weight: 800;
}
.unidade-tipografia-grid {
gap: 0.6rem 1.5rem;
}
.unidade-tipografia-grid .ss-field:nth-child(2),
.unidade-tipografia-grid .ss-field:nth-child(4) {
border-bottom: 1px solid #d9dde6;
padding-bottom: 0.5rem;
}
.unidade-traco-field {
align-self: end;
padding-bottom: 0.2rem;
}
.unidade-app-preview-wrap {
display: flex;
flex-direction: column;
align-items: center;
gap: 0.25rem;
}
.unidade-app-preview-wrap > strong {
color: #64748b;
font-size: 0.8rem;
letter-spacing: 0.08em;
}
.unidade-app-preview-wrap > small {
color: #9aa1b2;
font-size: .75rem;
}
.unidade-app-preview {
position: relative;
width: 276px;
height: 492px;
padding: 8px;
border: 6px solid #241b33;
border-radius: 34px;
background: #eef2fb;
overflow: hidden;
box-shadow: 0 24px 42px rgba(15,23,42,0.18);
}
.app-phone-top {
position: absolute;
top: 8px;
left: 18px;
right: 18px;
z-index: 4;
display: flex;
align-items: center;
justify-content: space-between;
color: #fff;
font-size: .75rem;
}
.app-cover-preview {
height: 82px;
margin: -8px -8px 0;
background: linear-gradient(135deg, #c7d2fe, #e5e7eb);
background-size: cover;
background-position: center;
}
.app-store-card {
position: relative;
min-height: 102px;
margin: -24px 10px 10px;
padding: 38px 10px 10px;
border-radius: 0 0 14px 14px;
background: #fff;
text-align: center;
box-shadow: 0 8px 18px rgba(15,23,42,0.08);
}
.app-avatar-preview {
position: absolute;
top: -23px;
left: 50%;
width: 46px;
height: 46px;
transform: translateX(-50%);
border: 3px solid #fff;
border-radius: 50%;
background: var(--cor-unidade, #2d3142);
background-size: cover;
background-position: center;
}
.app-store-card strong {
display: block;
color: #111827;
font-size: 0.76rem;
}
.app-store-card small {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 0.25rem;
color: #6b7280;
font-size: .75rem;
}
.app-store-card small span {
width: 7px;
height: 7px;
border-radius: 50%;
background: #ff0050;
}
.app-icon-row {
display: flex;
justify-content: center;
gap: 0.55rem;
margin-top: 0.55rem;
}
.app-icon-row i,
.app-icon-row b {
width: 24px;
height: 24px;
display: inline-flex;
align-items: center;
justify-content: center;
border-radius: 50%;
background: #edf1fa;
color: #475569;
font-size: .75rem;
font-style: normal;
}
.app-icon-row b {
background: var(--ss-action-bg);
color: #fff;
}
.app-category-select {
position: relative;
display: inline-flex;
align-items: center;
justify-content: space-between;
width: 210px;
height: 25px;
padding: 0 0.5rem;
border: 1px solid #ccd5e7;
border-radius: 7px;
background: #fff;
color: #607089;
font-size: 0.58rem;
}
.app-search-dot {
position: absolute;
top: 188px;
right: 15px;
width: 24px;
height: 24px;
display: inline-flex;
align-items: center;
justify-content: center;
border-radius: 50%;
background: var(--ss-action-bg);
color: #fff;
font-size: .75rem;
}
.unidade-app-preview h6 {
margin: 0.75rem 0 0.45rem;
color: #1f2937;
font-size: .75rem;
font-weight: 800;
}
.app-products-mini {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 0.4rem;
}
.app-products-mini span {
min-height: 78px;
display: flex;
flex-direction: column;
gap: 0.2rem;
padding: 0.45rem;
border-radius: 7px;
background: #fff;
box-shadow: 0 6px 12px rgba(15,23,42,0.08);
}
.app-products-mini i {
height: 36px;
display: flex;
align-items: center;
justify-content: center;
margin: -0.45rem -0.45rem 0.25rem;
border-radius: 7px 7px 0 0;
background: #d8deec;
color: #8b97ad;
}
.app-products-mini b,
.app-list-mini b {
color: #111827;
font-size: .75rem;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.app-products-mini em,
.app-list-mini em {
color: var(--ss-action-bg);
font-size: .75rem;
font-style: normal;
font-weight: 800;
}
.app-list-mini {
min-height: 55px;
display: grid;
grid-template-columns: 1fr 44px;
gap: 0.45rem;
align-items: center;
padding: 0.45rem;
border-radius: 9px;
background: #fff;
}
.app-list-mini div {
display: flex;
flex-direction: column;
gap: 0.1rem;
}
.app-list-mini small {
color: #7b8192;
font-size: .75rem;
}
.app-list-mini > i {
height: 44px;
display: inline-flex;
align-items: center;
justify-content: center;
border-radius: 7px;
background: #d8deec;
color: #8b97ad;
}
.app-bottom-nav {
position: absolute;
left: 8px;
right: 8px;
bottom: 8px;
height: 46px;
display: grid;
grid-template-columns: repeat(5, 1fr);
align-items: center;
border-top: 1px solid #e4e8f2;
background: #fff;
}
.app-bottom-nav span {
display: flex;
flex-direction: column;
align-items: center;
gap: 0.12rem;
color: #8b97ad;
font-size: .75rem;
}
.app-bottom-nav span:first-child {
color: var(--ss-action-bg);
}
/* Padrão único para todas as grades AG Grid do gestor. */
.ag-theme-quartz {
--ag-font-family: var(--ss-font);
--ag-font-size: 12px;
--ag-cell-horizontal-border: none;
--ag-header-column-separator-display: none;
--ag-pinned-column-border: none;
--ag-row-border-color: #d9dde6;
--ag-row-border-style: solid;
--ag-row-border-width: 1px;
--ag-list-item-height: 30px;
--ag-odd-row-background-color: var(--ss-table-striped-bg);
--ag-even-row-background-color: #ffffff;
--ag-row-hover-color: var(--ss-table-hover-bg);
--ag-header-background-color: var(--ss-table-head-footer-bg);
--ag-header-foreground-color: var(--ss-table-head-footer-color);
--ag-wrapper-border-radius: 8px;
}
.ag-theme-quartz.ssapps-ag-grid {
width: 100%;
}
/* O tema oficial força 150px no autoHeight; damos folga (maior que --ag-row-height, ~40px) pro overlay "sem registros" não ficar colado nas bordas. */
.ag-theme-quartz .ag-layout-auto-height .ag-center-cols-container,
.ag-theme-quartz .ag-layout-auto-height .ag-center-cols-viewport,
.ag-theme-quartz .ag-layout-print .ag-center-cols-container,
.ag-theme-quartz .ag-layout-print .ag-center-cols-viewport {
min-height: 48px !important;
}
.ag-theme-quartz.ssapps-ag-grid-auto {
height: auto !important;
}
.ag-theme-quartz.ssapps-ag-grid-normal {
height: var(--ss-grid-height, calc(100vh - 330px));
}
.ag-theme-quartz .ag-root-wrapper {
border: 1px solid #d9dde6;
border-radius: 8px;
overflow: hidden;
}
.ag-theme-quartz .ag-header {
background: var(--ss-table-head-footer-bg);
border-bottom: 1px solid var(--ss-table-head-footer-border);
}
.ag-theme-quartz .ag-header-cell,
.ag-theme-quartz .ag-header-group-cell,
.ag-theme-quartz .ag-cell {
border-left: 0 !important;
border-right: 0 !important;
}
.ag-theme-quartz .ag-header-cell::after,
.ag-theme-quartz .ag-header-group-cell::after {
display: none !important;
}
.ag-theme-quartz .ag-header-cell-text {
color: var(--ss-table-head-footer-color);
font-weight: 800;
}
.ag-theme-quartz .ag-header .ag-icon {
color: color-mix(in srgb, var(--ss-table-head-footer-color) 82%, transparent);
}
.ag-theme-quartz .ag-row {
border-bottom: 1px solid #d9dde6 !important;
}
/* striped rows - aplicado via rowClassRules nativo do AG Grid */
.ag-theme-quartz .ag-row.ssapps-ag-row-odd {
background-color: var(--ss-table-striped-bg) !important;
}
.ag-theme-quartz .ag-row.ssapps-ag-row-even {
background-color: #ffffff !important;
}
.ag-theme-quartz .ag-row.ssapps-ag-row-odd.ag-row-hover,
.ag-theme-quartz .ag-row.ssapps-ag-row-odd:hover {
background-color: var(--ss-table-hover-bg) !important;
}
.ag-theme-quartz .ag-row.ssapps-ag-row-even.ag-row-hover,
.ag-theme-quartz .ag-row.ssapps-ag-row-even:hover {
background-color: var(--ss-table-hover-bg) !important;
}
/* linhas de grupo (árvore) - mesmo tom do cabeçalho, sempre acima do zebrado */
.ag-theme-quartz .ag-row.ag-row-group {
background-color: var(--ss-table-striped-bg) !important;
}
.ag-theme-quartz .ag-row.ag-row-group.ag-row-hover,
.ag-theme-quartz .ag-row.ag-row-group:hover {
background-color: var(--ss-table-hover-bg) !important;
}
/* rodapé (linhas fixas/agregação) - mesmo tom do cabeçalho, texto em negrito */
.ag-theme-quartz .ag-row-pinned,
.ag-theme-quartz .ag-floating-bottom-container .ag-row {
background-color: var(--ss-table-head-footer-bg) !important;
color: var(--ss-table-head-footer-color);
font-weight: 800 !important;
}
.ag-theme-quartz .ag-row-pinned .ag-cell,
.ag-theme-quartz .ag-floating-bottom-container .ag-cell {
color: var(--ss-table-head-footer-color);
}
.ag-theme-quartz .ag-cell {
line-height: normal;
}
.ag-theme-quartz .ag-cell.ssapps-ag-cell-vcenter {
display: flex;
align-items: center;
}
.ag-theme-quartz .ag-cell.ssapps-ag-cell-vcenter > .ag-cell-wrapper,
.ag-theme-quartz .ag-cell.ssapps-ag-cell-vcenter > .ag-cell-value {
width: 100%;
}
.ag-theme-quartz .ag-cell-wrapper {
align-items: center;
}
.ag-theme-quartz .ss-actions-cell {
display: flex;
align-items: center;
justify-content: center;
}
.ag-theme-quartz .ss-actions-header .ag-header-cell-label {
justify-content: center;
}
.ag-theme-quartz .ag-row-group .ag-cell,
.ag-theme-quartz .ag-group-value,
.ag-theme-quartz .ag-group-child-count {
font-weight: 800;
}
.ag-theme-quartz .ag-status-bar {
border-top: 1px solid var(--ss-table-head-footer-border);
background: var(--ss-table-head-footer-bg);
color: var(--ss-table-head-footer-color);
font-size: 0.76rem;
}
.impressoras-driver-status-wrap {
align-items: center;
display: flex;
flex-wrap: wrap;
gap: 0.45rem;
}
.impressoras-driver-status {
align-items: center;
border: 1px solid #d9dde6;
border-radius: 8px;
display: flex;
font-size: 0.78rem;
font-weight: 700;
gap: 0.35rem;
line-height: 1.2;
min-height: 31px;
padding: 0.38rem 0.62rem;
}
.impressoras-driver-status a {
color: inherit;
text-decoration: underline;
}
.impressoras-driver-status--secondary {
background: #f8fafc;
color: #475569;
}
.impressoras-driver-status--success {
background: #dcfce7;
border-color: #86efac;
color: #166534;
}
.impressoras-driver-status--warning {
background: #fef3c7;
border-color: #facc15;
color: #854d0e;
}
.impressoras-driver-status--danger {
background: #fee2e2;
border-color: #fca5a5;
color: #991b1b;
}
.impressoras-routing-alert {
align-items: center;
background: #f8fafc;
border: 1px solid #d9dde6;
border-radius: 8px;
color: #475569;
display: flex;
gap: 0.75rem;
margin-bottom: 0.9rem;
padding: 0.7rem 0.85rem;
}
.impressoras-routing-alert > i {
color: var(--cor-unidade, #4e73df);
font-size: 1.2rem;
}
.impressoras-routing-alert strong,
.impressoras-routing-alert span {
display: block;
}
.impressoras-clientes-grid {
display: grid;
gap: 0.75rem;
grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
}
.impressoras-cliente-card {
align-items: center;
background: #ffffff;
border: 1px solid #d9dde6;
border-radius: 8px;
box-shadow: 0 1px 5px rgba(15, 23, 42, 0.08);
cursor: pointer;
display: flex;
flex-direction: column;
gap: 0.5rem;
min-height: 172px;
padding: 0.85rem;
text-align: center;
transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.impressoras-cliente-card:focus,
.impressoras-cliente-card.is-selected {
border-color: var(--cor-unidade, #4e73df);
box-shadow: 0 0 0 2px rgba(78, 115, 223, 0.14);
outline: 0;
}
.impressoras-cliente-card > i {
color: #64748b;
font-size: 1.75rem;
}
.impressoras-cliente-card.is-selected > i {
color: var(--cor-unidade, #4e73df);
}
.impressoras-cliente-card strong {
color: #111827;
font-size: 0.92rem;
line-height: 1.25;
overflow-wrap: anywhere;
}
.impressoras-cliente-badge {
border-radius: 999px;
font-size: .75rem;
font-weight: 800;
padding: 0.16rem 0.48rem;
text-transform: uppercase;
}
.impressoras-cliente-badge.is-online {
background: #dcfce7;
color: #166534;
}
.impressoras-cliente-badge.is-offline {
background: #e2e8f0;
color: #475569;
}
.impressoras-driver-download {
margin-top: 1rem;
}
.impressoras-device-combo {
position: relative;
}
.impressoras-device-combo .form-control {
padding-right: 2.25rem;
}
.impressoras-device-toggle {
align-items: center;
background: transparent;
border: 0;
bottom: 1px;
color: #475569;
display: flex;
justify-content: center;
position: absolute;
right: 1px;
top: 1px;
width: 2rem;
}
.impressoras-device-menu {
background: #ffffff;
border: 1px solid #d9dde6;
border-radius: 8px;
box-shadow: 0 12px 28px rgba(15, 23, 42, 0.12);
display: none;
left: 0;
max-height: 210px;
overflow: auto;
padding: 0.25rem;
position: absolute;
right: 0;
top: calc(100% + 4px);
z-index: 1085;
}
.impressoras-device-menu.show {
display: block;
}
.impressoras-device-option {
background: transparent;
border: 0;
border-radius: 6px;
color: #111827;
display: block;
font-size: 0.84rem;
padding: 0.45rem 0.55rem;
text-align: left;
width: 100%;
}
.impressoras-device-option:hover {
background: #eef2ff;
}
.impressoras-device-option strong,
.impressoras-device-option small {
display: block;
}
.impressoras-device-option small {
color: #64748b;
font-size: .75rem;
margin-top: 0.1rem;
}
.impressoras-device-option.is-empty {
color: #64748b;
cursor: default;
}
@media (max-width: 991.98px) {
.unidades-page {
padding: 1rem;
}
.unidades-page-head {
align-items: flex-start;
flex-direction: column;
}
.unidades-actions {
width: 100%;
justify-content: flex-start;
}
.unidades-metricas {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.clientes-page .unidades-metricas {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.unidades-atendimento-row {
grid-template-columns: 1fr 1fr;
}
.unidade-mapa-layout {
grid-template-columns: 1fr;
}
.unidade-aparencia-layout {
grid-template-columns: 1fr;
}
.unidade-imagens-tab {
grid-template-columns: 1fr;
}
.unidade-certificado-layout {
grid-template-columns: 1fr;
gap: 0.8rem;
}
}
@media (max-width: 767.98px) {
#modalUnidadeCadastro .ss-form-grid > .ss-field {
grid-column: 1 / -1;
}
/* Da mesa nº / Até a mesa nº lado a lado no smartphone (metade das 12 colunas cada). */
#modalUnidadeCadastro .unidade-mesas-form > .ss-field.ss-col-3 {
grid-column: span 6;
}
.unidade-fiscal-service-head {
align-items: stretch;
flex-direction: column;
}
}
@media (max-width: 575.98px) {
.unidade-atendimento-card-campos {
grid-template-columns: minmax(0, 1fr);
}
.unidade-atendimento-card-opcoes.is-empty {
display: none;
}
#modalUnidadeCadastro .modal-body {
padding: 12px;
}
#modalUnidadeCadastro .modal-footer {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 0.55rem;
}
#modalUnidadeCadastro .modal-footer .btn {
width: 100%;
margin: 0;
}
.unidades-tabs {
top: -12px;
margin: -12px -12px 0;
padding: 9px 12px 0;
}
.unidades-tabs .nav-link {
min-height: 42px;
padding-inline: 0.7rem;
}
.unidades-tab-content {
padding-top: 0.75rem;
}
.unidade-tab-intro {
gap: 0.65rem;
margin-bottom: 0.75rem;
padding: 0.75rem;
}
.unidade-tab-intro-icon {
width: 34px;
height: 34px;
flex-basis: 34px;
}
.unidade-config-card,
.unidade-mesas-add {
margin-bottom: 0.75rem;
padding: 0.85rem;
border-radius: 10px;
box-shadow: none;
}
.unidade-config-card-head {
margin-bottom: 0.75rem;
}
#modalUnidadeCadastro .ss-form-grid {
gap: 0.75rem;
}
.unidade-mapa-card {
padding: 0.85rem;
}
.unidade-mapa-actions .btn {
flex: 1 1 100%;
}
.unidade-mapa-canvas {
min-height: 280px;
}
.unidade-logo-preview {
width: 132px;
height: 132px;
margin-top: 0.8rem;
}
.unidade-capa-preview {
height: 135px;
}
.unidade-app-preview {
width: min(276px, 100%);
}
.unidade-add-field,
.unidade-mesas-actions {
width: 100%;
}
.unidade-mesa-item {
align-items: stretch;
flex-direction: column;
}
.unidade-mesa-item > .btn {
align-self: flex-end;
}
.unidade-horarios-add .btn,
.unidade-fiscal-status-action .btn {
width: 100%;
}
.unidade-fiscal-safe-note {
padding: 0.75rem;
}
.unidade-fiscal-card {
border-left-width: 1px;
}
.unidade-fiscal-tabs {
width: 100%;
}
.unidade-fiscal-tabs .nav-item {
flex: 1 1 50%;
}
.unidade-fiscal-tabs .nav-link {
width: 100%;
min-width: 0;
padding-inline: 0.35rem;
}
.unidade-fiscal-tab-content > .tab-pane {
padding: 0.75rem;
}
.unidade-certificado-remocao {
align-items: stretch;
flex-direction: column;
}
.unidade-certificado-remocao .btn {
width: 100%;
}
.unidades-metricas,
.unidades-form-grid {
grid-template-columns: 1fr;
}
.clientes-page .unidades-metricas {
grid-template-columns: 1fr;
}
.unidades-field-wide {
grid-column: span 1;
}
.unidades-lista-toolbar {
align-items: stretch;
flex-direction: column;
}
.unidades-busca {
max-width: none;
width: 100%;
flex: 1 1 auto;
}
.certificado-upload-label {
grid-template-columns: 34px 1fr;
}
.certificado-upload-action {
grid-column: 1 / -1;
width: 100%;
}
}
.gestor-sidebar .sidebar-nav {
scrollbar-width: thin !important;
scrollbar-color: var(--ss-sidebar-bg) var(--ss-sidebar-bg) !important;
}
.gestor-sidebar .sidebar-nav::-webkit-scrollbar {
width: 7px !important;
}
.gestor-sidebar .sidebar-nav::-webkit-scrollbar-track {
background: var(--ss-sidebar-bg) !important;
}
.gestor-sidebar .sidebar-nav::-webkit-scrollbar-thumb {
background: var(--ss-sidebar-bg) !important;
background-color: var(--ss-sidebar-bg) !important;
border: 0 !important;
border-radius: 8px !important;
}
.gestor-sidebar.sidebar-scrollbar-hover .sidebar-nav,
.gestor-sidebar:hover .sidebar-nav,
.gestor-sidebar:focus-within .sidebar-nav,
.gestor-sidebar.show .sidebar-nav,
.gestor-sidebar .sidebar-nav:hover,
.gestor-sidebar .sidebar-nav:focus-within {
scrollbar-color: rgba(255,255,255,0.58) var(--ss-sidebar-bg) !important;
}
.gestor-sidebar.sidebar-scrollbar-hover .sidebar-nav::-webkit-scrollbar-thumb,
.gestor-sidebar:hover .sidebar-nav::-webkit-scrollbar-thumb,
.gestor-sidebar:focus-within .sidebar-nav::-webkit-scrollbar-thumb,
.gestor-sidebar.show .sidebar-nav::-webkit-scrollbar-thumb,
.gestor-sidebar .sidebar-nav:hover::-webkit-scrollbar-thumb,
.gestor-sidebar .sidebar-nav:focus-within::-webkit-scrollbar-thumb,
.gestor-sidebar .sidebar-nav::-webkit-scrollbar-thumb:hover {
background: rgba(255,255,255,0.58) !important;
background-color: rgba(255,255,255,0.58) !important;
border: 0 !important;
}
/* Produtos */
.produtos-content {
overflow: hidden;
}
.produtos-page {
flex: 1;
display: flex;
flex-direction: column;
min-height: 0;
padding: 1.35rem;
color: #111827;
overflow: hidden;
box-sizing: border-box;
}
.produtos-head {
flex: 0 0 auto;
display: grid;
grid-template-columns: minmax(0, 1fr) auto;
align-items: center;
gap: 0.8rem;
margin-bottom: 0.8rem;
}
.produtos-title {
display: inline-flex;
align-items: center;
flex-wrap: wrap;
gap: 0.35rem;
min-width: 0;
color: var(--cor-unidade, #2d3142);
}
.produtos-title h1 {
margin: 0;
font-size: 1.1rem;
font-weight: 800;
letter-spacing: 0;
}
.produtos-actions {
display: inline-flex;
align-items: center;
gap: 0.4rem;
flex-wrap: wrap;
justify-content: flex-end;
}
.produtos-importar-dropdown {
display: inline-flex;
}
.produtos-importar-menu {
min-width: 14rem;
padding: 0.35rem;
}
.produtos-importar-menu .dropdown-item {
display: flex;
align-items: center;
gap: 0.55rem;
min-height: 2.15rem;
padding: 0.45rem 0.6rem;
border-radius: 0.4rem;
font-size: 0.86rem;
}
.produtos-importar-menu .dropdown-item > i {
display: inline-flex;
align-items: center;
justify-content: center;
flex: 0 0 2.25rem;
width: 2.25rem;
color: #334155;
font-size: 1rem;
}
.produtos-importar-ifood-logo {
display: inline-flex;
align-items: center;
justify-content: center;
flex: 0 0 2.25rem;
width: 2.25rem;
height: 1.45rem;
}
.produtos-importar-ifood-logo img {
display: block;
width: 2.25rem;
height: auto;
}
.produtos-modal-ifood-icon {
width: 2rem;
height: auto;
margin-right: 0.25rem;
}
.produtos-importacao-status {
padding: 0.7rem 0.8rem;
border: 1px solid #dbe4ee;
border-radius: 0.65rem;
background: #fff;
color: #475569;
font-size: 0.86rem;
}
.produtos-importacao-status.is-loading {
border-color: #bfdbfe;
background: #eff6ff;
color: #1d4ed8;
}
.produtos-importacao-status.is-success {
border-color: #bbf7d0;
background: #f0fdf4;
color: #166534;
}
.produtos-importacao-status.is-warning {
border-color: #fde68a;
background: #fffbeb;
color: #92400e;
}
.produtos-importacao-status.is-error {
border-color: #fecaca;
background: #fef2f2;
color: #b91c1c;
}
.produtos-importacao-preview .produtos-importacao-produto > span {
display: flex;
flex: 1 1 auto;
flex-direction: column;
min-width: 0;
}
.produtos-importacao-preview .produtos-importacao-produto small {
color: #64748b;
font-size: .75rem;
line-height: 1.35;
white-space: normal;
}
.produtos-importacao-preview .produtos-importacao-produto > b {
flex: 0 0 auto;
color: #0f172a;
font-size: 0.78rem;
}
.produtos-transferencia-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 0.8rem;
}
.produtos-transferencia-grid > section {
display: grid;
gap: 0.65rem;
padding: 0.9rem;
border: 1px solid #e2e8f0;
border-radius: 0.75rem;
background: #fff;
}
.produtos-transferencia-grid h6 {
margin: 0;
color: #1e293b;
font-weight: 800;
}
.produtos-transferencia-resumo-lista {
display: grid;
gap: 0.25rem;
max-height: 12rem;
margin-top: 0.6rem;
overflow: auto;
}
.produtos-transferencia-resumo-lista > span {
display: flex;
justify-content: space-between;
gap: 1rem;
padding-top: 0.3rem;
border-top: 1px solid currentColor;
}
.produtos-arquivo-toolbar {
display: grid;
grid-template-columns: minmax(12rem, 0.75fr) minmax(18rem, 1.5fr) minmax(14rem, 0.9fr);
gap: 0.8rem;
padding: 0.9rem;
border: 1px solid #e2e8f0;
border-radius: 0.75rem;
background: #fff;
}
.produtos-arquivo-campo {
grid-column: auto;
}
.produtos-arquivo-toolbar--arquivo {
grid-template-columns: minmax(18rem, 1.5fr) minmax(14rem, 0.9fr);
}
.produtos-importacao-modal .modal-body {
display: flex;
flex-direction: column;
gap: 0.9rem;
min-height: 360px;
}
.produtos-importacao-unidades {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 0.8rem;
padding: 0.9rem;
border: 1px solid #e2e8f0;
border-radius: 0.75rem;
background: #fff;
}
.produtos-importacao-unidades--cardapio,
.produtos-importacao-unidades--catalogo {
grid-template-columns: repeat(3, minmax(0, 1fr));
}
.produtos-importacao-unidades .ss-field {
min-width: 0;
}
.produtos-importacao-unidades .form-label {
display: block;
margin-bottom: 0.35rem;
color: #1e293b;
font-weight: 800;
}
.produtos-importacao-unidades .form-label small {
color: #64748b;
font-weight: 600;
}
.produtos-importacao-unidade-fixa {
display: flex;
flex-direction: column;
justify-content: center;
min-height: 3.65rem;
padding: 0.55rem 0.7rem;
border: 1px solid #dbe4ef;
border-radius: 0.55rem;
background: #f8fafc;
}
.produtos-importacao-unidade-fixa .form-label {
margin-bottom: 0.15rem;
color: #64748b;
font-size: 0.72rem;
text-transform: uppercase;
}
.produtos-importacao-unidade-fixa strong {
overflow-wrap: anywhere;
color: #0f172a;
font-size: 0.9rem;
}
.produtos-importacao-unidade-fixa > small {
color: #64748b;
font-size: .75rem;
}
.produtos-importacao-toolbar {
display: flex;
align-items: center;
justify-content: space-between;
gap: 0.75rem;
padding: 0.7rem 0.85rem;
border: 1px solid #e2e8f0;
border-radius: 0.75rem;
background: #fff;
}
.produtos-importacao-toolbar[hidden] {
display: none;
}
.produtos-importacao-toolbar > div:first-child {
display: flex;
flex-direction: column;
min-width: 0;
}
.produtos-importacao-toolbar small {
color: #64748b;
}
.produtos-importacao-lista {
display: flex;
flex: 1 1 auto;
flex-direction: column;
gap: 0.65rem;
min-height: 180px;
}
.produtos-importacao-vazio {
display: grid;
flex: 1 1 auto;
min-height: 180px;
place-items: center;
align-content: center;
gap: 0.55rem;
padding: 1.25rem;
border: 1px dashed #cbd5e1;
border-radius: 0.75rem;
background: #fff;
color: #64748b;
text-align: center;
font-weight: 700;
}
.produtos-importacao-vazio i {
color: var(--cor-unidade, #2d3142);
font-size: 1.65rem;
}
.produtos-importacao-grupo {
overflow: visible;
border: 1px solid #dbe4ef;
border-radius: 0.75rem;
background: #fff;
box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}
.produtos-importacao-grupo-cabecalho {
display: grid;
grid-template-columns: minmax(0, 1fr) auto;
align-items: center;
gap: 0.65rem;
min-height: 2.8rem;
padding: 0.7rem 0.85rem;
border-bottom: 1px solid #dbe4ef;
border-radius: 0.75rem 0.75rem 0 0;
background: #f1f5f9;
}
.produtos-importacao-grupo-cabecalho label {
display: inline-flex;
align-items: center;
gap: 0.55rem;
min-width: 0;
margin: 0;
}
.produtos-importacao-grupo-cabecalho strong {
overflow-wrap: anywhere;
line-height: 1.3;
}
.produtos-importacao-grupo-cabecalho > span {
color: #64748b;
font-size: 0.78rem;
font-weight: 700;
white-space: nowrap;
}
.produtos-importacao-produtos {
display: flex;
flex-direction: column;
gap: 0.4rem;
padding: 0.65rem;
}
.produtos-importacao-produto {
display: grid;
grid-template-columns: auto minmax(0, 1fr) auto;
align-items: center;
gap: 0.65rem;
min-width: 0;
margin: 0;
min-height: 2.65rem;
padding: 0.55rem 0.65rem;
border: 1px solid #e2e8f0;
border-radius: 0.55rem;
background: #fff;
color: #334155;
font-size: 0.82rem;
cursor: pointer;
}
.produtos-importacao-produto:hover {
border-color: #cbd5e1;
background: #f8fafc;
}
.produtos-importacao-produto span {
min-width: 0;
overflow-wrap: anywhere;
white-space: normal;
}
.produtos-importacao-produto .form-check-input,
.produtos-importacao-categoria-check {
flex: 0 0 auto;
margin: 0.12rem 0 0;
}
.produtos-importacao-sem-itens {
grid-column: 1 / -1;
color: #64748b;
font-size: 0.82rem;
}
@media (max-width: 767.98px) {
.produtos-importacao-modal .modal-body {
min-height: 0;
padding: 0.75rem;
}
.produtos-importacao-unidades,
.produtos-importacao-unidades--cardapio,
.produtos-importacao-unidades--catalogo {
grid-template-columns: minmax(0, 1fr);
padding: 0.75rem;
}
.produtos-importacao-toolbar {
align-items: stretch;
flex-direction: column;
}
.produtos-importacao-toolbar .btn-group {
align-self: stretch;
}
.produtos-importacao-toolbar .btn-group .btn {
flex: 1 1 50%;
}
.produtos-importacao-produtos {
padding: 0.5rem;
}
.produtos-importacao-produto {
grid-template-columns: auto minmax(0, 1fr) auto;
min-height: 2.8rem;
padding: 0.55rem;
}
}
.produtos-busca {
position: relative;
flex: 1 1 320px;
max-width: 520px;
}
.produtos-busca i {
position: absolute;
left: 0.65rem;
top: 50%;
transform: translateY(-50%);
color: #64748b;
pointer-events: none;
}
.produtos-busca .form-control {
padding-left: 2rem;
}
.produtos-toolbar-filtros {
display: flex;
align-items: center;
gap: 0.65rem;
flex: 1 1 auto;
min-width: 0;
}
.produtos-toolbar-filtros .produtos-busca {
flex: 1 1 320px;
}
.produtos-cardapio-filtro {
display: flex;
align-items: center;
gap: 0.45rem;
flex: 0 1 340px;
min-width: 220px;
margin: 0;
color: #475569;
font-size: 0.82rem;
font-weight: 800;
}
.produtos-cardapio-filtro span {
white-space: nowrap;
}
.produtos-cardapio-filtro .form-select {
min-width: 0;
}
.produtos-tabs {
flex: 0 0 auto;
display: flex;
align-items: center;
gap: 1rem;
overflow-x: auto;
margin-bottom: 0.75rem;
border-bottom: 1px solid #dfe5ee;
}
.produtos-tab {
appearance: none;
border: 0;
background: transparent;
color: var(--cor-unidade, #2d3142);
font-size: 0.9rem;
font-weight: 800;
padding: 0.75rem 0 0.65rem;
white-space: nowrap;
}
.produtos-tab.is-active {
color: #111827;
box-shadow: inset 0 -2px 0 #111827;
}
.produtos-tab:disabled {
color: #6b7280;
opacity: 0.65;
cursor: not-allowed;
}
.produtos-summary {
flex: 0 0 auto;
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 0.75rem;
margin-bottom: 0.75rem;
}
.produtos-summary > div {
min-height: 64px;
border: 1px solid #e5e7eb;
border-radius: 8px;
background: #fff;
padding: 0.75rem 0.9rem;
}
.produtos-summary span {
display: block;
font-size: .75rem;
font-weight: 800;
color: #64748b;
text-transform: uppercase;
letter-spacing: 0.04em;
}
.produtos-summary strong {
display: block;
margin-top: 0.12rem;
font-size: 1.35rem;
line-height: 1;
}
.produtos-panel {
flex: 1 1 auto;
display: flex;
flex-direction: column;
min-height: 0;
border: 1px solid #dfe5ee;
border-radius: 8px;
box-shadow: 0 10px 28px rgba(15,23,42,0.07);
overflow: hidden;
}
.produtos-panel-toolbar {
flex: 0 0 auto;
display: flex;
align-items: center;
justify-content: space-between;
gap: 0.75rem;
padding: 0.7rem 0.85rem;
border-bottom: 1px solid #dfe5ee;
background: #f8fafc;
}
.produtos-toolbar-actions {
display: inline-flex;
align-items: center;
justify-content: flex-end;
gap: 0.45rem;
flex: 0 0 auto;
flex-wrap: wrap;
}
.massa-filtro-url {
align-items: center;
background: #eef3ff;
border: 1px solid #d9e4ff;
border-radius: 999px;
color: #38569a;
display: inline-flex;
flex: 0 0 auto;
font-size: 0.7rem;
font-weight: 700;
gap: 6px;
padding: 4px 6px 4px 10px;
}
.massa-filtro-url button {
align-items: center;
background: none;
border: 0;
border-radius: 999px;
color: #38569a;
display: inline-flex;
height: 18px;
justify-content: center;
padding: 0;
width: 18px;
}
.massa-filtro-url button:hover { background: #d9e4ff; }
.massa-toolbar {
justify-content: flex-start;
flex-wrap: nowrap;
gap: .38rem;
padding-block: .42rem;
overflow-x: auto;
}
.massa-toolbar .produtos-busca {
flex: 1 1 260px;
max-width: 320px;
}
.massa-filtros-rapidos {
display: inline-flex;
align-items: center;
flex: 0 1 auto;
flex-wrap: wrap;
gap: 0.42rem;
}
.massa-filtro-grupo {
display: inline-flex;
align-items: center;
gap: 0.25rem;
color: #475569;
font-size: 0.68rem;
font-weight: 700;
white-space: nowrap;
}
.massa-filtro-grupo .form-select {
min-width: 92px;
width: auto;
min-height: 27px;
height: 27px;
padding-block: .1rem;
font-size: .72rem;
}
.massa-filtro-categoria .form-select { width: 150px; max-width: 150px; }
.massa-filtro-impressora .form-select { min-width: 150px; }
.massa-toolbar .produtos-busca,
.massa-toolbar .produtos-busca .form-control { min-height: 27px; height: 27px; }
.massa-toolbar .produtos-busca .form-control { font-size: .72rem; }
.massa-toolbar #btnMassaRecarregar { min-height: 27px; height: 27px; padding-block: .1rem; font-size: .72rem; }
.massa-toolbar .produtos-toolbar-actions { margin-left: auto; }
.massa-toolbar .produtos-toolbar-actions > .text-muted { display: none !important; }
@media (max-width: 900px) {
.massa-toolbar {
flex-wrap: nowrap;
gap: 0.4rem;
overflow-x: auto;
scrollbar-width: thin;
}
.massa-toolbar .produtos-busca {
flex: 0 1 190px;
min-width: 145px;
max-width: 190px;
}
.massa-filtros-rapidos {
flex: 0 0 auto;
flex-wrap: nowrap;
gap: 0.3rem;
}
.massa-filtro-grupo > span { display: none; }
.massa-filtro-grupo .form-select { min-width: 78px; width: 78px; padding-left: 0.45rem; padding-right: 1.5rem; }
.massa-filtro-impressora .form-select { min-width: 118px; width: 118px; }
.massa-toolbar .produtos-toolbar-actions { flex-wrap: nowrap; margin-left: 0; }
.massa-toolbar #btnMassaRecarregar { white-space: nowrap; }
}
@media (min-width: 901px) and (max-width: 1200px) {
.massa-toolbar {
flex-wrap: nowrap;
gap: 0.45rem;
overflow-x: auto;
}
.massa-toolbar .produtos-busca { flex: 1 1 220px; min-width: 180px; max-width: 320px; }
.massa-filtros-rapidos { flex-wrap: nowrap; gap: 0.4rem; }
.massa-filtro-grupo > span { display: none; }
.massa-filtro-grupo .form-select { min-width: 92px; width: 92px; }
.massa-filtro-impressora .form-select { min-width: 145px; width: 145px; }
.massa-toolbar .produtos-toolbar-actions { flex-wrap: nowrap; margin-left: auto; }
}
.produtos-table-wrap {
flex: 1 1 auto;
display: flex;
min-height: 0;
overflow: hidden;
box-sizing: border-box;
padding: 0.75rem 0.85rem 0.85rem;
}
.produtos-categorias-grid.ag-theme-quartz.ssapps-ag-grid-normal {
--ss-grid-height: 100%;
flex: 1 1 auto;
height: 100%;
}
.produtos-table-wrap > .produtos-categorias-grid.ag-theme-quartz.ssapps-ag-grid-normal {
height: auto;
}
.massa-page .massa-panel,
.massa-table-wrap {
min-height: 320px;
}
.massa-operacional-table {
flex: 1 1 auto;
height: 100%;
min-height: 320px;
max-height: 100%;
}
.massa-operacional-table .ss-table-cell.is-center .ss-table-cell-content {
display: flex;
justify-content: center;
}
.massa-table-select {
width: 100%;
min-width: 0;
}
.massa-table-switch {
display: flex;
justify-content: center;
}
.massa-produto {
display: flex;
align-items: center;
gap: .55rem;
min-width: 0;
}
.massa-produto-thumb.ssapps-image-thumbnail {
display: grid;
width: 36px;
height: 36px;
flex: 0 0 36px;
place-items: center;
padding: 0;
overflow: hidden;
border: 1px solid #e2e8f0;
border-radius: 7px;
background: #f8fafc;
color: #94a3b8;
cursor: zoom-in;
}
.massa-produto-thumb.ssapps-image-thumbnail img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
}
.massa-produto-thumb.ssapps-image-thumbnail:hover,
.massa-produto-thumb.ssapps-image-thumbnail:focus-visible {
border-color: #60a5fa;
outline: 2px solid rgba(59, 130, 246, .2);
outline-offset: 1px;
}
.massa-produto-body {
display: flex;
min-width: 0;
flex-direction: column;
}
.massa-produto-body strong,
.massa-produto-body small {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.massa-produto-grupo { margin: 0 !important; padding-block: .12rem; }
.massa-product-actions { display: grid; }
.massa-produto-linha { display: flex; min-width: 0; align-items: center; gap: .35rem; }
.massa-produto-expandir { display: grid; width: 22px; height: 28px; flex: 0 0 22px; place-items: center; padding: 0; border: 0; background: transparent; color: #536b78; font-size: .65rem; }
.massa-produto-expandir:hover { color: #1d4ed8; }
.massa-produto-expandir.is-empty { pointer-events: none; }
.massa-complemento-produto { padding-left: 1.35rem; }
.massa-sem-complementos { padding-left: 1.35rem; color: #94a3b8; font-size: .75rem; font-style: italic; }
.massa-complemento-grupo-chip { display: inline-flex; align-items: center; min-height: 25px; padding: .15rem .5rem; border: 1px solid #d9e3f1; border-radius: 999px; background: #f3f6fb; color: #52698e; font-size: .7rem; font-weight: 700; }
.massa-complemento-preco { color: #273142; font-size: .76rem; white-space: nowrap; }
.massa-produto-body strong {
color: #111827;
font-size: .78rem;
}
.massa-produto-body small {
color: #64748b;
font-size: .75rem;
}
.massa-category-bulk {
display: flex;
align-items: end;
gap: .35rem;
}
.massa-category-bulk-field {
display: grid;
width: 135px;
min-width: 0;
margin: 0;
}
.massa-category-bulk-field .form-select {
min-height: 27px;
padding-block: .1rem;
border-color: #d7deea !important;
border-bottom-color: #aeb8c8 !important;
background-color: #eef2ff !important;
color: #273142 !important;
font-size: .61rem;
font-weight: 700;
}
.massa-category-bulk-field .form-select:disabled {
border-color: #d8deeb !important;
border-bottom-color: #aeb9cc !important;
background-color: #e9edf5 !important;
color: #64748b !important;
}
.massa-operacional-table :is([data-massa-campo], [data-massa-lote-campo]):focus {
border-color: #2563eb !important;
border-bottom-color: #2563eb !important;
box-shadow: none !important;
}
.massa-operacional-table :is([data-massa-campo], [data-massa-lote-campo]).massa-ultimo-alterado:not(:focus) {
border-color: #16a34a !important;
border-bottom-color: #16a34a !important;
box-shadow: none !important;
}
@media (min-width: 769px) {
.massa-operacional-table .ss-table-row:has(.massa-complemento-produto) > .ss-table-cell:first-child {
padding-left: 4.1rem;
}
.massa-operacional-table .ss-table-row:has(.massa-complemento-produto) > .ss-table-cell:first-child::before {
left: 2.55rem;
width: 1rem;
}
.massa-operacional-table .ss-table-row:has(.massa-complemento-produto):not(:last-child) > .ss-table-cell:first-child::after {
left: 2.55rem;
}
.massa-operacional-table .ss-table-row:has(.massa-complemento-produto) {
background: #fbfcff !important;
}
.massa-operacional-table .ss-table-row:has(.massa-complemento-produto) .massa-complemento-produto {
padding-left: 0;
}
.massa-operacional-table .ss-table-group-node--depth-1 > .ss-table-group {
display: grid;
grid-template-columns: var(--ss-table-template);
}
.massa-operacional-table .ss-table-group-node--depth-1 > .ss-table-group > .ss-table-group-toggle {
width: auto;
grid-column: 1 / 5;
}
.massa-operacional-table .ss-table-group-node--depth-1 > .ss-table-group > .ss-table-group-actions,
.massa-operacional-table .ss-table-group-node--depth-1 > .ss-table-group > .ss-table-group-actions > .massa-category-bulk {
display: contents;
}
.massa-operacional-table .massa-category-bulk-field {
box-sizing: border-box;
width: auto;
padding: .25rem .55rem;
}
.massa-operacional-table .ss-table-group-node--depth-1 > .ss-table-group,
.massa-operacional-table .ss-table-group-node--depth-1 > .ss-table-group-toggle {
min-height: 32px;
}
.massa-operacional-table .ss-table-group-node--depth-1 .massa-category-bulk-field {
padding-block: .15rem;
}
.massa-operacional-table .ss-table-group-node--depth-1 .massa-category-bulk-field .form-select {
min-height: 25px;
height: 25px;
}
.massa-operacional-table .ss-table-group-node--depth-2 > .ss-table-group {
display: grid;
grid-template-columns: var(--ss-table-template);
min-height: 48px;
background: #fff;
}
.massa-operacional-table .ss-table-group-node--depth-2 > .ss-table-group > .ss-table-group-toggle {
width: auto;
grid-column: 1;
justify-content: flex-start;
padding-block: .3rem;
}
.massa-operacional-table .ss-table-group-node--depth-2 > .ss-table-group > .ss-table-group-actions {
display: block;
width: auto;
align-self: stretch;
grid-column: 2 / -1;
padding: 0;
}
.massa-operacional-table .ss-table-group-node--depth-2 .massa-product-actions {
height: 100%;
grid-template-columns: repeat(3, 76px) 140px 160px 180px 180px 180px;
}
.massa-operacional-table .massa-product-actions > :is(label, select) {
box-sizing: border-box;
align-self: stretch;
margin: 0 !important;
padding: .45rem .55rem;
border-left: 1px solid #e2e8f0;
}
.massa-operacional-table .massa-product-actions > label {
align-items: center;
}
.massa-operacional-table .massa-product-actions > select {
width: calc(100% - .9rem);
align-self: center;
height: 31px;
margin-inline: .45rem !important;
padding: .2rem 1.65rem .2rem .45rem;
}
.massa-operacional-table .ss-table-group-node--depth-2 > .ss-table-group .ss-table-group-count {
margin-left: .35rem;
}
.massa-operacional-table .ss-table-group-node--depth-2 > .ss-table-group-children .ss-table-row {
background: #f9fbfe;
}
}
@media (max-width: 768px) {
.massa-page,
.massa-page .massa-panel,
.massa-table-wrap,
.massa-operacional-table {
min-height: 0;
}
.massa-table-wrap {
padding: .55rem;
overflow: visible;
}
.massa-category-bulk {
display: grid;
width: 100%;
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.massa-category-bulk-field {
width: auto;
}
}
.analise-precos-toolbar {
justify-content: flex-start;
flex-wrap: wrap;
}
.analise-precos-toolbar .produtos-busca {
min-width: 240px;
}
.analise-precos-toolbar .produtos-filtro-select {
flex: 0 1 220px;
min-width: 170px;
}
.analise-precos-toolbar .produtos-toolbar-actions {
margin-left: auto;
}
.analise-precos-visoes {
display: inline-flex;
align-items: center;
gap: 0.25rem;
margin: 0.55rem 0.85rem 0;
padding: 0.25rem;
border: 1px solid #dbe3ee;
border-radius: 8px;
background: #eef2f7;
}
.analise-precos-visao {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 0.35rem;
min-height: 30px;
padding: 0.3rem 0.65rem;
border: 0;
border-radius: 6px;
background: transparent;
color: #64748b;
font-size: 0.72rem;
font-weight: 800;
}
.analise-precos-visao:hover {
color: #1e40af;
}
.analise-precos-visao.is-active {
background: #fff;
color: #1d4ed8;
box-shadow: 0 1px 3px rgba(15, 23, 42, 0.14);
}
.analise-precos-resumos {
display: grid;
grid-template-columns: minmax(0, 1fr);
align-items: stretch;
gap: 0.6rem;
margin: 0.65rem 0.85rem 0;
}
.analise-precos-resumos > [hidden] {
display: none !important;
}
.analise-precos-resumos > .analise-precos-margens,
.analise-precos-resumos > .analise-precos-ifood-resumo {
min-width: 0;
height: 100%;
margin: 0;
padding: 0.65rem 0.7rem;
}
.analise-precos-margens {
flex: 0 0 auto;
margin: 0.75rem 0.85rem 0;
padding: 0.8rem;
border: 1px solid #fecaca;
border-radius: 8px;
background: #fff7f7;
}
.analise-precos-margens-head {
display: flex;
align-items: flex-start;
justify-content: space-between;
gap: 0.6rem;
}
.analise-precos-margens-head h6 {
margin: 0;
color: #991b1b;
font-size: 0.82rem;
font-weight: 800;
}
.analise-precos-margens-head p {
max-width: 620px;
margin: 0.2rem 0 0;
color: #64748b;
font-size: 0.69rem;
line-height: 1.3;
}
.analise-precos-margens-stats {
display: flex;
align-items: flex-end;
justify-content: flex-end;
flex-wrap: wrap;
gap: 0.3rem;
}
.analise-precos-margem-campo {
display: flex;
align-items: center;
gap: 0.4rem;
margin: 0;
color: #475569;
font-size: .69rem;
font-weight: 800;
}
.analise-precos-margem-campo input {
width: 74px;
min-height: 28px;
padding-top: 0.2rem;
padding-bottom: 0.2rem;
}
.analise-precos-filtro-reajuste {
display: inline-flex;
align-items: center;
gap: .38rem;
min-height: 28px;
margin: 0;
padding: .2rem .45rem .2rem .38rem;
border: 1px solid #cbd5e1;
border-radius: 7px;
background: #fff;
color: #334155;
font-size: .68rem;
font-weight: 800;
white-space: nowrap;
}
.analise-precos-filtro-reajuste:has(.form-check-input:checked) {
border-color: #93c5fd;
background: #eff6ff;
color: #1d4ed8;
}
.analise-precos-filtro-reajuste .form-check-input {
float: none;
flex: 0 0 auto;
margin: 0;
}
.analise-precos-margem-badge {
display: inline-flex;
align-items: center;
min-height: 28px;
padding: 0.25rem 0.45rem;
border: 1px solid #cbd5e1;
border-radius: 7px;
background: #fff;
color: #334155;
font-size: .68rem;
font-weight: 800;
white-space: nowrap;
}
.analise-precos-margem-badge.is-danger {
border-color: #fecaca;
background: #fee2e2;
color: #991b1b;
}
.analise-precos-margem-badge.is-warning {
border-color: #fde68a;
background: #fef3c7;
color: #92400e;
}
.analise-precos-margens-list {
display: grid;
grid-template-columns: repeat(6, minmax(120px, 1fr));
gap: 0.3rem;
margin-top: 0.45rem;
}
.analise-precos-margem-item {
display: flex;
align-items: center;
justify-content: space-between;
gap: 0.35rem;
min-width: 0;
padding: 0.3rem 0.45rem;
border: 1px solid #fecaca;
border-radius: 7px;
background: #fff;
color: #7f1d1d;
font-size: .68rem;
}
.analise-precos-margem-item strong {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.analise-precos-margem-item span {
flex: 0 0 auto;
font-weight: 800;
}
.analise-precos-margem-vazio {
grid-column: 1 / -1;
color: #64748b;
font-size: 0.76rem;
}
.analise-precos-ifood-resumo {
flex: 0 0 auto;
margin: 0.65rem 0.85rem 0;
padding: 0.8rem;
border: 1px solid #bfdbfe;
border-radius: 8px;
background: #f8fbff;
}
.analise-precos-ifood-resumo.is-warning {
border-color: #fde68a;
background: #fffbeb;
}
.analise-precos-ifood-resumo-head {
display: flex;
align-items: flex-start;
justify-content: space-between;
gap: 0.6rem;
}
.analise-precos-ifood-acoes {
display: flex;
align-items: center;
justify-content: flex-end;
flex-wrap: wrap;
gap: .4rem;
}
.analise-precos-ifood-kicker {
display: inline-flex;
align-items: center;
gap: .35rem;
color: #2563eb;
font-size: .65rem;
font-weight: 900;
letter-spacing: .04em;
text-transform: uppercase;
}
.analise-precos-ifood-resumo h6 {
margin: .15rem 0 0;
color: #0f172a;
font-size: .8rem;
font-weight: 850;
}
.analise-precos-ifood-resumo p {
max-width: 820px;
margin: .2rem 0 0;
color: #64748b;
font-size: .69rem;
line-height: 1.3;
}
.analise-precos-ifood-stats {
display: grid;
gap: .38rem;
margin-top: .45rem;
}
.analise-precos-ifood-chips {
display: flex;
flex-wrap: wrap;
gap: .3rem;
}
.analise-precos-ifood-kpis {
display: grid;
grid-template-columns: repeat(3, minmax(175px, 1fr));
gap: .35rem;
overflow-x: auto;
padding-bottom: 1px;
}
.analise-precos-ifood-kpis:empty {
display: none;
}
.analise-precos-ifood-stats span {
display: inline-flex;
align-items: center;
gap: .3rem;
min-height: 28px;
padding: .22rem .42rem;
border: 1px solid #cbd5e1;
border-radius: 7px;
background: #fff;
color: #475569;
font-size: .68rem;
font-weight: 750;
}
.analise-precos-ifood-stats .is-danger {
border-color: #fecaca;
color: #b91c1c;
}
.analise-precos-ifood-stats .is-success {
border-color: #bbf7d0;
color: #15803d;
}
.analise-precos-ifood-stats .is-info {
border-color: #bfdbfe;
color: #1d4ed8;
}
.analise-precos-ifood-stats .is-warning {
border-color: #fde68a;
color: #a16207;
}
.analise-precos-ifood-impacto {
display: grid !important;
align-content: center;
gap: .08rem !important;
min-width: 175px;
min-height: 45px !important;
white-space: nowrap;
}
.analise-precos-ifood-impacto small,
.analise-precos-ifood-impacto em {
display: block;
font-size: .57rem;
font-style: normal;
font-weight: 650;
line-height: 1.15;
}
.analise-precos-ifood-impacto small {
color: #64748b;
}
.analise-precos-ifood-impacto strong {
font-size: .82rem;
line-height: 1.1;
}
.analise-precos-ifood-impacto em {
color: #94a3b8;
}
.analise-precos-ifood-impacto.is-loading strong {
animation: analise-precos-pulse 1.15s ease-in-out infinite;
}
@keyframes analise-precos-pulse {
50% { opacity: .35; }
}
.analise-precos-table-wrap {
display: flex;
min-height: 300px;
}
.analise-precos-table {
flex: 1 1 auto;
height: 100%;
min-height: 300px;
max-height: 100%;
}
.analise-precos-table .ss-table-cell.is-number .ss-table-cell-content {
display: flex;
justify-content: flex-end;
text-align: right;
}
.analise-precos-table .ss-table-cell.is-center .ss-table-cell-content {
display: flex;
justify-content: center;
}
.analise-precos-table .ss-grid-input {
width: 100%;
min-width: 0;
}
.analise-precos-produto {
display: flex;
align-items: center;
gap: 0.55rem;
min-width: 0;
}
.analise-precos-produto-thumb.ssapps-image-thumbnail {
display: grid;
width: 36px;
height: 36px;
flex: 0 0 36px;
place-items: center;
padding: 0;
overflow: hidden;
border: 1px solid #e2e8f0;
border-radius: 7px;
background: #f8fafc;
color: #94a3b8;
cursor: zoom-in;
}
.analise-precos-produto-thumb.ssapps-image-thumbnail img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
}
.analise-precos-produto-thumb.ssapps-image-thumbnail:hover,
.analise-precos-produto-thumb.ssapps-image-thumbnail:focus-visible {
border-color: #60a5fa;
outline: 2px solid rgba(59, 130, 246, 0.2);
outline-offset: 1px;
}
.analise-precos-produto-body {
display: flex;
flex-direction: column;
min-width: 0;
}
.analise-precos-produto-body strong,
.analise-precos-produto-body small {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.analise-precos-produto-body strong {
color: #111827;
font-size: 0.78rem;
}
.analise-precos-produto-body small {
color: #64748b;
font-size: .75rem;
}
.analise-precos-valor {
width: 100%;
text-align: right;
font-variant-numeric: tabular-nums;
}
.analise-precos-valor.is-muted {
color: #94a3b8;
}
.analise-precos-valor.is-danger {
color: #b91c1c;
font-weight: 700;
}
.analise-precos-valor.is-success {
color: #15803d;
font-weight: 700;
}
.analise-precos-ifood-diferenca {
display: inline-flex;
justify-content: flex-end;
white-space: nowrap;
}
.analise-precos-margem-status {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 58px;
padding: 0.24rem 0.42rem;
border-radius: 999px;
font-size: .75rem;
font-weight: 800;
}
.analise-precos-margem-status.is-success {
background: #dcfce7;
color: #166534;
}
.analise-precos-margem-status.is-warning {
background: #fef3c7;
color: #92400e;
}
.analise-precos-margem-status.is-danger {
background: #fee2e2;
color: #991b1b;
}
.analise-precos-margem-status.is-muted {
background: #f1f5f9;
color: #64748b;
}
@media (max-width: 1199.98px) {
.analise-precos-margens-head {
flex-direction: column;
}
.analise-precos-margens-stats {
justify-content: flex-start;
}
.analise-precos-margens-list {
grid-template-columns: repeat(3, minmax(130px, 1fr));
}
}
@media (max-width: 767.98px) {
.analise-precos-ifood-resumo-head {
flex-direction: column;
}
.analise-precos-ifood-acoes {
justify-content: flex-start;
width: 100%;
}
.analise-precos-toolbar .produtos-busca,
.analise-precos-toolbar .produtos-filtro-select {
flex: 1 1 100%;
max-width: none;
width: 100%;
}
.analise-precos-toolbar .produtos-toolbar-actions {
width: 100%;
margin-left: 0;
}
.analise-precos-visoes {
display: flex;
}
.analise-precos-visao {
flex: 1 1 0;
}
.analise-precos-margens-list {
grid-template-columns: 1fr;
}
}
.produtos-categorias-grid .ag-row.produtos-cardapio-row .ag-cell {
background: #fff !important;
font-weight: 800;
}
.produtos-categorias-grid .ag-row.produtos-cardapio-row {
background: #fff !important;
}
.produtos-cardapio-title,
.produtos-categoria-name {
display: inline-flex;
align-items: center;
gap: 0.45rem;
min-width: 0;
}
.produtos-cardapio-title i {
font-size: 0.84rem;
}
.produtos-categoria-name {
font-weight: 600;
}
.produtos-categoria-drag {
display: inline-flex;
align-items: center;
justify-content: center;
flex: 0 0 18px;
width: 18px;
height: 24px;
margin-right: 0.1rem;
color: #64748b;
cursor: grab;
user-select: none;
}
.produtos-categoria-drag:active {
cursor: grabbing;
}
.produtos-categoria-drag i {
font-size: 1rem;
line-height: 1;
}
.produtos-categoria-vazia {
color: #64748b;
font-style: italic;
font-weight: 500;
}
.produtos-categorias-grid .ag-row.produtos-categoria-placeholder .ag-cell {
background: #f8fafc;
}
.produtos-categorias-grid .ag-details-row {
padding: 8px 14px 10px 48px;
background: #f5f7fb;
}
.produtos-categorias-grid .ag-details-grid {
overflow: visible;
height: auto !important;
border: 1px solid #aeb9c9;
border-radius: 6px;
background: #fff;
box-shadow: 0 3px 10px rgba(15, 23, 42, 0.12);
}
.produtos-categorias-grid .ag-details-grid .ag-header-cell-text {
font-size: .75rem;
font-weight: 800;
}
.produtos-detail-name {
display: flex;
align-items: center;
gap: 0.5rem;
width: 100%;
min-width: 0;
height: 100%;
}
.produtos-detail-drag {
margin-right: -0.15rem;
}
.produtos-detail-image {
flex: 0 0 34px;
width: 34px;
height: 34px;
border: 1px solid #d7deea;
border-radius: 5px;
object-fit: cover;
background: #f8fafc;
}
.produtos-detail-image-action {
display: inline-grid;
flex: 0 0 36px;
width: 36px;
height: 36px;
place-items: center;
padding: 0;
border: 0;
border-radius: 6px;
background: transparent;
}
button.produtos-detail-image-action {
cursor: pointer;
}
button.produtos-detail-image-action:hover .produtos-detail-image {
border-color: var(--ss-primary, #4f46e5);
box-shadow: 0 0 0 2px color-mix(in srgb, var(--ss-primary, #4f46e5) 18%, transparent);
}
.produtos-detail-name-body {
display: flex;
flex-direction: column;
justify-content: center;
min-width: 0;
line-height: 1.15;
}
.produtos-detail-name-body strong,
.produtos-detail-name-body small {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.produtos-detail-name-body strong {
font-size: 0.82rem;
font-weight: 700;
}
.produtos-detail-name-body small {
margin-top: 0.16rem;
color: #64748b;
font-size: .75rem;
}
.produtos-detail-dias {
color: #475569;
font-size: 0.75rem;
white-space: nowrap;
}
.produtos-detail-pdv {
width: 100%;
height: 28px;
border: 1px solid #cbd5e1;
border-radius: 5px;
padding: 0 0.45rem;
background: #fff;
color: #111827;
font-size: 0.78rem;
}
.produtos-detail-pdv:focus {
border-color: var(--cor-unidade, #4b00c8);
outline: 2px solid color-mix(in srgb, var(--cor-unidade, #4b00c8) 16%, transparent);
}
.produtos-detail-pdv:disabled {
background: #f1f5f9;
color: #64748b;
}
.produtos-detail-switch {
margin: 0;
}
.produto-cadastro-modal .modal-dialog {
max-width: min(1000px, calc(100vw - 32px));
}
.produto-cadastro-modal .modal-content {
height: min(840px, calc(100dvh - 32px));
}
.produto-cadastro-modal .modal-body {
min-height: 0;
padding: 0;
overflow: hidden;
}
.produtos-cadastro-tabs {
flex: 0 0 auto;
padding: 0 1rem;
overflow-x: auto;
flex-wrap: nowrap;
background: #fff;
border-bottom: 1px solid #d7deea;
}
.produtos-cadastro-tabs .nav-link {
white-space: nowrap;
border-radius: 0;
font-size: 0.78rem;
font-weight: 700;
color: #4f46e5;
border: 0;
border-bottom: 2px solid transparent;
min-height: 42px;
}
.produtos-cadastro-tabs .nav-link.active {
color: #050816;
border-bottom-color: #050816;
background: transparent;
}
.produtos-cadastro-content {
height: calc(100% - 42px);
min-height: 0;
background: #fff;
}
.produtos-cadastro-content > .tab-pane {
height: 100%;
padding: 1rem;
overflow: auto;
}
.produtos-cadastro-grid {
display: grid;
grid-template-columns: repeat(12, minmax(0, 1fr));
gap: 0.55rem 0.7rem;
align-items: end;
}
.produto-cad-id {
grid-column: 1 / span 2;
grid-row: 1;
}
.produto-cad-nome {
grid-column: 3 / span 4;
grid-row: 1;
}
.produto-cad-serve {
grid-column: 7 / span 3;
grid-row: 1;
}
.produto-cad-preparo {
grid-column: 10 / span 3;
grid-row: 1;
}
.produto-cad-descricao {
grid-column: 1 / -1;
grid-row: 2;
}
.produto-cad-categoria {
grid-column: 1 / span 3;
grid-row: 3;
}
.produto-cad-tipo {
grid-column: 4 / span 2;
grid-row: 3;
}
.produto-cad-unidade {
grid-column: 6 / span 2;
grid-row: 3;
}
.produto-cad-ref {
grid-column: 8 / span 2;
grid-row: 3;
}
.produto-cad-codigo {
grid-column: 10 / span 3;
grid-row: 3;
}
.produto-cad-estoque {
grid-column: 1 / span 2;
grid-row: 4;
}
.produto-cad-estoque-min {
grid-column: 1 / span 2;
grid-row: 4;
}
.produto-cad-estoque-max {
grid-column: 3 / span 2;
grid-row: 4;
}
.produto-cad-custo {
grid-column: 5 / span 2;
grid-row: 4;
}
.produto-cad-ean {
grid-column: 7 / span 6;
grid-row: 4;
}
.produto-cad-estoque:not([hidden]) ~ .produto-cad-estoque-min {
grid-column: 3 / span 2;
}
.produto-cad-estoque:not([hidden]) ~ .produto-cad-estoque-max {
grid-column: 5 / span 2;
}
.produto-cad-estoque:not([hidden]) ~ .produto-cad-custo {
grid-column: 7 / span 2;
}
.produto-cad-estoque:not([hidden]) ~ .produto-cad-ean {
grid-column: 9 / span 4;
}
.produto-cad-action-btn {
display: inline-flex;
align-items: center;
justify-content: center;
flex: 0 0 34px;
width: 34px;
padding: 0;
}
.produtos-cadastro-switches {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 0.65rem 1.25rem;
margin-top: 0.9rem;
padding: 0.7rem 0;
border-top: 1px solid #e2e8f0;
border-bottom: 1px solid #e2e8f0;
}
.produtos-cadastro-switch {
margin: 0;
}
.produtos-precos-table input {
min-width: 86px;
}
.produto-programacao-table th:nth-child(5),
.produto-programacao-table td:nth-child(5) {
width: 132px;
}
.produto-programacao-preco {
width: 120px;
max-width: 120px;
}
.produtos-imagens-layout {
display: grid;
grid-template-columns: 300px minmax(0, 1fr);
gap: 1rem;
align-items: stretch;
}
.produto-foto-card {
min-width: 0;
border: 1px solid #dbe3ef;
border-radius: 8px;
background: #fff;
padding: 1rem;
}
.produto-foto-card-head {
display: flex;
align-items: flex-start;
justify-content: space-between;
gap: 0.75rem;
margin-bottom: 0.9rem;
}
.produto-foto-card-head h6 {
margin: 0 0 0.15rem;
color: #111827;
font-size: 0.95rem;
font-weight: 800;
}
.produto-foto-card-head span {
color: #64748b;
font-size: 0.75rem;
}
.produtos-icon-btn.produtos-muted {
background: #eef2f7;
color: #64748b;
}
.produtos-icon-btn.produtos-muted:hover,
.produtos-icon-btn.produtos-muted:focus {
color: #111827;
}
.produto-imagem-destaque {
position: relative;
display: flex;
align-items: center;
justify-content: center;
width: 190px;
aspect-ratio: 1;
margin: 0 auto;
overflow: hidden;
border: 1px dashed #a8b3c7;
border-radius: 50%;
padding: 0;
background: #f8fafc;
color: #4b5563;
box-shadow: 0 10px 24px rgba(15, 23, 42, 0.09);
}
.produto-imagem-destaque img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
}
.produto-imagem-destaque.is-empty img {
display: none;
}
.produto-imagem-empty {
display: none;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 0.4rem;
text-align: center;
font-size: 0.78rem;
}
.produto-imagem-empty i {
font-size: 2rem;
}
.produto-imagem-destaque.is-empty .produto-imagem-empty {
display: flex;
}
.produto-imagem-overlay {
position: absolute;
inset: 0;
display: flex;
align-items: center;
justify-content: center;
gap: 0.45rem;
background: rgba(15, 23, 42, 0.58);
color: #fff;
opacity: 0;
transition: opacity 0.15s ease;
font-size: 0.78rem;
}
.produto-imagem-destaque:hover .produto-imagem-overlay,
.produto-imagem-destaque:focus .produto-imagem-overlay {
opacity: 1;
}
.produto-imagem-destaque.is-empty .produto-imagem-overlay {
display: none;
}
.produto-galeria-actions {
display: flex;
align-items: center;
gap: 0.55rem;
}
.produto-galeria-contador {
display: inline-flex;
align-items: center;
min-height: 26px;
padding: 0 0.55rem;
border-radius: 999px;
background: #eef2f7;
color: #334155;
font-size: .75rem;
font-weight: 800;
}
.produto-galeria-drop {
min-height: 254px;
border: 2px dashed #cfd8ea;
border-radius: 8px;
background: #fff;
padding: 0.9rem;
cursor: pointer;
transition: border-color 0.15s ease, background-color 0.15s ease;
}
.produto-galeria-drop:hover,
.produto-galeria-drop:focus {
border-color: #8da2c8;
outline: none;
}
.produto-galeria-empty {
min-height: 210px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 0.55rem;
color: #374151;
text-align: center;
}
.produto-galeria-empty[hidden] {
display: none;
}
.produto-galeria-empty i {
font-size: 2.2rem;
color: #64748b;
}
.produtos-galeria-lista {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(118px, 1fr));
gap: 0.8rem;
}
.produtos-galeria-item {
position: relative;
aspect-ratio: 1;
overflow: hidden;
border: 1px solid #d7deea;
border-radius: 8px;
background: #f8fafc;
box-shadow: 0 8px 18px rgba(15, 23, 42, 0.08);
}
.produtos-galeria-item img {
width: 100%;
height: 100%;
object-fit: cover;
}
.produtos-galeria-item .produtos-icon-btn {
position: absolute;
top: 6px;
right: 6px;
}
.produto-complementos-box {
min-height: 100%;
}
.produto-complementos-pane {
overflow: visible;
}
.produto-complementos-toolbar {
display: flex;
align-items: end;
justify-content: space-between;
gap: 0.9rem;
margin-bottom: 1rem;
overflow: visible;
}
.produto-complementos-toolbar__search {
flex: 1 1 auto;
max-width: 360px;
}
.produto-complementos-toolbar__search label {
margin-bottom: 0.35rem;
color: #111827;
font-size: 0.82rem;
font-weight: 600;
}
.produto-complementos-toolbar__side {
display: flex;
align-items: center;
justify-content: flex-end;
gap: 0.65rem;
flex-wrap: wrap;
}
.produto-complementos-busca-wrap {
position: relative;
overflow: visible;
}
.produto-complementos-busca-resultados {
display: none;
position: absolute;
z-index: 30;
top: calc(100% + 4px);
left: 0;
min-width: min(460px, calc(100vw - 48px));
max-height: 280px;
overflow-y: auto;
border: 1px solid #c9d7ef;
border-radius: 8px;
background: #fff;
box-shadow: 0 14px 30px rgba(15, 23, 42, 0.16);
}
.produto-complementos-busca-resultados.is-open {
display: block;
}
.produto-complementos-resultado {
width: 100%;
display: block;
padding: 0.65rem 0.85rem;
border: 0;
border-bottom: 1px solid #edf2f7;
background: transparent;
color: #111827;
font-size: 0.78rem;
line-height: 1.35;
text-align: left;
}
.produto-complementos-resultado:last-child {
border-bottom: 0;
}
.produto-complementos-resultado:hover,
.produto-complementos-resultado:focus {
background: #eef5ff;
outline: none;
}
.produto-complementos-resultado__head,
.produto-complementos-selecionado__title-row {
display: flex;
align-items: center;
gap: 0.5rem;
min-width: 0;
}
.produto-complementos-impacto-badge {
display: inline-flex;
align-items: center;
gap: 0.3rem;
min-height: 22px;
padding: 0.15rem 0.55rem;
border: 1px solid #86efac;
border-radius: 999px;
background: #dcfce7;
color: #166534;
font-size: 0.68rem;
font-weight: 800;
line-height: 1.15;
white-space: nowrap;
}
.produto-complementos-impacto-badge:hover,
.produto-complementos-impacto-badge:focus {
border-color: #22c55e;
background: #bbf7d0;
color: #14532d;
outline: none;
}
.produto-complementos-impacto-intro {
display: flex;
flex-direction: column;
gap: 0.2rem;
padding: 0.85rem 1rem;
border: 1px solid #bbf7d0;
border-radius: 10px;
background: #f0fdf4;
}
.produto-complementos-impacto-intro > span,
.produto-complementos-impacto-intro > small {
color: #4b5563;
font-size: 0.76rem;
}
.produto-complementos-impacto-intro > strong {
color: #14532d;
font-size: 0.95rem;
}
.produto-complementos-impacto-lista {
display: grid;
gap: 0.45rem;
max-height: 290px;
margin-top: 0.85rem;
overflow-y: auto;
}
.produto-complementos-impacto-produto {
display: flex;
align-items: center;
justify-content: space-between;
gap: 0.75rem;
padding: 0.65rem 0.8rem;
border: 1px solid #e2e8f0;
border-radius: 8px;
background: #fff;
}
.produto-complementos-impacto-produto > span {
min-width: 0;
color: #1f2937;
font-size: 0.78rem;
font-weight: 700;
}
.produto-complementos-impacto-produto > small {
flex: 0 0 auto;
color: #166534;
font-size: 0.68rem;
font-weight: 800;
}
.produto-complementos-impacto-escolha {
display: grid;
gap: 0.55rem;
margin: 1rem 0 0;
padding: 0;
border: 0;
}
.produto-complementos-impacto-escolha--grupo {
grid-template-columns: repeat(2, minmax(0, 1fr));
margin: 0 0 0.85rem;
padding: 0.8rem;
border: 1px solid #dbe3ef;
border-radius: 10px;
background: #f8fafc;
}
.produto-complementos-impacto-escolha--grupo legend {
grid-column: 1 / -1;
}
@media (max-width: 720px) {
.produto-complementos-impacto-escolha--grupo {
grid-template-columns: 1fr;
}
}
.produto-complementos-impacto-escolha legend {
margin-bottom: 0.1rem;
color: #111827;
font-size: 0.8rem;
font-weight: 800;
}
.produto-complementos-impacto-opcao {
display: flex;
align-items: flex-start;
gap: 0.7rem;
padding: 0.75rem 0.85rem;
border: 1px solid #dbe3ef;
border-radius: 9px;
background: #fff;
cursor: pointer;
}
.produto-complementos-impacto-opcao:has(input:checked) {
border-color: #22c55e;
background: #f0fdf4;
}
.produto-complementos-impacto-opcao input {
margin-top: 0.18rem;
accent-color: #16a34a;
}
.produto-complementos-impacto-opcao > span {
display: flex;
flex-direction: column;
gap: 0.15rem;
}
.produto-complementos-impacto-opcao strong {
color: #111827;
font-size: 0.78rem;
}
.produto-complementos-impacto-opcao small {
color: #64748b;
font-size: 0.72rem;
}
.produto-complementos-resultado__titulo {
color: #111827;
font-weight: 800;
}
.produto-complementos-resultado__meta,
.produto-complementos-selecionado__meta,
.produto-complementos-item__meta {
color: #64748b;
font-size: .75rem;
}
.produto-complementos-resultado__meta,
.produto-complementos-selecionado__meta {
margin-top: 0.2rem;
}
.produto-complementos-resultado-empty {
padding: 0.75rem 0.85rem;
color: #64748b;
font-size: 0.76rem;
font-weight: 700;
}
.produto-complementos-resumo {
color: #3d00c6;
font-size: 0.75rem;
font-weight: 800;
white-space: nowrap;
}
.produto-complementos-ghostbtn {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 0.35rem;
min-height: 30px;
padding: 0 0.75rem;
border: 1px solid #dbe3ef;
border-radius: 8px;
background: #fff;
color: #334155;
font-size: 0.76rem;
font-weight: 800;
line-height: 1.2;
white-space: nowrap;
}
.produto-complementos-ghostbtn:hover:not(:disabled),
.produto-complementos-ghostbtn:focus:not(:disabled) {
border-color: #9fb4d9;
background: #f8fbff;
color: #0b3ea8;
}
.produto-complementos-ghostbtn:disabled {
opacity: 0.72;
cursor: not-allowed;
}
.produto-complementos-ghostbtn--round {
width: 30px;
min-width: 30px;
height: 30px;
min-height: 30px;
padding: 0;
border-radius: 50%;
}
.produto-complementos-selecionados {
display: flex;
flex-direction: column;
gap: 0.65rem;
}
.produto-complementos-selecionado {
position: relative;
z-index: 0;
width: 100%;
overflow: hidden;
border: 1px solid #dbe3ef;
border-radius: 8px;
background: #fff;
transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.produto-complementos-selecionado.is-autocomplete-open {
z-index: 1200;
overflow: visible;
}
.produto-complementos-selecionado:hover {
border-color: #9fb4d9;
}
.produto-complementos-selecionado.is-expanded {
border-color: #4c00ff;
box-shadow: inset 0 0 0 1px rgba(76, 0, 255, 0.08);
}
.produto-complementos-selecionado.is-dragging {
opacity: 0.58;
}
.produto-complementos-selecionado.is-drag-over {
border-color: #4c00ff;
background: #f7f4ff;
}
.produto-complementos-selecionado__header {
display: flex;
align-items: center;
gap: 0.75rem;
padding: 0.75rem;
}
.produto-complementos-selecionado__handle,
.produto-complementos-item__handle {
flex: 0 0 18px;
color: #94a3b8;
font-size: 1rem;
line-height: 1;
text-align: center;
cursor: grab;
}
.produto-complementos-selecionado__handle:active,
.produto-complementos-item__handle:active {
cursor: grabbing;
}
.produto-complementos-selecionado__body {
flex: 1 1 auto;
min-width: 0;
border: 0;
background: transparent;
padding: 0;
text-align: left;
}
.produto-complementos-selecionado__editbox {
flex: 1 1 auto;
min-width: 0;
}
.produto-complementos-selecionado__actions {
flex: 0 0 auto;
display: inline-flex;
align-items: center;
gap: 0.4rem;
order: 3;
margin-left: auto;
}
.produto-complementos-selecionado__body,
.produto-complementos-selecionado__editbox {
order: 2;
}
.produto-complementos-inline-autocomplete {
position: relative;
flex: 1 1 260px;
min-width: 180px;
}
.produto-complementos-inline-autocomplete .produto-complementos-inline-control--nome,
.produto-complementos-inline-autocomplete .produto-complementos-item__control--nome {
width: 100%;
min-width: 0;
}
.produto-complementos-inline-resultados {
display: none;
position: absolute;
z-index: 1220;
top: calc(100% + 4px);
left: 0;
right: 0;
max-height: 220px;
overflow-y: auto;
border: 1px solid #c9d7ef;
border-radius: 8px;
background: #fff;
box-shadow: 0 12px 24px rgba(15, 23, 42, 0.16);
}
.produto-complementos-inline-resultados.is-open {
display: block;
}
.produto-complementos-inline-head,
.produto-complementos-item__editbox {
display: flex;
flex-direction: column;
gap: 0.45rem;
min-width: 0;
}
.produto-complementos-inline-head__row,
.produto-complementos-item__row {
display: flex;
align-items: center;
gap: 0.4rem;
flex-wrap: wrap;
min-width: 0;
}
.produto-complementos-inline-head__row--regras {
padding-top: 0.15rem;
}
.produto-complementos-grupo-switch {
margin: 0 0.35rem 0 0;
white-space: nowrap;
}
.produto-complementos-inline-head__label--cobranca {
width: auto;
min-width: 0;
margin-left: 0.35rem;
text-align: left;
}
.produto-complementos-inline-head__label,
.produto-complementos-item__label {
color: #64748b;
font-size: .75rem;
font-weight: 800;
min-width: 42px;
text-align: right;
}
.produto-complementos-inline-head__count {
color: #64748b;
font-size: .75rem;
font-weight: 800;
}
.produto-complementos-inline-control--nome,
.produto-complementos-item__control--nome,
.produto-complementos-item__control--descricao {
flex: 1 1 260px;
min-width: 180px;
}
.produto-complementos-inline-select {
min-width: 165px;
}
.produto-complementos-inline-control--mini {
width: 54px;
text-align: center;
}
.produto-complementos-item__control--money {
width: 86px;
text-align: right;
}
.produto-complementos-item__control--pdv {
width: 68px;
}
.produto-complementos-selecionado__titulo {
color: #111827;
font-size: 0.82rem;
font-weight: 900;
line-height: 1.35;
}
.produto-complementos-selecionado__edit,
.produto-complementos-selecionado__toggle,
.produto-complementos-selecionado__remove {
flex: 0 0 auto;
width: 32px;
height: 32px;
border-radius: 50%;
display: inline-flex;
align-items: center;
justify-content: center;
font-size: 0.78rem;
}
.produto-complementos-selecionado__edit {
border: 1px solid #dbe3ef;
background: #fff;
color: #334155;
}
.produto-complementos-selecionado__edit:disabled {
opacity: 0.68;
cursor: not-allowed;
}
.produto-complementos-selecionado__toggle {
border: 0;
background: #e8f0ff;
color: #3d00c6;
transition: transform 0.15s ease, background-color 0.15s ease;
}
.produto-complementos-selecionado.is-expanded .produto-complementos-selecionado__toggle {
transform: rotate(180deg);
background: #dbeafe;
}
.produto-complementos-selecionado__remove,
.produto-complementos-item__remove {
border: 1px solid #fecaca;
background: #fff5f5;
color: #e11d48;
}
.produto-complementos-selecionado__remove:hover {
background: #fee2e2;
border-color: #fca5a5;
}
.produto-complementos-grupo__body {
padding: 0.75rem;
border-top: 1px solid #e5edf8;
background: #fff;
}
.produto-complementos-grupo__toolbar {
display: flex;
align-items: flex-start;
justify-content: space-between;
gap: 0.75rem;
margin-bottom: 0.75rem;
}
.produto-complementos-grupo__actions {
display: flex;
align-items: center;
gap: 0.55rem;
flex-wrap: wrap;
}
.produto-complementos-grupo__search {
width: 240px;
max-width: 100%;
}
.produto-complementos-itens {
display: flex;
flex-direction: column;
gap: 0.65rem;
}
.produto-complementos-item {
position: relative;
z-index: 0;
display: flex;
align-items: center;
gap: 0.75rem;
border: 1px solid #e7edf6;
border-radius: 8px;
background: #fbfdff;
padding: 0.65rem 0.75rem;
}
.produto-complementos-item.is-autocomplete-open {
z-index: 1210;
}
.produto-complementos-item__thumb {
flex: 0 0 44px;
width: 44px;
height: 44px;
overflow: hidden;
border-radius: 8px;
background: #e2e8f0;
display: flex;
align-items: center;
justify-content: center;
}
.produto-complementos-item__thumb img {
width: 100%;
height: 100%;
display: block;
object-fit: cover;
}
.produto-complementos-item__thumb-fallback {
color: #64748b;
font-size: 1.2rem;
font-weight: 800;
}
.produto-complementos-item__body {
flex: 1 1 auto;
min-width: 0;
}
.produto-complementos-item__title {
color: #111827;
font-size: 0.82rem;
font-weight: 900;
line-height: 1.35;
}
.produto-complementos-item__actions {
flex: 0 0 auto;
display: flex;
align-items: center;
gap: 0.4rem;
order: 4;
margin-left: auto;
}
.produto-complementos-item-ficha {
border-color: #bfdbfe;
background: #eff6ff;
color: #1d4ed8;
}
.produto-complementos-item-ficha:hover,
.produto-complementos-item-ficha:focus,
.produto-complementos-item-ficha.is-active {
border-color: #93c5fd;
background: #dbeafe;
color: #1e3a8a;
}
.produto-complementos-item.is-editing {
align-items: flex-start;
}
.produto-complementos-item__thumb {
order: 1;
}
.produto-complementos-item__body,
.produto-complementos-item__editbox {
order: 2;
}
.produto-complementos-item__ordem {
order: 5;
}
.produto-complementos-item.is-dragging {
opacity: 0.58;
}
.produto-complementos-item.is-drag-over {
border-color: #4c00ff;
background: #f7f4ff;
}
.produto-complementos-item__switch {
margin-left: 0.35rem;
}
.produto-complementos-item.is-ficha-open {
flex-wrap: wrap;
border-color: #93c5fd;
background: #fff;
}
.produto-complementos-ficha {
order: 6;
flex: 1 0 100%;
width: 100%;
margin-top: 0.15rem;
padding-top: 0.8rem;
border-top: 1px solid #dbeafe;
}
.produto-complementos-ficha__head {
display: flex;
align-items: center;
justify-content: space-between;
gap: 0.75rem;
margin-bottom: 0.75rem;
}
.produto-complementos-ficha__head > div {
display: flex;
flex-direction: column;
min-width: 0;
}
.produto-complementos-ficha__head strong {
color: #111827;
font-size: 0.82rem;
font-weight: 900;
}
.produto-complementos-ficha__head small {
color: #64748b;
font-size: .75rem;
}
.produto-complementos-ficha__head > span {
flex: 0 0 auto;
padding: 0.38rem 0.65rem;
border-radius: 999px;
background: #eef4ff;
color: #0b3ea8;
font-size: .75rem;
font-weight: 900;
}
.produto-complementos-ficha__form {
display: grid;
grid-template-columns: minmax(220px, 1fr) 86px 94px 94px 34px;
align-items: end;
gap: 0.55rem;
padding: 0.75rem;
border: 1px solid #dbe3ef;
border-radius: 8px;
background: #f8fafc;
}
.produto-complementos-ficha__form label {
position: relative;
min-width: 0;
}
.produto-complementos-ficha__form label > span {
display: block;
margin-bottom: 0.2rem;
color: #64748b;
font-size: .75rem;
font-weight: 800;
}
.produto-complementos-ficha-add {
width: 34px;
height: 30px;
padding: 0;
}
.produto-complementos-ficha__resultados {
display: none;
position: absolute;
z-index: 1240;
top: calc(100% + 4px);
left: 0;
right: 0;
max-height: 220px;
overflow-y: auto;
border: 1px solid #c9d7ef;
border-radius: 8px;
background: #fff;
box-shadow: 0 12px 24px rgba(15, 23, 42, 0.16);
}
.produto-complementos-ficha__resultados.is-open {
display: block;
}
.produto-complementos-ficha__resultado {
display: flex;
width: 100%;
flex-direction: column;
align-items: flex-start;
padding: 0.55rem 0.65rem;
border: 0;
border-bottom: 1px solid #edf2f7;
background: #fff;
text-align: left;
}
.produto-complementos-ficha__resultado:hover,
.produto-complementos-ficha__resultado:focus {
background: #eef5ff;
outline: none;
}
.produto-complementos-ficha__resultado strong {
color: #111827;
font-size: 0.76rem;
}
.produto-complementos-ficha__resultado small,
.produto-complementos-ficha__empty {
color: #64748b;
font-size: .75rem;
}
.produto-complementos-ficha__empty {
padding: 0.7rem;
text-align: center;
}
.produto-complementos-ficha__linhas {
display: flex;
flex-direction: column;
gap: 0.45rem;
margin-top: 0.65rem;
}
.produto-complementos-ficha__linha {
display: grid;
grid-template-columns: minmax(0, 1fr) auto 30px;
align-items: center;
gap: 0.75rem;
padding: 0.55rem 0.65rem;
border: 1px solid #e7edf6;
border-radius: 8px;
background: #fbfdff;
}
.produto-complementos-ficha__linha > div:first-child {
display: flex;
flex-direction: column;
min-width: 0;
}
.produto-complementos-ficha__linha strong {
color: #111827;
font-size: 0.76rem;
}
.produto-complementos-ficha__linha small,
.produto-complementos-ficha__metricas span {
color: #64748b;
font-size: .75rem;
}
.produto-complementos-ficha__metricas {
display: flex;
gap: 0.75rem;
}
.produto-complementos-ficha__metricas strong {
margin-left: 0.2rem;
color: #334155;
font-size: .75rem;
}
.produto-complementos-item-resultados {
margin: -0.2rem 0 0.75rem 0;
overflow: hidden;
border: 1px solid #c9d7ef;
border-radius: 8px;
background: #fff;
}
.produto-complementos-item__ordem {
flex: 0 0 auto;
min-width: 24px;
text-align: right;
color: #94a3b8;
font-size: 0.75rem;
font-weight: 800;
}
.produto-complementos-empty {
border: 1px dashed #cfd8ea;
border-radius: 8px;
background: #fbfdff;
padding: 1rem;
color: #64748b;
font-size: 0.78rem;
font-weight: 700;
text-align: center;
}
.produtos-dias-grid {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 0.75rem;
}
.produtos-dia-item {
display: flex;
align-items: center;
justify-content: space-between;
gap: 1rem;
min-height: 58px;
border: 1px solid #d7deea;
border-radius: 6px;
padding: 0.75rem;
background: #fff;
font-weight: 700;
}
.produto-atendimentos-head {
display: grid;
gap: 0.2rem;
margin: 1.15rem 0 0.65rem;
padding-top: 1rem;
border-top: 1px solid #e2e8f0;
}
.produto-atendimentos-head > strong {
color: #172033;
font-size: 0.9rem;
}
.produto-atendimentos-head > small {
color: #64748b;
font-size: 0.76rem;
}
.produto-atendimentos-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 0.8rem;
}
.produto-atendimento-grupo {
overflow: hidden;
border: 1px solid #d7deea;
border-radius: 8px;
background: #fff;
}
.produto-atendimento-grupo > header {
display: flex;
align-items: center;
gap: 0.5rem;
min-height: 42px;
padding: 0.65rem 0.8rem;
border-bottom: 1px solid #e2e8f0;
background: #f8fafc;
color: #1e3a72;
font-size: 0.78rem;
}
.produto-atendimento-grupo > div {
display: grid;
}
.produto-atendimento-item {
display: flex;
align-items: center;
justify-content: space-between;
gap: 0.8rem;
min-height: 54px;
padding: 0.55rem 0.75rem;
border-bottom: 1px solid #edf1f6;
}
.produto-atendimento-item:last-child {
border-bottom: 0;
}
.produto-atendimento-item > span:first-child {
display: grid;
gap: 0.05rem;
min-width: 0;
}
.produto-atendimento-item strong {
color: #27364f;
font-size: 0.78rem;
}
.produto-atendimento-item small {
color: #718096;
font-size: .75rem;
}
.produto-promocao-escopos {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 0.55rem;
margin-top: 0.45rem;
}
.produto-promocao-escopo-grupo {
overflow: hidden;
border: 1px solid #d7deea;
border-radius: 7px;
background: #fff;
}
.produto-promocao-escopo-grupo > header {
display: flex;
align-items: center;
gap: 0.4rem;
min-height: 30px;
padding: 0.35rem 0.55rem;
border-bottom: 1px solid #e6ebf2;
background: #f8fafc;
color: #1e3a72;
font-size: 0.7rem;
}
.produto-promocao-escopo-grupo > div {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
}
.produto-promocao-escopo-item {
display: flex;
align-items: center;
justify-content: space-between;
gap: 0.35rem;
min-width: 0;
min-height: 36px;
padding: 0.3rem 0.45rem;
border-right: 1px solid #edf1f6;
border-bottom: 1px solid #edf1f6;
color: #34435b;
font-size: 0.7rem;
font-weight: 750;
}
.produto-promocao-escopo-item:nth-child(3n) { border-right: 0; }
.produto-promocao-escopo-item:nth-last-child(-n + 3) { border-bottom: 0; }
.produto-promocao-escopo-item .ss-switch { flex: 0 0 auto; }
.produto-promocao-escopo-item .ss-switch > span:first-of-type {
width: 28px;
height: 16px;
}
.produtos-config-unidade-head {
display: flex;
align-items: center;
justify-content: space-between;
gap: 1rem;
margin-bottom: 0.8rem;
}
.produtos-config-unidade-head > div {
display: flex;
flex-direction: column;
}
.produtos-config-unidade-head span {
color: #64748b;
font-size: .75rem;
}
.produtos-grupo-fiscal {
max-width: 420px;
margin-bottom: 0.8rem;
}
.produto-tab-panel {
min-height: 100%;
border: 1px solid #d7deea;
border-radius: 12px;
background: #f8fbff;
padding: 1rem;
}
.produto-tab-panel-head {
margin-bottom: 1rem;
}
.produto-tab-panel h6,
.produto-tab-panel-head h6,
.produto-ficha-form-card h6,
.produto-ficha-section-head h6,
.produto-combo-head h6 {
margin: 0 0 0.35rem;
color: #111827;
font-size: 0.92rem;
font-weight: 900;
}
.produto-tab-panel p,
.produto-tab-panel-head p,
.produto-ficha-section-head p,
.produto-combo-head p,
.produto-combo-grid small {
margin: 0;
color: #64748b;
font-size: 0.75rem;
}
.produtos-modal-grid {
width: 100%;
--ag-border-color: #dfe5ee;
--ag-odd-row-background-color: #fff;
--ag-row-border-color: #eef2f7;
}
.produtos-modal-grid .ag-root-wrapper {
border-radius: 8px;
}
.produto-editor-cards {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 0.8rem;
}
.produto-editor-cards--ambientes {
grid-template-columns: minmax(0, 1fr);
gap: 0.65rem;
}
.produto-operacao-unidade {
display: grid;
grid-template-columns: minmax(0, 1fr) minmax(18rem, 0.8fr);
align-items: end;
gap: 0.85rem;
border: 1px solid #d8e1ef;
border-radius: 10px;
background: #f8faff;
padding: 0.7rem 0.8rem;
}
.produto-operacao-unidade__identidade {
display: grid;
grid-template-columns: minmax(0, 1fr) auto;
align-items: center;
gap: 0.1rem 0.8rem;
min-width: 0;
}
.produto-operacao-unidade__identidade > .produto-editor-card__eyebrow { grid-column: 1; }
.produto-operacao-unidade__identidade > strong {
grid-column: 1;
overflow: hidden;
color: #172033;
font-size: 0.88rem;
text-overflow: ellipsis;
white-space: nowrap;
}
.produto-operacao-unidade__identidade > .ss-switch {
grid-column: 2;
grid-row: 1 / span 2;
}
.produto-operacao-unidade__fiscal,
.produto-ambiente-card__config > label {
display: flex;
min-width: 0;
flex-direction: column;
gap: 0.25rem;
}
.produto-operacao-unidade__fiscal > span,
.produto-ambiente-card__config > label > span {
color: #64748b;
font-size: 0.66rem;
font-weight: 800;
letter-spacing: 0.025em;
text-transform: uppercase;
}
.produto-ambientes-lista {
display: grid;
gap: 0.65rem;
}
.produto-ambiente-card {
overflow: hidden;
padding: 0;
box-shadow: none;
}
.produto-ambiente-card__topo {
display: flex;
align-items: center;
border-bottom: 1px solid #e2e8f0;
background: #fbfcfe;
padding: 0.6rem 0.75rem;
}
.produto-ambiente-card__identidade {
display: flex;
min-width: 0;
align-items: center;
gap: 0.6rem;
}
.produto-ambiente-card__identidade > span:last-child {
display: flex;
min-width: 0;
flex-direction: column;
}
.produto-ambiente-card__identidade small {
color: #64748b;
font-size: 0.64rem;
font-weight: 800;
letter-spacing: 0.04em;
text-transform: uppercase;
}
.produto-ambiente-card__identidade strong {
overflow: hidden;
color: #172033;
font-size: 0.84rem;
text-overflow: ellipsis;
white-space: nowrap;
}
.produto-ambiente-card__icone {
display: inline-flex;
width: 2rem;
height: 2rem;
flex: 0 0 2rem;
align-items: center;
justify-content: center;
border-radius: 8px;
background: #e9eeff;
color: #465a99;
}
.produto-ambiente-card__config {
display: grid;
grid-template-columns: minmax(10rem, 0.7fr) repeat(2, minmax(13rem, 1fr));
gap: 0.65rem;
padding: 0.7rem 0.75rem 0.8rem;
}
.produto-editor-card {
min-width: 0;
border: 1px solid #d7deea;
border-radius: 12px;
background: #fff;
padding: 0.9rem;
box-shadow: 0 4px 14px rgba(15, 23, 42, 0.04);
}
.produto-editor-card__head,
.produto-editor-card__actions {
display: flex;
align-items: center;
justify-content: space-between;
gap: 0.75rem;
}
.produto-editor-card__head > div:first-child {
display: flex;
min-width: 0;
flex-direction: column;
}
.produto-editor-card__head strong,
.produto-editor-card__head small {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.produto-editor-card__head small {
color: #64748b;
font-size: 0.72rem;
}
.produto-editor-card__eyebrow,
.produto-editor-card__fields label > span,
.produto-editor-metrics span {
color: #64748b;
font-size: 0.68rem;
font-weight: 800;
letter-spacing: 0.025em;
text-transform: uppercase;
}
.produto-editor-card__fields {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 0.65rem;
margin-top: 0.8rem;
}
.produto-editor-card__fields--precos {
grid-template-columns: repeat(3, minmax(0, 1fr));
}
.produto-editor-card__fields--programacao {
grid-template-columns: repeat(4, minmax(0, 1fr));
}
.produto-editor-card__atendimentos {
margin-top: 0.7rem;
}
.produto-editor-card__fields label {
display: flex;
min-width: 0;
flex-direction: column;
gap: 0.25rem;
}
@media (max-width: 720px) {
.produto-operacao-unidade {
grid-template-columns: minmax(0, 1fr);
}
.produto-ambiente-card__config { grid-template-columns: minmax(0, 1fr); }
}
.produto-editor-metrics {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 0.55rem;
margin-top: 0.8rem;
}
.produto-editor-metrics > div {
display: flex;
min-width: 0;
flex-direction: column;
border-radius: 8px;
background: #f8fafc;
padding: 0.55rem 0.65rem;
}
.produto-editor-metrics strong { font-size: 0.84rem; }
.produto-editor-metrics--single { grid-template-columns: minmax(0, 1fr); }
.produto-editor-empty {
grid-column: 1 / -1;
border: 1px dashed #cbd5e1;
border-radius: 10px;
background: #f8fafc;
padding: 1.25rem;
color: #64748b;
font-size: 0.82rem;
font-weight: 700;
text-align: center;
}
.ss-tags-select {
position: relative;
min-width: 0;
max-width: 100%;
width: 100%;
}
/* Fechado, o controle deve ficar idêntico a um