/* ============================================
   FL!PT Majors Chrome (Discovery Bar + Minimal Nav)
   Scope: Pages using _FLiPTMajorsLayout.cshtml
   Design: Championship Athletic — precise, uncluttered, prestige
   ============================================ */

:root {
    --flipt-discovery-bar-height: 2.75rem; /* 44px */
    --flipt-majors-nav-height: 4rem;       /* 64px */
    --flipt-majors-gap: 1.75rem;
}

/* Bar dismissed via JS cookie */
html.flipt-discovery-dismissed {
    --flipt-discovery-bar-height: 0rem;
}

/* Bar suppressed server-side (e.g. USWDGC page itself) */
.flipt-discovery-hidden {
    --flipt-discovery-bar-height: 0rem;
}

/* ------------------------------------------
   Discovery bar
   ------------------------------------------ */
.flipt-discovery-bar {
    position: sticky;
    top: 0;
    z-index: 9500;
    height: var(--flipt-discovery-bar-height);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    padding: 0 1.25rem;
    background: var(--theme-gradient);
    color: #fff;
    overflow: hidden;
}

/* Subtle animated shimmer pass */
.flipt-discovery-bar::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg,
        transparent 0%,
        rgba(255, 255, 255, 0.06) 40%,
        rgba(255, 255, 255, 0.12) 50%,
        rgba(255, 255, 255, 0.06) 60%,
        transparent 100%);
    background-size: 200% 100%;
    animation: flipt-bar-shimmer 4s ease-in-out infinite;
    pointer-events: none;
}

@keyframes flipt-bar-shimmer {
    0%   { background-position: -100% 0; }
    60%  { background-position: 200% 0; }
    100% { background-position: 200% 0; }
}

html.flipt-discovery-dismissed .flipt-discovery-bar,
.flipt-discovery-bar.dismissed {
    display: none;
}

.flipt-discovery-bar__text {
    font-family: 'Karla', system-ui, sans-serif;
    font-size: 0.8125rem;
    font-weight: 500;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.85);
    white-space: nowrap;
}

.flipt-discovery-bar__link {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    color: #fff;
    font-family: 'Karla', system-ui, sans-serif;
    font-size: 0.8125rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    text-decoration: none;
    padding: 0.25rem 0.875rem;
    border: 1.5px solid rgba(255, 255, 255, 0.65);
    border-radius: 999px;
    transition: background 0.2s ease, border-color 0.2s ease;
    white-space: nowrap;
}

.flipt-discovery-bar__link::after {
    content: '→';
    font-size: 0.875rem;
    transition: transform 0.2s ease;
}

.flipt-discovery-bar__link:hover,
.flipt-discovery-bar__link:focus-visible {
    background: rgba(255, 255, 255, 0.15);
    border-color: #fff;
    color: #fff;
    text-decoration: none;
}

.flipt-discovery-bar__link:hover::after {
    transform: translateX(2px);
}

.flipt-discovery-bar__dismiss {
    appearance: none;
    background: transparent;
    border: none;
    color: rgba(255, 255, 255, 0.6);
    font-size: 0.875rem;
    line-height: 1;
    padding: 0.25rem 0.375rem;
    cursor: pointer;
    transition: color 0.15s ease;
    margin-left: 0.25rem;
}

.flipt-discovery-bar__dismiss:hover {
    color: #fff;
}

.flipt-discovery-bar__dismiss:focus-visible {
    outline: 2px solid rgba(255, 255, 255, 0.5);
    outline-offset: 2px;
    border-radius: 2px;
}

/* Normal layout context: bar is a contextual banner below the site nav, not sticky */
body:not(.flipt-majors-page) .flipt-discovery-bar {
    position: relative;
    top: auto;
    z-index: auto;
    height: auto;
    min-height: 2.75rem;
    padding: 0.5rem 1.25rem;
}

/* ------------------------------------------
   Minimal nav
   ------------------------------------------ */
.flipt-majors-nav {
    position: relative;
    z-index: 9400;
    min-height: var(--flipt-majors-nav-height);
    background: rgba(8, 12, 20, 0.92);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border-bottom: none;
    /* Gradient accent along the bottom edge */
    box-shadow: 0 1px 0 0 rgba(var(--flipt-primary-rgb, 0, 166, 156), 0.35),
                0 4px 24px rgba(0, 0, 0, 0.3);
}

