/*! tailwindcss v4.3.0 | MIT License | https://tailwindcss.com */
@layer properties {
  @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
    *, :before, :after, ::backdrop {
      --tw-border-style: solid;
      --tw-leading: initial;
      --tw-font-weight: initial;
      --tw-shadow: 0 0 #0000;
      --tw-shadow-color: initial;
      --tw-shadow-alpha: 100%;
      --tw-inset-shadow: 0 0 #0000;
      --tw-inset-shadow-color: initial;
      --tw-inset-shadow-alpha: 100%;
      --tw-ring-color: initial;
      --tw-ring-shadow: 0 0 #0000;
      --tw-inset-ring-color: initial;
      --tw-inset-ring-shadow: 0 0 #0000;
      --tw-ring-inset: initial;
      --tw-ring-offset-width: 0px;
      --tw-ring-offset-color: #fff;
      --tw-ring-offset-shadow: 0 0 #0000;
      --tw-text-shadow-color: initial;
      --tw-text-shadow-alpha: 100%;
    }
  }
}

@layer theme {
  :root, :host {
    --color-red-600: oklch(57.7% .245 27.325);
    --color-green-500: oklch(72.3% .219 149.579);
    --color-blue-500: oklch(62.3% .214 259.815);
    --color-gray-100: oklch(96.7% .003 264.542);
    --color-gray-400: oklch(70.7% .022 261.325);
    --color-gray-800: oklch(27.8% .033 256.848);
    --color-black: #000;
    --color-white: #fff;
    --spacing: .25rem;
    --text-xs: .75rem;
    --text-xs--line-height: inherit;
    --text-sm: .875rem;
    --text-sm--line-height: inherit;
    --font-weight-normal: 400;
    --font-weight-bold: 700;
    --leading-tight: 1.25;
    --radius-lg: .5rem;
    --color-primary: #7e22ce;
    --color-primary-darker: #6b21a8;
    --login-color-dark: #121212;
  }
}

@layer utilities;

.login {
  background-color: var(--color-white);
  font-size: var(--text-sm);
  line-height: var(--tw-leading, var(--text-sm--line-height));
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  display: flex;
  position: relative;
}

.login *, .login :before, .login :after {
  box-sizing: border-box;
}

.login ul {
  padding-left: 0;
  list-style: none;
}

.login .notice-info {
  border-color: var(--color-primary);
  background-color: #7e22ce0d;
}

@supports (color: color-mix(in lab, red, red)) {
  .login .notice-info {
    background-color: color-mix(in oklab, var(--color-primary) 5%, transparent);
  }
}

.login .notice-error {
  border-color: var(--color-red-600);
  background-color: #e400140d;
}

@supports (color: color-mix(in lab, red, red)) {
  .login .notice-error {
    background-color: color-mix(in oklab, var(--color-red-600) 5%, transparent);
  }
}

.login .rspv {
  background-color: var(--color-primary);
  width: 55%;
  height: 100%;
  display: none;
  position: relative;
  overflow: hidden;
}

@media (min-width: 64rem) {
  .login .rspv {
    display: block;
  }
}

@media (min-width: 110rem) {
  .login .rspv {
    width: calc(100vw - 50rem);
  }
}

