/* =====================================================
   SN BRAND – VUEXY LANDING PAGE OVERRIDE (ALL IN ONE)
   Logo Reference: S (Black) + N (Teal)
   ===================================================== */

/* ===============================
   BRAND COLOR TOKENS
   =============================== */
:root {
  --sn-primary: #00ACC1;
  /* Logo teal (N) */
  --sn-primary-dark: #008ba3;
  /* Hover / active */
  --sn-primary-soft: #e0f7fa;
  /* Soft background */
  --sn-black: #000000;
  --sn-white: #FFFFFF;
}

/* ===============================
   BOOTSTRAP / VUEXY CORE OVERRIDE
   =============================== */
:root {
  --bs-primary: var(--sn-primary);
  --bs-primary-rgb: 0, 172, 193;

  --bs-link-color: var(--sn-primary);
  --bs-link-hover-color: var(--sn-primary-dark);

  --bs-focus-ring-color: rgba(10, 163, 181, 0.25);
}

/* ===============================
   BUTTONS
   =============================== */
.btn-primary {
  background-color: var(--sn-primary);
  border-color: var(--sn-primary);
}

.btn-primary:hover,
.btn-primary:focus {
  background-color: var(--sn-primary-dark);
  border-color: var(--sn-primary-dark);
}

/* Standardized SN Buttons */
.btn-sn-primary {
  background-color: var(--sn-primary);
  border-color: var(--sn-primary);
  color: var(--sn-white);
}

.btn-sn-primary:hover,
.btn-sn-primary:focus {
  background-color: var(--sn-primary-dark);
  border-color: var(--sn-primary-dark);
  color: var(--sn-white);
}

.btn-sn-outline-primary {
  color: var(--sn-primary);
  border-color: var(--sn-primary);
  background-color: transparent;
}

.btn-sn-outline-primary:hover,
.btn-sn-outline-primary:focus {
  color: var(--sn-white);
  background-color: var(--sn-primary);
  border-color: var(--sn-primary);
}

/* ===============================
   TABLES
   =============================== */
.table-sn {
  --bs-table-bg: var(--sn-white);
  --bs-table-striped-bg: var(--sn-primary-soft);
  --bs-table-striped-color: var(--sn-black);
  --bs-table-active-bg: rgba(0, 172, 193, 0.1);
  --bs-table-active-color: var(--sn-black);
  --bs-table-hover-bg: rgba(0, 172, 193, 0.05);
  --bs-table-hover-color: var(--sn-black);
  color: var(--sn-black);
  border-color: var(--sn-primary-soft);
}

.table-sn> :not(caption)>*>* {
  padding: 0.75rem 1.25rem;
  background-color: var(--bs-table-bg);
  border-bottom-width: 1px;
  box-shadow: inset 0 0 0 9999px var(--bs-table-bg);
}

.table-sn th {
  font-weight: 600;
  color: var(--sn-black);
  background-color: var(--sn-primary-soft);
}

/* ===============================
   NAVBAR (LANDING)
   =============================== */
.landing-navbar .nav-link {
  color: #444;
  font-weight: 500;
}

.landing-navbar .nav-link:hover,
.landing-navbar .nav-link.active {
  color: var(--sn-primary);
}

/* ===============================
   HERO SECTION
   =============================== */
#landingHero {
  background:
    linear-gradient(rgba(0, 0, 0, .55), rgba(0, 0, 0, .55)),
    url('../images/backgroundserver.png') center center / cover no-repeat;
}

#landingHero .hero-title,
#landingHero h1 span {
  color: var(--sn-primary);
}

#landingHero p,
#landingHero h2 {
  color: var(--sn-white);
}

/* ===============================
   FEATURES / SERVICES
   =============================== */
.features-icon-box img,
.features-icon-box i,
.landing-features .text-primary {
  color: var(--sn-primary);
}

/* ===============================
   TESTIMONIALS
   =============================== */
.text-warning i,
.ti-star-filled {
  color: var(--sn-primary);
}

/* ===============================
   TEAM / LEADERSHIP
   =============================== */
.landing-team .card {
  border-color: var(--sn-primary-soft);
}

.landing-team .card-title {
  color: var(--sn-black);
}

/* ===============================
   SOFT BACKGROUND SECTIONS
   =============================== */
.bg-label-primary,
.bg-primary-soft {
  background-color: var(--sn-primary-soft) !important;
  color: var(--sn-primary) !important;
}

/* ===============================
   FOOTER
   =============================== */
.landing-footer a:hover {
  color: var(--sn-primary);
}