.flipt-majors-nav__inner {
    min-height: var(--flipt-majors-nav-height);
    padding-left: 1.5rem;
    padding-right: 1.5rem;
}

.flipt-majors-nav__brand img {
    height: 2.25rem;
    width: auto;
    /* Subtle lift on hover */
    transition: opacity 0.2s ease;
}

.flipt-majors-nav__brand:hover img,
.flipt-majors-nav__brand:focus-visible img {
    opacity: 0.85;
}

/* Nav links — championship typographic treatment */
.flipt-majors-nav .navbar-nav {
    gap: 0.25rem;
}

.flipt-majors-nav .nav-link {
    font-family: 'Karla', system-ui, sans-serif;
    font-size: 0.75rem;
    font-weight: 800;
    letter-spacing: 0.09em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.75);
    padding: 0.5rem 0.875rem;
    position: relative;
    transition: color 0.2s ease;
}

/* Animated bottom accent line */
.flipt-majors-nav .nav-link::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0.875rem;
    right: 0.875rem;
    height: 2px;
    background: var(--theme-gradient);
    border-radius: 2px;
    transform: scaleX(0);
    transform-origin: center;
    transition: transform 0.25s ease;
}

.flipt-majors-nav .nav-link:hover,
.flipt-majors-nav .nav-link:focus-visible {
    color: #fff;
}

.flipt-majors-nav .nav-link:hover::after,
.flipt-majors-nav .nav-link:focus-visible::after {
    transform: scaleX(1);
}

/* Mobile hamburger */
.flipt-majors-nav__toggle.navbar-toggler {
    border: 1.5px solid rgba(255, 255, 255, 0.2);
    padding: 0.35rem 0.6rem;
}

.flipt-majors-nav__toggle.navbar-toggler:focus,
.flipt-majors-nav__toggle.navbar-toggler:focus-visible {
    box-shadow: none;
    outline: 2px solid rgba(var(--flipt-primary-rgb, 0, 166, 156), 0.5);
    outline-offset: 2px;
}

/* Desktop: keep links visible */
@media (min-width: 992px) {
    .flipt-majors-nav__links.collapse {
        display: flex !important;
        height: auto !important;
        visibility: visible !important;
    }
}

/* Mobile: collapsed menu */
@media (max-width: 991.98px) {
    .flipt-discovery-bar__text {
        display: none;
    }

    .flipt-majors-nav__links {
        padding: 0.5rem 0 0.75rem;
        background: rgba(8, 12, 20, 0.97);
        border-top: 1px solid rgba(255, 255, 255, 0.06);
    }

    .flipt-majors-nav .navbar-nav .nav-link {
        padding: 0.7rem 1.25rem;
        letter-spacing: 0.07em;
    }

    .flipt-majors-nav .nav-link::after {
        display: none;
    }
}

/* ------------------------------------------
   Footer overrides — replace ElevateUT purple with FLiPT gradient
   ------------------------------------------ */
.flipt-majors-page .footer-modern::before {
    background: var(--theme-gradient);
    background-size: 100% 100%;
    animation: none;
}

.flipt-majors-page .footer-modern::after {
    background-image:
        radial-gradient(circle at 15% 60%, rgba(var(--flipt-primary-rgb, 0, 166, 156), 0.08) 0%, transparent 50%),
        radial-gradient(circle at 85% 30%, rgba(var(--flipt-secondary-rgb, 0, 104, 186), 0.08) 0%, transparent 50%);
}

.flipt-majors-page .footer-section h3 i {
    color: var(--flipt-primary);
}

.flipt-majors-page .footer-links a:hover {
    color: var(--flipt-primary);
}

.flipt-majors-page .social-link:hover {
    background: var(--flipt-primary);
    border-color: var(--flipt-primary);
    box-shadow: 0 4px 12px rgba(var(--flipt-primary-rgb, 0, 166, 156), 0.35);
}

.flipt-majors-page .footer-modern .footer-logo img {
    height: 50px;
    width: auto;
}