/* ===========================================================================
   Webchat — tema visual inspirado no Material Design 3, sobre AdminLTE 4 / Bootstrap 5.3,
   com as cores da TSMX, as mesmas do tema "Neo" do SGP (admin_neo.css: --color-primary #0f1115,
   --color-secondary #171a22, --color-accent #e8590c / hover #c94d0a).
   Só CSS: carregado por último em adm/base.html (depois de adm.css e do CSS de cada página).
   Cores via variáveis do Bootstrap, com equivalente para o modo escuro (data-bs-theme="dark").
   =========================================================================== */

/* ---- Paleta e tokens ------------------------------------------------------ */
:root, [data-bs-theme="light"] {
  --md-primary: #e8590c;              /* laranja TSMX (--color-accent do SGP Neo) */
  --md-primary-rgb: 232, 89, 12;
  --md-primary-hover: #c94d0a;        /* --color-accent-hover */
  --md-on-primary: #fff;
  --md-primary-container: #fde2d2;
  --md-on-primary-container: #5a2104;
  --md-navy: #171a22;                 /* azul-marinho TSMX (--color-secondary do SGP Neo) */
  --md-navy-rgb: 23, 26, 34;
  --md-surface: #ffffff;
  --md-surface-dim: #f4f5f8;          /* fundo da página */
  --md-surface-container: #eef0f5;    /* cabeçalhos de tabela */
  --md-surface-container-high: #e4e7ef;
  --md-outline: #c4c7c5;
  --md-outline-variant: #e1e3e1;
  --md-on-surface: #1f1f1f;
  --md-on-surface-variant: #444746;
  --md-elev-1: 0 1px 2px rgba(60, 64, 67, .3), 0 1px 3px 1px rgba(60, 64, 67, .15);
  --md-elev-2: 0 1px 2px rgba(60, 64, 67, .3), 0 2px 6px 2px rgba(60, 64, 67, .15);
  --md-elev-3: 0 4px 8px 3px rgba(60, 64, 67, .15), 0 1px 3px rgba(60, 64, 67, .3);
  --md-radius-sm: 8px;
  --md-radius: 12px;
  --md-radius-lg: 16px;
  --md-radius-xl: 28px;

  --bs-primary: var(--md-primary);
  --bs-primary-rgb: var(--md-primary-rgb);
  --bs-primary-bg-subtle: var(--md-primary-container);
  --bs-primary-text-emphasis: var(--md-on-primary-container);
  /* links em laranja escuro: o laranja puro fica com pouco contraste em texto sobre branco */
  --bs-link-color: #c94d0a;
  --bs-link-color-rgb: 201, 77, 10;
  --bs-link-hover-color: #9e3c07;
  --bs-link-hover-color-rgb: 158, 60, 7;
  --bs-body-color: var(--md-on-surface);
  --bs-body-bg: var(--md-surface);
  --bs-tertiary-bg: var(--md-surface-dim);
  --bs-secondary-bg: var(--md-surface-container);
  --bs-border-color: var(--md-outline-variant);
  --bs-border-radius: var(--md-radius-sm);
  --bs-border-radius-sm: 6px;
  --bs-border-radius-lg: var(--md-radius);
  --bs-border-radius-xl: var(--md-radius-lg);
  --bs-focus-ring-color: rgba(var(--md-primary-rgb), .25);
  --bs-body-font-family: "Roboto", -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Arial, sans-serif;
}

[data-bs-theme="dark"] {
  --md-primary: #e8590c;
  --md-primary-rgb: 232, 89, 12;
  --md-primary-hover: #f06b22;
  --md-on-primary: #fff;
  --md-primary-container: #4a1f07;
  --md-on-primary-container: #ffd9bf;
  --md-navy: #171a22;
  --md-navy-rgb: 23, 26, 34;
  --md-surface: #191928;              /* cartões: --neo-bg-card */
  --md-surface-dim: #111118;          /* fundo: --neo-bg */
  --md-surface-container: #20203a;
  --md-surface-container-high: #2a2a45;
  --md-outline: #8e918f;
  --md-outline-variant: #3c4043;
  --md-on-surface: #e3e3e3;
  --md-on-surface-variant: #c4c7c5;
  --md-elev-1: 0 1px 2px rgba(0, 0, 0, .5), 0 1px 3px 1px rgba(0, 0, 0, .3);
  --md-elev-2: 0 1px 2px rgba(0, 0, 0, .5), 0 2px 6px 2px rgba(0, 0, 0, .3);
  --md-elev-3: 0 4px 8px 3px rgba(0, 0, 0, .3), 0 1px 3px rgba(0, 0, 0, .5);

  --bs-link-color: #f2803f;
  --bs-link-color-rgb: 242, 128, 63;
  --bs-link-hover-color: #f8a272;
  --bs-link-hover-color-rgb: 248, 162, 114;
}

