@charset "UTF-8";
/* ==========================================================================
   Kosmatincki - Magic Login Pro (PRIJAVA - Leva stran)
   ========================================================================== */
.kosmatincki-magic-login-wrapper {
  /* Glavni vsebnik */
  /* Obvestila */
  /* Labele */
  /* Vnosna polja - Ožja (90%) */
  /* Gumb */
}
.kosmatincki-magic-login-wrapper form, .kosmatincki-magic-login-wrapper .magic-login-form-container, .kosmatincki-magic-login-wrapper div[id^="magic-login"] {
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex;
  flex-direction: column;
  align-items: flex-start !important;
}
.kosmatincki-magic-login-wrapper .magic-login-message, .kosmatincki-magic-login-wrapper .message, .kosmatincki-magic-login-wrapper blockquote {
  width: 100% !important;
  border-left: 4px solid var(--primary) !important;
  background-color: var(--base-ultra-light, #f4f5f6) !important;
  border-radius: 8px !important;
  padding: 16px !important;
  margin: 0 0 16px 0 !important;
  font-size: 14px !important;
  color: var(--base-dark, #111) !important;
}
.kosmatincki-magic-login-wrapper label {
  font-weight: 400 !important;
  font-size: 16px !important;
  text-transform: none !important;
  margin: 0 0 8px 0 !important;
  color: var(--base-dark, #111) !important;
  display: block !important;
  width: 100% !important;
  line-height: 1.2 !important;
}
.kosmatincki-magic-login-wrapper input[type="email"], .kosmatincki-magic-login-wrapper input[type="text"], .kosmatincki-magic-login-wrapper input.magic-login-input {
  width: 100% !important;
  max-width: 90% !important;
  padding: 8px 24px !important;
  height: 45px !important;
  background-color: transparent !important;
  border: 1px solid var(--base-light, #d1d5db) !important;
  border-radius: 999px !important;
  box-shadow: none !important;
  color: var(--base-dark, #111) !important;
  margin: 0 0 16px 0 !important;
  box-sizing: border-box !important;
}
.kosmatincki-magic-login-wrapper input[type="email"]:focus, .kosmatincki-magic-login-wrapper input[type="text"]:focus, .kosmatincki-magic-login-wrapper input.magic-login-input:focus {
  border-color: var(--primary) !important;
  outline: none !important;
  box-shadow: none !important;
}
.kosmatincki-magic-login-wrapper button[type="submit"], .kosmatincki-magic-login-wrapper input[type="submit"] {
  background-color: var(--primary) !important;
  color: var(--white, #fff) !important;
  border-radius: 999px !important;
  padding: 14px 32px !important;
  border: none !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  width: max-content !important;
  align-self: flex-start !important;
  cursor: pointer !important;
  transition: all 0.3s ease !important;
  margin-top: 8px !important;
}
.kosmatincki-magic-login-wrapper button[type="submit"]:hover, .kosmatincki-magic-login-wrapper input[type="submit"]:hover {
  background-color: var(--primary-hover) !important;
  transform: translateY(-2px) !important;
}
/* ==========================================================================
   KOSMATINCKI - REGISTRACIJA (FINALNA PRODUKCIJSKA VERZIJA)
   ========================================================================== */
.kosmatincki-magic-registration-wrapper {
  /* 1. Popoln reset vseh starševskih kontejnerjev, ki vsiljujejo sivo barvo */
  /* 2. Info box / Obvestilo */
  /* 3. MREŽA ZA IME IN PRIIMEK - Fiksna poravnava */
  /* 4. Samostojna polja (E-pošta) */
  /* 5. Labele */
  /* 6. VNOSNA POLJA - 100% Bela */
  /* 7. GUMB */
}
.kosmatincki-magic-registration-wrapper #magic-login-register, .kosmatincki-magic-registration-wrapper #magic_login_registration_form, .kosmatincki-magic-registration-wrapper .magic-login-registration-form, .kosmatincki-magic-registration-wrapper fieldset {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  background: transparent !important;
  background-color: transparent !important;
  display: flex !important;
  flex-direction: column !important;
  box-shadow: none !important;
}
.kosmatincki-magic-registration-wrapper .registration_result .info {
  width: 100% !important;
  border-left: 4px solid var(--primary) !important;
  background-color: #ffffff !important;
  border-radius: 8px !important;
  padding: 16px !important;
  margin: 0 0 24px 0 !important;
  font-size: 14px !important;
  color: var(--base-dark, #111) !important;
  box-sizing: border-box !important;
}
.kosmatincki-magic-registration-wrapper .form-group {
  display: flex !important;
  flex-direction: row !important;
  align-items: flex-end !important;
  gap: 16px !important;
  width: 100% !important;
  margin: 0 0 16px 0 !important;
  padding: 0 !important;
}
@media (max-width: 767px) {
  .kosmatincki-magic-registration-wrapper .form-group {
    flex-direction: column !important;
    align-items: flex-start !important;
  }
}
.kosmatincki-magic-registration-wrapper .form-group p {
  flex: 1 !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  flex-direction: column !important;
}
.kosmatincki-magic-registration-wrapper form > p {
  width: 100% !important;
  margin: 0 0 16px 0 !important;
  padding: 0 !important;
}
.kosmatincki-magic-registration-wrapper label {
  display: block !important;
  font-weight: 400 !important;
  font-size: 16px !important;
  margin-bottom: 8px !important;
  color: var(--base-dark, #111) !important;
  line-height: 1 !important;
}
.kosmatincki-magic-registration-wrapper input[type="text"], .kosmatincki-magic-registration-wrapper input[type="email"] {
  width: 100% !important;
  height: 48px !important;
  padding: 0 24px !important;
  background-color: #ffffff !important;
  border: 1px solid var(--base-light, #d1d5db) !important;
  border-radius: 999px !important;
  color: var(--base-dark, #111) !important;
  box-sizing: border-box !important;
}
.kosmatincki-magic-registration-wrapper input[type="text"]:focus, .kosmatincki-magic-registration-wrapper input[type="email"]:focus {
  border-color: var(--primary) !important;
  outline: none !important;
}
.kosmatincki-magic-registration-wrapper .magic-login-submit {
  background-color: var(--primary) !important;
  color: var(--white, #fff) !important;
  border-radius: 999px !important;
  padding: 0 32px !important;
  height: 50px !important;
  border: none !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  width: max-content !important;
  cursor: pointer !important;
  margin-top: 8px !important;
  transition: background-color 0.3s ease !important;
}
.kosmatincki-magic-registration-wrapper .magic-login-submit:hover {
  background-color: var(--primary-hover) !important;
}
