@import url("style_partials.css");

/* =========================================
   BASE / TEMA LUNALÔSYS
   ========================================= */
:root {
  --orange: #e2725b;
  --sand-bg: #f7efe8;
  --sand-soft: #f1ece8;
  --text-main: #5f473b;
  --text-muted: #8c7463;
  --card-top: #ffffff;
  --card-bottom: #f4ddcf;
  --border-soft: rgba(0,0,0,0.06);
  --shadow-soft: 0 18px 45px rgba(0,0,0,0.12);
}

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

html, body {
  margin: 0;
  padding: 0;
  height: 50%; /* <--- garante altura total */
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background: var(--sand-bg);
  color: var(--text-main);
}

a {
  color: inherit;
}

/* =========================================
   LOGIN
   ========================================= */
.login-body {
  min-height: 100vh;
  background: var(--sand-bg);
  display: flex;
  justify-content: center;
  align-items: center;
}

.login-box {
  background: #ffffff;
  padding: 42px 46px;
  border-radius: 18px;
  box-shadow: 0 12px 35px rgba(0,0,0,0.14);
  width: 360px;
  text-align: center;
}

.login-logo {
  width: 150px;
  margin-bottom: 20px;
}

.login-title {
  margin-bottom: 28px;
  color: var(--text-main);
}

.login-box input {
  width: 100%;
  padding: 13px;
  border-radius: 10px;
  border: 1px solid var(--border-soft);
  margin-bottom: 14px;
  font-size: 15px;
  outline: none;
}

.login-box input:focus {
  border-color: rgba(0,0,0,0.25);
}

.login-box button {
  width: 100%;
  padding: 12px;
  background: var(--orange);
  border: none;
  border-radius: 10px;
  color: #ffffff;
  font-size: 16px;
  cursor: pointer;
  font-weight: 600;
}

.login-box button:hover {
  background: #e88773;
}

.login-error {
  margin-top: 12px;
  color: #c43c2c;
  font-size: 13px;
}

/* =========================================
   LAYOUT BÁSICO APP (PÓS-LOGIN)
   ========================================= */
.app-root {
  min-height: 90vh;        /* <--- em vez de calc(100vh - 60px) */
  display: flex;
  flex-direction: column;
}

.app-main {
  padding: 42px 72px;
  position: relative;
  flex: 1 0 auto;            /* <--- ocupa o espaço central */
}

/* para páginas mais "estreitas" (cadastro, importação, etc.) */
.narrow-page {
  max-width: 720px;
  margin: 0 auto;
}

/* Títulos / textos de página */
.page-title {
  margin: 0 0 16px 0;
  font-size: 22px;
  font-weight: 600;
  color: var(--text-main);
}

.page-subtitle {
  margin: 0 0 22px 0;
  font-size: 13px;
  color: var(--text-muted);
}

/* =========================================
   DASHBOARD / CARDS DA INDEX
   ========================================= */
/* Caso use layout em grid com .card (estilo que aprovamos) */
.dashboard-grid,
.grid {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
  justify-content: center;
}

.card {
  flex: 1 1 280px;
  max-width: 360px;
  background: linear-gradient(to bottom, var(--card-top), var(--card-bottom));
  border-radius: 18px;
  padding: 22px 20px 18px 20px;
  border: 1px solid var(--border-soft);
  box-shadow: var(--shadow-soft);
}

.section-title {
  font-size: 18px;
  font-weight: 600;
  margin: 0 0 14px 0;
  color: var(--text-main);
}

.item {
  display: block;
  padding: 10px 14px;
  margin-bottom: 8px;
  background: #ffffff;
  border-radius: 999px;
  border: 1px solid rgba(0,0,0,0.02);
  text-decoration: none;
  color: var(--text-main);
  font-size: 14px;
  box-shadow: 0 2px 9px rgba(0,0,0,0.05);
  transition: all .17s ease;
}

.item:hover {
  background: #fbe1d7;
  color: var(--orange);
  border-color: rgba(226,114,91,0.45);
  transform: translateY(-1px);
}

/* Caso use o layout com .module-card */
.main-layout {
  display: flex;
  gap: 40px;
  justify-content: center;
  align-items: flex-start;
}

.module-card {
  flex: 1;
  min-width: 0;
  background: linear-gradient(to bottom, var(--card-top), var(--card-bottom));
  border-radius: 18px;
  padding: 24px;
  border: 1px solid var(--border-soft);
  box-shadow: var(--shadow-soft);
}

.module-card-inner {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.module-title {
  font-size: 20px;
  font-weight: 600;
  margin: 0 0 14px 0;
}

.module-desc {
  margin: 10px 0 14px 0;
  line-height: 1.45;
}

.module-links {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.module-link {
  padding: 12px 16px;
  background: #ffffff;
  border-radius: 999px;
  border: 1px solid rgba(0,0,0,0.02);
  text-decoration: none;
  color: var(--text-main);
  font-size: 15px;
  box-shadow: 0 2px 9px rgba(0,0,0,0.05);
  transition: all .17s ease;
}

.module-link-sobre {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.module-link-sobre {
  padding: 12px 16px;
  background: #e88773;
  border-radius: 999px;
  border: 1px solid rgba(0,0,0,0.02);
  text-decoration: none;
  color: var(--text-main);
  font-size: 15px;
  box-shadow: 0 2px 9px rgba(0,0,0,0.05);
  transition: all .17s ease;
}

.module-link:hover {
  background: #fbe1d7;
  color: var(--orange);
  border-color: rgba(226,114,91,0.45);
  transform: translateY(-1px);
}

/* =========================================
   INDEX / PRE-INDEX / INDEX_FIN (SEM INLINE)
   ========================================= */
body.page-index .main-layout,
body.page-index-fin .main-layout {
  display: grid;
  grid-template-columns: repeat(4, minmax(260px, 1fr));
  gap: 22px;
  align-items: start;
}

body.page-pre-index .preindex-area {
  min-height: calc(100vh - 220px);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 14px 0 8px;
}

body.page-pre-index .preindex-grid {
  width: min(1320px, 100%);
  display: grid;
  grid-template-columns: repeat(5, minmax(180px, 1fr));
  gap: 18px;
}

body.page-pre-index .preindex-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  text-decoration: none;
  color: var(--text-main);
  background: linear-gradient(to bottom, var(--card-top), var(--card-bottom));
  border: 1px solid var(--border-soft);
  border-radius: 14px;
  min-height: 180px;
  padding: 18px;
  box-shadow: var(--shadow-soft);
}

body.page-pre-index .preindex-card img {
  width: 65%;
  height: 65%;
  max-width: 150px;
  max-height: 130px;
  object-fit: contain;
  opacity: 0.65;
}

body.page-pre-index .preindex-card span {
  display: block;
  font-size: 15px;
  font-weight: 400;
  text-transform: none;
  text-align: center;
  line-height: 1.2;
  letter-spacing: normal;
}

body.page-pre-index .preindex-card.placeholder {
  cursor: default;
  pointer-events: none;
  opacity: .88;
}

/* Loccitane central: ícones com a mesma presença visual da Main */
body.page-loccitane-index .preindex-card img {
  width: 100%;
  height: 100%;
  max-width: 118px;
  max-height: 102px;
}

body.page-lunalo-index .preindex-card img {
  width: 100%;
  height: 100%;
  max-width: 142px;
  max-height: 122px;
}

body.page-lunalo-index .preindex-card--strong {
  opacity: 1;
}

body.page-lunalo-index .preindex-card--strong img {
  opacity: 0.95;
}

body.page-lunalo-index .preindex-card--strong span {
  opacity: 1;
}

/* =========================================
   COLEÇÕES_* (SEM INLINE)
   ========================================= */
body.page-colecoes-consultar-mix .tabela-colecao-wrapper,
body.page-colecoes-pedido-cadastrar .tabela-pedido-wrapper,
body.page-colecoes-pedido-cadastrar .resumo-table-wrapper,
body.page-colecoes-pedido-consultar .tabela-pedido-wrapper {
  overflow-y: auto;
  border-radius: 8px;
  border: 1px solid #eee;
}

body.page-colecoes-consultar-mix .tabela-colecao-wrapper {
  max-height: 500px;
}

body.page-colecoes-pedido-cadastrar .tabela-pedido-wrapper {
  max-height: 480px;
}

body.page-colecoes-pedido-cadastrar .resumo-table-wrapper {
  max-height: 300px;
  margin-top: 10px;
}

body.page-colecoes-pedido-consultar .tabela-pedido-wrapper {
  max-height: 520px;
}

body.page-colecoes-consultar-mix .tabela-colecao-wrapper table,
body.page-colecoes-pedido-cadastrar .tabela-pedido-wrapper table,
body.page-colecoes-pedido-cadastrar .resumo-table-wrapper table,
body.page-colecoes-pedido-consultar .table-resumo,
body.page-colecoes-relatorios table.top5 {
  width: 100%;
  border-collapse: collapse;
}

body.page-colecoes-consultar-mix .tabela-colecao-wrapper th,
body.page-colecoes-consultar-mix .tabela-colecao-wrapper td,
body.page-colecoes-relatorios table.top5 th,
body.page-colecoes-relatorios table.top5 td,
body.page-colecoes-pedido-cadastrar .tabela-pedido-wrapper th,
body.page-colecoes-pedido-cadastrar .tabela-pedido-wrapper td,
body.page-colecoes-pedido-cadastrar .resumo-table-wrapper th,
body.page-colecoes-pedido-cadastrar .resumo-table-wrapper td,
body.page-colecoes-pedido-consultar .table-resumo th,
body.page-colecoes-pedido-consultar .table-resumo td {
  padding: 6px 8px;
  border-bottom: 1px solid #f0f0f0;
}

body.page-colecoes-pedido-cadastrar .tabela-pedido-wrapper th,
body.page-colecoes-pedido-cadastrar .tabela-pedido-wrapper td,
body.page-colecoes-pedido-cadastrar .resumo-table-wrapper th,
body.page-colecoes-pedido-cadastrar .resumo-table-wrapper td {
  padding: 4px 6px;
  font-size: 0.85rem;
  text-align: center;
}

body.page-colecoes-pedido-consultar .table-resumo {
  font-size: 0.9rem;
  margin-top: 12px;
}

body.page-colecoes-pedido-consultar .table-resumo thead th {
  background: #fafafa;
  font-weight: 600;
}

body.page-colecoes-pedido-consultar .table-resumo tbody tr:hover {
  background: #fff7f4;
}

body.page-colecoes-pedido-consultar .link-colecao {
  color: #e0543b;
  text-decoration: none;
  font-weight: 600;
}

body.page-colecoes-pedido-consultar .link-colecao:hover {
  text-decoration: underline;
}

body.page-colecoes-consultar-mix .tabela-colecao-wrapper thead th,
body.page-colecoes-pedido-cadastrar .tabela-pedido-wrapper thead th,
body.page-colecoes-pedido-cadastrar .resumo-table-wrapper thead th {
  position: sticky;
  top: 0;
  background: #fafafa;
  z-index: 2;
}

body.page-colecoes-pedido-cadastrar .resumo-table-wrapper thead th {
  z-index: 1;
}

body.page-colecoes-relatorios .filter-form-rel,
body.page-colecoes-pedido-consultar .filter-form,
body.page-colecoes-pedido-cadastrar .simple-form {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: flex-end;
  margin-bottom: 16px;
}

body.page-colecoes-relatorios .filter-form-rel .form-group,
body.page-colecoes-pedido-consultar .filter-form .form-group,
body.page-colecoes-pedido-cadastrar .simple-form .form-group {
  display: flex;
  flex-direction: column;
  min-width: 200px;
}

body.page-colecoes-relatorios .filter-form-rel .form-group {
  min-width: 220px;
}

body.page-compras-consultar .table-resumo thead th {
  top: 0;
  z-index: 6;
  background: #ffefe8;
}

body.page-compras-consultar .table-resumo th:nth-child(4),
body.page-compras-consultar .table-resumo td:nth-child(4) {
  min-width: 220px;
  max-width: 240px;
  white-space: normal;
  word-break: break-word;
}

body.page-compras-consultar .table-resumo th:nth-child(9),
body.page-compras-consultar .table-resumo td:nth-child(9) {
  white-space: normal;
}

body.page-compras-consultar .table-resumo td:nth-child(9) .d-inline-block {
  display: inline-flex;
  margin-right: 3px;
  margin-bottom: 3px;
  vertical-align: top;
}

body.page-compras-consultar .table-resumo td:nth-child(9) .btn.btn-mini {
  width: auto;
  min-width: 0;
  padding: 1px 6px;
  font-size: 0.68rem;
  line-height: 1.15;
  white-space: nowrap;
}

body.page-lunalo-royalties-fichas .table th,
body.page-lunalo-royalties-fichas .table td {
  white-space: nowrap;
}

/* Cabeçalho mesclado (2 linhas + rowspan): mantém TODO o thead fixo */
body.page-lunalo-royalties-fichas .table thead tr:first-child th {
  top: 0;
  z-index: 6;
  background: #ffefe8;
}

body.page-lunalo-royalties-fichas .table thead tr:nth-child(2) th {
  top: 34px;
  z-index: 5;
  background: #ffefe8;
}

body.page-lunalo-royalties-fichas .table thead th[rowspan] {
  top: 0;
  z-index: 7;
}

body.page-lunalo-royalties-fichas .table th:nth-child(1),
body.page-lunalo-royalties-fichas .table td:nth-child(1) {
  min-width: 90px;
  max-width: 110px;
  white-space: normal;
  word-break: break-word;
}

body.page-lunalo-royalties-fichas .table th:nth-child(3),
body.page-lunalo-royalties-fichas .table td:nth-child(3),
body.page-lunalo-royalties-fichas .table th:nth-child(4),
body.page-lunalo-royalties-fichas .table td:nth-child(4) {
  max-width: 120px;
}

body.page-lunalo-royalties-fichas .table th:nth-child(5),
body.page-lunalo-royalties-fichas .table td:nth-child(5) {
  min-width: 120px;
  max-width: 150px;
  white-space: normal;
  word-break: break-word;
}

body.page-lunalo-royalties-fichas .table .group-th,
body.page-lunalo-royalties-fichas .table .sub-th {
  white-space: normal;
  font-size: 0.76rem;
  line-height: 1.15;
  text-align: center;
}

body.page-lunalo-royalties-fichas .table thead tr:nth-child(2) th:last-child {
  width: 74px;
  white-space: normal;
  line-height: 1.1;
}

body.page-lunalo-royalties-fichas .table th:last-child,
body.page-lunalo-royalties-fichas .table td:last-child {
  white-space: nowrap;
}

.u-inl-roy-delete-form {
  display: inline-flex;
  margin: 0;
}

body.page-lunalo-royalties-form .alert {
  display: inline-flex;
  align-items: center;
  margin: 0 0 12px 0;
  padding: 8px 12px;
  border-radius: 10px;
  font-size: 0.88rem;
  font-weight: 600;
  border: 1px solid rgba(0, 0, 0, 0.06);
}

body.page-lunalo-royalties-form .alert-error {
  background: rgba(220, 53, 69, 0.14);
  border-color: rgba(220, 53, 69, 0.28);
  color: #9f2130;
}

body.page-lunalo-royalties-form .alert-success {
  background: rgba(40, 167, 69, 0.14);
  border-color: rgba(40, 167, 69, 0.24);
  color: #1f6d35;
}

body.page-lunalo-royalties-form .alert:not(.alert-error):not(.alert-success) {
  background: rgba(220, 53, 69, 0.14);
  border-color: rgba(220, 53, 69, 0.28);
  color: #9f2130;
}

body.page-lunalo-royalties-form .roy-anexo-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  white-space: normal;
}

body.page-lunalo-royalties-form .roy-anexo-actions form {
  margin: 0;
}

body.page-lunalo-royalties-form .modal-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.65);
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 9999;
  padding: 18px;
}

body.page-lunalo-royalties-form .modal-backdrop.active {
  display: flex;
}

body.page-lunalo-royalties-form .modal-card {
  width: min(1100px, 96vw);
  height: min(720px, 90vh);
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.35);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

body.page-lunalo-royalties-form .modal-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 14px;
  border-bottom: 1px solid #eee;
  gap: 10px;
  flex-wrap: wrap;
}

body.page-lunalo-royalties-form .modal-title {
  font-weight: 900;
  color: #6b3b22;
  display: flex;
  gap: 10px;
  align-items: center;
  min-width: 280px;
}

body.page-lunalo-royalties-form .modal-title small {
  font-weight: 800;
  color: #777;
}

body.page-lunalo-royalties-form .modal-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
}

body.page-lunalo-royalties-form .modal-body {
  flex: 1;
  background: #fafafa;
  position: relative;
}

body.page-lunalo-royalties-form .modal-iframe {
  width: 100%;
  height: 100%;
  border: 0;
  background: #fff;
}

body.page-lunalo-royalties-form .modal-fallback {
  padding: 16px;
  color: #555;
  font-size: 0.95rem;
  display: none;
}

body.page-lunalo-royalties-form .modal-close {
  border: 0;
  background: #f3e4da;
  color: #6b3b22;
  border-radius: 8px;
  width: 34px;
  height: 34px;
  font-weight: 900;
  cursor: pointer;
}

body.page-colecoes-relatorios .rel-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 8px;
}

body.page-colecoes-relatorios .painel-cards {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 8px;
  margin-bottom: 18px;
}

body.page-colecoes-relatorios .painel-card {
  flex: 1 1 220px;
  border: 1px solid #eee;
  border-radius: 8px;
  padding: 10px 12px;
  background: #fafafa;
}

body.page-colecoes-relatorios .painel-card-title {
  font-size: 0.8rem;
  font-weight: 600;
  color: #555;
  margin-bottom: 4px;
}

body.page-colecoes-relatorios .painel-card-value {
  font-size: 1.3rem;
  font-weight: 700;
  color: #222;
}

body.page-colecoes-relatorios table.top5 {
  margin-top: 10px;
  font-size: 0.9rem;
}

body.page-colecoes-relatorios table.top5 th {
  background: #f5f5f5;
  border-bottom: 1px solid #ddd;
  text-align: left;
}

body.page-colecoes-relatorios .tabs-header,
body.page-colecoes-consultar-mix .tabs-header,
body.page-colecoes-pedido-cadastrar .tabs-header {
  display: flex;
  flex-wrap: wrap;
  margin: 10px 0;
}

body.page-colecoes-relatorios .tabs-header {
  gap: 6px;
  margin: 10px 0 16px 0;
}

body.page-colecoes-consultar-mix .tabs-header,
body.page-colecoes-pedido-cadastrar .tabs-header {
  gap: 4px;
}

body.page-colecoes-pedido-cadastrar .tabs-header {
  margin-bottom: 10px;
}

body.page-colecoes-relatorios .tab-btn,
body.page-colecoes-consultar-mix .tabs-header button,
body.page-colecoes-pedido-cadastrar .tab-btn {
  border: 1px solid #ddd;
  background: #f5f5f5;
  padding: 6px 10px;
  border-radius: 6px;
  cursor: pointer;
  font-size: 0.9rem;
}

body.page-colecoes-relatorios .tab-btn {
  padding: 6px 12px;
}

body.page-colecoes-relatorios .tab-btn.active,
body.page-colecoes-consultar-mix .tabs-header button.active,
body.page-colecoes-pedido-cadastrar .tab-btn.active {
  background: #ff6b6b;
  color: #fff;
  border-color: #ff6b6b;
}

body.page-colecoes-relatorios .tab-pane,
body.page-colecoes-consultar-mix .tab-pane,
body.page-colecoes-pedido-cadastrar .tab-pane {
  display: none;
}

body.page-colecoes-relatorios .tab-pane.active,
body.page-colecoes-consultar-mix .tab-pane.active,
body.page-colecoes-pedido-cadastrar .tab-pane.active {
  display: block;
}

body.page-colecoes-pedido-cadastrar .tab-pane {
  margin-top: 10px;
}

body.page-colecoes-consultar-mix .foto-produto-thumb {
  max-width: 80px;
  max-height: 80px;
  object-fit: contain;
  border-radius: 4px;
  border: 1px solid #eee;
}

body.page-colecoes-pedido-cadastrar .foto-produto-thumb {
  max-width: 70px;
  max-height: 70px;
  object-fit: contain;
  border-radius: 4px;
  border: 1px solid #eee;
  cursor: pointer;
}

body.page-colecoes-consultar-mix .thumb-button,
body.page-colecoes-pedido-cadastrar .thumb-button {
  border: none;
  background: transparent;
  padding: 0;
  cursor: pointer;
}

body.page-colecoes-consultar-mix .lightbox-backdrop,
body.page-colecoes-pedido-cadastrar .lightbox-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.8);
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 9999;
}

body.page-colecoes-consultar-mix .lightbox-backdrop.active,
body.page-colecoes-pedido-cadastrar .lightbox-backdrop.active {
  display: flex;
}

body.page-colecoes-consultar-mix .lightbox-inner,
body.page-colecoes-pedido-cadastrar .lightbox-inner {
  position: relative;
  max-width: 90vw;
  max-height: 90vh;
}

body.page-colecoes-consultar-mix .lightbox-image,
body.page-colecoes-pedido-cadastrar .lightbox-image {
  border-radius: 12px;
  box-shadow: 0 10px 30px rgba(0,0,0,0.5);
  display: block;
  margin: 0 auto;
  object-fit: contain;
}

body.page-colecoes-consultar-mix .lightbox-image {
  max-width: 70vw;
  max-height: 70vh;
}

body.page-colecoes-pedido-cadastrar .lightbox-image {
  max-width: 80vw;
  max-height: 80vh;
}

body.page-colecoes-consultar-mix .lightbox-close,
body.page-colecoes-pedido-cadastrar .lightbox-close {
  position: absolute;
  top: -12px;
  right: -12px;
  background: #ffffff;
  color: #333;
  border-radius: 999px;
  width: 28px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  cursor: pointer;
  box-shadow: 0 4px 10px rgba(0,0,0,0.3);
}

body.page-colecoes-consultar-mix .lightbox-caption,
body.page-colecoes-pedido-cadastrar .lightbox-caption {
  margin-top: 8px;
  text-align: center;
  color: #f5f5f5;
  font-size: 0.9rem;
}

body.page-colecoes-pedido-cadastrar .input-qtd {
  width: 40px;
  text-align: center;
  font-size: 0.8rem;
}

body.page-colecoes-pedido-cadastrar .linha-invalida td {
  background: #ffe5e5;
  color: #b00020;
}

body.page-colecoes-pedido-cadastrar .linha-invalida .cell-pares {
  font-weight: bold;
}

body.page-colecoes-pedido-cadastrar .resumo-compra {
  margin-top: 10px;
  margin-bottom: 10px;
}

body.page-colecoes-pedido-cadastrar .resumo-totais p {
  margin: 0 12px 4px 0;
  display: inline-block;
  font-size: 0.9rem;
}

body.page-colecoes-pedido-cadastrar .form-actions-fornecedor {
  margin-top: 18px;
  text-align: right;
  padding-right: 8px;
}

body.page-colecoes-pedido-cadastrar .btn-salvar-fornecedor {
  font-size: 1rem;
  padding: 10px 22px;
  border-radius: 6px;
  background: #ff6b6b;
  border-color: #ff6b6b;
  color: #fff;
}

body.page-colecoes-pedido-cadastrar .btn-salvar-fornecedor[disabled] {
  opacity: 0.5;
  cursor: not-allowed;
}

body.page-colecoes-pedido-cadastrar .grade-container {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: flex-end;
}

body.page-colecoes-pedido-cadastrar .grade-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  font-size: 0.75rem;
}

body.page-colecoes-pedido-cadastrar .grade-item label {
  font-weight: 600;
  margin-bottom: 2px;
}

/* Utilitários compartilhados entre telas colecoes_* */
.colecoes-text-left {
  text-align: left;
}

.colecoes-text-right {
  text-align: right;
}

.colecoes-td-center {
  text-align: center;
}

.colecoes-th-id {
  width: 30px;
  text-align: left;
}

.colecoes-th-left {
  text-align: left;
}

.colecoes-th-status {
  width: 100px;
  text-align: center;
}

.colecoes-th-bloqueio {
  width: 120px;
  text-align: center;
}

.colecoes-mt-8 {
  margin-top: 8px;
}

.colecoes-mt-10 {
  margin-top: 10px;
}

.colecoes-mt-12 {
  margin-top: 12px;
}

.colecoes-mb-8 {
  margin-bottom: 8px;
}

.colecoes-help-sm,
.colecoes-help-md {
  color: #666;
  margin-top: 6px;
}

.colecoes-help-sm {
  font-size: 0.8rem;
}

.colecoes-help-md {
  font-size: 0.85rem;
}

.colecoes-h3 {
  margin-bottom: 10px;
}

.colecoes-h3-md {
  font-size: 1rem;
  margin-bottom: 8px;
}

.colecoes-h4-top {
  margin-top: 6px;
}

.colecoes-alert-danger {
  padding: 10px 14px;
  border-radius: 6px;
  background-color: #ffdddd;
  color: #a30000;
  margin-bottom: 16px;
  border: 1px solid #cc0000;
}

/* Marca d'água central (logo grande) */
.watermark {
  position: absolute;
  inset: 80px 120px 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0.20;
  pointer-events: none;
}

.watermark-inner img {
  max-width: 800px;
  width: 90%;
  opacity: 0.9;
}

/* =========================================
   BOTÕES GERAIS (PÁGINAS INTERNAS)
   ========================================= */
.btn-secondary {
  background: #ffffff;
  border: 1px solid rgba(0,0,0,0.12);
  color: var(--text-main);
  border-radius: 999px;
  padding: 7px 16px;
  text-decoration: none;
  font-size: 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.btn-secondary:hover {
  background: #f4f1ee;
}

.link-small {
  font-size: 12px;
  color: var(--orange);
  text-decoration: none;
}

.link-small:hover {
  text-decoration: underline;
}

/* =========================================
   ALERTAS
   ========================================= */
.alert {
  padding: 10px 14px;
  border-radius: 8px;
  margin-bottom: 16px;
  font-size: 13px;
}

.alert-success {
  background: #e4f6e8;
  color: #2f7a3e;
}

.alert-error {
  background: #fbe3e4;
  color: #c5393b;
}

/* =========================================
   LAYOUT CABEÇALHO / FILTROS / TABELA (FORNECEDORES)
   ========================================= */
.page-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 18px;
}

.page-header-actions {
  display: flex;
  gap: 8px;
  align-items: center;
}

/* Barra de filtros em tela única */
.filter-bar {
  display: flex;
  gap: 16px;
  align-items: flex-end;
  background: #fff7f2;
  padding: 12px 16px;
  border-radius: 14px;
  border: 1px solid rgba(0,0,0,0.04);
  margin-bottom: 16px;
}

.filter-group {
  display: flex;
  flex-direction: column;
  font-size: 13px;
}

.filter-group label {
  margin-bottom: 4px;
}

.filter-group input {
  padding: 7px 10px;
  border-radius: 8px;
  border: 1px solid rgba(0,0,0,0.09);
  font-size: 14px;
  outline: none;
}

.filter-group input:focus {
  border-color: rgba(0,0,0,0.35);
}

.filter-actions {
  display: flex;
  gap: 8px;
}

/* Tabela com header sticky (tipo “congelar painel”) */
.table-wrapper {
  max-height: 520px;
  overflow: auto;
  border-radius: 14px;
  border: 1px solid rgba(0,0,0,0.06);
  background: #ffffff;
}

.table {
  border-collapse: collapse;
  font-size: 13px;
}

.table th,
.table td {
  padding: 8px 10px;
  border-bottom: 1px solid rgba(0,0,0,0.03);
  text-align: left;
}

/* header fixo ao rolar */
.table-sticky thead th {
  position: sticky;
  top: 0;
  background: #ffe1d7;
  color: #4A3B34;
  z-index: 2;
}

.table-wrapper-narrow {
  max-width: 100px;   /* controla o "quão junta" a tabela fica */
  margin: 0 auto;     /* centraliza dentro do card */
}

.table-compact th,
.table-compact td {
  padding: 6px 10px;
}



/* =========================================
   FORMULÁRIOS (CADASTRO / IMPORTAÇÃO)
   ========================================= */
