/* ==========================================================================
   AUTO PROD BOT — Theme App (Light)
   Tema para páginas da aplicação: dashboard, admin, features
   Herda variáveis de tokens.css
   ========================================================================== */

/* Tema App usa os defaults de tokens.css (já são light).
   Este arquivo contém overrides e ajustes específicos do tema light. */

/* -----------------------------------------------------------------------
   NAVBAR
   ----------------------------------------------------------------------- */
.navbar {
  background: linear-gradient(135deg, var(--color-primary), var(--color-primary-light));
  box-shadow: var(--shadow-md);
}

.navbar-brand {
  font-size: var(--text-md);
  font-weight: var(--font-bold);
  color: #fff !important;
}

.navbar .nav-link {
  color: rgba(255, 255, 255, 0.85) !important;
  font-size: var(--text-sm);
  font-weight: var(--font-medium);
  padding: var(--space-2) var(--space-3);
  border-radius: var(--radius-sm);
  transition: all var(--transition-fast);
}

.navbar .nav-link:hover,
.navbar .nav-link.active {
  color: #fff !important;
  background: rgba(255, 255, 255, 0.15);
}

/* -----------------------------------------------------------------------
   PAGE LAYOUT
   ----------------------------------------------------------------------- */
.container,
.container-fluid {
  padding-left: var(--space-4);
  padding-right: var(--space-4);
}

/* -----------------------------------------------------------------------
   STATUS INDICATORS
   ----------------------------------------------------------------------- */
.status-online {
  color: var(--color-success);
}

.status-offline {
  color: var(--color-danger);
}

/* -----------------------------------------------------------------------
   LOG ENTRIES (colored left border)
   ----------------------------------------------------------------------- */
.log-sucesso {
  border-left: 4px solid var(--color-success);
}

.log-erro {
  border-left: 4px solid var(--color-danger);
}

.log-info {
  border-left: 4px solid var(--color-info);
}

.log-debug {
  border-left: 4px solid var(--color-warning);
}

/* -----------------------------------------------------------------------
   LOG ROW BACKGROUNDS
   ----------------------------------------------------------------------- */
.log-row-erro {
  background-color: rgba(220, 53, 69, 0.08);
}

.log-row-sucesso {
  background-color: rgba(40, 167, 69, 0.08);
}

.log-row-debug {
  background-color: rgba(255, 193, 7, 0.08);
}

.log-row-info {
  background-color: rgba(13, 202, 240, 0.08);
}

/* -----------------------------------------------------------------------
   CONSOLE COLORS
   ----------------------------------------------------------------------- */
.stats-playstation { color: var(--color-console-playstation); }
.stats-nintendo    { color: var(--color-console-nintendo); }
.stats-xbox        { color: var(--color-console-xbox); }
.stats-pc          { color: var(--color-console-pc); }
.stats-outros      { color: var(--color-console-outros); }
.stats-grupos      { color: #6f42c1; }

/* -----------------------------------------------------------------------
   TABLES
   ----------------------------------------------------------------------- */
.table {
  font-size: var(--text-sm);
}

.table th {
  font-weight: var(--font-semibold);
  color: var(--color-text-secondary);
  border-bottom-width: 2px;
}

.table td {
  vertical-align: middle;
}

.table-hover tbody tr:hover {
  background-color: var(--color-bg-hover);
}

/* -----------------------------------------------------------------------
   SEARCH HIGHLIGHT
   ----------------------------------------------------------------------- */
.search-highlight {
  background-color: var(--color-warning-light);
  border-radius: 2px;
  padding: 1px 2px;
}

/* -----------------------------------------------------------------------
   MOBILE RESPONSIVE (App theme)
   ----------------------------------------------------------------------- */
@media (max-width: 768px) {
  .container,
  .container-fluid {
    padding-left: var(--space-3);
    padding-right: var(--space-3);
  }

  .navbar-brand {
    font-size: var(--text-base);
  }

  .navbar .nav-link {
    font-size: var(--text-sm);
    padding: var(--space-1) var(--space-2);
  }

  h1, .h1 { font-size: var(--text-xl); }
  h2, .h2 { font-size: var(--text-lg); }
  h3, .h3 { font-size: var(--text-md); }

  .table {
    font-size: var(--text-xs);
  }
}

@media (max-width: 576px) {
  .container,
  .container-fluid {
    padding-left: var(--space-2);
    padding-right: var(--space-2);
  }

  h1, .h1 { font-size: var(--text-lg); }
}