@font-face {
  font-family: Manrope;
  src: url("assets/Manrope.ttf") format("truetype");
  font-weight: 200 800;
  font-display: swap;
}
@font-face {
  font-family: Spectral;
  src: url("assets/Spectral-Medium.ttf") format("truetype");
  font-weight: 500;
  font-display: swap;
}
@font-face {
  font-family: Spectral;
  src: url("assets/Spectral-SemiBold.ttf") format("truetype");
  font-weight: 600;
  font-display: swap;
}

:root {
  color-scheme: light;
  --bg: #f8f3e8;
  --paper: #fffdf8;
  --ink: #2a2330;
  --green: #542f79;
  --muted: #716a62;
  --line: #e6ddc9;
  --theme-text: var(--ink);
  --theme-surface: var(--paper);
  --theme-soft: #f2eaf8;
  --theme-focus: #8752b4;
  --jurie-action: #542f79;
  --jurie-hover: #40225e;
  --jurie-seal: #7a2638;
  --jurie-seal-soft: #f5e6e4;
}
html[data-theme=dark] {
  color-scheme: dark;
  --bg: #241e21;
  --paper: #2f262a;
  --ink: #f2e9e6;
  --green: #dfbbff;
  --muted: #b9aaa6;
  --line: #473b3c;
  --theme-text: var(--ink);
  --theme-surface: var(--paper);
  --theme-soft: #3a2e33;
  --theme-focus: #cda1f0;
  --jurie-action: #6b4d7e;
  --jurie-hover: #7d5d90;
  --jurie-seal: #d99a9e;
  --jurie-seal-soft: #3d2a2c;
}
body { color: var(--ink); }
.jurie-brand img { width: 112px; height: auto; }
.jurie-brand .jurie-dark, [data-theme=dark] .jurie-brand .jurie-light { display: none; }
html[data-theme=dark] .jurie-brand .jurie-dark { display: block; filter: none; }
body :is(button, input, textarea, select, summary, a):focus-visible {
  outline: 3px solid var(--theme-focus);
  outline-offset: 3px;
}

body:has(aside .jurie-brand) aside { background: var(--paper); border-color: var(--line); }
body:has(aside .jurie-brand) h1 { font-family: Spectral, Georgia, serif; font-weight: 600; letter-spacing: -.01em; }
body:has(aside .jurie-brand) :is(h2, dialog h2) { font-family: Spectral, Georgia, serif; font-weight: 500; }
body:has(aside .jurie-brand) :is(.panel, .integration, .quick, .stat, .weekday, .startGuide) { border-radius: 8px; }
body:has(aside .jurie-brand) .notice { color: var(--muted); }
body:has(aside .jurie-brand) nav button.active,
body:has(aside .jurie-brand) .primary {
  background: var(--jurie-action);
  border-color: transparent;
  color: white;
}
/* Botões e campos comuns herdam fundo branco fixo do CSS base — no escuro isso apaga o texto (quase branco em branco) */
html[data-theme=dark] body:has(aside .jurie-brand) :is(button, input, select, textarea) {
  background-color: var(--paper);
  color: var(--ink);
  border-color: var(--line);
}
html[data-theme=dark] body:has(aside .jurie-brand) :is(input, textarea)::placeholder { color: var(--muted); opacity: 1; }
html[data-theme=dark] body:has(aside .jurie-brand) :is(.actions, #clientSearch, #clientsList) {
  background: var(--paper);
  color: var(--ink);
}
html[data-theme=dark] body :is(.primary, nav button.active, .filters button.selected:not(.contextFilter), #toast) {
  background: var(--jurie-action) !important;
  border-color: transparent !important;
  color: white !important;
}
html[data-theme=dark] body :is(.primary:hover, nav button.active:hover) { background: var(--jurie-hover) !important; }
html[data-theme=dark] body nav button:not(.active):hover { background: var(--theme-soft) !important; }
html[data-theme=dark] body aside .themeModes button[aria-pressed=true],
html[data-theme=dark] .jurie-login .themeModes button[aria-pressed=true] {
  background: var(--theme-soft) !important;
  color: var(--theme-focus) !important;
}
@media (max-width: 760px) {
  aside .jurie-brand img { width: 93px; }
  body:has(aside .jurie-brand) nav { background: var(--paper); border-color: var(--line); }
}