/* caixas preenchidas com o primário (laranja) mantêm texto branco nos dois temas */
.text-bg-primary { background-color: var(--md-primary) !important; color: #fff !important; }
/* totais do monitor: "Navegando" em azul (cor de antes), distinto do amarelo de "Em Espera" e da moldura */
.statisticas-info-box .info-box.text-bg-primary { background-color: #1a73e8 !important; color: #fff !important; }

/* ---- Base ------------------------------------------------------------------ */
body { font-family: var(--bs-body-font-family); letter-spacing: .01em; -webkit-font-smoothing: antialiased; }
body.bg-body-tertiary, .app-main { background-color: var(--md-surface-dim) !important; }
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { font-weight: 400; letter-spacing: 0; }
::selection { background: rgba(var(--md-primary-rgb), .25); }
* { scrollbar-width: thin; scrollbar-color: var(--md-outline) transparent; }

/* ---- Cores da barra superior e do menu (contrastam com o fundo da página) ---- */
:root, [data-bs-theme="light"] {
  --md-appbar-bg: #171a22;            /* barra superior = menu: moldura única no tom do SGP Neo (--color-secondary) */
  --md-appbar-fg: rgba(255, 255, 255, .92);
  --md-nav-bg: #171a22;               /* menu lateral: menu do SGP Neo (--color-secondary) */
  --md-nav-fg: #d6d6d6;               /* --color-text-secondary-dark */
  --md-nav-fg-strong: #ffffff;
  --md-nav-hover: rgba(255, 255, 255, .08);
  --md-nav-active-bg: #e8590c;        /* item ativo: laranja TSMX */
  --md-nav-active-fg: #ffffff;
  --md-nav-input-bg: rgba(255, 255, 255, .08);
}
[data-bs-theme="dark"] {
  --md-appbar-bg: #171a22;
  --md-appbar-fg: #f0f0f0;
  --md-nav-bg: #171a22;
  --md-nav-fg: #d6d6d6;
  --md-nav-fg-strong: #ffffff;
  --md-nav-hover: rgba(255, 255, 255, .07);
  --md-nav-active-bg: #e8590c;
  --md-nav-active-fg: #ffffff;
  --md-nav-input-bg: rgba(255, 255, 255, .06);
}

/* ---- Barra superior (top app bar) ---------------------------------------- */
.app-header {
  background-color: var(--md-appbar-bg) !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
  min-height: 4rem;
}
.app-header .nav-link {
  color: var(--md-appbar-fg) !important;
  width: 2.5rem; height: 2.5rem; padding: 0 !important; margin: 0 .1rem;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 50%; position: relative; font-size: 1.05rem;
  transition: background-color .15s;
}
.app-header .nav-link:hover { background-color: rgba(255, 255, 255, .14); color: #fff !important; }
.app-header .navbar-badge { top: .2rem; right: .1rem; font-size: .6rem; border-radius: 1rem; }

/* ---- Menu lateral (navigation drawer) ------------------------------------- */
/* um pouco mais largo que o padrão do AdminLTE (250px) */
:root { --lte-sidebar-width: 280px; }
.app-sidebar {
  background-color: var(--md-nav-bg) !important;
  box-shadow: none !important;
  border-right: 0 !important;
  --lte-sidebar-color: var(--md-nav-fg);
  --lte-sidebar-hover-color: var(--md-nav-fg-strong);
  --lte-sidebar-hover-bg: var(--md-nav-hover);
  --lte-sidebar-active-color: var(--md-nav-active-fg);
  --lte-sidebar-menu-active-bg: var(--md-nav-active-bg);
  --lte-sidebar-menu-active-color: var(--md-nav-active-fg);
  --lte-sidebar-submenu-bg: transparent;
  --lte-sidebar-submenu-color: var(--md-nav-fg);
  --lte-sidebar-submenu-hover-color: var(--md-nav-fg-strong);
  --lte-sidebar-submenu-hover-bg: var(--md-nav-hover);
  --lte-sidebar-submenu-active-color: var(--md-nav-active-fg);
  --lte-sidebar-submenu-active-bg: var(--md-nav-active-bg);
}
/* a marca fica alinhada com a barra superior */
.app-sidebar .sidebar-brand { background-color: transparent; border-bottom: 0 !important; height: 4rem; }
.app-sidebar .brand-link .brand-text { color: var(--md-nav-fg-strong) !important; font-weight: 500 !important; letter-spacing: .08em; }
.app-sidebar .user-panel { border-bottom: 0 !important; padding-top: .75rem !important; padding-bottom: .75rem !important; }
.app-sidebar .user-panel a { color: var(--md-nav-fg-strong) !important; font-weight: 500; }
.app-sidebar .sidebar-search .input-group { border-radius: var(--md-radius-xl); background: var(--md-nav-input-bg); overflow: hidden; }
.app-sidebar .sidebar-search .form-control,
.app-sidebar .sidebar-search .btn-sidebar { background: transparent !important; border: 0 !important; color: var(--md-nav-fg-strong) !important; box-shadow: none !important; }
.app-sidebar .sidebar-search .form-control { padding-left: 1rem; }
.app-sidebar .sidebar-search .form-control::placeholder { color: var(--md-nav-fg) !important; opacity: .8; }
.app-sidebar .sidebar-search .input-group:focus-within { box-shadow: inset 0 0 0 2px var(--md-primary); }
.app-sidebar .sidebar-search [data-lte-search-empty] { color: var(--md-nav-fg) !important; }

.app-sidebar .sidebar-menu .nav-link {
  color: var(--md-nav-fg) !important;
  border-radius: 100px !important;
  min-height: 2.6rem; display: flex; align-items: center;
  margin-bottom: 2px; font-weight: 500; letter-spacing: .01em;
  box-shadow: none !important;
}
.app-sidebar .sidebar-menu .nav-link p { margin: 0; flex: 1; display: flex; align-items: center; }
.app-sidebar .sidebar-menu .nav-link .nav-arrow { margin-left: auto; }
.app-sidebar .sidebar-menu .nav-link:hover { color: var(--md-nav-fg-strong) !important; background-color: var(--md-nav-hover) !important; }
.app-sidebar .sidebar-menu > .nav-item.menu-open > .nav-link { color: var(--md-nav-fg-strong) !important; background-color: transparent !important; }
.app-sidebar .sidebar-menu .nav-treeview .nav-link.active,
.app-sidebar .sidebar-menu > .nav-item > .nav-link.active:not([href="#"]) {
  color: var(--md-nav-active-fg) !important;
  background-color: var(--md-nav-active-bg) !important;
  box-shadow: none !important;
}
.app-sidebar .sidebar-menu .nav-treeview { padding-left: .75rem; }
.app-sidebar .sidebar-menu .nav-treeview .nav-link { font-weight: 400; min-height: 2.35rem; font-size: .86rem; }
.app-sidebar .sidebar-menu .nav-link p { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.app-sidebar .nav-icon { color: inherit !important; }
.app-sidebar .sidebar-wrapper { scrollbar-color: rgba(255, 255, 255, .25) transparent; }

/* ---- Cabeçalho da página ---------------------------------------------------- */
.app-content-header { padding-top: 1.25rem; padding-bottom: .75rem; }
.app-content-header h1 { font-size: 1.75rem; font-weight: 400; }
.app-content-header h1 > i { color: var(--md-primary) !important; }
.app-content-header .breadcrumb { font-size: .8rem; margin-top: .15rem; }
.app-content-header .breadcrumb-item, .app-content-header .breadcrumb-item.active { color: var(--md-on-surface-variant); }

/* ---- Cards / superfícies ------------------------------------------------------ */
.card {
  --bs-card-border-width: 0;
  --bs-card-border-radius: var(--md-radius);
  --bs-card-inner-border-radius: var(--md-radius);
  --bs-card-cap-bg: transparent;
  --bs-card-bg: var(--md-surface);
  box-shadow: var(--md-elev-1);
  border: 0;
}
.card > .card-header { border-bottom: 1px solid var(--md-outline-variant); }
.card > .card-footer { border-top: 1px solid var(--md-outline-variant); }
.card .card-title { font-weight: 500; }
.card.card-outline { border-top: 0; }
/* cards dentro de cards (seções de relatórios, itens de formset) ficam planos */
.card .card { box-shadow: none; border: 1px solid var(--md-outline-variant); }

.info-box {
  border-radius: var(--md-radius-lg) !important;
  box-shadow: var(--md-elev-1) !important;
  padding: .75rem 1rem;
  min-height: 84px;
}
.info-box .info-box-icon { border-radius: var(--md-radius) !important; width: 56px; font-size: 1.6rem; }
.info-box .info-box-text { font-weight: 500; letter-spacing: .02em; }
.info-box .info-box-number { font-size: 1.4rem; font-weight: 400; }

/* ---- Botões ------------------------------------------------------------------------ */
.btn {
  --bs-btn-border-radius: 100px;
  --bs-btn-font-weight: 500;
  --bs-btn-padding-x: 1.15rem;
  --bs-btn-padding-y: .45rem;
  letter-spacing: .02em;
  transition: background-color .15s, box-shadow .15s, color .15s, border-color .15s;
}
.btn-sm { --bs-btn-padding-x: .8rem; --bs-btn-padding-y: .25rem; --bs-btn-border-radius: 100px; }
.btn-lg { --bs-btn-padding-x: 1.5rem; }
.btn:not(.btn-link):not(.btn-tool):not([class*="btn-outline"]):not(.btn-light):hover { box-shadow: var(--md-elev-1); }
.btn-primary {
  --bs-btn-bg: var(--md-primary); --bs-btn-border-color: var(--md-primary); --bs-btn-color: var(--md-on-primary);
  --bs-btn-hover-bg: var(--md-primary); --bs-btn-hover-border-color: var(--md-primary); --bs-btn-hover-color: var(--md-on-primary);
  --bs-btn-active-bg: var(--md-primary); --bs-btn-active-border-color: var(--md-primary); --bs-btn-active-color: var(--md-on-primary);
  --bs-btn-disabled-bg: var(--md-primary); --bs-btn-disabled-border-color: var(--md-primary);
}
.btn-primary:hover { --bs-btn-hover-bg: var(--md-primary-hover); --bs-btn-hover-border-color: var(--md-primary-hover); }
.btn-outline-primary {
  --bs-btn-color: var(--md-primary); --bs-btn-border-color: var(--md-outline);
  --bs-btn-hover-bg: rgba(var(--md-primary-rgb), .08); --bs-btn-hover-color: var(--md-primary); --bs-btn-hover-border-color: var(--md-outline);
  --bs-btn-active-bg: rgba(var(--md-primary-rgb), .12); --bs-btn-active-color: var(--md-primary); --bs-btn-active-border-color: var(--md-outline);
}
.btn-outline-secondary {
  --bs-btn-color: var(--md-on-surface-variant); --bs-btn-border-color: var(--md-outline);
  --bs-btn-hover-bg: rgba(var(--bs-body-color-rgb), .06); --bs-btn-hover-color: var(--md-on-surface); --bs-btn-hover-border-color: var(--md-outline);
  --bs-btn-active-bg: rgba(var(--bs-body-color-rgb), .1); --bs-btn-active-color: var(--md-on-surface); --bs-btn-active-border-color: var(--md-outline);
}
.btn-outline-danger, .btn-outline-success, .btn-outline-warning, .btn-outline-info { --bs-btn-border-color: var(--md-outline); }
/* botões só de ícone nas listagens (editar/excluir/senha): redondos e sem borda, como "icon buttons" */
.tabela td.acoes .btn-sm, .tabela td.acoes form .btn-sm {
  width: 2.1rem; height: 2.1rem; padding: 0; border-color: transparent;
  display: inline-flex; align-items: center; justify-content: center;
}
.tabela td.acoes .btn-sm:hover { border-color: transparent; }
.btn-close { border-radius: 50%; padding: .6rem; }
.btn-close:hover { background-color: rgba(var(--bs-body-color-rgb), .08); }

/* ---- Campos ------------------------------------------------------------------------ */
.form-control, .form-select, .input-group-text, .ts-wrapper .ts-control {
  border-color: var(--md-outline);
  border-radius: var(--md-radius-sm);
  min-height: 2.6rem;
  background-color: var(--md-surface);
}
textarea.form-control { min-height: auto; }
.form-control-sm, .form-select-sm { min-height: auto; }
.form-control:hover, .form-select:hover, .ts-wrapper:hover .ts-control { border-color: var(--md-on-surface-variant); }
.form-control:focus, .form-select:focus, .ts-wrapper.focus .ts-control {
  border-color: var(--md-primary) !important;
  box-shadow: inset 0 0 0 1px var(--md-primary) !important;
}
.form-label, .col-form-label { font-weight: 500; font-size: .82rem; color: var(--md-on-surface-variant); margin-bottom: .3rem; }
.form-text { color: var(--md-on-surface-variant); }
.form-check-input { border-color: var(--md-outline); }
.form-check-input:checked { background-color: var(--md-primary); border-color: var(--md-primary); }
.form-check-input:focus { box-shadow: 0 0 0 .25rem rgba(var(--md-primary-rgb), .2); border-color: var(--md-primary); }
.form-switch { padding-left: 3.1em; }
.form-switch .form-check-input { width: 2.4em; height: 1.3em; margin-top: .1em; margin-left: -3.1em; }
.input-group > .form-control:not(:first-child), .input-group > .btn:not(:first-child) { border-top-left-radius: 0; border-bottom-left-radius: 0; }
.input-group > .form-control:not(:last-child), .input-group > .btn:not(:last-child) { border-top-right-radius: 0; border-bottom-right-radius: 0; }
.input-group > .btn { --bs-btn-border-radius: var(--md-radius-sm); }
/* Tom Select */
.ts-wrapper.multi .ts-control > div { border-radius: 100px; background: var(--md-primary-container); color: var(--md-on-primary-container); border: 0; padding: .1rem .55rem; }
.ts-dropdown { border-radius: var(--md-radius-sm); box-shadow: var(--md-elev-2); border: 0; overflow: hidden; }
.ts-dropdown .active { background: rgba(var(--md-primary-rgb), .1); color: inherit; }
.secao-titulo { color: var(--md-primary); font-weight: 500; letter-spacing: .06em; font-size: .78rem; border-top-color: var(--md-outline-variant); }

/* ---- Tabelas ----------------------------------------------------------------------- */
.table { --bs-table-bg: transparent; --bs-table-striped-bg: transparent; --bs-table-hover-bg: rgba(var(--md-primary-rgb), .05); --bs-table-border-color: var(--md-outline-variant); }
.table > thead > tr > th {
  background: var(--md-surface-container) !important;
  color: var(--md-on-surface-variant);
  font-weight: 500; font-size: .74rem; text-transform: uppercase; letter-spacing: .06em;
  border-bottom: 0; padding-top: .75rem; padding-bottom: .75rem;
}
.table > tbody > tr > td { padding-top: .7rem; padding-bottom: .7rem; }
.table > tbody > tr:last-child > td { border-bottom: 0; }
.card > .table-responsive { border-radius: var(--md-radius); }
.card > .table-responsive > .table > thead > tr > th:first-child { padding-left: 1.25rem; }
.card > .table-responsive > .table > tbody > tr > td:first-child { padding-left: 1.25rem; }
.card > .table-responsive > .table > thead > tr > th:last-child,
.card > .table-responsive > .table > tbody > tr > td:last-child { padding-right: 1.25rem; }
.pagination { --bs-pagination-border-radius: 100px; --bs-pagination-border-color: transparent; --bs-pagination-bg: transparent;
  --bs-pagination-active-bg: var(--md-primary-container); --bs-pagination-active-color: var(--md-on-primary-container);
  --bs-pagination-active-border-color: transparent; --bs-pagination-hover-bg: rgba(var(--bs-body-color-rgb), .06); gap: .2rem; }
.pagination .page-link { border-radius: 100px !important; min-width: 2.2rem; text-align: center; }

/* ---- Badges / chips ---------------------------------------------------------------- */
.badge { border-radius: 100px; font-weight: 500; letter-spacing: .02em; padding: .35em .7em; }

/* ---- Abas / pills ------------------------------------------------------------------ */
.nav-pills { --bs-nav-pills-border-radius: 100px; --bs-nav-pills-link-active-bg: var(--md-primary-container); --bs-nav-pills-link-active-color: var(--md-on-primary-container); gap: .25rem; }
.nav-pills .nav-link { font-weight: 500; }
.nav-pills .nav-link:not(.active):hover { background-color: rgba(var(--bs-body-color-rgb), .06); }
.nav-tabs { --bs-nav-tabs-border-color: var(--md-outline-variant); }
.nav-tabs .nav-link { border: 0; border-bottom: 3px solid transparent; font-weight: 500; color: var(--md-on-surface-variant); }
.nav-tabs .nav-link.active { color: var(--md-primary); border-bottom-color: var(--md-primary); background: transparent; }

/* ---- Menus suspensos ----------------------------------------------------------------- */
.dropdown-menu {
  --bs-dropdown-border-width: 0;
  --bs-dropdown-border-radius: var(--md-radius-sm);
  --bs-dropdown-box-shadow: var(--md-elev-2);
  --bs-dropdown-link-hover-bg: rgba(var(--bs-body-color-rgb), .06);
  --bs-dropdown-link-active-bg: var(--md-primary-container);
  --bs-dropdown-link-active-color: var(--md-on-primary-container);
  --bs-dropdown-item-padding-y: .5rem;
  --bs-dropdown-bg: var(--md-surface);
  box-shadow: var(--md-elev-2);
}

/* ---- Diálogos e drawer --------------------------------------------------------------- */
.modal { --bs-modal-border-width: 0; --bs-modal-border-radius: var(--md-radius-xl); --bs-modal-inner-border-radius: var(--md-radius-xl);
  --bs-modal-box-shadow: var(--md-elev-3); --bs-modal-bg: var(--md-surface); --bs-modal-header-border-width: 0; --bs-modal-footer-border-width: 0; }
.modal-content { box-shadow: var(--md-elev-3); }
.modal-header { padding: 1.25rem 1.5rem .5rem; }
.modal-title { font-weight: 400; font-size: 1.35rem; }
.modal-body { padding: .75rem 1.5rem; }
.modal-footer { padding: .5rem 1.25rem 1.25rem; }
/* a prévia do chat (iframe) ocupa o diálogo inteiro: cantos menores */
.chat-supervisor-modal { --bs-modal-border-radius: var(--md-radius-lg); --bs-modal-inner-border-radius: var(--md-radius-lg); }
.chat-supervisor-modal .modal-content { overflow: hidden; }
.offcanvas { --bs-offcanvas-border-width: 0; --bs-offcanvas-bg: var(--md-surface); }
.offcanvas.offcanvas-end { border-top-left-radius: var(--md-radius-lg); border-bottom-left-radius: var(--md-radius-lg); }
.offcanvas .offcanvas-header { border-bottom: 1px solid var(--md-outline-variant); padding: 1.1rem 1.5rem; }
.offcanvas .offcanvas-title { font-weight: 400; font-size: 1.3rem; }
.offcanvas .offcanvas-body { padding: 1.25rem 1.5rem; }
.drawer-rodape { border-top-color: var(--md-outline-variant) !important; background: var(--md-surface) !important; }
#drawer.offcanvas.show { box-shadow: var(--md-elev-3); }

/* ---- Toasts / alertas ---------------------------------------------------------------- */
.toast { border-radius: var(--md-radius-sm); box-shadow: var(--md-elev-3); }
.alert { border: 0; border-radius: var(--md-radius); }

/* ---- Monitor de atendimentos (cards das filas) --------------------------------------- */
.atendimento-lista-card .card-header { padding: .85rem 1rem; }
.customers-list .item { border-radius: var(--md-radius-sm); margin: .25rem 0; border-bottom: 0 !important; }
.customer-list-in-card .item + .item { box-shadow: 0 -1px 0 var(--md-outline-variant); }
.customers-list .item:hover, .customers-list .item.menu-aberto { background-color: rgba(var(--md-primary-rgb), .06); }
.atd-menu-contexto { border-radius: var(--md-radius-sm); }
.statisticas-info-box .info-box { margin-bottom: .75rem !important; }

/* ---- Login --------------------------------------------------------------------------- */
.login-box .card, .login-page .card { border-radius: var(--md-radius-xl); box-shadow: var(--md-elev-2); }

/* ---- Controle deslizante (form-range: cor fixa do Bootstrap) ------------------------- */
.form-range::-webkit-slider-thumb { background-color: var(--md-primary); }
.form-range::-webkit-slider-thumb:active { background-color: var(--md-primary-hover); }
.form-range::-moz-range-thumb { background-color: var(--md-primary); }
.form-range::-moz-range-thumb:active { background-color: var(--md-primary-hover); }
.form-range:focus::-webkit-slider-thumb { box-shadow: 0 0 0 1px var(--bs-body-bg), 0 0 0 .25rem rgba(var(--md-primary-rgb), .25); }

/* ---- Moldura: barra superior + menu formam uma peça só; o conteúdo é uma "folha" encaixada ---- */
.app-wrapper { background-color: var(--md-nav-bg); }
.app-main {
  border-top-left-radius: 20px;
  box-shadow: inset 0 0 0 0 transparent;
}
/* conteúdo sem o menu (tela pequena / menu recolhido): sem o canto arredondado */
@media (max-width: 991.98px) { .app-main { border-top-left-radius: 0; } }
.sidebar-collapse .app-main { border-top-left-radius: 0; }