/* Custom Theme Styles - Additional styles to complement existing styles.css */

/* Dropdown Menu Styles */
.dropdown-menu {
    border: none;
    box-shadow: 0 0.5rem 1.5rem rgba(0, 0, 0, 0.15);
    border-radius: 0.5rem;
    padding: 0.5rem 0;
    margin-top: 0.5rem;
    min-width: 220px;
}

.dropdown-menu .dropdown-header {
    font-weight: 600;
    color: var(--bs-primary);
    padding: 0.5rem 1rem;
    font-size: 0.875rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.dropdown-menu .dropdown-item {
    padding: 0.75rem 1rem;
    font-size: 0.875rem;
    transition: all 0.2s ease;
    color: var(--bs-dark);
}

.dropdown-menu .dropdown-item:hover {
    background-color: rgba(var(--bs-primary-rgb), 0.1);
    color: var(--bs-primary);
    transform: translateX(2px);
}

.dropdown-menu .dropdown-divider {
    margin: 0.5rem 0;
    border-color: rgba(0, 0, 0, 0.1);
}

.dropdown-toggle::after {
    margin-left: 0.5rem;
    transition: transform 0.2s ease;
}

.dropdown.show .dropdown-toggle::after {
    transform: rotate(180deg);
}

/* Mobile dropdown styles */
@media (max-width: 991px) {
    .dropdown-menu {
        border: none;
        box-shadow: none;
        background: transparent;
        padding: 0;
        margin: 0;
        min-width: auto;
    }

    .dropdown-menu .dropdown-header {
        background: transparent;
        color: var(--bs-muted);
        padding: 0.5rem 0;
        font-size: 0.875rem;
    }

    .dropdown-menu .dropdown-item {
        background: transparent;
        padding: 0.5rem 0;
        color: var(--bs-muted);
    }

    .dropdown-menu .dropdown-item:hover {
        background: transparent;
        color: var(--bs-dark);
        transform: none;
    }

    .dropdown-menu .dropdown-divider {
        display: none;
    }
}

/* Language Switcher Customization */
.lang-switcher {
    position: relative;
    display: inline-block;
}

.lang-switcher-btn {
    background: rgba(255, 255, 255, 0.1) !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
    color: #fff !important;
    font-size: 0.875rem;
    padding: 0.5rem 0.75rem;
    border-radius: 0.5rem;
    transition: all 0.3s ease;
    backdrop-filter: blur(10px);
}

.lang-switcher-btn:hover {
    background: rgba(255, 255, 255, 0.2) !important;
    border-color: rgba(255, 255, 255, 0.3) !important;
    color: #fff !important;
    transform: translateY(-1px);
}

.lang-switcher-btn:focus {
    box-shadow: 0 0 0 0.2rem rgba(255, 255, 255, 0.25);
}

.lang-code {
    font-weight: 600;
    margin-left: 0.25rem;
}

.lang-dropdown {
    min-width: 140px;
    border: none;
    box-shadow: 0 0.5rem 1.5rem rgba(0, 0, 0, 0.15);
    border-radius: 0.5rem;
    padding: 0.5rem 0;
    backdrop-filter: blur(10px);
    background: rgba(255, 255, 255, 0.95);
}

.lang-dropdown .dropdown-item {
    padding: 0.75rem 1rem;
    font-size: 0.875rem;
    transition: all 0.2s ease;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.lang-dropdown .dropdown-item:hover {
    background-color: rgba(var(--bs-primary-rgb), 0.1);
    color: var(--bs-primary);
    transform: translateX(2px);
}

.lang-dropdown .dropdown-item.active {
    background-color: var(--bs-primary);
    color: var(--bs-white);
    font-weight: 600;
}

.lang-flag {
    font-size: 1.2rem;
    line-height: 1;
}

.lang-name {
    font-weight: 500;
}

/* Language Switcher Dropdown Dark Theme */
.lang-dropdown.dropdown-menu-dark {
    background: #222;
    color: #fff;
    border: none;
}

.lang-dropdown .dropdown-item {
    color: #fff;
    background: transparent;
    transition: background 0.2s, color 0.2s;
}

.lang-dropdown .dropdown-item.active,
.lang-dropdown .dropdown-item:hover {
    background: #444;
    color: #fff;
}

.lang-flag {
    font-size: 1.2em;
}

.lang-name {
    font-weight: 500;
}

.lang-code {
    font-size: 0.9em;
    opacity: 0.7;
}

/* Mobile language switcher */
@media (max-width: 768px) {
    .lang-switcher-btn {
        width: 100%;
        justify-content: flex-start;
        background: rgba(0, 0, 0, 0.05) !important;
        border-color: rgba(0, 0, 0, 0.1) !important;
        color: var(--bs-dark) !important;
    }

    .lang-switcher-btn:hover {
        background: rgba(0, 0, 0, 0.1) !important;
        color: var(--bs-dark) !important;
    }

    .lang-dropdown {
        width: 100%;
        background: rgba(255, 255, 255, 0.98);
        border: 1px solid rgba(0, 0, 0, 0.1);
    }

    .lang-dropdown .dropdown-item {
        color: var(--bs-dark);
    }

    .lang-dropdown .dropdown-item:hover {
        background: rgba(0, 0, 0, 0.05);
        color: var(--bs-dark);
    }
}

/* Footer Styles */
.element-footer {
    position: relative;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: #fff;
    padding: 4rem 0 2rem;
    overflow: hidden;
}

.element-footer:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><defs><pattern id="grain" width="100" height="100" patternUnits="userSpaceOnUse"><circle cx="50" cy="50" r="1" fill="rgba(255,255,255,0.1)"/></pattern></defs><rect width="100" height="100" fill="url(%23grain)"/></svg>');
    opacity: 0.3;
}

.element-footer>.container {
    position: relative;
    z-index: 1;
}

.element-footer .footer-decoration-1,
.element-footer .footer-decoration-2 {
    position: absolute;
    width: 200px;
    height: 200px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.1);
    filter: blur(40px);
}

