html, body {
    background: #f3f4f6 !important;
    height: 100% !important;
    margin: 0 !important;
    overflow-y: scroll !important;
}

#wpadminbar {
  display: none !important;
}

html {
  margin-top: 0 !important;
}

body {
  margin: 0 !important;
  padding: 0 !important;
}

body.page .site,
body.page .site-content,
body.page .content-area,
body.page .site-main {
  background: transparent !important;
}

body .attorna-mobile-header-wrap,
body .attorna-top-bar,
body .attorna-header-wrap,
body .attorna-page-title-wrap,
body footer,
body .attorna-footer-wrapper,
body .attorna-copyright-wrapper,
body .widget,
body .widget-area {
  display: none !important;
}

/* Quando o menu ou overlay estiver aberto, nada embaixo deve receber clique */
body.menu-open {
    overflow: hidden;
}

#be-doc-app, #be-doc-app * {
  box-sizing: border-box;
  font-family: Arial, sans-serif;
}

#be-doc-app {
    min-height: 100vh !important;
    overflow: visible !important; 
    padding-top: 110px !important; 
    padding-bottom: 90px !important;
    display: block !important;
    -webkit-overflow-scrolling: touch;
}

/* Garante que o container interno não limite a largura */
.be-shell {
    max-width: 100% !important;
    width: 100% !important;
    padding: 0 16px !important;
}

.be-topbar {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 90px !important; /* Aumentado para melhor visualização em telas maiores */
    background: #ffffff !important;
    border-bottom: 1px solid #e5e7eb !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 0 24px !important; /* Mais respiro nas laterais */
    margin: 0 !important;
    z-index: 110000 !important;
    box-shadow: 0 2px 10px rgba(0,0,0,0.05) !important; /* Sombra leve para dar profundidade */
}

.be-title-wrap {
  background: transparent;
  border: 0;
  border-radius: 0;
  padding: 6px 0;
  text-align: center;
}

.be-title {
  margin: 0;
  font-size: clamp(13px, 1.25vw, 18px);
  font-weight: 700;
  letter-spacing: -.01em;
  color: #ffffff;
  line-height: 1.05;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.be-icon-btn {
    width: 48px !important;
    height: 48px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 12px !important;
  background: #b1976b;
  color: #fff;
  transition: transform .18s ease, opacity .18s ease, background .18s ease;
}

.be-icon-btn.small {
  width: 46px;
  height: 46px;
  border-radius: 16px;
}

.be-icon-btn:hover,
.be-icon-btn:focus-visible,
.be-bottom-btn:hover,
.be-bottom-btn:focus-visible,
.be-menu-btn:hover,
.be-menu-btn:focus-visible,
.be-small-btn:hover,
.be-small-btn:focus-visible {
  transform: translateY(-1px);
  opacity: .96;
  cursor: pointer;
  transition: all 0.3s ease; /* Suaviza a troca de cor */
  
}

.be-icon-btn svg,
.be-bottom-btn svg,
.be-small-btn svg {
  width: 26px;
  height: 26px;
  stroke: currentColor;
  fill: none;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.be-overlay,
.be-modal {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.5);
  z-index: 110000;
  opacity: 0;
  pointer-events: none;
  transition: opacity .22s ease;
}

.be-overlay.open,
.be-modal.open {
  opacity: 1;
  pointer-events: auto !important;
  display:block !important;
}

.be-side-menu {
  position: fixed;
  top: 0;
  width: min(88vw, 360px);
  height: 100%;
  background: #f6f2e8;
  color: #191919;
  z-index: 110001;
  padding: calc(20px + env(safe-area-inset-top, 0)) 18px 20px;
  overflow-y: auto;
  box-shadow: 0 16px 50px rgba(0,0,0,.35);
  transition: transform .26s ease;
}

.be-side-left {
  left: 0;
  transform: translateX(-104%);
  border-right: 1px solid rgba(177,151,107,.22);
}

.be-side-right {
  right: 0;
  transform: translateX(104%);
  border-left: 1px solid rgba(177,151,107,.22);
}

.be-side-menu.open {
  transform: translateX(0);
}

.be-modal {
    position: fixed !important;
    inset: 0 !important;
    background: rgba(0, 0, 0, 0.5) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    z-index: 120000 !important;
}

.be-modal-card {
    background: white !important;
    width: 90% !important;
    max-width: 500px !important;
    border-radius: 20px !important;
    padding: 24px !important;
    position: relative !important;
}

/* Modal de escolha de base */
.be-modal, #be-template-modal {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    left: 0 !important;
    width: 100% !important;
    z-index: 110002 !important;
}
.be-modal-card {
    margin: auto !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 100001 !important;
}

.be-template-grid {
  display: grid;
  gap: 10px;
}

.be-menu-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 18px;
}

.be-menu-head h2 {
  margin: 0;
  font-size: 28px;
  line-height: 1.1;
}

.be-menu-btn,
.be-small-btn {
  border: 0;
  border-radius: 16px;
  padding: 14px 16px;
  font-size: 16px;
  line-height: 1.2;
  cursor: pointer;
}

.be-menu-btn {
  width: 100%;
  margin-bottom: 10px;
}

.be-menu-btn.primary,
.be-small-btn {
  background: #b1976b;
  color: #fff;
}

.be-menu-btn.secondary,
.be-small-btn.secondary {
  background: #5f5a52;
  color: #fff;
}

.be-menu-btn.preview {
  background: #ebe6dc;
  color: #2b2b2b;
}

.be-divider {
  border-top: 1px solid #ddd3c3;
  margin: 16px 0;
}

.be-search-box {
  margin: 10px 0 14px;
}

.be-search-box input,
.be-field input,
.be-field select,
.be-field textarea {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  border: 1px solid #d4c8b5;
  border-radius: 18px;
  background: #fff;
  color: #202020;
  font-size: 17px;
  padding: 16px 18px;
  outline: none;
}

.be-search-box input:focus,
.be-field input:focus,
.be-field select:focus,
.be-field textarea:focus {
  border-color: #b1976b;
  box-shadow: 0 0 0 3px rgba(177,151,107,.15);
}

.be-main {
  position: relative;
  z-index: 1;
}

.be-card {
  background: #171717;
  border: 1px solid rgba(177,151,107,.18);
  border-radius: 28px;
  padding: 20px;
  box-shadow: 0 16px 36px rgba(0,0,0,.18);
}

.be-preview-card {
  background: #efefef;
  color: #1a1a1a;
}

.be-screen {
    height: 100% !important;
    min-height: 100vh !important;
    overflow: visible !important; 
  display: none;
}

.be-screen.active {
    min-height: 100vh !important;
    overflow: visible !important; 
  display: block;
}

