@charset "UTF-8";

/* =========================================================
   WPForms – Theme Overrides mit :root Variablen
   ========================================================= */

:root {
    
    --theme-color-100: #f5f7fa;
    --theme-color-300: #dfe3e8;
    --theme-color-600: #034b68;      
    --theme-color-900: #121416;

    --accent-color-200: #d6dde1;    
    --theme-box-shadow: 0 2px 6px rgba(7, 7, 8, 0.4);

    --font-family: 'Lexend';
    --font-family-primary: var(--font-family);

    --font-weight-400: 400;
    --font-weight-700: 700;

    --font-size-small: 1rem;
    --font-size-primary: 1.125rem;
    --font-size-100: 1.125rem;
    --font-size-200: clamp(1.125rem, 1.05rem + 0.35vw, 1.25rem);
    --font-size-300: clamp(1.125rem, 1rem + 0.4vw, 1.375rem);  
    --font-size-400: clamp(1.375rem, 1.2rem + 0.5vw, 1.75rem);
    --font-size-500: clamp(1.75rem, 1.45rem + 0.8vw, 2.25rem);  
    --font-size-600: clamp(2.25rem, 1.85rem + 1.2vw, 3rem);

    --padding-block-10: min(1.5rem, 5vw);
    --padding-block-20: min(2.5rem, 6vw);
    --padding-block-30: min(3.5rem, 7vw);
    --padding-block-40: min(4.5rem, 8vw);
    --padding-block-50: min(6.5rem, 9vw);
    
    --padding-space-top: 2.5rem;
    --padding-spaced-bottom: 2.5rem;

    --z-index-0: 0;
    --z-index-10: 10;
    --z-index-20: 20;
    --z-index-30: 30;
    --z-index-40: 40;
    
}

/* DARK Mode */

.darkmode {
    
    --theme-color-100: #121416;
    --theme-color-300: #242628;
    --theme-color-600: #9dd4e8;
    --theme-color-900: #f5f7fa;

    --accent-color-200: #4a4b4d;   
    --theme-box-shadow: 0 4px 10px rgba(0, 0, 0, 0.6);
}

/* Placeholder Styles */
div.wpforms-container-full ::placeholder {
  color: var(--theme-color-100);
  font-size: var(--font-size-small);
  opacity: 1!important;
}

