<commit_before>// This Source Code Form is subject to the terms of the Mozilla Public
// License, v. 2.0. If a copy of the MPL was not distributed with this
// file, You can obtain one at http://mozilla.org/MPL/2.0/.

$font-path: '/media/fonts';
$image-path: '/media/protocol/img';

@import '../../protocol/css/includes/lib';
@import '../../protocol/css/components/hero';
@import '../../protocol/css/components/picto-card';
@import '../protocol/components/sub-navigation';
@import '../../protocol/css/components/newsletter-form';
@import '../../protocol/css/components/call-out';
@import '../../protocol/css/components/emphasis-box';

//* -------------------------------------------------------------------------- */
// Global

.mzp-l-narrow {
    max-width: $content-lg;
}

//* -------------------------------------------------------------------------- */
// Hero
.mzp-c-hero {
    background-color: $color-gray-20;

    .mzp-c-hero-desc {
        margin: 0;
    }
}

//* -------------------------------------------------------------------------- */
// Picto Card

.bugzilla .mzp-c-card-picto-content {
    max-width: none;

    &:before {
        background: transparent url('/media/img/icons/warning.svg') no-repeat center;
    }
}

//* -------------------------------------------------------------------------- */
// Call-outs

.mzp-c-call-out-compact {
    background: transparent;

    @media #{$mq-md} {
        &.mzp-t-product-firefox,
        &.mzp-t-product-beta,
        &.mzp-t-product-developer,
        &.mzp-t-product-nightly,
        &.mzp-t-product-focus {
            .mzp-c-call-out-content {
                @include background-size($layout-xl $layout-xl);
                @include bidi(((padding, 0 0 0 $layout-2xl, 0 $layout-2xl 0 0),));
            }
        }
    }

}

.l-notes {
    @include text-body-sm;
    max-width: $screen-lg;

    ul li {
        @include text-body-md;
    }
}

.learn-more {
    @include text-body-md;
    display: block;
    margin-top: $spacing-md;
    text-align: center;
}

//*------------------------------------------------------------------*/
// Newsletter
// styles from developer/includes/newsletter.scss

.t-newsletter {
    .mzp-l-content {
        max-width: $content-sm;
        min-width: 0;
        padding-bottom: $layout-md;
        padding-top: $layout-md;
    }

    .mzp-c-newsletter-form {
        padding-top: 0;
        @include font-size(14px);

        input[type=email] {
            border: 2px solid $color-gray-30;
            border-radius: 2px;
            padding-top: 10px; // to make input match button height
            padding-bottom: 10px; // to make input match button height
        }
        label[for=id_email]{
            @include visually-hidden;<commit_msg>Newsletter on firefox/channel/ pages should be inside emphasis box. (Fixes #8357) (#8361)<commit_after>// This Source Code Form is subject to the terms of the Mozilla Public
// License, v. 2.0. If a copy of the MPL was not distributed with this
// file, You can obtain one at http://mozilla.org/MPL/2.0/.

$font-path: '/media/fonts';
$image-path: '/media/protocol/img';

@import '../../protocol/css/includes/lib';
@import '../../protocol/css/components/hero';
@import '../../protocol/css/components/picto-card';
@import '../protocol/components/sub-navigation';
@import '../../protocol/css/components/newsletter-form';
@import '../../protocol/css/components/call-out';
@import '../../protocol/css/components/emphasis-box';

//* -------------------------------------------------------------------------- */
// Global

.mzp-l-narrow {
    max-width: $content-lg;
}

//* -------------------------------------------------------------------------- */
// Hero
.mzp-c-hero {
    background-color: $color-gray-20;

    .mzp-c-hero-desc {
        margin: 0;
    }
}

//* -------------------------------------------------------------------------- */
// Picto Card

.bugzilla .mzp-c-card-picto-content {
    max-width: none;

    &:before {
        background: transparent url('/media/img/icons/warning.svg') no-repeat center;
    }
}

//* -------------------------------------------------------------------------- */
// Call-outs

.mzp-c-call-out-compact {
    background: transparent;

    @media #{$mq-md} {
        &.mzp-t-product-firefox,
        &.mzp-t-product-beta,
        &.mzp-t-product-developer,
        &.mzp-t-product-nightly,
        &.mzp-t-product-focus {
            .mzp-c-call-out-content {
                @include background-size($layout-xl $layout-xl);
                @include bidi(((padding, 0 0 0 $layout-2xl, 0 $layout-2xl 0 0),));
            }
        }
    }

}

.l-notes {
    @include text-body-sm;
    max-width: $screen-lg;

    ul li {
        @include text-body-md;
    }
}

.learn-more {
    @include text-body-md;
    display: block;
    margin-top: $spacing-md;
    text-align: center;
}

//*------------------------------------------------------------------*/
// Newsletter
// styles from developer/includes/newsletter.scss

.t-newsletter {
    padding: $layout-md $layout-xs;
    .mzp-l-content {
        max-width: $content-sm;
        min-width: 0;
        padding-bottom: $layout-md;
        padding-top: $layout-md;
        background: $color-white;
        border-radius: 6px;
        box-shadow: 0 4px 16px 0 $color-gray-60;
    }

    .mzp-c-newsletter-form {
        padding-top: 0;
        @include font-size(14px);

        input[type=email] {
            border: 2px solid $color-gray-30;
            border-radius: 2px;
            padding-top: 10px; // to make input match button height
            padding-bottom: 10px; // to make input match button height
        }
        label[for=id_email]{
            @include visually-hidden;
{'fraction_non_alphanumeric': 0.27569359623102424, 'fraction_numerical': 0.012214273250741581, 'mean_word_length': 1.389328887036265, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 3, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '3372558', 'n_tokens_mistral': 1816, 'n_tokens_neox': 1744, 'n_words': 351}