.home-card {
    padding-top: 0px !important; 
    padding-bottom: 90px !important;
    margin-bottom: 90px !important;
  overflow: visible !important;
  min-height: 100vh !important;
  display: grid;
  place-items: center;
  text-align: center;
  background: #f7f7f8;
}

.be-home-logo {
  display: block;
  width: min(320px, 62vw);
  max-width: 100%;
  max-height: min(180px, 24vh);
  object-fit: contain;
  height: auto;
  margin: 0 auto;
}

.be-version,
.be-muted {
  color: #6b7280;
}

.be-section-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  margin-bottom: 16px;
}

.be-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 14px;
}

.be-field {
  display: grid;
  gap: 7px;
}

.be-field label {
  font-size: 14px;
  font-weight: 700;
  color: #f1e8d8;
}

.be-preview-card .be-field label {
  color: #333;
}

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

.be-section-title {
  margin-top: 10px;
  padding-top: 12px;
  border-top: 1px solid rgba(177,151,107,.18);
  color: #d3c0a0;
  font-size: 15px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .06em;
}

.be-inline-actions {
  display: flex;
  justify-content: flex-start;
}

.be-stack,
.be-list,
.be-search-results {
  display: grid;
  gap: 12px;
}

.be-subcard,
.be-doc-item {
  background: #f6f2e8;
  color: #191919;
  border: 1px solid #ddd3c3;
  border-radius: 20px;
  padding: 14px;
}

.be-subcard h3,
.be-doc-item h4 {
  margin: 0 0 10px;
  color: #111;
}

.be-doc-item p {
  margin: 0;
  color: #444;
  line-height: 1.45;
}

.be-doc-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 12px;
}

.be-doc-actions button {
  border: 0;
  border-radius: 14px;
  padding: 10px 12px;
  cursor: pointer;
  background: #b1976b;
  color: #fff;
}

.be-doc-actions .delete {
  background: #500000;
}

.be-bottom-nav {
    position: fixed !important;
    bottom: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 80px !important; /* Altura fixa para estabilizar */
    background: #ffffff !important; /* Cor sólida para não ficar transparente */
    border-top: 1px solid #e5e7eb !important;
    display: flex !important;
flex-direction: row !important;
flex-wrap: nowrap !important;
    align-items: center !important;
    justify-items: center !important;
    padding: 0 !important;
    margin: 0 !important;
    border-radius: 0 !important;
  
    z-index: 110000 !important;
}


.be-bottom-btn {
    width: 100% !important;
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 3px !important;
    background: transparent !important;
    border: none !important;
    pointer-events: auto !important;
    z-index: 200000;
}

.be-bottom-btn span {
  font-size: 11px;
  font-weight: 600 !important;
  line-height: 1;
  white-space: nowrap;
}

.be-icon-btn svg,
.be-bottom-btn svg,
.be-small-btn svg {
  width: 24px;
  height: 24px;
  stroke: currentColor;
  fill: none;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.be-message {
  margin-bottom: 16px;
  border-radius: 18px;
  padding: 14px 16px;
  font-weight: 700;
}

.be-message.success {
  background: #fefefe;
  border: 1px solid rgba(94, 162, 111, .32);
  color: #000000;
}

.be-message.error {
  background: #fefefe;
  border: 1px solid rgba(168, 81, 81, .32);
  color: #ff0000;
}

.be-preview-head {
    min-height: 90px !important;
    display: flex !important;
    align-items: center !important;
    border-bottom: 1px solid #e5e7eb !important;
}

.be-preview-actions {
    z-index: 100052 !important;
    position: relative;
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.be-preview-content {
  overflow-x: auto;
  width: 100%;
  padding-top: 20px !important;
}

.be-paper {
  background: #fff;
  color: #222;
  box-shadow: 0 8px 28px rgba(0,0,0,.12);
  padding: 25mm 25mm 25mm 30mm;
  box-sizing: border-box;
}

.be-preview-content .be-paper {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  box-sizing: border-box !important;
  background: #fff;
  box-shadow: 0 8px 28px rgba(0,0,0,.12);
}

.be-paper.be-paper-procuracao {
  padding: 18mm 18mm 18mm 20mm;
}

.be-paper.be-paper-procuracao p {
  font-size: 12pt !important;
  line-height: 1.2;
  margin-bottom: 16px !important;
}

.be-paper.be-paper-procuracao .sig-space {
  height: 18mm;
}

.be-paper .doc-logo-wrap {
  margin: 0 0 12mm;
}

.be-paper .doc-logo {
  display: block;
  max-width: 72mm;
  max-height: 22mm;
  width: auto;
  height: auto;
}

.be-paper h3,
.be-paper h4,
.be-paper p {
  margin: 0 0 14px;
  margin-bottom: 14px !important;
}

.be-paper h3 {
  font-size: 17pt;
  margin-bottom: 16px;
}

.be-paper p {
  font-size: 12pt;
  line-height: 1.55;
  text-align: justify;
}

.be-paper .center {
  text-align: center;
}

.be-paper .sig-space {
  height: 26mm;
}

.be-paper .doc-clause-title {
  font-weight: 700;
}

@media (max-width: 860px) {
  .be-form-grid {
    grid-template-columns: minmax(0,1fr);
  }
  .col-span-2 {
    grid-column: span 1;
  }
  .be-topbar {
    grid-template-columns: 56px 1fr 56px;
  }
  .be-title {
    font-size: 15px;
  }
  .be-home-logo {
    width: min(250px, 78vw);
    max-height: 150px;
  }
  .be-icon-btn {
    width: 56px;
    height: 56px;
  }
  .be-preview-head,
  .be-section-head {
    flex-direction: column;
    align-items: stretch;
  }
  .be-preview-content .be-paper {
    padding: 12px 12px 12px 16px !important;
  }
}

.be-check-grid,
.be-check-grid * {
  writing-mode: horizontal-tb !important;
  text-orientation: mixed !important;
}

.be-check-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(220px,1fr)) !important;
  gap: 10px 24px !important;
  padding: 8px 2px !important;
}

.be-check-grid .be-check-item-form {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 10px !important;
  min-width: 0 !important;
  width: 100% !important;
  margin: 0 !important;
  font-size: 15px !important;
  line-height: 1.35 !important;
  text-align: left !important;
}

.be-check-grid .be-check-item-form span {
  display: block !important;
  min-width: 0 !important;
  white-space: nowrap !important;
  word-break: normal !important;
  overflow-wrap: normal !important;
}

.be-check-grid .be-check-item-form input[type="checkbox"] {
  flex: 0 0 auto !important;
  width: 16px !important;
  height: 16px !important;
  margin: 0 !important;
}

.check-item {
  display: block !important;
  font-size: 11pt !important;
  line-height: 1.35 !important;
  text-align: left !important;
  white-space: normal !important;
  word-break: normal !important;
  overflow-wrap: break-word !important;
}

