/*
 * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
 *
 * WSO2 LLC. licenses this file to you under the Apache License,
 * Version 2.0 (the "License"); you may not use this file except
 * in compliance with the License.
 * You may obtain a copy of the License at
 *
 * http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing,
 * software distributed under the License is distributed on an
 * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
 * KIND, either express or implied.  See the License for the
 * specific language governing permissions and limitations
 * under the License.
 */
 
:root {
  --background: #f5f5f5;
  --foreground: #171717;

  --md-contained-primary-background: linear-gradient(77.74deg, #eb4f63 11.16%, #fa7b3f 99.55%);
  --md-contained-primary-hover-background: linear-gradient(77.74deg, #d0364b 11.16%, #f2621f 99.55%);
}

html[data-color-scheme='light'] {
  color-scheme: light;

  --md-palette-background-paper: #ffffff6b;
  --md-palette-border-color-paper: #ffffffd6;
}

html[data-color-scheme='dark'] {
  color-scheme: dark;

  --background: #1E1E24;
  --foreground: #ededed;

  --md-palette-background-paper: #0f0f0f41;
  --md-palette-border-color-paper: #2d2d2d;
}

.MuiButton-colorPrimary:not(.MuiButton-outlined) {
  background: var(--md-contained-primary-background);
  color: #fff;
}

.MuiButton-colorPrimary:not(.MuiButton-outlined):hover {
  background: var(--md-contained-primary-hover-background);
  color: #fff;
}

.MuiPaper-root {
  border-radius: 15px !important;
  border: 1px solid var(--md-palette-border-color-paper);
}

html,
body {
  max-width: 100vw;
  overflow-x: hidden;
}

body {
  color: var(--foreground);
  background: var(--background);
  font-family: Arial, Helvetica, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.body-background-design-overlay {
  width: 800px;
  height: 500px;
  display: block;
  mix-blend-mode: normal;
  filter: blur(75px);
  opacity: .15;
  will-change: filter;
  border-radius: 9999px;
  max-width: 100%;
  top: -100px;
  right: 20%;
  position: absolute;
  background: conic-gradient(from 180deg at 50% 50%, #2a8af6 0deg, #d9a300 180deg, #1E1E24 1turn);
  z-index: 0;
}

.MuiBox-root {
  position: relative;
  z-index: 1;
}

* {
  box-sizing: border-box;
  padding: 0;
  margin: 0;
}

a {
  color: inherit;
  text-decoration: none;
}

@media (prefers-color-scheme: dark) {
  html {
    color-scheme: dark;
  }
}
