/* =============================================================
   NETBYNET DESIGN SYSTEM — shared/static/nbn-theme.css
   Importado por TODOS os apps do monorepo.
   Não editar por projeto: alterações aqui afetam todos.
============================================================= */

/* ── Tokens ──────────────────────────────────────────────── */
:root {
  --nbn-orange:       #ff6900;
  --nbn-orange-soft:  #fff0e5;
  --nbn-orange-glow:  rgba(255, 105, 0, 0.35);
  --nbn-orange-hover: #f7611a;
  --nbn-red:          #6b0608;
  --nbn-blue:         #00509b;
  --nbn-blue-soft:    #e8f0fa;
  --nbn-black:        #232323;
  --nbn-muted:        #4a4a4a;
  --nbn-gray:         #e9e9e9;
  --nbn-bg:           #f7f7f7;
  --nbn-card:         #ffffff;
  --nbn-radius:       12px;
  --nbn-shadow:       0 2px 12px rgba(35, 35, 35, 0.09);
}

/* ── Base ────────────────────────────────────────────────── */
* {
  font-family: "Manrope", sans-serif;
  box-sizing: border-box;
}

body {
  background:
    radial-gradient(circle at 8%   0%,  #ffe1cc 0%, transparent 42%),
    radial-gradient(circle at 92%  15%, #cce1f4 0%, transparent 44%),
    var(--nbn-bg);
  color: var(--nbn-black);
  min-height: 100vh;
}

/* ── Top bar ─────────────────────────────────────────────── */
.nbn-topbar {
  background: linear-gradient(
    90deg,
    rgba(35, 35, 35, 0.97) 0%,
    rgba(0, 80, 155, 0.93) 100%
  );
  border-bottom: 2px solid var(--nbn-orange-glow);
  backdrop-filter: blur(10px);
  position: sticky;
  top: 0;
  z-index: 1030;
}

.nbn-topbar .navbar-brand {
  font-weight: 800;
  font-size: 1.2rem;
  letter-spacing: 0.03em;
  color: #f7f7f7 !important;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
}

.nbn-topbar .brand-net    { color: var(--nbn-orange) !important; }
.nbn-topbar .brand-app    { color: #f7f7f7; }
.nbn-topbar .brand-sep    { color: #d0d8e4; font-weight: 300; margin: 0 .4rem; }
.nbn-brand-logo {
  height: 34px;
  width: auto;
  display: block;
}

.nbn-topbar .nav-link              { color: #d8dde2 !important; font-size: 0.88rem; }
.nbn-topbar .nav-link:hover        { color: #fff !important; text-shadow: 0 0 8px var(--nbn-orange-glow); }
.nbn-topbar .nav-link.active       { color: #fff !important; border-bottom: 2px solid var(--nbn-orange); }
.nbn-topbar .text-secondary        { color: #d8dde2 !important; }

/* Avatar pill */
.nbn-avatar {
  width: 32px; height: 32px; border-radius: 50%;
  background: var(--nbn-orange); color: #fff;
  font-size: 0.75rem; font-weight: 700;
  display: inline-flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.nbn-avatar-sm {
  width: 28px;
  height: 28px;
  font-size: 0.68rem;
}

/* ── Breadcrumb bar ─────────────────────────────────────── */
.nbn-breadbar {
  background: rgba(255, 255, 255, 0.72);
  border-bottom: 1px solid var(--nbn-gray);
  backdrop-filter: blur(6px);
  font-size: 0.82rem;
  padding: 0.45rem 0;
}
.nbn-breadbar .breadcrumb           { margin: 0; }
.nbn-breadbar .breadcrumb-item a    { color: var(--nbn-blue); text-decoration: none; }
.nbn-breadbar .breadcrumb-item.active { color: var(--nbn-muted); }

/* ── App shell ──────────────────────────────────────────── */
.nbn-shell {
  max-width: 1400px;
  margin: 0 auto;
  padding: 2rem 1.5rem;
}

/* ── Back-to-hub pill ───────────────────────────────────── */
.nbn-hub-back {
  display: inline-flex; align-items: center; gap: 0.4rem;
  background: var(--nbn-card); border: 1.5px solid var(--nbn-gray);
  border-radius: 99px; padding: 0.25rem 0.9rem; font-size: 0.8rem;
  color: var(--nbn-muted); text-decoration: none;
  transition: border-color 0.15s, color 0.15s;
}
.nbn-hub-back:hover { border-color: var(--nbn-orange); color: var(--nbn-orange); }

/* ── Page title ─────────────────────────────────────────── */
.nbn-page-title         { font-size: 1.6rem; font-weight: 800; }
.nbn-page-title span    { color: var(--nbn-orange); }
.nbn-page-subtitle      { color: var(--nbn-muted); font-size: 0.93rem; margin-top: 0.2rem; }
.nbn-section-label {
  font-size: 0.72rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: 0.08em; color: var(--nbn-muted); margin-bottom: 1rem;
}

.hub-user-summary {
  min-width: 220px;
  padding: 1rem 1.15rem;
  background: linear-gradient(180deg, rgba(255,255,255,0.96) 0%, rgba(248,249,250,0.96) 100%);
}

.hub-admin-note {
  min-width: 280px;
  padding: 1rem 1.15rem;
  background: linear-gradient(180deg, rgba(255,255,255,0.96) 0%, rgba(255,247,242,0.96) 100%);
}

/* ── Cards ───────────────────────────────────────────────── */
.nbn-card {
  background: var(--nbn-card);
  border-radius: var(--nbn-radius);
  border: 1.5px solid var(--nbn-gray);
  box-shadow: var(--nbn-shadow);
  padding: 1.5rem;
}

/* KPI card (valor grande + label) */
.nbn-kpi {
  background: var(--nbn-card);
  border-radius: var(--nbn-radius);
  border: 1.5px solid var(--nbn-gray);
  box-shadow: var(--nbn-shadow);
  padding: 1.25rem 1.75rem;
}
.nbn-kpi-value   { font-size: 1.7rem; font-weight: 800; color: var(--nbn-orange); }
.nbn-kpi-label   { font-size: 0.78rem; color: var(--nbn-muted); margin-top: 0.1rem; }

/* Table card */
.nbn-table-card {
  background: var(--nbn-card);
  border-radius: var(--nbn-radius);
  border: 1.5px solid var(--nbn-gray);
  box-shadow: var(--nbn-shadow);
  overflow: hidden;
}

/* App launcher card (hub) */
.nbn-app-card {
  background: var(--nbn-card);
  border-radius: var(--nbn-radius);
  border: 1.5px solid var(--nbn-gray);
  box-shadow: var(--nbn-shadow);
  padding: 1.75rem;
  transition: transform 0.18s, box-shadow 0.18s, border-color 0.18s;
  cursor: pointer; text-decoration: none; color: inherit; display: block;
}
.nbn-app-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 28px rgba(35, 35, 35, 0.14);
  border-color: var(--nbn-orange); color: inherit;
}
.nbn-app-card.is-locked {
  opacity: 0.74;
}
.nbn-app-card.is-locked:hover {
  transform: translateY(-2px);
}
.nbn-app-card .app-icon {
  width: 52px; height: 52px; border-radius: 14px;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.5rem; margin-bottom: 1rem;
}
.nbn-app-card .app-icon.orange { background: var(--nbn-orange-soft); color: var(--nbn-orange); }
.nbn-app-card .app-icon.blue   { background: var(--nbn-blue-soft);   color: var(--nbn-blue); }
.nbn-app-card .app-icon.red    { background: #fce8e8; color: var(--nbn-red); }
.nbn-app-card .app-icon.teal   { background: #e6faf4; color: #0d7055; }

.nbn-app-card h5 { font-weight: 700; font-size: 1.05rem; margin-bottom: 0.3rem; }
.nbn-app-card p  { color: var(--nbn-muted); font-size: 0.87rem; margin: 0; line-height: 1.5; }

.nbn-tag { display: inline-block; font-size: 0.72rem; font-weight: 600; padding: 0.18rem 0.6rem; border-radius: 99px; margin-top: 0.75rem; }
.nbn-tag.live    { background: #d4edda; color: #0d5c2f; }
.nbn-tag.preview { background: #fff3cd; color: #6d4c00; }
.nbn-tag.planned { background: var(--nbn-gray); color: var(--nbn-muted); }
.nbn-tag.locked  { background: #f3e6e8; color: var(--nbn-red); }
.nbn-tag.neutral { background: #eef1f4; color: var(--nbn-muted); }

.hub-edit-row {
  background: linear-gradient(180deg, rgba(248,249,250,0.95) 0%, rgba(255,255,255,0.95) 100%);
}

/* ── Sidebar (layout interno dos apps) ──────────────────── */
.nbn-sidebar {
  background: var(--nbn-card);
  border-right: 2px solid var(--nbn-gray);
  height: calc(100vh - 112px);
  padding: 1.25rem 0;
  width: 220px;
  flex-shrink: 0;
  position: sticky;
  top: 112px;
  overflow-y: auto;
}
.nbn-sidebar .sidebar-section {
  font-size: 0.68rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: 0.08em; color: #aaa; padding: 0.75rem 1.25rem 0.3rem;
}
.nbn-sidebar .nav-link {
  color: var(--nbn-black); padding: 0.48rem 1.25rem; font-size: 0.88rem;
  display: flex; align-items: center; gap: 0.55rem;
}
.nbn-sidebar .nav-link:hover { color: var(--nbn-orange); background: var(--nbn-orange-soft); }
.nbn-sidebar .nav-link.active {
  color: var(--nbn-orange); background: var(--nbn-orange-soft);
  border-right: 3px solid var(--nbn-orange); font-weight: 600;
}

/* ── Tables ──────────────────────────────────────────────── */
.nbn-table { font-size: 0.87rem; }
.nbn-table thead th {
  background: var(--nbn-gray); color: var(--nbn-muted);
  font-size: 0.78rem; text-transform: uppercase; letter-spacing: 0.04em;
  font-weight: 700; padding: 0.85rem 1rem;
}
.nbn-table tbody td { padding: 0.85rem 1rem; vertical-align: middle; }

/* ── Buttons ─────────────────────────────────────────────── */
.btn-nbn {
  background: var(--nbn-orange); color: #fff; border: none; font-weight: 600;
}
.btn-nbn:hover { background: var(--nbn-orange-hover); color: #fff; }

.btn-outline-nbn {
  border: 1.5px solid var(--nbn-blue); color: var(--nbn-blue); background: transparent;
}
.btn-outline-nbn:hover { background: var(--nbn-blue-soft); color: var(--nbn-blue); }

/* ── Status badges ───────────────────────────────────────── */
.badge-status-draft,
.nbn-badge-draft             { background: #6c757d; color: #fff; }
.badge-status-pending_technical,
.nbn-badge-pending_technical { background: var(--nbn-blue); color: #fff; }
.badge-status-hold_deskmanager,
.nbn-badge-hold_deskmanager { background: #6c757d; color: #fff; }
.badge-status-pending_reimport,
.nbn-badge-pending_reimport { background: #0dcaf0; color: #08313a; }
.badge-status-pending_deskmanager,
.nbn-badge-pending_deskmanager { background: #ffd166; color: #533100; }
.badge-status-reimported_pending_technical,
.nbn-badge-reimported_pending_technical { background: #20c997; color: #073b33; }
.badge-status-pending_financial,
.nbn-badge-pending_financial { background: #ffd166; color: #533100; }
.badge-status-pending_client,
.nbn-badge-pending_client    { background: #fd7e14; color: #fff; }
.badge-status-approved,
.nbn-badge-approved          { background: #198754; color: #fff; }
.badge-status-rejected,
.nbn-badge-rejected          { background: #dc3545; color: #fff; }
.badge-status-billed,
.nbn-badge-billed            { background: var(--nbn-black); color: #fff; }
.nbn-badge-review            { background: #fd7e14; color: #fff; }

/* ── Activity feed ───────────────────────────────────────── */
.nbn-activity-feed { list-style: none; padding: 0; margin: 0; }
.nbn-activity-feed li {
  display: flex; gap: 0.9rem; align-items: flex-start;
  padding: 0.75rem 0; border-bottom: 1px solid var(--nbn-gray);
}
.nbn-activity-feed li:last-child { border-bottom: none; }
.nbn-activity-dot {
  width: 10px; height: 10px; border-radius: 50%; margin-top: 0.35rem; flex-shrink: 0;
}
.nbn-activity-dot.orange { background: var(--nbn-orange); }
.nbn-activity-dot.blue   { background: var(--nbn-blue); }
.nbn-activity-dot.green  { background: #198754; }
.nbn-activity-meta { font-size: 0.8rem; color: var(--nbn-muted); margin-top: 0.1rem; }

/* ── Flash messages ──────────────────────────────────────── */
.nbn-flash-success { border: none; box-shadow: var(--nbn-shadow); }
.nbn-flash-error   { border: none; box-shadow: var(--nbn-shadow); }

/* ── Alerts override ─────────────────────────────────────── */
.alert { border: none; box-shadow: var(--nbn-shadow); }