.form-grid {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.form-row {
  display: flex;
  flex-direction: column;
}

.form-row label {
  font-size: 13px;
  margin-bottom: 4px;
}

.form-row input {
  padding: 8px 10px;
  border-radius: 8px;
  border: 1px solid rgba(0,0,0,0.12);
  font-size: 14px;
  outline: none;
}

.form-row input:focus {
  border-color: rgba(0,0,0,0.35);
}

.form-separator {
  border: none;
  border-top: 1px dashed rgba(0,0,0,0.08);
  margin: 12px 0;
}

.form-actions {
  margin-top: 10px;
  display: flex;
  gap: 10px;
}

/* Bloco de resultado da importação XML */
.import-result {
  margin-top: 10px;
  padding: 12px 14px;
  border-radius: 10px;
  background: #fff7f2;
  border: 1px dashed rgba(0,0,0,0.08);
  font-size: 13px;
}

/* =========================================
   BADGES (se quiser usar depois)
   ========================================= */
.badge {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 11px;
}

.badge-success {
  background: #e4f6e8;
  color: #2f7a3e;
}

.badge-muted {
  background: #ececec;
  color: #666666;
}

/* =========================================
   RESPONSIVIDADE BÁSICA
   ========================================= */
@media (max-width: 900px) {
  .app-main {
  padding: 42px 72px;
  position: relative;
  flex: 1 0 auto;            /* <--- ocupa o espaço central */
  }

  .header {
    padding: 0 14px;
  }

  .dashboard-grid,
  .grid,
  .main-layout {
    flex-direction: column;
    align-items: stretch;
  }

  .watermark {
    inset: 90px 20px 40px;
  }

  .filter-bar {
    flex-direction: column;
    align-items: stretch;
  }
}

@media (max-width: 1320px) {
  body.page-pre-index .preindex-grid {
    grid-template-columns: repeat(3, minmax(180px, 1fr));
  }
}

@media (max-width: 1180px) {
  body.page-index .main-layout,
  body.page-index-fin .main-layout {
    grid-template-columns: repeat(2, minmax(260px, 1fr));
  }
}

@media (max-width: 860px) {
  body.page-pre-index .preindex-grid {
    grid-template-columns: repeat(2, minmax(180px, 1fr));
  }
}

@media (max-width: 680px) {
  body.page-index .main-layout,
  body.page-index-fin .main-layout {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 560px) {
  body.page-pre-index .preindex-grid {
    grid-template-columns: 1fr;
  }
}

/* =========================================
   ASCONT — UTILITÁRIOS COMPARTILHADOS
   ========================================= */

/* Layout principal */
.page-wrapper {
  flex: 1;
  width: 100%;
  max-width: 1600px;
  margin: 0 auto;
  padding: 24px 32px;
  box-sizing: border-box;
}

/* Sobrescreve max-height do .table-wrapper para páginas ascont */
body[class*="page-ascont"] .table-wrapper {
  max-height: none;
  overflow-x: auto;
  overflow-y: visible;
  border-radius: 8px;
  border: 1px solid #eee;
  background: #fff;
  margin: 12px 0 20px 0;
}

/* Títulos h1 em ascont com tamanho maior */
body[class*="page-ascont"] h1.section-title {
  font-size: 1.25rem;
}

/* ---- Tabs ---- */
.tabs-header {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 10px 0 16px 0;
  position: sticky;
  top: 0;
  z-index: 10;
  background: #fff;
  padding: 10px 0 6px 0;
}
.tab-btn {
  border: 1px solid #ddd;
  background: #f5f5f5;
  padding: 6px 12px;
  border-radius: 6px;
  cursor: pointer;
  font-size: 0.9rem;
}
.tab-btn.active {
  background: #ff6b6b;
  color: #fff;
  border-color: #ff6b6b;
}
.tab-pane { display: none; padding-top: 10px; width: 100%; }
.tab-pane.active { display: block; }

/* ---- Botões (.btn base + .btn-primary) ---- */
.btn {
  padding: 8px 12px;
  border-radius: 8px;
  border: 1px solid #ddd;
  cursor: pointer;
  font-weight: 700;
  font-size: 0.86rem;
  background: #fff;
}
.btn-primary {
  background: #ff6b6b;
  border-color: #ff6b6b;
  color: #fff;
}
/* .btn-secondary quadrado para contextos ascont */
body[class*="page-ascont"] .btn-secondary {
  border-radius: 8px;
  background: #f4f4f4;
  color: #333;
  border-color: #ddd;
  padding: 8px 12px;
  font-weight: 700;
  font-size: 0.86rem;
}

/* ---- Filtros ---- */
.filters-row {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 14px;
  align-items: flex-end;
}
.filters-row .field-group {
  display: flex;
  flex-direction: column;
  min-width: 200px;
}
.filters-row label {
  font-size: 0.8rem;
  margin-bottom: 4px;
  color: #555;
}
.filters-row input[type="date"],
.filters-row input[type="text"],
.filters-row select {
  padding: 6px 8px;
  border-radius: 4px;
  border: 1px solid #ccc;
  font-size: 0.95rem;
}
.filters-row button {
  padding: 8px 14px;
  border-radius: 4px;
  border: none;
  font-size: 0.9rem;
  cursor: pointer;
}
.filter-form {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  align-items: flex-end;
  margin-bottom: 16px;
}
.filter-form .form-group {
  display: flex;
  flex-direction: column;
  min-width: 200px;
}

/* ---- Flash / Alert variants ---- */
.flash { padding: 10px 12px; border-radius: 8px; margin: 10px 0; font-size: 0.9rem; }
.flash-success { background: #e8fff1; border: 1px solid #b9f2cf; }
.flash-error   { background: #ffe8e8; border: 1px solid #ffb3b3; color: #a00; }
.flash-warning { background: #fff7e0; border: 1px solid #ffeb99; }
.alert-info    { background: #e8f4ff; border: 1px solid #c3ddff; }
.alert-warning { background: #fff7e0; border: 1px solid #ffeb99; }

/* ---- Helpers ---- */
.helper-text { font-size: 0.8rem; color: #777; margin-top: 4px; }
.muted { color: #888; }
.cell-str { white-space: nowrap; }
.cell-wrap { white-space: normal; }
.placeholder {
  padding: 14px 16px;
  border-radius: 8px;
  background: #f7f7f7;
  border: 1px dashed #ddd;
  color: #666;
  font-size: 0.9rem;
}

.mb-10 { margin-bottom: 10px; }
.mt-6 { margin-top: 6px; }
.mt-8 { margin-top: 8px; }
.mt-10 { margin-top: 10px; }
.m-0 { margin: 0; }
.p-0 { padding: 0; }

.min-w-160 { min-width: 160px !important; }
.min-w-260 { min-width: 260px !important; }

.inline-wrap-gap-8 {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.filter-form-inline {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  align-items: flex-end;
}

.form-actions-inline {
  display: flex;
  align-items: center;
  gap: 10px;
}

.text-80 { font-size: 0.8rem; }
.text-82 { font-size: 0.82rem; }
.lh-135 { line-height: 1.35; }

.w-20 { width: 20%; }
.w-55 { width: 55%; }
.w-70 { width: 70px; }
.w-80 { width: 80px; }
.w-90 { width: 90px; }
.w-110 { width: 110px; }
.w-120 { width: 120px; }
.w-130 { width: 130px; }
.w-140 { width: 140px; }
.w-160 { width: 160px; }

.nested-table-wrapper {
  margin: 0;
  border-radius: 0;
  border-left: none;
  border-right: none;
}

.row-total-strong {
  font-weight: 700;
  border-top: 2px solid #333;
}

/* ---- KPI cards ---- */
.kpi-grid-4 {
  display: grid;
  grid-template-columns: repeat(4, minmax(240px, 1fr));
  gap: 12px;
  margin-bottom: 10px;
}
@media (max-width: 1100px) {
  .kpi-grid-4 { grid-template-columns: repeat(2, minmax(240px, 1fr)); }
}
@media (max-width: 620px) {
  .kpi-grid-4 { grid-template-columns: 1fr; }
}
.kpi-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(200px, 1fr));
  gap: 10px;
  margin: 10px 0 16px 0;
}
@media (max-width: 1200px) {
  .kpi-grid { grid-template-columns: repeat(2, minmax(200px, 1fr)); }
}
@media (max-width: 700px) {
  .kpi-grid { grid-template-columns: 1fr; }
}
.kpi-card {
  border-radius: 8px;
  border: 1px solid #eee;
  padding: 10px 12px;
  background: #fff;
  min-height: 120px;
}
.kpi-head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 6px;
}
.kpi-tag {
  display: inline-block;
  padding: 3px 8px;
  border-radius: 6px;
  font-size: 0.75rem;
  font-weight: 800;
  color: #fff;
  letter-spacing: 0.2px;
}
.tag-a { background: #2e7d32; }
.tag-b { background: #1976d2; }
.tag-c { background: #6a1b9a; }
.tag-d { background: #f57c00; }
.kpi-title  { font-size: 0.85rem; font-weight: 700; color: #444; }
.kpi-label  { font-size: 0.78rem; color: #666; font-weight: 700; margin-bottom: 6px; }
.kpi-value  { font-size: 1.05rem; font-weight: 800; }
.kpi-lines  { margin-top: 6px; }
.kpi-line {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  font-size: 0.88rem;
  padding: 3px 0;
  border-bottom: 1px dashed #eee;
}
.kpi-line:last-child { border-bottom: none; }
.kpi-line .lbl { color: #666; }
.kpi-line .val { font-weight: 700; color: #111; }
.kpi-vendedores { margin-top: 8px; padding-top: 8px; border-top: 1px solid #eee; }
.kpi-vendedores-title { font-size: 0.78rem; color: #777; font-weight: 700; margin-bottom: 6px; }
.kpi-compare { margin-top: 6px; }
.kpi-compare-table { width: 100%; border-collapse: collapse; font-size: 0.82rem; }
.kpi-compare-table thead th {
  text-align: right;
  font-weight: 800;
  color: #444;
  padding: 4px 0 6px 0;
  border-bottom: 1px solid #eee;
}
.kpi-compare-table thead th:first-child { text-align: left; }
.kpi-compare-table tbody td {
  padding: 3px 0;
  border-bottom: 1px dashed #eee;
  vertical-align: top;
}
.kpi-compare-table tbody tr:last-child td { border-bottom: none; }
.kpi-compare-table td.lbl { color: #666; text-align: left; padding-right: 8px; }
.kpi-compare-table td.val { text-align: right; font-weight: 700; color: #111; font-variant-numeric: tabular-nums; }
.vend-line { display: flex; justify-content: space-between; gap: 10px; font-size: 0.85rem; padding: 2px 0; }
.vend-line .nome  { color: #444; }
.vend-line .total { font-weight: 700; color: #111; }

/* ---- Blocos de loja ---- */
.loja-block    { margin: 18px 0 28px 0; }
.loja-title    { font-size: 1.05rem; font-weight: 700; margin: 0 0 10px 0; }
.loja-subtitle { font-size: 0.85rem; color: #666; margin: 0 0 12px 0; }
.fechamento-block { margin: 24px 0 36px 0; }

/* ---- Gráfico ---- */
.chart-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(260px, 1fr));
  gap: 12px;
}
@media (max-width: 900px) {
  .chart-grid { grid-template-columns: 1fr; }
}
.chart-card  { border-radius: 8px; border: 1px solid #eee; padding: 10px 12px; background: #fff; }
.chart-title { font-size: 0.95rem; font-weight: 700; margin: 0 0 8px 0; }
.chart-img   { width: 100%; height: auto; display: block; border-radius: 6px; }
.chart-wrap  { margin-top: 12px; }
.chart-wrap img { max-width: 100%; border-radius: 8px; border: 1px solid #eee; background: #fafafa; }

/* ---- Tabelas (ascont) ---- */
table.table-resumo {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.85rem;
}
table.table-resumo th,
table.table-resumo td {
  padding: 8px 10px;
  border-bottom: 1px solid #eee;
  text-align: left;
  vertical-align: top;
}
table.table-resumo th { background: #ffefe8; font-weight: 700; }
table.table-resumo tbody tr:nth-child(even) { background: #fafafa; }
table.table-resumo tbody tr:hover { background: #fff7f4; }

table.simple-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.85rem;
}
table.simple-table th,
table.simple-table td {
  padding: 6px 8px;
  border-bottom: 1px solid #eee;
  text-align: left;
}
table.simple-table th { background: #ffefe8; font-weight: 600; }
table.simple-table tbody tr:nth-child(even) { background: #fafafa; }

/* ---- Sale rows ---- */
.sale-row  { background: #fff7f4; }
.sale-head { display: flex; flex-wrap: wrap; gap: 10px; align-items: baseline; font-weight: 700; }
.sale-meta { font-weight: 600; color: #333; }
.sale-small { font-weight: 600; color: #666; font-size: 0.82rem; }
.sale-subline {
  display: block;
  margin-top: 2px;
  line-height: 1.3;
  white-space: normal;
  word-break: break-word;
}
.mix-thumb { max-width: 60px; max-height: 60px; cursor: pointer; border-radius: 6px; border: 1px solid #eee; background: #fff; }
.thumb { width: 48px; height: 48px; object-fit: cover; border-radius: 6px; border: 1px solid #eee; cursor: pointer; }

/* ---- DRE ---- */
.dre-table { width: 100%; border-collapse: collapse; font-size: 0.9rem; margin-top: 8px; }
.dre-table th,
.dre-table td { padding: 8px 10px; border-bottom: 1px solid #eee; text-align: left; vertical-align: middle; }
.dre-table thead th { background: #ffefe8; font-weight: 700; }
.dre-num  { text-align: right; white-space: nowrap; }
.row-group td { font-weight: 800; background: #fafafa; }
.row-cat  td  { font-weight: 700; }
.row-type td  { font-weight: 400; }
.indent-1 { padding-left: 16px !important; }
.indent-2 { padding-left: 28px !important; }

/* ---- Badges / status ---- */
.status-badge {
  display: inline-block;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.3px;
  text-transform: uppercase;
  color: #fff;
  line-height: 1;
}
.status-ok  { background: #2e7d32; }
.status-bad { background: #d32f2f; }
.tag-integracao {
  display: inline-block;
  padding: 3px 8px;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 800;
  color: #fff;
  line-height: 1;
  white-space: nowrap;
}
.tag-ok  { background: #28a745; }
.tag-bad { background: #dc3545; }

/* ---- Metas / comissões ---- */
.metas-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(520px, 1fr));
  gap: 16px;
  margin-bottom: 10px;
}
@media (max-width: 1100px) {
  .metas-grid { grid-template-columns: 1fr; }
}
.meta-card { border: 1px solid #eee; border-radius: 8px; padding: 14px 16px; background: #fff; }
.meta-header {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 10px;
}
.meta-title { font-size: 1.05rem; font-weight: 700; }
.meta-info  { font-size: 0.85rem; color: #555; }
body.page-metricas-index .meta-body {
  display: block;
}
body.page-metricas-index .meta-main {
  min-width: 0;
}
body.page-metricas-index .meta-form-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(160px, 1fr));
  gap: 10px 12px;
  margin: 10px 0 8px 0;
}
body.page-metricas-index .meta-card .field-group {
  display: flex;
  flex-direction: column;
}
body.page-metricas-index .meta-card .field-group label {
  font-size: 0.76rem;
  margin-bottom: 4px;
  color: #555;
}
body.page-metricas-index .meta-card .field-group input {
  padding: 6px 8px;
  border-radius: 4px;
  border: 1px solid #ccc;
  font-size: 0.9rem;
}
body.page-metricas-index .meta-actions {
  display: flex;
  justify-content: flex-start;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 2px;
}
body.page-metricas-index .meta-import-form {
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px dashed #ead7cf;
}
body.page-metricas-index .meta-import-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px 12px;
  align-items: end;
}
body.page-metricas-index .meta-import-actions {
  display: flex;
  align-items: flex-end;
}
body.page-metricas-index .meta-summary-text {
  margin-top: 8px;
  line-height: 1.35;
}
body.page-metricas-index .meta-chart-modal-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.55);
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 9999;
  padding: 18px;
}
body.page-metricas-index .meta-chart-modal-card {
  width: min(980px, 96vw);
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 10px 30px rgba(0,0,0,0.32);
  overflow: hidden;
}
body.page-metricas-index .meta-chart-modal-card .modal-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 14px;
  border-bottom: 1px solid #eee;
  gap: 10px;
  flex-wrap: wrap;
}
body.page-metricas-index .meta-chart-modal-card .modal-title {
  font-weight: 900;
  color: #6b3b22;
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
}
body.page-metricas-index .meta-chart-modal-card .modal-title small {
  font-weight: 700;
  color: #777;
}
body.page-metricas-index .meta-chart-modal-body {
  padding: 14px;
  display: flex;
  justify-content: center;
  align-items: center;
  background: #fffdfb;
}
body.page-metricas-index .meta-chart-modal-body img {
  width: 100%;
  max-width: 920px;
  height: auto;
  display: block;
  border: 1px solid #eee;
  border-radius: 10px;
  background: #fafafa;
}
@media (max-width: 1180px) {
  body.page-metricas-index .meta-form-grid {
    grid-template-columns: repeat(2, minmax(160px, 1fr));
  }
}
@media (max-width: 720px) {
  body.page-metricas-index .meta-form-grid {
    grid-template-columns: 1fr;
  }
  body.page-metricas-index .meta-import-row {
    grid-template-columns: 1fr;
  }
}
body.page-ascont-vendas-metas .form-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 12px;
  margin: 10px 0 12px 0;
}
body.page-ascont-vendas-metas .field-group { display: flex; flex-direction: column; }
body.page-ascont-vendas-metas .field-group label { font-size: 0.78rem; margin-bottom: 4px; color: #555; }
body.page-ascont-vendas-metas .field-group input {
  padding: 6px 8px;
  border-radius: 4px;
  border: 1px solid #ccc;
  font-size: 0.92rem;
}

/* ---- Modal de imagem (compartilhado) ---- */
.img-modal {
  display: none;
  position: fixed;
  z-index: 9999;
  inset: 0;
  background: rgba(0, 0, 0, 0.7);
  align-items: center;
  justify-content: center;
}
.img-modal.open { display: flex; }
.img-modal-img {
  max-width: 90vw;
  max-height: 90vh;
  border-radius: 8px;
  background: #fff;
  padding: 8px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4);
}
.img-modal-close {
  position: absolute;
  top: 16px;
  right: 24px;
  color: #fff;
  font-size: 32px;
  font-weight: bold;
  cursor: pointer;
  border: none;
  background: none;
}

/* ====================================================================
   MÓDULO: COMPRAS — status, badges, tabelas, modais
   ==================================================================== */

/* ---- status tags compras ---- */
.status-tag {
  display: inline-block;
  padding: 3px 6px;
  border-radius: 4px;
  font-size: 0.78rem;
  font-weight: 600;
  color: #fff;
}

/* Compra: 0=Lançada  1=Recebida  2=Recusada */
.st-lancada  { background: #007bff; }
.st-recebida { background: #28a745; }
.st-recusada { background: #dc3545; }

/* Royalties: 0=Previsto  1=Devido  2=Faturado  3=Indevido */
.st-roy-0 { background: #6c757d; }
.st-roy-1 { background: #ffc107; color: #000; }
.st-roy-2 { background: #28a745; }
.st-roy-3 { background: #dc3545; }

/* ---- links e botões compras ---- */
.link-nota { color: #e0543b; text-decoration: none; font-weight: 600; }
.link-nota:hover { text-decoration: underline; }

.btn-mini  { padding: 2px 6px; font-size: 0.75rem; cursor: pointer; }
.btn-small { padding: 4px 8px; font-size: 0.78rem; cursor: pointer; border-radius: 4px; }
.btn-ajustar { background: #ffae00; color: #000; }
.btn-cancel  { background: #ccc; color: #000; }
.btn-danger  { background: #f0cfcf; color: #874141; border: 1px solid #e3b1b1; }
.btn-warning { background: #e6b800; color: #000; }
.btn-success { background: #28a745; color: #fff; }

/* ---- utilitários extras ---- */
.d-inline-block { display: inline-block; }
.d-inline { display: inline; }
.text-nowrap { white-space: nowrap; }
.text-left { text-align: left; }
.text-center { text-align: center; }
.text-right { text-align: right; }
.mt-12 { margin-top: 12px; }
.mt-10 { margin-top: 10px; }
.mb-10 { margin-bottom: 10px; }
.mb-16 { margin-bottom: 16px; }
.ml-4  { margin-left: 4px; }
.ml-8  { margin-left: 8px; }
.w-60 { width: 60px; }
.w-70 { width: 70px; }
.w-90 { width: 90px; }
.w-100 { width: 100px; }
.w-110 { width: 110px; }
.w-120 { width: 120px; }
.w-130 { width: 130px; }
.w-140 { width: 140px; }
.pt-5  { padding-top: 5px; }
.text-90  { font-size: 0.9rem; }
.muted-sm { color: #999; font-size: 0.8rem; }
.text-hint { font-size: 0.85rem; color: #6b6b6b; margin-bottom: 10px; }
.flex-end-mt6 { display: flex; justify-content: flex-end; margin-top: 6px; }
.d-none { display: none !important; }

/* ---- detalhar compra ---- */
.compra-header {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 8px 24px;
  margin-bottom: 16px;
  font-size: 0.95rem;
}
.compra-header strong { font-weight: 600; }

.totais-box {
  margin-top: 8px;
  margin-bottom: 16px;
  border: 1px solid #eee;
  border-radius: 8px;
  padding: 12px;
  background: #fafafa;
  width: 100%;
  max-width: 520px;
}
.totais-box table { width: 100%; font-size: 0.9rem; border-collapse: collapse; }
.totais-box td { padding: 4px 2px; }
.totais-box td:first-child { font-weight: 600; }
.totais-box td:last-child  { text-align: right; font-weight: 600; }
.total-geral {
  font-size: 1.05rem;
  font-weight: bold !important;
  padding-top: 6px;
  border-top: 1px solid #ccc;
}

.tabela-itens-wrapper {
  max-height: 520px;
  overflow-y: auto;
  border-radius: 8px;
  border: 1px solid #eee;
}
.table-itens { width: 100%; border-collapse: collapse; font-size: 0.9rem; }
.table-itens th,
.table-itens td { padding: 6px 8px; border-bottom: 1px solid #eee; vertical-align: middle; }
.table-itens thead th {
  background: #fafafa;
  position: sticky;
  top: 0;
  z-index: 1;
  font-weight: 600;
}
.table-itens tbody tr:hover { background: #fff7f4; }

.foto-mix {
  max-width: 70px;
  max-height: 70px;
  border-radius: 6px;
  object-fit: cover;
  border: 1px solid #eee;
  cursor: pointer;
}

/* ---- modais genéricos (senha, confirmação) ---- */
.modal-overlay {
  display: none;
  position: fixed;
  left: 0; top: 0;
  width: 100%; height: 100%;
  background: rgba(0,0,0,0.4);
  align-items: center;
  justify-content: center;
  z-index: 1000;
}
.modal-overlay.open { display: flex; }

.modal-box {
  background: #fff;
  padding: 20px;
  border-radius: 8px;
  width: 300px;
  text-align: center;
  box-shadow: 0 4px 12px rgba(0,0,0,0.25);
}
.modal-box input {
  width: 100%;
  padding: 6px 8px;
  margin-top: 8px;
  border: 1px solid #ccc;
  border-radius: 4px;
}

/* ---- lançar compra ---- */
.price-input {
  width: 110px;
  padding: 4px 6px;
  border: 1px solid #d4d4d4;
  border-radius: 4px;
  font-size: 0.85rem;
  background: #fff;
}

.badge-alert {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 999px;
  background: #ffe3e3;
  color: #b00000;
  font-size: 0.75rem;
  font-weight: 600;
}
.badge-ok {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 999px;
  background: #e6f7ec;
  color: #137333;
  font-size: 0.75rem;
  font-weight: 600;
}

.xml-info {
  background: #fff5ed;
  border: 1px solid #f5c69c;
  border-radius: 6px;
  padding: 10px;
  margin: 10px 0;
  font-size: 0.85rem;
}
.check-inline {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 0.78rem;
  margin-top: 6px;
}
.luzcamila-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 14px;
}
.luzcamila-ascont {
  font-size: 0.75rem;
  color: #5f5f5f;
  line-height: 1.2;
}
.luz-summary-grid,
.xml-summary-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 12px;
}
.data-table { width: 100%; border-collapse: collapse; font-size: 0.88rem; }
.data-table th,
.data-table td { border: 1px solid #f0d4c1; padding: 6px; vertical-align: middle; }

.table-scroll { overflow-x: auto; margin-top: 10px; }

.foto-produto { width: 55px; height: auto; cursor: pointer; border-radius: 4px; }

.resumo-box p { margin: 4px 0; font-size: 0.88rem; }

/* modais de ajuste/inclusão de mix */
#modalMix,
#modalIncluirMix,
#modalAlterarMix {
  display: none;
  position: fixed;
  top: 0; left: 0;
  width: 100%; height: 100%;
  background: rgba(0,0,0,0.6);
  justify-content: center;
  align-items: center;
  z-index: 10000;
}
.modal-mix-box {
  background: #fff;
  width: 320px;
  padding: 20px;
  border-radius: 8px;
  box-shadow: 0 4px 10px rgba(0,0,0,0.35);
}
.modal-mix-box input {
  width: 100%;
  margin-top: 10px;
  padding: 6px;
  border-radius: 4px;
  border: 1px solid #ccc;
}
.modal-mix-buttons {
  margin-top: 14px;
  display: flex;
  justify-content: space-between;
}

/* lightbox compras lançar */
.lightbox-overlay {
  position: fixed;
  top: 0; left: 0;
  width: 100%; height: 100%;
  background: rgba(0,0,0,0.85);
  display: none;
  justify-content: center;
  align-items: center;
  z-index: 9999;
}
.lightbox-overlay img {
  max-width: 90%;
  max-height: 90%;
  border-radius: 8px;
  box-shadow: 0 0 20px #000;
}
.lightbox-overlay.active { display: flex; }

/* flash messages lançar */
.flash-container { margin-bottom: 10px; }
.flash-message {
  padding: 8px 10px;
  border-radius: 4px;
  font-size: 0.85rem;
  margin-bottom: 4px;
}

/* crosscheck divergências */
.crosscheck-alert {
  background: #ffeaea;
  border: 1px solid #ff6b6b;
  padding: 12px;
  border-radius: 6px;
}
.crosscheck-alert h4 { color: #b30000; margin: 0 0 8px; }








/* ===== Auto-generated inline replacements ===== */
.u-inl-002535c2 { margin-top:12px; }
.u-inl-0291ed2a { display:flex; gap:10px; align-items:flex-start; }
.u-inl-03fe7b2b { background:#ffeaea; border:1px solid #ff6b6b; padding:12px; border-radius:6px; }
.u-inl-0823832c { padding-top: 5px; }
.u-inl-088cf005 { width:120px; }
.u-inl-0aa03a1f { width:100%; font-size:14px; }
.u-inl-0ebda551 { font-size: 12px; margin: 0 0 10px 0; }
.u-inl-0ec941ba { flex:1; min-width:260px; }
.u-inl-1063ec35 { font-size:12px; opacity:.85; margin-top:6px; }
.u-inl-13076d95 { text-align:center; }
.u-inl-1386d503,
.text-no-margin { margin:0; }
.u-inl-1700a878 { align-items:flex-end; margin-bottom:6px; }
.u-inl-1a30558f { width:110px; }
.u-inl-1c3507fe { margin:0; min-width:220px; }
.u-inl-1dae425a { display:flex; gap:10px; align-items:flex-end; flex-wrap:wrap; }
.u-inl-200a92a0 { text-align:left; }
.u-inl-2519520b { min-height:0; }
.u-inl-25546138 { font-size:0.9rem; }
.u-inl-25feffff { width:10%; }
.u-inl-291674de { width:300px; }
.u-inl-2e000f1a,
.row-align-end { align-items:flex-end; }
.u-inl-2f01efdd { width:140px; }
.u-inl-2fb4b090 { color:#b30000; margin:0 0 8px; }
.u-inl-35041100 { margin:10px 0 4px; }
.u-inl-36b745ae,
.actions-right { justify-content:flex-end; }
.u-inl-376fbf3d { width: 100px; text-align: center; }
.u-inl-38861b51 { display:flex; gap:8px; }
.u-inl-3adafda6 { align-self:flex-end; }
.u-inl-3ae1f62a { margin-top:20px; }
.u-inl-41f96333 { font-size:12px; margin-top:4px; }
.u-inl-4694d62a { min-width:220px; }
.u-inl-4a909ea7 { margin-top:18px; }
.u-inl-4a93029a { min-width:140px; }
.u-inl-4af93119,
.page-header-row { display:flex; justify-content:space-between; align-items:flex-end; gap:10px; flex-wrap:wrap; }
.u-inl-4c672c49 { margin:0 0 8px 0; }
.u-inl-4de99d3b { margin-top: 16px; }
.u-inl-518cc756 { width:60%; }
.u-inl-5371db16 { margin-top:10px; }
.u-inl-54c1782f { width: 60px; text-align:left; }
.u-inl-5677b988 { display:inline; }
.u-inl-57ce1f1b { padding:0; }
.u-inl-581155ec { font-size:1rem; margin-top:12px; margin-bottom:8px; }
.u-inl-59c8d6ff { width:30%; }
.u-inl-5bcd7add { margin-top: 12px; }
.u-inl-5f11e4db,
.inline-actions { display:flex; gap:10px; align-items:center; }
.u-inl-5f926876 { width: 220px; text-align: center; }
.u-inl-6306c189 { width:14%; }
.u-inl-648ac4a7 { text-align: center; display:flex; gap:8px; justify-content:center; flex-wrap:wrap; }
.u-inl-6599cf44 { text-align: left; }
.u-inl-6686b386 { min-width:260px; }
.u-inl-6864d415 { margin: 0 0 4px 0; }
.u-inl-6a19fc17 { display:inline-block; }
.u-inl-6d567387,
.input-full { width:100%; }
.u-inl-a0600cba,
.input-amount-sm { width:140px; text-align:right; }
.u-inl-7023da70 { text-align: center; }
.u-inl-714ca188 { display:flex; gap:24px; align-items:flex-start; flex-wrap:wrap; }
.u-inl-729192c0 { width:130px; }
.u-inl-73c970b2 { text-align:right; font-weight:700; }
.u-inl-757df271 { max-width:380px; }
.u-inl-7ab6ac41 { justify-content:flex-end; margin-top:10px; }
.u-inl-7eeb91c9 { width:100%; padding:8px 10px; border-radius:10px; }
.u-inl-83456371 { margin-left:auto; }
.u-inl-844e0595 { max-width:160px; }
.u-inl-856f0a81 { min-width:240px; flex:1; }
.u-inl-89b618fe { margin-top: 40px; }
.u-inl-8ae9c1d1 { padding-top:10px; }
.u-inl-8ced3aad { margin-top: 10px; }
.u-inl-8e160d03 { display:flex; align-items:center; gap:10px; }
.u-inl-90304019 { margin-left: 8px; }
.u-inl-90a170c5 { margin-left:10px; font-weight:700; }
.u-inl-923e958f { min-width:180px; }
.u-inl-92abb779 { align-items:flex-end; margin-top:8px; }
.u-inl-95782264 { width:150px; }
.u-inl-9650bf6e { width:290px; }
.u-inl-9addce27 { width:190px; text-align:right; }
.u-inl-9e3c4ccb { margin-top:6px; }
.u-inl-a0600cba { width:140px; text-align:right; }
.u-inl-a0fcf227 { margin-bottom: 8px; }
.u-inl-a18ac805 { margin-top:4px; }
.u-inl-a2692202 { padding: 0; margin: 0 0 10px 0; }
.u-inl-a451651c { width: 60px; text-align: left; }
.u-inl-a629a35a { min-width:160px; }
.u-inl-a7409f75,
.flash-stack { margin-bottom:10px; }
.u-inl-ab64eb16 { display:none; align-items:flex-end; }
.u-inl-ac4bac65 { margin-bottom: 6px; }
.u-inl-b0f74acc { flex:1; min-height:0; }
.u-inl-b5052947 { display:flex; justify-content:flex-end; margin-top:6px; }
.u-inl-b6302b3a { display:flex; gap:12px; flex-wrap:wrap; align-items:flex-end; }
.u-inl-bae1e199 { width:18%; }
.u-inl-bc9bd8d6 { display:flex; gap:8px; margin-top:12px; }
.u-inl-bd7c7bc8 { border:0; border-top:1px solid #eee; margin:14px 0; }
.u-inl-be99ae25 { width:16%; }
.u-inl-bead9cd5 { display:flex; gap:8px; flex-wrap:wrap; }
.u-inl-c1c4e59e { min-width:240px; }
.u-inl-c5686f8c { margin: 0 0 12px 0; }
.u-inl-c5ac9c43 { width:60px; }
.u-inl-c78f4943 { width:90px; }
.u-inl-c8395ac5 { display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
.u-inl-cb1cdc72 { font-size:1rem; margin-bottom:8px; }
.u-inl-cb458930,
.is-hidden { display:none; }
.u-inl-cc093c17 { width: 120px; text-align:center; }
.u-inl-cec175ec { min-width:320px; flex:1; }
.u-inl-ced5e665 { display:flex; gap:10px; flex-wrap:wrap; align-items:flex-end; }
.u-inl-d24eb53b { max-height:45px; border-radius:4px; }
.u-inl-d46b266e { width:42%; }
.u-inl-d4ccba21,
.status-box { padding:6px 8px; border:1px solid #eee; border-radius:4px; background:#fafafa; }
.u-inl-da5cd676 { flex:1; }
.u-inl-df7d1005 { width:160px; }
.u-inl-e1bf2a36,
.section-caption { margin:0 0 8px 0; font-size:0.85rem; }
.u-inl-e367a169 { color:#999; font-size:0.85rem; }
.u-inl-e40dd009 { font-size:0.92rem; }
.u-inl-e9f8198e { max-width: 60px; max-height: 60px; cursor:pointer; }
.u-inl-ebf0325f { width: 50px; }
.u-inl-ee0435f7 { width:100px; }
.u-inl-ee99edc6 { margin:0 0 6px 0; }
.u-inl-f0a6b073 { width:40px; text-align:center; }
.u-inl-f0c6ce88 { flex:1; min-width:320px; }
.u-inl-f2ee35f8 { font-weight:800; }
.u-inl-f4fa9546 { color:#6b6b6b; font-weight:700; font-size:0.9rem; }
.u-inl-f6e3d7fe { text-align:right; }
.u-inl-f7b602e7 { margin:6px 0 8px; }
.u-inl-f95ebd2a { width:70px; }
.u-inl-fa3e1c7d { margin-bottom:12px; }

/* =========================================
   CONSOLIDAÇÃO: css/pages/*.css
   (migrado automaticamente para style.css)
   ========================================= */
.filter-form,
/* =======================
       PADRÃO LUNALÔSYS (ROYALTIES)
       ======================= */
    .filter-form,
/* =======================
       PADRÃO LUNALÔSYS (ROYALTIES)
       ======================= */

    .filter-form {
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  align-items:flex-end;
  margin-bottom:16px;
}

.filter-form .form-group {
  display:flex;
  flex-direction:column;
  min-width:220px;
}

.table-resumo,
/* =======================
       PADRÃO LUNALÔSYS
       ======================= */

    .table-resumo {
  width:100%;
  border-collapse:collapse;
  font-size:0.9rem;
  margin-top:12px;
}

.table-resumo th,
.table-resumo td {
  padding:6px 8px;
  border-bottom:1px solid #eee;
  text-align:left;
  vertical-align:top;
}

.table-resumo thead th {
  background:#fafafa;
  font-weight:600;
}

.table-resumo tbody tr:hover,
.table tbody tr:hover {
  background:#fff7f4;
}

.thumb {
  width:48px;
  height:48px;
  object-fit:cover;
  border-radius:6px;
  border:1px solid #eee;
  cursor:pointer;
}

.tag {
  display:inline-block;
  padding:3px 8px;
  border-radius:999px;
  font-size:0.78rem;
  font-weight:700;
  color:#fff;
  line-height:1;
  white-space:nowrap;
  margin-right:6px;
}

.tag-ok,
.st-paga,
.st-recebida,
/* 3 = pago (verde) */
    .st-ticket-3,
.st-ticket-3,
.st-forn-3 {
  background:#28a745;
}

.tag-bad,
.st-aberta,
/* verde */
    .st-recusada,
/* 1 = devido (vermelho) */
    .st-ticket-1,
.st-ticket-1,
.st-forn-1 {
  background:#dc3545;
}

.tag-roxo {
  background:#7b2cbf;
}

.img-modal {
  position:fixed;
  inset:0;
  background:rgba(0,0,0,0.55);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:20px;
  z-index:9999;
}

.img-modal.hidden,
.row-nova-parcela {
  display:none;
}

.img-modal-content {
  background:#fff;
  border-radius:12px;
  padding:14px;
  max-width:900px;
  width:100%;
  box-shadow:0 6px 20px rgba(0,0,0,0.15);
  position:relative;
}

.img-modal-content img {
  width:100%;
  height:auto;
  border-radius:10px;
}

.img-modal-close {
  position:absolute;
  top:8px;
  right:12px;
  border:none;
  background:none;
  font-size:26px;
  cursor:pointer;
}

tfoot td {
  background:#fafafa;
  font-weight:700;
  border-top:2px solid #eee;
}

.cell-str,
.acoes {
  white-space:nowrap;
}

.cell-wrap,
.td-wrap {
  white-space:normal;
}

.muted {
  color:#888;
  font-weight:600;
  font-size:0.82rem;
  display:block;
  margin-top:2px;
}

.filter-form {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  align-items: flex-end;
  margin-bottom: 16px;
}

.filter-form .form-group,
.filters-row .field-group {
  display: flex;
  flex-direction: column;
  min-width: 200px;
}

.table-resumo {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.9rem;
  margin-top: 12px;
}

.table-resumo th,
.table-resumo td {
  padding: 6px 8px;
  border-bottom: 1px solid #eee;
  text-align: left;
  vertical-align: middle;
}

.table-resumo thead th {
  background: #fafafa;
  font-weight: 600;
}

.table-resumo tbody tr:hover {
  background: #fff7f4;
}

.thumb {
  width: 48px;
  height: 48px;
  object-fit: cover;
  border-radius: 6px;
  border: 1px solid #eee;
  cursor: pointer;
}

/* BADGE INTEGRAÇÃO */
    .tag-integracao {
  display: inline-block;
  padding: 3px 8px;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 700;
  color: #fff;
  line-height: 1;
  white-space: nowrap;
}

.tag-ok,
.st-paga {
  background: #28a745;
}

/* verde */
    .tag-bad,
.st-aberta {
  background: #dc3545;
}

/* vermelho */

    .img-modal {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.55);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  z-index: 9999;
}

.img-modal.hidden,
.tab-pane {
  display: none;
}

.img-modal-content {
  background: #fff;
  border-radius: 12px;
  padding: 14px;
  max-width: 900px;
  width: 100%;
  box-shadow: 0 6px 20px rgba(0,0,0,0.15);
  position: relative;
}

.img-modal-content img {
  width: 100%;
  height: auto;
  border-radius: 10px;
}

.img-modal-close {
  position: absolute;
  top: 8px;
  right: 12px;
  border: none;
  background: none;
  font-size: 26px;
  cursor: pointer;
}

/* ============================== */
        /* ESTILO DAS ABAS */
        /* ============================== */
        .tabs-header,
/* Layout geral no padrão dos módulos (igual relatórios da coleção) */
    .tabs-header {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 10px 0 16px 0;
}

.tab-btn {
  border: 1px solid #ddd;
  background: #f5f5f5;
  padding: 6px 12px;
  border-radius: 6px;
  cursor: pointer;
  font-size: 0.9rem;
}

.tab-btn.active {
  background: #ff6b6b;
  color: white;
  border-color: #ff6b6b;
}

.tab-pane.active {
  display: block;
}

/* ============================== */
        /* TABELAS */
        /* ============================== */
        .data-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.88rem;
}

.data-table th,
.data-table td {
  border: 1px solid #f0d4c1;
  padding: 6px;
  vertical-align: middle;
}

.table-scroll {
  overflow-x: auto;
  margin-top: 10px;
}

/* ============================== */
        /* FOTO + LIGHTBOX */
        /* ============================== */
        .foto-produto {
  width: 55px;
  height: auto;
  cursor: pointer;
  border-radius: 4px;
}

.lightbox-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.85);
  display: none;
  justify-content: center;
  align-items: center;
  z-index: 9999;
}

.lightbox-overlay img {
  max-width: 90%;
  max-height: 90%;
  border-radius: 8px;
  box-shadow: 0 0 20px #000;
}

.lightbox-overlay.active,
.lightbox-backdrop.active,
.img-modal.open {
  display: flex;
}

/* ============================== */
        /* RESUMO */
        /* ============================== */
        .resumo-box p {
  margin: 4px 0;
  font-size: 0.88rem;
}

/* ============================== */
        /* MODAL AJUSTAR MIX */
        /* ============================== */
        #modalMix {
  display:none;
  position:fixed;
  top:0;
  left:0;
  width:100%;
  height:100%;
  background:rgba(0,0,0,0.6);
  justify-content:center;
  align-items:center;
  z-index:10000;
}

.modal-mix-box {
  background:#fff;
  width:320px;
  padding:20px;
  border-radius:8px;
  box-shadow:0 4px 10px rgba(0,0,0,0.35);
}

.modal-mix-box input {
  width:100%;
  margin-top:10px;
  padding:6px;
  border-radius:4px;
  border:1px solid #ccc;
}

.modal-mix-buttons {
  margin-top:14px;
  display:flex;
  justify-content:space-between;
}

.btn-small {
  padding:4px 8px;
  font-size:0.78rem;
  cursor:pointer;
  border-radius:4px;
}

.btn-ajustar {
  background:#ffae00;
  color:#000;
}

.btn-cancel {
  background:#ccc;
  color:#000;
}

.flash-container {
  margin-bottom: 10px;
}

.flash-message {
  padding: 8px 10px;
  border-radius: 4px;
  font-size: 0.85rem;
  margin-bottom: 4px;
}

.flash-error {
  background: #ffe5e5;
  border: 1px solid #ff6b6b;
  color: #a30000;
}

.flash-success {
  background: #e5ffe9;
  border: 1px solid #38a169;
  color: #1f5130;
}

.flash-info {
  background: #e5f3ff;
  border: 1px solid #4299e1;
  color: #1a4b7a;
}

.flash-warning {
  background: #fff7e5;
  border: 1px solid #ecc94b;
  color: #795400;
}

:root {
  --altura-fixa-layout: 240px;
}

body.page-fin-despesa-alterar .page {
  width:100%;
  padding: 0 22px 18px;
  box-sizing:border-box;
  display:flex;
  flex-direction:column;
  gap:10px;
}

body.page-fin-despesa-alterar .subtitle {
  margin:0;
  color:#6b6b6b;
}

body.page-fin-despesa-alterar .scroll-area {
  max-height: calc(100vh - var(--altura-fixa-layout));
  overflow-y:auto;
  width:100%;
  padding: 0;
  box-sizing:border-box;
}

body.page-fin-despesa-alterar .card {
  width:100%;
  max-width:none;
  background: rgba(255, 255, 255, 0.34);
  border: 1px solid rgba(0, 0, 0, 0.08);
  padding:16px 16px;
  border-radius:10px;
  box-shadow:0 2px 6px rgba(0,0,0,0.06);
  box-sizing:border-box;
}

body.page-fin-despesa-alterar .topline {
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:10px;
  flex-wrap:wrap;
  margin-bottom:10px;
}

/* ===== TAGS PADRÃO ===== */
    body.page-fin-despesa-alterar .tag,
  body.page-fin-despesa-alterar .tag {
  display:inline-block;
  padding:3px 10px;
  border-radius:999px;
  border:1px solid #f0e0d0;
  background:#faf5f0;
  color:#6b3b22;
  font-size:0.78rem;
  font-weight:900;
  white-space:nowrap;
}

/* ===== TAG STATUS (MESMO CONCEITO DA CONSULTA) ===== */
    body.page-fin-despesa-alterar .tag-status {
  display:inline-block;
  padding:3px 10px;
  border-radius:999px;
  border:1px solid #ddd;
  font-size:0.78rem;
  font-weight:900;
  white-space:nowrap;
  text-align:center;
  line-height: 1.1;
}

body.page-fin-despesa-alterar .tag-status.aberta,
body.page-fin-despesa-alterar .tag-status.cancelada,
body.page-fin-despesa-alterar .status-pill.cancelada {
  background:#f5f5f5;
  color:#444;
  border-color:#e0e0e0;
}

body.page-fin-despesa-alterar .tag-status.parcial {
  background:#fff7e6;
  color:#8a5a00;
  border-color:#ffe2b3;
}

body.page-fin-despesa-alterar .tag-status.paga,
body.page-fin-despesa-alterar .status-pill.paga {
  background:#e9f7ee;
  color:#1f6a37;
  border-color:#bfe8cd;
}

body.page-fin-despesa-alterar .tag-status.atrasada,
/* Ajuste pedido: ABERTA em vermelho */
    body.page-fin-despesa-alterar .tag-status.aberta,
body.page-fin-despesa-alterar .status-pill.aberta {
  background:#fdecec;
  color:#8a1f1f;
  border-color:#f3bcbc;
}

/* (OPCIONAL) Você pediu “ABERTA em vermelho” na parcela:
       aqui eu “reuso” atrasada como vermelho pra ABERTA na grade (sem afetar o topo).
       Se preferir ABERTA cinza,
no HTML da parcela troque else 'atrasada' por else 'aberta'. */

    body.page-fin-despesa-alterar label {
  font-weight:800;
  font-size:0.86rem;
  margin-bottom:4px;
  display:block;
}

body.page-fin-despesa-alterar input,
body.page-fin-despesa-alterar select,
body.page-fin-despesa-alterar textarea {
  width:100%;
  padding:8px 10px;
  border:1px solid #ddd;
  border-radius:6px;
  font-size:0.95rem;
  box-sizing:border-box;
}

body.page-fin-despesa-alterar textarea {
  min-height: 70px;
  resize: vertical;
}

body.page-fin-despesa-alterar .grid {
  display:grid;
  grid-template-columns: 220px 1fr 260px 220px;
  gap: 10px 12px;
  align-items:end;
}

body.page-fin-despesa-alterar .grid {
  grid-template-columns: 1fr 1fr;
}

body.page-fin-despesa-alterar .grid {
  grid-template-columns: 1fr;
}

body.page-fin-despesa-alterar .row-full {
  grid-column: 1 / -1;
}

/* Linha específica: Valor total + Status (mais espaço,
sem “congestionamento”) */
    body.page-fin-despesa-alterar .valor-status-row {
  display:flex;
  gap:12px;
  align-items:flex-end;
  width:100%;
}

body.page-fin-despesa-alterar .valor-status-row .col-valor {
  flex: 1 1 520px;
  min-width: 360px;
}

body.page-fin-despesa-alterar .valor-status-row .col-status {
  flex: 0 0 180px;
}

body.page-fin-despesa-alterar .valor-status-row {
  flex-direction:column;
  align-items:stretch;
}

body.page-fin-despesa-alterar .valor-status-row .col-status {
  flex: 1 1 auto;
  width:100%;
}

body.page-fin-despesa-alterar .valor-status-row .col-valor {
  min-width: 0;
}

body.page-fin-despesa-alterar .actions {
  margin-top:12px;
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:center;
}

/* ====== PARCELAS ====== */
    body.page-fin-despesa-alterar .parcelas-head {
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:12px;
  flex-wrap:wrap;
  margin-bottom:8px;
}

body.page-fin-despesa-alterar .parcelas-tools {
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:flex-end;
}

body.page-fin-despesa-alterar .tool {
  min-width: 150px;
}

body.page-fin-despesa-alterar .radio-wrap {
  display:flex;
  gap:10px;
  align-items:center;
  padding: 6px 10px;
  border:1px solid #eee;
  border-radius:8px;
  background:#fafafa;
  height: 38px;
  box-sizing:border-box;
}

body.page-fin-despesa-alterar .radio-wrap label {
  margin:0;
  font-size:0.86rem;
  font-weight:900;
}

body.page-fin-despesa-alterar .radio-wrap input {
  width:auto;
}

body.page-fin-despesa-alterar .table,
body.page-fin-despesa-alterar .table-resumo,
/* =======================
       TABELA PADRÃO (para devedores)
       ======================= */
    body.page-fin-despesa-alterar .table-resumo {
  width:100%;
  border-collapse:collapse;
  font-size:0.9rem;
  margin-top:10px;
}

body.page-fin-despesa-alterar .table th,
body.page-fin-despesa-alterar .table td,
body.page-fin-despesa-alterar .table-resumo th,
body.page-fin-despesa-alterar .table-resumo td {
  padding:6px 8px;
  border-bottom:1px solid #eee;
  text-align:left;
  vertical-align:middle;
}

body.page-fin-despesa-alterar .table thead th {
  background:#ecd4c7;
  color:#4e2918;
  font-weight:700;
  position: sticky;
  top: 0;
  z-index: 2;
}

body.page-fin-despesa-alterar .table tbody tr:nth-child(even) td,
body.page-fin-despesa-alterar .table-resumo tbody tr:nth-child(even) td {
  background: rgba(139, 63, 47, 0.035);
}

body.page-fin-despesa-alterar .table tbody tr:hover td,
body.page-fin-despesa-alterar .table-resumo tbody tr:hover td {
  background: rgba(139, 63, 47, 0.07);
}

body.page-fin-despesa-alterar .u-inl-bead9cd5 {
  white-space: nowrap;
}

body.page-fin-despesa-alterar .u-inl-bead9cd5 .btn-mini {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
}

body.page-fin-despesa-alterar .td-mini input,
body.page-fin-despesa-alterar .form-group input,
body.page-fin-despesa-alterar .form-group select,
body.page-fin-despesa-alterar input[type="text"],
body.page-fin-despesa-alterar input[type="date"],
body.page-fin-despesa-alterar input[type="number"],
body.page-fin-despesa-alterar select,
body.page-fin-despesa-alterar textarea,
body.page-fin-despesa-alterar input[type="password"] {
  padding:6px 8px;
  font-size:0.9rem;
}

body.page-fin-despesa-alterar .money {
  text-align:right;
  font-weight:900;
}

body.page-fin-despesa-alterar .input-congelado {
  background: #f5f5f5;
  color: #666;
  cursor: not-allowed;
  pointer-events: none;
}

/* ====== ANEXOS ====== */
    body.page-fin-despesa-alterar .anexos-top {
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:12px;
  flex-wrap:wrap;
  margin-top: 6px;
}

body.page-fin-despesa-alterar .btn-mini {
  padding:2px 8px;
  font-size:0.78rem;
  cursor:pointer;
}

/* ====== MODAL ====== */
    body.page-fin-despesa-alterar .modal-backdrop {
  position:fixed;
  inset:0;
  background:rgba(0,0,0,0.65);
  display:none;
  align-items:center;
  justify-content:center;
  z-index:9999;
  padding: 18px;
}

body.page-fin-despesa-alterar .modal-backdrop.active {
  display:flex;
}

body.page-fin-despesa-alterar .modal-card {
  width: min(1100px, 96vw);
  height: min(720px, 90vh);
  background:#fff;
  border-radius:12px;
  box-shadow: 0 10px 30px rgba(0,0,0,0.35);
  display:flex;
  flex-direction:column;
  overflow:hidden;
}

body.page-fin-despesa-alterar .modal-header {
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:12px 14px;
  border-bottom:1px solid #eee;
  gap:10px;
  flex-wrap:wrap;
}

body.page-fin-despesa-alterar .modal-title {
  font-weight:900;
  color:#6b3b22;
  display:flex;
  gap:10px;
  align-items:center;
  min-width: 280px;
}

body.page-fin-despesa-alterar .modal-title small {
  font-weight:800;
  color:#777;
}

body.page-fin-despesa-alterar .modal-actions {
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  align-items:center;
}

body.page-fin-despesa-alterar .modal-body {
  flex:1;
  background:#fafafa;
  position:relative;
}

body.page-fin-despesa-alterar .modal-share-tools {
  border-top: 1px solid #eee;
  padding: 12px 14px 14px;
  background: #fffaf7;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

body.page-fin-despesa-alterar .modal-share-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

body.page-fin-despesa-alterar .modal-share-status {
  min-height: 20px;
  font-size: 0.88rem;
  color: #6b3b22;
}

body.page-fin-despesa-alterar .modal-share-status[data-kind="success"] {
  color: #1f6d35;
}

body.page-fin-despesa-alterar .modal-share-status[data-kind="error"] {
  color: #9f2130;
}

body.page-fin-despesa-alterar .modal-share-box {
  display: none;
  padding: 10px;
  border: 1px solid #ecd4c7;
  border-radius: 10px;
  background: #fff;
}

body.page-fin-despesa-alterar .modal-share-box.is-open {
  display: block;
}

body.page-fin-despesa-alterar .modal-share-inline {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
}

body.page-fin-despesa-alterar .modal-share-inline input {
  flex: 1 1 420px;
}

body.page-fin-despesa-alterar .modal-share-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px 12px;
  margin-bottom: 10px;
}

@media (max-width: 760px) {
  body.page-fin-despesa-alterar .modal-share-grid {
    grid-template-columns: 1fr;
  }
}

body.page-lunalo-royalties-form .modal-share-tools,
body.page-loccitane-royalties .modal-share-tools,
body.page-lunalo-mixes-consultar .modal-share-tools,
body.page-lunalo-mixes-detalhes .modal-share-tools,
body.page-loccitane-produtos .modal-share-tools {
  border-top: 1px solid #eee;
  padding: 12px 14px 14px;
  background: #fffaf7;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

body.page-lunalo-royalties-form .modal-share-buttons,
body.page-loccitane-royalties .modal-share-buttons,
body.page-lunalo-mixes-consultar .modal-share-buttons,
body.page-lunalo-mixes-detalhes .modal-share-buttons,
body.page-loccitane-produtos .modal-share-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

body.page-lunalo-royalties-form .modal-share-status,
body.page-loccitane-royalties .modal-share-status,
body.page-lunalo-mixes-consultar .modal-share-status,
body.page-lunalo-mixes-detalhes .modal-share-status,
body.page-loccitane-produtos .modal-share-status {
  min-height: 20px;
  font-size: 0.88rem;
  color: #6b3b22;
}

body.page-lunalo-royalties-form .modal-share-status[data-kind="success"],
body.page-loccitane-royalties .modal-share-status[data-kind="success"],
body.page-lunalo-mixes-consultar .modal-share-status[data-kind="success"],
body.page-lunalo-mixes-detalhes .modal-share-status[data-kind="success"],
body.page-loccitane-produtos .modal-share-status[data-kind="success"] {
  color: #1f6d35;
}

body.page-lunalo-royalties-form .modal-share-status[data-kind="error"],
body.page-loccitane-royalties .modal-share-status[data-kind="error"],
body.page-lunalo-mixes-consultar .modal-share-status[data-kind="error"],
body.page-lunalo-mixes-detalhes .modal-share-status[data-kind="error"],
body.page-loccitane-produtos .modal-share-status[data-kind="error"] {
  color: #9f2130;
}

body.page-lunalo-royalties-form .modal-share-box,
body.page-loccitane-royalties .modal-share-box,
body.page-lunalo-mixes-consultar .modal-share-box,
body.page-lunalo-mixes-detalhes .modal-share-box,
body.page-loccitane-produtos .modal-share-box {
  display: none;
  padding: 10px;
  border: 1px solid #ecd4c7;
  border-radius: 10px;
  background: #fff;
}

body.page-lunalo-royalties-form .modal-share-box.is-open,
body.page-loccitane-royalties .modal-share-box.is-open,
body.page-lunalo-mixes-consultar .modal-share-box.is-open,
body.page-lunalo-mixes-detalhes .modal-share-box.is-open,
body.page-loccitane-produtos .modal-share-box.is-open {
  display: block;
}

body.page-lunalo-royalties-form .modal-share-inline,
body.page-loccitane-royalties .modal-share-inline,
body.page-lunalo-mixes-consultar .modal-share-inline,
body.page-lunalo-mixes-detalhes .modal-share-inline,
body.page-loccitane-produtos .modal-share-inline {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
}

body.page-lunalo-royalties-form .modal-share-inline input,
body.page-loccitane-royalties .modal-share-inline input,
body.page-lunalo-mixes-consultar .modal-share-inline input,
body.page-lunalo-mixes-detalhes .modal-share-inline input,
body.page-loccitane-produtos .modal-share-inline input {
  flex: 1 1 420px;
}

body.page-lunalo-royalties-form .modal-share-grid,
body.page-loccitane-royalties .modal-share-grid,
body.page-lunalo-mixes-consultar .modal-share-grid,
body.page-lunalo-mixes-detalhes .modal-share-grid,
body.page-loccitane-produtos .modal-share-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px 12px;
  margin-bottom: 10px;
}

@media (max-width: 760px) {
  body.page-lunalo-royalties-form .modal-share-grid,
  body.page-loccitane-royalties .modal-share-grid,
  body.page-lunalo-mixes-consultar .modal-share-grid,
  body.page-lunalo-mixes-detalhes .modal-share-grid,
  body.page-loccitane-produtos .modal-share-grid {
    grid-template-columns: 1fr;
  }
}

body.page-lunalo-mixes-consultar .lightbox-inner {
  width: min(90vw, 760px);
  max-height: 90vh;
  overflow: auto;
  background: #fffdfb;
  border-radius: 18px;
  padding: 18px;
  box-shadow: 0 18px 44px rgba(0, 0, 0, 0.28);
}

body.page-lunalo-mixes-consultar .lightbox-image {
  max-width: 100%;
  max-height: 58vh;
}

body.page-lunalo-mixes-consultar .lightbox-caption {
  margin-top: 10px;
  color: #6b3b22;
}

body.page-lunalo-mixes-detalhes .mix-detail-photo-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 12px;
}

body.page-lunalo-mixes-detalhes .mix-share-card {
  width: min(92vw, 640px);
  background: #fff;
  border-radius: 14px;
  padding: 18px 18px 16px;
  position: relative;
  box-shadow: 0 12px 36px rgba(0, 0, 0, 0.32);
}

body.page-lunalo-mixes-detalhes .mix-share-card .loc-prod-modal-title {
  margin-bottom: 12px;
  color: #4e2918;
}

body.page-lunalo-mixes-detalhes .mix-share-subtitle {
  margin: 6px 0 0;
  color: #8a6a58;
  font-size: 0.92rem;
}

body.page-lunalo-mixes-detalhes .mix-share-tools.is-static,
body.page-loccitane-produtos .loc-prod-share-tools {
  border-top: 0;
  padding: 0;
  background: transparent;
}

body.page-loccitane-produtos .loc-prod-modal-actions {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 12px;
}

body.page-fin-despesa-alterar .modal-iframe {
  width:100%;
  height:100%;
  border:0;
  background:#fff;
}

body.page-fin-despesa-alterar .modal-fallback {
  padding:16px;
  color:#555;
  font-size:0.95rem;
  display:none;
}

body.page-fin-despesa-alterar .modal-close {
  border:1px solid #ddd;
  background:#f5f5f5;
  border-radius:8px;
  padding:6px 10px;
  cursor:pointer;
  font-weight:900;
}

body.page-fin-despesa-alterar .btn-plus {
  border:1px dashed #d5b9a6;
  background:#fff7f4;
  color:#6b3b22;
  font-weight:900;
  border-radius:10px;
  padding:6px 10px;
  cursor:pointer;
}

body.page-fin-despesa-alterar .row-nova-parcela.active {
  display:table-row;
}

/* ocupa a tela toda */
    .fin-full {
  width: 100%;
  min-height: calc(100vh - 60px);
  /* ajuste se seu header tiver outra altura */ padding: 16px 24px;
  box-sizing: border-box;
}

.fin-title {
  font-size: 1.4rem;
  font-weight: 700;
  margin: 0 0 6px 0;
  color: #6b3b22;
}

.fin-subtitle {
  margin: 0 0 18px 0;
  color: #666;
  font-size: 0.95rem;
}

.fin-form {
  background: #fff;
  border: 1px solid #eee;
  border-radius: 10px;
  padding: 14px;
}

.fin-grid {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 12px;
  align-items: end;
}

.field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.field label {
  font-size: 0.85rem;
  color: #555;
}

.field input,
.field select,
.field textarea {
  border: 1px solid #ccc;
  border-radius: 6px;
  padding: 8px 10px;
  font-size: 14px;
  width: 100%;
  box-sizing: border-box;
  background: #fff;
}

.field textarea,
textarea {
  min-height: 90px;
  resize: vertical;
}

/* col spans */
    .col-2 {
  grid-column: span 2;
}

.col-3 {
  grid-column: span 3;
}

.col-4 {
  grid-column: span 4;
}

.col-5 {
  grid-column: span 5;
}

.col-6 {
  grid-column: span 6;
}

.col-7 {
  grid-column: span 7;
}

.col-8 {
  grid-column: span 8;
}

.col-12,
.col-2,
.col-3,
.col-4,
.col-5,
.col-6,
.col-7,
.col-8,
/* col spans */
    .col-12 {
  grid-column: span 12;
}

.fin-actions {
  display: flex;
  gap: 10px;
  margin-top: 14px;
  flex-wrap: wrap;
}

.btn-primary {
  background: #ff6b6b;
  color: #fff;
  border: none;
  border-radius: 8px;
  padding: 10px 14px;
  cursor: pointer;
  font-weight: 600;
}

.btn-secondary {
  background: #f0f0f0;
  color: #333;
  border: 1px solid #ddd;
  border-radius: 8px;
  padding: 10px 14px;
  cursor: pointer;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
}

.fin-hint {
  font-size: 0.85rem;
  color: #777;
  margin-top: 10px;
}

.fin-full {
  padding: 12px;
}

html,
body,
/* Garante que a estrutura principal ocupe a altura toda da janela */
    html {
  height: 100%;
}

:root {
  --altura-fixa-layout: 260px;
}

.scroll-area-despesas,
.scroll-area,
.scroll-area-rel {
  max-height: calc(100vh - var(--altura-fixa-layout));
  overflow-y: auto;
  padding-right: 4px;
}

.scroll-area-despesas .table-wrapper,
.scroll-area-rel .table-wrapper,
/* Dentro dessa área,
a table-wrapper NÃO cria outro scroll */
    .scroll-area-fornecedores .table-wrapper {
  max-height: none;
  overflow-y: visible;
}

.filter-form {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  align-items: flex-end;
  margin-bottom: 14px;
}

.table-resumo {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.9rem;
  margin-top: 10px;
}

.table-resumo th,
.table-resumo td {
  padding: 6px 8px;
  border-bottom: 1px solid #eee;
  text-align: left;
  vertical-align: middle;
  white-space: nowrap;
}

.table-resumo thead th {
  background: #ffefe8;
  font-weight: 600;
  position: sticky;
  top: 0;
  z-index: 2;
}

table.simple-table thead th,
.painel-tabela thead th {
  background: #ffefe8;
  position: sticky;
  top: 0;
  z-index: 2;
}

.td-wrap {
  white-space: normal;
  min-width: 220px;
}

.tag-id {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 999px;
  border: 1px solid #f0e0d0;
  background: #faf5f0;
  color: #6b3b22;
  font-weight: 700;
  font-size: 0.78rem;
}

.status-tag {
  padding: 3px 7px;
  border-radius: 6px;
  font-size: 0.78rem;
  font-weight: 700;
  color: #fff;
  display: inline-block;
}

.st-parcial {
  background: #ffc107;
  color:#000;
}

.btn-mini {
  padding: 2px 8px;
  font-size: 0.78rem;
  cursor: pointer;
}

.money {
  font-weight: 700;
  text-align: right;
}

.col-acoes {
  text-align: center;
  width: 150px;
}

/* Linha de resumo do total */
    .resumo-total {
  margin: 8px 0 10px;
  display: flex;
  justify-content: flex-end;
  gap: 12px;
  align-items: center;
}

.resumo-total .label,
.mix-detail-desc {
  font-size: 0.9rem;
  color: #555;
}

.resumo-total .valor {
  font-weight: 800;
  font-size: 1rem;
}

/* Rodapé (tfoot) */
    .table-resumo tfoot td {
  background: #fafafa;
  border-top: 1px solid #eee;
}

:root {
  --altura-fixa-layout: 280px;
}

.filter-form {
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  align-items:flex-end;
  margin-bottom:14px;
}

.filter-form .form-group {
  display:flex;
  flex-direction:column;
  min-width: 200px;
}

.filter-form .form-group.small,
.field {
  min-width: 160px;
}

/* Página: Financeiro > Despesa > Alterar */
body.page-fin-despesa-alterar .page {
  max-width: 1500px;
  margin: 0 auto;
}

body.page-fin-despesa-alterar .scroll-area {
  max-height: none;
  overflow: visible;
}

body.page-fin-despesa-alterar .card {
  padding: 18px 18px;
}

body.page-fin-despesa-alterar .grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(180px, 1fr));
  gap: 12px 14px;
  align-items: end;
}

body.page-fin-despesa-alterar .row-full {
  grid-column: 1 / -1;
}

body.page-fin-despesa-alterar .col-valor {
  grid-column: span 2;
}

body.page-fin-despesa-alterar .col-status {
  grid-column: span 1;
  max-width: 220px;
}

@media (max-width: 1200px) {
  body.page-fin-despesa-alterar .grid {
    grid-template-columns: repeat(3, minmax(170px, 1fr));
  }

  body.page-fin-despesa-alterar .col-valor {
    grid-column: span 2;
  }
}

@media (max-width: 920px) {
  body.page-fin-despesa-alterar .grid {
    grid-template-columns: repeat(2, minmax(160px, 1fr));
  }

  body.page-fin-despesa-alterar .col-valor,
  body.page-fin-despesa-alterar .col-status {
    grid-column: span 1;
    max-width: none;
  }
}

@media (max-width: 640px) {
  body.page-fin-despesa-alterar .grid {
    grid-template-columns: 1fr;
  }
}

/* Página de despesas: compacta os filtros para evitar rolagem lateral */
body.page-fin-despesa-consultar .filter-form {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: 10px;
  align-items: end;
}

body.page-fin-despesa-consultar .filter-form .form-group {
  min-width: 0;
}

body.page-fin-despesa-consultar .filter-form .form-group select,
body.page-fin-despesa-consultar .filter-form .form-group input {
  width: 100%;
}

body.page-fin-despesa-consultar .filter-form .u-inl-5f11e4db {
  grid-column: 1 / -1;
  justify-content: flex-end;
  flex-wrap: wrap;
}

body.page-fin-despesa-consultar .table-resumo th:nth-child(4),
body.page-fin-despesa-consultar .table-resumo td:nth-child(4),
body.page-fin-despesa-consultar .table-resumo th:nth-child(7),
body.page-fin-despesa-consultar .table-resumo td:nth-child(7) {
  width: 150px;
  max-width: 150px;
  min-width: 150px;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}

body.page-fin-despesa-consultar .table-resumo td:nth-child(4).td-wrap,
body.page-fin-despesa-consultar .table-resumo td:nth-child(7).td-wrap,
body.page-fin-despesa-consultar .table-resumo th:nth-child(4).td-wrap,
body.page-fin-despesa-consultar .table-resumo th:nth-child(7).td-wrap {
  min-width: 150px;
}

@media (max-width: 980px) {
  body.page-fin-despesa-consultar .filter-form {
    grid-template-columns: repeat(2, minmax(150px, 1fr));
  }
}

@media (max-width: 640px) {
  body.page-fin-despesa-consultar .filter-form {
    grid-template-columns: 1fr;
  }
}

.kpi-total {
  margin: 8px 0 10px;
  display:flex;
  justify-content:flex-end;
  gap:12px;
  align-items:center;
}

.kpi-total .label,
.resumo-total .label {
  font-size:0.9rem;
  color:#555;
}

.kpi-total .valor {
  font-weight:900;
  font-size:1rem;
}

.card-despesa {
  background:#fff;
  border:1px solid #eee;
  border-radius:10px;
  padding:12px 12px;
  box-shadow:0 2px 6px rgba(0,0,0,0.06);
  margin-bottom:12px;
}

.topline {
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:10px;
  flex-wrap:wrap;
  margin-bottom:8px;
}

.tag-status {
  display:inline-block;
  padding:3px 10px;
  border-radius:999px;
  border:1px solid #ddd;
  font-size:0.78rem;
  font-weight:900;
  white-space:nowrap;
  text-align:center;
}

.table {
  width:100%;
  border-collapse:collapse;
  font-size:0.9rem;
  margin-top:8px;
}

.table th,
.table td,
.table-resumo th,
.table-resumo td {
  padding:6px 8px;
  border-bottom:1px solid #eee;
  text-align:left;
  vertical-align:middle;
  white-space:nowrap;
}

.mini-muted {
  color:#777;
  font-weight:700;
  font-size:0.88rem;
}

.status-pill {
  display:inline-block;
  padding:4px 10px;
  border-radius:10px;
  font-weight:900;
  font-size:0.78rem;
  border:1px solid #ddd;
  text-align:center;
  min-width: 92px;
}

.table-resumo thead th {
  background:#fafafa;
  font-weight:600;
  position: sticky;
  top:0;
  z-index:2;
}

.td-wrap {
  white-space:normal;
  min-width:220px;
}

.tag-id {
  display:inline-block;
  padding:2px 8px;
  border-radius:999px;
  border:1px solid #f0e0d0;
  background:#faf5f0;
  color:#6b3b22;
  font-weight:700;
  font-size:0.78rem;
}

.status-tag {
  padding:3px 7px;
  border-radius:6px;
  font-size:0.78rem;
  font-weight:700;
  color:#fff;
  display:inline-block;
}

.money {
  font-weight:700;
  text-align:right;
}

.muted {
  color:#6b6b6b;
  font-size:0.85rem;
  font-weight:600;
}

.resumo-total {
  margin: 8px 0 10px;
  display:flex;
  justify-content:flex-end;
  gap:12px;
  align-items:center;
  flex-wrap:wrap;
}

.resumo-total .valor {
  font-weight:800;
  font-size:1rem;
}

.row-dia td,
/* Linha de agrupamento por dia (não é <thead>) */
    .row-dia td {
  background:#fafafa;
  font-weight:700;
  border-top:1px solid #eee;
}

.row-dia .dia-flex {
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:center;
  flex-wrap:wrap;
}

/* ABERTA vermelha */
    .st-parcial,
/* =======================
       STATUS (0..4)
       ======================= */
    /* 0 = lançado (amarelo) */
    .st-ticket-0,
/* TICKET STATUS: 0 lançado / 1 devido / 2 recusado / 3 pago / 4 parcial */
    .st-ticket-0,
/* LINHA STATUS: 0 lançado / 1 devido / 2 recusado / 3 pago */
    .st-forn-0 {
  background:#ffc107;
  color:#000;
}

.forn-fin-page,
.fornecedores-page {
  display:flex;
  flex-direction:column;
  gap:10px;
}

.page-header,
/* HEADER da página (título + texto explicativo) */
    .page-header {
  margin: 0 0 1px 0;
}

.page-header h1 {
  margin: 0;
}

.page-header p {
  margin: 0;
  font-size: 0.98rem;
}

.page-header .subtitle {
  margin-left: 10px;
}

.scroll-area-cadastro,
/* Área rolável interna (mantém header/footer fixos) */
    .scroll-area-cadastro-forn {
  max-height: calc(100vh - var(--altura-fixa-layout));
  overflow-y: auto;
  width: 100%;
  padding: 0 24px 16px;
  box-sizing: border-box;
}

.form-card {
  background:#fff;
  padding:22px 26px;
  border-radius:10px;
  box-shadow:0 2px 6px rgba(0,0,0,0.06);
  width:100%;
  max-width:none;
  margin:0;
  box-sizing:border-box;
}

.form-card-header {
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:10px;
  gap:12px;
  flex-wrap:wrap;
}

.form-card-header h2 {
  font-size:1.3rem;
  margin:0;
}

.codigo-sistema {
  font-size:0.9rem;
  color:#666;
  background:#faf5f0;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid #f0e0d0;
  white-space:nowrap;
}

.form-layout {
  display:flex;
  flex-direction:column;
  gap:14px;
  margin-top:10px;
}

.form-row-line {
  display:flex;
  gap:16px;
  flex-wrap:wrap;
}

.field {
  flex:1 1 0;
  min-width:180px;
}

.field-full {
  flex:1 1 100%;
}

.field-doc {
  flex:0 0 220px;
  max-width:220px;
}

.field-small {
  flex:0 0 140px;
  max-width:140px;
}

.field-medium {
  flex:0 0 260px;
  max-width:260px;
}

.field-uf {
  flex:0 0 100px;
  max-width:100px;
}

.field-cep {
  flex:0 0 150px;
  max-width:150px;
}

label {
  font-weight:600;
  font-size:0.9rem;
  margin-bottom:4px;
  display:block;
}

input,
select,
textarea {
  width:100%;
  padding:9px 11px;
  border:1px solid #ddd;
  border-radius:6px;
  font-size:0.95rem;
  box-sizing:border-box;
}

.form-actions {
  margin-top:20px;
  display:flex;
  justify-content:flex-start;
  gap:10px;
  flex-wrap:wrap;
}

.flash-container {
  margin-top:8px;
}

.hint {
  font-size: 0.82rem;
  color: #777;
  margin-top: 4px;
}

.page-header {
  margin:0 0 1px 0;
}

.page-header h1 {
  margin:0;
}

.page-header p {
  margin:0;
  font-size:0.98rem;
}

.page-header .subtitle {
  margin-left:10px;
}

.scroll-area-cadastro-forn {
  max-height: calc(100vh - var(--altura-fixa-layout));
  overflow-y:auto;
  width:100%;
  padding:0 24px 16px;
  box-sizing:border-box;
}

.field-doc {
  flex:0 0 210px;
  max-width:210px;
}

.form-actions {
  margin-top:20px;
  display:flex;
  justify-content:flex-start;
  gap:10px;
}

.btn-mini {
  padding:2px 6px;
  font-size:0.75rem;
  cursor:pointer;
}

/* ocupa a tela toda */
    .fin-full {
  width: 100%;
  min-height: calc(100vh - 60px);
  padding: 16px 24px;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
}

.fin-subtitle {
  margin: 0 0 12px 0;
  color: #666;
  font-size: 0.95rem;
}

.fin-form {
  background: #fff;
  border: 1px solid #eee;
  border-radius: 10px;
  padding: 14px;
  flex: 1;
  /* ocupa o resto da tela */ display: flex;
  flex-direction: column;
  /* permite editor crescer */ min-height: 0;
  /* importante p/ flex + overflow */;
}

.field {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-height: 0;
}

.btn-danger {
  background: #f0cfcf;
  color: #874141;
  border: 1px solid #e3b1b1;
  border-radius: 8px;
  padding: 10px 14px;
  cursor: pointer;
  font-weight: 600;
}

.btn-danger:hover {
  background: #e9c1c1;
  color: #7a3838;
  border-color: #d99d9d;
}

.btn-icon-danger {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 32px;
  min-height: 32px;
  padding: 0 8px;
  background: #f0cfcf;
  color: #874141;
  border: 1px solid #e3b1b1;
  border-radius: 8px;
  cursor: pointer;
  text-decoration: none;
}

.btn-icon-danger:hover {
  background: #e9c1c1;
  color: #7a3838;
  border-color: #d99d9d;
}

/* ===========================
       EDITOR RICO (mini-word)
       =========================== */

    .editor-wrap {
  display: flex;
  flex-direction: column;
  border: 1px solid #ccc;
  border-radius: 10px;
  overflow: hidden;
  background: #fff;
  min-height: 0;
}

.toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 8px;
  background: #fafafa;
  border-bottom: 1px solid #eee;
  align-items: center;
}

.tool-btn {
  border: 1px solid #ddd;
  background: #fff;
  border-radius: 8px;
  padding: 6px 10px;
  font-size: 13px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  user-select: none;
}

.tool-btn:hover {
  background: #f6f6f6;
}

.tool-sep {
  width: 1px;
  height: 28px;
  background: #ddd;
  margin: 0 4px;
}

.tool-select {
  border: 1px solid #ddd;
  background: #fff;
  border-radius: 8px;
  padding: 6px 10px;
  font-size: 13px;
  cursor: pointer;
}

/* Editor ocupa o máximo possível sem rolar a página.
       A rolagem fica DENTRO do editor quando o texto crescer. */
    #editor {
  padding: 12px;
  font-size: 14px;
  outline: none;
  min-height: 0;
  flex: 1;
  overflow: auto;
  max-height: none;
  white-space: pre-wrap;
}

/* mantém aparência mais "documento" */
    #editor p {
  margin: 0 0 8px 0;
}

.link-nota {
  color:#e0543b;
  text-decoration:none;
  font-weight:600;
}

.link-nota:hover {
  text-decoration:underline;
}

.link-id {
  text-decoration: none;
}

.link-id:hover .tag,
.btn-mini:hover {
  filter: brightness(0.98);
}

.split-box {
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid #eee;
}

.sub-row {
  display:flex;
  gap:10px;
  align-items:center;
  flex-wrap:wrap;
  margin-bottom: 8px;
}

.sub-row input[type="text"] {
  flex: 1;
  min-width: 260px;
}

.sub-row select {
  min-width: 220px;
}

.hint {
  font-size: 12px;
  opacity: 0.85;
  margin: 6px 0 12px 0;
}

.btn-mini {
  padding: 6px 10px;
  border-radius: 8px;
  border: 1px solid #ddd;
  background: #fff;
  cursor: pointer;
  font-weight: 700;
  line-height: 1;
  min-width: 90px;
}

.sub-actions {
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  justify-content:flex-end;
}

.dash-wrap {
  max-width: 1200px;
  margin: 10px auto 30px 40px;
}

.dash-title {
  font-size: 24px;
  font-weight: 800;
  color:#6b3b22;
  margin: 0 0 14px 0;
}

.filters {
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  align-items:flex-end;
  margin: 10px 0 14px 0;
  padding: 12px;
  border:1px solid #eee;
  border-radius: 10px;
  background:#fff;
}

.fg {
  display:flex;
  flex-direction:column;
  gap:6px;
  min-width: 180px;
}

.fg label {
  font-size:12px;
  opacity:.85;
}

.fg select,
.fg input {
  padding: 8px 10px;
  border:1px solid #e6e6e6;
  border-radius: 8px;
  background:#fff;
}

.btn {
  padding:10px 12px;
  border-radius: 10px;
  border:1px solid #ddd;
  background:#fff;
  cursor:pointer;
  font-weight:700;
}

.kpis {
  display:grid;
  grid-template-columns: repeat(5, minmax(160px, 1fr));
  gap:10px;
  margin: 10px 0 16px 0;
}

.kpi {
  border:1px solid #eee;
  border-radius: 12px;
  padding: 12px;
  background:#fff;
}

.kpi .t {
  font-size:12px;
  opacity:.8;
  margin-bottom:6px;
}

.kpi .v {
  font-size:18px;
  font-weight:800;
  color:#3a261b;
}

.grid2 {
  display:grid;
  grid-template-columns: 1.2fr .8fr;
  gap:12px;
  margin-top: 12px;
}

.card {
  border:1px solid #eee;
  border-radius: 12px;
  background:#fff;
  padding: 12px;
}

.card h3 {
  margin:0 0 10px 0;
  font-size: 16px;
  color:#6b3b22;
}

table {
  width:100%;
  border-collapse: collapse;
}

th,
td {
  text-align:left;
  padding:8px;
  border-bottom:1px solid #f0f0f0;
  font-size: 13px;
}

th {
  font-weight:800;
  color:#6b3b22;
}

.muted {
  opacity:.75;
  font-size:12px;
}

.filter-form .form-group,
.field {
  display:flex;
  flex-direction:column;
  min-width:200px;
}

.pct {
  text-align:right;
  color:#6b6b6b;
  font-weight:700;
}

/* níveis */
    .lvl-cc td {
  background:#faf5f0;
  border-top:1px solid #f0e0d0;
  font-weight:800;
  color:#6b3b22;
}

.lvl-pai .nome {
  padding-left: 18px;
  font-weight:700;
}

.lvl-sub .nome {
  padding-left: 38px;
}

.pill {
  display:inline-block;
  padding:2px 8px;
  border-radius:999px;
  border:1px solid #f0e0d0;
  background:#faf5f0;
  color:#6b3b22;
  font-weight:800;
  font-size:0.78rem;
  white-space:nowrap;
}

.muted {
  color:#6b6b6b;
  font-weight:600;
  font-size:0.85rem;
}

:root {
  /* Mesma lógica das outras telas com scroll interno */ --altura-fixa-layout: 240px;
}

.fornecedores-page,
.mixes-list-col,
/* DIREITA: Família do produto */
    .mix-main-right {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.form-card {
  background: #fff;
  padding: 22px 26px;
  border-radius: 10px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.06);
  width: 100%;
  max-width: none;
  margin: 0;
  box-sizing: border-box;
}

.form-card-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
  gap: 12px;
  flex-wrap: wrap;
}

.form-card-header h2 {
  font-size: 1.3rem;
  margin: 0;
}

.codigo-sistema {
  font-size: 0.9rem;
  color: #666;
  background: #faf5f0;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid #f0e0d0;
  white-space: nowrap;
}

.form-layout {
  display: flex;
  flex-direction: column;
  gap: 14px;
  margin-top: 10px;
}

.form-row-line {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
}

.field {
  flex: 1 1 0;
  min-width: 180px;
}

.field-full {
  flex: 1 1 100%;
}

/* Tamanhos específicos para otimizar linhas */
    .field-cnpj {
  flex: 0 0 210px;
  max-width: 210px;
}

.field-small {
  flex: 0 0 140px;
  max-width: 140px;
}

.field-medium {
  flex: 0 0 260px;
  max-width: 260px;
}

.field-uf {
  flex: 0 0 100px;
  max-width: 100px;
}

label {
  font-weight: 600;
  font-size: 0.9rem;
  margin-bottom: 4px;
  display: block;
}

input,
select {
  width: 100%;
  padding: 9px 11px;
  border: 1px solid #ddd;
  border-radius: 6px;
  font-size: 0.95rem;
}

.form-actions {
  margin-top: 20px;
  display: flex;
  justify-content: flex-start;
  /* botões alinhados à esquerda */ gap: 10px;
}

.flash-container {
  margin-top: 8px;
}

.page-header .subtitle {
  margin-left: 10px;
  /* ajuste o valor como quiser: 6px, 8px, 12px... */ align-content: center;
}

/* Tamanhos específicos para otimizar linhas */
    .field-cnpj {
  flex: 0 0 210px;
  /* pequeno, só um pouco maior que o número */ max-width: 210px;
}

/* Fixa as alturas de header e footer */
    :root {
  --altura-fixa-layout: 260px;
  /* header + footer + margens */;
}

/* Área rolável interna do card de fornecedores */
    .scroll-area-fornecedores {
  max-height: calc(100vh - var(--altura-fixa-layout));
  /* ajusta inteligente da área da app */ overflow-y: auto;
  padding-right: 4px;
}

.mixes-layout {
  display: grid;
  grid-template-columns: minmax(260px, 320px) minmax(300px, 1fr);
  gap: 24px;
  align-items: flex-start;
}

.mixes-search-col {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.mixes-search-col label {
  font-weight: 500;
  font-size: 0.95rem;
}

.mixes-search-bar input {
  width: 100%;
  padding: 8px 10px;
  border-radius: 6px;
  border: 1px solid #ccc;
  font-size: 14px;
}

.mixes-search-hint,
.helper-text {
  font-size: 0.8rem;
  color: #777;
}

.mixes-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
  max-height: 520px;
  overflow-y: auto;
}

.mix-card {
  display: grid;
  grid-template-columns: 110px 1fr;
  gap: 12px;
  align-items: center;
  padding: 10px 12px;
  border-radius: 8px;
  border: 1px solid #e0e0e0;
  background: #fff;
}

.mix-thumb-col {
  width: 110px;
  height: 110px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border-radius: 6px;
  background: #f5f5f5;
}

.foto-produto-thumb {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  display: block;
}

.mix-thumb.placeholder {
  font-size: 12px;
  color: #777;
}

.mix-info-col {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.mix-code {
  font-weight: 600;
  font-size: 14px;
  text-decoration: none;
  color: inherit;
}

.mix-code:hover,
.mix-code:hover:not(.current),
.link-colecao:hover {
  text-decoration: underline;
}

.mix-desc {
  font-size: 13px;
  color: #555;
}

.thumb-button {
  border: none;
  background: transparent;
  padding: 0;
  cursor: pointer;
}

/* Lightbox tipo e-commerce (igual da tela de coleção) */
    .lightbox-backdrop,
/* Lightbox */
    .lightbox-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.8);
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 9999;
}

.lightbox-inner {
  position: relative;
  max-width: 90vw;
  max-height: 90vh;
}

.lightbox-image {
  max-width: 70vw;
  max-height: 70vh;
  border-radius: 12px;
  box-shadow: 0 10px 30px rgba(0,0,0,0.5);
  display: block;
  margin: 0 auto;
  object-fit: contain;
  background: #fff;
}

.lightbox-close {
  position: absolute;
  top: -12px;
  right: -12px;
  background: #ffffff;
  color: #333;
  border-radius: 999px;
  width: 28px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  cursor: pointer;
  box-shadow: 0 4px 10px rgba(0,0,0,0.3);
}

.lightbox-caption {
  margin-top: 8px;
  text-align: center;
  color: #f5f5f5;
  font-size: 0.9rem;
}

.mix-detail-layout {
  display: grid;
  grid-template-columns: minmax(260px, 320px) minmax(360px, 1.2fr) minmax(260px, 320px);
  gap: 24px;
  align-items: flex-start;
}

/* ESQUERDA: Foto + Download */
    .mix-main-left,
/* CENTRO: Código,
descrição,
tabela */
    .mix-main-center {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.mix-detail-photo {
  border-radius: 10px;
  background: #f5f5f5;
  padding: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 220px;
  max-height: 360px;
  overflow: hidden;
}

.mix-detail-photo img {
  max-width: 100%;
  max-height: 320px;
  object-fit: contain;
}

.btn-download {
  font-size: 0.85rem;
  padding: 6px 10px;
  align-self: flex-start;
}

.mix-detail-code {
  font-weight: 700;
  font-size: 1rem;
}

.mix-detail-meta h3 {
  margin: 0 0 8px;
  font-size: 0.9rem;
}

.mix-detail-meta table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.8rem;
}

.mix-detail-meta th,
.mix-detail-meta td {
  border: 1px solid #ddd;
  padding: 4px 6px;
  text-align: left;
}

.mix-detail-meta th {
  background: #f2f2f2;
  font-weight: 600;
}

.mix-main-right h3 {
  font-size: 0.95rem;
  margin: 0 0 6px;
}

.mixes-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  max-height: 520px;
  overflow-y: auto;
}

.mix-card {
  display: grid;
  grid-template-columns: 80px 1fr;
  gap: 8px;
  padding: 8px 10px;
  border-radius: 8px;
  border: 1px solid #e0e0e0;
  background: #fff;
}

.mix-thumb-col {
  width: 80px;
  height: 80px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border-radius: 6px;
  background: #f5f5f5;
}

.mix-thumb {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  cursor: zoom-in;
}

.mix-thumb.placeholder {
  font-size: 11px;
  color: #777;
}

.mix-info-col {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.mix-code {
  font-weight: 600;
  font-size: 0.85rem;
  text-decoration: none;
  color: inherit;
}

.mix-code.current {
  color: #555;
  cursor: default;
}

.mix-desc {
  font-size: 0.8rem;
  color: #555;
}

.mix-actions,
.roy-section {
  margin-top: 18px;
}

.btn-voltar {
  padding: 8px 14px;
  border-radius: 4px;
  border: 1px solid #ccc;
  background: #f8f8f8;
  font-size: 13px;
  text-decoration: none;
}

.btn-voltar:hover {
  background: #eee;
}

/* ===============================
       LIGHTBOX MELHORADO
       =============================== */
    .mix-lightbox {
  position: fixed;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9999;
}

.mix-lightbox.hidden {
  display: none !important;
}

.mix-lightbox-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.7);
}

.mix-lightbox-content {
  position: relative;
  z-index: 1;
  padding: 10px;
}

.mix-lightbox-content img {
  max-width: 90vw;
  max-height: 90vh;
  border-radius: 8px;
  background: #fff;
}

/* Botão X */
    .mix-lightbox-close {
  position: absolute;
  top: -12px;
  right: -12px;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: #fff;
  color: #333;
  font-size: 20px;
  font-weight: bold;
  border: none;
  box-shadow: 0 4px 10px rgba(0,0,0,0.4);
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
}

.mix-lightbox-close:hover {
  background: #f0f0f0;
}

.resumo-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin: 12px 0;
  font-size: 0.9rem;
}

.resumo-item span.label {
  display: block;
  font-size: 0.8rem;
  color: #777;
}

.resumo-item span.value,
.mix-header strong {
  font-weight: 600;
}

.table-resumo th,
.table-resumo td,
table.simple-table th,
table.simple-table td {
  padding: 6px 8px;
  border-bottom: 1px solid #eee;
  text-align: left;
}

.tabs-header {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-bottom: 10px;
  margin-top: 10px;
}

.tab-btn {
  border: 1px solid #ddd;
  background: #f5f5f5;
  padding: 6px 10px;
  border-radius: 6px;
  cursor: pointer;
  font-size: 0.9rem;
}

.tab-btn.active {
  background: #ff6b6b;
  color: #fff;
  border-color: #ff6b6b;
}

.tab-pane {
  display: none;
  margin-top: 10px;
}

.tabela-pedido-wrapper {
  max-height: 480px;
  overflow-y: auto;
  border-radius: 8px;
  border: 1px solid #eee;
}

.tabela-pedido-wrapper table,
.resumo-table-wrapper table,
/* Tabelas "simples" (painel coleção) */
        table.simple-table,
/* Tabelas do painel de compras (table-resumo) */
        table.table-resumo {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.85rem;
}

.tabela-pedido-wrapper th,
.tabela-pedido-wrapper td,
.resumo-table-wrapper th,
.resumo-table-wrapper td {
  padding: 4px 6px;
  border-bottom: 1px solid #f0f0f0;
  text-align: center;
}

.tabela-pedido-wrapper thead th {
  position: sticky;
  top: 0;
  background: #fafafa;
  z-index: 2;
}

.foto-produto-thumb {
  max-width: 70px;
  max-height: 70px;
  object-fit: contain;
  border-radius: 4px;
  border: 1px solid #eee;
  cursor: pointer;
}

.resumo-compra {
  margin-top: 10px;
  margin-bottom: 10px;
}

.resumo-totais p {
  margin: 0 12px 4px 0;
  display: inline-block;
  font-size: 0.9rem;
}

.resumo-table-wrapper {
  max-height: 300px;
  overflow-y: auto;
  border-radius: 8px;
  border: 1px solid #eee;
  margin-top: 10px;
}

.resumo-table-wrapper thead th {
  background: #fafafa;
  position: sticky;
  top: 0;
  z-index: 1;
}

.lightbox-image {
  max-width: 80vw;
  max-height: 80vh;
  border-radius: 12px;
  box-shadow: 0 10px 30px rgba(0,0,0,0.5);
  display: block;
  margin: 0 auto;
  object-fit: contain;
}

.text-right {
  text-align: right;
}

/* Grade no estilo da tela de cadastro */
    .grade-container {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  justify-content: flex-start;
}

.grade-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  font-size: 0.75rem;
  min-width: 32px;
}

.grade-item .grade-label {
  font-weight: 600;
  margin-bottom: 2px;
}

.grade-item .grade-qtd {
  color: #333;
}

.btn-link.btn-sm {
  font-size: 0.78rem;
  padding: 4px 8px;
}

/* ================== HEADER ================== */
    .mix-header {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 12px 24px;
  margin-bottom: 20px;
  font-size: 0.95rem;
}

/* ================== BOXES ================== */
    .mix-box {
  background:#fafafa;
  padding:12px 16px;
  border-radius:8px;
  border:1px solid #eee;
  margin-bottom:16px;
}

/* ================== FOTO ================== */
    .foto-produto {
  max-width:130px;
  max-height:130px;
  border-radius:6px;
  object-fit:cover;
  border:1px solid #eee;
  cursor:pointer;
}

/* Lightbox */
    #lightbox {
  display:none;
  position:fixed;
  top:0;
  left:0;
  width:100%;
  height:100%;
  background:rgba(0,0,0,0.8);
  justify-content:center;
  align-items:center;
  z-index:9999;
}

#lightbox img {
  max-width:90%;
  max-height:90%;
  border-radius:8px;
  box-shadow:0 0 20px #000;
}

/* ================== GRADE ================== */
    .grade-table {
  border-collapse: collapse;
  margin-top:6px;
  font-size:0.85rem;
}

.grade-table td {
  border:1px solid #ddd;
  padding:4px 8px;
  text-align:center;
  background:white;
}

/* ================== FORM ================== */
    .form-grid {
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap:16px;
  margin-top:10px;
}

.form-group label {
  font-size:0.85rem;
  font-weight:600;
  margin-bottom:3px;
}

/* ================== AÇÕES ================== */
    .actions-row {
  margin-top:22px;
  display:flex;
  gap:12px;
  flex-wrap:wrap;
}

.btn {
  padding:4px 12px;
  border-radius:4px;
  cursor:pointer;
}

.btn-primary {
  background:#e0543b;
  color:#fff;
}

.btn-warning {
  background:#e6b800;
  color:#000;
}

.btn-secondary {
  background:#e0e0e0;
  color:#000;
}

.btn-link {
  text-decoration:none;
  color:#e0543b;
}

.link-colecao {
  color: #e0543b;
  text-decoration: none;
  font-weight: 600;
}

body {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

/* faz o conteúdo "empurrar" o footer */

/* =========================================
   PEDIDOS - IMPORTAR
   ========================================= */
body.page-pedidos-importar .radio-group {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 4px;
}

body.page-pedidos-importar .radio-inline {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  font-weight: 500;
}

body.page-pedidos-importar .radio-inline input[type="radio"] {
  width: auto;
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
  vertical-align: middle;
}

body.page-pedidos-importar .subcard.d-none {
  display: none !important;
}

body.page-pedidos-importar .module-card-clean,
body.page-pedidos-importar .module-card-inner {
  background: transparent;
}

body.page-pedidos-importar .simple-form {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

body.page-pedidos-importar .form-row-inline {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: flex-start;
  gap: 12px;
}

body.page-pedidos-importar .form-group {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  flex: 0 0 16.666%;
  max-width: 16.666%;
  min-width: 160px;
}

body.page-pedidos-importar .form-group label {
  width: 100%;
}

body.page-pedidos-importar .form-group select,
body.page-pedidos-importar .form-group input[type="file"] {
  width: 100%;
  max-width: 100%;
}

body.page-pedidos-importar .radio-group {
  align-items: center;
}

body.page-pedidos-importar .subcard {
  border: 1px solid rgba(139, 63, 47, 0.14);
  border-radius: 12px;
  padding: 14px 16px;
  background: rgba(255, 255, 255, 0.72);
}

body.page-pedidos-importar .subcard-title {
  margin: 0 0 12px;
  color: #5a1e0e;
  font-size: 1rem;
}

body.page-pedidos-importar .data-table select {
  min-width: 180px;
  max-width: 240px;
}
    .page-wrapper {
  flex: 1;
}

/* Ajusta o container principal para ocupar a altura da tela */
    .main-container {
  display: flex;
  flex-direction: column;
  height: calc(100vh - 60px);
  /* ajusta se precisar */;
}

/* A barra das abas fica fixa */
    .tabs-header {
  flex-shrink: 0;
  position: sticky;
  top: 0;
  z-index: 10;
  padding-top: 10px;
  padding-bottom: 5px;
}

/* A área das abas agora rola */
    .tabs-content {
  flex: 1;
  overflow-y: auto;
  padding-right: 10px;
}

/* Remove espaços gigantes dentro das abas */
    .tab-pane {
  padding-top: 10px !important;
}

/* ============================== */
        /* LAYOUT E CARDS DE KPI          */
        /* ============================== */
        .page-wrapper {
  max-width: 1200px;
  margin: 0 auto;
  padding: 16px;
}

.page-title {
  font-size: 1.4rem;
  font-weight: 600;
  margin-bottom: 4px;
}

.page-subtitle {
  color: #666;
  font-size: 0.9rem;
  margin-bottom: 16px;
}

.filters-row {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 16px;
  align-items: flex-end;
}

.filters-row label {
  font-size: 0.8rem;
  margin-bottom: 4px;
  color: #555;
}

.filters-row select {
  padding: 6px 8px;
  border-radius: 4px;
  border: 1px solid #ccc;
  font-size: 0.9rem;
}

.filters-row button {
  padding: 8px 14px;
  border-radius: 4px;
  border: none;
  font-size: 0.9rem;
  cursor: pointer;
}

.btn-primary {
  background: #ff6b6b;
  color: #fff;
}

.btn-secondary {
  background: #f0f0f0;
  color: #333;
}

.kpi-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 12px;
  margin-bottom: 28px;
  /* mais respiro antes das tabelas */;
}

.kpi-card {
  border-radius: 8px;
  border: 1px solid #eee;
  padding: 10px 12px;
  background: #fff;
}

.kpi-label {
  font-size: 0.8rem;
  color: #777;
  margin-bottom: 4px;
}

.kpi-value {
  font-size: 1.1rem;
  font-weight: 600;
}

.kpi-extra {
  font-size: 0.75rem;
  color: #999;
  margin-top: 2px;
}

.table-wrapper {
  overflow-x: auto;
  border-radius: 8px;
  border: 1px solid #eee;
  background: #fff;
  margin: 24px 0 32px 0;
  /* espaçamento vertical maior */;
}

table.simple-table th,
table.table-resumo th {
  background: #ffefe8;
  font-weight: 600;
}

table.simple-table tbody tr:nth-child(even),
table.table-resumo tbody tr:nth-child(even) {
  background: #fafafa;
}

table.table-resumo th,
table.table-resumo td {
  padding: 8px 10px;
  /* aumenta altura das linhas */ border-bottom: 1px solid #eee;
  text-align: left;
}


.section-title {
  font-size: 1rem;
  font-weight: 600;
  margin: 20px 0 8px;
}

.alert {
  padding: 8px 10px;
  border-radius: 4px;
  margin-bottom: 12px;
  font-size: 0.85rem;
}

.alert-info {
  background: #e8f4ff;
  border: 1px solid #c3ddff;
}

.alert-warning {
  background: #fff7e0;
  border: 1px solid #ffeb99;
}

.alert-error {
  background: #ffe8e8;
  border: 1px solid #ffb3b3;
}

/* ============================== */
        /* MODAL DE IMAGEM DOS MIXES      */
        /* ============================== */
        .img-modal {
  display: none;
  position: fixed;
  z-index: 9999;
  inset: 0;
  background: rgba(0, 0, 0, 0.7);
  align-items: center;
  justify-content: center;
}

.img-modal-img {
  max-width: 90vw;
  max-height: 90vh;
  border-radius: 8px;
  background: #fff;
  padding: 8px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.4);
}

.img-modal-close {
  position: absolute;
  top: 16px;
  right: 24px;
  color: #fff;
  font-size: 32px;
  font-weight: bold;
  cursor: pointer;
}

/* ============================== */
    /* BADGES DE STATUS               */
    /* ============================== */
    .status-badge {
  display: inline-block;
  padding: 4px 10px;
  border-radius: 6px;
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1;
  text-transform: uppercase;
  letter-spacing: 0.2px;
  color: #fff;
}

.status-ok {
  background: #2e7d32;
}

/* Faturado */
    .status-mid {
  background: #f9a825;
}

/* Parcial */
    .status-no {
  background: #6c757d;
}

/* Não faturado */
    .status-bad {
  background: #d32f2f;
}

.text-right {
  text-align:right;
}

.status-tag {
  padding:3px 6px;
  border-radius:4px;
  font-size:0.78rem;
  font-weight:600;
  color:#fff;
  display:inline-block;
  white-space:nowrap;
}

/* vermelho */

    .group-th {
  text-align:center !important;
  border-bottom:0 !important;
}

.sub-th {
  font-size:0.82rem;
  background:#fafafa;
  border-top:0 !important;
}

.total-row {
  margin-top:10px;
  font-weight:600;
  text-align:right;
}

/* Ajustes leves só desta tela */

    .roy-page-card {
  max-width: 1600px;
  margin: 0 auto;
}

.roy-top-row {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  align-items: flex-end;
}

.roy-form-group {
  display: flex;
  flex-direction: column;
  min-width: 180px;
  font-size: 13px;
}

.roy-form-group.roy-form-group-wide {
  min-width: 360px;
  flex: 2 1 360px;
}

.roy-form-group label {
  margin-bottom: 4px;
}

.roy-form-group select,
.roy-form-group input {
  padding: 8px 10px;
  border-radius: 8px;
  border: 1px solid rgba(0,0,0,0.12);
  font-size: 14px;
  outline: none;
}

.roy-form-group select:focus,
.roy-form-group input:focus {
  border-color: rgba(0,0,0,0.35);
}

.roy-totais-row {
  margin-top: 10px;
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
  font-size: 14px;
  font-weight: 600;
}

.roy-section-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px;
}

.roy-section-title {
  font-size: 16px;
  font-weight: 600;
}

.roy-table-wrapper {
  margin-top: 6px;
}

.roy-subtitle {
  font-size: 13px;
  color: var(--text-muted);
  margin: 0 0 6px 0;
}

.table-compact th,
.table-compact td {
  padding: 6px 8px;
  font-size: 13px;
}

.roy-top-row .actions-col {
  align-self: flex-end;
}

.roy-empty {
  font-size: 13px;
  color: var(--text-muted);
  margin-top: 4px;
}

/* Estilo do painel reaproveitando o que você já tinha */
    .painel-wrapper {
  font-size: 14px;
}

.painel-filtros {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  margin-bottom: 12px;
}

.painel-filtro-bloco label {
  display: block;
  font-size: 13px;
  margin-bottom: 3px;
  font-weight: 500;
}

.painel-filtro-bloco select,
.painel-filtro-bloco input[type="date"] {
  padding: 4px 6px;
  font-size: 14px;
  min-width: 160px;
}

.btn-sm {
  padding: 4px 8px;
  font-size: 12px;
  cursor: pointer;
}

.painel-resumo-box {
  display: flex;
  gap: 18px;
  margin: 14px 0;
  flex-wrap: wrap;
}

.painel-resumo-item {
  background: #f7e1d3;
  padding: 8px 12px;
  border-radius: 6px;
  min-width: 150px;
}

.painel-resumo-item strong {
  display: block;
  font-size: 12px;
}

.painel-resumo-item span {
  font-size: 16px;
  font-weight: 700;
}

table.painel-tabela {
  width: 100%;
  border-collapse: collapse;
  margin-top: 10px;
}

table.painel-tabela th,
table.painel-tabela td {
  border: 1px solid #f0d4c1;
  padding: 6px 8px;
  font-size: 13px;
}

table.painel-tabela th {
  background: #f7e1d3;
  text-align: left;
}

table.painel-tabela tr:nth-child(even) {
  background: #fffaf7;
}

.nota-royal {
  font-size: 0.8rem;
  color: #666;
  margin-top: 4px;
}

.form-grid {
  display:flex;
  flex-direction:column;
  gap:10px;
  font-size:0.9rem;
}

.row-line {
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  align-items:flex-end;
}

.field label {
  font-weight:600;
  margin-bottom:4px;
}

textarea {
  width:100%;
  min-height:90px;
  resize:vertical;
}

.btn-mini {
  padding:2px 6px;
  font-size:0.75rem;
  cursor:pointer;
  white-space:nowrap;
}

.btn-row {
  display:flex;
  gap:10px;
  align-items:center;
  flex-wrap:wrap;
}

.divider {
  height:1px;
  background:#eee;
  margin:12px 0;
}

/* =======================
       MODAL (padrão)
       ======================= */
    .modal,
/* =======================
       MODAL
       ======================= */
    .modal,
.modal {
  display:none;
  position:fixed;
  top:0;
  left:0;
  width:100%;
  height:100%;
  background:rgba(0,0,0,0.45);
  justify-content:center;
  align-items:center;
  z-index:999;
}

.modal-content {
  background:#ffffff;
  padding:16px 18px;
  border-radius:6px;
  max-width:720px;
  width:100%;
  font-size:14px;
  box-shadow:0 2px 10px rgba(0,0,0,0.2);
}

.modal-content h3 {
  margin-top:0;
  margin-bottom:10px;
  font-size:18px;
  color:#6b3b22;
}

.modal-actions {
  margin-top:12px;
  display:flex;
  justify-content:flex-end;
  gap:8px;
  flex-wrap:wrap;
}

.mix-row {
  border:1px solid #ddd;
  padding:10px;
  border-radius:6px;
  margin-bottom:8px;
  background:#fff;
}

.mix-row-body {
  margin-top:8px;
  font-size:12px;
}

.mix-photo {
  width:72px;
  height:72px;
  background:#f5f5f5;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:6px;
  overflow:hidden;
  border:1px solid #eee;
}

.mix-photo img {
  max-width:100%;
  max-height:100%;
  display:none;
}

.muted {
  opacity:0.75;
}

.resumo-box {
  background:#fff7f4;
  border:1px solid #f2d9d1;
  border-radius:8px;
  padding:10px 12px;
  margin-top:10px;
}

.resumo-box h4 {
  margin:0 0 6px 0;
}

.resumo-line {
  display:flex;
  justify-content:space-between;
  gap:10px;
  font-size:13px;
  margin:4px 0;
}

.resumo-line strong {
  font-weight:700;
}

.modal-content {
  max-width: 92vw;
}

/* 2 = recusado (laranja) */
    .st-ticket-2,
.st-ticket-2,
.st-forn-2 {
  background:#e35b2a;
}

/* 4 = parcial (azul) */
    .st-ticket-4 {
  background:#0d6efd;
}

.modal-content {
  background:#ffffff;
  padding:16px 18px;
  border-radius:6px;
  max-width:420px;
  width:100%;
  font-size:14px;
  box-shadow:0 2px 10px rgba(0,0,0,0.2);
}

.modal-row {
  margin-bottom:8px;
}

.modal-row label {
  display:block;
  font-weight:500;
  margin-bottom:3px;
}

.modal-row input[type="date"],
.modal-row input[type="password"],
.modal-row select,
.modal-row textarea {
  width:100%;
  padding:5px 7px;
  font-size:14px;
}

.modal-row textarea {
  min-height:60px;
  resize:vertical;
}

.modal-actions {
  margin-top:10px;
  display:flex;
  justify-content:flex-end;
  gap:8px;
}

.readonly-field {
  background:#f5f5f5;
  color:#555;
}

.status-tag {
  padding:3px 6px;
  border-radius:4px;
  font-size:0.78rem;
  font-weight:700;
  color:#fff;
  display:inline-block;
  white-space:nowrap;
}

.st-ticket-4 {
  background:#6f42c1;
}

.modal-content {
  background:#fff;
  padding:16px 18px;
  border-radius:6px;
  max-width:520px;
  width:100%;
  font-size:14px;
  box-shadow:0 2px 10px rgba(0,0,0,0.2);
}

.field {
  min-width:160px;
}

.modal-content {
  max-width:92vw;
}

/* =========================================
   DESIGN SYSTEM SHARED PATTERNS
   ========================================= */
.entity-form-page {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.form-scroll-area {
  max-height: calc(100vh - var(--altura-fixa-layout, 240px));
  overflow-y: auto;
  width: 100%;
  padding: 0 24px 16px;
  box-sizing: border-box;
}

.section-title-sm {
  margin: 0 0 8px 0;
}

.filter-actions-end {
  align-self: flex-end;
}

.actions-end {
  display: flex;
  justify-content: flex-end;
  margin-top: 6px;
}

.block-panel {
  margin-top: 10px;
}
/* =========================================
   FIELD SIZE HELPERS
   Aliases semânticos para dimensões de campo / colunas de tabela
   ========================================= */
/* tamanhos de campo */
.u-inl-a629a35a, .field-xs  { min-width:160px; }
.u-inl-923e958f, .field-sm  { min-width:180px; }
.u-inl-4694d62a, .field-md  { min-width:220px; }
.u-inl-6686b386,
.u-inl-c1c4e59e, .field-lg  { min-width:260px; }
.u-inl-856f0a81, .field-xl  { min-width:240px; flex:1; }
.u-inl-cec175ec,
.u-inl-f0c6ce88, .field-full { flex:1; min-width:320px; }

/* colunas de tabela */
.u-inl-25feffff, .col-action-mini    { width:10%; }
.u-inl-6306c189, .col-action-sm      { width:14%; }
.u-inl-be99ae25, .col-status         { width:16%; }
.u-inl-bae1e199, .col-amount         { width:18%; }
.u-inl-d46b266e, .col-name-primary   { width:42%; }

/* utilitários de hint e título de seção em ações */
.u-inl-41f96333, .hint-sm            { font-size:12px; margin-top:4px; }
.u-inl-ee99edc6, .section-title-actions { margin:0 0 6px 0; }
.u-inl-ab64eb16, .row-hidden-flex    { display:none; align-items:flex-end; }

/* colunas de tabela extras */
.u-inl-518cc756, .col-primary-wide  { width:60%; }
.u-inl-59c8d6ff, .col-secondary     { width:30%; }
.u-inl-9e3c4ccb, .mt-xs             { margin-top:6px; }

/* Loccitane / Centro de custo: card sem fundo branco */
body.page-compras-consultar .module-card,
body.page-fornecedores-lista .module-card-clean,
body.page-fin-centro-custo-consultar .module-card-clean,
body.page-fin-plano-contas-consultar .module-card-clean,
body.page-fin-fornecedor-despesa-consultar .module-card-clean,
body.page-fin-tipo-documento-consultar .module-card-clean,
body.page-fin-despesa-consultar .module-card-clean,
body.page-fin-despesa-parcelas-consultar .module-card-clean,
body.page-fin-notas-consulta .module-card-clean,
body.page-loccitane-lojas .module-card-clean,
body.page-metricas-index .module-card-clean,
body.page-config-gerais-index .module-card-clean,
body.page-loccitane-gerencial .module-card-clean {
  background: transparent;
  border: 0;
  box-shadow: none;
  padding: 0;
}

body.page-compras-consultar .module-card-inner {
  gap: 12px;
}

body.page-metricas-index .module-card-inner {
  gap: 12px;
}

body.page-config-gerais-index .module-card-inner {
  gap: 12px;
}

body.page-loccitane-gerencial .module-card-inner {
  gap: 12px;
}

body.page-config-gerais-index .loc-page-map {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.9rem;
  margin-bottom: 4px;
}

body.page-metricas-index .loc-page-map {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.9rem;
  margin-bottom: 4px;
}

body.page-loccitane-gerencial .loc-page-map {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.9rem;
  margin-bottom: 4px;
}

body.page-config-gerais-index .loc-page-map a {
  color: #8b3f2f;
  text-decoration: none;
  font-weight: 600;
}

body.page-metricas-index .loc-page-map a {
  color: #8b3f2f;
  text-decoration: none;
  font-weight: 600;
}

body.page-loccitane-gerencial .loc-page-map a {
  color: #8b3f2f;
  text-decoration: none;
  font-weight: 600;
}

body.page-config-gerais-index .loc-page-map a:hover {
  text-decoration: underline;
}

body.page-metricas-index .loc-page-map a:hover {
  text-decoration: underline;
}

body.page-loccitane-gerencial .loc-page-map a:hover {
  text-decoration: underline;
}

body.page-config-gerais-index .loc-page-current {
  color: #6b6b6b;
  font-weight: 700;
}

body.page-metricas-index .loc-page-current {
  color: #6b6b6b;
  font-weight: 700;
}

body.page-loccitane-gerencial .loc-page-current {
  color: #6b6b6b;
  font-weight: 700;
}

body.page-config-gerais-index .tabs-header {
  background: transparent;
  border-bottom: 1px solid rgba(139, 63, 47, 0.22);
  padding: 0;
}

body.page-metricas-index .tabs-header {
  background: transparent;
  border-bottom: 1px solid rgba(139, 63, 47, 0.22);
  padding: 0;
}

body.page-loccitane-gerencial .tabs-header {
  background: transparent;
  border-bottom: 1px solid rgba(139, 63, 47, 0.22);
  padding: 0;
}

body.page-loccitane-plano-compra .tabs-header {
  background: transparent;
  border-bottom: 1px solid rgba(139, 63, 47, 0.22);
  padding: 0;
}

body.page-config-gerais-index .tab-btn {
  background: transparent;
  color: #6e4a3a;
  border: 1px solid transparent;
  border-bottom: 2px solid transparent;
  border-radius: 8px 8px 0 0;
  font-weight: 700;
  padding: 10px 14px;
}

body.page-metricas-index .tab-btn {
  background: transparent;
  color: #6e4a3a;
  border: 1px solid transparent;
  border-bottom: 2px solid transparent;
  border-radius: 8px 8px 0 0;
  font-weight: 700;
  padding: 10px 14px;
}

body.page-loccitane-gerencial .tab-btn {
  background: transparent;
  color: #6e4a3a;
  border: 1px solid transparent;
  border-bottom: 2px solid transparent;
  border-radius: 8px 8px 0 0;
  font-weight: 700;
  padding: 10px 14px;
}

body.page-loccitane-plano-compra .tab-btn {
  background: transparent;
  color: #6e4a3a;
  border: 1px solid transparent;
  border-bottom: 2px solid transparent;
  border-radius: 8px 8px 0 0;
  font-weight: 700;
  padding: 10px 14px;
}

body.page-config-gerais-index .tab-btn.active {
  color: #5a1e0e;
  border-color: rgba(139, 63, 47, 0.22);
  border-bottom-color: #8b3f2f;
  background: rgba(255, 255, 255, 0.18);
}

body.page-metricas-index .tab-btn.active {
  color: #5a1e0e;
  border-color: rgba(139, 63, 47, 0.22);
  border-bottom-color: #8b3f2f;
  background: rgba(255, 255, 255, 0.18);
}

body.page-loccitane-gerencial .tab-btn.active {
  color: #5a1e0e;
  border-color: rgba(139, 63, 47, 0.22);
  border-bottom-color: #8b3f2f;
  background: rgba(255, 255, 255, 0.18);
}

body.page-loccitane-plano-compra .tab-btn.active {
  color: #5a1e0e;
  border-color: rgba(139, 63, 47, 0.22);
  border-bottom-color: #8b3f2f;
  background: rgba(255, 255, 255, 0.18);
}

body.page-config-gerais-index .tab-pane {
  padding-top: 12px;
}

body.page-metricas-index .tab-pane {
  padding-top: 12px;
}

body.page-loccitane-gerencial .tab-pane {
  display: none;
  padding-top: 12px;
}

body.page-loccitane-gerencial .tab-pane.active {
  display: block;
}

body.page-loccitane-plano-compra .tab-pane {
  display: none;
  padding-top: 12px;
}

body.page-loccitane-plano-compra .tab-pane.active {
  display: block;
}

body.page-config-gerais-index .config-placeholder-card {
  border: 1px solid rgba(139, 63, 47, 0.16);
  border-radius: 12px;
  padding: 18px;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.66) 0%, rgba(248, 236, 229, 0.42) 100%);
}

body.page-loccitane-gerencial .config-placeholder-card {
  border: 1px solid rgba(139, 63, 47, 0.16);
  border-radius: 12px;
  padding: 18px;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.66) 0%, rgba(248, 236, 229, 0.42) 100%);
}

body.page-config-gerais-index .config-placeholder-card h2 {
  margin: 0;
  font-size: 1rem;
  color: #5a1e0e;
}

body.page-loccitane-gerencial .config-placeholder-card h2 {
  margin: 0;
  font-size: 1rem;
  color: #5a1e0e;
}

body.page-config-gerais-index .config-placeholder-card p {
  margin: 8px 0 0;
  color: #6b5c57;
}

body.page-config-gerais-index .table-wrapper {
  background: transparent;
  border-color: rgba(0,0,0,0.08);
}

body.page-config-gerais-index .table thead th {
  background: #ecd4c7;
  color: #4e2918;
  font-weight: 700;
}

body.page-config-gerais-index .table tbody tr:nth-child(even) td {
  background: rgba(139, 63, 47, 0.035);
}

body.page-config-gerais-index .table tbody tr:hover td {
  background: rgba(139, 63, 47, 0.075);
}

body.page-config-gerais-index .loc-status-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 78px;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1;
  border: 1px solid transparent;
}

body.page-config-gerais-index .loc-status-badge.is-active {
  background: #e9f7ee;
  color: #1f6a37;
  border-color: #bfe8cd;
}

body.page-config-gerais-index .loc-status-badge.is-inactive {
  background: #f5f5f5;
  color: #555;
  border-color: #dfdfdf;
}

body.page-config-gerais-index .loc-type-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 82px;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1;
  border: 1px solid transparent;
}

body.page-config-gerais-index .loc-type-badge.is-special {
  background: #fdeaea;
  color: #b24343;
  border-color: #f3c3c3;
}

body.page-config-gerais-index .loc-type-badge.is-default {
  background: transparent;
  color: #7b6357;
  border-color: #d8c7be;
}

body.page-config-gerais-index .loc-loja-edit-link {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: inherit;
  text-decoration: none;
}

body.page-config-gerais-index .loc-loja-edit-link:hover {
  color: #8b3f2f;
}

body.page-config-gerais-index .loc-loja-edit-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 999px;
  border: 1px solid rgba(139, 63, 47, 0.18);
  background: rgba(139, 63, 47, 0.08);
  color: #7c3b27;
  font-size: 0.95rem;
  line-height: 1;
}

body.page-config-gerais-index .loc-loja-expand-cell {
  background: rgba(255, 255, 255, 0.86);
}

body.page-config-gerais-index .loc-loja-form {
  margin-top: 6px;
}

body.page-config-gerais-index .config-user-toggle-field {
  min-width: 220px;
  max-width: 320px;
  flex: 0 0 auto;
}

body.page-config-gerais-index .config-user-password-field {
  min-width: 280px;
}

body.page-config-gerais-index .config-vendedor-status-field {
  min-width: 128px;
  max-width: 128px;
  flex: 0 0 128px;
}

body.page-config-gerais-index .config-horario-status-field {
  min-width: 110px;
  max-width: 110px;
  flex: 0 0 110px;
}

body.page-config-gerais-index .config-horario-flag-field {
  min-width: 150px;
  max-width: 150px;
  flex: 0 0 150px;
}

body.page-config-gerais-index .config-vendedor-actions-inline {
  flex: 0 0 auto;
  align-self: flex-end;
  margin-bottom: 1px;
  white-space: nowrap;
}

body.page-config-gerais-index .config-calendar-topbar {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  margin-bottom: 18px;
}

body.page-config-gerais-index .config-calendar-topbar-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  margin-left: auto;
  flex-wrap: wrap;
}

body.page-config-gerais-index .config-calendar-year-form,
body.page-config-gerais-index .config-calendar-build-form {
  margin: 0;
}

body.page-config-gerais-index .config-calendar-year-form {
  display: flex;
  align-items: flex-end;
  gap: 12px;
  flex-wrap: wrap;
}

body.page-config-gerais-index .config-calendar-intro {
  margin-bottom: 16px;
}

body.page-config-gerais-index .config-calendar-intro h2 {
  margin: 0;
  font-size: 1.25rem;
  color: #51392d;
}

body.page-config-gerais-index .config-calendar-intro p {
  margin: 6px 0 0;
  color: #6b5c57;
}

body.page-config-gerais-index .config-calendar-subtabs {
  margin-bottom: 10px;
}

body.page-config-gerais-index .config-calendar-subpane {
  padding-top: 6px;
}

body.page-config-gerais-index .config-calendar-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 16px;
  margin-bottom: 18px;
}

body.page-config-gerais-index .config-calendar-summary {
  margin-bottom: 2px;
}

body.page-config-gerais-index .config-calendar-summary-title {
  margin: 0 0 12px;
  font-size: 1rem;
  color: #5e4032;
}

body.page-config-gerais-index .config-calendar-card {
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid #eadfd8;
  border-radius: 12px;
  padding: 16px 18px;
  box-shadow: 0 6px 20px rgba(88, 57, 39, 0.06);
}

body.page-config-gerais-index .config-calendar-card h3 {
  margin: 0 0 12px;
  font-size: 1rem;
  color: #5e4032;
}

body.page-config-gerais-index .config-calendar-kpis {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

body.page-config-gerais-index .config-calendar-kpi {
  min-width: 160px;
  padding: 12px 14px;
  border-radius: 10px;
  background: #f7efe9;
  border: 1px solid #ead8cb;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

body.page-config-gerais-index .config-calendar-kpi-value {
  font-size: 1.4rem;
  font-weight: 700;
  color: #704731;
}

body.page-config-gerais-index .config-calendar-kpi-label,
body.page-config-gerais-index .config-calendar-note {
  color: #6f5f58;
  font-size: 0.92rem;
}

body.page-config-gerais-index .config-calendar-note {
  margin: 14px 0 0;
  line-height: 1.45;
}

body.page-config-gerais-index .config-calendar-share-overlay {
  position: fixed;
  inset: 0;
  background: rgba(27, 18, 13, 0.52);
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 10040;
  padding: 20px;
}

body.page-config-gerais-index .config-calendar-share-overlay.active {
  display: flex;
}

body.page-config-gerais-index .config-calendar-share-card {
  width: min(760px, 96vw);
  background: #fffdf9;
  border: 1px solid #ead7ca;
  border-radius: 22px;
  box-shadow: 0 28px 70px rgba(81, 47, 29, 0.22);
  padding: 22px;
}

body.page-config-gerais-index .config-calendar-share-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 18px;
}

body.page-config-gerais-index .config-calendar-share-header h3 {
  margin: 0;
  font-size: 1.35rem;
  color: #6b3b22;
}

body.page-config-gerais-index .config-calendar-share-header p {
  margin: 6px 0 0;
  color: #8a6a58;
}

body.page-config-gerais-index .config-calendar-share-close {
  border: 0;
  background: #f3e4da;
  color: #6b3b22;
  border-radius: 10px;
  width: 36px;
  height: 36px;
  font-size: 1.2rem;
  cursor: pointer;
}

body.page-config-gerais-index .config-calendar-share-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

body.page-config-gerais-index .config-calendar-share-status {
  min-height: 22px;
  margin-top: 10px;
  color: #6b3b22;
  font-size: 0.92rem;
}

body.page-config-gerais-index .config-calendar-share-status[data-kind="success"] {
  color: #1f6d35;
}

body.page-config-gerais-index .config-calendar-share-status[data-kind="error"] {
  color: #9f2130;
}

body.page-config-gerais-index .config-calendar-share-box {
  display: none;
  margin-top: 12px;
  padding: 12px;
  border-radius: 14px;
  border: 1px solid #ecd4c7;
  background: #ffffff;
}

body.page-config-gerais-index .config-calendar-share-box.is-open {
  display: block;
}

body.page-config-gerais-index .config-calendar-share-inline {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

body.page-config-gerais-index .config-calendar-share-inline input {
  flex: 1 1 420px;
}

body.page-config-gerais-index .config-calendar-rules {
  margin: 0;
  padding-left: 18px;
  color: #6f5f58;
}

body.page-config-gerais-index .config-calendar-rules li + li {
  margin-top: 8px;
}

body.page-config-gerais-index .config-calendar-actions-cell {
  white-space: nowrap;
}

body.page-config-gerais-index .config-calendar-visual-overlay {
  position: fixed;
  inset: 0;
  z-index: 1200;
  background: rgba(6, 14, 28, 0.78);
  backdrop-filter: blur(4px);
  padding: 28px;
  overflow-y: auto;
}

body.page-config-gerais-index .config-calendar-visual-card {
  max-width: 1380px;
  margin: 0 auto;
  border-radius: 22px;
  padding: 26px 28px 22px;
  background: linear-gradient(180deg, #fffdfa 0%, #f7eee7 100%);
  color: #5a3d31;
  border: 1px solid rgba(139, 63, 47, 0.14);
  box-shadow: 0 28px 70px rgba(31, 18, 13, 0.28);
}

body.page-config-gerais-index .config-calendar-visual-header {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 18px;
}

body.page-config-gerais-index .config-calendar-visual-header h2 {
  margin: 0;
  font-size: 2.4rem;
  line-height: 1;
  color: #6b3d2d;
}

body.page-config-gerais-index .config-calendar-visual-actions {
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

body.page-config-gerais-index .config-calendar-visual-download,
body.page-config-gerais-index .config-calendar-visual-close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 999px;
  border: 1px solid rgba(139, 63, 47, 0.16);
  background: rgba(139, 63, 47, 0.08);
  color: #7a402f;
  text-decoration: none;
}

body.page-config-gerais-index .config-calendar-visual-close {
  font-size: 1.5rem;
}

body.page-config-gerais-index .config-calendar-visual-download {
  font-size: 1.15rem;
  font-weight: 800;
}

body.page-config-gerais-index .config-calendar-visual-download:hover,
body.page-config-gerais-index .config-calendar-visual-close:hover {
  background: rgba(139, 63, 47, 0.16);
}

body.page-config-gerais-index .config-calendar-legend {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  flex-wrap: wrap;
  margin-bottom: 24px;
}

body.page-config-gerais-index .config-calendar-legend-item {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #6c5449;
  font-size: 0.94rem;
}

body.page-config-gerais-index .config-calendar-legend-dot {
  width: 11px;
  height: 11px;
  border-radius: 999px;
  background: var(--legend-bg);
  border: 1px solid var(--legend-border);
  box-shadow: 0 0 0 2px rgba(255, 248, 243, 0.95);
}

body.page-config-gerais-index .config-calendar-year-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
}

body.page-config-gerais-index .config-calendar-month-card {
  border-radius: 18px;
  padding: 16px 16px 14px;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(248, 239, 233, 0.98) 100%);
  border: 1px solid rgba(139, 63, 47, 0.12);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8);
}

body.page-config-gerais-index .config-calendar-month-card h3 {
  margin: 0 0 14px;
  text-align: center;
  font-size: 1.05rem;
  color: #6a3f31;
}

body.page-config-gerais-index .config-calendar-weekdays,
body.page-config-gerais-index .config-calendar-days-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 8px;
}

body.page-config-gerais-index .config-calendar-weekdays {
  margin-bottom: 10px;
}

body.page-config-gerais-index .config-calendar-weekdays span {
  text-align: center;
  font-size: 0.76rem;
  color: rgba(115, 91, 80, 0.7);
}

body.page-config-gerais-index .config-calendar-day {
  min-height: 50px;
  padding: 4px 2px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
}

body.page-config-gerais-index .config-calendar-day.is-outside {
  opacity: 0.26;
}

body.page-config-gerais-index .config-calendar-day-number {
  width: 32px;
  height: 32px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.95rem;
  color: #6a4a3a;
  border: 1px solid transparent;
}

body.page-config-gerais-index .config-calendar-month-legend-wrap {
  margin-top: 26px;
  padding-top: 18px;
  border-top: 1px solid rgba(139, 63, 47, 0.12);
}

body.page-config-gerais-index .config-calendar-month-legend-header h3 {
  margin: 0;
  color: #613a2d;
  font-size: 1.08rem;
}

body.page-config-gerais-index .config-calendar-month-legend-header p {
  margin: 6px 0 0;
  color: #7b665d;
}

body.page-config-gerais-index .config-calendar-month-legend-list {
  margin-top: 16px;
  column-count: 3;
  column-gap: 20px;
}

body.page-config-gerais-index .config-calendar-month-legend-group {
  break-inside: avoid;
  display: grid;
  gap: 10px;
  margin: 0 0 14px;
}

body.page-config-gerais-index .config-calendar-month-legend-month {
  margin-top: 0;
  font-size: 0.84rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #8a5a47;
}

body.page-config-gerais-index .config-calendar-month-legend-item {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  padding: 12px 14px;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.82);
  border: 1px solid rgba(139, 63, 47, 0.1);
}

body.page-config-gerais-index .config-calendar-month-legend-date {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  border-radius: 999px;
  background: #f4e5dc;
  color: #7a4330;
  font-weight: 800;
}

body.page-config-gerais-index .config-calendar-month-legend-title {
  color: #573b30;
  font-weight: 700;
}

body.page-config-gerais-index .config-calendar-month-legend-meta {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 4px;
  color: #7a655c;
  font-size: 0.9rem;
}

body.page-config-gerais-index .config-calendar-month-legend-meta span {
  padding: 3px 8px;
  border-radius: 999px;
  background: #f7efe9;
  border: 1px solid #ead8cb;
}

body.page-config-gerais-index .config-calendar-month-legend-apps {
  margin-top: 10px;
  display: grid;
  gap: 8px;
}

body.page-config-gerais-index .config-calendar-month-legend-app {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  padding: 8px 10px;
  border-radius: 10px;
  background: #fcf7f3;
  border: 1px solid #efe0d4;
  color: #6c5449;
  font-size: 0.9rem;
}

body.page-config-gerais-index .config-calendar-month-legend-app strong {
  color: #5a372b;
}

@media (max-width: 1080px) {
  body.page-config-gerais-index .config-calendar-month-legend-list {
    column-count: 2;
  }
}

@media (max-width: 760px) {
  body.page-config-gerais-index .config-calendar-month-legend-list {
    column-count: 1;
  }
}

body.page-config-gerais-index .config-calendar-day-number.has-primary {
  background: var(--day-bg);
  border-color: var(--day-border);
  color: var(--day-text);
  box-shadow: 0 0 0 2px rgba(10, 23, 48, 0.46);
}

body.page-config-gerais-index .config-calendar-day-badges {
  display: flex;
  justify-content: center;
  gap: 3px;
  flex-wrap: wrap;
  min-height: 12px;
}

body.page-config-gerais-index .config-calendar-day-badge {
  min-width: 14px;
  height: 14px;
  padding: 0 3px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--badge-bg);
  border: 1px solid var(--badge-border);
  color: var(--badge-text);
  font-size: 0.58rem;
  font-weight: 700;
  line-height: 1;
}

@media (max-width: 1280px) {
  body.page-config-gerais-index .config-calendar-year-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 980px) {
  body.page-config-gerais-index .config-calendar-year-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  body.page-config-gerais-index .config-calendar-visual-overlay {
    padding: 12px;
  }

  body.page-config-gerais-index .config-calendar-visual-card {
    padding: 20px 14px 16px;
  }

  body.page-config-gerais-index .config-calendar-year-grid {
    grid-template-columns: 1fr;
  }
}

body.page-config-gerais-index .config-user-checkbox {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 39px;
  margin: 0;
  padding: 9px 11px;
  border: 1px solid #ddd;
  border-radius: 6px;
  background: #fff;
  font-weight: 600;
  white-space: nowrap;
}

body.page-config-gerais-index .config-user-checkbox input[type="checkbox"] {
  width: auto;
  margin: 0;
  flex: 0 0 auto;
}

body.page-loccitane-gerencial .config-placeholder-card p {
  margin: 8px 0 0;
  color: #6b5c57;
}

body.page-lunalo-books .rel-buttons,
body.page-lunalo-books .loc-gestao-filtro-form,
body.page-lunalo-books .loc-gestao-filtro-form .form-group {
  display: flex;
  align-items: flex-end;
  gap: 12px;
  flex-wrap: wrap;
}

body.page-lunalo-books .loc-page-topbar {
  flex-wrap: nowrap;
  align-items: center;
}

body.page-lunalo-books .loc-gestao-filtros {
  margin-left: auto;
}

body.page-lunalo-books .loc-gestao-filtro-form {
  flex-wrap: nowrap;
}

body.page-lunalo-books .loc-gestao-filtro-form .form-group {
  flex-direction: column;
  align-items: stretch;
}

body.page-lunalo-books .loc-gestao-filtro-form label {
  font-size: 0.85rem;
  font-weight: 600;
  color: #6e4a3a;
}

body.page-lunalo-relatorios .rel-buttons,
body.page-lunalo-relatorios .loc-gestao-filtro-form,
body.page-lunalo-relatorios .loc-gestao-filtro-form .form-group {
  display: flex;
  align-items: flex-end;
  gap: 12px;
  flex-wrap: wrap;
}

body.page-lunalo-relatorios .loc-gestao-filtro-form {
  justify-content: flex-start;
  margin-bottom: 14px;
}

body.page-lunalo-relatorios .loc-gestao-filtro-form .form-group {
  flex-direction: column;
  align-items: stretch;
  flex: 0 0 min(16.66%, 220px);
  max-width: 220px;
  min-width: 150px;
}

body.page-lunalo-relatorios .loc-gestao-filtro-form label {
  font-size: 0.85rem;
  font-weight: 600;
  color: #6e4a3a;
}

body.page-lunalo-relatorios .loc-gestao-filtro-form select,
body.page-lunalo-relatorios .loc-gestao-filtro-form input[type="text"],
body.page-lunalo-relatorios .loc-gestao-filtro-form input[type="date"],
body.page-lunalo-relatorios .loc-gestao-filtro-form input[type="number"] {
  width: 100%;
  min-width: 0;
}

body.page-lunalo-relatorios .rel-buttons {
  flex: 0 0 auto;
  gap: 10px;
}

body.page-lunalo-relatorios #tab-relatorios .loc-gestao-filtro-form,
body.page-lunalo-relatorios #tab-painel-colecao .loc-gestao-filtro-form,
body.page-lunalo-relatorios #tab-painel-compras .loc-gestao-filtro-form {
  align-items: flex-end;
}

body.page-lunalo-books #tab-relatorios .loc-gestao-filtro-form,
body.page-lunalo-books #tab-painel-book .loc-gestao-filtro-form {
  flex-wrap: nowrap;
  align-items: flex-end;
}

body.page-lunalo-books #tab-relatorios .rel-buttons,
body.page-lunalo-books #tab-painel-book .rel-buttons {
  display: flex;
  flex-wrap: nowrap;
  align-items: flex-end;
  gap: 10px;
  margin-top: 0;
}

body.page-lunalo-books-pedido .tabs-header,
body.page-lunalo-books-consultar .tabs-header {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 12px 0 16px;
}

body.page-lunalo-books-pedido .tab-btn,
body.page-lunalo-books-consultar .tab-btn {
  background: transparent;
  color: #6e4a3a;
  border: 1px solid transparent;
  border-bottom: 2px solid transparent;
  border-radius: 8px 8px 0 0;
  font-weight: 700;
  padding: 10px 14px;
}

body.page-lunalo-books-pedido .tab-btn.active,
body.page-lunalo-books-consultar .tab-btn.active {
  color: #5a1e0e;
  border-color: rgba(139, 63, 47, 0.22);
  border-bottom-color: #8b3f2f;
  background: rgba(255, 255, 255, 0.18);
}

body.page-lunalo-books-pedido .tab-pane,
body.page-lunalo-books-consultar .tab-pane {
  display: none;
  padding-top: 12px;
}

body.page-lunalo-books-pedido .tab-pane.active,
body.page-lunalo-books-consultar .tab-pane.active {
  display: block;
}

body.page-lunalo-books .td-expand {
  width: 22px;
  text-align: center;
  padding: 0 2px;
}

body.page-lunalo-books .btn-expand {
  background: none;
  border: none;
  color: #8b3f2f;
  text-decoration: none;
  font-size: 0.75rem;
  line-height: 1;
  cursor: pointer;
}

body.page-lunalo-books .btn-expand:hover {
  color: #5a1e0e;
}

body.page-lunalo-books-pedido .tabela-pedido-wrapper th:nth-child(2) {
  text-align: center;
}

body.page-lunalo-books-pedido .tabela-pedido-wrapper td:nth-child(2) {
  text-align: left;
}

body.page-lunalo-books-pedido .grade-item {
  min-width: 54px;
}

body.page-lunalo-books-pedido .grade-item label {
  display: block;
  width: 100%;
  text-align: center;
}

body.page-lunalo-books-pedido .input-qtd,
body.page-lunalo-books-pedido .grade-qtd-input {
  width: 54px;
  min-width: 54px;
  height: 34px;
  padding: 4px 6px;
  text-align: center;
  font-size: 0.9rem;
  appearance: auto;
  -webkit-appearance: auto;
}

body.page-lunalo-books .painel-cards {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 12px;
  margin-bottom: 18px;
}

body.page-lunalo-books .painel-card {
  flex: 1 1 220px;
  border: 1px solid rgba(139, 63, 47, 0.16);
  border-radius: 12px;
  padding: 14px 16px;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.7) 0%, rgba(248, 236, 229, 0.45) 100%);
}

body.page-lunalo-books .painel-card-title {
  font-size: 0.82rem;
  font-weight: 700;
  color: #6e4a3a;
  margin-bottom: 6px;
}

body.page-lunalo-books .painel-card-value {
  font-size: 1.45rem;
  font-weight: 800;
  color: #4e2918;
}

body.page-lunalo-books #tab-importar-book #linhas-container {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

body.page-lunalo-books #tab-importar-book .linha-book {
  width: 100%;
}

body.page-lunalo-books #tab-importar-book .form-row-inline {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: flex-start;
  gap: 12px;
}

body.page-lunalo-books #tab-importar-book .form-group {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  flex: 0 0 16.666%;
  max-width: 16.666%;
  min-width: 150px;
}

body.page-lunalo-books #tab-importar-book .form-group label {
  width: 100%;
}

body.page-lunalo-books #tab-importar-book .form-group select,
body.page-lunalo-books #tab-importar-book .form-group input[type="file"] {
  width: 100%;
  max-width: 100%;
}

body.page-lunalo-compras-lancar .loc-page-topbar {
  margin-bottom: 10px;
}

body.page-lunalo-compras-lancar .tabs-header {
  margin: 12px 0 16px;
}

body.page-lunalo-compras-lancar .tab-pane {
  padding-top: 12px;
}

body.page-lunalo-compras-lancar form {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
}

body.page-lunalo-compras-lancar .form-row {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: min(100%, 220px);
}

body.page-lunalo-compras-lancar .form-row label {
  width: 100%;
}

body.page-lunalo-compras-lancar .form-row select,
body.page-lunalo-compras-lancar .form-row input[type="text"],
body.page-lunalo-compras-lancar .form-row input[type="file"],
body.page-lunalo-compras-lancar .form-row input[type="date"],
body.page-lunalo-compras-lancar .form-row input[type="number"] {
  width: 100%;
  max-width: 100%;
}

body.page-lunalo-compras-lancar .form-row:has(input[name="link_pedido"]),
body.page-lunalo-compras-lancar .form-row:has(input[name="link_pdf"]),
body.page-lunalo-compras-lancar .form-row:has(input[name="link_catalogo"]),
body.page-lunalo-compras-lancar .form-row:has(input[type="url"]) {
  width: min(100%, 720px);
}

body.page-lunalo-compras-lancar .form-row:has(input[type="file"]) {
  width: min(100%, 420px);
}

body.page-lunalo-compras-lancar .tab-pane > h3 {
  margin: 0 0 4px;
}

body.page-compras-consultar .table-resumo {
  background: transparent;
}

body.page-metricas-index .table-wrapper,
body.page-metricas-index .table-resumo {
  background: transparent;
}

body.page-metricas-index .table-wrapper {
  overflow-x: auto;
}

body.page-metricas-index .table-resumo {
  width: 100%;
  table-layout: fixed;
}

body.page-metricas-index .table-resumo col.col-expand { width: 22px; }
body.page-metricas-index .table-resumo col.col-departamento { width: 17%; }
body.page-metricas-index .table-resumo col.col-artigo { width: 21%; }
body.page-metricas-index .table-resumo col.col-num { width: 7%; }
body.page-metricas-index .table-resumo col.col-last { width: 6%; }

body.page-metricas-index .table-resumo th,
body.page-metricas-index .table-resumo td {
  overflow-wrap: anywhere;
}

body.page-metricas-index .table-resumo th:nth-child(3),
body.page-metricas-index .table-resumo td:nth-child(3) {
  min-width: 220px;
  max-width: 520px;
  white-space: normal;
  overflow-wrap: anywhere;
}

body.page-metricas-index .table-resumo th:nth-child(12),
body.page-metricas-index .table-resumo td:nth-child(12) {
  width: 74px;
  white-space: nowrap;
}

body.page-metricas-index .table-resumo th:nth-child(4),
body.page-metricas-index .table-resumo td:nth-child(4),
body.page-metricas-index .table-resumo th:nth-child(5),
body.page-metricas-index .table-resumo td:nth-child(5),
body.page-metricas-index .table-resumo th:nth-child(6),
body.page-metricas-index .table-resumo td:nth-child(6),
body.page-metricas-index .table-resumo th:nth-child(7),
body.page-metricas-index .table-resumo td:nth-child(7),
body.page-metricas-index .table-resumo th:nth-child(8),
body.page-metricas-index .table-resumo td:nth-child(8),
body.page-metricas-index .table-resumo th:nth-child(9),
body.page-metricas-index .table-resumo td:nth-child(9),
body.page-metricas-index .table-resumo th:nth-child(10),
body.page-metricas-index .table-resumo td:nth-child(10),
body.page-metricas-index .table-resumo th:nth-child(11),
body.page-metricas-index .table-resumo td:nth-child(11) {
  white-space: nowrap;
}

body.page-compras-consultar .table-resumo thead th {
  background: #ecd4c7;
  color: #4e2918;
}

body.page-metricas-index .table-resumo thead th {
  background: #ecd4c7;
  color: #4e2918;
}

body.page-compras-consultar .table-resumo tbody tr:nth-child(even) td {
  background: rgba(139, 63, 47, 0.035);
}

body.page-metricas-index .table-resumo tbody tr:nth-child(even) td {
  background: rgba(139, 63, 47, 0.035);
}

body.page-compras-consultar .table-resumo tbody tr:hover td {
  background: rgba(139, 63, 47, 0.075);
}

body.page-metricas-index .table-resumo tbody tr:hover td {
  background: rgba(139, 63, 47, 0.075);
}

/* Métricas: expand button */
body.page-metricas-index .td-expand {
  width: 18px;
  text-align: center;
  padding: 0 1px;
}
body.page-metricas-index .btn-expand {
  background: none;
  border: none;
  cursor: pointer;
  font-size: 0.7rem;
  color: #8b3f2f;
  padding: 0;
  line-height: 1;
}
body.page-metricas-index .btn-expand:hover { color: #5a1e0e; }

body.page-metricas-index .table-resumo th:nth-child(2),
body.page-metricas-index .table-resumo td:nth-child(2) {
  padding-left: 4px;
}

/* Métricas: expand row */
body.page-metricas-index .row-expand td { background: #fdf5f2 !important; }
body.page-metricas-index .expand-cell { padding: 12px 16px !important; }

/* Métricas: tabela interna dos mixes */
body.page-metricas-index .mixes-table-wrap {
  background: #fff;
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 8px;
  overflow: hidden;
}
body.page-metricas-index .mixes-table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
}

body.page-metricas-index .mixes-table.mixes-table-aligned col.col-expand { width: 22px; }
body.page-metricas-index .mixes-table.mixes-table-aligned col.col-departamento { width: 17%; }
body.page-metricas-index .mixes-table.mixes-table-aligned col.col-artigo { width: 21%; }
body.page-metricas-index .mixes-table.mixes-table-aligned col.col-num { width: 7%; }
body.page-metricas-index .mixes-table.mixes-table-aligned col.col-last { width: 6%; }

body.page-metricas-index .mix-main-cell {
  padding-right: 6px;
}

body.page-metricas-index .mix-main-content {
  display: flex;
  align-items: center;
  gap: 10px;
}

body.page-metricas-index .mix-main-text {
  min-width: 0;
}

body.page-metricas-index .mix-main-text .mix-code,
body.page-metricas-index .mix-main-text .mix-desc {
  white-space: normal;
  overflow-wrap: anywhere;
}
body.page-metricas-index .mixes-table th,
body.page-metricas-index .mixes-table td {
  padding: 8px 10px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
  vertical-align: middle;
}
body.page-metricas-index .mixes-table thead th {
  background: #f3e3da;
  color: #4e2918;
  font-size: 0.78rem;
}
body.page-metricas-index .mix-line-sem-venda {
  opacity: 0.55;
}
body.page-metricas-index .mix-code {
  font-weight: 700;
  color: #4e2918;
}
body.page-metricas-index .mix-desc {
  color: #6c5a52;
  font-size: 0.8rem;
}

body.page-metricas-index .mix-brand {
  color: #8b3f2f;
  font-size: 0.75rem;
  font-weight: 700;
  margin-top: 2px;
  text-transform: uppercase;
}

body.page-metricas-index .foto-produto-thumb {
  width: 56px;
  height: 56px;
  object-fit: cover;
  border-radius: 6px;
  border: 1px solid rgba(0, 0, 0, 0.12);
}
body.page-metricas-index .foto-sem-foto {
  width: 56px;
  height: 56px;
  border-radius: 6px;
  border: 1px solid rgba(0, 0, 0, 0.12);
  background: #f5f0ee;
  position: relative;
  flex-shrink: 0;
}
body.page-metricas-index .foto-sem-foto::before {
  content: '';
  position: absolute;
  inset: 8px;
  border-radius: 50%;
  border: 2px solid #c9b4ae;
}
body.page-metricas-index .foto-sem-foto::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 2px;
  height: 60%;
  background: #c9b4ae;
  transform: translate(-50%, -50%) rotate(45deg);
  border-radius: 1px;
}
body.page-metricas-index .thumb-button {
  padding: 0;
  border: 0;
  background: transparent;
  cursor: zoom-in;
  line-height: 0;
}
body.page-metricas-index .thumb-button:hover .foto-produto-thumb {
  box-shadow: 0 0 0 2px rgba(139, 63, 47, 0.25);
}

/* Métricas: cores de giro */
body.page-metricas-index .cel-giro-alto  { color: #1a7a3a; font-weight: 700; }
body.page-metricas-index .cel-giro-medio { color: #c07700; font-weight: 600; }
body.page-metricas-index .cel-giro-baixo { color: #b03030; }
body.page-metricas-index .cel-giro-zero  { color: #aaa; }
body.page-metricas-index .cel-giro-sem-compra { color: #8b3f2f; font-weight: 700; }

/* Métricas: alinhamento numérico */
body.page-metricas-index .text-right { text-align: right; }

/* Loccitane lojas: edição e cadastro em mesma tela */
body.page-loccitane-lojas .loc-lojas-page {
  position: relative;
}

body.page-loccitane-lojas .loc-page-topbar,
body.page-loccitane-parametros .loc-page-topbar,
body.page-loccitane-produtos .loc-page-topbar,
body.page-loccitane-estoque .loc-page-topbar,
body.page-loccitane-pedidos .loc-page-topbar,
body.page-loccitane-compras .loc-page-topbar,
body.page-loccitane-plano-compra .loc-page-topbar,
body.page-fornecedores-lista .loc-page-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 6px;
}

body.page-loccitane-lojas .loc-page-map {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.9rem;
  margin-bottom: 4px;
}

body.page-fornecedores-lista .loc-page-map {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.9rem;
  margin-bottom: 4px;
}

body.page-loccitane-lojas .loc-page-map a {
  color: #8b3f2f;
  text-decoration: none;
  font-weight: 600;
}

body.page-fornecedores-lista .loc-page-map a {
  color: #8b3f2f;
  text-decoration: none;
  font-weight: 600;
}

body.page-loccitane-lojas .loc-page-map a:hover {
  text-decoration: underline;
}

body.page-fornecedores-lista .loc-page-map a:hover {
  text-decoration: underline;
}

body.page-loccitane-lojas .loc-page-current {
  color: #6b6b6b;
  font-weight: 700;
}

body.page-fornecedores-lista .loc-page-current {
  color: #6b6b6b;
  font-weight: 700;
}

/* ============================================================
   FORNECEDORES - LISTA/EDICAO/CADASTRO
   ============================================================ */

body.page-fornecedores-lista .forn-page {
  position: relative;
}

body.page-fornecedores-lista .forn-filtro-form {
  margin: 8px 0 12px;
  padding: 10px 12px;
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.76);
}

body.page-fornecedores-lista .forn-check-field input[type="checkbox"] {
  width: 18px;
  height: 18px;
  margin-top: 9px;
}

body.page-fornecedores-lista .table-wrapper {
  background: transparent;
  border-color: rgba(0,0,0,0.08);
}

body.page-fornecedores-lista .table thead th {
  background: #ecd4c7;
  color: #4e2918;
  font-weight: 700;
}

body.page-fornecedores-lista .table tbody tr:nth-child(even) td {
  background: rgba(139, 63, 47, 0.035);
}

body.page-fornecedores-lista .table tbody tr:hover td {
  background: rgba(139, 63, 47, 0.075);
}

body.page-fornecedores-lista .forn-edit-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: inherit;
  text-decoration: none;
}

body.page-fornecedores-lista .forn-edit-link:hover {
  color: #8b3f2f;
}

body.page-fornecedores-lista .forn-edit-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 999px;
  border: 1px solid rgba(139, 63, 47, 0.18);
  background: rgba(139, 63, 47, 0.08);
  color: #7c3b27;
  font-size: 0.95rem;
  line-height: 1;
}

body.page-fornecedores-lista .forn-expand-cell {
  background: rgba(255, 255, 255, 0.86);
}

body.page-fornecedores-lista .forn-form {
  margin-top: 6px;
}

body.page-fornecedores-lista .forn-empty {
  text-align: center;
  color: #777;
  padding: 14px 8px;
}

body.page-fornecedores-lista .forn-cadastro-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.35);
  z-index: 998;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: 82px 14px 24px;
}

body.page-fornecedores-lista .forn-cadastro-card {
  width: min(1120px, 96vw);
  background: #ffffff;
  border-radius: 12px;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.22);
  border: 1px solid #e6e6e6;
  padding: 16px;
}

@media (max-width: 900px) {
  body.page-fornecedores-lista .forn-cadastro-card {
    width: 100%;
    border-radius: 10px;
  }
}

body.page-loccitane-lojas .table-wrapper {
  background: transparent;
  border-color: rgba(0,0,0,0.08);
}

body.page-loccitane-lojas .table thead th {
  background: #ecd4c7;
  color: #4e2918;
  font-weight: 700;
}

body.page-loccitane-lojas .table tbody tr:nth-child(even) td {
  background: rgba(139, 63, 47, 0.035);
}

body.page-loccitane-lojas .table tbody tr:hover td {
  background: rgba(139, 63, 47, 0.075);
}

body.page-loccitane-lojas .loc-status-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 78px;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1;
  border: 1px solid transparent;
}

body.page-loccitane-lojas .loc-status-badge.is-active {
  background: #e9f7ee;
  color: #1f6a37;
  border-color: #bfe8cd;
}

body.page-loccitane-lojas .loc-status-badge.is-inactive {
  background: #f5f5f5;
  color: #555;
  border-color: #dfdfdf;
}

body.page-loccitane-lojas .loc-loja-edit-link {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: inherit;
  text-decoration: none;
}

body.page-loccitane-lojas .loc-loja-edit-link:hover {
  color: #8b3f2f;
}

body.page-compras-consultar .compra-edit-link {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
}

body.page-compras-consultar .compra-edit-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 999px;
  border: 1px solid rgba(139, 63, 47, 0.18);
  background: rgba(139, 63, 47, 0.08);
  color: #7c3b27;
  font-size: 0.95rem;
  line-height: 1;
}

body.page-loccitane-lojas .loc-loja-edit-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 999px;
  border: 1px solid rgba(139, 63, 47, 0.18);
  background: rgba(139, 63, 47, 0.08);
  color: #7c3b27;
  font-size: 0.95rem;
  line-height: 1;
}

body.page-loccitane-lojas .loc-loja-expand-cell {
  background: rgba(255, 255, 255, 0.86);
}

body.page-loccitane-lojas .loc-loja-form {
  margin-top: 6px;
}

body.page-loccitane-lojas .loc-loja-form textarea {
  min-height: 78px;
}

body.page-loccitane-lojas .loc-loja-meta-field {
  max-width: 220px;
}

body.page-loccitane-lojas .loc-loja-meta-value {
  min-height: 39px;
  display: flex;
  align-items: center;
  padding: 9px 11px;
  border: 1px solid #ddd;
  border-radius: 6px;
  background: #f8f8f8;
  font-size: 0.92rem;
}

body.page-loccitane-lojas .loc-loja-cadastro-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.35);
  z-index: 998;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: 82px 14px 24px;
}

body.page-loccitane-lojas .loc-loja-cadastro-card {
  width: min(1024px, 96vw);
  background: #ffffff;
  border-radius: 12px;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.22);
  border: 1px solid #e6e6e6;
  padding: 16px;
}

@media (max-width: 900px) {
  body.page-loccitane-lojas .loc-loja-cadastro-card {
    width: 100%;
    border-radius: 10px;
  }
}

/* ============================================================
   L'OCCITANE — PARÂMETROS DE PLANEJAMENTO
   ============================================================ */

body.page-loccitane-parametros .loc-param-page {
  position: relative;
}

body.page-loccitane-parametros .loc-page-map {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.9rem;
  margin-bottom: 4px;
}

body.page-loccitane-parametros .loc-page-map a {
  color: #8b3f2f;
  text-decoration: none;
  font-weight: 600;
}

body.page-loccitane-parametros .loc-page-map a:hover {
  text-decoration: underline;
}

body.page-loccitane-parametros .loc-page-current {
  color: #6b6b6b;
  font-weight: 700;
}

body.page-loccitane-parametros .table-wrapper {
  background: transparent;
  border-color: rgba(0,0,0,0.08);
}

body.page-loccitane-parametros .table thead th {
  background: #ecd4c7;
  color: #4e2918;
  font-weight: 700;
}

body.page-loccitane-parametros .table tbody tr:nth-child(even) td {
  background: rgba(139, 63, 47, 0.035);
}

body.page-loccitane-parametros .table tbody tr:hover td {
  background: rgba(139, 63, 47, 0.075);
}

body.page-loccitane-parametros .loc-status-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 78px;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1;
  border: 1px solid transparent;
}

body.page-loccitane-parametros .loc-status-badge.is-active {
  background: #e9f7ee;
  color: #1f6a37;
  border-color: #bfe8cd;
}

body.page-loccitane-parametros .loc-status-badge.is-inactive {
  background: #f5f5f5;
  color: #555;
  border-color: #dfdfdf;
}

body.page-loccitane-parametros .loc-param-edit-link {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: inherit;
  text-decoration: none;
}

body.page-loccitane-parametros .loc-param-edit-link:hover {
  color: #8b3f2f;
}

body.page-loccitane-parametros .loc-param-edit-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 999px;
  border: 1px solid rgba(139, 63, 47, 0.18);
  background: rgba(139, 63, 47, 0.08);
  color: #7c3b27;
  font-size: 0.95rem;
  line-height: 1;
}

body.page-loccitane-parametros .loc-param-date-cell {
  white-space: nowrap;
  font-size: 0.88rem;
  color: #666;
}

body.page-loccitane-parametros .loc-param-expand-cell {
  background: rgba(255, 255, 255, 0.86);
}

body.page-loccitane-parametros .loc-param-form {
  margin-top: 6px;
}

body.page-loccitane-parametros .loc-param-form textarea {
  min-height: 78px;
}

body.page-loccitane-parametros .loc-param-info-label {
  margin: 10px 0 6px;
  padding: 10px 14px;
  background: #faf6f3;
  border-left: 3px solid #c88b72;
  border-radius: 0 6px 6px 0;
  font-size: 0.86rem;
  color: #5a3520;
  line-height: 1.7;
}

body.page-loccitane-parametros .loc-param-cadastro-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.35);
  z-index: 998;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: 82px 14px 24px;
}

body.page-loccitane-parametros .loc-param-cadastro-card {
  width: min(1024px, 96vw);
  background: #ffffff;
  border-radius: 12px;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.22);
  border: 1px solid #e6e6e6;
  padding: 16px;
}