.be-auto-grow {
  min-height: 180px;
  resize: vertical;
}

.sign-name {
  text-transform: uppercase;
  letter-spacing: .4px;
}

.sign-role {
  text-align: center;
  font-size: 9pt;
  margin-top: 2px;
}

.cpf-line {
  text-align: center;
  font-size: 14px;
  margin-top: 4px;
}

.check-grid-print {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(220px,1fr)) !important;
  gap: 8px 16px !important;
  margin: 10px 0 14px !important;
  align-items: start !important;
}

.relato-box {
  border: 1px solid #d4c8b5;
  border-radius: 14px;
  min-height: 220px;
  padding: 14px 16px;
  white-space: pre-wrap;
  word-break: break-word;
}

@media (max-width: 640px) {
  .be-check-grid,
  .check-grid-print {
    grid-template-columns: minmax(0,1fr) !important;
  }
  .be-check-grid .be-check-item-form span {
    white-space: normal !important;
  }
}

/* ===== Visual leve 2.5.1 ===== */
html, body { background: #f3f4f6 !important; }
#be-doc-app { background: #f3f4f6; color: #1c1c1e; }
.be-topbar { background: rgba(243,244,246,.92); backdrop-filter: blur(16px); }
.be-title { color: #1c1c1e; font-size: clamp(13px, 1.25vw, 18px); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.be-icon-btn { background: #ffffff; color: #1c1c1e; border: 1px solid #e5e7eb; box-shadow: 0 6px 18px rgba(17,24,39,.08); }
.be-side-menu, .be-modal-card { background: #ffffff; color: #1c1c1e; border-color: #e5e7eb; }
.be-menu-btn.primary, .be-small-btn { background: #1f2937; color: #fff; }
.be-menu-btn.secondary, .be-small-btn.secondary { background: #e5e7eb; color: #1f2937; }
.be-menu-btn.preview { background: #f3f4f6; color: #111827; }
.be-search-box input, .be-field input, .be-field select, .be-field textarea { background: #ffffff; border-color: #d1d5db; color: #111827; }
.be-search-box input:focus, .be-field input:focus, .be-field select:focus, .be-field textarea:focus { border-color: #9ca3af; box-shadow: 0 0 0 3px rgba(156,163,175,.18); }
.be-section-title { color: #374151; }
.be-subcard, .be-doc-item, .be-home-card, .be-preview-card { background: #ffffff; color: #111827; border: 1px solid #e5e7eb; box-shadow: 0 8px 24px rgba(17,24,39,.05); }
.be-bottom-nav { background: rgba(255,255,255,.94); border-top: 1px solid #e5e7eb; backdrop-filter: blur(14px); }
.be-bottom-btn { color: #4b5563; }
.be-bottom-btn.active, .be-bottom-btn:hover, .be-bottom-btn:focus-visible { color: #111827; }
.be-logo-home { max-width: min(220px, 62vw); max-height: 96px; width: auto; height: auto; object-fit: contain; }
.be-paper { box-shadow: 0 12px 30px rgba(17,24,39,.08); }
@media (max-width: 768px) { .be-logo-home { max-width: 180px; max-height: 78px; } }

.be-subcard-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px;}
.be-subcard-head h3{margin:0;}

/* ===== TÍTULO COMPACTO DO APP ===== */
.be-topbar {
  grid-template-columns: 52px minmax(0, 1fr) 52px !important;
  gap: 10px !important;
}

.be-title-wrap {
  min-width: 0 !important;
  overflow: hidden !important;
}

.be-title {
  font-size: clamp(15px, 4.8vw, 24px) !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  letter-spacing: -0.02em !important;
}

@media (max-width: 860px) {
  .be-topbar {
    grid-template-columns: 48px minmax(0, 1fr) 48px !important;
    gap: 8px !important;
  }
  .be-title {
    font-size: clamp(14px, 4.6vw, 20px) !important;
  }
  .be-icon-btn {
    width: 48px !important;
    height: 48px !important;
    border-radius: 18px !important;
  }
}

/* ===== AJUSTES FINAIS ===== */
.be-card {
    min-height: 100vh !important;
    overflow: visible !important; 
background: #ffffff !important;
color: #111827 !important;
border: 1px solid #e5e7eb !important;
box-shadow: 0 8px 24px rgba(17,24,39,.05) !important;
}

.be-field label,
.be-section-title {
color: #374151 !important;
}

.be-field input[type="date"] {
display: block;
width: 100%;
max-width: 100%;
min-width: 0;
font-size: 16px;
line-height: 1.2;
padding-right: 14px;
overflow: hidden;
-webkit-appearance: none;
appearance: none;
}

.be-field input[type="date"]::-webkit-date-and-time-value {
text-align: left;
}

.be-field input[type="date"]::-webkit-calendar-picker-indicator {
opacity: 1;
margin-left: 8px;
}

.be-paper.be-paper-procuracao .center strong {
  font-size: 12pt !important;
}

.be-paper.be-paper-procuracao p strong {
  font-size: inherit !important;
}

.oab-line {
  text-align: center;
  font-size: 10pt;
  margin-top: 2px;
}

/* Cards do dashboard */
.dashboard-card {
    width: 150px;
    min-width: 150px;
    background: #ffffff;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
    cursor: pointer;
    transition: transform 0.2s, box-shadow 0.2s;
    display: inline-block;
    vertical-align: top;
}
.dashboard-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 20px rgba(0,0,0,0.12);
}
.card-img {
    width: 100%;
    height: 100px;
    object-fit: cover;
}
.card-content {
    padding: 8px 10px 12px;
}
.card-title {
    font-size: 14px;
    font-weight: 700;
    color: #b1976b;
    margin: 0 0 4px 0;
}
.card-desc {
    font-size: 10px;
    color: #4b5563;
    line-height: 1.35;
    margin: 0;
    white-space: normal;
    word-wrap: break-word;
}

.servicos-title {
    all: unset !important;
    /* Usa a mesma fonte e peso da seção de serviços */
    font-family: Arial, sans-serif !important;
    font-size: 18px !important; 
    font-weight: 600 !important;
    color: #000000 !important;
    /* Alinhamento idêntico ao 'Serviços' na imagem 15 */
    text-align: left !important;
    margin: 32px 0 10px 16px !important; 
    padding: 0 !important;
    display: block !important;
    z-index: 150000 !important;
}

.cards-scroll-wrapper {
    overflow-x: auto;
    overflow-y: hidden;
    white-space: nowrap;
    padding: 12px 16px;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
}
.cards-scroll-container {
    display: inline-flex;
    gap: 14px;
}

/* 2. Estilo para esconder cards que não batem com a pesquisa */
.card-oculto-pesquisa {
    display: none !important;
}


/* Lista de tópicos (segunda tela) */
.topic-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    padding: 16px;
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 16px;
    margin-bottom: 10px;
    text-align: left;
    cursor: pointer;
    transition: background 0.2s;
}
.topic-item:hover {
    background: #f9fafb;
}
.topic-title {
    font-size: 15px;
    font-weight: 500;
    color: #1f2937;
}
.topic-arrow {
    font-size: 18px;
    color: #9ca3af;
}


/* 1. ESTRUTURA DAS TELAS */
#nested-screen-container, 
#topic-screen-container {
    display: none; /* Deixe o JS controlar o 'flex' */
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    min-height: 100vh !important;
    background: #ffffff !important;
    z-index: 105000 !important;
    flex-direction: column !important;
    /*overflow: hidden !important; /* O container pai fica fixo */
}

/* 3. Garante que a barra de pesquisa não suma */
#nested-screen-container .be-search-container,
#topic-screen-container .be-search-container {
    position: sticky;
    top: 0;
    background: white;
    z-index: 10;
    padding: 10px 15px !important;
    margin-bottom: 15px;
}

/* Estilizando a Barra de Pesquisa com Lupa na Direita */
#nested-screen-container input[type="text"],
#topic-screen-container input[type="text"] {
    width: 100% !important;
    padding: 12px 45px 12px 15px !important; /* Espaço de 45px na DIREITA para a lupa */
    border-radius: 12px !important;
    border: 1px solid #e5e7eb !important;
    background-color: #f9fafb !important;
    
    /* Ícone de Lupa em Cinza (#9ca3af) no canto direito */
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%239ca3af' stroke-width='2'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z' /%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: calc(100% - 15px) center !important; /* Posiciona a 15px da borda direita */
    background-size: 20px !important;
    font-size: 15px !important;
    color: #4b5563 !important;
    outline: none !important;
    transition: all 0.3s ease !important;
}

/* Efeito de foco */
#nested-screen-container input[type="text"]:focus,
#topic-screen-container input[type="text"]:focus {
    border-color: #b1976b !important;
    background-color: #ffffff !important;
    box-shadow: 0 0 0 4px rgba(177, 151, 107, 0.1) !important;
}
/* 2. CABEÇALHO (PARA-CHOQUE) */
/* Ajuste do Header (Para-choque) */
.nested-header {
    margin-top: 90px !important; /* Exata altura da Topbar */
    height: 70px !important;
    flex-shrink: 0 !important;
    display: flex !important;
    align-items: center !important;
    padding: 0 15px !important;
    background: #ffffff !important;
    border-bottom: 1px solid #f3f4f6 !important;
}

/* AJUSTE DA LISTA: Onde o conteúdo realmente rola */
#nested-topics-list, 
#topic-details-content {
    flex: 1 !important; /* Ocupa todo o espaço restante */
    padding: 10px 20px 120px 20px !important; /* Padding no fundo para não cobrir o último item */
    margin-top: 0 !important; /* Remova o margin-top de 80px que estava no seu código */
    background: none !important;
    min-height: 100vh;
    border: none !important;
    display: block !important;
    opacity: 1 !important;
    overflow: hidden !important;
    visibility: visible !important;
    -webkit-overflow-scrolling: touch;
}

/* Customização da Barra de Rolagem (Efeito visual) */
#nested-topics-list::-webkit-scrollbar,
#topic-details-content::-webkit-scrollbar {
    width: 6px;
}

#nested-topics-list::-webkit-scrollbar-thumb,
#topic-details-content::-webkit-scrollbar-thumb {
    background-color: #d1d5db;
    border-radius: 10px;
}

/* 4. DESIGN DOS CARDS (ESTADO INICIAL: INVISÍVEL) */
#nested-topics-list > div, 
#nested-topics-list > button {
    display: flex !important;
    align-items: center !important;
    opacity: 1; /* Começa invisível para o JS animar */
    transform: translateY(0px); /* Vem de baixo */
    transition: transform 0.8s cubic-bezier(0.175, 0.885, 0.32, 1.275), 
                opacity 0.8s ease, 
                background-color 0.3s ease !important;
    border-radius: 12px !important;
    margin-bottom: 12px !important;
    border: none !important;
    background-color: #fff !important;
    display:flex !important;
    align-items: center !important;
    width: 100% !important;
    overflow-y: auto !important;
    cursor: pointer !important;
    /* Sombreado Leve (Estado Normal) */
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05) !important;
}
/* Ajuste no efeito de expansão (Honda Magic Seats) */
.card-expandido {
    /* Transição de 0.6s para quando o card "abrir" para mostrar conteúdo */
    transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1) !important;
    height: auto !important;
    min-height: 140px !important;
    background-color: #fcfaf7 !important;
}

