.app-header {
    background: linear-gradient(90deg, #f6a21a, #f07f10);
    padding: 8px 0;
    box-shadow: 0 2px 6px rgba(0,0,0,0.08);
    position: sticky;
    top: 0;
    z-index: 50;
}

/* Make navbar the positioning container */
.navbar.app-header {
    position: relative;
    min-height: 90px; /* << Increase navbar height */
    padding-top: 12px;
    padding-bottom: 12px;
}

/* Default (desktop) logo size */
.navbar .navbar-brand img {
    height: 40px;
    transition: 0.2s;
}


/*footer design */

.app-footer {
    background: #f8f9fa;
    border-top: 1px solid #e4e7eb;
    padding: 15px 0;
    font-size: 0.95rem;
}

    .app-footer .footer-content {
        padding-left: 10px;
        padding-right: 10px;
    }

    .app-footer .footer-text {
        color: #6c757d;
        line-height: 1.6;
    }

    .app-footer .footer-link {
        color: #0d6efd;
        text-decoration: none;
        font-weight: 500;
    }

        .app-footer .footer-link:hover {
            text-decoration: underline;
        }

.footer-lang select,
.footer-lang .form-select {
    min-width: 180px;
}


/*footer design */

/* MOBILE VIEW (max-width: 576px) */
@media (max-width: 576px) {

    /* Increase whole navbar height more for bigger logo */
    .navbar.app-header {
        min-height: 120px !important; /* << Adjust: bigger height */
        padding-top: 10px;
        padding-bottom: 10px;
    }

    /* Center the brand */
    .navbar .navbar-brand {
        position: absolute;
        left: 50%;
        top: 8px; /* << Adjust vertical position */
        transform: translateX(-50%);
        margin: 0;
        z-index: 200;
    }

        /* Increase logo size to 80px */
        .navbar .navbar-brand img {
            height: 103px !important;
        }

    /* Keep toggler on top */
    .navbar .navbar-toggler {
        position: relative;
        z-index: 210;
        margin-top: 10px; /* adjust if overlapping */
    }

    /* Push dropdown below big logo */
    .navbar-collapse.collapse {
        margin-top: 110px !important; /* must be greater than logo height */
    }

    .app-footer {
        text-align: center;
        padding-bottom: 20px;
    }

    .footer-lang {
        display: flex;
        justify-content: center;
        margin-top: 10px;
    }
}