@media (max-width: 900px) {
  body.page-loccitane-parametros .loc-param-cadastro-card {
    width: 100%;
    border-radius: 10px;
  }
}

/* ============================================================
   L'OCCITANE - PEDIDOS
   ============================================================ */

body.page-loccitane-pedidos .loc-ped-page {
  position: relative;
}

body.page-loccitane-pedidos .loc-page-map {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.9rem;
  margin-bottom: 4px;
}

body.page-loccitane-pedidos .loc-page-map a {
  color: #8b3f2f;
  text-decoration: none;
  font-weight: 600;
}

body.page-loccitane-pedidos .loc-page-map a:hover {
  text-decoration: underline;
}

body.page-loccitane-pedidos .loc-page-current {
  color: #6b6b6b;
  font-weight: 700;
}

body.page-loccitane-pedidos .loc-ped-table-wrap {
  max-height: 68vh;
  overflow: auto;
  background: transparent;
  border-color: rgba(0,0,0,0.08);
}

body.page-loccitane-pedidos .loc-ped-table thead th {
  position: sticky;
  top: 0;
  z-index: 5;
  background: #ecd4c7;
  color: #4e2918;
  font-weight: 700;
}

body.page-loccitane-pedidos .loc-ped-table tbody tr:nth-child(even) td {
  background: rgba(139, 63, 47, 0.035);
}

