/* WORKBENCH IT — wb-dark.css */
/* Dark theme override — match bot/panel dark mode */
/* Activate via: document.documentElement.setAttribute('data-theme','dark') */

[data-theme="dark"] {
  --bg:          #0d0f1a;
  --bg2:         #131625;
  --bg3:         #111422;
  --border:      #1e2235;
  --text:        #e2e8f0;
  --text2:       #94a3b8;
  --accent:      #4a9eff;
  --accent-hover:#2d85ff;
  --success:     #6ee7b7;
  --warning:     #fcd34d;
  --danger:      #fca5a5;
  --shadow:      rgba(0,0,0,.5);
  --wb-muted:    #94a3b8;
  --wb-success:  #6ee7b7;
  --wb-accent:   #4a9eff;
  --wb-danger:   #fca5a5;
}

[data-theme="dark"] body { background: var(--bg); color: var(--text); }

/* Topbar */
[data-theme="dark"] .wb-topbar {
  background: rgba(13,15,26,.94);
  border-bottom-color: var(--border);
}
[data-theme="dark"] .wb-topbar__logo,
[data-theme="dark"] .wb-topbar__name { color: var(--text); }
[data-theme="dark"] .wb-topbar__app  { color: var(--text2); }
[data-theme="dark"] .wb-topbar__sep  { background: var(--border); }
[data-theme="dark"] .wb-btn-sm       { background: var(--bg3); border-color: var(--border); color: var(--text2); }
[data-theme="dark"] .wb-btn-sm:hover { background: var(--border); color: var(--text); }
[data-theme="dark"] .wb-btn-sm--danger              { color: var(--danger); border-color: var(--danger); background: transparent; }
[data-theme="dark"] .wb-btn-sm--danger:hover        { background: var(--danger); color: #1a1a1a; }

/* Cards */
[data-theme="dark"] .wb-card,
[data-theme="dark"] .wb-app-card     { background: var(--bg2); border-color: var(--border); }
[data-theme="dark"] .wb-app-card__title { color: var(--text); }
[data-theme="dark"] .wb-app-card__desc  { color: var(--text2); }
[data-theme="dark"] .wb-app-card:hover  { background: var(--bg2); box-shadow: 0 4px 24px rgba(0,0,0,.4); }

/* Page */
[data-theme="dark"] .wb-page         { background: var(--bg); }
[data-theme="dark"] .wb-page-header h1 { color: var(--text); }
[data-theme="dark"] .wb-page-header p  { color: var(--text2); }

/* Table */
[data-theme="dark"] .wb-table-wrap   { border-color: var(--border); }
[data-theme="dark"] .wb-table        { background: var(--bg2); color: var(--text); }
[data-theme="dark"] .wb-table th     { background: var(--bg3); color: var(--text2); border-bottom-color: var(--border); }
[data-theme="dark"] .wb-table td     { border-bottom-color: var(--border); }
[data-theme="dark"] .wb-table tr:hover td { background: var(--bg3); }

/* Inputs */
[data-theme="dark"] .wb-input,
[data-theme="dark"] .wb-select       { background: var(--bg2); border-color: var(--border); color: var(--text); }
[data-theme="dark"] .wb-input:focus,
[data-theme="dark"] .wb-select:focus { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(74,158,255,.2); }
[data-theme="dark"] .wb-label        { color: var(--text2); }

/* Buttons (legacy names) */
[data-theme="dark"] .wb-btn--secondary,
[data-theme="dark"] .wb-btn-secondary { background: var(--bg3); color: var(--text); border-color: var(--border); }
[data-theme="dark"] .wb-btn--secondary:hover,
[data-theme="dark"] .wb-btn-secondary:hover { background: var(--border); color: var(--text); }
[data-theme="dark"] .wb-btn--primary,
[data-theme="dark"] .wb-btn-primary   { background: var(--accent); }
[data-theme="dark"] .wb-btn--primary:hover,
[data-theme="dark"] .wb-btn-primary:hover { background: var(--accent-hover); }

/* Alerts */
[data-theme="dark"] .wb-alert--success, [data-theme="dark"] .wb-alert-success
  { background: #14532d; color: #6ee7b7; border-color: #166534; }
[data-theme="dark"] .wb-alert--error, [data-theme="dark"] .wb-alert-error
  { background: #7f1d1d; color: #fca5a5; border-color: #991b1b; }
[data-theme="dark"] .wb-alert--warning
  { background: #78350f; color: #fcd34d; border-color: #92400e; }
[data-theme="dark"] .wb-alert--info
  { background: #1e3a5f; color: #93c5fd; border-color: #1e40af; }

/* Login */
[data-theme="dark"] .login-card     { background: var(--bg2); border-color: var(--border); }
[data-theme="dark"] .login-card .wb-input { background: var(--bg3); }
[data-theme="dark"] .login-logo h1  { color: var(--text); }
[data-theme="dark"] .login-logo p,
[data-theme="dark"] .login-footer   { color: var(--text2); }

/* Admin/users legacy */
[data-theme="dark"] .wb-main-content  { background: var(--bg); }
[data-theme="dark"] .wb-page-title    { color: var(--text); }
[data-theme="dark"] .wb-page-subtitle { color: var(--text2); }
[data-theme="dark"] .wb-card-title    { color: var(--text); }

/* Bootstrap 5 overrides (inventario) */
[data-theme="dark"] .navbar           { background: rgba(13,15,26,.94) !important; border-bottom-color: var(--border) !important; }
[data-theme="dark"] .navbar-brand     { color: var(--text) !important; }
[data-theme="dark"] .nav-link         { color: var(--text2) !important; }
[data-theme="dark"] .nav-link:hover   { color: var(--accent) !important; }
[data-theme="dark"] .card             { background: var(--bg2) !important; border-color: var(--border) !important; color: var(--text) !important; }
[data-theme="dark"] .table            { color: var(--text); }
[data-theme="dark"] .table > :not(caption) > * > * { background-color: var(--bg2); color: var(--text); border-bottom-color: var(--border); }
[data-theme="dark"] .modal-content    { background: var(--bg2); border-color: var(--border); color: var(--text); }
[data-theme="dark"] .form-control,
[data-theme="dark"] .form-select      { background: var(--bg3); border-color: var(--border); color: var(--text); }
[data-theme="dark"] .form-control:focus,
[data-theme="dark"] .form-select:focus{ background: var(--bg3); color: var(--text); border-color: var(--accent); box-shadow: 0 0 0 .25rem rgba(74,158,255,.25); }
[data-theme="dark"] .list-group-item  { background: var(--bg2); border-color: var(--border); color: var(--text); }
[data-theme="dark"] .dropdown-menu    { background: var(--bg2); border-color: var(--border); }
[data-theme="dark"] .dropdown-item    { color: var(--text); }
[data-theme="dark"] .dropdown-item:hover { background: var(--bg3); }
[data-theme="dark"] .bg-light, [data-theme="dark"] .bg-white { background: var(--bg2) !important; }
[data-theme="dark"] .border, [data-theme="dark"] .border-top,
[data-theme="dark"] .border-bottom    { border-color: var(--border) !important; }
[data-theme="dark"] .text-muted       { color: var(--text2) !important; }

/* Aliases adicionales (mismo mapeo que en light, las base vars cambian segun tema) */
[data-theme="dark"] {
  --wb-surface: var(--bg2);
  --wb-border:  var(--border);
  --wb-text:    var(--text);
  --wb-bg:      var(--bg);
}