.element-footer .footer-decoration-1 {
    top: -100px;
    right: -100px;
    animation: float 6s ease-in-out infinite;
}

.element-footer .footer-decoration-2 {
    bottom: -100px;
    left: -100px;
    animation: float 6s ease-in-out infinite reverse;
}

.element-footer .footer-nav {
    margin-bottom: 2rem;
}

.element-footer .footer-nav .nav {
    list-style: none;
    padding: 0;
}

.element-footer .footer-nav .nav .nav-item {
    margin-bottom: 0.5rem;
}

.element-footer .footer-nav .nav .nav-item.nav-item-header>a {
    font-weight: 600;
    color: #fff;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 1rem;
    display: block;
}

.element-footer .footer-nav .nav .nav-item>a {
    color: rgba(255, 255, 255, 0.8);
    text-decoration: none;
    transition: color 0.3s ease;
}

.element-footer .footer-brand {
    margin-bottom: 2rem;
}

.element-footer .footer-social .nav .nav-item:first-child>a {
    padding-left: 0;
}

.element-footer .footer-social .nav .nav-item img {
    width: 24px;
    height: 24px;
    opacity: 0.8;
    transition: opacity 0.3s ease;
}

.element-footer .footer-copyright {
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    padding-top: 2rem;
    margin-top: 2rem;
}

.element-footer .footer-copyright p {
    color: rgba(255, 255, 255, 0.6);
    margin: 0;
    font-size: 0.875rem;
}

@media (max-width: 991px) {
    .element-footer {
        padding: 3rem 0 1.5rem;
    }
}

.api-injection-point {
    position: relative;
    display: inline-block;
    padding: 0.5rem 1rem;
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 0.5rem;
    color: #fff;
    text-decoration: none;
    transition: all 0.3s ease;
    backdrop-filter: blur(10px);
}

.api-injection-point:hover {
    background: rgba(255, 255, 255, 0.2);
    border-color: rgba(255, 255, 255, 0.3);
    color: #fff;
    transform: translateY(-1px);
    text-decoration: none;
}

.api-injection-point::before {
    content: '🔗';
    margin-right: 0.5rem;
    font-size: 1.1em;
}

.api-injection-point.has-content::before {
    content: '✅';
}

/* Flag Icons Styles */
.lang-flag i {
    width: 1.2em;
    height: 1.2em;
    display: inline-block;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    border-radius: 2px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
}

/* General flag icon styles for language switcher */
[class^="flag-"] {
    width: 1.2em;
    height: 1.2em;
    display: inline-block;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    border-radius: 2px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
    vertical-align: middle;
}

/* Flag CSS Classes - Using CSS sprites for flags */
/* Map en to us flag */
.flag-us,
.flag-en {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 480"><path fill="%23bd3d44" d="M0 0h640v480H0z"/><path stroke="%23fff" stroke-width="37" d="m0 55.3 640 369.4M0 424.7 640 55.3"/><path fill="%23192264" d="M0 0v369.4l640 110.6V0z"/><path fill="%23fff" d="m0 0 640 110.6V0z"/></svg>');
}