body.page-loccitane-pedidos .loc-ped-table tbody tr:hover td {
  background: rgba(139, 63, 47, 0.075);
}

body.page-loccitane-pedidos .loc-ped-edit-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: inherit;
  text-decoration: none;
}

body.page-loccitane-pedidos .loc-ped-edit-link:hover {
  color: #8b3f2f;
}

body.page-loccitane-pedidos .loc-ped-edit-icon {
  display: inline-block;
  width: 12px;
  text-align: center;
  color: #7c3b27;
  font-size: 0.7rem;
  font-weight: 700;
  padding: 0;
  line-height: 1;
}

body.page-loccitane-pedidos .loc-status-badge,
body.page-loccitane-compras .loc-status-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 78px;
  padding: 3px 8px;
  border-radius: 999px;
  border: 1px solid transparent;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.2px;
  text-transform: uppercase;
  white-space: nowrap;
}

body.page-loccitane-pedidos .loc-status-badge.is-neutral,
body.page-loccitane-compras .loc-status-badge.is-neutral {
  background: #eef1f4;
  color: #4d5866;
  border-color: #d8dee5;
}

body.page-loccitane-pedidos .loc-status-badge.is-success,
body.page-loccitane-compras .loc-status-badge.is-success {
  background: #e7f7ec;
  color: #23633a;
  border-color: #b7e7c6;
}

