/* DADZ Translator – Design nach der Palette der Website */

.dadz-tr {
    --dadz-accent: #6F8340;
    --dadz-accent-dark: #5A6B33;
    --dadz-deep: #212913;
    --dadz-paper: #FEFEFD;
    --dadz-cream: #F4F4EC;
    --dadz-line: #E2E2D8;
    --dadz-muted: #6D7782;

    position: fixed;
    z-index: 175;
    font-family: 'Nunito', system-ui, sans-serif;
}

/* [hidden] muss Vorrang vor den Klassenregeln behalten */
.dadz-tr [hidden] { display: none !important; }

/* ── Aufklappmenü ───────────────────────────────────────────────────── */

.dadz-tr__toggle {
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    padding: .7rem 1rem;
    background: var(--dadz-deep);
    color: var(--dadz-paper);
    border: 1px solid var(--dadz-deep);
    border-radius: 3px;
    cursor: pointer;
    font-family: 'Montserrat', system-ui, sans-serif;
    font-size: .74rem;
    font-weight: 600;
    letter-spacing: .1em;
    text-transform: uppercase;
    box-shadow: 0 6px 22px rgba(33,41,19,.2);
    transition: background .25s ease, border-color .25s ease;
}
.dadz-tr__toggle:hover { background: var(--dadz-accent); border-color: var(--dadz-accent); }
.dadz-tr__toggle:focus-visible { outline: 2px solid var(--dadz-accent); outline-offset: 3px; }
.dadz-tr__toggle svg { width: 17px; height: 17px; flex: none; }

.dadz-tr__caret { transition: transform .3s cubic-bezier(.22,.61,.36,1); }
.dadz-tr__toggle[aria-expanded="true"] .dadz-tr__caret { transform: rotate(180deg); }

.dadz-tr__menu {
    position: absolute;
    left: 0;
    min-width: 200px;
    max-height: 320px;
    overflow-y: auto;
    margin: 8px 0 0;
    padding: 6px;
    list-style: none;
    background: var(--dadz-paper);
    border: 1px solid var(--dadz-line);
    border-radius: 3px;
    box-shadow: 0 14px 40px rgba(18,21,26,.16);
}
.dadz-tr--up .dadz-tr__menu { top: auto; bottom: 100%; margin: 0 0 8px; }

.dadz-tr__menu li { margin: 0; }

.dadz-tr__item {
    display: flex;
    align-items: center;
    gap: .7rem;
    width: 100%;
    padding: .55rem .7rem;
    background: none;
    border: 0;
    border-radius: 2px;
    cursor: pointer;
    text-align: left;
    font-size: .92rem;
    color: #12151A;
    transition: background .2s ease, color .2s ease;
}
.dadz-tr__item:hover { background: var(--dadz-cream); color: var(--dadz-accent-dark); }
.dadz-tr__item:focus-visible { outline: 2px solid var(--dadz-accent); outline-offset: -2px; }
.dadz-tr__item.is-active { background: var(--dadz-accent); color: var(--dadz-paper); }

.dadz-tr__flag {
    width: 20px;
    height: 14px;
    flex: none;
    display: block;
    border: 1px solid rgba(18,21,26,.14);
    border-radius: 1px;
    object-fit: cover;
}

/* ── Flaggenleiste ──────────────────────────────────────────────────── */

.dadz-tr--flags .dadz-tr__flags {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    max-width: 260px;
    padding: 8px;
    background: var(--dadz-paper);
    border: 1px solid var(--dadz-line);
    border-radius: 3px;
    box-shadow: 0 8px 26px rgba(18,21,26,.12);
}
.dadz-tr--flags .dadz-tr__item {
    width: auto;
    flex-direction: column;
    gap: 3px;
    padding: .4rem .45rem;
}
.dadz-tr--flags .dadz-tr__flag { width: 26px; height: 18px; }
.dadz-tr--flags .dadz-tr__item.is-active .dadz-tr__flag {
    outline: 2px solid var(--dadz-accent);
    outline-offset: 1px;
}
.dadz-tr--flags .dadz-tr__name {
    font-family: 'Montserrat', system-ui, sans-serif;
    font-size: .62rem;
    font-weight: 600;
    letter-spacing: .08em;
}

