/*
 * Consent Compliance — Banner Styles
 * The Online Director
 *
 * Most banner styles are inlined via JS so they can use dynamic values
 * (accent colour, position) from WP settings. This file handles only
 * structural / animated rules that can't be inlined easily.
 */

#tod-cc-banner,
#tod-cc-overlay {
    box-sizing: border-box;
}

/* Slide-up animation for bottom/top banners */
@keyframes tod-cc-slidein-bottom {
    from { transform: translateY(100%); opacity: 0; }
    to   { transform: translateY(0);    opacity: 1; }
}

@keyframes tod-cc-slidein-top {
    from { transform: translateY(-100%); opacity: 0; }
    to   { transform: translateY(0);     opacity: 1; }
}

@keyframes tod-cc-fadein {
    from { opacity: 0; transform: translateY(12px); }
    to   { opacity: 1; transform: translateY(0); }
}

#tod-cc-inner {
    animation: tod-cc-slidein-bottom 0.35s cubic-bezier(0.22, 1, 0.36, 1) both;
}

/* Button hover states */
#tod-cc-accept:hover,
#tod-cc-reject:hover,
#tod-cc-save:hover {
    opacity: 0.85;
}

/* Overlay fade */
#tod-cc-overlay {
    animation: tod-cc-fadein 0.3s ease both;
}

/* Mobile: full-width on small screens */
@media (max-width: 480px) {
    #tod-cc-inner {
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        max-width: 100% !important;
        border-radius: 12px 12px 0 0 !important;
    }
}
