/* Visual novo do Administrador (Gerador de Minutas), 27/10/2026 (Claude).
   Camada SO' de aparencia, carregada depois do CSS do app. Nao altera React, dados
   nem comportamento. Mesma identidade da Central do Cliente: azul-marinho liso,
   dourado, Cormorant Garamond nos titulos e Manrope no texto.
   Organizado por secao: GERAL, HOME, ... (cada secao foi publicada separadamente). */

/* ===================== GERAL ===================== */

@font-face { font-family: "Cormorant Garamond"; font-style: normal; font-weight: 500 700; font-display: swap;
  src: url("/fonts/cormorant-garamond-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Cormorant Garamond"; font-style: normal; font-weight: 500 700; font-display: swap;
  src: url("/fonts/cormorant-garamond-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Manrope"; font-style: normal; font-weight: 400 800; font-display: swap;
  src: url("/fonts/manrope-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Manrope"; font-style: normal; font-weight: 400 800; font-display: swap;
  src: url("/fonts/manrope-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }

:root {
  --ad-serif: "Cormorant Garamond", Georgia, "Times New Roman", serif;
  --ad-sans: "Manrope", "Segoe UI", Arial, sans-serif;
  --ad-ease: cubic-bezier(.22, 1, .36, 1);
  --ad-line: #e3e8f0;
  --ad-line-strong: #cdd5e3;
  --ad-ground: #f3f5f9;

  /* tokens do app, trocados para a paleta da marca (afeta todas as telas por igual) */
  --navy: #0a1f4e;
  --navy-deep: #0a1f4e;
  --navy-soft: #183c86;
  --gold: #d6a53a;
  --gold-bright: #ecc56b;
  --gold-soft: #fcf2db;
  --cream: var(--ad-ground);
  --paper: #fff;
  --paper-soft: rgba(255, 255, 255, .92);
  --border: var(--ad-line);
  --border-soft: var(--ad-line);
  --ink: #0c1a3b;
  --muted: #56627c;
  --shadow: 0 2px 4px rgba(12, 26, 59, .04), 0 18px 40px -22px rgba(12, 26, 59, .28);
  --soft-shadow: 0 1px 2px rgba(12, 26, 59, .04), 0 10px 28px -18px rgba(12, 26, 59, .2);
}

body {
  font-family: var(--ad-sans);
  -webkit-font-smoothing: antialiased;
  font-variant-numeric: tabular-nums;
}

h1, h2 {
  font-family: var(--ad-serif);
  font-weight: 600;
  letter-spacing: -.005em;
  font-variant-numeric: lining-nums tabular-nums;
}

h3 {
  font-family: var(--ad-sans);
  font-weight: 700;
}

::selection {
  color: var(--navy);
  background: var(--gold-bright);
}

:is(button, a, input, select, textarea, [tabindex]):focus-visible {
  outline: 2px solid var(--gold);
  outline-offset: 2px;
}

:is(button, a, label, input, select, textarea) {
  touch-action: manipulation;
  -webkit-tap-highlight-color: rgba(214, 165, 58, .18);
}

/* ---- topo ---- */

.topbar {
  background: var(--navy);
  border-bottom: 1px solid rgba(236, 197, 107, .35);
  box-shadow: 0 6px 20px -12px rgba(10, 31, 78, .5);
}

.brand .logo-mark {
  filter: none;
}

.brand span {
  font-family: var(--ad-serif);
  font-weight: 600;
  letter-spacing: .01em;
}

.product-divider {
  width: 1px;
  background: rgba(236, 197, 107, .45);
}

.product-title {
  text-shadow: none;
  letter-spacing: .02em;
}

.nav-item {
  transition: color .2s ease, background-color .2s ease;
}

.nav-item.external {
  text-decoration: none;
}

/* Computador: o menu precisa caber inteiro (antes o "Central" saia cortado). */
@media (min-width: 1181px) {
  .topbar-inner {
    min-height: 76px;
    gap: 18px;
  }

  .brand-button {
    min-width: 0;
  }

  .brand .logo-mark {
    width: 46px;
    height: 46px;
  }

  .brand span {
    font-size: 20px;
  }

  .product-divider {
    height: 38px;
  }

  .product-title {
    min-width: 0;
    font-size: 14px;
  }

  .main-nav {
    gap: 2px;
  }

  .nav-item {
    padding: 0 10px;
    font-size: 14px;
    font-weight: 600;
  }

  .nav-item:hover {
    color: #fff;
  }

  .nav-item.active::after {
    right: 10px;
    left: 10px;
    height: 3px;
    border-radius: 3px 3px 0 0;
    background: var(--gold-bright);
  }
}

/* Tablet/celular: barra lateral (comportamento do app mantido), so' cores. */
@media (max-width: 1180px) {
  .main-nav,
  .main-nav.is-expanded {
    border-right: 1px solid rgba(236, 197, 107, .35);
    background: var(--navy);
  }
}

/* ---- fundo ---- */

.app-main {
  background: var(--ad-ground);
}

.background-mark {
  opacity: .22;
}

/* ---- titulo das paginas ---- */

.title-ornament {
  display: none;
}

.page-title h1 {
  margin-top: 0;
  color: var(--navy);
  font-size: clamp(38px, 4vw, 54px);
  line-height: 1.02;
}

.page-title p {
  margin-top: 10px;
  color: var(--muted);
  font-family: var(--ad-sans);
  font-size: 16px;
  line-height: 1.5;
}

.toolbar {
  margin-left: 0;
}

/* ===================== HOME ===================== */

.dashboard-actions {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
  margin-left: 0;
}

.dashboard-card {
  min-height: 0;
  padding: 26px 28px;
  grid-template-columns: 64px minmax(0, 1fr) auto 20px;
  gap: 20px;
  border-radius: 16px;
  background: #fff;
  box-shadow: var(--soft-shadow);
  transition: border-color .25s ease, box-shadow .3s ease, transform .35s var(--ad-ease);
}

.dashboard-card:hover {
  border-color: rgba(214, 165, 58, .65);
  box-shadow: var(--shadow);
  transform: translateY(-2px);
}

.dashboard-card:active {
  transform: translateY(0) scale(.99);
}

.dashboard-card .large-icon-tile {
  width: 64px;
  height: 64px;
  border: 0;
  border-radius: 14px;
  background: var(--navy);
  box-shadow: none;
}

.dashboard-card .large-icon-tile svg {
  width: 30px;
  height: 30px;
}

.dashboard-card-title {
  font-family: var(--ad-serif);
  font-size: 34px;
  font-weight: 600;
  line-height: 1;
}

.count-badge {
  min-width: 40px;
  min-height: 34px;
  border-radius: 999px;
  color: #835700;
  font-family: var(--ad-sans);
  font-size: 15px;
  font-weight: 800;
}

.dashboard-arrow {
  color: var(--gold);
  transition: transform .3s var(--ad-ease);
}

.dashboard-card:hover .dashboard-arrow {
  transform: translateX(4px);
}

@media (max-width: 760px) {
  .dashboard-actions {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 420px) {
  .dashboard-card {
    padding: 20px;
    grid-template-columns: 52px minmax(0, 1fr) auto;
    gap: 14px;
  }

  .dashboard-card .large-icon-tile {
    width: 52px;
    height: 52px;
  }

  .dashboard-card-title {
    font-size: 28px;
  }

  .dashboard-arrow {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .dashboard-card,
  .dashboard-card:hover,
  .dashboard-arrow,
  .dashboard-card:hover .dashboard-arrow {
    transform: none;
    transition: none;
  }
}

/* ===================== COMPONENTES COMUNS (botoes, campos, cartoes) =====================
   Publicado junto com CONTA, primeira tela onde aparecem. Valem para todas as telas. */

.primary-button {
  border: 1px solid var(--navy);
  border-radius: 10px;
  background: var(--navy);
  color: #fff;
  box-shadow: none;
  text-decoration: none;
  transition: background-color .2s ease, border-color .2s ease, transform .2s var(--ad-ease), box-shadow .25s ease;
}

.primary-button:hover {
  border-color: var(--navy-soft);
  background: var(--navy-soft);
  box-shadow: 0 8px 18px -10px rgba(10, 31, 78, .55);
}

.primary-button:active,
.secondary-button:active,
.icon-button:active {
  transform: scale(.98);
}

a.primary-button,
a.secondary-button {
  text-decoration: none;
}

.secondary-button {
  border: 1px solid var(--ad-line-strong);
  border-radius: 10px;
  background: #fff;
  color: var(--navy);
  box-shadow: none;
  transition: border-color .2s ease, background-color .2s ease, transform .2s var(--ad-ease);
}

.secondary-button:hover {
  border-color: var(--navy);
  background: #f7f8fb;
}

.icon-button {
  border: 1px solid var(--ad-line);
  border-radius: 10px;
  background: #fff;
  transition: border-color .2s ease, background-color .2s ease;
}

.icon-button:hover {
  border-color: var(--ad-line-strong);
  background: #f7f8fb;
}

:is(.primary-button, .secondary-button, .icon-button):disabled {
  transform: none;
}

input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]),
select,
textarea {
  border-color: var(--ad-line-strong);
  border-radius: 10px;
  color: var(--ink);
  background-color: #fff;
  transition: border-color .2s ease, box-shadow .2s ease;
}

:is(input, select, textarea)::placeholder {
  color: #67718a;
}

:is(input, select, textarea):focus {
  border-color: var(--navy);
  outline: none;
  box-shadow: 0 0 0 3px rgba(214, 165, 58, .32);
}

.form-card {
  border-radius: 16px;
}

.card-heading span {
  border-radius: 12px;
  background: #f1f4f9;
  color: var(--navy);
}

.card-heading h2 {
  color: var(--navy);
}

/* ===================== CONTA ===================== */

.inspection-email-row {
  border-color: var(--ad-line);
  border-radius: 12px;
  background: #fff;
}

.install-device-tabs button {
  border-color: var(--ad-line);
  border-radius: 10px;
  background: #fff;
  transition: border-color .2s ease, background-color .2s ease;
}

.install-device-tabs button:hover {
  border-color: var(--ad-line-strong);
}

.install-device-tabs button.active {
  border-color: var(--navy);
  background: var(--navy);
  color: #fff;
}

@media (min-width: 761px) {
  form.inspection-email-form {
    grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) minmax(0, .8fr) auto;
  }
}

form.inspection-email-form .primary-button {
  min-width: 0;
  padding: 0 18px;
  white-space: nowrap;
}

@media (prefers-reduced-motion: reduce) {
  .primary-button, .secondary-button, .icon-button { transition: none; }
  .primary-button:active, .secondary-button:active, .icon-button:active { transform: none; }
}

/* ===================== CASOS ===================== */

/* O conteudo tinha recuo de 70 px para alinhar com o enfeite do titulo (escondido). */
.search-sort,
.list-card {
  margin-left: 0;
}

.search-input {
  border-radius: 12px;
}

.list-card {
  border-radius: 16px;
}

.panel-heading {
  justify-content: flex-start;
}

.panel-icon {
  border-radius: 12px;
  background: #f1f4f9;
  color: var(--navy);
}

.case-row,
.simple-row,
.ticket-row,
.minute-row {
  border-color: var(--ad-line);
  background: #fff;
  transition: border-color .2s ease, box-shadow .25s ease;
}

.case-row,
.simple-row,
.ticket-row {
  border-radius: 12px;
}

.case-row:hover,
.simple-row:hover,
.ticket-row:hover,
.minute-row:hover {
  border-color: var(--ad-line-strong);
  box-shadow: 0 8px 20px -14px rgba(12, 26, 59, .35);
}

.case-title-line strong {
  color: var(--navy);
  font-weight: 700;
}

.case-metrics {
  color: var(--muted);
}

.process-chip,
.process-switcher-button {
  min-height: 30px;
  border-color: var(--ad-line-strong);
  background: #fff;
  color: var(--navy);
  font-size: 13px;
  font-weight: 700;
  transition: border-color .2s ease, background-color .2s ease, color .2s ease;
}

.process-chip:hover,
.process-switcher-button:hover,
.process-switcher-button.active {
  border-color: var(--navy);
  background: var(--navy);
  color: #fff;
}

.status-pill {
  font-weight: 700;
}

.search-input {
  border-color: var(--ad-line-strong);
  background: #fff;
}

.search-input:focus-within {
  border-color: var(--navy);
  box-shadow: 0 0 0 3px rgba(214, 165, 58, .32);
}

.search-input input,
.search-input input:focus {
  border: 0;
  background: transparent;
  box-shadow: none;
}

/* ===================== ATIVIDADES ===================== */

.activities-page :is(.section-heading, .team-goals-heading) h1 {
  color: var(--navy);
  font-size: clamp(38px, 4vw, 54px);
  line-height: 1.02;
}

.activities-page .section-heading p {
  color: var(--muted);
  font-size: 16px;
}

.activity-back {
  color: var(--navy);
  font-weight: 700;
  transition: color .2s ease;
}

.activity-back:hover {
  color: var(--gold-ink, #8a6210);
}

.activity-eyebrow {
  color: #8a6210;
  letter-spacing: .12em;
}

.activity-section-option,
.activity-case-card {
  border: 1px solid var(--ad-line);
  border-radius: 14px;
  background: #fff;
  box-shadow: var(--soft-shadow);
  transition: border-color .25s ease, box-shadow .3s ease, transform .35s var(--ad-ease);
}

.activity-section-option:hover,
.activity-case-card:hover {
  border-color: rgba(214, 165, 58, .65);
  box-shadow: var(--shadow);
  transform: translateY(-2px);
}

.activity-section-option strong,
.activity-case-card strong {
  color: var(--navy);
}

.activity-case-icon {
  border-radius: 10px;
  background: #f1f4f9;
  color: var(--navy);
}

.activity-case-arrow {
  transition: transform .3s var(--ad-ease);
}

.activity-case-card:hover .activity-case-arrow {
  transform: translateX(3px);
}

@media (prefers-reduced-motion: reduce) {
  .activity-section-option, .activity-case-card, .activity-case-arrow,
  .activity-section-option:hover, .activity-case-card:hover, .activity-case-card:hover .activity-case-arrow {
    transform: none;
    transition: none;
  }
}

/* ===================== MINUTAS ===================== */

/* O topo vira cabecalho de pagina (como nas outras telas), sem cartao centralizado. */
.minutes-hero {
  min-height: 0;
  margin-bottom: 28px;
  padding: 0;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-areas: "title button";
  justify-content: stretch;
  align-items: end;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.minutes-hero .large-icon-tile {
  display: none;
}

.minutes-hero h1 {
  color: var(--navy);
  font-size: clamp(38px, 4vw, 54px);
  line-height: 1.02;
}

.minutes-hero .primary-button {
  justify-self: end;
}

.minutes-card {
  border-radius: 16px;
}

.panel-title-inline h2 {
  color: var(--navy);
}

.panel-title-inline svg {
  color: var(--navy);
}

.sort-control span {
  color: var(--muted);
}

.empty-list-text {
  color: var(--muted);
}

@media (max-width: 700px) {
  .minutes-hero {
    grid-template-columns: 1fr;
    grid-template-areas: "title" "button";
    justify-items: start;
    row-gap: 16px;
  }

  .minutes-hero .primary-button {
    justify-self: start;
  }

  .minutes-hero h1 {
    text-align: left;
  }
}

/* ===================== CARTORIO ===================== */

.cartorio-heading h1,
.cartorio-detail-head h1 {
  font-family: var(--ad-serif);
  font-weight: 600;
  font-size: clamp(38px, 4vw, 54px);
}

.cartorio-kicker {
  color: #8a6210;
  letter-spacing: .12em;
}

.cartorio-panel,
.cartorio-case-card,
.cartorio-metric {
  border-color: var(--ad-line);
  border-radius: 14px;
  background: #fff;
}

.cartorio-case-card {
  transition: border-color .25s ease, box-shadow .3s ease, transform .35s var(--ad-ease);
}

.cartorio-case-card:hover {
  border-color: rgba(214, 165, 58, .65);
  box-shadow: var(--shadow);
  transform: translateY(-2px);
}

/* titulos pequenos em serifa ficavam finos: texto de interface em Manrope */
.cartorio-case-card h2,
.cartorio-panel-head h2,
.cartorio-requirement-head h2 {
  color: var(--navy);
  font-family: var(--ad-sans);
  font-size: 17px;
  font-weight: 700;
  letter-spacing: 0;
}

.cartorio-case-type {
  color: #8a6210;
}

.cartorio-search {
  border-color: var(--ad-line-strong);
  border-radius: 12px;
  background: #fff;
}

.cartorio-search:focus-within {
  border-color: var(--navy);
  box-shadow: 0 0 0 3px rgba(214, 165, 58, .32);
}

.cartorio-search input,
.cartorio-search input:focus {
  border: 0;
  background: transparent;
  box-shadow: none;
}

.cartorio-filter-row button {
  border-color: var(--ad-line-strong);
  background: #fff;
  color: var(--navy);
  font-weight: 700;
  transition: border-color .2s ease, background-color .2s ease, color .2s ease;
}

.cartorio-filter-row button:hover {
  border-color: var(--navy);
}

.cartorio-filter-row button.active {
  border-color: var(--navy);
  background: var(--navy);
  color: #fff;
}

.cartorio-metric strong {
  color: var(--navy);
  font-variant-numeric: tabular-nums;
}

@media (prefers-reduced-motion: reduce) {
  .cartorio-case-card, .cartorio-case-card:hover { transform: none; transition: none; }
}

/* ===================== CHAMADOS e WHATSAPP =====================
   Ja' herdam a camada geral; aqui so' os blocos que ainda tinham fundo creme. */

.whatsapp-status-summary {
  border-color: var(--ad-line);
  border-radius: 12px;
  background: #fff;
}

.whatsapp-status-line .detail-label {
  color: var(--muted);
}

/* ===================== CASO ABERTO (celular) =====================
   Pedido dela 27/10: no celular os botoes passavam da borda e o campo de busca da
   pasta do Drive ficava com largura zero, espremido atras do "Buscar". */

.case-detail-page .detail-card {
  background: #fff;
}

@media (max-width: 700px) {
  .case-detail-page .drive-link-controls {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }

  .case-detail-page .drive-link-controls > .search-input {
    grid-column: 1 / -1;
  }

  .case-detail-page .drive-link-controls > :is(.primary-button, .secondary-button) {
    width: 100%;
    min-width: 0;
    padding-inline: 12px;
  }
}

@media (max-width: 560px) {
  /* botoes de texto do caso: largura inteira e alinhados, nunca alem da borda */
  .case-detail-page :is(.primary-button, .secondary-button) {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    white-space: normal;
    text-align: center;
  }

  .case-detail-page .case-detail-action {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    justify-items: stretch;
  }

  .case-detail-page .case-title-actions {
    width: 100%;
  }

  .case-detail-page .inline-actions {
    gap: 10px;
  }
}

/* =====================================================================
   V2 - 07/11/2026 (Claude). Pedido: "mais elegante e dinamico, outro ar".
   Faixa azul-marinho de ponta a ponta no topo de cada tela (como na area do
   cliente), cartoes com profundidade e brilho que segue o mouse, entradas
   suaves (admin-experience.js) e protecao contra texto estourando no celular.
   ===================================================================== */

:root {
  --ad-band-top: 64px;
  --font-heading: var(--ad-serif);
}

/* margem do topo fixa nos dois tamanhos, para a faixa encostar no cabecalho */
.content-frame {
  padding-top: var(--ad-band-top);
}

/* o simbolo cinza grande do fundo da lugar a marca dagua dentro da faixa */
.background-mark {
  display: none;
}

.app-main {
  background:
    radial-gradient(1200px 520px at 50% -180px, rgba(24, 60, 134, .06), transparent 70%),
    var(--ad-ground);
}

/* ---------- faixa do topo de cada tela ---------- */

.content-frame > * > :is(.page-title, .team-directory-heading, .section-heading, .team-goals-heading,
  .minutes-hero, .cartorio-heading, .judicial-heading, .tickets-page-header):first-child,
.content-frame > .activities-page > .activity-back:first-child + :is(.section-heading, .team-goals-heading) {
  position: relative;
  isolation: isolate;
  margin-top: calc(-1 * var(--ad-band-top));
  margin-bottom: 34px;
  padding-top: 58px;
  padding-bottom: 46px;
  color: #fff;
  background-color: var(--navy);
  box-shadow: 0 0 0 100vmax var(--navy);
  clip-path: inset(0 -100vmax);
}

/* Atividades internas: o "voltar" entra na faixa, logo acima do titulo */
.content-frame > .activities-page > .activity-back:first-child {
  position: relative;
  z-index: 1;
  margin-top: calc(-1 * var(--ad-band-top));
  padding-top: 30px;
  padding-bottom: 6px;
  color: var(--gold-bright);
  background-color: var(--navy);
  box-shadow: 0 0 0 100vmax var(--navy);
  clip-path: inset(0 -100vmax);
}

.content-frame > .activities-page > .activity-back:first-child + :is(.section-heading, .team-goals-heading) {
  margin-top: 0;
  padding-top: 14px;
}

/* marca dagua do simbolo, bem discreta, a direita da faixa */
.content-frame > * > :is(.page-title, .team-directory-heading, .section-heading, .team-goals-heading,
  .minutes-hero, .cartorio-heading, .judicial-heading, .tickets-page-header):first-child::after,
.content-frame > .activities-page > .activity-back:first-child + :is(.section-heading, .team-goals-heading)::after {
  content: "";
  position: absolute;
  z-index: -1;
  right: calc((100% - 100vw) / 2 + 48px);
  bottom: -110px;
  width: 340px;
  height: 320px;
  background: url("/ad-simbolo.png") center / contain no-repeat;
  opacity: .055;
  pointer-events: none;
}

/* textos dentro da faixa */
.content-frame > * > :first-child :is(h1, h2),
.content-frame > .activities-page > :is(.section-heading, .team-goals-heading) h1 {
  color: #fff;
}

.content-frame > * > :is(.page-title, .team-directory-heading, .section-heading, .team-goals-heading,
  .minutes-hero, .cartorio-heading, .judicial-heading, .tickets-page-header):first-child :is(p, small, .judicial-total),
.content-frame > .activities-page > :is(.section-heading, .team-goals-heading) p {
  color: rgba(255, 255, 255, .74);
}

.content-frame > * > :first-child :is(.eyebrow, .judicial-kicker, .cartorio-kicker, .activity-eyebrow) {
  color: var(--gold-bright);
  letter-spacing: .14em;
  text-transform: uppercase;
  font-size: 12px;
  font-weight: 700;
}

.content-frame > * > .team-directory-heading:first-child > svg {
  color: var(--gold-bright);
}

.team-directory-heading h1,
.judicial-heading h1 {
  font-family: var(--ad-serif);
  font-weight: 600;
  line-height: 1.02;
}

.content-frame > * > :first-child h1 {
  font-size: clamp(38px, 4.2vw, 58px);
  letter-spacing: -.01em;
  text-wrap: balance;
}

/* botoes dentro da faixa */
.content-frame > * > :first-child .secondary-button {
  border-color: rgba(255, 255, 255, .35);
  color: #fff;
  background: rgba(255, 255, 255, .06);
}

.content-frame > * > :first-child .secondary-button:hover {
  border-color: var(--gold-bright);
  color: var(--gold-bright);
  background: rgba(255, 255, 255, .1);
}

.content-frame > * > :first-child .primary-button:not(.active-pause) {
  border-color: var(--gold);
  color: var(--navy);
  background: var(--gold-bright);
}

.content-frame > * > :first-child .primary-button:not(.active-pause):hover {
  background: #f3d48a;
  box-shadow: 0 10px 24px -12px rgba(236, 197, 107, .8);
}

/* ---------- cartoes: profundidade e brilho dourado que segue o mouse ---------- */

:is(.dashboard-card, .activity-section-option, .activity-case-card, .cartorio-case-card, .judicial-case-row,
  .case-row, .ticket-row, .minute-row, .team-directory-row):hover {
  background-image: radial-gradient(260px circle at var(--mx, 50%) var(--my, 0%), rgba(236, 197, 107, .14), transparent 62%);
}

.form-card,
.list-card,
.detail-card,
.cartorio-panel {
  border: 1px solid var(--ad-line);
  box-shadow: 0 1px 2px rgba(12, 26, 59, .04), 0 22px 44px -30px rgba(12, 26, 59, .35);
}

.dashboard-card .large-icon-tile,
.activity-case-icon,
.judicial-case-symbol,
.team-directory-avatar,
.panel-icon,
.card-heading span {
  transition: transform .45s var(--ad-ease), background-color .3s ease, color .3s ease;
}

:is(.dashboard-card, .activity-case-card, .judicial-case-row, .team-directory-row):hover
  :is(.large-icon-tile, .activity-case-icon, .judicial-case-symbol, .team-directory-avatar) {
  transform: translateY(-2px) rotate(-4deg) scale(1.04);
}

/* ---------- Processos (judicial) ---------- */

.judicial-page .judicial-case-row {
  border: 1px solid var(--ad-line);
  border-radius: 16px;
  background-color: #fff;
  box-shadow: var(--soft-shadow);
  transition: border-color .25s ease, box-shadow .3s ease, transform .35s var(--ad-ease);
}

.judicial-page .judicial-case-row:hover {
  border-color: rgba(214, 165, 58, .65);
  background-color: #fff;
  background-image: radial-gradient(260px circle at var(--mx, 50%) var(--my, 0%), rgba(236, 197, 107, .14), transparent 62%);
  box-shadow: var(--shadow);
  transform: translateY(-3px);
}

.judicial-page .judicial-case-name strong {
  color: var(--navy);
  font-family: var(--ad-serif);
  font-size: 24px;
  font-weight: 600;
  line-height: 1.15;
}

.judicial-page .judicial-case-symbol {
  border-radius: 10px;
  background: var(--navy);
  color: var(--gold-bright);
}

.judicial-card-type {
  color: #8a6210;
  font-weight: 700;
  letter-spacing: .04em;
}

.judicial-tabs button {
  font-weight: 700;
  transition: color .2s ease;
}

.judicial-search,
.team-directory-search {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 48px;
  padding: 0 14px;
  border: 1px solid var(--ad-line-strong);
  border-radius: 12px;
  background: #fff;
  transition: border-color .2s ease, box-shadow .2s ease;
}

.team-directory-search {
  max-width: 520px;
  margin-bottom: 18px;
}

:is(.judicial-search, .team-directory-search):focus-within {
  border-color: var(--navy);
  box-shadow: 0 0 0 3px rgba(214, 165, 58, .32);
}

:is(.judicial-search, .team-directory-search) input,
:is(.judicial-search, .team-directory-search) input:focus {
  flex: 1 1 auto;
  min-width: 0;
  border: 0;
  outline: none;
  background: transparent;
  box-shadow: none;
}

/* ---------- Equipe ---------- */

.team-directory-list {
  border: 1px solid var(--ad-line);
  border-radius: 16px;
  background: #fff;
  box-shadow: var(--soft-shadow);
  overflow: hidden;
}

.team-directory-row {
  padding: 16px 20px;
  border-color: var(--ad-line);
  transition: background-color .2s ease;
}

.team-directory-avatar {
  border-radius: 12px;
  background: var(--navy);
  color: var(--gold-bright);
}

.team-directory-person strong {
  color: var(--navy);
}

/* ---------- menu Servicos: itens entram em sequencia ---------- */

.services-menu-panel {
  border-bottom: 1px solid rgba(214, 165, 58, .45);
  background: #fff;
  box-shadow: 0 30px 60px -30px rgba(10, 31, 78, .45);
}

.services-menu-inner :is(a, button):not(.services-menu-close) {
  border-radius: 12px;
  transition: background-color .2s ease, color .2s ease, transform .3s var(--ad-ease);
}

.services-menu-inner :is(a, button):not(.services-menu-close):hover {
  color: var(--navy);
  background: #f3f5f9;
  transform: translateX(3px);
}

@media (prefers-reduced-motion: no-preference) {
  .services-menu-inner :is(a, button):not(.services-menu-close) {
    animation: ad-rise .5s var(--ad-ease) both;
  }

  /* titulo de cada tela entra com elegancia */
  .content-frame > * > :first-child h1 {
    animation: ad-title .8s var(--ad-ease) both;
  }
}

@keyframes ad-rise {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: none; }
}

@keyframes ad-title {
  from { opacity: 0; transform: translateY(12px); }
  to { opacity: 1; transform: none; }
}

/* entradas controladas pelo admin-experience.js (nada fica escondido sem ele) */
.ax-on [data-ax="hide"] {
  opacity: 0;
  transform: translate3d(0, 16px, 0);
}

.ax-on [data-ax="in"] {
  opacity: 1;
  transform: none;
  transition: opacity .6s var(--ad-ease) var(--ax-delay, 0ms), transform .8s var(--ad-ease) var(--ax-delay, 0ms);
}

.topbar {
  transition: box-shadow .3s ease;
}

.ax-scrolled .topbar {
  box-shadow: 0 10px 30px -14px rgba(10, 31, 78, .7);
}

/* ---------- celular: nada de texto maior que a caixa ---------- */

.content-frame :is(h1, h2, h3, h4, p, strong, small, span, a, button, label, li, dd, dt, td) {
  overflow-wrap: break-word;
}

@media (max-width: 760px) {
  :root {
    --ad-band-top: 28px;
  }

  .content-frame :is(h1, h2, h3, h4, p, strong, small, span, a, button, label, li, dd, dt, td) {
    overflow-wrap: anywhere;
  }

  .content-frame :is(.primary-button, .secondary-button) {
    min-width: 0;
    max-width: 100%;
    height: auto;
    min-height: 44px;
    white-space: normal;
    text-align: center;
    line-height: 1.25;
    padding-block: 10px;
  }

  .content-frame :is(input, select, textarea) {
    max-width: 100%;
  }

  .content-frame > * > :is(.page-title, .team-directory-heading, .section-heading, .team-goals-heading,
    .minutes-hero, .cartorio-heading, .judicial-heading, .tickets-page-header):first-child,
  .content-frame > .activities-page > .activity-back:first-child + :is(.section-heading, .team-goals-heading) {
    padding-top: 34px;
    padding-bottom: 32px;
    margin-bottom: 24px;
  }

  .content-frame > * > :first-child h1 {
    font-size: clamp(34px, 9.5vw, 44px);
  }

  .content-frame > * > :first-child::after {
    width: 220px;
    height: 210px;
    right: -60px;
    bottom: -80px;
  }

  /* filtros do Cartorio quebram linha em vez de sair da tela */
  .cartorio-filter-row {
    flex-wrap: wrap;
    overflow: visible;
  }

  .judicial-page .judicial-case-name strong {
    font-size: 21px;
  }

  /* o simbolo fica proximo da borda direita tambem no celular */
  .content-frame > * > :first-child::after {
    right: calc((100% - 100vw) / 2 - 40px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .judicial-case-row, .judicial-case-row:hover,
  :is(.dashboard-card, .activity-case-card, .judicial-case-row, .team-directory-row):hover
    :is(.large-icon-tile, .activity-case-icon, .judicial-case-symbol, .team-directory-avatar),
  .services-menu-inner :is(a, button):hover {
    transform: none;
    transition: none;
  }
}

/* Home e Atividades: os cartoes sobem sobre a faixa azul (como na area do cliente) */
.dashboard-page > .page-title:first-child,
.activities-page > .section-heading:first-child {
  padding-bottom: 96px;
}

.dashboard-page > .page-title:first-child + .dashboard-actions,
.activities-page > .section-heading:first-child + .activity-section-list {
  position: relative;
  z-index: 1;
  margin-top: -88px;
}

@media (max-width: 760px) {
  .dashboard-page > .page-title:first-child,
  .activities-page > .section-heading:first-child {
    padding-bottom: 74px;
  }

  .dashboard-page > .page-title:first-child + .dashboard-actions,
  .activities-page > .section-heading:first-child + .activity-section-list {
    margin-top: -66px;
  }
}

.content-frame > .activities-page {
  padding-top: 0;
}

.content-frame > .activities-page > .activity-back:first-child {
  display: flex;
  width: fit-content;
  margin-bottom: 0;
}

.content-frame > .activities-page > .activity-back:first-child + :is(.section-heading, .team-goals-heading) :is(.activity-eyebrow, .eyebrow) {
  color: var(--gold-bright);
  letter-spacing: .14em;
  text-transform: uppercase;
  font-size: 12px;
  font-weight: 700;
}

.content-frame > .activities-page > .activity-back:first-child + .team-goals-heading :is(button:not(.primary-button):not(.secondary-button)) {
  color: #fff;
}

/* =====================================================================
   TABLET - 07/11/2026 (Claude). Ate 1180px o styles.css ainda reserva 58px
   a esquerda para a antiga barra lateral; com o menu no topo
   (.compact-services-nav) essa barra nao existe mais e a tela ficava
   "jogada para a direita". Zera so' quando o menu novo esta presente.
   ===================================================================== */
@media (max-width: 1180px) {
  .app:has(.compact-services-nav) > .app-main {
    margin-left: 0;
  }

  body:has(.compact-services-nav) .cartorio-modal-backdrop {
    left: 0;
  }
}
