/* mc-brand.css — Machine Commerce brand identity override */

/* ── CSS variable overrides ────────────────────────────────────────────────── */
:root {
  /* Colors only — fonts left as original */
  --color-background:      #F1E8D2;
  --color-surface:         #FAF6EC;
  --color-text-primary:    #10251A;
  --color-text-secondary:  #10251A8C;
  --color-accent:          #18883C;
  --color-button:          #06451F;
  --color-border:          #10251A1A;
  --color-dark:            #06451F;
}

/* ── bg-background ─────────────────────────────────────────────────────────── */
/* Some elements use bg-background class which maps to var(--color-background) */
html, body {
  background-color: #F1E8D2 !important;
}

/* ── Hardcoded accent color overrides ──────────────────────────────────────── */
/* These compiled Tailwind classes have literal #2200ff — must override by class */
.border-accent\/40  { border-color: rgba(24,136,60,0.40) !important; }
.border-accent\/50  { border-color: rgba(24,136,60,0.50) !important; }
.border-accent\/70  { border-color: rgba(24,136,60,0.70) !important; }
.bg-accent\/5       { background-color: rgba(24,136,60,0.05) !important; }
.bg-accent\/\[0\.04\] { background-color: rgba(24,136,60,0.04) !important; }
.bg-accent\/\[0\.05\] { background-color: rgba(24,136,60,0.05) !important; }
.bg-accent\/\[0\.06\] { background-color: rgba(24,136,60,0.06) !important; }
.text-accent\/70    { color: rgba(24,136,60,0.70) !important; }
.text-accent\/80    { color: rgba(24,136,60,0.80) !important; }
.decoration-accent\/30 { text-decoration-color: rgba(24,136,60,0.30) !important; }
.hover\:bg-accent\/10:hover  { background-color: rgba(24,136,60,0.10) !important; }
.hover\:bg-accent\/\[0\.12\]:hover { background-color: rgba(24,136,60,0.12) !important; }

/* ── text-accent hover and focus states ────────────────────────────────────── */
.hover\:text-accent:hover { color: #18883C !important; }
.focus\:text-accent:focus { color: #18883C !important; }

/* ── Dark header bars and buttons ──────────────────────────────────────────── */
/* bg-dark class and direct dark-background elements */
.bg-dark, [style*="background:#191919"], [style*="background: #191919"] {
  background-color: #06451F !important;
}

/* ── Nav active bar ────────────────────────────────────────────────────────── */
/* The bar line in the sidebar nav */
.bg-accent {
  background-color: #18883C !important;
}

/* ── Borders ───────────────────────────────────────────────────────────────── */
.border-accent {
  border-color: #18883C !important;
}

/* ── Underline decorations ─────────────────────────────────────────────────── */
.decoration-accent {
  text-decoration-color: #18883C !important;
}

/* ── Selection highlight ───────────────────────────────────────────────────── */
::selection {
  background-color: rgba(24,136,60,0.2);
  color: #10251A;
}

/* ── Vertical column lines — make visible on parchment background ──────────── */
.bg-\(--color-border\) {
  background-color: rgba(16,37,26,0.28) !important;
}
/* Border-border utility used for column line spans in some grids */
.border-border { border-color: rgba(16,37,26,0.28) !important; }

/* ── Product/Service cards — off-white plate that reads against parchment ───── */
/* backdrop-filter is invisible on flat backgrounds; use solid card style instead */
.mc-card {
  background: #FAF6EC !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border: 1px solid rgba(16,37,26,0.12) !important;
  box-shadow: 0 1px 0 rgba(255,255,255,0.9) inset, 0 2px 12px rgba(16,37,26,0.06) !important;
}
