/*
 * Citizen - Cookie Warning Styles
 * https://starcitizen.tools
*/

@import '../resources/variables.less';
@import '../resources/mixins.less';

.mw-cookiewarning-container {
    top: unset;
    right: 0;
    bottom: @margin-side;
    margin: 0 auto;
    padding: 0;
    max-width: @page-width;
    opacity: 1;
    background: @base-20;
    font-size: @content-small-text-size;
    font-weight: 400;
    .boxshadow(5);

    .mw-cookiewarning-text {
        display: flex;
        line-height: 1.4;

        >* {
            display: flex;
            align-items: center;
        }

        span {
            margin: 0;
            padding: @margin-side * 0.75 @margin-side;
            display: block;
            flex-grow: 1;
        }

        .mw-cookiewarning-dismiss {
            background: @accent-50;

            &:hover {
                background: @accent-10;
            }
        }

        >a {
            background: @base-10;

            &:hover {
                background: @base-0;
            }
        }

        a,
        .mw-cookiewarning-dismiss {
            margin: 0;
            padding: @margin-side * 0.75 @margin-side;
            height: auto;
            border-radius: 0;
            font-weight: 400;
            line-height: 1.4;
            transition: @transition-background-quick;
        }
    }
}

@media only screen and (max-width: @screen1) {
    .mw-cookiewarning-container {
        max-width: none;
        bottom: 0;
    }
}

@media only screen and (max-width: 480px) {
    .mw-cookiewarning-container .mw-cookiewarning-text {
        flex-wrap: wrap;

        span,
        a,
        .mw-cookiewarning-dismiss {
            padding: @margin-side / 2 @margin-side;
        }
    }
}