body.page-loccitane-pedidos .loc-status-badge.is-danger,
body.page-loccitane-compras .loc-status-badge.is-danger {
  background: #fdebec;
  color: #8a2630;
  border-color: #f5c2c7;
}

body.page-loccitane-pedidos .loc-status-badge.is-warning,
body.page-loccitane-compras .loc-status-badge.is-warning {
  background: #fff2e3;
  color: #8a4b12;
  border-color: #f1c99b;
}

body.page-loccitane-pedidos .loc-ped-expand-cell {
  background: rgba(255, 255, 255, 0.86);
}

body.page-loccitane-pedidos .loc-ped-form {
  margin-top: 6px;
}

body.page-loccitane-pedidos .loc-ped-link-compra-form {
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px dashed rgba(0, 0, 0, 0.12);
}

body.page-loccitane-pedidos .loc-ped-empty {
  text-align: center;
  color: #777;
  padding: 16px 8px;
}

body.page-loccitane-pedidos .loc-ped-preview-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.35);
  z-index: 998;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: 82px 14px 24px;
}

body.page-loccitane-pedidos .loc-ped-preview-card {
  width: min(1100px, 96vw);
  background: #ffffff;
  border-radius: 12px;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.22);
  border: 1px solid #e6e6e6;
  padding: 16px;
}