.login .rspv__wrap {
  width: 177.778vh;
  height: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.login .rspv__iframe {
  border: 0;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.login .rspv__toggle {
  bottom: calc(var(--spacing) * 5);
  left: calc(var(--spacing) * 5);
  height: calc(var(--spacing) * 12);
  width: calc(var(--spacing) * 12);
  cursor: pointer;
  background-color: #0000;
  border: 0;
  border-radius: .25rem;
  justify-content: center;
  align-items: center;
  font-size: 1rem;
  transition: background-color .25s;
  display: flex;
  position: absolute;
}

.login .rspv__toggle svg {
  width: 1em;
  display: block;
}

.login .rspv__toggle svg path {
  fill: #fff;
}

.login .rspv__toggle:hover, .login .rspv__toggle:focus {
  background-color: var(--login-color-dark);
}

.login .sidebar {
  z-index: 1;
  background-color: var(--color-white);
  min-height: 100vh;
  padding-inline: calc(var(--spacing) * 8);
  border-radius: 0;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  display: flex;
  position: relative;
  width: 100% !important;
}

@media (min-width: 62rem) {
  .login .sidebar {
    width: 45% !important;
  }
}

@media (min-width: 110rem) {
  .login .sidebar {
    width: 50rem !important;
  }
}

.login .sidebar .sidebar__content {
  max-width: 25rem;
  margin-top: auto;
  margin-bottom: auto;
}

.login .sidebar .sidebar__footer {
  margin-bottom: calc(var(--spacing) * 0);
  padding-bottom: calc(var(--spacing) * 4);
  text-align: center;
  font-size: var(--text-xs);
  line-height: var(--tw-leading, var(--text-xs--line-height));
  color: var(--color-gray-400);
  display: block;
}

.login .sidebar .sidebar__footer ul {
  row-gap: calc(var(--spacing) * 1);
  flex-direction: column;
  display: flex;
}

.login .sidebar a {
  color: var(--color-green-500);
}

.login .sidebar a:hover, .login .sidebar a:focus {
  color: var(--color-primary);
}

.login .sidebar h1 {
  margin-bottom: 3rem;
}

.login .sidebar h1 a {
  background-image: url("../images/logo-spot-2k25.svg");
  background-position: 0 0;
  background-size: contain;
  width: 10rem;
  height: 2.8125rem;
  margin-bottom: 0;
}

.login #login .message, .login #login #login_error {
  width: 100%;
}

.login #login #loginform, .login #login #lostpasswordform {
  box-shadow: none;
  background: none;
  border: 0;
  margin-top: 0;
  margin-bottom: 2rem;
  padding: 0;
  overflow: visible;
}

:is(.login #login #loginform, .login #login #lostpasswordform) label {
  color: var(--color-black);
  font-size: .875rem;
  font-weight: 700;
}

:is(.login #login #loginform, .login #login #lostpasswordform) label[for="rememberme"] {
  font-weight: 400;
}

:is(.login #login #loginform, .login #login #lostpasswordform) input[type="checkbox"], :is(.login #login #loginform, .login #login #lostpasswordform) input[type="radio"] {
  width: 1.5rem;
  height: 1.5rem;
  box-shadow: none;
  background-color: #fff;
  border: 2px solid #eee;
  margin-right: .5rem;
}

:is(:is(.login #login #loginform, .login #login #lostpasswordform) input[type="checkbox"], :is(.login #login #loginform, .login #login #lostpasswordform) input[type="radio"]):checked:before {
  margin: 0 0 0 -.05rem;
}

:is(.login #login #loginform, .login #login #lostpasswordform) .input {
  margin-top: calc(var(--spacing) * 2);
  margin-bottom: calc(var(--spacing) * 4);
  min-height: calc(var(--spacing) * 12);
  border-radius: var(--radius-lg);
  border-style: var(--tw-border-style);
  border-width: 2px;
  border-color: var(--color-gray-100);
  background-color: var(--color-white);
  padding-inline: calc(var(--spacing) * 3);
  padding-block: calc(var(--spacing) * 2);
  font-size: var(--text-sm);
  line-height: var(--tw-leading, var(--text-sm--line-height));
  --tw-leading: var(--leading-tight);
  line-height: var(--leading-tight);
  --tw-font-weight: var(--font-weight-normal);
  font-weight: var(--font-weight-normal);
  box-shadow: none;
}

:is(.login #login #loginform, .login #login #lostpasswordform) .input:focus {
  border-color: var(--color-primary);
  --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color, var(--color-blue-500));
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  --tw-ring-color: #7e22ce26;
}

@supports (color: color-mix(in lab, red, red)) {
  :is(.login #login #loginform, .login #login #lostpasswordform) .input:focus {
    --tw-ring-color: color-mix(in oklab, var(--color-primary) 15%, transparent);
  }
}

:is(.login #login #loginform, .login #login #lostpasswordform) .input:focus {
  background-color: #fff;
  outline: none;
}