.flag-es {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 480"><path fill="%23c60b1e" d="M0 0h640v480H0z"/><path fill="%23ffc400" d="M0 120h640v240H0z"/></svg>');
}

.flag-ru {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 480"><path fill="%23fff" d="M0 0h640v480H0z"/><path fill="%230039a6" d="M0 160h640v160H0z"/><path fill="%23d52b1e" d="M0 320h640v160H0z"/></svg>');
}

.flag-fr {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 480"><path fill="%23ed2939" d="M0 0h213.3v480H0z"/><path fill="%23fff" d="M213.3 0h213.4v480H213.3z"/><path fill="%23002395" d="M426.7 0H640v480H426.7z"/></svg>');
}

.flag-de {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 480"><path fill="%23ffce00" d="M0 320h640v160H0z"/><path d="M0 0h640v160H0z"/><path fill="%23d00" d="M0 160h640v160H0z"/></svg>');
}

.flag-it {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 480"><path fill="%23fff" d="M0 0h640v480H0z"/><path fill="%23009245" d="M0 0h213.3v480H0z"/><path fill="%23ce2b37" d="M426.7 0H640v480H426.7z"/></svg>');
}

.flag-uk {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 480"><path fill="%23012" d="M0 0h640v480H0z"/><path fill="%23FFF" d="m75 0 244 181L562 0h78v62L400 241l240 178v61h-80L320 301 81 480H0v-60l239-178L0 64V0h75z"/><path fill="%23C8102E" d="m424 281 216 159v40L369 281h55zm-184 20 6 35L54 480H0l240-179zM640 0v3L391 191l2-44L590 0h50zM0 0l239 176h-60L0 42V0z"/><path fill="%23FFF" d="M241 0v480h160V0H241zM0 160v160h640V160H0z"/><path fill="%23C8102E" d="M0 193v96h640v-96H0zM273 0v480h96V0h-96z"/></svg>');
}

/* Map zh to cn flag */
.flag-cn,
.flag-zh {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 480"><path fill="%23de2910" d="M0 0h640v480H0z"/><path fill="%23ffde00" d="m114.3 98.5 6.1 18.7 19.4.1-15.7 11.4 6 18.7-15.8-11.4-15.8 11.4 6-18.7-15.7-11.4 19.4-.1z"/><path fill="%23ffde00" d="m204.3 98.5 6.1 18.7 19.4.1-15.7 11.4 6 18.7-15.8-11.4-15.8 11.4 6-18.7-15.7-11.4 19.4-.1z"/><path fill="%23ffde00" d="m294.3 98.5 6.1 18.7 19.4.1-15.7 11.4 6 18.7-15.8-11.4-15.8 11.4 6-18.7-15.7-11.4 19.4-.1z"/><path fill="%23ffde00" d="m384.3 98.5 6.1 18.7 19.4.1-15.7 11.4 6 18.7-15.8-11.4-15.8 11.4 6-18.7-15.7-11.4 19.4-.1z"/><path fill="%23ffde00" d="m474.3 98.5 6.1 18.7 19.4.1-15.7 11.4 6 18.7-15.8-11.4-15.8 11.4 6-18.7-15.7-11.4 19.4-.1z"/><path fill="%23ffde00" d="m564.3 98.5 6.1 18.7 19.4.1-15.7 11.4 6 18.7-15.8-11.4-15.8 11.4 6-18.7-15.7-11.4 19.4-.1z"/><path fill="%23ffde00" d="m159.3 120.5 6.1 18.7 19.4.1-15.7 11.4 6 18.7-15.8-11.4-15.8 11.4 6-18.7-15.7-11.4 19.4-.1z"/><path fill="%23ffde00" d="m249.3 120.5 6.1 18.7 19.4.1-15.7 11.4 6 18.7-15.8-11.4-15.8 11.4 6-18.7-15.7-11.4 19.4-.1z"/><path fill="%23ffde00" d="m339.3 120.5 6.1 18.7 19.4.1-15.7 11.4 6 18.7-15.8-11.4-15.8 11.4 6-18.7-15.7-11.4 19.4-.1z"/><path fill="%23ffde00" d="m429.3 120.5 6.1 18.7 19.4.1-15.7 11.4 6 18.7-15.8-11.4-15.8 11.4 6-18.7-15.7-11.4 19.4-.1z"/><path fill="%23ffde00" d="m519.3 120.5 6.1 18.7 19.4.1-15.7 11.4 6 18.7-15.8-11.4-15.8 11.4 6-18.7-15.7-11.4 19.4-.1z"/><path fill="%23ffde00" d="m204.3 142.5 6.1 18.7 19.4.1-15.7 11.4 6 18.7-15.8-11.4-15.8 11.4 6-18.7-15.7-11.4 19.4-.1z"/><path fill="%23ffde00" d="m294.3 142.5 6.1 18.7 19.4.1-15.7 11.4 6 18.7-15.8-11.4-15.8 11.4 6-18.7-15.7-11.4 19.4-.1z"/><path fill="%23ffde00" d="m384.3 142.5 6.1 18.7 19.4.1-15.7 11.4 6 18.7-15.8-11.4-15.8 11.4 6-18.7-15.7-11.4 19.4-.1z"/><path fill="%23ffde00" d="m474.3 142.5 6.1 18.7 19.4.1-15.7 11.4 6 18.7-15.8-11.4-15.8 11.4 6-18.7-15.7-11.4 19.4-.1z"/><path fill="%23ffde00" d="m249.3 164.5 6.1 18.7 19.4.1-15.7 11.4 6 18.7-15.8-11.4-15.8 11.4 6-18.7-15.7-11.4 19.4-.1z"/><path fill="%23ffde00" d="m339.3 164.5 6.1 18.7 19.4.1-15.7 11.4 6 18.7-15.8-11.4-15.8 11.4 6-18.7-15.7-11.4 19.4-.1z"/><path fill="%23ffde00" d="m429.3 164.5 6.1 18.7 19.4.1-15.7 11.4 6 18.7-15.8-11.4-15.8 11.4 6-18.7-15.7-11.4 19.4-.1z"/><path fill="%23ffde00" d="m294.3 186.5 6.1 18.7 19.4.1-15.7 11.4 6 18.7-15.8-11.4-15.8 11.4 6-18.7-15.7-11.4 19.4-.1z"/><path fill="%23ffde00" d="m384.3 186.5 6.1 18.7 19.4.1-15.7 11.4 6 18.7-15.8-11.4-15.8 11.4 6-18.7-15.7-11.4 19.4-.1z"/><path fill="%23ffde00" d="m339.3 208.5 6.1 18.7 19.4.1-15.7 11.4 6 18.7-15.8-11.4-15.8 11.4 6-18.7-15.7-11.4 19.4-.1z"/></svg>');
}