/* ── Einwilligung ───────────────────────────────────────────────────── */

.dadz-tr__consent {
    position: absolute;
    left: 0;
    width: 290px;
    margin: 8px 0 0;
    padding: 1rem 1.1rem;
    background: var(--dadz-deep);
    color: rgba(254,254,253,.82);
    border-radius: 3px;
    box-shadow: 0 14px 40px rgba(18,21,26,.28);
}
.dadz-tr--up .dadz-tr__consent { top: auto; bottom: 100%; margin: 0 0 8px; }
.dadz-tr__consent p { margin: 0 0 .9rem; font-size: .85rem; line-height: 1.6; }

.dadz-tr__consent-actions { display: flex; gap: .5rem; }

.dadz-tr__btn {
    flex: 1;
    padding: .55rem .8rem;
    border-radius: 2px;
    cursor: pointer;
    font-family: 'Montserrat', system-ui, sans-serif;
    font-size: .68rem;
    font-weight: 600;
    letter-spacing: .1em;
    text-transform: uppercase;
    transition: background .25s ease, border-color .25s ease;
}
.dadz-tr__btn--primary { background: var(--dadz-accent); color: var(--dadz-paper); border: 1px solid var(--dadz-accent); }
.dadz-tr__btn--primary:hover { background: var(--dadz-accent-dark); border-color: var(--dadz-accent-dark); }
.dadz-tr__btn--ghost { background: transparent; color: rgba(254,254,253,.8); border: 1px solid rgba(254,254,253,.35); }
.dadz-tr__btn--ghost:hover { background: rgba(254,254,253,.1); }

/* ── Vorschlag nach Spracherkennung ─────────────────────────────────── */

.dadz-tr__suggest {
    position: absolute;
    left: 0;
    width: 300px;
    margin: 8px 0 0;
    padding: 1rem 1.1rem;
    background: var(--dadz-paper);
    color: #12151A;
    border: 1px solid var(--dadz-line);
    border-left: 3px solid var(--dadz-accent);
    border-radius: 3px;
    box-shadow: 0 14px 40px rgba(18,21,26,.18);
    animation: dadz-tr-in .45s cubic-bezier(.22,.61,.36,1);
}
.dadz-tr--up .dadz-tr__suggest { top: auto; bottom: 100%; margin: 0 0 8px; }

.dadz-tr__suggest-text {
    margin: 0 0 .9rem;
    font-size: .88rem;
    line-height: 1.6;
}
.dadz-tr__suggest .dadz-tr__btn--ghost {
    color: #6D7782;
    border-color: var(--dadz-line);
}
.dadz-tr__suggest .dadz-tr__btn--ghost:hover {
    background: var(--dadz-cream);
    color: #12151A;
}

@keyframes dadz-tr-in {
    from { opacity: 0; transform: translateY(10px); }
    to   { opacity: 1; transform: none; }
}

/* ── Google-Element unsichtbar halten ───────────────────────────────── */

#dadz-tr-google { position: absolute; width: 0; height: 0; overflow: hidden; }

/* Die von Google eingefügte Kopfleiste stört das Layout – ausblenden */
.skiptranslate iframe.skiptranslate,
iframe.goog-te-banner-frame { display: none !important; }
body { top: 0 !important; }
.goog-te-gadget { font-size: 0 !important; }
.goog-logo-link, .goog-te-gadget span { display: none !important; }

@media (max-width: 700px) {
    .dadz-tr__toggle { padding: .6rem .8rem; font-size: .68rem; }
    .dadz-tr__menu { min-width: 170px; max-height: 260px; }
    .dadz-tr__consent { width: min(290px, calc(100vw - 48px)); }
    .dadz-tr__suggest { width: min(300px, calc(100vw - 48px)); }
    .dadz-tr--flags .dadz-tr__flags { max-width: calc(100vw - 48px); }
}

@media (prefers-reduced-motion: reduce) {
    .dadz-tr *, .dadz-tr *::before { transition: none !important; }
    .dadz-tr__suggest { animation: none; }
}