nav .nav-icon { width: 17px; height: 17px; vertical-align: -.23em; margin-right: .45em; }
body:has(aside .jurie-brand) .notice {
  background: transparent;
  margin-top: 10px;
  border-radius: 0;
}
body:has(aside .jurie-brand) .dailySummaryGrid {
  gap: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--paper);
}
body:has(aside .jurie-brand) .dailySummaryGrid button {
  background: transparent;
  border: 0;
  border-radius: 0;
  min-height: 92px;
  padding: 14px 16px;
}
body:has(aside .jurie-brand) .dailySummaryGrid button + button { border-left: 1px solid var(--line); }
body:has(aside .jurie-brand) .dailySummaryGrid button:hover { background: var(--theme-soft); }
body:has(aside .jurie-brand) .dailySummaryGrid button.dailyUrgent {
  box-shadow: inset 3px 0 #a75234;
}
html[data-theme=dark] body:has(aside .jurie-brand) .dailySummaryGrid button:not(.dailyUrgent):not(:hover) {
  background: transparent !important;
}
@media (max-width: 600px) {
  body:has(aside .jurie-brand) .dailySummaryGrid { grid-template-columns: 1fr; }
  body:has(aside .jurie-brand) .dailySummaryGrid button { min-height: 0; }
  body:has(aside .jurie-brand) .dailySummaryGrid button + button {
    border-left: 0;
    border-top: 1px solid var(--line);
  }
}
body .themeModes button[aria-pressed=true] {
  background: var(--theme-soft);
  color: var(--jurie-action);
}
/* Controle de Aparência (claro/escuro/sistema) — mesmo script do login, estilo próprio do app principal */
.themeControl{ margin: 0 0 20px; }
.themeControl label{ font-size: 11px; color: var(--muted); margin: 0 0 6px; display: block; }
.themeControl select[hidden]{ display: none !important; }
.themeNote{ position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.themeModes{ display: flex; gap: 3px; padding: 3px; border: 1px solid var(--line); border-radius: 24px; background: var(--paper); width: max-content; }
.themeModes button{ display: grid; place-items: center; width: 32px; height: 32px; padding: 0; border: 0; border-radius: 50%; background: transparent; color: var(--muted); cursor: pointer; }
.themeModes button:hover{ background: var(--theme-soft); }
@media (max-width: 760px){
  aside:has(.themeControl){ display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap; }
  aside .jurie-brand:has(+ .themeControl){ margin: 0; }
  aside .themeControl{ margin: 0; }
}
@media (max-width: 760px) {
  nav .nav-icon { width: 15px; height: 15px; margin-right: .3em; }
}

#localSyncStatus {
  margin: 14px 0 0;
  color: var(--muted);
  font: 12px/1.5 Inter, system-ui, sans-serif;
  overflow-wrap: anywhere;
}
html[data-theme=dark] body:has(aside .jurie-brand) .notice {
  background: transparent !important;
  color: var(--muted) !important;
}
@media (min-width: 761px) {
  body:has(aside .jurie-brand) aside { overflow-y: auto; }
  body:has(aside .jurie-brand) nav button.active {
    background: var(--theme-soft);
    color: var(--jurie-action);
    box-shadow: inset 3px 0 var(--jurie-action);
  }
  html[data-theme=dark] body:has(aside .jurie-brand) nav button.active {
    background: var(--theme-soft) !important;
    color: var(--theme-focus) !important;
    box-shadow: inset 3px 0 var(--theme-focus);
  }
}

body:has(aside .jurie-brand) #firstTaskHero {
  background: color-mix(in srgb, var(--theme-soft) 62%, var(--paper));
  border: 1px solid var(--line);
  border-radius: 14px;
}
html[data-theme=dark] body:has(aside .jurie-brand) #firstTaskHero {
  background: color-mix(in srgb, var(--theme-soft) 62%, var(--paper)) !important;
}
.firstTaskHelp { margin: 16px 0 0; }
.firstTaskHelp summary {
  color: var(--green);
  cursor: pointer;
  font-size: 14px;
  font-weight: 700;
  padding: 8px 0;
}
.firstTaskHelp ul { padding-inline-start: 20px; margin: 6px 0 16px; }
.firstTaskHelp li + li { margin-top: 6px; }

