/**
 * Comercial — força paleta e superfícies do layout Pierini (padrão Qualidade)
 * após comercial-compat e app.css legado.
 */

/* Neutraliza :root escuro legado do app.css (~linha 1002) */
html[data-theme="light"] {
  --bg0: #f2f6fc;
  --bg1: #f2f6fc;
  --fg: #0a1f42;
  --muted: #4a6288;
  --card: #ffffff;
  --stroke: #d4e0f4;
  --accent: #002776;
  --accent-hot: #003d9e;
  --glass: color-mix(in srgb, #ffffff 92%, transparent);
  --glass-edge: #d4e0f4;
  --glass-shine: color-mix(in srgb, #ffffff 40%, transparent);
  --subtle-fill: #e8eef8;
}

html[data-theme="dark"] {
  --bg0: #000f28;
  --bg1: #000f28;
  --fg: #f5f8ff;
  --muted: #b8cae8;
  --card: #001f52;
  --stroke: #2a5088;
  --accent: #7eb8ff;
  --accent-hot: #a3ceff;
  --glass: color-mix(in srgb, #001f52 92%, transparent);
  --glass-edge: #2a5088;
  --glass-shine: color-mix(in srgb, #ffffff 8%, transparent);
  --subtle-fill: #0e2a5c;
}

html[data-theme] body.pierini-app,
html[data-theme] body.pierini-app.login-page {
  margin: 0;
  min-height: 100vh;
  min-height: 100dvh;
  font-family: var(--font-app);
  font-size: 15px;
  line-height: 1.45;
  color: var(--text);
  background: var(--bg);
  background-image: radial-gradient(
    ellipse 120% 80% at 50% -20%,
    color-mix(in srgb, var(--brand) 10%, transparent),
    transparent 70%
  );
  animation: none !important;
}

html[data-theme] body.pierini-app {
  --fg: var(--text);
  --card: var(--card-bg);
  --stroke: var(--card-border);
  --accent: var(--brand);
  --accent-hot: var(--brand-hover);
  --glass: color-mix(in srgb, var(--card-bg) 92%, transparent);
  --glass-edge: var(--card-border);
  --glass-shine: color-mix(in srgb, var(--bandeira-branco) 35%, transparent);
  --subtle-fill: var(--brand-soft);
  --font: var(--font-app);
  --font-heading: var(--font-app);
  --bg0: var(--bg);
  --bg1: var(--bg);
}

html[data-theme] body.pierini-app .tile,
html[data-theme] body.pierini-app .tile-sector,
html[data-theme] body.pierini-app .dashboard-priority-card {
  background: var(--card-bg);
  border: 1px solid var(--card-border);
  box-shadow: var(--shadow-card);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

html[data-theme] body.pierini-app .dashboard-priority-card--ok {
  border-color: color-mix(in srgb, var(--accent) 35%, var(--card-border));
}

html[data-theme] body.pierini-app .dashboard-priority-card--attention {
  border-color: color-mix(in srgb, #ff9f0a 45%, var(--card-border));
  box-shadow: var(--shadow-card);
}

html[data-theme] body.pierini-app .dashboard-priority-title,
html[data-theme] body.pierini-app .dashboard-priority-metric,
html[data-theme] body.pierini-app .dashboard-priority-split-num,
html[data-theme] body.pierini-app .dashboard-chart-title {
  color: var(--text);
  font-family: var(--font-app);
}

html[data-theme] body.pierini-app .dashboard-priority-split-item {
  background: var(--brand-soft);
  border: 1px solid var(--card-border);
}

html[data-theme] body.pierini-app .data-table th {
  background: var(--brand);
  color: var(--on-brand);
}

html[data-theme] body.pierini-app .btn-primary {
  background: var(--brand);
  color: var(--on-brand);
}

html[data-theme] body.pierini-app .btn-primary:hover {
  background: var(--brand-hover);
}

.alert-danger {
  margin: 0 0 0.75rem;
  padding: 0.75rem 1rem;
  border-radius: var(--radius);
  border: 1px solid color-mix(in srgb, #ff453a 35%, var(--alert-border));
  background: color-mix(in srgb, #ff453a 10%, var(--alert-bg));
  color: var(--alert-text);
  font-size: 0.92rem;
  line-height: 1.45;
}

.alert-success {
  margin: 0 0 0.75rem;
  padding: 0.75rem 1rem;
  border-radius: var(--radius);
  border: 1px solid var(--alert-success-border);
  background: var(--alert-success-bg);
  color: var(--alert-success-text);
  font-size: 0.92rem;
}

.login-caps-hint {
  margin: 0;
  font-size: 0.82rem;
  color: var(--muted);
}

/* Logo Pierini (SVG inline — herda cor do tema) */
a.company-logo-link {
  text-decoration: none;
  color: inherit;
  cursor: pointer;
}

a.company-logo-link:focus-visible {
  outline: 2px solid var(--accent, #2563eb);
  outline-offset: 3px;
  border-radius: 0.35rem;
}

.company-logo-image,
.company-logo-image--light,
.company-logo-image--dark {
  display: block;
  width: auto;
  max-width: 100%;
  height: auto;
  max-height: 4.25rem;
  object-fit: contain;
}

.company-logo-image--dark {
  display: none;
}

html[data-theme="dark"] .company-logo-image--light {
  display: none;
}

html[data-theme="dark"] .company-logo-image--dark {
  display: block;
}

.company-logo--login .company-logo-image {
  max-height: 5rem;
  max-width: min(100%, 22rem);
}

.company-logo-image--svg {
  display: block;
  width: auto;
  max-width: 100%;
  height: auto;
  max-height: 4.25rem;
}

.company-logo--login .company-logo-image--svg {
  max-height: 5rem;
  max-width: min(100%, 22rem);
}

.company-logo-fallback {
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--company-text);
  letter-spacing: 0.04em;
}

body.login-page .login-card {
  width: 100%;
}

body.login-page .company-logo--login {
  width: 100%;
  margin-bottom: 0.75rem;
}

/* Cabeçalho — alinhamento e altura uniforme dos botões do topo */
html[data-theme] body.pierini-app .app-header__shell {
  width: 100%;
}

html[data-theme] body.pierini-app .app-header__bar {
  align-items: center;
  min-height: 3.75rem;
}

html[data-theme] body.pierini-app .app-header__start,
html[data-theme] body.pierini-app .app-header__tools {
  display: flex;
  align-items: center;
}

html[data-theme] body.pierini-app .app-header__tools {
  flex-wrap: nowrap;
  align-content: center;
  justify-content: flex-end;
  gap: 0.4rem;
  flex-shrink: 0;
}

html[data-theme] body.pierini-app .app-header__tools > * {
  align-self: center;
  flex-shrink: 0;
}

html[data-theme] body.pierini-app .menu-toggle,
html[data-theme] body.pierini-app .theme-select-wrap,
html[data-theme] body.pierini-app .app-header__btn,
html[data-theme] body.pierini-app .btn-header-tool,
html[data-theme] body.pierini-app .app-header__user-block {
  height: var(--header-tool-h, 2.55rem);
  min-height: var(--header-tool-h, 2.55rem);
  max-height: var(--header-tool-h, 2.55rem);
  box-sizing: border-box;
}

html[data-theme] body.pierini-app .app-header__user-block .btn-header-logout {
  height: 100%;
  min-height: 0;
  max-height: none;
  display: inline-flex;
  align-items: center;
}

html[data-theme] body.pierini-app .app-header__start .company-logo--header .company-logo-image {
  max-height: clamp(2.35rem, 8vw, 4rem);
}

html[data-theme] body.pierini-app .app-header__title,
html[data-theme] body.pierini-app .app-header__subtitle {
  color: var(--text);
}

html[data-theme] body.pierini-app .app-header__user-block .app-header__user {
  color: var(--chip-text);
}

/* app.css força todos os <button> em azul — restaura padrão Pierini no conteúdo e no topo */
html[data-theme] body.pierini-app .app-header button.menu-toggle {
  background: var(--input-bg);
  color: var(--text);
  border: 1px solid var(--card-border);
  padding: 0;
  width: var(--header-tool-h, 2.55rem);
  min-width: var(--header-tool-h, 2.55rem);
  line-height: 1;
}

html[data-theme] body.pierini-app .app-content button:not(.btn-primary):not(.btn-danger) {
  background: var(--input-bg);
  color: var(--text);
  border: 1px solid var(--card-border);
}

html[data-theme] body.pierini-app button.btn-primary {
  background: var(--brand);
  color: var(--on-brand);
  border: 0;
}

html[data-theme] body.pierini-app button.btn-primary:hover {
  background: var(--brand-hover);
}

html[data-theme] body.pierini-app .btn-header-tool,
html[data-theme] body.pierini-app .app-header__btn,
html[data-theme] body.pierini-app .theme-select-wrap {
  background: var(--input-bg);
  color: var(--text);
  border: 1px solid var(--card-border);
}

html[data-theme] body.pierini-app .btn-header-logout {
  background: var(--brand);
  color: var(--on-brand);
  border: 0;
}

html[data-theme] body.pierini-app .btn-ui,
html[data-theme] body.pierini-app .btn-ui-inline {
  background: var(--card-bg);
  color: var(--brand);
  border: 1px solid var(--card-border);
}

html[data-theme] body.pierini-app .btn-ui:hover,
html[data-theme] body.pierini-app .btn-ui-inline:hover {
  background: var(--nav-hover-bg);
  color: var(--nav-active-text);
}

/* Conteúdo legado — largura sem margem de sidebar antiga */
html[data-theme] body.pierini-app .atv-rows {
  width: 100%;
  max-width: var(--content-max, 100%);
  margin-left: auto;
  margin-right: auto;
}

html[data-theme] body.pierini-app .atv-rows > .atv-row {
  width: 100%;
  max-width: var(--content-max, 100%);
}

/* Textos legíveis em claro e escuro */
html[data-theme] body.pierini-app,
html[data-theme] body.pierini-app .app-content {
  color: var(--text);
}

html[data-theme] body.pierini-app .muted,
html[data-theme] body.pierini-app .sector-lead,
html[data-theme] body.pierini-app .sector-hint,
html[data-theme] body.pierini-app .comercial-page-intro,
html[data-theme] body.pierini-app .hint {
  color: var(--muted);
}

html[data-theme] body.pierini-app .data-table td {
  color: var(--text);
}

html[data-theme] body.pierini-app .input,
html[data-theme] body.pierini-app select.input,
html[data-theme] body.pierini-app textarea.input {
  background: var(--input-bg);
  color: var(--text);
  border-color: var(--card-border);
}

html[data-theme] body.pierini-app select option {
  background: var(--card-bg);
  color: var(--text);
}

html[data-theme] body.pierini-app .chat-bubble {
  background: var(--card-bg);
  border: 1px solid var(--card-border);
  color: var(--text);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  box-shadow: var(--shadow-card);
}

html[data-theme] body.pierini-app .chat-meta {
  color: var(--muted);
}

html[data-theme] body.pierini-app .pill {
  background: var(--chip-bg);
  color: var(--chip-text);
  border: 1px solid var(--card-border);
}

html[data-theme] body.pierini-app .ok-badge {
  color: #34c759;
}

html[data-theme="dark"] body.pierini-app .ok-badge {
  color: #6ee09a;
}

html[data-theme] body.pierini-app .warn-badge {
  color: #c67a00;
}

html[data-theme="dark"] body.pierini-app .warn-badge {
  color: #fbbf24;
}

html[data-theme] body.pierini-app .fail-badge {
  color: #ff453a;
}

html[data-theme="dark"] body.pierini-app .fail-badge {
  color: #ff8a82;
}

html[data-theme] body.pierini-app .app-topnav__grid .nav-link {
  color: var(--text);
}

html[data-theme] body.pierini-app .app-footer__bar,
html[data-theme] body.pierini-app .app-footer__company,
html[data-theme] body.pierini-app .app-footer__credit {
  color: var(--muted);
}

html[data-theme] body.login-page .login-card .app-title {
  color: var(--text);
}

html[data-theme] body.login-page .login-card .app-title-brand {
  color: var(--company-text);
}

html[data-theme] body.login-page label {
  color: var(--text);
}

html[data-theme] body.login-page .show-pass {
  color: var(--muted);
}

/* ── Visibilidade por tema (contraste claro/escuro) ── */

/* Cards e blocos — superfície sólida (neutraliza glass do app.css legado) */
html[data-theme] body.pierini-app .card,
html[data-theme] body.pierini-app .dashboard-chart-card,
html[data-theme] body.pierini-app .audit-entry,
html[data-theme] body.pierini-app .reminder-item,
html[data-theme] body.pierini-app .admin-users-page .admin-wa-option {
  width: 100%;
  max-width: 100%;
  background: var(--card-bg);
  border: 1px solid var(--card-border);
  box-shadow: var(--shadow-card);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  color: var(--text);
}

html[data-theme] body.pierini-app .card::after {
  display: none !important;
  animation: none !important;
}

html[data-theme] body.pierini-app .card h1,
html[data-theme] body.pierini-app .card h2,
html[data-theme] body.pierini-app .card h3,
html[data-theme] body.pierini-app .card h4,
html[data-theme] body.pierini-app .card p,
html[data-theme] body.pierini-app .card li,
html[data-theme] body.pierini-app .card label,
html[data-theme] body.pierini-app .card strong,
html[data-theme] body.pierini-app .card span:not(.muted):not(.hint) {
  color: var(--text);
}

html[data-theme] body.pierini-app .card .muted,
html[data-theme] body.pierini-app .card .hint {
  color: var(--muted);
}

/* Dashboard — listas com classe muted no pai ainda legíveis */
html[data-theme] body.pierini-app .dashboard-priority-list,
html[data-theme] body.pierini-app .dashboard-priority-list.muted {
  color: var(--text);
}

html[data-theme] body.pierini-app .dashboard-priority-list strong,
html[data-theme] body.pierini-app .dashboard-priority-list code,
html[data-theme] body.pierini-app .dashboard-priority-list a {
  color: var(--text);
  font-weight: 600;
}

html[data-theme] body.pierini-app .dashboard-priority-list a {
  color: var(--brand);
  font-weight: 650;
}

html[data-theme] body.pierini-app .dashboard-priority-split-lbl,
html[data-theme] body.pierini-app .dashboard-priority-hint,
html[data-theme] body.pierini-app .dashboard-priority-tech,
html[data-theme] body.pierini-app .dashboard-chart-subtitle {
  color: var(--muted);
}

html[data-theme] body.pierini-app .dashboard-priority-metric--state {
  color: var(--brand);
}

html[data-theme] body.pierini-app .dashboard-priority-card--attention .dashboard-priority-metric--state {
  color: #e68600;
}

html[data-theme="dark"] body.pierini-app .dashboard-priority-card--attention .dashboard-priority-metric--state {
  color: #fbbf24;
}

html[data-theme] body.pierini-app .dashboard-chart-title {
  color: var(--text);
}

/* Alertas legíveis (app.css usa color: inherit) */
html[data-theme] body.pierini-app .alert {
  color: var(--alert-text);
  background: var(--alert-bg);
  border-color: var(--alert-border);
}

html[data-theme] body.pierini-app .alert-danger {
  color: #8b1a12;
  background: color-mix(in srgb, #ff453a 12%, var(--card-bg));
  border-color: color-mix(in srgb, #ff453a 40%, var(--card-border));
}

html[data-theme="dark"] body.pierini-app .alert-danger {
  color: #ffd4d1;
  background: color-mix(in srgb, #ff453a 18%, var(--card-bg));
  border-color: color-mix(in srgb, #ff453a 45%, var(--card-border));
}

/* Campos de formulário — fundo sólido em ambos os temas */
html[data-theme] body.pierini-app input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]),
html[data-theme] body.pierini-app select,
html[data-theme] body.pierini-app textarea {
  background: var(--input-bg);
  color: var(--text);
  border-color: var(--card-border);
}

html[data-theme] body.pierini-app input::placeholder,
html[data-theme] body.pierini-app textarea::placeholder {
  color: color-mix(in srgb, var(--muted) 85%, transparent);
  opacity: 1;
}

/* Links no conteúdo */
html[data-theme] body.pierini-app .app-content a:not(.btn-primary):not(.btn-ghost):not(.nav-link):not(.btn-header-tool):not(.btn-ui):not(.btn-ui-inline):not(.btn-header-logout):not(.app-footer__author) {
  color: var(--brand);
  font-weight: 600;
}

html[data-theme] body.pierini-app .app-content a:not(.btn-primary):not(.btn-ghost):not(.nav-link):not(.btn-header-tool):not(.btn-ui):not(.btn-ui-inline):not(.btn-header-logout):not(.app-footer__author):hover {
  color: var(--brand-hover);
}

/* Admin / tiles / setores */
html[data-theme] body.pierini-app .atv-row > h2,
html[data-theme] body.pierini-app .sector-title,
html[data-theme] body.pierini-app .admin-users-page .admin-user-card__name,
html[data-theme] body.pierini-app .admin-users-page .admin-user-card__login {
  color: var(--text);
}

html[data-theme] body.pierini-app .app-sector-page .admin-users-hint,
html[data-theme] body.pierini-app .admin-users-page .admin-users-hint {
  color: var(--muted);
}

html[data-theme] body.pierini-app .admin-users-page .admin-fieldset {
  border-color: var(--card-border);
  background: color-mix(in srgb, var(--brand-soft) 40%, var(--card-bg));
}

html[data-theme] body.pierini-app .admin-users-page .admin-fieldset > legend {
  color: var(--text);
}

html[data-theme] body.pierini-app code,
html[data-theme] body.pierini-app .tester-code,
html[data-theme] body.pierini-app .tester-row__detail {
  color: var(--text);
  background: color-mix(in srgb, var(--text) 7%, var(--card-bg));
  border-color: var(--card-border);
}

/* Botões de perigo — cor semântica real */
html[data-theme] body.pierini-app .btn-danger,
html[data-theme] body.pierini-app button.btn-danger {
  background: #ff453a;
  color: #ffffff;
  border: 0;
}

html[data-theme] body.pierini-app .btn-danger:hover,
html[data-theme] body.pierini-app button.btn-danger:hover {
  background: #e03e34;
  color: #ffffff;
}

/* Rodapé — créditos mais legíveis no escuro */
html[data-theme="dark"] body.pierini-app .app-footer__credit {
  color: #c8d8f0;
}

html[data-theme] body.pierini-app .app-footer__author.btn-ghost {
  color: var(--brand);
}

/* Login — card sólido e campos visíveis */
html[data-theme] body.login-page .login-card {
  background: var(--card-bg);
  border: 1px solid var(--card-border);
  box-shadow: var(--shadow-card);
  color: var(--text);
}

html[data-theme] body.login-page .login-card input,
html[data-theme] body.login-page .login-card select {
  background: var(--input-bg);
  color: var(--text);
  border-color: var(--card-border);
}

html[data-theme] body.login-page .login-error,
html[data-theme] body.login-page .alert {
  color: var(--alert-text);
}

/* Tabelas zebradas leves para leitura */
html[data-theme] body.pierini-app .data-table tbody tr:nth-child(even) td {
  background: color-mix(in srgb, var(--brand-soft) 35%, var(--card-bg));
}

html[data-theme="dark"] body.pierini-app .data-table tbody tr:nth-child(even) td {
  background: color-mix(in srgb, var(--text) 4%, var(--card-bg));
}

html[data-theme] body.pierini-app .data-table tbody tr:hover td {
  background: color-mix(in srgb, var(--brand) 8%, var(--card-bg));
}