/* =========================================================
   OLD GLORY HEADER — ASC LMS
   File: assets/css/lms_header_old_glory.css
   Purpose: Red / White / Blue header (strong override)
   ========================================================= */

:root{
  --og-blue: #0a1f44;        /* Old Glory Navy */
  --og-blue-2: #061634;      /* Deep navy */
  --og-blue-soft:#102a5e;    /* Depth */
  --og-red:  #b31942;        /* Flag red */
  --og-red-2:#8f1233;        /* Deeper red */
  --og-white:#ffffff;
  --og-glass: rgba(255,255,255,0.08);
  --og-glass-2: rgba(255,255,255,0.12);
}

/* ─────────────────────────────────────────────
   HEADER BASE (force override)
   ───────────────────────────────────────────── */

.lms-go-header{
  /* kill any theme fade/gradient */
  background: none !important;
  background-image:
    /* subtle star field */
    radial-gradient(circle at 12px 12px, rgba(255,255,255,0.14) 1px, rgba(255,255,255,0) 2px),
    radial-gradient(circle at 36px 28px, rgba(255,255,255,0.10) 1px, rgba(255,255,255,0) 2px),
    /* navy base gradient */
    linear-gradient(135deg, var(--og-blue) 0%, var(--og-blue-2) 55%, #071a3d 100%) !important;
  background-size: 48px 48px, 64px 64px, 100% 100% !important;
  background-repeat: repeat, repeat, no-repeat !important;

  border-bottom: 5px solid var(--og-red) !important;
  box-shadow: 0 10px 26px rgba(0,0,0,0.45) !important;
  position: relative;
  overflow: hidden;
}

/* Add “flag stripe” highlight */
.lms-go-header::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:14px;

  /* SOLID vertical stripes — no seam */
  background:
    linear-gradient(
      180deg,
      var(--og-white) 0%,
      var(--og-white) 50%,
      var(--og-red)   50%,
      var(--og-red)   100%
    );

  /* REMOVE glow + inner highlights */
  box-shadow: none;

  pointer-events:none;
}




/* Containment / spacing */
.lms-go-header-inner{
  max-width: 1400px;
  margin: 0 auto;
  padding: 16px 22px 18px !important;
}

/* ─────────────────────────────────────────────
   BRAND
   ───────────────────────────────────────────── */

.lms-go-brand{
  display:flex;
  align-items:center;
  gap:12px;
  color: var(--og-white) !important;
}

.lms-go-brand-mark{
  width:44px;
  height:44px;
  border-radius: 14px !important; /* more “badge” than bubble */
  display:flex;
  align-items:center;
  justify-content:center;

  background: linear-gradient(135deg, var(--og-blue-soft), var(--og-blue-2)) !important;
  border:2px solid var(--og-red) !important;
  box-shadow: 0 8px 18px rgba(0,0,0,0.35);
}

.lms-go-brand-text{
  font-weight:900 !important;
  letter-spacing:.06em;
  line-height:1.05;
  text-transform: uppercase;
}

/* ─────────────────────────────────────────────
   NAV LINKS (more “button/pill”)
   ───────────────────────────────────────────── */

.lms-go-nav{
  display:flex;
  flex-wrap:wrap;
  gap:8px !important;
}

/* baseline */
.lms-go-nav .nav-link{
  color: rgba(255,255,255,0.92) !important;
  font-weight:700 !important;
  padding: 10px 14px !important;
  border-radius: 12px !important;
  text-decoration: none !important;

  background: rgba(255,255,255,0.06) !important;
  border: 1px solid rgba(255,255,255,0.10) !important;

  transition: transform .12s ease, background .12s ease, border-color .12s ease;
}

/* Hover */
.lms-go-nav .nav-link:hover{
  background: rgba(255,255,255,0.10) !important;
  border-color: rgba(255,255,255,0.18) !important;
  transform: translateY(-1px);
}

/* Active */
.lms-go-nav .nav-link.active{
  background: linear-gradient(135deg, var(--og-red), var(--og-red-2)) !important;
  border-color: rgba(255,255,255,0.18) !important;
  color: var(--og-white) !important;
  box-shadow: 0 10px 18px rgba(179,25,66,0.22);
}

/* ─────────────────────────────────────────────
   USER / LOGOUT
   ───────────────────────────────────────────── */

.lms-go-user{
  display:flex;
  align-items:center;
  gap:14px;
  color: var(--og-white) !important;
}

.lms-go-user-meta .label{
  color: rgba(255,255,255,0.75) !important;
  font-size: .82rem;
}

.lms-go-user-meta .name{
  font-weight: 800 !important;
}

.lms-go-logout-btn{
  border: 1px solid rgba(255,255,255,0.22) !important;
  background: rgba(255,255,255,0.06) !important;
  color: var(--og-white) !important;
  padding: 8px 14px !important;
  border-radius: 12px !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  transition: transform .12s ease, background .12s ease, border-color .12s ease;
}

.lms-go-logout-btn:hover{
  background: rgba(255,255,255,0.12) !important;
  border-color: rgba(255,255,255,0.28) !important;
  transform: translateY(-1px);
}