/* Map jp */
.flag-jp {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 480"><path fill="%23fff" d="M0 0h640v480H0z"/><circle fill="%23bc002d" cx="320" cy="240" r="120"/></svg>');
}

/* Map kr to ko flag */
.flag-kr,
.flag-ko {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 480"><path fill="%23fff" d="M0 0h640v480H0z"/><g transform="rotate(-56.3 367.3 -47.6) scale(.88)"><g id="b"><path id="a" fill="%23fff" d="M-6-26H6v2H-6zm0 3H6v2H-6zm0 3H6v2H-6z"/><use href="%23a" width="100%" height="100%" y="44"/></g><path stroke="%23fff" stroke-width="2" d="M0 17v10"/><path fill="%23cd2e3a" d="M0-12a12 12 0 0 1 0 24 12 12 0 0 1 0-24z"/><path fill="%2300417e" d="M0-12a12 12 0 0 0 0 24 12 12 0 0 0 0-24z"/></g><g transform="rotate(-123.7 191.2 62.2) scale(.88)"><use href="%23b" width="100%" height="100%"/><path stroke="%23fff" stroke-width="2" d="M0-23.5v3M0 17v3.5m0 3v3"/></g></svg>');
}

/* India - hi */
.flag-hi,
.flag-in {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 480"><path fill="%23f93" d="M0 0h640v160H0z"/><path fill="%23fff" d="M0 160h640v160H0z"/><path fill="%23128807" d="M0 320h640v160H0z"/><g transform="matrix(3.2 0 0 3.2 320 240)"><circle r="20" fill="%23008"/><circle r="17.5" fill="%23fff"/><circle r="3.5" fill="%23008"/><g id="d"><g id="c"><g id="b"><g id="a" fill="%23008"><path d="M0 17.5.6 7 0 2l-.6 5L0 17.5z"/></g><use href="%23a" transform="rotate(15)"/></g><use href="%23b" transform="rotate(30)"/></g><use href="%23c" transform="rotate(60)"/></g><use href="%23d" transform="rotate(120)"/><use href="%23d" transform="rotate(240)"/></g></svg>');
}

/* Indonesia - id */
.flag-id {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 480"><path fill="%23e70011" d="M0 0h640v240H0z"/><path fill="%23fff" d="M0 240h640v240H0z"/></svg>');
}

