/* ═══════════════════════════════════════════════════════════════════════
   JORNADA RESIDÊNCIA — tema visual (identidade verde, 09/2026)
   ───────────────────────────────────────────────────────────────────────
   Carregado DEPOIS de assets/css/style.css (tema "Purple Admin" compilado,
   que NÃO deve ser editado nem recompilado — o SCSS dele está desatualizado).
   Este arquivo é a única fonte de verdade das cores e do desenho do shell:
   tokens --jr-*, overrides do Bootstrap 5.3 e o redesenho de navbar, sidebar,
   cards, botões, formulários e tabelas. Fundo é sempre branco.
   Não vale para o ENAMED (enamed/ tem CSS próprio).
   ═══════════════════════════════════════════════════════════════════════ */

/* ── 1. Tokens ─────────────────────────────────────────────────────────── */
:root {
  /* marca (valores do artifact "Variações Verde") */
  --jr-brand:        #0B9C6A;  /* "medicina": preencher, ícones, bordas, texto grande */
  --jr-brand-dark:   #08825A;  /* botão com texto branco (AA), hover/active */
  --jr-brand-deep:   #064D38;  /* "profundo": links e texto pequeno em verde, menu ativo */
  --jr-brand-light:  #21C48B;  /* "claro": acento pontual, nunca com texto branco em cima */
  --jr-tint:         #E3F5EC;  /* "menta": chips, fundos fracos, hover de linha */
  --jr-tint-2:       #F2FBF7;  /* quase branco esverdeado (hover de tabela) */

  /* neutros (esverdeados, do artifact) */
  --jr-ink:          #071A15;  /* "grafite": texto principal */
  --jr-ink-2:        #4A5F58;  /* texto secundário */
  --jr-muted:        #6E8B85;  /* legendas */
  --jr-faint:        #9FB6B1;  /* placeholders, ícones inativos */
  --jr-line:         #D5E3DC;  /* borda forte */
  --jr-line-2:       #E6EFEA;  /* borda sutil */
  --jr-surface:      #FFFFFF;
  --jr-canvas:       #FFFFFF;  /* fundo de página: SEMPRE branco */

  /* semânticos */
  --jr-good:         #0B9C6A;  --jr-good-weak: #E3F5EC;
  --jr-warn:         #F59E0B;  --jr-warn-weak: #FDF3E3;
  --jr-bad:          #E5484D;  --jr-bad-weak:  #FDECEC;

  /* forma — raio diz a hierarquia: painel 14 · controle 8 · chip 999; sombra só no que flutua */
  --jr-radius:       14px;   /* painéis, cards, modais pequenos */
  --jr-radius-sm:    8px;    /* inputs, botões, células */
  --jr-radius-lg:    18px;   /* modais, folhas */
  --jr-shadow-sm:    none;   /* card em repouso não flutua */
  --jr-shadow:       0 1px 2px rgba(7, 26, 21, .05), 0 10px 28px -14px rgba(7, 26, 21, .14);
  --jr-shadow-lg:    0 2px 4px rgba(7, 26, 21, .05), 0 24px 48px -20px rgba(7, 26, 21, .22);
  --jr-ring:         0 0 0 4px rgba(11, 156, 106, .16);
  /* assinatura da marca: o corte diagonal do "J" (≈30°). Use UMA vez por tela. */
  --jr-corte:        polygon(0 0, calc(100% - 22px) 0, 100% 14px, 100% 100%, 0 100%);
  --jr-corte-barra:  polygon(0 0, 100% 0, calc(100% - 5px) 100%, 0 100%);

  /* tipografia */
  --jr-font-body:    "Manrope", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --jr-font-display: "Space Grotesk", "Manrope", ui-sans-serif, sans-serif;
  --jr-font-mono:    "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;

  /* Bootstrap 5.3 — re-apontado para a marca */
  --bs-primary:            var(--jr-brand);
  --bs-primary-rgb:        11, 156, 106;
  --bs-success:            var(--jr-brand);
  --bs-success-rgb:        11, 156, 106;
  --bs-info:               var(--jr-brand-light);
  --bs-info-rgb:           33, 196, 139;
  --bs-danger:             var(--jr-bad);
  --bs-danger-rgb:         229, 72, 77;
  --bs-warning:            var(--jr-warn);
  --bs-warning-rgb:        245, 158, 11;
  --bs-dark:               var(--jr-ink);
  --bs-dark-rgb:           7, 26, 21;
  --bs-secondary:          var(--jr-ink-2);
  --bs-secondary-rgb:      74, 95, 88;
  --bs-light:              var(--jr-tint-2);
  --bs-light-rgb:          242, 251, 247;
  --bs-body-color:         var(--jr-ink);
  --bs-body-color-rgb:     7, 26, 21;
  --bs-body-bg:            var(--jr-canvas);
  --bs-body-bg-rgb:        255, 255, 255;
  --bs-secondary-color:    var(--jr-ink-2);
  --bs-tertiary-color:     var(--jr-muted);
  --bs-tertiary-bg:        var(--jr-tint-2);
  --bs-emphasis-color:     var(--jr-ink);
  --bs-border-color:       var(--jr-line-2);
  --bs-border-color-translucent: rgba(7, 26, 21, .08);
  --bs-link-color:         var(--jr-brand-deep);
  --bs-link-color-rgb:     6, 77, 56;
  --bs-link-hover-color:   var(--jr-brand-dark);
  --bs-link-hover-color-rgb: 8, 130, 90;
  --bs-focus-ring-color:   rgba(11, 156, 106, .25);
  --bs-border-radius:      var(--jr-radius-sm);
  --bs-border-radius-sm:   8px;
  --bs-border-radius-lg:   var(--jr-radius);
  --bs-border-radius-xl:   var(--jr-radius-lg);
  --bs-body-font-family:   var(--jr-font-body);
  --bs-heading-color:      var(--jr-ink);
}