body.page-loccitane-pedidos .loc-ped-preview-subtitle {
  margin-top: 0;
  color: #6f5e56;
}

body.page-loccitane-pedidos .loc-ped-preview-total-global {
  margin: 10px 0 14px;
  padding: 10px 12px;
  border: 1px solid #e7c8b8;
  border-radius: 10px;
  background: #fff4ee;
  color: #7c3b27;
  font-size: 1rem;
  font-weight: 700;
}

body.page-loccitane-pedidos .loc-ped-preview-total-global strong {
  font-size: 1.1rem;
}

body.page-loccitane-pedidos .loc-ped-preview-actions-top {
  margin: 0 0 10px;
}

body.page-loccitane-pedidos .loc-ped-preview-table-wrap {
  max-height: 50vh;
  overflow: auto;
  border: 1px solid #ebdfd8;
  border-radius: 10px;
  background: #fffdfb;
  padding: 8px;
}

body.page-loccitane-pedidos .loc-ped-preview-table input {
  width: 100%;
}

body.page-loccitane-pedidos .loc-ped-preview-table {
  table-layout: fixed;
}

body.page-loccitane-pedidos .loc-ped-preview-table th:nth-child(1) { width: 190px; }
body.page-loccitane-pedidos .loc-ped-preview-table th:nth-child(3) { width: 120px; }
body.page-loccitane-pedidos .loc-ped-preview-table th:nth-child(4) { width: 140px; }
body.page-loccitane-pedidos .loc-ped-preview-table th:nth-child(5) { width: 145px; }

