/* Custom Overrides for Naše Rtyně */

:root {
    --brand-blue: hsl(223, 88%, 35%);
    --brand-blue-alt: #0d48e2;
    --brand-yellow: #fedf00;
    --header-bg: rgba(6, 32, 96, 0.6);
}

/* --- NAVBAR OVERRIDES --- */
/* Switch to White background for Logo Contrast */
#mainNav {
    padding-top: 0;
    padding-bottom: 0;
    background-color: #fff;
    box-shadow: 0 2px 15px rgba(0, 0, 0, 0.1);
}

/* Links become Blue */
#mainNav .navbar-nav .nav-item .nav-link {
    color: var(--brand-blue);
    font-family: "Montserrat", sans-serif;
    font-weight: 700;
}

#mainNav .navbar-nav .nav-item .nav-link.active,
#mainNav .navbar-nav .nav-item .nav-link:hover {
    color: rgb(0, 0, 0);
    /* Darker blue for interaction */
}

#mainNav .navbar-toggler {
    background-color: var(--brand-blue);
    color: #fff;
    padding: 0.75rem;
}

/* Desktop resizing logic */
@media (min-width: 992px) {
    #mainNav {
        padding-top: 0;
        padding-bottom: 0;
        background-color: #fff;
        /* Keep white even when top */
    }

    #mainNav.navbar-shrink {
        padding-top: 0;
        padding-bottom: 0;
        background-color: #fff;
    }

    /* Logo Sizing */
    #mainNav .navbar-brand img {
        height: 4rem;
        /* Desktop default */
    }

    #mainNav.navbar-shrink .navbar-brand img {
        height: 3.5rem;
        /* Desktop scrolled */
    }
}

/* Mobile Logo Sizing */
@media (max-width: 991px) {
    #mainNav .navbar-brand img {
        height: 3rem;
    }
}



/* --- COLOR THEME APPLICATION --- */

/* Primary Buttons (Yellow bg, Blue text) */
.btn-primary {
    background-color: var(--brand-yellow);
    border-color: var(--brand-yellow);
    color: var(--brand-blue);
    font-weight: 700;
}

.btn-primary:hover,
.btn-primary:active,
.btn-primary:focus {
    background-color: #e5c800 !important;
    /* Slightly darker yellow */
    border-color: #e5c800 !important;
    color: var(--brand-blue) !important;
}

/* Section Icons (Blue for visibility on white) */
.text-primary {
    color: var(--brand-blue) !important;
}

/* Timeline Circles (Alternating colors) */
.timeline>li .timeline-image {
    background-color: var(--brand-blue);
    border: 7px solid #f1f1f1;
}

.timeline>li.timeline-inverted>.timeline-image {
    background-color: var(--brand-yellow);
}

/* Fix text contrast inside Yellow circles */
.timeline>li.timeline-inverted>.timeline-image h4 {
    color: var(--brand-blue);
    font-weight: 800;
}

/* Center text properly inside the circle */
.timeline>li .timeline-image h4 {
    margin-top: 0 !important;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
}

/* Contact Section (Blue Background) */
section#contact {
    background-color: var(--brand-blue);
    background-image: none;
    /* Optional: remove map image for cleaner look */
}

section#contact .section-heading {
    color: #fff;
}

section#contact ::placeholder {
    color: hsl(210, 14%, 60%) !important;
}

section#contact form#contactForm .form-group input,
section#contact form#contactForm .form-group textarea {
    font-weight: 700 !important;
}

/* Footer Social Icons */
.btn-social {
    background-color: var(--brand-blue);
    color: #fff;
}

.btn-social:hover {
    background-color: var(--brand-blue-alt);
    /* color: var(--brand-blue); */
}

/* TIMELINE LAST AFTER */
#last-timeline-inverted::after {
    display: none !important;
}

/* --- VERTICAL ACCORDION (PROGRAM DETAIL) --- */
.accordion-item {
    border: none;
    border-left: 5px solid var(--brand-yellow);
    /* Branding accent */
    background-color: #fff;
}

.accordion-button {
    font-family: "Montserrat", sans-serif;
    color: #212529;
    background-color: #fff;
    box-shadow: none;
    font-size: 1.1rem;
}

/* Active State */
.accordion-button:not(.collapsed) {
    color: var(--brand-blue);
    background-color: rgba(14, 74, 224, 0.05);
    /* Light blue tint matching logo */
    box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .125);
}

.accordion-button:focus {
    border-color: var(--brand-yellow);
    box-shadow: none;
    /* Cleaner look */
}

/* Custom chevron color (Dark by default, Blue when active) */
.accordion-button::after {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23212529'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}

.accordion-button:not(.collapsed)::after {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%230e4ae0'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
    /* Use mirror flip instead of rotation */
    transform: scaleY(-1);
}

.accordion-body {
    font-size: 1rem;
    color: #6c757d;
    line-height: 1.6;
}

/* --- FORM VALIDATION STABILITY --- */
/* Ensure invalid-feedback takes up space even when hidden to prevent layout jumps */
.invalid-feedback {
    display: block !important;
    /* Force block display to reserve space */
    visibility: hidden;
    /* Hide content visually */
    min-height: 1.25em;
    /* Height of one line of text approx */
    margin-top: 0.25rem;
}

/* Show feedback when the form is validated and input is invalid */
.was-validated .form-control:invalid~.invalid-feedback,
.was-validated .form-select:invalid~.invalid-feedback,
.form-control.is-invalid~.invalid-feedback {
    visibility: visible;
}

/* --- HEADER BACKGROUND FILTER --- */
header.masthead {
    background-image: linear-gradient(var(--header-bg), var(--header-bg)), url("./assets/img/header-bg.png") !important;
}

/* --- PRIORITY SECTION TWEAKS --- */
#priority .fa-stack {
    margin-top: 0 !important;
    /* Increase spacing above icons */
    margin-bottom: 2rem !important;
}

/* --- VIZE ALIGN --- */
#vize p {
    text-align: justify;
}

#vize ul li {
    text-align: justify;
}

#vize ul li strong {
    display: inline-block;
}

/* Team */
.team-member img {
    object-fit: cover;
}

/* Masthead */
header.masthead .masthead-subheading {
    margin-bottom: 2rem;
}

header.masthead .masthead-heading {
    margin-bottom: 25px;
}

@media (min-width: 768px) {
    header.masthead {
        padding-top: 17rem;
        padding-bottom: 12.5rem;
    }

    header.masthead .masthead-subheading {
        margin-bottom: 4rem;
    }

    header.masthead .masthead-heading {
        margin-bottom: 2rem;
    }
}