/* CLASSE QUE O JS APLICA (TORNA VISÍVEL) */
.card-visivel {
    opacity: 1 !important;
    transform: translateY(0) !important;
    background: none !important;
    border: none !important;
    color: none !important;
    box-shadow: none !important;
 }

/* Efeito Hover */
#nested-topics-list > div:hover, 
#nested-topics-list > button:hover {
    border-color: #b1976b !important;
    background-color: #fcfaf7 !important;
    transform: translateX(5px) !important;
    box-shadow: 0 8px 24px rgba(177, 151, 107, 0.15) !important;
}

.nested-topics-list {
    background: none !important;
}

/*5. SETA PARA A DIREITA
#nested-topics-list i, 
#nested-topics-list span:last-child {
    margin-left: auto !important;
    color: #b1976b !important;
    padding-left: 10px !important;
}*/

/* 6. BOTÃO VOLTAR E TÍTULO */
.nested-back-btn {
    all: unset !important;
    flex-shrink: 0;
    width: 42px !important;
    height: 42px !important;
    /*border-radius: 50% !important;
    border: 1.5px solid #4b5563 !important;*/
    background: transparent !important;
    color: #b1976b !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 26px !important;
    font-weight: bold !important;
    margin-left: 13px !important;
    cursor: pointer !important;
}

/* 6. TÍTULO ELEGANTE */
.nested-title {
    font-size: 1.2rem !important;
    line-height: 1.2 !important;
    font-weight: 700 !important;
    color: #111827 !important;
    margin: 0 !important;
    align-items: left !important;
    justify-content: center !important;
    padding-left: 20px;
    
}

/* --- ROLAGEM DA TELA PRINCIPAL (Notebook) --- */
.be-screen[data-screen="preview"] {
    overflow: visible !important;
    max-height: 100vh !important;
}
/* 8. AJUSTE DO CAMPO DE PESQUISA */
#nested-screen-container div[style*="padding: 16px;"] {
    padding: 10px 20px !important;
}

