/*
 * This is a manifest file that'll be compiled into application.css.
 *
 * With Propshaft, assets are served efficiently without preprocessing steps. You can still include
 * application-wide styles in this file, but keep in mind that CSS precedence will follow the standard
 * cascading order, meaning styles declared later in the document or manifest will override earlier ones,
 * depending on specificity.
 *
 * Consider organizing styles into separate files for maintainability.
 */

/* Task Registry Admin Panel Theme Variables */
@import "admin/rg_theme_variables.css";

/* AI Providers Admin Panel Theme Variables */
@import "admin/ai_providers_theme_variables.css";

/* Admin Foundation Variables */
@import "admin/shared_admin_foundation.css";

/* AI Assistant Module Styles */
@import "admin/ai_admin_module.css";

/* Navigation Sidebar Components */
@import "components/navigation_sidebar.css";
@import "components/admin_sidebar.css";

:root {
  --color-primary: #6C4DFF;
  --color-black: #1c2434;
  --color-white: #fff;
  --color-whiter: #f7f9fc;
  --color-body: #64748b;
  --color-bodydark: #aeb7c0;
  --color-bodydark1: #dee4ee;
  --color-bodydark2: #8a99af;
  --color-stroke: #e2e8f0;
  --color-strokedark: #2e3a47;
  --color-graydark: #333a48;
  --color-boxdark: #24303f;
  --color-meta-4: #313d4a;
  --color-meta-2: #eff4fb;
  --color-meta-3: #10b981;
  --color-meta-5: #fd5812;
  --color-success: #219653;
  --color-warning: #d97706;
  --color-danger: #dc2626;
}

[data-theme="dark"] {
  --color-whiter: #1a222c;
  --color-body: #8a99af;
}

/* Custom utility classes with high priority */
.text-primary {
  color: var(--color-primary);
}

.bg-primary {
  background-color: var(--color-primary);
}

.border-primary {
  border-color: var(--color-primary);
}

.text-body {
  color: var(--color-body);
}

.bg-whiter {
  background-color: var(--color-whiter);
}

.border-stroke {
  border-color: var(--color-stroke);
}

.text-black {
  color: var(--color-black);
}

.hover\:text-primary:hover {
  color: var(--color-primary);
}

.hover\:bg-primary\/90:hover {
  background-color: color-mix(in srgb, var(--color-primary) 90%, transparent);
}

/* Default body styles - can be overridden by Tailwind classes */
body.landing-page {
  background-color: white;
  color: var(--color-black);
}