/* CookieWarden – Frontend Positioning Styles
   Note: Colors/fonts are handled via inline styles in the template
   to prevent WordPress theme interference. This file only handles
   positioning, transitions, and layout that can't be inlined easily. */

#cwdn-banner {
    transition: transform .35s cubic-bezier(.4,0,.2,1), opacity .35s ease;
}
#cwdn-banner.cwdn-hidden { opacity: 0; pointer-events: none; }

/* ── BOTTOM BAR ── */
#cwdn-banner.cwdn-pos-bottom {
    left: 0; right: 0; bottom: 0;
    max-height: 80vh;
    overflow-y: auto;
    box-shadow: 0 -4px 28px rgba(0,0,0,.4);
}
#cwdn-banner.cwdn-pos-bottom.cwdn-hidden { transform: translateY(110%); }

/* ── TOP BAR ── */
#cwdn-banner.cwdn-pos-top {
    left: 0; right: 0; top: 0;
    max-height: 80vh;
    overflow-y: auto;
    box-shadow: 0 4px 28px rgba(0,0,0,.4);
}
#cwdn-banner.cwdn-pos-top.cwdn-hidden { transform: translateY(-110%); }

/* ── BOX POSITIONS ── */
#cwdn-banner.cwdn-pos-bottom-left,
#cwdn-banner.cwdn-pos-bottom-right {
    bottom: 20px;
    width: min(400px, calc(100vw - 32px));
    max-height: calc(100vh - 40px);
    overflow-y: auto;
    border-radius: 10px;
    box-shadow: 0 8px 32px rgba(0,0,0,.5);
}
#cwdn-banner.cwdn-pos-bottom-left  { left: 20px; }
#cwdn-banner.cwdn-pos-bottom-right { right: 20px; }
#cwdn-banner.cwdn-pos-bottom-left.cwdn-hidden,
#cwdn-banner.cwdn-pos-bottom-right.cwdn-hidden { transform: translateY(20px); opacity: 0; }

/* ── CENTER POPUP ── */
#cwdn-banner.cwdn-pos-center {
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    width: min(540px, calc(100vw - 32px));
    max-height: 90vh;
    overflow-y: auto;
    border-radius: 10px;
    box-shadow: 0 16px 48px rgba(0,0,0,.6);
}
#cwdn-banner.cwdn-pos-center.cwdn-hidden {
    transform: translate(-50%, calc(-50% + 20px));
    opacity: 0;
}

/* ── Mobile ── */
@media (max-width: 600px) {
    #cwdn-banner.cwdn-pos-bottom > div:first-child,
    #cwdn-banner.cwdn-pos-top > div:first-child {
        flex-wrap: wrap !important;
    }
}

/* ── Floating Action Button ── */
#cwdn-fab {
    transition: transform .2s ease, opacity .3s ease, box-shadow .2s ease !important;
}
#cwdn-fab:hover {
    box-shadow: 0 5px 18px rgba(0,0,0,.45) !important;
}
#cwdn-fab svg {
    display: block;
    flex-shrink: 0;
}

/* ── Tooltip on FAB hover ── */
#cwdn-fab::after {
    content: 'Cookie-Einstellungen';
    position: absolute;
    bottom: 52px;
    right: 0;
    background: rgba(0,0,0,.8);
    color: #fff;
    font-size: 12px;
    padding: 5px 10px;
    border-radius: 5px;
    white-space: nowrap;
    opacity: 0;
    pointer-events: none;
    transition: opacity .2s;
    font-family: -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
}
#cwdn-fab:hover::after { opacity: 1; }