body.page-loccitane-pedidos .loc-ped-preview-table th {
  background: #f3e1d7;
  color: #4e2918;
  font-weight: 700;
}

body.page-loccitane-pedidos .loc-ped-preview-table td {
  vertical-align: middle;
}

body.page-loccitane-pedidos .loc-ped-preview-table tbody tr:nth-child(even) td {
  background: rgba(139, 63, 47, 0.035);
}

body.page-loccitane-pedidos .loc-ped-preview-table tbody tr:hover td {
  background: rgba(139, 63, 47, 0.075);
}

body.page-loccitane-pedidos .loc-ped-expand-table-wrap {
  max-height: 50vh;
  overflow: auto;
  border: 1px solid #ebdfd8;
  border-radius: 10px;
  background: #fffdfb;
  padding: 8px;
}

body.page-loccitane-pedidos .loc-ped-expand-table {
  table-layout: fixed;
  width: 100%;
}

body.page-loccitane-pedidos .loc-ped-expand-table th {
  background: #f3e1d7;
  color: #4e2918;
  font-weight: 700;
}

body.page-loccitane-pedidos .loc-ped-expand-table th:nth-child(1) { width: 74px; }
body.page-loccitane-pedidos .loc-ped-expand-table th:nth-child(2) { width: 200px; }
body.page-loccitane-pedidos .loc-ped-expand-table th:nth-child(4) { width: 125px; }
body.page-loccitane-pedidos .loc-ped-expand-table th:nth-child(5) { width: 130px; }
body.page-loccitane-pedidos .loc-ped-expand-table th:nth-child(6) { width: 145px; }

body.page-loccitane-pedidos .loc-ped-expand-table td {
  vertical-align: middle;
}

body.page-loccitane-pedidos .loc-ped-expand-table tbody tr:nth-child(even) td {
  background: rgba(139, 63, 47, 0.035);
}

body.page-loccitane-pedidos .loc-ped-expand-table tbody tr:hover td {
  background: rgba(139, 63, 47, 0.075);
}

body.page-loccitane-pedidos .loc-ped-expand-table .loc-col-foto {
  text-align: center;
}

body.page-loccitane-pedidos .loc-ped-expand-table .loc-col-sku {
  white-space: nowrap;
  font-weight: 600;
}

body.page-loccitane-pedidos .loc-ped-expand-table .loc-col-desc {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

body.page-loccitane-pedidos .loc-ped-expand-table .loc-col-qtd,
body.page-loccitane-pedidos .loc-ped-expand-table .loc-col-vlr,
body.page-loccitane-pedidos .loc-ped-expand-table .loc-col-total {
  text-align: right;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

body.page-loccitane-pedidos .loc-ped-expand-table .loc-col-qtd input,
body.page-loccitane-pedidos .loc-ped-expand-table .loc-col-vlr input,
body.page-loccitane-pedidos .loc-ped-expand-table .loc-col-sku input {
  height: 32px;
}

body.page-loccitane-pedidos .loc-ped-expand-table .loc-col-qtd input,
body.page-loccitane-pedidos .loc-ped-preview-table .loc-ped-qtd {
  min-width: 92px;
}

body.page-loccitane-pedidos .loc-ped-expand-table tfoot td {
  background: #f9ebe2;
  border-top: 2px solid #e5c8ba;
}

body.page-loccitane-pedidos .loc-col-soma-label {
  text-align: right;
  font-weight: 700;
  color: #5a2f1f;
}

body.page-loccitane-pedidos .loc-ped-obs-row {
  margin-top: 12px;
}

body.page-loccitane-pedidos .loc-ped-obs-text {
  width: 100%;
  border: 1px solid #d9c4b8;
  border-radius: 8px;
  padding: 8px 10px;
  background: #fff;
  color: #3d2a22;
  resize: vertical;
  min-height: 84px;
}

body.page-loccitane-pedidos .loc-ped-obs-text:focus {
  outline: none;
  border-color: #a85a3b;
  box-shadow: 0 0 0 2px rgba(168, 90, 59, 0.15);
}

body.page-loccitane-pedidos .loc-ped-thumb {
  width: 48px;
  height: 48px;
  object-fit: cover;
  border-radius: 6px;
  border: 1px solid rgba(0, 0, 0, 0.12);
  background: #f7f7f7;
}

body.page-loccitane-pedidos .loc-ped-no-photo {
  width: 48px;
  height: 48px;
  border-radius: 6px;
  border: 1px solid rgba(0, 0, 0, 0.12);
  background: #f5f0ee;
  position: relative;
  flex-shrink: 0;
}

body.page-loccitane-pedidos .loc-ped-no-photo::before {
  content: '';
  position: absolute;
  inset: 8px;
  border-radius: 50%;
  border: 2px solid #c9b4ae;
}

body.page-loccitane-pedidos .loc-ped-no-photo::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 2px;
  height: 60%;
  background: #c9b4ae;
  transform: translate(-50%, -50%) rotate(45deg);
  border-radius: 1px;
}

body.page-loccitane-pedidos .loc-ped-inp {
  width: 100%;
  height: 34px;
  border: 1px solid #d9c4b8;
  border-radius: 8px;
  padding: 6px 10px;
  background: #fff;
  color: #3d2a22;
}

body.page-loccitane-pedidos .loc-ped-inp:focus {
  outline: none;
  border-color: #a85a3b;
  box-shadow: 0 0 0 2px rgba(168, 90, 59, 0.15);
}

body.page-loccitane-pedidos .loc-ped-inp-num {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

body.page-loccitane-pedidos .loc-ped-inp-sku {
  text-transform: uppercase;
  font-weight: 600;
}

body.page-loccitane-pedidos .loc-btn-danger {
  background: #f0cfcf;
  border: 1px solid #e3b1b1;
  color: #874141;
}

body.page-loccitane-pedidos .loc-btn-danger:hover:not(:disabled) {
  background: #e9c1c1;
  border-color: #d99d9d;
  color: #7a3838;
}

@media (max-width: 900px) {
  body.page-loccitane-pedidos .loc-ped-preview-card {
    width: 100%;
    border-radius: 10px;
  }
}

/* ============================================================
   L'OCCITANE - PRODUTOS
   ============================================================ */

body.page-loccitane-produtos .loc-prod-page {
  position: relative;
}

body.page-loccitane-estoque .loc-estoque-page {
  position: relative;
}

body.page-loccitane-produtos .loc-page-map {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.9rem;
  margin-bottom: 4px;
}

body.page-loccitane-estoque .loc-page-map {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.9rem;
  margin-bottom: 4px;
}

body.page-loccitane-produtos .loc-page-map a {
  color: #8b3f2f;
  text-decoration: none;
  font-weight: 600;
}

body.page-loccitane-estoque .loc-page-map a {
  color: #8b3f2f;
  text-decoration: none;
  font-weight: 600;
}

body.page-loccitane-produtos .loc-page-map a:hover {
  text-decoration: underline;
}

body.page-loccitane-estoque .loc-page-map a:hover {
  text-decoration: underline;
}

body.page-loccitane-produtos .loc-page-current {
  color: #6b6b6b;
  font-weight: 700;
}

body.page-loccitane-estoque .loc-page-current {
  color: #6b6b6b;
  font-weight: 700;
}

body.page-loccitane-produtos .table-wrapper {
  background: transparent;
  border-color: rgba(0,0,0,0.08);
}

body.page-loccitane-produtos .loc-prod-table-wrap {
  max-height: 68vh;
  overflow: auto;
}

body.page-loccitane-produtos .loc-prod-table thead th {
  position: sticky;
  top: 0;
  z-index: 5;
}

body.page-loccitane-produtos .table thead th {
  background: #ecd4c7;
  color: #4e2918;
  font-weight: 700;
}

body.page-loccitane-produtos .table tbody tr:nth-child(even) td {
  background: rgba(139, 63, 47, 0.035);
}

body.page-loccitane-produtos .table tbody tr:hover td {
  background: rgba(139, 63, 47, 0.075);
}

body.page-loccitane-produtos .loc-prod-thumb {
  width: 48px;
  height: 48px;
  object-fit: cover;
  border-radius: 6px;
  border: 1px solid rgba(0, 0, 0, 0.12);
  background: #f7f7f7;
  cursor: pointer;
}

body.page-loccitane-produtos .loc-prod-photo-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
}

body.page-loccitane-produtos .foto-sem-foto,
body.page-loccitane-estoque .foto-sem-foto {
  width: 48px;
  height: 48px;
  border-radius: 6px;
  border: 1px solid rgba(0, 0, 0, 0.12);
  background: #f5f0ee;
  position: relative;
  flex-shrink: 0;
}

body.page-loccitane-produtos .foto-sem-foto::before,
body.page-loccitane-estoque .foto-sem-foto::before {
  content: '';
  position: absolute;
  inset: 8px;
  border-radius: 50%;
  border: 2px solid #c9b4ae;
}

body.page-loccitane-produtos .foto-sem-foto::after,
body.page-loccitane-estoque .foto-sem-foto::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 2px;
  height: 60%;
  background: #c9b4ae;
  transform: translate(-50%, -50%) rotate(45deg);
  border-radius: 1px;
}

body.page-loccitane-produtos .loc-prod-modal-card {
  width: min(92vw, 720px);
  background: #fff;
  border-radius: 14px;
  padding: 18px 18px 16px;
  position: relative;
  box-shadow: 0 12px 36px rgba(0, 0, 0, 0.32);
}

body.page-loccitane-produtos .loc-prod-modal-title {
  margin-bottom: 12px;
  color: #4e2918;
}

body.page-loccitane-produtos .loc-prod-modal-body {
  min-height: 260px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 14px;
}

body.page-loccitane-produtos #locProdImgModalContent {
  max-width: 100%;
  max-height: 55vh;
}

body.page-loccitane-produtos .loc-prod-modal-empty {
  color: #7a5b4d;
  font-weight: 600;
}

body.page-loccitane-produtos .loc-prod-modal-upload-form {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

body.page-loccitane-produtos .loc-prod-modal-upload-form input[type="file"] {
  flex: 1 1 280px;
  min-width: 220px;
}

body.page-loccitane-produtos .loc-prod-ref {
  font-weight: 700;
  color: #7c3b27;
  white-space: nowrap;
}

body.page-loccitane-produtos .loc-prod-empty {
  text-align: center;
  color: #777;
  padding: 16px 8px;
}

/* ========== Loccitane Compras ========== */
body.page-loccitane-compras .loc-compra-page {
  position: relative;
}

body.page-loccitane-compras .loc-page-map {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.9rem;
  margin-bottom: 4px;
}

body.page-loccitane-compras .loc-page-map a {
  color: #8b3f2f;
  text-decoration: none;
  font-weight: 600;
}

body.page-loccitane-compras .loc-page-map a:hover {
  text-decoration: underline;
}

body.page-loccitane-compras .loc-page-current {
  color: #6b6b6b;
  font-weight: 700;
}

body.page-loccitane-pedidos .loc-gestao-filtros,
body.page-loccitane-compras .loc-gestao-filtros,
body.page-loccitane-estoque .loc-gestao-filtros {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-wrap: nowrap;
}

body.page-loccitane-pedidos .loc-gestao-filtro-form,
body.page-loccitane-compras .loc-gestao-filtro-form,
body.page-loccitane-estoque .loc-gestao-filtro-form,
body.page-loccitane-estoque .loc-top-action-form {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

body.page-loccitane-pedidos .loc-gestao-filtro-form select,
body.page-loccitane-compras .loc-gestao-filtro-form select,
body.page-loccitane-estoque .loc-gestao-filtro-form select,
body.page-loccitane-pedidos .loc-gestao-filtro-form input[type="text"],
body.page-loccitane-compras .loc-gestao-filtro-form input[type="text"],
body.page-loccitane-estoque .loc-gestao-filtro-form input[type="text"] {
  height: 32px;
  font-size: 0.84rem;
  padding: 4px 8px;
  min-width: 180px;
}

body.page-loccitane-pedidos .loc-filtro-btn,
body.page-loccitane-compras .loc-filtro-btn,
body.page-loccitane-estoque .loc-filtro-btn,
body.page-loccitane-estoque .loc-top-action-form .btn {
  height: 32px;
  padding: 0 10px;
  font-size: 0.84rem;
  white-space: nowrap;
}

body.page-loccitane-compras .table-wrapper {
  background: transparent;
  border-color: rgba(0, 0, 0, 0.08);
}

body.page-loccitane-compras .table thead th {
  background: #ecd4c7;
  color: #4e2918;
  font-weight: 700;
}

body.page-loccitane-compras .table tbody tr:nth-child(even) td {
  background: rgba(139, 63, 47, 0.035);
}

body.page-loccitane-compras .table tbody tr:hover td {
  background: rgba(139, 63, 47, 0.075);
}

body.page-loccitane-compras .loc-compra-cadastro-overlay,
body.page-loccitane-pedidos .loc-compra-cadastro-overlay,
body.page-loccitane-plano-compra .loc-compra-cadastro-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.35);
  z-index: 998;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: 82px 14px 24px;
}

body.page-loccitane-compras .loc-compra-cadastro-card,
body.page-loccitane-pedidos .loc-compra-cadastro-card,
body.page-loccitane-plano-compra .loc-compra-cadastro-card {
  width: min(1024px, 96vw);
  background: #ffffff;
  border-radius: 12px;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.22);
  border: 1px solid #e6e6e6;
  padding: 16px;
  max-height: 85vh;
  overflow-y: auto;
}

body.page-loccitane-compras .import-card-header,
body.page-loccitane-pedidos .import-card-header,
body.page-loccitane-plano-compra .import-card-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 12px;
}

body.page-loccitane-compras .import-card-header h3,
body.page-loccitane-pedidos .import-card-header h3,
body.page-loccitane-plano-compra .import-card-header h3 {
  margin: 0;
}

body.page-loccitane-compras .close-btn,
body.page-loccitane-pedidos .close-btn,
body.page-loccitane-plano-compra .close-btn {
  text-decoration: none;
  background: none;
  border: none;
  font-size: 28px;
  cursor: pointer;
  color: #999;
  padding: 0;
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
}

body.page-loccitane-compras .close-btn:hover,
body.page-loccitane-pedidos .close-btn:hover,
body.page-loccitane-plano-compra .close-btn:hover {
  color: #333;
}

body.page-loccitane-compras .import-preview-info,
body.page-loccitane-pedidos .import-preview-info,
body.page-loccitane-plano-compra .import-preview-info {
  padding: 12px;
  background: #f9f9f9;
  border: 1px solid #e0e0e0;
  border-radius: 6px;
  font-size: 0.9em;
  line-height: 1.6;
}

body.page-loccitane-compras .import-preview-info p,
body.page-loccitane-pedidos .import-preview-info p,
body.page-loccitane-plano-compra .import-preview-info p {
  margin: 6px 0;
}

body.page-loccitane-compras .loc-compra-cadastro-card .btn-danger,
body.page-loccitane-pedidos .loc-compra-cadastro-card .btn-danger {
  background: #f0cfcf;
  border: 1px solid #e3b1b1;
  color: #874141;
}

body.page-loccitane-compras .loc-compra-cadastro-card .btn-danger:hover,
body.page-loccitane-pedidos .loc-compra-cadastro-card .btn-danger:hover {
  background: #e9c1c1;
  border-color: #d99d9d;
  color: #7a3838;
}

body.page-loccitane-compras .table {
  font-size: 0.9em;
}

body.page-loccitane-compras .loc-ped-edit-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: inherit;
  text-decoration: none;
}

body.page-loccitane-compras .loc-ped-edit-link:hover {
  color: #8b3f2f;
  text-decoration: none;
}

body.page-loccitane-compras .loc-ped-edit-icon {
  display: inline-block;
  width: 12px;
  text-align: center;
  color: #7c3b27;
  font-size: 0.7rem;
  font-weight: 700;
  line-height: 1;
}

body.page-loccitane-compras .loc-ped-expand-cell {
  background: rgba(255, 255, 255, 0.86);
}

body.page-loccitane-compras .loc-ped-expand-table-wrap {
  max-height: 50vh;
  overflow: auto;
  border: 1px solid #ebdfd8;
  border-radius: 10px;
  background: #fffdfb;
  padding: 8px;
}

body.page-loccitane-compras .loc-ped-expand-table {
  table-layout: fixed;
  width: 100%;
}

body.page-loccitane-compras .loc-ped-expand-table th:nth-child(1) { width: 74px; }
body.page-loccitane-compras .loc-ped-expand-table th:nth-child(2) { width: 170px; }
body.page-loccitane-compras .loc-ped-expand-table th:nth-child(4) { width: 72px; }
body.page-loccitane-compras .loc-ped-expand-table th:nth-child(5),
body.page-loccitane-compras .loc-ped-expand-table th:nth-child(6),
body.page-loccitane-compras .loc-ped-expand-table th:nth-child(8),
body.page-loccitane-compras .loc-ped-expand-table th:nth-child(9),
body.page-loccitane-compras .loc-ped-expand-table th:nth-child(10) { width: 102px; }
body.page-loccitane-compras .loc-ped-expand-table th:nth-child(7) { width: 78px; }
body.page-loccitane-compras .loc-ped-expand-table th:nth-child(11),
body.page-loccitane-compras .loc-ped-expand-table th:nth-child(12) { width: 88px; }

body.page-loccitane-compras .loc-ped-expand-table td {
  vertical-align: middle;
}

body.page-loccitane-compras .loc-ped-expand-table .loc-col-foto {
  text-align: center;
}

body.page-loccitane-compras .loc-ped-expand-table .loc-col-sku {
  white-space: nowrap;
  font-weight: 600;
}

body.page-loccitane-compras .loc-ped-expand-table .loc-col-desc {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

body.page-loccitane-compras .loc-ped-expand-table .loc-col-qtd,
body.page-loccitane-compras .loc-ped-expand-table .loc-col-vlr,
body.page-loccitane-compras .loc-ped-expand-table .loc-col-total {
  text-align: right;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

body.page-loccitane-compras .loc-ped-thumb {
  width: 48px;
  height: 48px;
  object-fit: cover;
  border-radius: 6px;
  border: 1px solid rgba(0, 0, 0, 0.12);
  background: #f7f7f7;
}

body.page-loccitane-compras .loc-ped-no-photo {
  width: 48px;
  height: 48px;
  border-radius: 6px;
  border: 1px solid rgba(0, 0, 0, 0.12);
  background: #f5f0ee;
  position: relative;
  flex-shrink: 0;
}

body.page-loccitane-compras .loc-ped-no-photo::before {
  content: '';
  position: absolute;
  inset: 8px;
  border-radius: 50%;
  border: 2px solid #c9b4ae;
}

body.page-loccitane-compras .loc-ped-no-photo::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 2px;
  height: 60%;
  background: #c9b4ae;
  transform: translate(-50%, -50%) rotate(45deg);
  border-radius: 1px;
}

body.page-loccitane-compras .loc-ped-obs-row {
  margin-top: 12px;
}

body.page-loccitane-compras .loc-ped-obs-text {
  width: 100%;
  border: 1px solid #d9c4b8;
  border-radius: 8px;
  padding: 8px 10px;
  background: #fff;
  color: #3d2a22;
  resize: vertical;
  min-height: 84px;
}

body.page-loccitane-compras .loc-btn-danger {
  background: #f0cfcf;
  border: 1px solid #e3b1b1;
  color: #874141;
}

body.page-loccitane-compras .loc-btn-danger:hover:not(:disabled) {
  background: #e9c1c1;
  border-color: #d99d9d;
  color: #7a3838;
}

@media (max-width: 768px) {
  body.page-loccitane-compras .loc-compra-cadastro-card,
  body.page-loccitane-pedidos .loc-compra-cadastro-card {
    width: 100%;
    border-radius: 10px;
  }
}

/* ========== Loccitane Vendas ========== */
body.page-loccitane-plano-compra .loc-plano-page {
  position: relative;
}

body.page-loccitane-plano-compra .loc-page-map {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.9rem;
  margin-bottom: 0;
  flex-shrink: 0;
}

body.page-loccitane-plano-compra .loc-page-map a {
  color: #8b3f2f;
  text-decoration: none;
  font-weight: 600;
}

body.page-loccitane-plano-compra .loc-page-map a:hover {
  text-decoration: underline;
}

body.page-loccitane-plano-compra .loc-page-current {
  color: #6b6b6b;
  font-weight: 700;
}

body.page-loccitane-plano-compra .loc-plano-filtros {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}

body.page-loccitane-plano-compra .loc-plano-filtros .loc-filtro-item {
  display: inline-flex;
  align-items: center;
}

body.page-loccitane-plano-compra .loc-plano-filtros select {
  height: 32px;
  font-size: 0.84rem;
  padding: 4px 8px;
  width: 180px;
}

body.page-loccitane-plano-compra .loc-filtro-btn {
  height: 32px;
  padding: 0 10px;
  font-size: 0.84rem;
}

body.page-loccitane-plano-compra .loc-page-topbar-param {
  margin-bottom: 10px;
}

body.page-loccitane-plano-compra .loc-plano-parametros {
  margin: 10px 0;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

body.page-loccitane-plano-compra .loc-plano-kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(190px, 1fr));
  gap: 10px;
  margin: 10px 0 14px;
}

body.page-loccitane-plano-compra .loc-plano-kpi-card {
  border: 1px solid rgba(0, 0, 0, 0.08);
  background: #fffdfb;
  border-radius: 10px;
  padding: 10px 12px;
}

body.page-loccitane-plano-compra .loc-plano-kpi-card h4 {
  margin: 0;
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #6e594f;
}

body.page-loccitane-plano-compra .loc-plano-kpi-card p {
  margin: 6px 0 0;
  font-size: 1.2rem;
  font-weight: 700;
  color: #4e2918;
}

body.page-loccitane-plano-compra .table-wrapper {
  background: transparent;
  border-color: rgba(0, 0, 0, 0.08);
}

body.page-loccitane-plano-compra .loc-plano-table-wrap {
  max-height: 62vh;
  overflow: auto;
}

body.page-loccitane-plano-compra .table thead th {
  position: sticky;
  top: 0;
  z-index: 5;
  background: #ecd4c7;
  color: #4e2918;
  font-weight: 700;
  white-space: nowrap;
}

body.page-loccitane-plano-compra .table tbody tr:nth-child(even) td {
  background: rgba(139, 63, 47, 0.035);
}

body.page-loccitane-plano-compra .table tbody tr:hover td {
  background: rgba(139, 63, 47, 0.075);
}

body.page-loccitane-plano-compra .loc-col-sku,
body.page-loccitane-plano-compra .loc-col-qtd,
body.page-loccitane-plano-compra .loc-col-vlr {
  white-space: nowrap;
}