:is(.login #login #loginform, .login #login #lostpasswordform) .button.wp-hide-pw {
  top: calc(var(--spacing) * 3);
  right: calc(var(--spacing) * .5);
  color: var(--color-gray-400);
}

:is(.login #login #loginform, .login #login #lostpasswordform) .button.wp-hide-pw:hover, :is(.login #login #loginform, .login #login #lostpasswordform) .button.wp-hide-pw:focus {
  color: var(--color-gray-800);
}

:is(.login #login #loginform, .login #login #lostpasswordform):after {
  content: "";
  clear: both;
  display: block;
}

.login #login #nav, .login #login #backtoblog {
  text-align: center;
  margin-top: .15em;
  margin-bottom: 0;
  padding-left: 0;
  padding-right: 0;
}

:is(.login #login #nav, .login #login #backtoblog) a {
  color: var(--color-gray-400);
}

:is(.login #login #nav, .login #login #backtoblog) a:hover {
  color: var(--color-primary);
  text-decoration-line: underline;
}

.login #login .forgetmenot {
  align-items: center;
  height: 3.75rem;
  display: flex;
}

.login #login #wp-submit {
  margin-block: calc(var(--spacing) * 2);
  height: calc(var(--spacing) * 10);
  border-style: var(--tw-border-style);
  background-color: var(--color-primary);
  padding-inline: calc(var(--spacing) * 4);
  padding-block: calc(var(--spacing) * 2);
  font-size: var(--text-sm);
  line-height: var(--tw-leading, var(--text-sm--line-height));
  --tw-leading: 1;
  --tw-font-weight: var(--font-weight-bold);
  line-height: 1;
  font-weight: var(--font-weight-bold);
  color: var(--color-white);
  text-shadow: none;
  box-shadow: none;
  border-width: 0;
  border-radius: 3.40282e38px;
}

.login #login #wp-submit:hover, .login #login #wp-submit:focus {
  background-color: var(--color-primary-darker);
}

.login #login .login__footer, .login.interim-login {
  display: block;
}

.login.interim-login #login {
  width: 20rem;
  max-width: none;
  margin: 1.25rem auto !important;
  padding: 1.875rem !important;
}

.login .language-switcher, .login .wpml-login-ls {
  z-index: 2;
  padding-left: 1.5rem;
  padding-right: 1.5rem;
  position: fixed;
  top: 0;
  right: 0;
}

.login .privacy-policy-page-link {
  margin-top: 2rem;
  margin-bottom: 0;
  font-size: .8125rem;
}

.login #llar-login-page-gdpr {
  background: var(--login-color-dark);
  z-index: 2;
  justify-content: center;
  align-items: center;
  min-height: 3rem;
  padding: .5rem 1rem;
  display: flex;
}

.login.login--left {
  flex-direction: row-reverse;
}

.login.login--left .rspv__toggle {
  right: 1.25rem;
}

.login.login--left .language-switcher, .login.login--left .wpml-login-ls {
  left: 0;
  right: initial;
}

.login:has(#llar-login-page-gdpr) .rspv__toggle {
  bottom: 4.25rem;
}

@property --tw-border-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}

@property --tw-leading {
  syntax: "*";
  inherits: false
}

@property --tw-font-weight {
  syntax: "*";
  inherits: false
}

@property --tw-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}

@property --tw-shadow-color {
  syntax: "*";
  inherits: false
}

@property --tw-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}

@property --tw-inset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}

@property --tw-inset-shadow-color {
  syntax: "*";
  inherits: false
}

@property --tw-inset-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}

@property --tw-ring-color {
  syntax: "*";
  inherits: false
}

@property --tw-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}

@property --tw-inset-ring-color {
  syntax: "*";
  inherits: false
}

@property --tw-inset-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}

@property --tw-ring-inset {
  syntax: "*";
  inherits: false
}

@property --tw-ring-offset-width {
  syntax: "<length>";
  inherits: false;
  initial-value: 0;
}

@property --tw-ring-offset-color {
  syntax: "*";
  inherits: false;
  initial-value: #fff;
}

@property --tw-ring-offset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}

@property --tw-text-shadow-color {
  syntax: "*";
  inherits: false
}

@property --tw-text-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}