/* TELA DE PREVIEW CORRIGIDA - AJUSTE */
.be-screen[data-screen="preview"] {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    z-index: 90000 !important; /* Um pouco abaixo das barras */
    background: white !important;
    overflow-y: auto !important;
    padding-top: 70px; /* Espaço para a Topbar */
    padding-bottom: 90px; /* Espaço para a Bottom Nav */
}

/* REMOVA OU COMENTE ESTE BLOCO ABAIXO QUE VOCÊ TINHA:
.be-screen[data-screen="preview"] .be-topbar,
.be-screen[data-screen="preview"] .be-bottom-nav {
    display: none !important;
}
*/

/* Garanta que as barras fiquem ACIMA do Preview fixed */
.be-topbar, .be-bottom-nav {
    z-index: 100005 !important; 
}

.be-preview-head {
    position: sticky !important;
    top: 0 !important;
    background: white !important;
    z-index: 100001 !important;
    padding: 20px 24px !important;
    border-bottom: 1px solid #e5e7eb !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
}

/* Se o texto de ajuda for uma tag de texto dentro da head, force a exibição */
.be-preview-head p, 
.be-preview-head .be-muted {
    display: block !important;
    visibility: visible !important;
}

.be-preview-actions {
    display: flex !important;
    gap: 8px !important;
    flex-wrap: wrap !important;
    z-index: 100002 !important;
}

.be-preview-actions button {
    display: inline-flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
}

.be-screen {
    pointer-events: none; /* Desativa cliques em telas inativas */
}

.be-screen.active {
    pointer-events: auto; /* Ativa apenas na tela visível */
}

/* As barras de navegação devem sempre aceitar cliques */
.be-topbar, .be-bottom-nav {
    pointer-events: auto !important;
}

/* Ajuste de profundidade para os controles */
.be-topbar, .be-bottom-nav {
    z-index: 100010 !important; /* Maior que o preview */
}

.be-screen[data-screen="preview"] {
    padding-top: 80px !important; /* Dá espaço para a Topbar aparecer */
    padding-bottom: 100px !important; /* Dá espaço para a Bottom Nav aparecer */
}

/* Evita que telas inativas bloqueiem o clique */
.be-screen:not(.active) {
    display: none !important;
    pointer-events: none !important;
}

/* Esconde PDF e Compartilhar pelo ID exato e posição */
#be-print-preview, 
#be-share-preview {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

.be-help-modal {
    position: fixed !important;
    inset: 0 !important;
    background: rgba(0,0,0,0.6) !important;
    display: none; /* Inicia escondido */
    align-items: center !important;
    justify-content: center !important;
    z-index: 120000 !important;
}

.be-help-modal.open {
    display: flex !important;
}

.be-help-content {
    background: #ffffff !important;
    width: min(450px, 90%) !important;
    padding: 24px !important;
    border-radius: 20px !important;
    box-shadow: 0 20px 50px rgba(0,0,0,0.3) !important;
    position: relative !important;
}

.be-help-close {
    margin-top: 20px;
    width: 100%;
    background: #b1976b !important;
    color: white !important;
    border: none !important;
    padding: 12px !important;
    border-radius: 12px !important;
    cursor: pointer !important;
    font-weight: bold;
}

/* --- POPUP DE AJUDA --- */
#help-popup {
    display: none; /* Controlado pelo JS */
    position: fixed !important;
    inset: 0 !important;
    background: rgba(0, 0, 0, 0.6) !important; /* Fundo escurecido suave */
    z-index: 300000 !important;
    align-items: center !important;
    justify-content: center !important;
    
    font-family: Arial, Helvetica, sans-serif !important;
}

.help-modal-card {
    background: #ffffff !important; /* Fundo branco */
    width: 100% !important;
    max-width: 500px !important;
    border-radius: 15px !important;
    padding: 30px !important;
    box-shadow: 0 10px 30px rgba(0,0,0,0.2) !important;
}

.help-modal-card h3 {
    color: #000000 !important; /* Título Preto */
    font-size: 24px !important; /* Um pouco maior */
    font-weight: bold !important; /* Negrito */
    margin-top: 0 !important;
    margin-bottom: 20px !important;
    border-bottom: 2px solid #b1976b !important; /* Linha elegante na cor do escritório */
    padding-bottom: 10px !important;
}

#help-text-container {
    color: #000000 !important; /* Texto Preto */
    font-size: 16px !important; /* Tamanho padrão */
    line-height: 1.6 !important;
    text-align: justify !important; /* Texto Justificado */
    margin-bottom: 25px !important;
    max-height: 50vh !important;
    overflow-y: auto !important; /* Rolagem interna se o texto for longo */
    
    padding-right: 15px !important; /* Afasta o texto da barra de rolagem */
    scrollbar-width: thin; /* Deixa a barra mais fina em navegadores modernos */
    scrollbar-color: #b1976b #f0f0f0;
}

/* Estilização da barra de rolagem para Chrome/Edge/Safari */
#help-text-container::-webkit-scrollbar {
    width: 6px;
}
#help-text-container::-webkit-scrollbar-thumb {
    background-color: #b1976b;
    border-radius: 10px;
}

/* --- CORREÇÃO DE ROLAGEM NO NOTEBOOK (Telas 2 e 3) --- */
/* Isso vai "destravar" o mouse nas telas de categorias */
.be-screen, #nested-screen-container, #topic-screen-container {
    overflow-y: auto !important;
    height: 100vh !important;
}

/* Garante que o corpo do documento não trave a rolagem */
body {
    overflow: auto !important;
}

/* --- SEÇÃO DE FAVORITOS (ESTILO IMAGE_12) --- */
.be-fav-section {
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin: 0 !important;
    width: 100% !important;
}

/* --- AJUSTE DO TÍTULO FAVORITOS --- */
/* --- IGUALAR TÍTULOS --- */
.be-fav-header {
    /* Usa a mesma fonte e peso da seção de serviços */
    font-family: Arial, sans-serif !important;
    font-size: 18px !important; 
    font-weight: 600 !important;
    color: #000000 !important;
    /* Alinhamento idêntico ao 'Serviços' na imagem 15 */
    text-align: left !important;
    margin: 32px 0 20px 16px !important; 
    padding: 0 !important;
    display: block !important;
    z-index: 150000 !important;
    
}

/* Container que centraliza as 4 colunas */
/* Garante que o grid distribua os botões igualmente na largura da tela */
.be-fav-grid {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    justify-items: center !important; /* Centraliza cada botão em sua coluna */
    align-items: center !important;
    width: 100% !important;
    padding: 0 15px !important;
    box-sizing: border-box !important;
}

.be-fav-item {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    cursor: pointer !important;
    border: none !important;
    background: none !important;
}

