/**
 * Platinum Creative Hub — tipografia e tokens de marca
 * Manual 2026: Avenir Regular / Medium / Black
 * Guia: manual-marca-platinum/GUIA-DESENVOLVIMENTO-VISUAL.md
 */

@font-face {
  font-family: 'Avenir';
  src: url('../assets/fonts/Avenir%20Regular/Avenir%20Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Avenir';
  src: url('../assets/fonts/Avenir%20Regular/Avenir%20Regular.ttf') format('truetype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Avenir';
  src: url('../assets/fonts/Avenir%20Regular/Avenir%20Regular.ttf') format('truetype');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Avenir';
  src: url('../assets/fonts/Avenir%20Black/Avenir%20Black.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Avenir';
  src: url('../assets/fonts/Avenir%20Black/Avenir%20Black.ttf') format('truetype');
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Avenir';
  src: url('../assets/fonts/Avenir%20Black/Avenir%20Black.ttf') format('truetype');
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

:root {
  /* —— Cores oficiais (Manual 2026) —— */
  --color-black: #101010;
  --color-orange: #fc8013;
  --color-yellow: #ffba04;
  --color-red-orange: #ef451a;
  --color-bg: #f7f5f1;
  --color-wordmark: #003138;
  --color-white-warm: #fffffa;
  --color-red-gradient: #e8463c;

  /* —— Premium dark surfaces —— */
  --pt-surface-0: #0e0e0e;
  --pt-surface-1: #141414;
  --pt-surface-2: #1a1a1a;
  --pt-surface-3: #222222;
  --pt-border: rgba(255, 255, 255, 0.08);
  --pt-border-strong: rgba(255, 255, 255, 0.12);
  --pt-text: #ececec;
  --pt-text-muted: #a8a8a8;
  --pt-glow-orange: 0 4px 18px rgba(252, 128, 19, 0.35);
  --pt-gradient-brand: linear-gradient(135deg, var(--color-orange) 0%, var(--color-yellow) 100%);
  --pt-gradient-accent-bar: linear-gradient(90deg, var(--color-orange) 0%, var(--color-yellow) 45%, var(--color-red-orange) 100%);
  --pt-bg-radial: radial-gradient(1200px 600px at 85% -20%, rgba(252, 128, 19, 0.18), transparent 55%), var(--pt-surface-1);

  /* —— Aliases de migração (legado dashboard.css) —— */
  --green-1: #c46200;
  --green-2: #e56b00;
  --green-3: var(--color-orange);
  --green-4: var(--color-orange);
  --black-2: var(--pt-surface-1);
  --black-3: var(--pt-surface-2);
  --black-4: var(--pt-surface-3);
  --black-5: #434343;
  --platinum-bg: var(--pt-bg-radial);
  --platinum-surface: var(--pt-surface-2);
  --platinum-surface-2: var(--pt-surface-3);
  --platinum-border: rgba(255, 255, 255, 0.1);
  --platinum-text-muted: var(--pt-text-muted);

  --font-brand: 'Avenir', 'Nunito Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --sidebar-width: 240px;
  --header-height: 60px;
  --padding-fluid: 2rem;
  --pt-radius-sm: 8px;
  --pt-radius-md: 14px;
  --pt-radius-lg: 16px;

  /* Scrollbar */
  --pt-scrollbar-size: 10px;
  --pt-scrollbar-track: var(--color-black);
  --pt-scrollbar-thumb: #353535;
  --pt-scrollbar-thumb-hover: var(--color-orange);
}

body {
  font-family: var(--font-brand);
}

/* —— seta-platinum (raio oficial) —— */
.pt-seta {
  display: block;
  flex-shrink: 0;
  width: auto;
  height: var(--pt-seta-size, 36px);
  object-fit: contain;
  transition: transform 0.2s ease, filter 0.2s ease;
}

a:hover .pt-seta,
a:focus-visible .pt-seta,
.inicio-module-card:hover .pt-seta {
  filter: brightness(1.12) drop-shadow(0 2px 8px rgba(252, 128, 19, 0.45));
  transform: translateX(2px) scale(1.05);
}

.inicio-module-card__arrow {
  position: absolute;
  right: 1rem;
  bottom: 1rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 0;
}

.fin-slice-link__seta {
  margin-left: auto;
  flex-shrink: 0;
}

/* —— btn-primary (marca) —— */
.btn-primary {
  background: var(--color-orange);
  color: var(--color-white-warm);
  border: none;
}

.btn-primary:hover {
  background: var(--color-yellow);
  color: var(--color-black);
}

/* —— Avatar sidebar (marca, não roxo) —— */
.inicio-sidebar__avatar {
  background: var(--pt-gradient-brand) !important;
  color: var(--color-black) !important;
}

/* —— Scrollbar Platinum (WebKit + Firefox) —— */
body.is-platinum-shell.inicio-theme-dark {
  --pt-scrollbar-track: #0e0e0e;
  --pt-scrollbar-thumb: #3a3a3a;
}

body.is-platinum-shell:not(.inicio-theme-dark) {
  --pt-scrollbar-track: #e8e6e2;
  --pt-scrollbar-thumb: #c4c0b8;
  --pt-scrollbar-thumb-hover: var(--color-orange);
}

html:has(body.is-platinum-shell),
body.is-platinum-shell,
body.is-platinum-shell .inicio-main,
body.is-platinum-shell .inicio-sidebar__nav,
body.is-platinum-shell .table-responsive,
body.is-platinum-shell .claude-panel__body,
body.is-platinum-shell .dash-content {
  scrollbar-width: thin;
  scrollbar-color: var(--pt-scrollbar-thumb-hover) var(--pt-scrollbar-track);
}

body.is-platinum-shell ::-webkit-scrollbar {
  width: var(--pt-scrollbar-size);
  height: var(--pt-scrollbar-size);
}

body.is-platinum-shell ::-webkit-scrollbar-track {
  background: var(--pt-scrollbar-track);
}

body.is-platinum-shell ::-webkit-scrollbar-thumb {
  background: var(--pt-scrollbar-thumb);
  border-radius: 999px;
  border: 2px solid var(--pt-scrollbar-track);
  min-height: 48px;
}

body.is-platinum-shell ::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, var(--color-orange) 0%, var(--color-yellow) 100%);
}

body.is-platinum-shell ::-webkit-scrollbar-thumb:active {
  background: var(--color-yellow);
}

body.is-platinum-shell ::-webkit-scrollbar-button,
body.is-platinum-shell ::-webkit-scrollbar-button:single-button,
body.is-platinum-shell ::-webkit-scrollbar-button:vertical:start:decrement,
body.is-platinum-shell ::-webkit-scrollbar-button:vertical:end:increment {
  display: none;
  width: 0;
  height: 0;
}

body.is-platinum-shell ::-webkit-scrollbar-corner {
  background: var(--pt-scrollbar-track);
}