/* File: style/theme.css  (global theme) */
:root {
  --color-primary: #0b5ed7;
  --color-primary-light: #0d6efd;
  --color-primary-dark: #084298;
  --color-text: #0f172a;
  --color-text-muted: #6b7280;
  --color-white: #ffffff;
  --radius-md: 0.5rem;
  --spacing-md: 1rem;
  --spacing-lg: 1.5rem;
}

/* basic resets */
* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body { font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif; color: var(--color-text); background: var(--color-white); line-height: 1.6; }

/* NAVBAR - single canonical copy */
#mainNav {
  position: fixed !important; top: 0 !important; left: 0 !important; right: 0 !important; width: 100% !important; z-index: 1100 !important;
  background: #ffffff !important; padding: 1rem 0 !important; transition: padding 180ms ease, box-shadow 180ms ease, background 180ms ease !important; box-shadow: none !important;
}
#mainNav.scrolled { padding: 0.35rem 0 !important; box-shadow: 0 6px 18px rgba(14,20,30,0.06) !important; background: rgba(255,255,255,0.95) !important; }

.navbar-brand { display: inline-flex !important; align-items: center !important; gap: 8px !important; padding: 0 !important; margin: 0 !important; }
.brand-title { font-weight: 600 !important; font-size: 1.05rem !important; color: var(--color-primary) !important; line-height: 1 !important; }

#logo-image { display: block; width: 72px; height: 72px; object-fit: contain; margin: 0; padding: 0; }
@media (max-width: 768px) { #logo-image { width: 56px; height: 56px; } }

/* BG container default background (single source of truth) */
#bg-container { background-image: url('https://i.postimg.cc/QNfSdwDL/Home-Website-Background.jpg'); min-height: 60vh; background-repeat: no-repeat; background-size: cover; background-position: center; display:flex; align-items:center; justify-content:center; text-align:center; color: white; }

/* basic utilities */
.text-primary { color: var(--color-primary) !important; }
.bg-light { background-color: #f8f9fa !important; }

/* simple components */
.card { border: none; border-radius: var(--radius-md); box-shadow: 0 4px 12px rgba(0,0,0,0.08); overflow: hidden; transition: all .3s ease; }
.card:hover { transform: translateY(-4px); box-shadow: 0 12px 24px rgba(0,0,0,0.15); }

/* accessibility helpers */
a { color: var(--color-primary); text-decoration: none; }
a:hover { color: var(--color-primary-dark); }

/* minimal responsive helpers */
@media (max-width: 576px) {
  #bg-container { min-height: 40vh; }
}