/* O Box do Ícone (Ajustado para 64px) */
.be-fav-icon-box {
    width: 52px !important;
    height: 52px !important;
    background: #ffffff !important;
    border-radius: 18px !important; /* Proporcional ao tamanho menor */
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin-bottom: 8px !important;
    box-shadow: 0 8px 15px rgba(0, 0, 0, 0.2) !important;
}

/* --- CORREÇÃO DO ÍCONE AGENDA --- */
/* Na imagem 15 o ícone pareceu um retângulo com números. 
   Vamos usar um ícone clássico que não falha em dispositivos móveis */
.be-fav-icon-box i.fa-calendar-check {
    font-size: 28px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* Ajuste do Calendário para não ficar "Gordo" */
.be-fav-item[onclick*="agenda"] i {
    font-size: 26px !important;
    /* Reduzir a opacidade levemente dá a sensação de que o traço é mais fino */
    opacity: 0.85;
}

/* Pix: Redução de espessura e tamanho */
/* Centraliza os SVGs dentro dos boxes brancos */
.be-svg-icon {
    width: 24px !important;
    height: 24px !important;
    display: block !important;
    
}

.pix-svg-icon {
    padding: 8px; /* Ajuste o valor conforme necessário */
    box-sizing: border-box; /* Garante que o padding não aumente o tamanho total */
    max-width: 42px; /* Ou o tamanho que combine com seu layout */
    height: auto;
    display: block;
    margin: 0 auto; /* Centraliza se estiver em um container */
    
}

/* Reset de ícones para garantir que apareçam */
.be-fav-icon-box i {
    display: inline-block !important;
    font-style: normal !important;
    font-variant: normal !important;
    text-rendering: auto !important;
    -webkit-font-smoothing: antialiased !important;
}

/* Estilo especial para o ícone OAB (Texto em vez de ícone) */
.be-fav-icon-oab {
    font-weight: 700 !important;
    font-size: 16px !important;
    color: #4b5563 !important;
}

/* Afinar especificamente o Cifrão */
.be-fav-item[onclick*="financeiro"] i {
    font-size: 30px !important;
    /* Webkit-text-stroke cria uma borda invisível que "come" o preenchimento do ícone */
    -webkit-text-stroke: 1px #ffffff; 
}

.be-fav-label {
    font-size: 11px !important;
    font-weight: 600 !important;
    color: #4b5563 !important;
    text-align: center !important;
}

/* Feedback de toque */
.be-fav-item:active .be-fav-icon-box {
    transform: scale(0.92) !important;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.04) !important;
}

/* Container da Agenda */
.be-agenda-wrapper {
    padding: 15px;
    display: flex;
    flex-direction: column;
    gap: 20px;
    background: none !important;
}

/* Recupera o ícone e organiza o cabeçalho */
.be-agenda-header-actions {
    display: block !important;
    width: 100% !important;
    margin-bottom: 20px !important;
}

/* Linha do Dia + Compromisso */
.be-agenda-row {
    display: flex;
    max-width: 600px !important;
    height: auto !important;
    align-items: flex-start;
    gap: 15px;
    background: #ffffff !important;
    padding: 15px;
    border-radius: 20px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.05) !important;
}

/* Força os itens da agenda a aparecerem */
.be-agenda-row.card-visivel, 
.be-agenda-header-actions.card-visivel,
.be-agenda-wrapper.card-visivel {
    display: flex !important; /* ou block, dependendo do seu layout */
    opacity: 1 !important;
    visibility: visible !important;
    position: relative !important;
    z-index: 10 !important;
}


/* Coluna da Esquerda (Data) */
.be-agenda-date-col {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 70px;
    border-right: 1px solid #eee;
    padding-right: 10px;
}

.day-number {
    font-size: 32px;
    font-weight: 800;
    color: #b1976b;
    line-height: 1;
}

.day-name {
    font-size: 12px;
    text-transform: uppercase;
    font-weight: 700;
    color: #333;
    margin-top: 5px;
}

.month-year {
    font-size: 10px;
    color: #999;
}

/* Coluna da Direita (Card de Detalhes) */
.be-agenda-details {
    flex: 1;
}

.agenda-time-tag {
    font-size: 13px;
    font-weight: 700;
    color: #b1976b;
    margin-bottom: 5px;
    display: block;
}

.agenda-title {
    padding-top: 25PX !important;
    font-size: 16px;
    font-weight: 700;
    color: #111;
    margin: 0 0 4px 0;
}

.agenda-subtext {
    font-size: 13px;
    color: #666;
    margin: 0;
}

/* 1. Blindagem do Formulário contra heranças do tema */
div#nested-screen-container .be-form-wrapper {
    display: flex !important;
    flex-direction: column !important; /* Força um em cima do outro */
    width: 100% !important;
    max-width: 100vw !important;
    padding: 20px !important;
    box-sizing: border-box !important;
    background-color: #fff !important;
    position: relative !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Força que cada grupo de campo ocupe a linha inteira horizontalmente */
div#nested-screen-container .field-group {
    display: block !important;
    width: 100% !important;
    clear: both !important;
    margin-bottom: 15px !important;
}

/* 2. Forçar texto na horizontal e visibilidade dos inputs */
div#nested-screen-container .be-form-wrapper h3 {
    display: block !important;
    width: 100% !important;
    white-space: normal !important;
    text-align: left !important;
    color: #333 !important;
    height: 70px;
    border-radius: 12px;
    padding: 10px;
}

div#nested-screen-container .be-form-wrapper label {
    display: block !important;
    font-weight: bold !important;
    margin-bottom: 5px !important;
    color: #333 !important;
}

div#nested-screen-container .be-form-wrapper input, 
.be-form-wrapper textarea {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    min-height: 45px !important;
    padding: 12px !important;
    margin-bottom: 15px !important;
    border: 1px solid #ddd !important;
    border-radius: 10px !important;
    box-sizing: border-box !important;
    background: #fff !important;
}

