@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600&display=swap');
/* ===== MODERN COMMERCE BRAND THEME ===== */
/* Google Fonts — must be first */
/* Colour variables */
:root {
  --primary: #2C2416;
  --secondary: #D4A574;
  --accent: #FAF7F2;
  --highlight: #D4A574;
  --bg-light: #FAF7F2;
  --text-primary: #2C2416;
  --text-light: #FAF7F2;
  --color-brand: #D4A574;
}
/* Typography — body */
body, p, li, td, input, textarea, select {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
  color: #8B7355;
}
/* Typography — headings */
h1, h2, h3, h4, h5, h6,
.home-header h1,
.portal-header h1,
.hero-title,
.welcome-title,
[class*="title"],
[class*="heading"] {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
  font-weight: 300 !important;
  color: #2C2416 !important;
  letter-spacing: -2px;
}
/* Hero banner — light text on dark background */
.home-header h1,
.hero-title,
.welcome-title,
[class*="HomeHeader"] h1,
[class*="heroTitle"],
[class*="welcomeTitle"] {
  color: #FAF7F2 !important;
}
/* Hero subtext */
.home-header p,
.hero-subtitle,
[class*="HomeHeader"] p,
[class*="heroSubtitle"],
[class*="subtitle"] {
  color: #D4A574 !important;
}
/* Nav / header background */
.header, .portal-header {
  background-color: #FAF7F2 !important;
}
/* Buttons */
.btn-primary, button[type="submit"] {
  background-color: #2C2416 !important;
  color: #FAF7F2 !important;
  border-radius: 100px !important;
  border: none !important;
}
.btn-primary:hover {
  background-color: #D4A574 !important;
}
/* Links */
a { color: #D4A574 !important; }
a:hover { color: #2C2416 !important; }
/* Background */
body { background-color: #FAF7F2 !important; }
/* Cards */
.card {
  background: #FFFFFF !important;
  border-radius: 12px !important;
  box-shadow: 0 4px 20px rgba(44, 36, 22, 0.05) !important;
}
/* Inputs */
input, textarea, select {
  border-radius: 8px !important;
  border: 1px solid rgba(212, 165, 116, 0.2) !important;
}
/* Override Zoho orange brand colours */
.commonStyle__zt3BrandBg,
.SearchContainer__searchIcon,
.AppContainer__backToTop,
[class*="zt3BrandBg"] {
  background-color: #2C2416 !important;
}
.commonStyle__zt3BrandFill,
.ModuleCont__brand,
[class*="zt3BrandFill"] {
  fill: #D4A574 !important;
}
.commonStyle__zt3BrandColor,
[class*="zt3BrandColor"] {
  color: #D4A574 !important;
}