/* Inputs & Textareas */
.wpforms-field input[type="text"],
.wpforms-field input[type="email"],
.wpforms-field input[type="url"],
.wpforms-field input[type="tel"],
.wpforms-field input[type="number"],
.wpforms-field input[type="password"],
.wpforms-field textarea,
.wpforms-field select {
  width: 100%;
  padding: 0.5em 1em;
  font-size: var(--font-size-primary);
  color: var(--clr-theme-900);
  background-color: var(--theme-color-300);
  border: 2px solid var(--theme-color-600)!important;
  border-radius: 0;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

div.wpforms-container-full .wpforms-form input:focus,
div.wpforms-container-full .wpforms-form textarea:focus,
div.wpforms-container-full .wpforms-form select:focus {
  border-color: var(--theme-color-900);
  box-shadow: 0 0 0 3px rgba(18, 103, 138, 0.25);
  outline: none;
}

/* Labels */
.wpforms-field-label,
.wpforms-field-label-inline,
.wpforms-page-indicator-steps {
  color: var(--theme-color-900);
  font-size: var(--font-size-small);
  font-weight: var(--font-weight-400);
}

.wpforms-container .wpforms-form .wpforms-field-label,
div.wpforms-container-full .wpforms-field-label-inline {
  color: var(--theme-color-900);
  font-size: var(--font-size-small);
  font-weight: var(--font-weight-400);
}

/* Buttons */
button.wpforms-submit.wpforms-button[type="submit"] {
     min-width: 260px;
  min-height: 44px;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: 0.25rem;
  position: relative;
  font-weight: var(--font-weight-700)!important;
  font-size: var(--font-size-primary);
  line-height: 1;
  padding: 0.75rem 1.25rem;
  cursor: pointer;
  border-radius: 100vw;
  text-box: trim-both cap alphabetic;
  text-decoration: none;
  transition: background 0.3s ease, color 0.3s ease;
    background-color: var(--theme-color-600)!important;
  color: var(--theme-color-100)!important;
}

button.wpforms-submit.wpforms-button[type="submit"]:hover {
  background-color: var(--accent-color-200)!important;
  color: var(--theme-color-900)!important;
}

button.wpforms-submit.wpforms-button[type="submit"]:focus-visible {
    outline: 2px solid var(--theme-color-900);
    outline-offset: 4px;
    color: var(--theme-color-100);
  }

button.wpforms-page-button.wpforms-page-next {
    min-width: 260px;
  min-height: 44px;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: 0.25rem;
  position: relative;
  font-weight: var(--font-weight-700);
  font-size: var(--font-size-primary);
  line-height: 1;
  padding: 0.75rem 1.25rem;
  cursor: pointer;
  border-radius: 100vw;
  text-box: trim-both cap alphabetic;
  text-decoration: none;
background-color: var(--theme-color-600);
  color: var(--theme-color-100);
}

button.wpforms-page-button.wpforms-page-next:hover {
    background-color: var(--accent-color-200);
     color: var(--theme-color-600);
  }

/* Preview Notices */
.wpforms-entry-preview-notice {
  background-color: var(--accent-color-200);
  border: 1px solid var(--theme-color-600);
  color: var(--theme-color-900);
  font-size: var(--font-size-primary);
  font-weight: var(--font-weight-400);
  padding: 1rem;
  border-radius: 0;
}

.wpforms-entry-preview-label,
.wpforms-entry-preview-value,
.wpforms-captcha-question {
  color: var(--theme-color-900);
  font-size: var(--font-size-primary);
}

div.wpforms-container-full .wpforms-captcha-question {
  font-size: var(--font-size-primary);
  color: var(--clr-theme-900);
}

div.wpforms-container-full .wpforms-captcha-equation,
div.wpforms-container-full .wpforms-captcha-question {
  font-size: var(--font-size-primary);
  color: var(--clr-theme-900)!important;
}

div.wpforms-container-full .wpforms-field-label-inline, .wp-core-ui div.wpforms-container-full .wpforms-field-label-inline {
    font-size: var(--font-size-primary);
    color: var(--clr-theme-900)!important;
}

.wpforms-entry-preview-notice,
div.wpforms-container-full .wpforms-entry-preview-notice,
div.wpforms-container-full .wpforms-form .wpforms-entry-preview-notice {
  padding:1em;
  background: var(--theme-color-600);
  color: var(--theme-color-100);
    border: none;
}
.wpforms-entry-preview-notice+.wpforms-entry-preview-wrapper,
div.wpforms-container-full .wpforms-entry-preview-notice.wpforms-entry-preview-wrapper,
div.wpforms-container-full .wpforms-form .wpforms-entry-preview-notice+.wpforms-entry-preview-wrapper {
  margin-top:1rem
}

/* Motion Respect */
@media (prefers-reduced-motion: reduce) {
  .wpforms-submit,
  button.wpforms-page-button {
    transition: none;
  }
}

@media (prefers-contrast: more) {
    
    :root {
        --theme-color-100: #fffdf8;
        --theme-color-300: #dfdfdf;
        --theme-color-600: #05afff;
        --theme-color-900: #070707;

        --accent-color-200: #dfefff;
        --theme-box-shadow: 0 0 0 3px rgba(24, 26, 27, 0.8);
    }

    .darkmode {
        --theme-color-100: #070707;
        --theme-color-300: #1f2123;
        --theme-color-600: #5bc0e8;
        --theme-color-900: #fffdf8;

        --accent-color-200: #2a2c2f;
        --theme-box-shadow: 0 0 0 3px rgba(254, 254, 254, 0.8);
    }
    
    .wpforms-field input[type="text"],
.wpforms-field input[type="email"],
.wpforms-field input[type="url"],
.wpforms-field input[type="tel"],
.wpforms-field input[type="number"],
.wpforms-field input[type="password"],
.wpforms-field textarea,
.wpforms-field select {
  background-color: var(--theme-color-100);
  border: 2px solid var(--theme-color-600)!important;
}
    
}