/* 1. VARIABLES & RESET */
:root {
    --color-primary: #dcc061;
    --color-primary-dark: #003366; /* ECM36 Official Blue */
    --color-secondary: #ccc0b0;
    --color-background: #f5ecd0;
    --color-text: #000000;
    --color-surface: #ffffff;
}

* { box-sizing: border-box; }

body, html {
    margin: 0;
    padding: 0;
    height: 100%;
    font-family: 'Roboto', 'Inter', sans-serif;
    color: var(--color-text);
    background-color: var(--color-surface);
    overflow-x: hidden; /* Prevent horizontal "wobble" */
}

a, #mainNav a {text-decoration:none;}
a:hover, #mainNav a:hover {color: var(--color-primary) !important;}

a.btn:hover {color: var(--color-primary-dark) !important;text-decoration:none;}

h1, h2, h3, h4 {
	color: var(--color-primary-dark);
}


/* Styling for the active link */
.nav-link.active {
    color: var(--color-primary) !important; /* Your gold/accent color */
    font-weight: 700;
    position: relative;
}



/* 2. NAVIGATION (Mobile-First) */
#mainNav {
    background-color: white !important;
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.05) !important;
    /*transition: all 0.4s ease;*/
    margin-bottom: 0 !important;
}

#navbar-brand-img {
    height: 40px;
    opacity: 1; /* Always visible on mobile */
    transform: translateY(0);
    transition: opacity 0.3s ease, transform 0.3s ease;
}

.nav-link {
    text-transform: uppercase;
    font-weight: 600;
    color: var(--color-primary-dark) !important;
}


/* Desktop Navigation (Transparency Logic) */
@media (min-width: 768px) {
    #mainNav:not(.scrolled) {
        /*background-color: transparent !important;*/
        box-shadow: none !important;
        border-bottom: 1px solid transparent !important;
    }

    #mainNav:not(.scrolled) #navbar-brand-img {
        opacity: 0;
        transform: translateY(10px);
        pointer-events: none;
    }
    
    #banner {}
}



.nav-link.active {
    border-bottom: 1px solid var(--color-primary);
}


/* 3. BANNER & HERO */
#banner {
    display: block; /* Hidden on mobile */
    width: 100%;
    height: 300px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    /*transition: margin-top 0.2s ease, height 0.2s ease;*/
}

@media (max-width: 768px) {
    #banner {
        display: none;
    }
}

.is-loading { animation: pulse 1.5s infinite; }
@keyframes pulse {
    0%, 100% { opacity: 0.6; }
    50% { opacity: 1; }
}

/* 4. LAYOUT & CONTAINERS */
.container {
    max-width: 1200px;
    width: 100%; /* Fixes the "fixed width" bug on mobile */
}

.article {
    margin-top: 50px;
    padding-bottom: 100px;
}

/* 5. COMPONENTS */
.btn-primary {
    background-color: var(--color-primary-dark);
    border-color: var(--color-primary-dark);
}

.btn-primary:hover {
    background-color: var(--color-primary);
    border-color: var(--color-primary);
}

a {
    color: var(--color-primary-dark);
    text-decoration: none;
}

a:hover { text-decoration: underline; }

/* 6. TABLE STYLING */
.progtable { width: 100%; vertical-align: middle; }
.progtable td, .progtable th { padding: 12px; text-align: center; border: none; }
.progtable .reg { background-color: #F0F8FF; border: 4px solid #fff; }
.progtable .sect { background-color: var(--color-primary-dark); color: #fff; border: 4px solid #fff; }





:root {
    /* BS5 Színfelülbírálások */
    --bs-primary: #635BFF;       /* Az akciószín (accent) */
    --bs-dark: #0A2540;          /* A sötétkék (primary) */
    --bs-body-bg: #F6F9FC;
    --bs-body-color: #425466;
    
    /* Betűtípus beállítása */
    --bs-font-sans-serif: 'Manrope', sans-serif;
}

body {
    font-family: var(--bs-font-sans-serif);
    -webkit-font-smoothing: antialiased;
}

/* Bootstrap Tipográfia finomítása */
h1, h2, h3, h4, .display-1, .display-2 {
    color: var(--bs-dark);
    font-weight: 800;
    letter-spacing: -0.03em;
}

.nav-link {
    font-weight: 600;
    color: var(--bs-dark) !important;
}

/* Gombok lekerekítése a Manrope karakteréhez */
.btn {
    font-weight: 600;
    border-radius: 8px; /* Kicsit modernebb, mint a BS5 alapértelmezett */
    padding: 0.6rem 1.5rem;
    letter-spacing: 0.02em;
}

.btn-primary {
    background-color: var(--bs-primary);
    border-color: var(--bs-primary);
}