/* One navigation theme for the site, DJI simulator and O4 tool. */
.df-menu-shell, #siteMenu, #site-menu.site-menu {
  color: #203d35; background: #f5f7f3; border-right: 1px solid #dce5dc;
  width: min(90vw, 384px); box-shadow: 12px 0 60px #102f2a26;
}
.df-menu-shell { position: fixed; inset: 0 auto 0 0; height: 100dvh; display: flex; flex-direction: column; }
.df-menu-header, #siteMenu .dialog-heading, #site-menu .menu-heading {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  min-height: 76px; padding: 16px; border-bottom: 1px solid #dce5dc; background: #fff;
}
.df-menu-brand, #siteMenu .site-menu-brand, #site-menu .site-wordmark {
  color: #244c3e; font-size: 14px; font-weight: 750; letter-spacing: -.025em; text-transform: none;
}
.df-menu-header .language-switch, #siteMenu .language-switch, #site-menu .language-switch { background: #f1f5ef; border-color: #dce5dc; }
.df-menu-header .language-switch button, #siteMenu .language-switch button, #site-menu .language-switch button { color: #526b60; }
.df-menu-header .language-switch button[aria-pressed=true], #siteMenu .language-switch button[aria-pressed=true], #site-menu .language-switch button[aria-pressed=true] { color: #fff; background: #315e4d; }
.df-menu-close, #siteMenu .close-btn, #site-menu .menu-heading .menu-toggle {
  display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0;
  width: 36px; height: 36px; border: 1px solid #dce5dc; border-radius: 10px;
  color: #526b60; background: #fff; cursor: pointer;
}
.df-menu-close:hover, #siteMenu .close-btn:hover { background: #edf3ea; }
.df-menu-scroll { min-height: 0; flex: 1; overflow-y: auto; overscroll-behavior: contain; touch-action: pan-y; padding: 16px 14px 24px; -webkit-overflow-scrolling: touch; }
#siteMenu { overflow: hidden; color-scheme: light; }
#siteMenu[open] { display: flex; flex-direction: column; }
#siteMenu .dialog-heading { flex-shrink: 0; }
#siteMenu .dialog-scroll { min-height: 0; max-height: none; flex: 1; overscroll-behavior: contain; padding: 16px 14px 24px; }
#site-menu .menu-items { padding: 16px 14px 24px; }
:is(.df-site-nav, #siteMenuLinks) { display: flex; flex-direction: column; gap: 15px; color: #203d35; text-align: left; }
:is(.df-site-nav, #siteMenuLinks) .df-menu-group { --menu-ink: #426653; --menu-tint: #eaf1e5; margin: 0; padding: 0; border: 0; }
:is(.df-site-nav, #siteMenuLinks) [data-menu-section=practice] { --menu-ink: #496881; --menu-tint: #eaf1f6; }
:is(.df-site-nav, #siteMenuLinks) [data-menu-section=tools] { --menu-ink: #8a6b3e; --menu-tint: #f5efe3; }
:is(.df-site-nav, #siteMenuLinks) [data-menu-section=resources] { --menu-ink: #726485; --menu-tint: #f1edf5; }
:is(.df-site-nav, #siteMenuLinks) .df-menu-heading { margin: 0 0 7px 10px; padding: 0; color: #647569; font-size: 12px; line-height: 18px; font-weight: 650; letter-spacing: .015em; }
:is(.df-site-nav, #siteMenuLinks) .df-menu-list { padding: 4px; border: 1px solid #e0e6dc; border-radius: 16px; background: #fff; }
:is(.df-site-nav, #siteMenuLinks) .df-menu-link {
  position: relative; display: flex; align-items: center; gap: 11px; min-height: 44px;
  padding: 6px 9px; margin: 0; border: 0; border-radius: 11px;
  color: #2b4037; background: transparent; text-decoration: none; text-align: left;
  font-size: 14px; line-height: 21px; font-weight: 600;
  transition: background .16s ease, color .16s ease;
}
:is(.df-site-nav, #siteMenuLinks) .df-menu-link + .df-menu-link { margin-top: 1px; }
:is(.df-site-nav, #siteMenuLinks) .df-menu-link:hover { color: #193d2e; background: #f0f5ed; }
:is(.df-site-nav, #siteMenuLinks) .df-menu-link:focus-visible,
:is(.df-site-nav, #siteMenuLinks) summary:focus-visible { outline: 2px solid #527b65; outline-offset: 2px; }
:is(.df-site-nav, #siteMenuLinks) .df-menu-icon {
  display: inline-flex; align-items: center; justify-content: center; flex: 0 0 30px;
  width: 30px; height: 30px; border-radius: 9px; color: var(--menu-ink); background: var(--menu-tint);
}
:is(.df-site-nav, #siteMenuLinks) .df-menu-icon svg { width: 19px; height: 19px; }
:is(.df-site-nav, #siteMenuLinks) .df-menu-label { flex: 1; min-width: 0; word-break: keep-all; overflow-wrap: anywhere; }
:is(.df-site-nav, #siteMenuLinks) .df-menu-arrow { display: inline-flex; flex: 0 0 14px; margin-left: auto; color: #9aa99b; }
:is(.df-site-nav, #siteMenuLinks) .df-menu-arrow svg { width: 14px; height: 14px; transition: transform .16s; }
:is(.df-site-nav, #siteMenuLinks) .df-menu-link[aria-current=page] { color: #fff; background: #285340; box-shadow: 0 2px 5px #173a2314; }
:is(.df-site-nav, #siteMenuLinks) .df-menu-link[aria-current=page] .df-menu-icon { background: #ffffff18; color: #cde6bb; }
:is(.df-site-nav, #siteMenuLinks) .df-menu-link[aria-current=page] .df-menu-arrow { color: #cde6bb; }
:is(.df-site-nav, #siteMenuLinks) .df-menu-upcoming { margin: 0; padding: 0; border: 0; border-top: 1px solid #dde5d9; border-radius: 0; background: transparent; }
:is(.df-site-nav, #siteMenuLinks) .df-menu-upcoming summary { display: flex; align-items: center; gap: 8px; min-height: 44px; margin: 0; padding: 10px; font-size: 12px; font-weight: 600; color: #69786b; cursor: pointer; list-style: none; }
:is(.df-site-nav, #siteMenuLinks) summary::-webkit-details-marker { display: none; }
:is(.df-site-nav, #siteMenuLinks) .df-menu-upcoming[open] summary .df-menu-arrow svg { transform: rotate(90deg); }
:is(.df-site-nav, #siteMenuLinks) .df-menu-count { padding: 0 6px; border-radius: 5px; background: #e6eddf; font-size: 11px; line-height: 18px; }
:is(.df-site-nav, #siteMenuLinks) .df-menu-pending { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 0; padding: 9px; border: 0; border-radius: 0; color: #68766d; background: transparent; font-size: 13px; font-weight: 500; line-height: 20px; }
:is(.df-site-nav, #siteMenuLinks) .df-menu-pending small { float: none; flex-shrink: 0; margin: 0; padding: 0; border: 0; background: transparent; color: #69786b; font-size: 11px; font-weight: 500; }
@media (prefers-reduced-motion: reduce) { :is(.df-site-nav, #siteMenuLinks) * { transition: none; } }