body.page-loccitane-plano-compra .loc-col-qtd,
body.page-loccitane-plano-compra .loc-col-vlr {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

body.page-loccitane-plano-compra .loc-plano-table thead th:nth-child(n+4):nth-child(-n+12),
body.page-loccitane-plano-compra .loc-plano-table tbody td:nth-child(n+4):nth-child(-n+12) {
  text-align: center !important;
}

body.page-loccitane-plano-compra .loc-col-desc {
  max-width: 260px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.page-loccitane-plano-compra .loc-ped-thumb,
body.page-loccitane-plano-compra .loc-ped-no-photo {
  width: 42px;
  height: 42px;
}

body.page-loccitane-plano-compra .loc-col-foto {
  position: relative;
}

body.page-loccitane-plano-compra .loc-plano-thumb {
  cursor: pointer;
}

body.page-loccitane-plano-compra .table tbody tr.loc-plano-row-compra td {
  background: rgba(196, 30, 30, 0.12) !important;
  color: #8f1414;
}

body.page-loccitane-plano-compra .table tbody tr.loc-plano-row-compra:hover td {
  background: rgba(196, 30, 30, 0.18) !important;
}

body.page-loccitane-plano-compra .table tbody tr.loc-plano-row-urgente td {
  background: rgba(196, 30, 30, 0.2) !important;
  color: #6f0000;
  font-weight: 600;
}

body.page-loccitane-plano-compra .table tbody tr.loc-plano-row-urgente:hover td {
  background: rgba(196, 30, 30, 0.28) !important;
}

@media (max-width: 980px) {
  body.page-loccitane-plano-compra .loc-page-topbar {
    flex-wrap: wrap;
    align-items: flex-start;
  }

  body.page-loccitane-plano-compra .loc-plano-filtros {
    width: 100%;
    justify-content: flex-end;
  }

  body.page-loccitane-plano-compra .loc-plano-kpis {
    grid-template-columns: repeat(2, minmax(160px, 1fr));
  }
}

@media (max-width: 560px) {
  body.page-loccitane-plano-compra .loc-plano-kpis {
    grid-template-columns: 1fr;
  }
}

body.page-loccitane-vendas .loc-vendas-page,
body.page-lunalo-tickets-consulta .loc-vendas-page,
body.page-lunalo-royalties-fichas .loc-vendas-page,
body.page-fin-centro-custo-consultar .loc-vendas-page,
body.page-fin-plano-contas-consultar .loc-vendas-page,
body.page-fin-fornecedor-despesa-consultar .loc-vendas-page,
body.page-fin-tipo-documento-consultar .loc-vendas-page,
body.page-fin-despesa-consultar .loc-vendas-page,
body.page-fin-despesa-parcelas-consultar .loc-vendas-page,
body.page-fin-notas-consulta .loc-vendas-page,
body.page-fin-despesa-alterar .loc-vendas-page,
body.page-fin-relatorios .loc-vendas-page,
body.page-fin-relatorio-dashboard .loc-vendas-page {
  position: relative;
}

body.page-loccitane-vendas .loc-page-map,
body.page-lunalo-tickets-consulta .loc-page-map,
body.page-lunalo-royalties-fichas .loc-page-map,
body.page-fin-centro-custo-consultar .loc-page-map,
body.page-fin-plano-contas-consultar .loc-page-map,
body.page-fin-fornecedor-despesa-consultar .loc-page-map,
body.page-fin-tipo-documento-consultar .loc-page-map,
body.page-fin-despesa-consultar .loc-page-map,
body.page-fin-despesa-parcelas-consultar .loc-page-map,
body.page-fin-notas-consulta .loc-page-map,
body.page-fin-despesa-alterar .loc-page-map,
body.page-fin-relatorios .loc-page-map,
body.page-fin-relatorio-dashboard .loc-page-map {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.9rem;
  margin-bottom: 0;
  flex-shrink: 0;
}

body.page-loccitane-vendas .loc-page-map a,
body.page-lunalo-tickets-consulta .loc-page-map a,
body.page-lunalo-royalties-fichas .loc-page-map a,
body.page-fin-centro-custo-consultar .loc-page-map a,
body.page-fin-plano-contas-consultar .loc-page-map a,
body.page-fin-fornecedor-despesa-consultar .loc-page-map a,
body.page-fin-tipo-documento-consultar .loc-page-map a,
body.page-fin-despesa-consultar .loc-page-map a,
body.page-fin-despesa-parcelas-consultar .loc-page-map a,
body.page-fin-notas-consulta .loc-page-map a,
body.page-fin-despesa-alterar .loc-page-map a,
body.page-fin-relatorios .loc-page-map a,
body.page-fin-relatorio-dashboard .loc-page-map a {
  color: #8b3f2f;
  text-decoration: none;
  font-weight: 600;
}

body.page-loccitane-vendas .loc-page-map a:hover,
body.page-lunalo-tickets-consulta .loc-page-map a:hover,
body.page-lunalo-royalties-fichas .loc-page-map a:hover,
body.page-fin-centro-custo-consultar .loc-page-map a:hover,
body.page-fin-plano-contas-consultar .loc-page-map a:hover,
body.page-fin-fornecedor-despesa-consultar .loc-page-map a:hover,
body.page-fin-tipo-documento-consultar .loc-page-map a:hover,
body.page-fin-despesa-consultar .loc-page-map a:hover,
body.page-fin-despesa-parcelas-consultar .loc-page-map a:hover,
body.page-fin-notas-consulta .loc-page-map a:hover,
body.page-fin-despesa-alterar .loc-page-map a:hover,
body.page-fin-relatorios .loc-page-map a:hover,
body.page-fin-relatorio-dashboard .loc-page-map a:hover {
  text-decoration: underline;
}

body.page-loccitane-vendas .loc-page-current,
body.page-lunalo-tickets-consulta .loc-page-current,
body.page-lunalo-royalties-fichas .loc-page-current,
body.page-fin-centro-custo-consultar .loc-page-current,
body.page-fin-plano-contas-consultar .loc-page-current,
body.page-fin-fornecedor-despesa-consultar .loc-page-current,
body.page-fin-tipo-documento-consultar .loc-page-current,
body.page-fin-despesa-consultar .loc-page-current,
body.page-fin-despesa-parcelas-consultar .loc-page-current,
body.page-fin-notas-consulta .loc-page-current,
body.page-fin-despesa-alterar .loc-page-current,
body.page-fin-relatorios .loc-page-current,
body.page-fin-relatorio-dashboard .loc-page-current {
  color: #6b6b6b;
  font-weight: 700;
}

body.page-loccitane-vendas .loc-page-topbar,
body.page-lunalo-tickets-consulta .loc-page-topbar,
body.page-lunalo-royalties-fichas .loc-page-topbar,
body.page-fin-centro-custo-consultar .loc-page-topbar,
body.page-fin-plano-contas-consultar .loc-page-topbar,
body.page-fin-fornecedor-despesa-consultar .loc-page-topbar,
body.page-fin-tipo-documento-consultar .loc-page-topbar,
body.page-fin-despesa-consultar .loc-page-topbar,
body.page-fin-despesa-parcelas-consultar .loc-page-topbar,
body.page-fin-notas-consulta .loc-page-topbar,
body.page-fin-despesa-alterar .loc-page-topbar,
body.page-fin-relatorios .loc-page-topbar,
body.page-fin-relatorio-dashboard .loc-page-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: nowrap;
}

body.page-loccitane-vendas .loc-vendas-filtros,
body.page-lunalo-tickets-consulta .loc-vendas-filtros,
body.page-lunalo-royalties-fichas .loc-vendas-filtros,
body.page-fin-fornecedor-despesa-consultar .loc-vendas-filtros,
body.page-fin-despesa-consultar .loc-vendas-filtros,
body.page-fin-despesa-parcelas-consultar .loc-vendas-filtros {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: nowrap;
}

body.page-loccitane-vendas .loc-vendas-filtros .loc-filtro-item,
body.page-lunalo-tickets-consulta .loc-vendas-filtros .loc-filtro-item,
body.page-lunalo-royalties-fichas .loc-vendas-filtros .loc-filtro-item,
body.page-fin-fornecedor-despesa-consultar .loc-vendas-filtros .loc-filtro-item,
body.page-fin-despesa-consultar .loc-vendas-filtros .loc-filtro-item,
body.page-fin-despesa-parcelas-consultar .loc-vendas-filtros .loc-filtro-item {
  display: inline-flex;
  align-items: center;
}

body.page-loccitane-vendas .loc-vendas-filtros input,
body.page-loccitane-vendas .loc-vendas-filtros select,
body.page-lunalo-tickets-consulta .loc-vendas-filtros input,
body.page-lunalo-tickets-consulta .loc-vendas-filtros select,
body.page-lunalo-royalties-fichas .loc-vendas-filtros input,
body.page-lunalo-royalties-fichas .loc-vendas-filtros select,
body.page-fin-fornecedor-despesa-consultar .loc-vendas-filtros input,
body.page-fin-fornecedor-despesa-consultar .loc-vendas-filtros select,
body.page-fin-despesa-consultar .loc-vendas-filtros input,
body.page-fin-despesa-consultar .loc-vendas-filtros select,
body.page-fin-despesa-parcelas-consultar .loc-vendas-filtros input,
body.page-fin-despesa-parcelas-consultar .loc-vendas-filtros select {
  height: 32px;
  font-size: 0.84rem;
  padding: 4px 8px;
}

body.page-loccitane-vendas .loc-filtro-item-date input,
body.page-lunalo-tickets-consulta .loc-filtro-item-date input,
body.page-lunalo-royalties-fichas .loc-filtro-item-date input,
body.page-fin-despesa-parcelas-consultar .loc-filtro-item-date input {
  width: 136px;
}

body.page-loccitane-vendas .loc-filtro-item-store select,
body.page-lunalo-tickets-consulta .loc-filtro-item-store select,
body.page-lunalo-royalties-fichas .loc-filtro-item-store select {
  width: 150px;
}

body.page-loccitane-vendas .loc-filtro-item-seller input,
body.page-lunalo-tickets-consulta .loc-filtro-item-seller input,
body.page-lunalo-royalties-fichas .loc-filtro-item-seller input {
  width: 140px;
}

body.page-loccitane-vendas .loc-filtro-btn,
body.page-lunalo-tickets-consulta .loc-filtro-btn,
body.page-lunalo-royalties-fichas .loc-filtro-btn,
body.page-fin-fornecedor-despesa-consultar .loc-filtro-btn,
body.page-fin-despesa-consultar .loc-filtro-btn,
body.page-fin-despesa-parcelas-consultar .loc-filtro-btn {
  height: 32px;
  padding: 0 10px;
  font-size: 0.84rem;
}

body.page-loccitane-vendas .table-wrapper,
body.page-lunalo-tickets-consulta .table-wrapper,
body.page-lunalo-royalties-fichas .table-wrapper,
body.page-fin-centro-custo-consultar .table-wrapper,
body.page-fin-plano-contas-consultar .table-wrapper,
body.page-fin-fornecedor-despesa-consultar .table-wrapper,
body.page-fin-tipo-documento-consultar .table-wrapper,
body.page-fin-despesa-consultar .table-wrapper,
body.page-fin-despesa-parcelas-consultar .table-wrapper,
body.page-fin-notas-consulta .table-wrapper,
body.page-fin-relatorios .table-wrapper,
body.page-fin-relatorio-dashboard .table-wrapper {
  background: transparent;
  border-color: rgba(0, 0, 0, 0.08);
}

body.page-loccitane-vendas .loc-vendas-table-wrap,
body.page-lunalo-tickets-consulta .loc-vendas-table-wrap,
body.page-lunalo-royalties-fichas .loc-vendas-table-wrap,
body.page-fin-centro-custo-consultar .loc-vendas-table-wrap,
body.page-fin-plano-contas-consultar .loc-vendas-table-wrap,
body.page-fin-fornecedor-despesa-consultar .loc-vendas-table-wrap,
body.page-fin-tipo-documento-consultar .loc-vendas-table-wrap,
body.page-fin-despesa-consultar .loc-vendas-table-wrap,
body.page-fin-notas-consulta .loc-vendas-table-wrap,
body.page-fin-relatorios .loc-vendas-table-wrap {
  max-height: calc(100vh - 300px);
  overflow: auto;
  margin-bottom: 8px;
}

body.page-loccitane-vendas .table thead th,
body.page-lunalo-tickets-consulta .table thead th,
body.page-lunalo-royalties-fichas .table thead th,
body.page-fin-centro-custo-consultar .table thead th,
body.page-fin-plano-contas-consultar .table thead th,
body.page-fin-fornecedor-despesa-consultar .table thead th,
body.page-fin-tipo-documento-consultar .table thead th,
body.page-fin-despesa-consultar .table thead th,
body.page-fin-despesa-parcelas-consultar .table thead th,
body.page-fin-notas-consulta .table thead th,
body.page-fin-relatorios .table thead th,
body.page-fin-relatorio-dashboard .table thead th {
  background: #ecd4c7;
  color: #4e2918;
  font-weight: 700;
}

body.page-loccitane-vendas .table tbody tr:nth-child(even) td,
body.page-lunalo-tickets-consulta .table tbody tr:nth-child(even) td,
body.page-lunalo-royalties-fichas .table tbody tr:nth-child(even) td,
body.page-fin-centro-custo-consultar .table tbody tr:nth-child(even) td,
body.page-fin-plano-contas-consultar .table tbody tr:nth-child(even) td,
body.page-fin-fornecedor-despesa-consultar .table tbody tr:nth-child(even) td,
body.page-fin-tipo-documento-consultar .table tbody tr:nth-child(even) td,
body.page-fin-despesa-consultar .table tbody tr:nth-child(even) td,
body.page-fin-despesa-parcelas-consultar .table tbody tr:nth-child(even) td,
body.page-fin-notas-consulta .table tbody tr:nth-child(even) td,
body.page-fin-relatorios .table tbody tr:nth-child(even) td,
body.page-fin-relatorio-dashboard .table tbody tr:nth-child(even) td {
  background: rgba(139, 63, 47, 0.035);
}

body.page-loccitane-vendas .table tbody tr:hover td,
body.page-lunalo-tickets-consulta .table tbody tr:hover td,
body.page-lunalo-royalties-fichas .table tbody tr:hover td,
body.page-fin-centro-custo-consultar .table tbody tr:hover td,
body.page-fin-plano-contas-consultar .table tbody tr:hover td,
body.page-fin-fornecedor-despesa-consultar .table tbody tr:hover td,
body.page-fin-tipo-documento-consultar .table tbody tr:hover td,
body.page-fin-despesa-consultar .table tbody tr:hover td,
body.page-fin-despesa-parcelas-consultar .table tbody tr:hover td,
body.page-fin-notas-consulta .table tbody tr:hover td {
  background: rgba(139, 63, 47, 0.075);
}

body.page-fin-despesa-consultar .loc-vendas-table {
  table-layout: fixed;
  width: 100%;
}

body.page-fin-despesa-consultar .loc-vendas-table th:nth-child(4),
body.page-fin-despesa-consultar .loc-vendas-table td:nth-child(4) {
  width: 170px;
  max-width: 170px;
}

body.page-fin-despesa-consultar .despesa-fornecedor-cell {
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
  line-height: 1.2;
}

body.page-fin-despesa-consultar .col-acoes {
  width: 96px;
}

body.page-fin-despesa-consultar .col-acoes .btn-icon-danger {
  min-width: 30px;
  min-height: 30px;
}

body.page-loccitane-vendas .table {
  font-size: 0.9em;
}

body.page-loccitane-vendas .loc-ped-edit-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: inherit;
  text-decoration: none;
}

body.page-loccitane-vendas .loc-ped-edit-link:hover {
  color: #8b3f2f;
  text-decoration: none;
}

body.page-loccitane-vendas .loc-ped-edit-icon {
  display: inline-block;
  width: 12px;
  text-align: center;
  color: #7c3b27;
  font-size: 0.7rem;
  font-weight: 700;
  line-height: 1;
}

body.page-loccitane-vendas .loc-ped-expand-cell {
  background: rgba(255, 255, 255, 0.86);
}

body.page-loccitane-vendas .loc-ped-expand-table-wrap {
  max-height: 50vh;
  overflow: auto;
  border: 1px solid #ebdfd8;
  border-radius: 10px;
  background: #fffdfb;
  padding: 8px;
}

body.page-loccitane-vendas .loc-ped-expand-table {
  table-layout: fixed;
  width: 100%;
  min-width: 1320px;
}

body.page-loccitane-vendas .loc-ped-expand-table th:nth-child(1) { width: 74px; }
body.page-loccitane-vendas .loc-ped-expand-table th:nth-child(2) { width: 140px; }
body.page-loccitane-vendas .loc-ped-expand-table th:nth-child(3) { width: 320px; }
body.page-loccitane-vendas .loc-ped-expand-table th:nth-child(4) { width: 68px; }
body.page-loccitane-vendas .loc-ped-expand-table th:nth-child(5),
body.page-loccitane-vendas .loc-ped-expand-table th:nth-child(6),
body.page-loccitane-vendas .loc-ped-expand-table th:nth-child(7),
body.page-loccitane-vendas .loc-ped-expand-table th:nth-child(8),
body.page-loccitane-vendas .loc-ped-expand-table th:nth-child(9),
body.page-loccitane-vendas .loc-ped-expand-table th:nth-child(10),
body.page-loccitane-vendas .loc-ped-expand-table th:nth-child(11) { width: 102px; }
body.page-loccitane-vendas .loc-ped-expand-table th:nth-child(12) { width: 64px; }

body.page-loccitane-vendas .loc-ped-expand-table td {
  vertical-align: middle;
}

body.page-fin-relatorios .loc-ped-expand-table {
  min-width: 1080px;
}

body.page-fin-relatorios .loc-ped-expand-table td,
body.page-fin-relatorios .loc-ped-expand-table th {
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
  vertical-align: top;
}

body.page-fin-relatorios .loc-ped-expand-table .money {
  text-align: right;
  white-space: nowrap;
}

body.page-fin-relatorio-dashboard .fin-dashboard-bottom-grid {
  display: grid;
  grid-template-columns: minmax(280px, 1fr) minmax(360px, 1fr) minmax(360px, 1fr);
  gap: 16px;
  align-items: start;
}

body.page-fin-relatorio-dashboard .fin-dashboard-card {
  margin: 0;
}

body.page-fin-relatorio-dashboard .fin-dashboard-card .table-wrapper {
  overflow-x: auto;
}

body.page-fin-relatorio-dashboard .fin-dashboard-table {
  width: 100%;
  table-layout: fixed;
}

body.page-fin-relatorio-dashboard .fin-dashboard-table th,
body.page-fin-relatorio-dashboard .fin-dashboard-table td {
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
  vertical-align: top;
}

body.page-fin-relatorio-dashboard .fin-dashboard-table .money {
  text-align: right;
  white-space: nowrap;
}

body.page-fin-relatorio-dashboard .fin-dashboard-table-compact .money {
  text-align: left;
}

@media (max-width: 1280px) {
  body.page-fin-relatorio-dashboard .fin-dashboard-bottom-grid {
    grid-template-columns: 1fr;
  }
}

body.page-loccitane-vendas .loc-ped-expand-table .loc-col-foto {
  text-align: center;
}

body.page-loccitane-vendas .loc-ped-expand-table .loc-col-sku {
  white-space: nowrap;
  font-weight: 600;
}

body.page-loccitane-vendas .loc-ped-expand-table .loc-col-desc {
  white-space: normal;
  overflow: visible;
  text-overflow: clip;
  line-height: 1.25;
}

body.page-loccitane-vendas .loc-ped-expand-table .loc-col-qtd,
body.page-loccitane-vendas .loc-ped-expand-table .loc-col-vlr,
body.page-loccitane-vendas .loc-ped-expand-table .loc-col-total {
  text-align: right;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

body.page-loccitane-vendas .loc-ped-thumb {
  width: 48px;
  height: 48px;
  object-fit: cover;
  border-radius: 6px;
  border: 1px solid rgba(0, 0, 0, 0.12);
  background: #f7f7f7;
}

body.page-loccitane-vendas .loc-ped-no-photo {
  width: 48px;
  height: 48px;
  border-radius: 6px;
  border: 1px solid rgba(0, 0, 0, 0.12);
  background: #f5f0ee;
  position: relative;
  flex-shrink: 0;
}

body.page-loccitane-vendas .loc-ped-no-photo::before {
  content: '';
  position: absolute;
  inset: 8px;
  border-radius: 50%;
  border: 2px solid #c9b4ae;
}

body.page-loccitane-vendas .loc-ped-no-photo::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 2px;
  height: 60%;
  background: #c9b4ae;
  transform: translate(-50%, -50%) rotate(45deg);
  border-radius: 1px;
}

@media (max-width: 980px) {
  body.page-loccitane-vendas .loc-page-topbar {
    flex-wrap: wrap;
    align-items: flex-start;
  }

  body.page-loccitane-vendas .loc-vendas-filtros {
    width: 100%;
    justify-content: flex-end;
    flex-wrap: wrap;
  }

}

/* ========== Loccitane Royalties ========== */
body.page-loccitane-royalties .loc-page-topbar {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
  margin-bottom: 12px;
}

body.page-loccitane-royalties .loc-page-map {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.9rem;
  margin-bottom: 4px;
}

body.page-loccitane-royalties .loc-page-map a {
  color: #8b3f2f;
  text-decoration: none;
  font-weight: 600;
}

body.page-loccitane-royalties .loc-page-map a:hover {
  text-decoration: underline;
}

body.page-loccitane-royalties .loc-page-current {
  color: #6b6b6b;
  font-weight: 700;
}

body.page-loccitane-royalties .loc-gestao-filtros {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

body.page-loccitane-royalties .loc-gestao-filtro-form {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

body.page-loccitane-royalties .loc-gestao-filtro-form select {
  height: 32px;
  font-size: 0.84rem;
  padding: 4px 8px;
  min-width: 190px;
}

body.page-loccitane-royalties .loc-filtro-btn {
  height: 32px;
  padding: 0 10px;
  font-size: 0.84rem;
}

body.page-loccitane-royalties .table-wrapper {
  background: transparent;
  border-color: rgba(0, 0, 0, 0.08);
}

body.page-loccitane-royalties .loc-roy-table thead th {
  background: #ecd4c7;
  color: #4e2918;
  font-weight: 700;
}

body.page-loccitane-royalties .loc-roy-table thead th:nth-child(4),
body.page-loccitane-royalties .loc-roy-table thead th:nth-child(5),
body.page-loccitane-royalties .loc-roy-table thead th:nth-child(6),
body.page-loccitane-royalties .loc-roy-table thead th:nth-child(7),
body.page-loccitane-royalties .loc-roy-table thead th:nth-child(8),
body.page-loccitane-royalties .loc-roy-table tbody td:nth-child(4),
body.page-loccitane-royalties .loc-roy-table tbody td:nth-child(5),
body.page-loccitane-royalties .loc-roy-table tbody td:nth-child(6),
body.page-loccitane-royalties .loc-roy-table tbody td:nth-child(7),
body.page-loccitane-royalties .loc-roy-table tbody td:nth-child(8) {
  text-align: center;
}

body.page-loccitane-royalties .loc-roy-table tbody tr:nth-child(even) td {
  background: rgba(139, 63, 47, 0.035);
}

body.page-loccitane-royalties .loc-roy-table tbody tr:hover td {
  background: rgba(139, 63, 47, 0.075);
}

body.page-loccitane-royalties .loc-roy-col-num {
  text-align: center;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

body.page-loccitane-royalties .loc-ped-edit-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: inherit;
  text-decoration: none;
}

body.page-loccitane-royalties .loc-ped-edit-link:hover {
  color: #8b3f2f;
  text-decoration: none;
}

body.page-loccitane-royalties .loc-ped-edit-icon {
  display: inline-block;
  width: 12px;
  text-align: center;
  color: #7c3b27;
  font-size: 0.7rem;
  font-weight: 700;
}

body.page-loccitane-royalties .loc-roy-col-compras {
  max-width: 260px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

body.page-loccitane-royalties .loc-roy-col-num.is-positive {
  color: #c0392b;
  font-weight: 700;
}

body.page-loccitane-royalties .loc-roy-col-num.is-negative {
  color: #0e5ea8;
  font-weight: 700;
}

body.page-loccitane-royalties .loc-status-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 92px;
  padding: 3px 8px;
  border-radius: 999px;
  border: 1px solid transparent;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.2px;
  text-transform: uppercase;
  white-space: nowrap;
}

body.page-loccitane-royalties .loc-status-badge.is-neutral {
  background: #eef1f4;
  color: #4d5866;
  border-color: #d8dee5;
}

body.page-loccitane-royalties .loc-status-badge.is-success {
  background: #e7f7ec;
  color: #23633a;
  border-color: #b7e7c6;
}

body.page-loccitane-royalties .loc-status-badge.is-accepted {
  background: #ecf9f0;
  color: #2c6d47;
  border-color: #c9edd5;
}

body.page-loccitane-royalties .loc-status-badge.is-positive-div {
  background: #e8f1fb;
  color: #0e5ea8;
  border-color: #bdd5ef;
}

body.page-loccitane-royalties .loc-status-badge.is-danger {
  background: #fdebec;
  color: #8a2630;
  border-color: #f5c2c7;
}

body.page-loccitane-royalties .loc-ped-expand-cell {
  background: linear-gradient(180deg, #fff, #fff8f4);
  border-top: 1px solid #efd7ca;
}

body.page-loccitane-royalties .loc-roy-expand-wrap {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
}

body.page-loccitane-royalties .loc-roy-block {
  border: 1px solid #ebdfd8;
  border-radius: 10px;
  padding: 12px;
  background: #fffdfb;
}

body.page-loccitane-royalties .loc-roy-block h4 {
  margin: 0 0 10px;
  font-size: 1rem;
  color: #6e3321;
}

body.page-loccitane-royalties .loc-roy-grid-4 {
  display: grid;
  grid-template-columns: repeat(4, minmax(140px, 1fr));
  gap: 8px;
  font-size: 0.9rem;
}

body.page-loccitane-royalties .loc-roy-nested-wrap {
  max-height: 40vh;
  overflow: auto;
}

body.page-loccitane-royalties .loc-roy-nested-table thead th,
body.page-loccitane-royalties .loc-roy-valid-table thead th,
body.page-loccitane-royalties .loc-roy-anexo-table thead th {
  background: #f3e1d7;
  color: #4e2918;
  font-weight: 700;
}

body.page-loccitane-royalties .loc-roy-anexo-actions {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}

body.page-loccitane-royalties .loc-roy-form-panel {
  margin: 18px 0 24px;
  border: 1px solid #efd7ca;
  border-radius: 14px;
  padding: 16px;
  background: linear-gradient(180deg, #fff, #fff8f4);
  box-shadow: 0 14px 36px rgba(122, 60, 30, 0.08);
}

body.page-loccitane-royalties .loc-compra-cadastro-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.35);
  z-index: 998;
  display: none;
  align-items: flex-start;
  justify-content: center;
  padding: 82px 14px 24px;
}

body.page-loccitane-royalties .loc-compra-cadastro-overlay.is-visible {
  display: flex;
}

body.page-loccitane-royalties .loc-roy-modal-card {
  width: min(1120px, 96vw);
  max-height: 86vh;
  overflow-y: auto;
}

body.page-loccitane-royalties .loc-roy-modal-block {
  border: 1px solid #ebdfd8;
  border-radius: 10px;
  padding: 12px;
  margin-bottom: 12px;
  background: #fffdfb;
}

body.page-loccitane-royalties .loc-roy-modal-block h4 {
  margin: 0 0 10px;
  color: #6e3321;
}

body.page-loccitane-royalties .loc-roy-total-cobrado-wrap {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}

body.page-loccitane-royalties .loc-roy-total-cobrado {
  height: 34px;
  border: 1px solid #d9c4b8;
  border-radius: 8px;
  padding: 7px 10px;
  background: #fff;
  font-weight: 700;
  color: #3d2a22;
}

body.page-loccitane-royalties .loc-roy-compra-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 8px;
  align-items: end;
  margin-bottom: 8px;
}

body.page-loccitane-royalties .loc-roy-anexo-row {
  display: grid;
  grid-template-columns: minmax(180px, 1.3fr) minmax(170px, 0.9fr) minmax(260px, 1.6fr) 42px;
  gap: 8px;
  align-items: end;
  margin-bottom: 8px;
}

body.page-loccitane-royalties .loc-roy-anexo-row .field {
  min-width: 0;
}

body.page-loccitane-royalties .loc-roy-anexo-row .loc-roy-anexo-remove {
  height: 34px;
  padding: 0;
}

body.page-loccitane-royalties .loc-roy-compra-left {
  display: grid;
  gap: 6px;
}

body.page-loccitane-royalties .loc-roy-compra-select {
  width: 100%;
}

body.page-loccitane-royalties .loc-roy-compra-det {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 10px;
  font-size: 0.85rem;
  color: #5b4439;
}

body.page-loccitane-royalties .loc-roy-inline-action {
  margin-top: 4px;
}

body.page-loccitane-royalties .loc-roy-resumo-previsto {
  margin-top: 10px;
  display: grid;
  grid-template-columns: repeat(3, minmax(160px, 1fr));
  gap: 10px;
  font-size: 0.9rem;
  background: #fff4ee;
  border: 1px solid #e7c8b8;
  border-radius: 8px;
  padding: 10px;
}

body.page-loccitane-royalties .loc-roy-resultado-box {
  margin-top: 10px;
  font-size: 0.92rem;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

body.page-loccitane-royalties .btn-mini {
  padding: 2px 8px;
  font-size: 0.78rem;
  cursor: pointer;
}

body.page-loccitane-royalties .modal-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.65);
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 9999;
  padding: 18px;
}

body.page-loccitane-royalties .modal-backdrop.active {
  display: flex;
}

body.page-loccitane-royalties .modal-card {
  width: min(1100px, 96vw);
  height: min(720px, 90vh);
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.35);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

body.page-loccitane-royalties .modal-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 14px;
  border-bottom: 1px solid #eee;
  gap: 10px;
  flex-wrap: wrap;
}

body.page-loccitane-royalties .modal-title {
  font-weight: 900;
  color: #6b3b22;
  display: flex;
  gap: 10px;
  align-items: center;
  min-width: 280px;
}

body.page-loccitane-royalties .modal-title small {
  font-weight: 800;
  color: #777;
}

body.page-loccitane-royalties .modal-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
}

body.page-loccitane-royalties .modal-body {
  flex: 1;
  background: #fafafa;
  position: relative;
}

body.page-loccitane-royalties .modal-iframe {
  width: 100%;
  height: 100%;
  border: 0;
  background: #fff;
}

body.page-loccitane-royalties .modal-fallback {
  padding: 16px;
  color: #555;
  font-size: 0.95rem;
  display: none;
}

body.page-loccitane-royalties .modal-close {
  border: 1px solid #ddd;
  background: #f5f5f5;
  border-radius: 8px;
  padding: 6px 10px;
  cursor: pointer;
  font-weight: 900;
}

@media (max-width: 900px) {
  body.page-loccitane-royalties .loc-roy-grid-4,
  body.page-loccitane-royalties .loc-roy-resumo-previsto {
    grid-template-columns: 1fr;
  }

  body.page-loccitane-royalties .loc-roy-col-compras {
    max-width: 180px;
  }

  body.page-loccitane-royalties .loc-roy-modal-card {
    width: 100%;
    border-radius: 10px;
  }
}