.documentFollowupActions{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.documentFollowupActions button{min-height:44px;text-align:left}
.dailyDocumentFollowups{margin:18px 0}
.documentFollowupRow{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 16px;padding:12px 0;border-top:1px solid var(--line);overflow-wrap:anywhere}
.documentFollowupRow .helper,.documentFollowupRow .documentFollowupActions{margin:0}
.dailyDocumentFollowups summary{cursor:pointer;padding:12px 0}

.djen-dialog{width:min(720px,calc(100% - 24px));max-height:calc(100dvh - 28px);overflow:auto}
.djen-dialog .panelhead,.djen-pages{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.djen-dialog h2,.djen-dialog h3{margin:0}
#djenSearchForm{
  display:grid;
  grid-template-columns:minmax(12rem, 1fr) minmax(13rem, 2fr) auto;
  gap:16px;
  align-items:end;
  margin-top:24px;
}
#djenSearchForm label{display:grid;gap:8px;min-width:0;margin:0}
body:has(aside .jurie-brand) #djenSearchForm :is(input,select,button){
  min-width:0;
  width:100%;
  min-height:46px;
}
body:has(aside .jurie-brand) #djenSearchForm :is(input,select){padding-inline:14px}
body:has(aside .jurie-brand) #djenSearchForm select{padding-inline-end:38px}
@media(max-width:1000px){
  #djenSearchForm{grid-template-columns:minmax(0,1fr)}
  #djenSearchForm button{justify-self:start}
}
.djen-publication{padding:16px 0;border-top:1px solid var(--line);overflow-wrap:anywhere}
.djen-publication details{margin:10px 0}
.djen-publication details p{white-space:pre-wrap;line-height:1.5;max-height:35dvh;overflow:auto}
.djen-pages[hidden]{display:none}
.djen-source{margin:10px 0}
#djenConfirmation input{width:auto;margin-right:6px}

/* ---- Uma mesa de trabalho, não um kit de cards ---- */
:root{
  --jurie-gold: #a9793a;
  --jurie-gold-soft: #f3e8d6;
}
html[data-theme=dark]{
  --jurie-gold: #d9ad6e;
  --jurie-gold-soft: #3a2f1c;
}
body:has(aside .jurie-brand){ background: var(--bg); }
body:has(aside .jurie-brand) main{ background: transparent; }

/* Painéis de conteúdo: papel macio sobre a mesa, não pranchas rígidas */
body:has(aside .jurie-brand) :is(.panel, .integration, .weekday, .stat){
  border: 1px solid var(--line);
  background: var(--paper);
  border-radius: 16px;
  box-shadow: 0 1px 2px rgba(42,35,48,.035);
}
body:has(aside .jurie-brand) dialog{
  background: var(--paper);
  color: var(--ink);
  box-shadow: -8px 0 24px -12px rgba(42,35,48,.22);
  border-left: 1px solid var(--line);
  border-radius: 20px 0 0 20px;
}
body:has(aside .jurie-brand) .quick{
  box-shadow: 0 1px 0 var(--line);
}

/* Botões: generosos e convidativos, não quadrados de formulário */
body:has(aside .jurie-brand) button{
  border-radius: 10px;
  font-weight: 600;
  transition: transform .12s ease, box-shadow .12s ease, background-color .15s ease, border-color .15s ease;
}
body:has(aside .jurie-brand) button:active{ transform: translateY(1px); }
body:has(aside .jurie-brand) .primary{
  box-shadow: 0 1px 0 rgba(0,0,0,.08) inset, 0 10px 20px -10px rgba(84,47,121,.5);
  border-radius: 12px;
}
body:has(aside .jurie-brand) .primary:hover{
  background: var(--jurie-hover);
  box-shadow: 0 1px 0 rgba(0,0,0,.08) inset, 0 14px 24px -10px rgba(84,47,121,.55);
}
body:has(aside .jurie-brand) button:not(.primary):not(.selected):not(.active):hover{
  border-color: color-mix(in srgb, var(--jurie-action) 40%, var(--line));
  color: var(--jurie-action);
}
body:has(aside .jurie-brand) :is(.filters button.selected, nav button.active):hover{
  background: var(--jurie-hover);
  color: #fff;
}
body:has(aside .jurie-brand) :is(.tag, .filters button, .weekevent){ border-radius: 8px; }

