/* Copyright 2022 The Chromium Authors
* Use of this source code is governed by a BSD-style license that can be
* found in the LICENSE file. */
/* #css_wrapper_metadata_start
* #type=style
* #import=chrome://resources/cr_elements/cr_shared_style.css.js
* #import=chrome://resources/cr_elements/cr_shared_vars.css.js
* #import=../../settings_shared.css.js
* #import=../../settings_columned_section.css.js
* #include=cr-shared-style settings-shared settings-columned-section
* #css_wrapper_metadata_end */
:host {
display: block;
flex: 1;
padding: 0 24px;
}
.headline-container {
align-items: center;
display: flex;
flex: 1;
flex-direction: column;
justify-content: space-between;
text-align: center;
}
.headline {
color: var(--google-grey-800);
font-size: 22px;
line-height: 1.15;
}
settings-collapse-radio-button:not(:first-of-type) {
--settings-collapse-separator-line: var(--cr-separator-line);
}
.header-phase2 {
align-items: center;
display: flex;
flex-direction: column;
outline: none;
padding: 24px 0 16px 0;
}
.header-label-phase2 {
animation: fade-in var(--privacy-guide-animation-duration);
align-self: center;
color: var(--cr-primary-text-color);
font-size: 138%; /* Should be 18px when 100% is 13px. */
font-weight: 400;
justify-content: center;
}
@keyframes fade-in {
0% { opacity: 0; }
100% { opacity: 1; }
}
@keyframes slide-in {
0% {
transform: translateX(calc(
var(--privacy-guide-v2-translate-multiplier) * 20px));
}
100% {
transform: translateX(0);
}
}
.headline,
.cr-secondary-text,
.header-phase2 picture,
.fragment-content {
animation: fade-in var(--privacy-guide-animation-duration),
slide-in 450ms;
}
@media (prefers-color-scheme: dark) {
.headline {
color: var(--google-grey-200);
}
}
.embedded-setting-wrapper {
border: 1px solid var(--google-grey-300);
border-radius: 4px;
}
@media (prefers-color-scheme: dark) {
.embedded-setting-wrapper {
border-color: var(--google-grey-700);
}
}
settings-toggle-button {
padding-bottom: 8px;
padding-top: 8px;
}
picture {
align-items: center;
display: flex;
}