/* Copyright 2024 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-lit
 * #import=./profile_picker_shared.css.js
 * #import=chrome://resources/cr_elements/cr_hidden_style_lit.css.js
 * #scheme=relative
 * #include=profile-picker-shared cr-hidden-style-lit
 * #scheme=relative
 * #css_wrapper_metadata_end */

:host {
  display: block;
  height: 100%;
}

:host([app-mode_='glic']) {
  @media (prefers-color-scheme: dark) {
    background-color: #131314;
  }

  #banner-right,
  #banner-left {
    max-width: 50%;
    position: absolute;
  }

  #banner-right {
    content: url(glic_banner_top_right_light.svg);
    right: 0;
    top: 0;

    @media (prefers-color-scheme: dark) {
      content: url(glic_banner_top_right.svg);
    }
  }

  #banner-left {
    content: url(glic_banner_bottom_left_light.svg);
    left: 0;
    bottom: 0;

    @media (prefers-color-scheme: dark) {
      content: url(glic_banner_bottom_left.svg);
    }
  }
}

:host([app-mode_='regular']) {

  #banner-right,
  #banner-left {
    max-width: 320px;
    position: absolute;
    top: 0;
    width: 17vw;
  }

  #banner-right {
    content: url(right_banner.svg);
    right: 0;

    @media (prefers-color-scheme: dark) {
      content: url(right_banner_dark.svg);
    }
  }

  #banner-left {
    content: url(left_banner.svg);
    left: 0;

    @media (prefers-color-scheme: dark) {
      content: url(left_banner_dark.svg);
    }
  }
}

:host([app-mode_='regular-refreshed']) {
  #banner-right,
  #banner-left {
    display: none;
  }

  background-image: url(shared_gradient_light_background.svg);
  background-repeat: no-repeat;
  background-size: 100% 100%;

  @media (prefers-color-scheme: dark) {
    background-image: url(shared_gradient_dark_background.svg);
  }
}


cr-view-manager {
  display: flex;
  font-size: 100%;
  margin: 0;
}

cr-view-manager > [slot='view'] {
  min-height: var(--view-min-size);
  min-width: var(--view-min-size);
}