/* O contexto vira um ponto discreto, não uma barra colorida grossa */
body:has(aside .jurie-brand) .event, body:has(aside .jurie-brand) .weekevent, body:has(aside .jurie-brand) .task{
  border-left: 0 !important;
  padding-left: 0 !important;
  position: relative;
}
body:has(aside .jurie-brand) .eventbody{ border-left: 0 !important; padding-left: 4px; position: relative; }
body:has(aside .jurie-brand) :is(.eventbody, .weekevent)::before{
  content: "";
  position: absolute; left: -2px; top: 6px;
  width: 7px; height: 7px; border-radius: 50%;
  background: var(--context, var(--jurie-action));
}
body:has(aside .jurie-brand) .weekevent{ padding-left: 20px; }
body:has(aside .jurie-brand) .weekevent::before{ left: 10px; top: 13px; }
/* Na lista de tarefas, o contexto tinge a própria caixa de marcar */
body:has(aside .jurie-brand) .task input[type=checkbox]{ accent-color: var(--context, var(--jurie-action)); }

/* No escuro, essas mesclas usavam "white" fixo (brand.css) e viravam manchas claras */
html[data-theme=dark] body:has(aside .jurie-brand) :is(.event .eventbody, .event .eventbody.office, .event .tag, .event .tag.office, .weekevent, .weekevent.office){
  background: color-mix(in srgb, var(--context, var(--jurie-action)) 16%, var(--paper));
}

/* Particular lê em bordô (ver app.js, contextColor) — o roxo fica reservado à ação */

/* ---- Um começo de dia, não uma planilha: hero quente + ordem por importância ---- */
body:has(aside .jurie-brand) header.top{
  background: linear-gradient(135deg, color-mix(in srgb, var(--jurie-seal-soft) 70%, var(--paper)) 0%, var(--paper) 65%);
  border: 1px solid var(--line);
  border-radius: 20px;
  padding: 28px 32px;
  margin-bottom: 18px;
}
body:has(aside .jurie-brand) .notice{ margin: 4px 0 20px; }
body:has(aside .jurie-brand) #workspace{ display: flex; flex-direction: column; }
body:has(aside .jurie-brand) .daylabel{
  order: 1;
  font-family: Spectral, Georgia, serif;
  font-size: 26px;
  font-weight: 500;
  color: var(--ink);
  margin: 4px 0 2px;
}
body:has(aside .jurie-brand) .date{ order: 2; margin: 0 0 22px; align-items: center; }
/* O texto grande já diz a data por extenso — o input nativo vira só um controle quieto de troca, não uma 2ª legenda */
body:has(aside .jurie-brand) .date input{
  background: transparent;
  border: 0;
  color: var(--muted);
  font-size: 13px;
  width: auto;
  padding: 10px 6px;
}
body:has(aside .jurie-brand) .quick{
  order: 3;
  border-radius: 16px;
  padding: 10px 10px 10px 20px;
  background: var(--paper);
  border: 1px solid color-mix(in srgb, var(--jurie-action) 22%, var(--line));
}
body:has(aside .jurie-brand) .quick input{ font-size: 15px; }
body:has(aside .jurie-brand) .quick .primary{ border-radius: 11px; }
body:has(aside .jurie-brand) .filters{ order: 4; margin: 18px 0 22px; }
body:has(aside .jurie-brand) .searchbar{
  order: 5;
  margin: 0 0 22px;
}
body:has(aside .jurie-brand) .searchbar > input{
  background: transparent;
  border: 0;
  border-bottom: 1px solid var(--line);
  border-radius: 0;
  padding: 8px 2px;
  font-size: 13px;
  color: var(--ink);
}
body:has(aside .jurie-brand) .searchbar > input::placeholder{ color: var(--muted); }
/* Os filtros de tarefas (Status/De/Até) ficavam com caixa cheia ao lado de uma busca já discreta */
body:has(aside .jurie-brand) #taskFilters{ margin-top: 10px; }
body:has(aside .jurie-brand) #taskFilters input,
body:has(aside .jurie-brand) #taskFilters select{
  background-color: transparent;
  border: 0;
  border-bottom: 1px solid var(--line);
  border-radius: 0;
  padding: 6px 2px;
  font-size: 13px;
  color: var(--ink);
}
body:has(aside .jurie-brand) #taskFilters select{
  padding-right: 22px;
  background-repeat: no-repeat;
  background-position: right 2px center;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path d='M4 6l4 4 4-4' fill='none' stroke='%23716a62' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/></svg>");
}
body:has(aside .jurie-brand) #clearSearch{ border: 0; background: transparent; color: var(--jurie-action); font-size: 13px; padding: 6px 2px; }
body:has(aside .jurie-brand) #clearSearch:hover{ text-decoration: underline; }
body:has(aside .jurie-brand) .searchbar > input:focus-visible{ border-bottom-color: var(--jurie-action); }
body:has(aside .jurie-brand) .searchbar label{
  font-size: 11px;
  color: var(--muted);
}
body:has(aside .jurie-brand) #weekPanel{ order: 6; }
body:has(aside .jurie-brand) .layout{ order: 6; }

