/* Burger-Menü – FGR Theme */

button#dsc-nav-button,
#dsc-nav-panel {
    display: none;
}

/* =========================================================
   Overlay-Panel
   ========================================================= */
#dsc-nav-panel {
    z-index: 99998;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    overflow-y: auto;
    overflow-x: hidden;
    background: rgba(33, 182, 232, 0.95);
    box-sizing: border-box;
}

#dsc-nav-panel,
#dsc-nav-panel * {
    box-sizing: border-box;
}

#dsc-nav-content {
    padding: 40px 0 30px;
}

/* =========================================================
   Menüliste
   ========================================================= */
#dsc-nav-list {
    width: 100%;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

#dsc-nav-panel ul {
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    width: 100%;
}

/* =========================================================
   Menüeinträge (li)
   ========================================================= */
#dsc-nav-panel .dsc-nav-item {
    width: 100%;
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

/* =========================================================
   Menülink  –  Flex: Titel links, Pfeil rechts
   ========================================================= */
#dsc-nav-panel .dsc-nav-item a.dsc-nav-link {
    display: flex !important;
    align-items: stretch !important;
    width: 100% !important;
    min-height: 70px !important;
    padding: 0 !important;
    margin: 0 !important;
    text-decoration: none !important;
    color: rgba(0, 20, 56, 1) !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    transition: color 0.25s;
}

#dsc-nav-panel .dsc-nav-item a.dsc-nav-link:hover,
#dsc-nav-panel .dsc-nav-item a.dsc-nav-link:focus {
    color: #ffffff !important;
    background: transparent !important;
    outline: none;
}

/* Titel-Span */
#dsc-nav-panel .dsc-nav-link .dsc-nav-title {
    display: flex !important;
    align-items: center !important;
    flex: 1 1 auto !important;
    padding: 10px 5% !important;
    font-size: 38px !important;
    line-height: 1.1 !important;
    font-family: 'Kanit', sans-serif !important;
    font-weight: 400 !important;
    word-break: break-word;
}

/* =========================================================
   Pfeil-Box  –  dreht sich beim Öffnen
   ========================================================= */
#dsc-nav-panel .dsc-nav-link .dsc-nav-arrow {
    flex: 0 0 70px !important;
    width: 70px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
    padding: 0 !important;
    font-size: 18px !important;
    line-height: 1 !important;
    font-family: sans-serif !important;
    font-weight: 400 !important;
    color: #ffffff !important;
    background: rgba(0, 0, 0, 0.25) !important;
    border-left: 1px solid rgba(0, 0, 0, 0.15) !important;
    cursor: pointer;
    transition: transform 0.3s ease, background 0.25s;
}

/* 1. Ebene: Pfeil mit gleichem Abstand zum Rand wie Burger-Button */
#dsc-nav-list > .dsc-nav-item > a.dsc-nav-link .dsc-nav-arrow {
    margin-right: 30px !important;
}

/* Pfeil zeigt nach oben wenn Untermenü offen */
#dsc-nav-panel .dsc-nav-item.dsc-nav-sub-open > a.dsc-nav-link .dsc-nav-arrow {
    transform: rotate(180deg);
    background: rgba(0, 0, 0, 0.45) !important;
}

#dsc-nav-panel .dsc-nav-item a.dsc-nav-link:hover .dsc-nav-arrow {
    background: rgba(0, 0, 0, 0.4) !important;
}

/* =========================================================
   Aktueller Menüeintrag
   ========================================================= */
#dsc-nav-list .dsc-nav-active > a.dsc-nav-link {
    color: #ffffff !important;
}

#dsc-nav-list .dsc-nav-active > a.dsc-nav-link .dsc-nav-title {
    font-weight: 700 !important;
}

/* =========================================================
   Untermenü  –  klappt nach unten auf (Accordion)
   ========================================================= */
#dsc-nav-list .dsc-nav-sub {
    display: none;
    width: 100%;
    background: rgba(0, 0, 0, 0.1);
}

