/* Loaded AFTER metronic-scoped.css so these win in the cascade */

/* ------------ Buttons (brand-safe hovers) ------------ */
.gxpin-metronic .btn.btn-primary:hover,
.gxpin-metronic .btn.btn-primary:focus,
.gxpin-metronic .btn.btn-primary:active,
.gxpin-metronic .btn-primary:hover:not(.btn-active):not([disabled]) {
  background-color: #1a4d4d !important; /* darker brand green */
  border-color: #1a4d4d !important;
  color: #ffffff !important;
}

.gxpin-metronic .btn.btn-light:hover,
.gxpin-metronic .btn.btn-light:focus,
.gxpin-metronic .btn.btn-light:active,
.gxpin-metronic .btn-light:hover:not(.btn-active):not([disabled]) {
  background-color: #e5e7eb !important; /* darker grey */
  border-color: #e5e7eb !important;
  color: #111827 !important;
}

/* ------------ Cards (use theme tokens correctly) ------------ */
.gxpin-metronic .card {
  background-color: hsl(var(--background)) !important;
  color: hsl(var(--foreground)) !important;
  border-color: hsl(var(--border)) !important;
}

/* Ensure body follows card background (Metronic sometimes paints it white) */
.gxpin-metronic .card .card-body {
  background-color: inherit !important;
}

/* Common text elements inside cards */
.gxpin-metronic .card .card-title,
.gxpin-metronic .card .card-text,
.gxpin-metronic .card h1,
.gxpin-metronic .card h2,
.gxpin-metronic .card h3,
.gxpin-metronic .card h4,
.gxpin-metronic .card h5,
.gxpin-metronic .card h6,
.gxpin-metronic .card p,
.gxpin-metronic .card dd,
.gxpin-metronic .card dt {
  color: hsl(var(--foreground)) !important;
}

/* Neutralize Bootstrap's forced light backgrounds if they sneak in */
.gxpin-metronic .bg-white,
.gxpin-metronic .bg-light {
  background-color: hsl(var(--background)) !important;
  color: hsl(var(--foreground)) !important;
}

/* Alerts inside scoped Metronic */
.gxpin-metronic .alert {
  background-color: hsl(var(--background)) !important;
  color: hsl(var(--foreground)) !important;
  border-color: hsl(var(--border)) !important;
}

/* Typography inside the article (Tailwind prose) */
.gxpin-metronic .prose {
  --tw-prose-body: hsl(var(--foreground));
  --tw-prose-headings: hsl(var(--foreground));
  --tw-prose-lead: hsl(var(--foreground));
  --tw-prose-links: #226160;
  --tw-prose-bold: hsl(var(--foreground));
  --tw-prose-bullets: hsl(var(--foreground));
  --tw-prose-counters: hsl(var(--foreground));
  --tw-prose-hr: hsl(var(--border));
  --tw-prose-th-borders: hsl(var(--border));
  --tw-prose-td-borders: hsl(var(--border));
}

/* Muted text inside cards uses your token */
.gxpin-metronic .card .text-muted,
.gxpin-metronic .card .text-gray-600,
.gxpin-metronic .card .text-gray-700 {
  color: hsl(var(--muted-foreground)) !important;
}

/* Softer card border (light grey, adapts to theme) */
.gxpin-metronic .card.border {
  border-color: hsl(var(--border)) !important;
}

/* Force Metronic/Bootstrap card border to your token */
.gxpin-metronic .card,
.gxpin-metronic .card.border {
  --bs-border-color: hsl(var(--border)) !important;
  border-color: hsl(var(--border)) !important; /* belt & braces */
}

/* Force a consistent light grey outline on Metronic cards */
.gxpin-metronic .card,
.gxpin-metronic .card.border {
  border-width: 1px !important;
  border-style: solid !important;
  border-color: #e5e7eb !important;   /* Tailwind gray-200 */
  --bs-border-color: #e5e7eb !important;
}