/* Um único momento de movimento: a gaveta de nova atividade abre com leveza */
body:has(aside .jurie-brand) dialog{
  transition: transform .28s cubic-bezier(.2,.8,.2,1), opacity .22s ease, overlay .28s allow-discrete, display .28s allow-discrete;
  transform: translateX(0); opacity: 1;
}
@starting-style{
  body:has(aside .jurie-brand) dialog[open]{ transform: translateX(16px); opacity: 0; }
}
body:has(aside .jurie-brand) dialog::backdrop{
  transition: opacity .28s ease;
  opacity: 1;
}
@starting-style{
  body:has(aside .jurie-brand) dialog[open]::backdrop{ opacity: 0; }
}
@media (prefers-reduced-motion: reduce){
  body:has(aside .jurie-brand) button, body:has(aside .jurie-brand) dialog, body:has(aside .jurie-brand) dialog::backdrop{
    transition: none !important;
  }
}

/* O dia de hoje ganha um selo dourado — reservado só para "isto importa agora" */
body:has(aside .jurie-brand) .weekday.current{
  border-color: color-mix(in srgb, var(--jurie-gold) 55%, var(--line));
  background: color-mix(in srgb, var(--jurie-gold-soft) 55%, var(--paper));
  box-shadow: var(--shadow-1), 0 0 0 1px color-mix(in srgb, var(--jurie-gold) 45%, transparent);
}
body:has(aside .jurie-brand) .weekday.current header{ color: color-mix(in srgb, var(--jurie-gold) 70%, var(--ink)); font-weight: 700; }

/* Estados vazios: uma marca quieta em vez de texto nu */
body:has(aside .jurie-brand) :is(.empty, p.empty){
  display: flex; flex-direction: column; align-items: center; gap: 10px;
  text-align: center; padding: 38px 20px; color: var(--muted);
}
body:has(aside .jurie-brand) :is(.empty, p.empty)::before{
  content: "";
  width: 34px; height: 34px; border-radius: 50%;
  border: 1.5px solid color-mix(in srgb, var(--jurie-action) 35%, var(--line));
  background: radial-gradient(circle at 35% 35%, color-mix(in srgb, var(--jurie-action) 14%, transparent), transparent 70%);
}

/* ---- Modal: campos por sentido, não uma lista única de formulário ---- */
body:has(aside .jurie-brand) .fieldGroup{
  margin-top: 24px;
  padding-top: 18px;
  border-top: 1px solid var(--line);
}
body:has(aside .jurie-brand) .fieldGroup > label:first-of-type,
body:has(aside .jurie-brand) .fieldGroup-2col > div > label{ margin-top: 0; }
body:has(aside .jurie-brand) .fieldGroupLabel{
  margin: 0 0 10px;
  font-size: 12px;
  font-weight: 600;
  color: var(--muted);
}
body:has(aside .jurie-brand) .fieldGroup-2col{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
body:has(aside .jurie-brand) .fieldGroup-2col > .fieldGroupLabel{ grid-column: 1 / -1; }

/* O mesmo rótulo de grupo discreto do modal, agora separando conjuntos de cartões em Configurações */
body:has(aside .jurie-brand) .sectionLabel{
  font-family: Manrope, sans-serif;
  font-size: 12px;
  font-weight: 600;
  color: var(--muted);
  margin: 28px 0 -6px;
  padding-top: 18px;
  border-top: 1px solid var(--line);
}

/* Precisão: dígitos de largura fixa onde números precisam alinhar, como em produto financeiro/jurídico sério */
body:has(aside .jurie-brand) :is(.daylabel, .date input, .weekday header strong, .stat b, input[type=date], input[type=time], .sub, .helper){
  font-variant-numeric: tabular-nums;
}
body:has(aside .jurie-brand) #repeatSection{
  display: block;
  margin-top: 24px;
  padding-top: 18px;
  border-top: 1px solid var(--line);
}
body:has(aside .jurie-brand) #repeatSection > label:first-of-type{ margin-top: 0; }

