/* v1.2: In OnePress, the fixed overlay sits next to the actual logo on desktop
   and next to the hamburger on mobile. It remains outside the header DOM so
   it cannot change the menu layout, cause wrapping or enlarge the header. */
body .tp-ampel-trigger {
    --tp-ampel-button-height: 48px;
    box-sizing: border-box;
    position: fixed !important;
    top: 75px;
    right: 12px;
    left: auto;
    bottom: auto;
    transform: translateY(-50%);
    display: inline-flex;
    width: 36px;
    height: var(--tp-ampel-button-height);
    padding: 2px;
    margin: 0;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 16px;
    background: transparent;
    color: inherit;
    cursor: pointer;
    z-index: 2147482000;
    line-height: 1;
    box-shadow: none;
    text-decoration: none;
    transition: opacity .2s ease;
}
/* The logo-to-menu gap can be narrow, so the desktop button uses a compact
   transparent hit area without making the coloured traffic light smaller. */
body .tp-ampel-trigger.tp-ampel-near-logo {
    width: 32px;
}
body .tp-ampel-trigger:hover { opacity: .87; background: transparent; }
body .tp-ampel-trigger:focus-visible { outline: 3px solid #4c9df7; outline-offset: 2px; }
.tp-ampel-housing {
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-around;
    width: 22px;
    height: calc(var(--tp-ampel-button-height) - 4px);
    padding: 3px 0;
    background: #20242a;
    border-radius: 12px;
    box-shadow: 0 1px 4px rgba(0,0,0,.20);
}
.tp-ampel-light {
    box-sizing: border-box;
    display: block;
    width: 9px;
    height: 9px;
    flex: 0 0 9px;
    border-radius: 50%;
    background: #515358;
    box-shadow: inset 0 0 2px rgba(0,0,0,.7);
}
.tp-ampel-trigger[data-state="red"] .tp-ampel-red { background: #ef4444; box-shadow: 0 0 7px #ef4444; }
.tp-ampel-trigger[data-state="yellow"] .tp-ampel-yellow { background: #facc15; box-shadow: 0 0 7px #facc15; }
.tp-ampel-trigger[data-state="green"] .tp-ampel-green { background: #22c55e; box-shadow: 0 0 7px #22c55e; }
.tp-ampel-trigger[data-state="unknown"] .tp-ampel-light { background: #737a85; }

/* Full-bleed dialog: intentionally no frame, border or shadow. */
.tp-ampel-overlay[hidden] { display: none !important; }
.tp-ampel-overlay {
    position: fixed;
    inset: 0;
    z-index: 2147483000;
    background: rgba(12, 24, 22, .95);
    color: #fff;
    overflow-y: auto;
    box-sizing: border-box;
}
.tp-ampel-dialog {
    position: relative;
    box-sizing: border-box;
    display: flex;
    min-height: 100%;
    align-items: center;
    justify-content: center;
    padding: 85px 26px;
    text-align: center;
    border: 0;
    border-radius: 0;
    outline: 0;
    background: transparent;
    box-shadow: none;
}
.tp-ampel-content { max-width: 680px; margin: auto; }
.tp-ampel-big-light {
    display: block;
    width: 24px;
    height: 24px;
    margin: 0 auto 28px;
    border-radius: 50%;
    background: #9ca3af;
}
.tp-ampel-big-light[data-state="red"] { background: #ef4444; box-shadow: 0 0 24px rgba(239,68,68,.48); }
.tp-ampel-big-light[data-state="yellow"] { background: #facc15; box-shadow: 0 0 24px rgba(250,204,21,.48); }
.tp-ampel-big-light[data-state="green"] { background: #22c55e; box-shadow: 0 0 24px rgba(34,197,94,.48); }
#tp-ampel-heading {
    margin: 0 0 24px;
    font-weight: 600;
    font-size: clamp(26px, 5vw, 44px);
    letter-spacing: -.025em;
    color: #fff;
    line-height: 1.2;
    text-transform: none;
}
#tp-ampel-message {
    margin: 0;
    font-size: clamp(17px, 2.3vw, 23px);
    line-height: 1.75;
    color: #f1f5f4;
    font-weight: 400;
}
#tp-ampel-updated {
    margin: 38px 0 0;
    color: #aabcb7;
    font-size: 13px;
    letter-spacing: .02em;
}
.tp-ampel-close {
    position: fixed;
    top: 23px;
    right: 30px;
    z-index: 2;
    border: 0;
    background: none;
    padding: 2px 10px;
    margin: 0;
    font-family: Arial, sans-serif;
    font-size: 46px;
    font-weight: 300;
    line-height: 1;
    color: #fff;
    cursor: pointer;
    transition: opacity .2s;
}
.tp-ampel-close:hover { opacity: .7; }
.tp-ampel-close:focus-visible { outline: 2px solid #fff; outline-offset: 4px; }
body.tp-ampel-open { overflow: hidden !important; }
body.admin-bar .tp-ampel-close { top: 56px; }
@media (max-width: 782px) {
    body.admin-bar .tp-ampel-close { top: 75px; }
    .tp-ampel-dialog { padding: 86px 24px; }
}
@media (prefers-reduced-motion: reduce) { .tp-ampel-trigger, .tp-ampel-close { transition: none; } }