/* 2. Ebene: kleinere Schrift, gleiche Höhe wie Burger-Button */
#dsc-nav-panel .dsc-nav-sub .dsc-nav-link .dsc-nav-title {
    font-size: 28px !important;
    padding-left: 5% !important;
}

#dsc-nav-panel .dsc-nav-sub .dsc-nav-link .dsc-nav-title::before {
    content: '›';
    margin-right: 10px !important;
    font-size: 24px !important;
    font-family: sans-serif !important;
    color: rgba(0, 20, 56, 0.6) !important;
    line-height: 1 !important;
    flex-shrink: 0;
}

#dsc-nav-panel .dsc-nav-sub .dsc-nav-item a.dsc-nav-link {
    min-height: 50px !important;
}

#dsc-nav-panel .dsc-nav-sub .dsc-nav-link .dsc-nav-arrow {
    flex: 0 0 50px !important;
    width: 50px !important;
}

/* =========================================================
   Hamburger-Button
   ========================================================= */
button#dsc-nav-button {
    z-index: 99999;
    position: fixed;
    top: 30px;
    right: 30px;
    width: 80px;
    height: 80px;
    display: flex !important;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    background: rgba(227, 6, 19, 1) !important;
    border: 0;
    margin: 0;
    padding: 0;
    overflow: hidden;
    outline: none;
    border-radius: 0;
    transition: background-color 0.5s;
}

button#dsc-nav-button:hover,
button#dsc-nav-button:focus {
    background: rgba(190, 0, 10, 1) !important;
}

.dsc-nav-accessible {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
}

.dsc-nav-box {
    width: 35px;
    height: 25px;
    display: inline-block;
    position: relative;
    pointer-events: none;
}

.dsc-nav-bar {
    display: block;
    top: 50%;
    margin-top: -2.5px;
}

.dsc-nav-bar,
.dsc-nav-bar::before,
.dsc-nav-bar::after {
    width: 35px;
    height: 5px;
    background-color: #ffffff;
    border-radius: 4px;
    position: absolute;
    transition-property: transform;
    transition-duration: 0.15s;
    transition-timing-function: ease;
}

.dsc-nav-bar::before,
.dsc-nav-bar::after {
    content: "";
    display: block;
}

.dsc-nav-bar::before { top: -10px; }
.dsc-nav-bar::after  { bottom: -10px; }

/* =========================================================
   Hamburger → X (Emphatic)
   ========================================================= */
.dsc-nav-emphatic { overflow: hidden; }

.dsc-nav-emphatic .dsc-nav-bar {
    transition: background-color 0.2s 0.25s ease-in;
}

.dsc-nav-emphatic .dsc-nav-bar::before {
    left: 0;
    transition: transform 0.2s cubic-bezier(0.6, 0.04, 0.98, 0.335),
                top 0.05s 0.2s linear,
                left 0.2s 0.25s ease-in;
}

.dsc-nav-emphatic .dsc-nav-bar::after {
    top: 10px;
    right: 0;
    transition: transform 0.2s cubic-bezier(0.6, 0.04, 0.98, 0.335),
                top 0.05s 0.2s linear,
                right 0.2s 0.25s ease-in;
}

.dsc-nav-emphatic.is-active .dsc-nav-bar {
    transition-delay: 0s;
    transition-timing-function: ease-out;
    background-color: transparent;
}

.dsc-nav-emphatic.is-active .dsc-nav-bar::before {
    left: -70px;
    top: -70px;
    transform: translate3d(70px, 70px, 0) rotate(45deg);
    transition: left 0.2s ease-out,
                top 0.05s 0.2s linear,
                transform 0.2s 0.25s cubic-bezier(0.075, 0.82, 0.165, 1);
}

.dsc-nav-emphatic.is-active .dsc-nav-bar::after {
    right: -70px;
    top: -70px;
    transform: translate3d(-70px, 70px, 0) rotate(-45deg);
    transition: right 0.2s ease-out,
                top 0.05s 0.2s linear,
                transform 0.2s 0.25s cubic-bezier(0.075, 0.82, 0.165, 1);
}