/* Ícones do menu: um traço um pouco mais confiante, menos genérico */
body:has(aside .jurie-brand) .nav-icon{ width: 19px; height: 19px; }
body:has(aside .jurie-brand) nav button{ padding: 11px 10px; gap: 2px; }

/* Respiro entre a busca discreta e o conteúdo principal */
body:has(aside .jurie-brand) .searchbar{ margin-bottom: 30px; }

/* A captura rápida não cabia inteira ao lado do botão em telas estreitas */
body:has(aside .jurie-brand) .quick input{ text-overflow: ellipsis; }
@media (max-width: 640px) {
  body:has(aside .jurie-brand) .quick{ flex-direction: column; align-items: stretch; padding: 12px; }
  body:has(aside .jurie-brand) .quick input{ padding: 13px 4px; }
  body:has(aside .jurie-brand) .quick .primary{ width: 100%; justify-content: center; }
}

/* ---- Erros: uma única voz, visível e da marca, não o laranja esquecido ---- */
body:has(aside .jurie-brand) :is(#formError, #officeError, #clientError, #planError, #availabilityError):not(:empty){
  background: var(--jurie-seal-soft);
  color: var(--jurie-seal);
  padding: 10px 14px;
  border-radius: 8px;
  font-size: 13px;
  margin-top: 10px;
}
/* "Atrasadas" usava um vermelho fixo que quase sumia no fundo escuro novo */
html[data-theme=dark] body:has(aside .jurie-brand) :is(.late, #countLate){ color: var(--jurie-seal) !important; }

/* ---- Modais curtos (escritório, cliente, reservar tempo): do tamanho do conteúdo, não a gaveta inteira ---- */
body:has(aside .jurie-brand) :is(#officeModal, #clientModal, #planModal){
  background: var(--paper);
  color: var(--ink);
  position: fixed;
  inset: 0;
  margin: auto;
  width: min(420px, 92vw);
  height: max-content;
  max-height: 85dvh;
  border-radius: 18px;
  border: 1px solid var(--line);
  box-shadow: 0 24px 60px -24px rgba(42,35,48,.45);
}

/* ---- Restos da paleta "Causa em Dia" (verde-oliva) ainda escondidos em alguns detalhes ---- */
body:has(aside .jurie-brand) .gap{ border-color: var(--line); color: var(--muted); }
body:has(aside .jurie-brand) .task .tiny{ background: var(--theme-soft); }
body:has(aside .jurie-brand) #suggest{ background: var(--theme-soft); color: var(--jurie-action); }
body:has(aside .jurie-brand) .repeatBadge{ background: var(--theme-soft); color: var(--jurie-action); }
body:has(aside .jurie-brand) #cancelOccurrence{ color: var(--jurie-seal); }

/* O <select> nativo do sistema operacional é o maior sinal de "não terminaram" — desenhamos a seta */
body:has(aside .jurie-brand) select{
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path d='M4 6l4 4 4-4' fill='none' stroke='%23716a62' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/></svg>");
  background-repeat: no-repeat;
  background-position: right 12px center;
  padding-right: 32px;
}
html[data-theme=dark] body:has(aside .jurie-brand) select{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path d='M4 6l4 4 4-4' fill='none' stroke='%23c3b9c8' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/></svg>");
}

/* Superfícies dos módulos carregados pelo piloto. */
body:has(aside .jurie-brand) :is(#caseList, .caseOverview, .caseOverviewCard, #globalSearchRecord) {
  background: var(--paper);
  color: var(--ink);
  border-color: var(--line);
}
html[data-theme=dark] body:has(aside .jurie-brand) {
  --theme-error: #ffaaa1;
  --theme-warning: #ffcf99;
  --theme-success: #b4e2c0;
}
html[data-theme=dark] body:has(aside .jurie-brand) a {
  color: var(--theme-focus);
}
html[data-theme=dark] body:has(aside .jurie-brand) :is(
  #formError, #caseFormError, #clientError, #officeError, #planError,
  #documentError, #feeError, #feeReviewError, #checklistError,
  .late, .feeWarning, .overviewAttention, #dailyOverdue > .panelhead h2
) {
  color: var(--theme-error);
}
html[data-theme=dark] body:has(aside .jurie-brand) :is(.caseBadge, .nextBadge, .draftNotice) {
  background: var(--theme-soft);
  color: var(--ink);
}
@media (max-width: 760px) {
  body:has(aside .jurie-brand) .themeModes button {
    width: 44px;
    height: 44px;
  }
}

body:has(aside .jurie-brand) select {
  background-size: 16px 16px;
}
html[data-theme=dark] body:has(aside .jurie-brand) dialog .actions button:not(.primary):not(.danger) {
  background: var(--paper);
  color: var(--ink);
  border-color: var(--line);
}

.djen-process{margin:12px 0;padding:0 16px;border:1px solid var(--line);border-radius:var(--radius,12px);overflow-wrap:anywhere}
.djen-process>summary{cursor:pointer;padding:14px 0}
.djen-process>summary .helper{display:block;margin:4px 0 0}
#weekPanel .panelhead{flex-wrap:wrap;gap:8px}
#hearingHistory ul{margin:6px 0;padding-inline-start:20px}
body:has(aside .jurie-brand) #repeatSection[hidden]{display:none}
#cancelledHearings{margin-top:16px}
#cancelledHearings>summary{cursor:pointer}
html[data-theme=dark] body:has(aside .jurie-brand) :is(nav button:not(.active),main>header button:not(.primary)){
  background:var(--paper);
  color:var(--ink);
  border-color:var(--line);
}
@media(max-width:760px){
  body:has(aside .jurie-brand) nav:has([data-view="process-search"]){grid-template-columns:repeat(4,minmax(0,1fr))}
  body:has(aside .jurie-brand) nav:has([data-view="process-search"]) button{padding-inline:3px;min-width:0}
  body:has(aside .jurie-brand) #editor .fieldGroup-2col{grid-template-columns:minmax(0,1fr)}
  body:has(aside .jurie-brand) #editor select{max-width:100%}
}

.processPortals{
  margin:20px 0;
  padding:14px 16px;
  border:1px solid var(--line);
  border-radius:12px;
}
.processPortals summary{cursor:pointer;font-weight:600}
.processPortals ul{
  display:flex;
  flex-wrap:wrap;
  gap:10px 20px;
  padding:0;
  margin:12px 0 0;
  list-style:none;
}
.processCard,.processSheet{padding:16px}
.processCard h3,.processSheet h3{margin:0;overflow-wrap:anywhere}
.processSheet>h3{margin-top:16px}
.processLink{
  display:flex;
  flex-wrap:wrap;
  align-items:end;
  gap:10px;
  margin:16px 0;
}
.processLink label{flex:1 1 230px;min-width:0;margin:0}
.processLink select{width:100%;min-width:0}
.processLink p{flex-basis:100%;margin:0}
.processTimeline{margin:0;padding:0 0 0 16px;list-style:none;border-left:1px solid var(--line)}
.processTimeline>li{position:relative}
.processTimeline>li::before{
  content:"";
  position:absolute;
  top:23px;
  left:-20px;
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--jurie-action);
}
.processTimeline>li:first-child>article{border-top:0}
.processOverview{overflow-wrap:anywhere}
.processOverview:empty{display:none}
.processOverview p{margin:6px 0}
.processOverview + button{margin-top:12px}
.processSubject{margin:16px 0;padding:12px 0;border-block:1px solid var(--line)}
.processSubject p:last-child{margin-bottom:0}