/* Navigation Pane - Button Style */
.navbar-nav {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 10px 0;
    border: none !important;
}

.navbar-nav li {
    list-style: none;
    border: none !important;
}

.navbar-nav li a {
    background-color: transparent;
    color: white !important;
    border: 2px solid white !important;
    padding: 10px 20px;
    border-radius: 8px;
    text-decoration: none !important;
    font-weight: bold !important;
    display: inline-block;
    transition: background-color 0.25s ease, color 0.25s ease,
                border-color 0.25s ease, box-shadow 0.25s ease;
}

/* Hover + Focus-visible states */
.navbar-nav li a:hover,
.navbar-nav li a:focus-visible {
    background-color: #ffd200 !important;
    color: #1b3d6d !important;
    text-decoration: none !important;
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(27, 61, 109, 0.5); /* subtle blue ring */
}

/* Dropdown Toggle Button */
.navbar-toggle,
.navbar-toggle:focus,
.navbar-toggle:hover {
    background-color: #1b3d6d !important;
    border: 2px solid white !important;
    transition: background-color 0.25s ease, color 0.25s ease,
                border-color 0.25s ease, box-shadow 0.25s ease;
}

/* Dropdown Menu */
.dropdown-menu {
    background-color: #1b3d6d !important;
    text-align: center !important;
    margin: 10px !important;
}

.dropdown-menu > li > a {
    color: white !important;
    font-weight: bold !important;
    border: 2px solid white !important;
    margin: 5px 10px !important;
    text-align: center !important;
    text-decoration: none !important;
    transition: background-color 0.25s ease, color 0.25s ease,
                border-color 0.25s ease, box-shadow 0.25s ease;
}

/* Hover + Focus-visible states for dropdown items */
.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus-visible {
    background-color: #ffd200 !important;
    color: #1b3d6d !important;
    text-decoration: none !important;
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(27, 61, 109, 0.5); /* subtle blue ring */
}

/* General Button Styling */
button,
.btn {
    background-color: transparent !important;
    color: #1b3d6d !important;
    border: 2px solid #1b3d6d !important;
    font-weight: bold !important;
    border-radius: 8px;
    padding: 10px 20px;
    text-decoration: none !important;
    transition: background-color 0.25s ease, color 0.25s ease,
                border-color 0.25s ease, box-shadow 0.25s ease;
}

/* Hover + Focus-visible states for buttons */
button:hover,
.btn:hover,
button:focus-visible,
.btn:focus-visible {
    background-color: #ffd200 !important;
    color: #1b3d6d !important;
    border: 2px solid #1b3d6d !important;
    text-decoration: none !important;
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(27, 61, 109, 0.5); /* subtle blue ring */
}

/* Iframe border drop shadow */
iframe[src*="apps.powerapps.com"] {
    border: black;
    border-width: 1px;
    border-spacing: 20px;
    border-radius: 20px;
    padding: 20px;
    box-shadow: 0 4px 24px 0 rgba(27, 61, 109, 0.12),
              0 1.5px 6px 0 rgba(27, 61, 109, 0.08);
}