/* ── 2. Base: fundo branco, tipografia ─────────────────────────────────── */
html, body {
  background: var(--jr-canvas);
  color: var(--jr-ink);
}
body {
  font-family: var(--jr-font-body);
  font-size: .9375rem;
  line-height: 1.55;
  font-weight: 450;
  font-variant-numeric: tabular-nums;   /* números alinham em tabelas e KPIs sem fonte mono */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6,
.card-title, .page-title, .modal-title {
  font-family: var(--jr-font-display);
  font-weight: 600;
  letter-spacing: -0.015em;
  color: var(--jr-ink);
  line-height: 1.2;
}
h1, .h1 { font-size: 1.75rem; letter-spacing: -0.025em; }
h2, .h2 { font-size: 1.5rem; }
h3, .h3 { font-size: 1.25rem; }
h4, .h4 { font-size: 1.125rem; }
h5, .h5 { font-size: 1rem; }
h6, .h6 { font-size: .875rem; }
a { color: var(--jr-brand-deep); text-decoration: none; }
a:hover { color: var(--jr-brand-dark); }
small, .small { color: var(--jr-ink-2); }
.text-muted { color: var(--jr-muted) !important; }
hr { border-color: var(--jr-line-2); opacity: 1; }
code, kbd, pre, .font-monospace { font-family: var(--jr-font-mono); }
code { color: var(--jr-brand-deep); background: var(--jr-tint-2); padding: .1em .35em; border-radius: 4px; font-size: .9em; }
::selection { background: var(--jr-tint); color: var(--jr-brand-deep); }

/* ── 3. Logo (partial templates/partials/logo_jornada.html) ────────────── */
.jr-logo {
  display: inline-flex;
  align-items: center;
  gap: .55em;
  line-height: 1;
  color: var(--jr-brand-deep);
  font-family: var(--jr-font-display);
  white-space: nowrap;
  vertical-align: middle;
}
.jr-logo__mark { height: 1em; width: auto; display: block; flex: none; }
.jr-logo__text { display: flex; flex-direction: column; gap: .16em; }
.jr-logo__name { font-weight: 700; font-size: .66em; letter-spacing: -0.02em; color: var(--jr-brand-deep); }
.jr-logo__sub  { display: inline-flex; align-items: center; gap: .3em; font-weight: 500; font-size: .24em; letter-spacing: .36em; color: var(--jr-brand); padding-left: .1em; }
.jr-logo__sub i { display: inline-block; width: 1.2em; height: .18em; background: var(--jr-brand); }
.jr-logo--sm { font-size: 26px; }
.jr-logo--md { font-size: 34px; }
.jr-logo--lg { font-size: 56px; }
.jr-logo--xl { font-size: 88px; }
.jr-logo--mark .jr-logo__text { display: none; }

/* ── 4–6. Shell: navbar, sidebar e área de conteúdo ─────────────────────
   REMOVIDO na Fase 3 da migração (24/09/2026). O shell agora é Tailwind:
   os tokens estão em `static/assets/css/src/jornada.css` (@theme) e as classes
   da casca (.jr-shell, .jr-sidebar, .jr-navbar, .jr-nav-link, .jr-menu…) vivem
   na camada `components` do mesmo arquivo, compiladas em
   `static/assets/css/jornada.css`.

   Este arquivo passa a servir SÓ o conteúdo das páginas ainda não migradas —
   cards, botões, formulários, tabelas e utilitários do Bootstrap/Purple Admin
   (seções 7 em diante). Ele sai inteiro na Fase 6.

   As variáveis do shell (--jr-nav-h, --jr-sidebar-w, --jr-content-x/y) saíram
   junto: nenhuma página as usava, exceto --jr-content-x em design_system.html,
   que ganhou um valor próprio ali. ─────────────────────────────────────── */

/* ── 7. Cards ──────────────────────────────────────────────────────────── */
.card {
  background: var(--jr-surface);
  border: 1px solid var(--jr-line-2);
  border-radius: var(--jr-radius);
  box-shadow: none;                 /* card em repouso não flutua; só dropdown/modal têm sombra */
  color: var(--jr-ink);
}
.card.card-link:hover, a.card:hover { border-color: var(--jr-brand); }  /* só o card clicável reage */
.card .card-body { padding: 1.5rem; }
.card .card-header, .card .card-footer {
  background: var(--jr-tint-2);     /* cabeçalho/rodapé num plano diferente do corpo do card */
  border-color: var(--jr-line-2);
}
/* "bandeja": área que segura vários cards — os cards brancos saltam dela */
.jr-bandeja { background: var(--jr-tint-2); border: 1px solid var(--jr-line-2); border-radius: var(--jr-radius); padding: 1rem; }
.jr-bandeja > .card, .jr-bandeja .card { border-color: var(--jr-line-2); }
.card .card-title { font-size: 1rem; font-weight: 600; color: var(--jr-ink); margin-bottom: .75rem; }
.card .card-description, .card .card-subtitle { color: var(--jr-muted); }
.card.card-statistics .card-body { padding: 1.25rem 1.5rem; }
.card.bg-gradient-primary, .card.bg-gradient-info, .card.bg-gradient-success, .card.bg-gradient-danger {
  border: 0; color: #fff;
}

/* ── 8. Botões ─────────────────────────────────────────────────────────── */
.btn {
  font-family: var(--jr-font-body);
  font-weight: 600;
  border-radius: var(--jr-radius-sm);
  padding: .55rem 1.1rem;
  font-size: .875rem;
  line-height: 1.35;
  letter-spacing: 0;
  transition: background .15s ease, color .15s ease, border-color .15s ease, box-shadow .15s ease, transform .1s ease;
}
.btn:active { transform: translateY(1px); }
.btn:focus-visible { box-shadow: var(--jr-ring); outline: 0; }
.btn-sm, .btn-group-sm > .btn { padding: .3rem .6rem; font-size: .78rem; border-radius: 8px; }
.btn-lg, .btn-group-lg > .btn { padding: .8rem 1.4rem; font-size: 1rem; border-radius: var(--jr-radius); }

.btn-primary, .btn-success, .btn-info,
.btn-gradient-primary, .btn-gradient-success, .btn-gradient-info {
  --bs-btn-bg: var(--jr-brand-dark);
  --bs-btn-border-color: var(--jr-brand-dark);
  --bs-btn-color: #fff;
  --bs-btn-hover-bg: var(--jr-brand-deep);
  --bs-btn-hover-border-color: var(--jr-brand-deep);
  --bs-btn-hover-color: #fff;
  --bs-btn-active-bg: var(--jr-brand-deep);
  --bs-btn-active-border-color: var(--jr-brand-deep);
  --bs-btn-active-color: #fff;
  --bs-btn-disabled-bg: var(--jr-brand);
  --bs-btn-disabled-border-color: var(--jr-brand);
  --bs-btn-disabled-color: #fff;
  --bs-btn-focus-shadow-rgb: 11, 156, 106;
  background: var(--jr-brand-dark);
  border-color: var(--jr-brand-dark);
  color: #fff;
  background-image: none;
}
.btn-primary:hover, .btn-success:hover, .btn-info:hover,
.btn-gradient-primary:hover, .btn-gradient-success:hover, .btn-gradient-info:hover,
.btn-primary:focus, .btn-gradient-primary:focus,
.btn-primary:not([disabled]):not(.disabled):active, .btn-primary:not([disabled]):not(.disabled).active,
.btn-gradient-primary:not([disabled]):not(.disabled):active, .btn-gradient-primary:not([disabled]):not(.disabled).active,
.show > .btn-primary.dropdown-toggle, .show > .btn-gradient-primary.dropdown-toggle {
  background: var(--jr-brand-deep);
  border-color: var(--jr-brand-deep);
  color: #fff;
  opacity: 1;
  background-image: none;
}
.btn-outline-primary, .btn-outline-success, .btn-outline-info {
  --bs-btn-color: var(--jr-brand-deep);
  --bs-btn-border-color: var(--jr-line);
  --bs-btn-hover-bg: var(--jr-tint);
  --bs-btn-hover-color: var(--jr-brand-deep);
  --bs-btn-hover-border-color: var(--jr-brand);
  --bs-btn-active-bg: var(--jr-tint);
  --bs-btn-active-color: var(--jr-brand-deep);
  --bs-btn-active-border-color: var(--jr-brand);
  color: var(--jr-brand-deep);
  border-color: var(--jr-line);
  background: var(--jr-surface);
}
.btn-outline-primary:hover, .btn-outline-success:hover, .btn-outline-info:hover {
  background: var(--jr-tint); color: var(--jr-brand-deep); border-color: var(--jr-brand);
}
.btn-secondary, .btn-light, .btn-outline-secondary, .btn-outline-light, .btn-gradient-light {
  --bs-btn-bg: var(--jr-surface);
  --bs-btn-border-color: var(--jr-line);
  --bs-btn-color: var(--jr-ink-2);
  --bs-btn-hover-bg: var(--jr-tint-2);
  --bs-btn-hover-border-color: var(--jr-line);
  --bs-btn-hover-color: var(--jr-ink);
  --bs-btn-active-bg: var(--jr-tint);
  --bs-btn-active-color: var(--jr-brand-deep);
  --bs-btn-active-border-color: var(--jr-line);
  background: var(--jr-surface);
  border-color: var(--jr-line);
  color: var(--jr-ink-2);
  background-image: none;
}
.btn-secondary:hover, .btn-light:hover, .btn-outline-secondary:hover, .btn-outline-light:hover, .btn-gradient-light:hover {
  background: var(--jr-tint-2); color: var(--jr-ink); border-color: var(--jr-line);
}
.btn-danger, .btn-gradient-danger {
  --bs-btn-bg: var(--jr-bad); --bs-btn-border-color: var(--jr-bad);
  --bs-btn-hover-bg: #c93a3f; --bs-btn-hover-border-color: #c93a3f;
  --bs-btn-active-bg: #c93a3f; --bs-btn-active-border-color: #c93a3f;
  background: var(--jr-bad); border-color: var(--jr-bad); color: #fff; background-image: none;
}
.btn-danger:hover, .btn-gradient-danger:hover { background: #c93a3f; border-color: #c93a3f; color: #fff; }
.btn-outline-danger { --bs-btn-color: var(--jr-bad); --bs-btn-border-color: #f3c3c5; --bs-btn-hover-bg: var(--jr-bad-weak); --bs-btn-hover-color: #b7333a; --bs-btn-hover-border-color: var(--jr-bad); }
.btn-warning, .btn-gradient-warning { background: var(--jr-warn); border-color: var(--jr-warn); color: #3a2a06; background-image: none; }
.btn-link { color: var(--jr-brand-deep); font-weight: 600; }
.btn-link:hover { color: var(--jr-brand-dark); }
.btn-rounded { border-radius: 999px; }
/* botão só-ícone (setas do mini-calendário, ações de tabela): quadrado perfeito, nunca pílula */
.btn.rounded-circle, .btn.btn-icon, .btn.btn-circle {
  width: 2.5rem; height: 2.5rem; padding: 0;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 999px; line-height: 1; flex: none;
}
.btn.btn-sm.rounded-circle, .btn-sm.btn-icon { width: 2.1rem; height: 2.1rem; }
.btn-light.rounded-circle, .btn-light.btn-icon { background: var(--jr-tint-2); border-color: transparent; color: var(--jr-ink-2); }  /* setas suaves, sem contorno */
.btn-light.rounded-circle:hover, .btn-light.btn-icon:hover { background: var(--jr-tint); color: var(--jr-brand-deep); border-color: transparent; }
.btn.btn-lg.rounded-circle, .btn-lg.btn-icon { width: 3rem; height: 3rem; }
.btn-icon-text .btn-icon-prepend { margin-right: .4rem; }
.btn .mdi { font-size: 1.05em; vertical-align: -.05em; }

/* ── 9. Formulários ────────────────────────────────────────────────────── */
.form-control, .form-select, .typeahead, .tt-query, .tt-hint,
.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple {
  font-family: var(--jr-font-body);
  font-size: .9rem;
  color: var(--jr-ink);
  background: var(--jr-surface);
  border: 1px solid var(--jr-line);
  border-radius: var(--jr-radius-sm);
  padding: .55rem .85rem;
  box-shadow: none;
  transition: border-color .15s ease, box-shadow .15s ease;
}
.form-control::placeholder, .typeahead::placeholder { color: var(--jr-faint); }
.form-control:focus, .form-select:focus, .typeahead:focus,
.select2-container--default.select2-container--focus .select2-selection--multiple,
.select2-container--default.select2-container--open .select2-selection--single {
  border-color: var(--jr-brand);
  box-shadow: var(--jr-ring);
  background: var(--jr-surface);
  color: var(--jr-ink);
  outline: 0;
}
.form-control:disabled, .form-control[readonly], .form-select:disabled { background: var(--jr-tint-2); color: var(--jr-muted); }
.form-control.is-invalid, .form-select.is-invalid { border-color: var(--jr-bad); }
.form-control.is-invalid:focus { box-shadow: 0 0 0 4px rgba(229, 72, 77, .14); }
.form-control.is-valid, .form-select.is-valid { border-color: var(--jr-brand); }
.form-control-sm, .form-select-sm { padding: .35rem .65rem; font-size: .82rem; border-radius: 8px; }
.form-control-lg, .form-select-lg { padding: .75rem 1rem; font-size: 1rem; border-radius: var(--jr-radius); }
.form-label, label { color: var(--jr-ink-2); font-weight: 600; font-size: .82rem; }
.form-text { color: var(--jr-muted); }
.input-group-text { background: var(--jr-tint-2); border-color: var(--jr-line); color: var(--jr-muted); border-radius: var(--jr-radius-sm); }
.form-check-input { border-color: var(--jr-line); width: 1.05em; height: 1.05em; margin-top: .2em; }
.form-check-input:checked { background-color: var(--jr-brand); border-color: var(--jr-brand); }
.form-check-input:focus { border-color: var(--jr-brand); box-shadow: var(--jr-ring); }
.form-switch .form-check-input { width: 2.2em; }
.form-switch .form-check-input:focus { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%230B9C6A'/%3e%3c/svg%3e"); }
.form-switch .form-check-input:checked { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e"); }
.form-range::-webkit-slider-thumb { background: var(--jr-brand); }
.form-range::-moz-range-thumb { background: var(--jr-brand); }
.form-range::-webkit-slider-runnable-track { background: var(--jr-line-2); }
.form-range::-moz-range-track { background: var(--jr-line-2); }
.form-range:focus::-webkit-slider-thumb { box-shadow: var(--jr-ring); }
/* select: a regra compartilhada acima usa o atalho `background:` (zera repeat/position/size),
   então a seta é reposta aqui com o atalho completo — uma seta só, à direita. */
.form-select, .form-select:focus {
  background: var(--jr-surface) url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%236E8B85' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e") no-repeat right .8rem center / 14px 10px;
  padding-right: 2.4rem;
  appearance: none;
  -webkit-appearance: none;
}
.form-select-sm { background-position: right .6rem center; padding-right: 2rem; }
.form-select[multiple], .form-select[size]:not([size="1"]) { background-image: none; padding-right: .85rem; }

/* ── 10. Tabelas ───────────────────────────────────────────────────────── */
.table {
  --bs-table-color: var(--jr-ink);
  --bs-table-bg: transparent;
  --bs-table-border-color: var(--jr-line-2);
  --bs-table-striped-bg: var(--jr-tint-2);
  --bs-table-hover-bg: var(--jr-tint-2);
  --bs-table-hover-color: var(--jr-ink);
  color: var(--jr-ink);
  font-size: .9rem;
}
.table > :not(caption) > * > * { padding: .8rem .9rem; border-bottom-color: var(--jr-line-2); background-color: transparent; }
.table thead th, .table > thead > tr > th {
  font-family: var(--jr-font-body);
  font-size: .8rem;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;             /* caixa de frase: o rótulo informa, não decora */
  color: var(--jr-muted);
  border-bottom: 1px solid var(--jr-line);
  background: var(--jr-tint-2);     /* cabeçalho num plano próprio */
  white-space: nowrap;
}
/* tabela compacta (table-sm) continua compacta — a regra acima não pode engordar as células */
.table-sm > :not(caption) > * > * { padding: .45rem .6rem; }
/* tabela sem bordas (mini-calendário, listas soltas): cabeçalho sem faixa nem linha */
.table-borderless thead th, .table-borderless > thead > tr > th { background: transparent; border-bottom: 0; }
/* tabela dentro de card: rola na horizontal dentro do card, nunca vaza pela página */
.card-body:has(> .table), .card-body:has(> table), .card-body:has(> .table-responsive) { overflow-x: auto; }
.table tbody tr { transition: background .12s ease; }
.table-hover > tbody > tr:hover > * { background-color: var(--jr-tint-2); color: var(--jr-ink); }
.table-bordered > :not(caption) > * > * { border-color: var(--jr-line-2); }
.table-responsive { border-radius: var(--jr-radius); }
.table .badge { font-size: .72rem; }

/* ── 11. Badges, pills, alerts, progress ───────────────────────────────── */
.badge {
  font-family: var(--jr-font-body);
  font-weight: 600;
  font-size: .72rem;
  letter-spacing: .01em;
  padding: .38em .7em;
  border-radius: 999px;
}
.badge.bg-primary, .badge.badge-primary, .badge.bg-success, .badge.badge-success, .badge.badge-gradient-primary, .badge.badge-gradient-success,
.badge.bg-info, .badge.badge-info, .badge.badge-gradient-info {
  background: var(--jr-tint) !important; color: var(--jr-brand-deep) !important; background-image: none !important;
}
.badge.bg-danger, .badge.badge-danger, .badge.badge-gradient-danger { background: var(--jr-bad-weak) !important; color: #b7333a !important; background-image: none !important; }
.badge.bg-warning, .badge.badge-warning, .badge.badge-gradient-warning { background: var(--jr-warn-weak) !important; color: #8a5a06 !important; background-image: none !important; }
.badge.bg-secondary, .badge.badge-secondary, .badge.bg-light, .badge.badge-light, .badge.bg-dark, .badge.badge-dark { background: var(--jr-tint-2) !important; color: var(--jr-ink-2) !important; border: 1px solid var(--jr-line-2); }
.badge-outline-primary, .badge-outline-success { color: var(--jr-brand-deep); border-color: var(--jr-brand); }
.alert { border-radius: var(--jr-radius); border-width: 1px; font-size: .9rem; }
.alert-primary, .alert-success, .alert-info { --bs-alert-bg: var(--jr-tint); --bs-alert-border-color: #c6e9d8; --bs-alert-color: var(--jr-brand-deep); background: var(--jr-tint); border-color: #c6e9d8; color: var(--jr-brand-deep); }
.alert-danger { --bs-alert-bg: var(--jr-bad-weak); --bs-alert-border-color: #f3c3c5; --bs-alert-color: #9f2d33; background: var(--jr-bad-weak); border-color: #f3c3c5; color: #9f2d33; }
.alert-warning { --bs-alert-bg: var(--jr-warn-weak); --bs-alert-border-color: #f6dfb0; --bs-alert-color: #7a4f05; background: var(--jr-warn-weak); border-color: #f6dfb0; color: #7a4f05; }
.progress { background: var(--jr-line-2); border-radius: 3px; height: .5rem; overflow: hidden; }
.progress .progress-bar { background: var(--jr-brand); border-radius: 0; clip-path: var(--jr-corte-barra); } /* remate diagonal, como a cauda do J */
.progress .progress-bar.bg-success, .progress .progress-bar.bg-primary, .progress .progress-bar.bg-info { background: var(--jr-brand) !important; }
.progress .progress-bar.bg-danger { background: var(--jr-bad) !important; }
.progress .progress-bar.bg-warning { background: var(--jr-warn) !important; }

/* ── 12. Navegação secundária, paginação, dropdown, modal ──────────────── */
.nav-tabs { border-bottom: 1px solid var(--jr-line-2); gap: .25rem; }
.nav-tabs .nav-link {
  border: 0; border-bottom: 2px solid transparent; border-radius: 0;
  color: var(--jr-ink-2); font-weight: 600; font-size: .9rem; padding: .6rem .9rem; background: transparent;
}
.nav-tabs .nav-link:hover, .nav-tabs .nav-link:focus { color: var(--jr-brand-deep); border-color: var(--jr-line); isolation: isolate; }
.nav-tabs .nav-link.active, .nav-tabs .nav-item.show .nav-link { color: var(--jr-brand-deep); border-bottom-color: var(--jr-brand); background: transparent; }
.nav-pills .nav-link { color: var(--jr-ink-2); font-weight: 600; border-radius: 999px; }
.nav-pills .nav-link.active, .nav-pills .show > .nav-link { background: var(--jr-tint); color: var(--jr-brand-deep); }
.pagination { --bs-pagination-color: var(--jr-ink-2); --bs-pagination-border-color: var(--jr-line-2); --bs-pagination-hover-bg: var(--jr-tint-2); --bs-pagination-hover-color: var(--jr-brand-deep); --bs-pagination-focus-box-shadow: var(--jr-ring); --bs-pagination-active-bg: var(--jr-brand-dark); --bs-pagination-active-border-color: var(--jr-brand-dark); --bs-pagination-active-color: #fff; }
.page-link { color: var(--jr-ink-2); border-color: var(--jr-line-2); font-weight: 600; }
.page-link:hover { color: var(--jr-brand-deep); background: var(--jr-tint-2); border-color: var(--jr-line-2); }
.page-item.active .page-link { background: var(--jr-brand-dark); border-color: var(--jr-brand-dark); color: #fff; }
.dropdown-menu {
  border: 1px solid var(--jr-line-2);
  border-radius: var(--jr-radius);
  box-shadow: var(--jr-shadow-lg);
  padding: .4rem;
  font-family: var(--jr-font-body);
  font-size: .9rem;
}
.dropdown-menu .dropdown-item { border-radius: 8px; color: var(--jr-ink); padding: .5rem .75rem; }
.dropdown-menu .dropdown-item:hover, .dropdown-menu .dropdown-item:focus { background: var(--jr-tint-2); color: var(--jr-brand-deep); }
.dropdown-menu .dropdown-item.active, .dropdown-menu .dropdown-item:active { background: var(--jr-tint); color: var(--jr-brand-deep); }
.dropdown-menu .dropdown-divider { border-color: var(--jr-line-2); }
.dropdown-menu .dropdown-header { color: var(--jr-muted); font-size: .78rem; letter-spacing: 0; text-transform: none; font-weight: 600; }
.modal-content { border: 0; border-radius: var(--jr-radius-lg); box-shadow: var(--jr-shadow-lg); }
.modal-header { border-bottom: 1px solid var(--jr-line-2); padding: 1.25rem 1.5rem; }
.modal-body { padding: 1.5rem; }
.modal-footer { border-top: 1px solid var(--jr-line-2); padding: 1rem 1.5rem; }
.modal-backdrop.show { opacity: .35; background: var(--jr-ink); }
.list-group-item { border-color: var(--jr-line-2); color: var(--jr-ink); }
.list-group-item.active { background: var(--jr-tint); border-color: var(--jr-tint); color: var(--jr-brand-deep); }
.breadcrumb-item + .breadcrumb-item::before { color: var(--jr-faint); }
.breadcrumb-item.active { color: var(--jr-muted); }
.tooltip-inner { background: var(--jr-ink); border-radius: 8px; font-family: var(--jr-font-body); font-size: .78rem; }
.popover { border-color: var(--jr-line-2); border-radius: var(--jr-radius); box-shadow: var(--jr-shadow-lg); }
.offcanvas { border-color: var(--jr-line-2); }
.accordion-button:not(.collapsed) { background: var(--jr-tint); color: var(--jr-brand-deep); box-shadow: none; }
.accordion-button:focus { box-shadow: var(--jr-ring); border-color: var(--jr-brand); }
.spinner-border.text-primary, .spinner-grow.text-primary { color: var(--jr-brand) !important; }
.toast { border-radius: var(--jr-radius); border-color: var(--jr-line-2); box-shadow: var(--jr-shadow-lg); }

/* ── 13. Utilitários de cor do Bootstrap/Purple Admin ──────────────────── */
.text-primary, .text-success, .text-info { color: var(--jr-brand-deep) !important; }
.text-danger { color: var(--jr-bad) !important; }
.text-warning { color: #b7770a !important; }
.text-secondary { color: var(--jr-ink-2) !important; }
.text-dark { color: var(--jr-ink) !important; }
.bg-primary, .bg-success, .bg-info,
.bg-gradient-primary, .bg-gradient-success, .bg-gradient-info { background: var(--jr-brand) !important; background-image: none !important; color: #fff; }
.bg-gradient-danger, .bg-danger { background: var(--jr-bad) !important; background-image: none !important; }
.bg-gradient-warning, .bg-warning { background: var(--jr-warn) !important; background-image: none !important; }
.bg-gradient-dark, .bg-dark { background: var(--jr-ink) !important; background-image: none !important; }
.bg-light, .bg-gradient-light, .bg-body-tertiary { background: var(--jr-tint-2) !important; background-image: none !important; }
.bg-secondary { background: var(--jr-ink-2) !important; }
.border-primary, .border-success { border-color: var(--jr-brand) !important; }
.border, .border-top, .border-bottom, .border-start, .border-end { border-color: var(--jr-line-2) !important; }
.shadow-sm { box-shadow: var(--jr-shadow-sm) !important; }
.shadow { box-shadow: var(--jr-shadow) !important; }
.shadow-lg { box-shadow: var(--jr-shadow-lg) !important; }
.rounded { border-radius: var(--jr-radius-sm) !important; }
.error-page.bg-info, .error-page.bg-primary { background: var(--jr-canvas) !important; color: var(--jr-ink); }

/* ── 14. Plugins usados no shell ───────────────────────────────────────── */
/* bootstrap-datepicker */
.datepicker-dropdown { border-radius: var(--jr-radius); border: 1px solid var(--jr-line-2); box-shadow: var(--jr-shadow-lg); font-family: var(--jr-font-body); padding: .5rem; }
.datepicker.datepicker-inline { border: 0; box-shadow: none; padding: 0; width: 100%; }  /* mini-calendário embutido na página: sem caixa dentro do card */
.datepicker table tr td, .datepicker table tr th { border-radius: 8px; }
.datepicker table tr td.day:hover, .datepicker table tr td.focused { background: var(--jr-tint-2); }
.datepicker table tr td.active, .datepicker table tr td.active:hover,
.datepicker table tr td.active.active, .datepicker table tr td.active.highlighted,
.datepicker table tr td span.active, .datepicker table tr td span.active:hover,
.datepicker table tr td span.active.active {
  background: var(--jr-brand-dark) !important; background-image: none !important; border-color: var(--jr-brand-dark) !important; color: #fff !important; text-shadow: none !important;
}
.datepicker table tr td.today, .datepicker table tr td.today:hover { background: var(--jr-tint) !important; background-image: none !important; color: var(--jr-brand-deep) !important; }
.datepicker table tr td.day.new, .datepicker table tr td.day.old { color: var(--jr-faint); }
.datepicker .datepicker-switch:hover, .datepicker .prev:hover, .datepicker .next:hover { background: var(--jr-tint-2); }
/* select2 */
.select2-container--default .select2-results__option--highlighted[aria-selected] { background: var(--jr-tint); color: var(--jr-brand-deep); }
.select2-dropdown { border-color: var(--jr-line-2); border-radius: var(--jr-radius); box-shadow: var(--jr-shadow-lg); }
.select2-container--default .select2-selection--multiple .select2-selection__choice { background: var(--jr-tint); border-color: transparent; color: var(--jr-brand-deep); border-radius: 999px; }
/* FullCalendar (calendário semanal) */
.fc .fc-button-primary { background: var(--jr-surface); border-color: var(--jr-line); color: var(--jr-ink-2); font-weight: 600; border-radius: var(--jr-radius-sm); text-transform: none; }
.fc .fc-button-primary:hover { background: var(--jr-tint-2); border-color: var(--jr-line); color: var(--jr-brand-deep); }
.fc .fc-button-primary:not(:disabled).fc-button-active, .fc .fc-button-primary:not(:disabled):active { background: var(--jr-tint); border-color: var(--jr-brand); color: var(--jr-brand-deep); }
.fc .fc-button-primary:focus { box-shadow: var(--jr-ring); }
.fc .fc-daygrid-day.fc-day-today, .fc .fc-timegrid-col.fc-day-today { background: var(--jr-tint-2); }
.fc .fc-col-header-cell-cushion, .fc .fc-daygrid-day-number { color: var(--jr-ink-2); font-weight: 600; }
.fc-theme-standard td, .fc-theme-standard th, .fc-theme-standard .fc-scrollgrid { border-color: var(--jr-line-2); }
.fc .fc-timegrid-now-indicator-line { border-color: var(--jr-brand); }
.fc .fc-timegrid-now-indicator-arrow { border-color: var(--jr-brand); border-top-color: transparent; border-bottom-color: transparent; }

/* ── 14b. Sobras do Purple Admin que ainda carregam azul/lilás ─────────── */
/* (achados do levantamento no style.css compilado — mesmos seletores, carregados depois) */
.modal { --bs-modal-bg: var(--jr-surface); }
.auth.multi-step-login, .auth .auth-form-light, .auth .auth-form-transparent { background: var(--jr-surface); }
.auth .auth-form-light { border: 1px solid var(--jr-line-2); border-radius: var(--jr-radius-lg); box-shadow: var(--jr-shadow); }
.form-check .form-check-label input[type=checkbox] + .input-helper:before,
.form-check .form-check-label input[type=radio] + .input-helper:before { border-color: var(--jr-line); border-radius: 6px; }
.form-check .form-check-label input[type=checkbox]:checked + .input-helper:before,
.form-check .form-check-label input[type=radio]:checked + .input-helper:before { background: var(--jr-brand); border-color: var(--jr-brand); }
.form-check .form-check-label input[type=checkbox]:checked + .input-helper:after { color: #fff; }
.badge-primary { background: var(--jr-tint); color: var(--jr-brand-deep); border-color: transparent; }
.badge-outline-primary { color: var(--jr-brand-deep); border-color: var(--jr-brand); }
.blockquote-primary, .card.card-outline-primary, .bg-inverse-primary { border-color: var(--jr-brand); }
.bg-inverse-primary { background: var(--jr-tint); color: var(--jr-brand-deep); }
.blockquote-primary .blockquote-footer, .image-grouped .text-avatar, .icons-list > div i,
.sales-mini-tabs .nav-item .nav-link.active, .datepicker.datepicker-inline thead tr th.datepicker-switch { color: var(--jr-brand-deep); }
.image-grouped .text-avatar { border-color: var(--jr-brand); background: var(--jr-tint); }
.bullet-line-list li:before { border-color: var(--jr-brand); }
select.form-select.border-primary, select.form-select.border-primary:focus, select.border-primary.tt-hint { outline-color: var(--jr-brand); }
.tt-suggestion:hover, .tt-suggestion .tt-cursor,
.select2-container--default .select2-selection--multiple .select2-selection__choice:nth-child(5n+1) { background: var(--jr-tint); color: var(--jr-brand-deep); }
.accordion { --bs-accordion-btn-focus-box-shadow: var(--jr-ring); --bs-accordion-active-bg: var(--jr-tint); --bs-accordion-active-color: var(--jr-brand-deep);
  --bs-accordion-btn-active-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23064D38'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e"); }
.link-primary, .link-success, .link-info { color: var(--jr-brand-deep) !important; }
.link-primary:hover, .link-primary:focus, .link-success:hover, .link-info:hover { color: var(--jr-brand-dark) !important; text-decoration-color: var(--jr-brand-dark) !important; }
.text-bg-primary, .text-bg-success, .text-bg-info { background: var(--jr-brand) !important; color: #fff !important; }
.pagination { --bs-pagination-active-bg: var(--jr-brand-dark); }
.nav-pills { --bs-nav-pills-link-active-bg: var(--jr-tint); --bs-nav-pills-link-active-color: var(--jr-brand-deep); }
.list-group { --bs-list-group-active-bg: var(--jr-tint); --bs-list-group-active-border-color: var(--jr-tint); --bs-list-group-active-color: var(--jr-brand-deep); }
.dropdown-menu { --bs-dropdown-link-active-bg: var(--jr-tint); --bs-dropdown-link-active-color: var(--jr-brand-deep); }
.nav-link:focus-visible { box-shadow: var(--jr-ring); }
/* Tom Select (bloco adicionado à mão no fim do style.css, com !important) */
.ts-wrapper.form-select.multi.plugin-remove_button.plugin-clear_button.focus,
.ts-wrapper.form-select.multi.plugin-remove_button.plugin-clear_button:focus-within,
.ts-wrapper.focus .ts-control, .ts-wrapper .ts-control:focus-within {
  border-color: var(--jr-brand) !important; box-shadow: var(--jr-ring) !important;
}
.ts-wrapper .ts-control { border-color: var(--jr-line); border-radius: var(--jr-radius-sm); }
.ts-wrapper.multi .ts-control > .item { background: var(--jr-tint); color: var(--jr-brand-deep); border-radius: 999px; }
.ts-dropdown { border-color: var(--jr-line-2); border-radius: var(--jr-radius); box-shadow: var(--jr-shadow-lg); }
.ts-dropdown .active { background: var(--jr-tint); color: var(--jr-brand-deep); }

/* ── 14c. Ícones em círculo/quadrado (ex.: .rounded-circle.p-3 > i.mdi) ────
   O line-height do tema (1.55) alonga a caixa do ícone e o círculo vira oval.
   Qualquer caixa arredondada cujo único filho é um ícone vira um quadrado
   perfeito com o ícone centrado. */
.rounded-circle:has(> .mdi:only-child), .rounded-circle:has(> .bi:only-child), .rounded-circle:has(> i:only-child),
.rounded:has(> .mdi:only-child), .rounded-3:has(> .mdi:only-child), .rounded-4:has(> .mdi:only-child),
.kpi-icon, .page-title-icon, .card-icon, .icon-box {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  aspect-ratio: 1;
  line-height: 1;
  flex: none;
}
.rounded-circle:has(> .mdi:only-child) > .mdi, .rounded-circle:has(> i:only-child) > i { line-height: 1; display: block; }
.bg-white.bg-opacity-25:has(> .mdi:only-child) { background: rgba(255, 255, 255, .22) !important; }

/* ── 14d. Mobile nativo (≤ 575px): não é "adaptação", é a versão de celular ──
   Regras globais que valem para toda tela; cada página ainda pode ter as suas. */
@media (max-width: 575.98px) {
  :root { --jr-content-x: 1rem; --jr-content-y: 1rem; --jr-radius: 12px; }
  html { -webkit-text-size-adjust: 100%; }
  body { font-size: .95rem; }
  h1, .h1 { font-size: 1.45rem; } h2, .h2 { font-size: 1.25rem; } h3, .h3 { font-size: 1.1rem; }
  /* alvos de toque e inputs sem zoom automático do iOS (≥16px) */
  .btn { min-height: 44px; padding-block: .6rem; }
  .btn-sm, .btn-group-sm > .btn { min-height: 38px; }
  .btn.rounded-circle, .btn.btn-icon { min-height: 0; }
  .form-control, .form-select, .typeahead, .input-group-text { font-size: 16px; min-height: 44px; }
  .form-control-sm, .form-select-sm { min-height: 40px; }
  .form-check-input { width: 1.25em; height: 1.25em; }
  /* navbar: só o essencial */
  .navbar.default-layout-navbar .navbar-menu-wrapper { gap: .35rem; padding-inline: .5rem; }
  .navbar.default-layout-navbar .navbar-menu-wrapper .nav-profile .nav-profile-text { display: none; }
  .navbar.default-layout-navbar .navbar-menu-wrapper .navbar-nav .nav-item .nav-link { padding: .25rem; }
  .navbar.default-layout-navbar .navbar-menu-wrapper [data-toggle="minimize"] { display: none; }
  /* cards e painéis encostam nas laterais com respiro menor */
  .card .card-body { padding: 1rem; }
  .grid-margin { margin-bottom: 1rem; }
  /* tabelas: rolagem horizontal dentro do container, nunca a página inteira */
  .table-responsive { margin-inline: calc(-1 * var(--jr-content-x)); padding-inline: var(--jr-content-x); width: auto; }
  .table > :not(caption) > * > * { padding: .65rem .6rem; white-space: nowrap; }
  /* modal vira folha inferior (continua sendo modal: mesmo markup, mesmo JS) */
  .modal-dialog { margin: 0; position: fixed; inset: auto 0 0 0; max-width: none; width: 100%; transform: none; }
  .modal.fade .modal-dialog { transform: translateY(24px); transition: transform .25s ease; }
  .modal.show .modal-dialog { transform: none; }
  .modal-content { border-radius: var(--jr-radius-lg) var(--jr-radius-lg) 0 0; max-height: 92dvh; overflow: auto; }
  .modal-header { padding: 1rem 1.25rem; }
  .modal-body { padding: 1.25rem; }
  .modal-footer { padding: .75rem 1.25rem calc(.75rem + env(safe-area-inset-bottom)); position: sticky; bottom: 0; background: var(--jr-surface); }
  .modal-footer .btn { flex: 1 1 auto; }
  .modal-dialog-centered { min-height: 0; }
  /* dropdowns e paginação */
  .dropdown-menu { font-size: 1rem; }
  .dropdown-menu .dropdown-item { padding: .7rem .85rem; }
  .pagination .page-link { min-width: 40px; min-height: 40px; display: inline-flex; align-items: center; justify-content: center; }
  /* nav-tabs rolam na horizontal em vez de quebrar */
  .nav-tabs { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
  .nav-tabs::-webkit-scrollbar { display: none; }
  .nav-tabs .nav-link { white-space: nowrap; }
  /* área segura do iPhone */
  .content-wrapper { padding-bottom: calc(var(--jr-content-y) + env(safe-area-inset-bottom)); }
}
/* tablets: sidebar em gaveta (já tratado), conteúdo com respiro médio */
@media (min-width: 576px) and (max-width: 991.98px) {
  :root { --jr-content-x: 1.25rem; }
}
/* toque em qualquer largura: sem hover "preso" e alvos maiores nas listas */
@media (hover: none) and (pointer: coarse) {
  .card:hover { box-shadow: var(--jr-shadow-sm); border-color: var(--jr-line-2); }
  .list-group-item, .dropdown-item { min-height: 44px; }
}

/* ── 14e. Assinatura: painel com o corte do "J" ─────────────────────────
   Um por tela. O canto superior direito é cortado em diagonal e um bloco
   verde-profundo encosta nele — o mesmo desenho do bloco de cima do símbolo.
   <section class="jr-painel-corte"> … </section> */
.jr-painel-corte {
  position: relative;
  background: var(--jr-surface);
  border: 1px solid var(--jr-line-2);
  border-radius: var(--jr-radius);
  clip-path: var(--jr-corte);
  padding: 1.5rem;
  isolation: isolate;
}
.jr-painel-corte::before {                 /* bloco profundo, canto cortado */
  content: "";
  position: absolute;
  top: 0; right: 0;
  width: 88px; height: 56px;
  background: var(--jr-brand-deep);
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0 42%);
  z-index: -1;
}
.jr-painel-corte--cheio { background: var(--jr-brand); border-color: var(--jr-brand); color: #fff; }
.jr-painel-corte--cheio::before { background: var(--jr-brand-deep); }
.jr-painel-corte--cheio .text-muted, .jr-painel-corte--cheio small { color: rgba(255, 255, 255, .78) !important; }
.jr-painel-corte--cheio .btn-light { background: #fff; color: var(--jr-brand-deep); border-color: #fff; }
.jr-painel-corte .jr-num {                 /* número grande da assinatura */
  font-family: var(--jr-font-display);
  font-size: clamp(2.2rem, 4vw, 3rem);
  font-weight: 600;
  letter-spacing: -.03em;
  line-height: 1;
}

/* ── 15. Scrollbar e detalhes ──────────────────────────────────────────── */
*::-webkit-scrollbar { width: 10px; height: 10px; }
*::-webkit-scrollbar-track { background: transparent; }
*::-webkit-scrollbar-thumb { background: var(--jr-line); border-radius: 999px; border: 2px solid var(--jr-canvas); }
*::-webkit-scrollbar-thumb:hover { background: var(--jr-faint); }
:focus-visible { outline: 2px solid var(--jr-brand); outline-offset: 2px; }
.btn:focus-visible, .form-control:focus-visible, .form-select:focus-visible { outline: 0; }