.btn-voltar-form { background: none; border: none; color: #b1976b; font-weight: bold; margin-bottom: 15px; }
.form-part-box { background: #f9f9f9; padding: 15px; border-radius: 12px; margin-bottom: 15px; }

/* Ajuste específico para a linha de adicionar participantes */
/* Corrige a linha de participantes */
.form-row {
    display: flex !important;
    gap: 10px !important;
    margin-bottom: 10px !important;
}

.form-row input {
    margin-bottom: 0 !important;
}

.btn-add-p { background: #b1976b; color: #fff; border: none; padding: 0 15px; border-radius: 8px; }
.badge-p { display: inline-block; background: #eee; padding: 4px 10px; border-radius: 15px; margin: 5px 5px 0 0; font-size: 11px; }

/* Botões de Ação */
.btn-novo-comp { width: 100%; background: #b1976b; color: #fff; border: none; padding: 15px; border-radius: 12px; font-weight: bold; margin-bottom: 0px; }
.btn-finalizar { width: 100%; background: #000000; color: #fff; border: none; padding: 15px; border-radius: 12px; font-weight: bold; }
.btn-reuniao-link { display: inline-block; background: #00437C !important; color: #fff !important; padding: 6px 12px; border-radius: 6px; text-decoration: none; font-size: 12px; margin-top: 5px; }

/* Lista de Participantes no Card */
.agenda-parts-list { margin-top: 10px; display: flex; flex-wrap: wrap; gap: 5px; }
.part-mini-badge { background: #f1f1f1; padding: 3px 8px; border-radius: 5px; font-size: 11px; text-decoration: none; color: #333; border: 1px solid #ddd; }
.agenda-top { display: flex; justify-content: space-between; align-items: center; }
.btn-delete-item { margin: 10px 0 0 5px; font-size: 13px;
  font-weight: bold !important; display: inline; background: none; border: none; color:#d32f2f; cursor: pointer; 
}

.btn-edit-small { 
    margin-right: 5px;
    font-size: 13px;
    font-weight: bold !important; 
    display: inline; 
    background: none; 
    border: none; 
    color:#b1976b;  
    cursor: pointer; 
}

/* 3. Resolver o reCAPTCHA e Barra Inferior */
/* Oculta o selo se estiver atrapalhando demais, ou move para cima */
.grecaptcha-badge { 
    visibility: hidden !important; /* Opção 1: Ocultar o selo visual (o Captcha continua funcionando) */
    /* Se preferir apenas mover, comente a linha acima e use: bottom: 100px !important; */
}

/* Garante que sua barra inferior fique no topo de tudo */
.footer-navigation, .be-bottom-nav, .elementor-location-footer {
    z-index: 99999 !important;
    position: fixed !important;
}

/* --- BLINDAGEM E DESIGN INDEPENDENTE DO FINANCEIRO --- */

/* Força a barra inferior a ficar fixa na base da tela mobile, sem sumir ou quebrar */
#be-app-bottom-nav {
    position: fixed !important;
    bottom: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 65px !important;
    background: #ffffff !important;
    border-top: 1px solid #e0e0e0 !important;
    display: flex !important;
    justify-content: space-around !important;
    align-items: center !important;
    z-index: 999999 !important;
    box-shadow: 0 -3px 10px rgba(0,0,0,0.05) !important;
    box-sizing: border-box !important;
}

/* Garante o comportamento e tamanho dos botões favoritos */
.be-nav-item {
    background: none !important;
    border: none !important;
    padding: 5px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    color: #666 !important;
    font-size: 11px !important;
    font-weight: 500 !important;
    cursor: pointer !important;
    width: 20% !important;
    height: 100% !important;
}

/* Destaque para o botão Controle (Financeiro) para não ficar em branco */
.be-nav-main-btn {
    color: #b1976b !important;
    font-weight: bold !important;
}
.be-nav-icon {
    font-size: 18px !important;
    margin-bottom: 2px !important;
}

/* Container de tela cheia para o Financeiro */
.be-custom-screen {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: calc(100% - 65px) !important;
    background: #f8f9fa !important;
    z-index: 99999 !important;
    display: none !important;
    overflow-y: auto !important;
    box-sizing: border-box !important;
}
.be-custom-screen.active {
    display: block !important;
}

/* Cabeçalho da tela do financeiro */
.be-custom-screen-header {
    background: #ffffff !important;
    padding: 15px !important;
    border-bottom: 1px solid #eee !important;
    display: flex !important;
    align-items: center !important;
    position: sticky !important;
    top: 0 !important;
}
.be-screen-back-btn {
    background: none !important;
    border: none !important;
    color: #b1976b !important;
    font-weight: bold !important;
    font-size: 14px !important;
    cursor: pointer !important;
    margin-right: 15px !important;
}
.nested-title {
    font-size: 16px !important;
    font-weight: bold !important;
    color: #333 !important;
}
.be-custom-screen-body {
    padding: 15px !important;
    box-sizing: border-box !important;
}

#be-bottom-share {
    pointer-events: auto !important;
    position: relative !important;
    z-index: 999999 !important;
}

.be-loading{
    padding:30px;
    text-align:center;
}

/* =========================================
   TABELA DE HONORÁRIOS
========================================= */

.be-honorarios-areas,
.be-honorarios-content,
.be-area-card,
.be-honorario-card,
.be-empty-state {
    opacity: 1 !important;
    transform: none !important;
    background: none !important;
}

.be-honorarios-areas{
    display:flex !important;
    gap:14px !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    padding-bottom:10px !important;
    margin-bottom:24px !important;
    color: none !important;
    background: none !important;
    border: none !important;
    box-shadow: none !important;
    hover: none !important;
   /* scroll-snap-type:x proximity;
    -webkit-overflow-scrolling:touch;*/
}

.be-area-card {
    all: unset !important;
    box-sizing: border-box !important;
    width: 180px !important;
    min-width: 180px !important;
    height: 120px !important;
    max-height: 120px !important;
    border: none !important;
    border-radius: 18px !important;
    background: #fff !important;
    /* Mantemos o padding equilibrado */
    padding: 20px 20px 10px 20px !important; 
    display: grid !important;
    /* Define o tamanho fixo do ícone e do título (2 linhas de 1.3em = 2.6em) */
    grid-template-rows: auto 2.6em !important; 
    align-content: end !important; /* Força todo o conteúdo do grid para a BASE do card */
    justify-content: start !important; /* Garante o alinhamento à ESQUERDA */
    gap: 6px !important;
    cursor: pointer !important;
    text-align: left !important;
    transition: all .25s ease !important;
    overflow: hidden !important;
    box-shadow: 10px 10px 30px 5px rgba(0,0,0,.08) !important;
}

.be-area-card:hover{
    transform:translateY(-3px) !important;
    box-shadow:0 10px 30px rgba(0,0,0,.08) !important;
    border: none !important;
}

.be-area-icon img {
    width: 30px !important;
    height: 30px !important;
    object-fit: contain !important;
    display: flex;
    align-items: left;
    justify-content: space-between !important;
    flex-shrink: 0; /* Impede que o ícone fique achatado
    Ajuste fino da margem inferior para compensar a fonte/linha base*/
    margin-bottom: 2px;
}

.be-area-title{
    font-family: Arial, sans-serif !important;
    font-size:14px !important;
    font-weight: 600 !important;
    color: #4b5563 !important;
    line-height:1.2 !important;
    white-space:normal !important;
    word-break: keep-all; /* Evita quebras em hífen */
    margin: 0 !important;
    align-self: start !important; /* Força o texto a começar do topo da sua linha do grid */
    overflow-wrap:break-word !important; /* Quebra palavras muito longas se necessário */
    hyphens:auto !important;
}

/* =========================================
   CONTEÚDO DOS HONORÁRIOS
========================================= */

.be-honorarios-content{
    display:flex !important;
    background: none !important;
    border: none important;
    flex-direction:column !important;
    gap:18px !important;
}

h2.be-honorarios-header,
h2.be-honorarios-header * {
  all: unset !important; /* Reseta ABSOLUTAMENTE TUDO do H2 do tema */
}

.be-honorarios-header {
    all: unset !important;
    padding-top: 20px !important;
    display: flex !important;
    font-family: Arial, sans-serif !important;
    font-size: 16px !important;
    /*line-height: 1.2 !important;*/
    font-weight: 700 !important;
    color: #4b5563 !important;
    margin-bottom:10px;
    align-items: center !important;
    gap: 8px !important;
}

.be-honorarios-header img {
    /*padding-top: 20px !important;*/
    width: 40px !important;
    height: 40px !important;
    flex-shrink: 0;
    display: flex;  
    object-fit: contain !important;
    
}

.be-honorario-card{

    opacity:1 !important;
    transform:none !important;
    width:100% !important;
    border-radius:18px !important;
    margin-bottom:16px !important;
    border:1px solid #e5e7eb !important;
    background:#ffffff !important;
    padding:22px 20px !important;
    cursor:pointer !important;
    box-shadow:0 4px 12px rgba(0,0,0,.05) !important;
    transition:
        transform .30s ease,
        box-shadow .30s ease,
        border-color .30s ease,
        background-color .30s ease !important;

    display:block !important;
}

.be-honorario-card:hover{
    border-color:#b1976b !important;
    background:#fcfaf7 !important;
    transform:translateX(5px) !important;
    box-shadow:
        0 8px 24px rgba(177,151,107,.15) !important;
}

.be-honorario-top{
    display:flex !important;
    justify-content:space-between !important;
    align-items:flex-start !important;
    gap:12px !important;
    margin-bottom:18px !important;
    flex-wrap:wrap !important;
}

.be-codigo{
    background:#b1976b !important;
    color:#fff !important;
    padding:8px 14px !important;
    border-radius:999px !important;
    font-size:12px !important;
    font-weight:700 !important;
}

.be-media{
    color:#999 !important;
    font-size:13px !important;
    text-align:right !important;
}

.be-descricao{
    font-size:16px !important;
    line-height:1.6 !important;
    color:#222 !important;
    margin-bottom:22px !important;
    text-align:left !important;
    word-break:break-word !important;
}

.be-valor{
    font-size:18px !important;
    font-weight:600 !important;
    color:#b1976b !important;
    line-height:1.2 !important;
    text-align:left !important;
}

.be-empty-state{
    background:#fff !important;
    padding:40px !important;
    border-radius:24px !important;
    text-align:center !important;
    color:#777 !important;
}

/*COMEÇO PAGPIX*/

.be-modal-overlay {
    display: none;
    position: fixed !important;
    inset: 0 !important;
    top: 0; left: 0;
    width: 100%; 
   
    background: rgba(0, 0, 0, 0.6) !important;
    backdrop-filter: blur(4px);
    justify-content: center !important;
    align-items: center !important;
    z-index: 120000 !important;
}

.be-modal-overlay.open {
    display: flex !important;
}

.be-modal-content {
    background: #ffffff !important;
    max-height: 60vh !important;
    padding: 24px !important;
    border-radius: 20px !important;
    box-shadow: 0 20px 50px rgba(0,0,0,0.3) !important;
    position: relative !important;
    padding: 24px;
    overflow-y: auto;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

.be-modal-close {
    position: absolute !important;
    top: 15px !important; 
    right: 25px !important;
    font-size: 24px !important;
    font-weight: bold !important;
    color: #999 !important;
    cursor: pointer !important;
    background: none; 
    border: none;
    transition: color 0.2s;
}

.be-modal-close:hover { 
    color: #333; 
}

/* ESTILIZAÇÃO DO CARD ELEGANTE */
.pagpix-card {
    width: 100% !important;
    max-width: 500px !important;
    background: linear-gradient(135deg, #f9fbf9 0%, #f4f9f5 100%);
    border: 2px solid #b1976b;
    border-radius: 15px;
    padding: 20px;
    margin-top: 15px;
    box-shadow: 0 4px 12px rgba(39, 174, 96, 0.08);
}
.pagpix-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #e1f0e5;
    padding-bottom: 12px;
    margin-bottom: 15px;
    
}
.pagpix-logo {
    max-height: 45px;
    width: auto;
    object-fit: contain;
}
.pagpix-titulo {
    font-size: 16px;
    font-weight: bold;
    color: #000;
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 0 auto; /* Centraliza o título */
   
}
.pagpix-linha {
    font-size: 14px;
    margin-bottom: 8px;
    color: #333;
    
}
.pagpix-linha strong { color: #555; }
.pagpix-qrcode-box {
    text-align: center;
    margin: 15px 0;
}
.pagpix-qrcode-box img {
    max-width: 140px;
    border: 1px solid #ddd;
    padding: 5px;
    background: #fff;
    border-radius: 8px;
    
}
.copia-cola-container {
    display: flex;
    gap: 8px;
    margin-top: 10px;
    
}
.copia-cola-input {
    flex: 1;
    padding: 8px 12px;
    border: 1px solid #ccc;
    border-radius: 8px;
    font-size: 12px;
    background: #fcfcfc;
    color: #666;
}
.btn-pix-acao {
    background: #004d00 !important;
    color: white;
    border: none;
    border-radius: 8px;
    padding: 8px 12px;
    cursor: pointer;
    font-weight: bold;
    font-size: 13px;
    display: flex;
    align-items: center;
    gap: 5px;
 }
.btn-pix-acao:hover { background: #018201 !important; }

.btn-pix-compartilhar {
    background: #b1976b !important;
    color: white;
    border: none;
    border-radius: 8px;
    padding: 8px 12px;
    cursor: pointer;
    font-weight: bold;
    font-size: 13px;
    display: flex;
    align-items: center;
    gap: 5px;
 }
.btn-pix-compartilhar:hover { background: #DAA520 !important; }

.icone-pix-pagpix {
    display: inline !important;
    border: none !important;
    box-shadow: none !important;
    width: 14px !important;  
    height: 14px !important;
    max-width: 14px !important;
    max-height: 14px !important;
    min-width: 14px !important;
    min-height: 14px !important;
    margin: 0 0.07em !important;
    vertical-align: -0.1em !important;
    background: none !important;
    padding: 0 !important;
    flex-shrink: 0 !important; 
    /* Garante que ícones SVG ou imagens não fiquem distorcidos */
  object-fit: contain !important; 
}