/* Vietnam - vi */
.flag-vi,
.flag-vn {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 480"><path fill="%23da251d" d="M0 0h640v480H0z"/><path fill="%23ff0" d="M320 125.6l57.1 175.7h-184.8l149.5-108.6-57.1 175.8z"/></svg>');
}

/* Thailand - th */
.flag-th {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 480"><path fill="%23ed1c24" d="M0 0h640v480H0z"/><path fill="%23fff" d="M0 80h640v320H0z"/><path fill="%23241d4f" d="M0 160h640v160H0z"/></svg>');
}

.flag-pl {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 480"><path fill="%23fff" d="M0 0h640v480H0z"/><path fill="%23dc143c" d="M0 240h640v240H0z"/></svg>');
}

.flag-pt {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 480"><path fill="%23f00" d="M0 0h640v480H0z"/><path fill="%230600" d="M240 0h400v480H240z"/><circle fill="%23ff0" cx="240" cy="240" r="80"/><circle fill="%23fff" cx="240" cy="240" r="60"/><circle fill="%23000" cx="240" cy="240" r="40"/></svg>');
}

.flag-br {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 480"><path fill="%23009c3b" d="M0 0h640v480H0z"/><path fill="%23ffdf00" d="M175.2 240c0 44.2 35.8 80 80 80s80-35.8 80-80-35.8-80-80-80-80 35.8-80 80z"/><path fill="%23002156" d="M255.2 160c-44.2 0-80 35.8-80 80s35.8 80 80 80c13.3 0 25.9-3.2 37.1-8.9-23.9-49.5-23.9-109.7 0-159.1-11.2-5.7-23.8-8.9-37.1-8.9z"/></svg>');
}

.flag-ar {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 480"><path fill="%23fff" d="M0 0h640v480H0z"/><path fill="%23000" d="M0 0h640v160H0z"/><path fill="%23000" d="M0 320h640v160H0z"/><path fill="%23000" d="M213.3 0h213.4v480H213.3z"/></svg>');
}

.flag-tr {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 480"><path fill="%23e30a17" d="M0 0h640v480H0z"/><circle fill="%23fff" cx="320" cy="240" r="120"/><circle fill="%23e30a17" cx="350" cy="240" r="96"/><polygon fill="%23fff" points="400,240 416.6,272.5 386.8,249.2 353.2,249.2 323.4,272.5 340,240 323.4,207.5 353.2,230.8 386.8,230.8 416.6,207.5"/></svg>');
}

.flag-ua {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 480"><path fill="%23005bbb" d="M0 0h640v240H0z"/><path fill="%23ffd700" d="M0 240h640v240H0z"/></svg>');
}

/* Additional flag classes for common languages */
.flag-nl {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 480"><path fill="%23ae1c28" d="M0 0h640v480H0z"/><path fill="%23fff" d="M0 0h640v320H0z"/><path fill="%23214969" d="M0 0h640v160H0z"/></svg>');
}

.flag-se {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 480"><path fill="%23006aa7" d="M0 0h640v480H0z"/><path fill="%23fecc00" d="M0 0h256v256H0z"/><path fill="%23fecc00" d="M256 0h128v128H256z"/></svg>');
}

.flag-no {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 480"><path fill="%23ef2b2d" d="M0 0h640v480H0z"/><path fill="%23fff" d="M180 0h120v480H180z"/><path fill="%23fff" d="M0 180h640v120H0z"/><path fill="%2300272d" d="M210 0h60v480H210z"/><path fill="%2300272d" d="M0 210h640v60H0z"/></svg>');
}

.flag-dk {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 480"><path fill="%23c8102e" d="M0 0h640v480H0z"/><path fill="%23fff" d="M180 0h120v480H180z"/><path fill="%23fff" d="M0 180h640v120H0z"/></svg>');
}

.flag-fi {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 480"><path fill="%23fff" d="M0 0h640v480H0z"/><path fill="%23003f87" d="M0 0h256v480H0z"/><path fill="%23003f87" d="M256 0h128v256H256z"/></svg>');
}

/* Active Navigation States */
.nav-link.active {
    background-color: var(--bs-primary-bg-subtle) !important;
    color: var(--bs-primary) !important;
    border-radius: var(--bs-border-radius);
}

.nav-link.active:hover {
    background-color: var(--bs-primary-bg-subtle) !important;
    color: var(--bs-primary) !important;
}

/* Mobile Active States */
@media (max-width: 991px) {

    .nav-link.active,
    a.active {
        background-color: var(--bs-primary-bg-subtle) !important;
        color: var(--bs-primary) !important;
        font-weight: 600 !important;
    }
}