@import url("https://fonts.googleapis.com/css2?family=Montserrat+Alternates:wght@300;400;500;600;700;800&display=swap");

html { font-size: 17px; }

:root {
  --font-family: "Montserrat Alternates", system-ui, sans-serif;

  --color-text: #4B5563;
  --color-text-link: #B8942A;
  --color-text-link-hover: #D4AF37;
  --color-text-heading: #111827;
  --color-background: #F8F9FC;

  --top-bar-background: linear-gradient(135deg, #09101f 0%, #111827 65%, #0d1b33 100%);
  --top-bar-box-shadow: 0 4px 20px rgba(0,0,0,0.4);
  --top-bar-border-bottom: 1px solid rgba(212,175,55,0.2);

  --alert-info-color:    #D4AF37;
  --alert-danger-color:  #ef4444;
  --alert-success-color: #22c55e;

  --icon-color-blue:      #D4AF37;
  --icon-color-lightblue: #F5D06E;
  --icon-color-teal:      #5BC0EB;
  --icon-color-green:     #22c55e;
  --icon-color-orange:    #D4AF37;
  --icon-color-maroon:    #B8942A;
}

/* ── Font: apply Montserrat Alternates to text elements only, preserve icon fonts ── */
body, input, textarea, select, button,
h1, h2, h3, h4, h5, h6, p, span, a, td, th, label, li, div {
  font-family: "Montserrat Alternates", system-ui, sans-serif !important;
}

/* Restore FontAwesome icons — must come AFTER the rule above */
.fa, .fas, .far, .fab, .fal, .fad,
[class^="fa-"], [class*=" fa-"],
.fa-solid, .fa-regular, .fa-brands, .fa-light {
  font-family: "Font Awesome 6 Free" !important;
}
.fab, .fa-brands {
  font-family: "Font Awesome 6 Brands" !important;
}

/* ── Top bar ── */
.top-bar {
  background: linear-gradient(135deg, #09101f 0%, #111827 65%, #0d1b33 100%) !important;
}

/* Logo */
.top-bar-logo a {
  display: inline-flex !important;
  align-items: center !important;
  gap: 9px !important;
  text-decoration: none !important;
}
.top-bar-logo a::before {
  content: '';
  display: inline-block;
  width: 28px;
  height: 28px;
  flex-shrink: 0;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cdefs%3E%3ClinearGradient id='g' x1='0%25' y1='0%25' x2='100%25' y2='100%25'%3E%3Cstop offset='0%25' stop-color='%23F5D06E'/%3E%3Cstop offset='35%25' stop-color='%23D4AF37'/%3E%3Cstop offset='100%25' stop-color='%23B8942A'/%3E%3C/linearGradient%3E%3C/defs%3E%3Crect x='4' y='4' width='92' height='92' rx='22' fill='url(%23g)'/%3E%3Crect x='28' y='22' width='44' height='8' rx='3' fill='white'/%3E%3Crect x='28' y='46' width='36' height='8' rx='3' fill='white' opacity='.95'/%3E%3Crect x='28' y='70' width='44' height='8' rx='3' fill='white'/%3E%3Crect x='28' y='22' width='8' height='56' rx='3' fill='white'/%3E%3C/svg%3E")
    no-repeat center/contain;
}
.top-bar-logo img {
  display: none !important;
}
.top-bar-logo a::after {
  content: 'ELITE.CONTACT';
  font-family: "Montserrat Alternates", sans-serif !important;
  font-weight: 700 !important;
  font-size: 0.92rem !important;
  color: rgba(255,255,255,0.92) !important;
  letter-spacing: 0.01em !important;
}

/* Nav links in top bar */
.top-bar a,
.top-bar-nav a,
.top-bar .u-link {
  color: rgba(255,255,255,0.75) !important;
}
.top-bar a:hover,
.top-bar-nav a:hover {
  color: #F5D06E !important;
}

/* ── Buttons ── */
.button,
button[type="submit"],
.btn-add,
a.button {
  background: linear-gradient(135deg, #B8942A, #D4AF37, #F5D06E, #D4AF37, #B8942A) !important;
  background-size: 250% 250% !important;
  animation: gold-flow 4s ease infinite !important;
  border: none !important;
  color: #fff !important;
  border-radius: 50px !important;
  font-weight: 600 !important;
  box-shadow: 0 3px 14px rgba(212,175,55,0.35) !important;
}
.button:hover,
button[type="submit"]:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 6px 20px rgba(212,175,55,0.5) !important;
}

@keyframes gold-flow {
  0%   { background-position: 0% 50%; }
  50%  { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

/* ── Inputs ── */
input[type="text"],
input[type="password"],
input[type="email"],
input[type="number"],
select,
textarea {
  border: 1.5px solid #E5E7EB !important;
  border-radius: 10px !important;
}
input:focus, select:focus, textarea:focus {
  border-color: #D4AF37 !important;
  box-shadow: 0 0 0 3px rgba(212,175,55,0.15) !important;
  outline: none !important;
}

/* ── Content cards / units ── */
.units-item,
.card,
.l-unit {
  border-radius: 16px !important;
  border: 1px solid #F3F4F6 !important;
  box-shadow: 0 4px 20px rgba(0,0,0,0.05) !important;
}

/* ── Links ── */
a { color: #B8942A !important; }
a:hover { color: #D4AF37 !important; }

/* ── Toolbar ── */
.toolbar,
.l-toolbar {
  background: #fff !important;
  border-bottom: 1px solid #F3F4F6 !important;
}

/* ── Page background ── */
body {
  background: #F8F9FC !important;
}