/* André OS · migração visual oficial: Shell + Home
   Consome exclusivamente os tokens de andre-os-visual-system-v1.css.
   Não estiliza módulos operacionais como Radar, Chamados ou Expansão. */

/* Estrutura base */
html,
body,
#root,
#pmh-app,
.pmh-main,
.pmh-content {
  color: var(--os-text);
  background-color: var(--os-page);
}

/* Shell desktop */
@media (min-width: 821px) {
  html:not(.aos-mobile) .pmh-main {
    background: var(--os-page);
  }

  html:not(.aos-mobile) .pmh-topbar {
    min-height: 84px;
    padding: var(--os-space-4) var(--os-space-7);
    border-bottom: 1px solid var(--os-border);
    color: var(--os-text);
    background: color-mix(in srgb, var(--os-page) 88%, transparent);
    box-shadow: 0 1px 0 color-mix(in srgb, var(--os-border) 65%, transparent);
  }

  html:not(.aos-mobile) .pmh-topbar h1 {
    color: var(--os-text-strong);
  }

  html:not(.aos-mobile) .pmh-topbar > div:first-child > small {
    color: var(--os-accent);
  }

  html:not(.aos-mobile) .pmh-top-actions label,
  html:not(.aos-mobile) .pmh-top-actions > button {
    border-color: var(--os-border);
    border-radius: var(--os-radius-md);
    color: var(--os-text);
    background: var(--os-surface);
    box-shadow: var(--os-shadow-sm);
  }

  html:not(.aos-mobile) .pmh-top-actions label:focus-within {
    border-color: color-mix(in srgb, var(--os-accent) 52%, var(--os-border));
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--os-accent) 13%, transparent);
  }

  html:not(.aos-mobile) .pmh-top-actions input {
    color: var(--os-text);
  }

  html:not(.aos-mobile) .pmh-top-actions input::placeholder {
    color: var(--os-text-faint);
  }

  html:not(.aos-mobile) .pmh-top-actions > button:hover {
    border-color: color-mix(in srgb, var(--os-accent) 38%, var(--os-border));
    color: var(--os-accent-strong);
    background: var(--os-accent-soft);
  }

  html:not(.aos-mobile) .pmh-content {
    max-width: 1540px;
    padding: var(--os-space-7) var(--os-space-7) 72px;
  }
}

/* Home: hero */
.pmh-hero {
  border-color: color-mix(in srgb, var(--os-accent) 20%, transparent);
  border-radius: var(--os-radius-2xl);
  color: #fff;
  background:
    radial-gradient(circle at 78% 24%, color-mix(in srgb, var(--os-accent) 68%, transparent), transparent 25%),
    radial-gradient(circle at 96% 108%, color-mix(in srgb, var(--os-danger) 22%, transparent), transparent 31%),
    linear-gradient(135deg, var(--os-surface-inverse) 0%, color-mix(in srgb, var(--os-surface-inverse) 72%, var(--os-accent)) 58%, color-mix(in srgb, var(--os-accent) 62%, #20183d) 100%);
  box-shadow: var(--os-shadow-lg);
}

.pmh-hero small {
  color: color-mix(in srgb, #fff 66%, var(--os-accent));
}

.pmh-hero p {
  color: rgba(255, 255, 255, .72);
}

.pmh-hero > button {
  border: 1px solid rgba(255, 255, 255, .24);
  border-radius: var(--os-radius-md);
  color: var(--os-text-strong);
  background: #fff;
  box-shadow: var(--os-shadow-md);
}

/* Home: superfícies compartilhadas */
.pmh-section-head,
.pmh-metric,
.pmh-shortcuts > button,
.pmh-panel,
.pmh-projects {
  border-color: var(--os-border);
  color: var(--os-text);
  background: var(--os-surface);
  box-shadow: var(--os-shadow-sm);
}

.pmh-section-head {
  border-radius: var(--os-radius-xl);
  background: linear-gradient(145deg, var(--os-surface), var(--os-surface-subtle));
}

.pmh-section-head h2,
.pmh-panel h3,
.pmh-projects h3,
.pmh-metric strong,
.pmh-shortcuts strong {
  color: var(--os-text-strong);
}

.pmh-section-head p,
.pmh-metric small,
.pmh-shortcuts span,
.pmh-list small,
.pmh-list time {
  color: var(--os-text-muted);
}

.pmh-metric {
  border-radius: var(--os-radius-lg);
}

.pmh-metric::after {
  background: var(--metric-soft, var(--os-surface-subtle));
}

.pmh-metric:hover,
.pmh-shortcuts > button:hover {
  border-color: color-mix(in srgb, var(--os-accent) 30%, var(--os-border));
  background: var(--os-surface-raised);
  box-shadow: var(--os-shadow-md);
}

.pmh-shortcuts > button {
  border-radius: var(--os-radius-lg);
}

.pmh-shortcuts i {
  border-radius: var(--os-radius-md);
  color: var(--os-accent);
  background: var(--os-accent-soft);
}

.pmh-panel,
.pmh-projects {
  border-radius: var(--os-radius-xl);
}

.pmh-list button {
  border-bottom-color: var(--os-border);
  color: var(--os-text);
}

.pmh-list button:hover {
  background: var(--os-surface-subtle);
}

.pmh-list strong {
  color: var(--os-text);
}

/* Mensagens globais visíveis na Home */
.pmh-loading,
.pmh-empty {
  border-color: var(--os-border-strong);
  border-radius: var(--os-radius-lg);
  color: var(--os-text-muted);
  background: var(--os-surface-subtle);
}

.pmh-alert {
  border-color: color-mix(in srgb, var(--os-danger) 42%, var(--os-border));
  border-radius: var(--os-radius-md);
  color: var(--os-danger);
  background: var(--os-danger-soft);
}

@media (max-width: 820px) {
  .pmh-section-head,
  .pmh-metric,
  .pmh-shortcuts > button,
  .pmh-panel,
  .pmh-projects {
    border-radius: var(--os-radius-lg);
  }
}