/* 
Theme Name: WS Child
Theme URI: 
Description: 
Author: 
Author URI: ps-media.ch
Template: ws
Version: 1.0.1
Text Domain: ws-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/
.hero-button {white-space: nowrap;}
/*
    Add your custom styles here
*/
body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

*:focus {
    outline: none;
}

 .ps-max-width {max-width:1080px!important;}
 
.elementor-widget-text-editor a:hover {text-decoration: underline!important;} 
 
@media screen and (prefers-reduced-motion: no-preference) {
  html {
    scroll-behavior: smooth;
  }
}
/* Global Einstellungen*/
.elementor-button-icon
{font-size:11px!important;line-height:20px!important;}

/* fix elementor Post text mobile */
.elementor-posts--thumbnail-left .elementor-post__thumbnail__link {
    
    float: none;
    margin:0 0 10px 0!important;
    display:block!important;

}

.elementor-posts--skin-classic .elementor-post {
    overflow: hidden!important;
    display: block!important;
   }

}  

#cn-notice-text.cn-text-container {font-size: 15px !important; text-align: left;}
#cn-notice-text.cn-text-container a {color: #fff; text-decoration: underline;}

.ps-top-header {min-width: 100%!important;}

/* WPML Sprachumschalter Liste: | zwischen den Sprachen */
/* Sprachumschalter */
.wpml-ls ul li a span {font-size: 21px!important; line-height:20px!important; padding-top:4px!important;}
a.wpml-ls-link {padding:0px!important; padding-left:8px!important;}
ul li a span.wpml-ls-native { display: block;}
.wpml-ls-current-language a {color: #02A69C !important; }
  
ul li a span.wpml-ls-native:lang(de) {
border-right: 2px solid #484848;
padding-right: 8px;
  }

/* Elementor Elemente */


/* Nav Menu */
.ps-menu ul li.menu-item {
  position: relative;
  padding-right: 2rem;
  transition: transform .25s ease;   /* ganze Zeile animieren */
}

/* Pfeil */
.ps-menu ul li.menu-item::after {
  content: "→";
  position: absolute;
  top: 50%;
  right: 0.75rem;
  transform: translateY(-50%);
  display: inline-block;
font-size: 1.7rem;
  line-height: 1;
  display: inline-block;
  color: #fff;
  transition: right .25s ease;
}

/* Hover-Effekt: kompletter Menüpunkt schiebt nach rechts */
.ps-menu ul li.menu-item:hover {
  transform: translateX(5px);   /* Text + Pfeil rücken gemeinsam */
}

/* Pfeil bewegt sich zusätzlich minimal */
.ps-menu ul li.menu-item:hover::after {
  right: 0.4rem;
}
  
.ps-menu .elementor-nav-menu { overflow: hidden!important; }

/* Hero Slider */

.hero-button span .elementor-button-text {
  display: inline-flex;  
  align-items: center;          
}

.blur-box {
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px); /* fuer Safari */
}

.hero-button {white-space: nowrap;}

/* Icon-Kreis MIT Verlauf */
.hero-button a.elementor-button.elementor-button-link.elementor-size-sm .elementor-button-icon {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background-image: linear-gradient(135deg, #1B5FA9, #03A69C);
  display: flex;
  align-items: center;
  justify-content: center;
}

.hero-button a.elementor-button.elementor-button-link.elementor-size-sm .elementor-button-icon svg {
  width: 30px;
  height: 30px;}
  
/* Hover: Button wird etwas groesser */
 .hero-button a.elementor-button.elementor-button-link:hover {
    transform: scale(1.03); /* leicht vergroessert */
  }
  
  
  
  
/* Verlauf definitionen */
  .gradient-border-blue {
    position: relative !important;
    z-index: 0 !important;
  }
  
  .gradient-border-blue::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    padding: 4px !important; /* entspricht der "Borderbreite" */
    border-radius: inherit !important;
  
    /* Originalfarben unveraendert */
    background: linear-gradient(
      70deg,
      #1B5FA9 2.47%,
      #03A69C 28.28%
    ) !important;
  
    -webkit-mask:
      linear-gradient(#fff 0 0) content-box,
      linear-gradient(#fff 0 0) !important;
    -webkit-mask-composite: xor !important;
            mask-composite: exclude !important;
  
    z-index: -1 !important;
  }


@media (max-width: 767px) {
  
.hero-button span{font-size: 93%!important;}

 .hero-button a.elementor-button.elementor-button-link.elementor-size-sm .elementor-button-icon {
    width: 40px;
    height: 40px;
  }
 .hero-button a.elementor-button.elementor-button-link.elementor-size-sm .elementor-button-icon svg {
    width: 20px;
    height: 20px;
  }

}

.elementor-testimonial__text {font-style: normal!important;}


/*Admin Leiste */
#wp-toolbar a.ab-item.elementor-site-settings {display:none!important;}
#wp-toolbar a.ab-item.elementor-app-link {display:none!important;}
 

 a[href^="tel"] {
   color: inherit; /* Inherit text color of parent element. */
   text-decoration: none; /* Remove underline. */
   /* Additional css `propery: value;` pairs here */
 }
 
/* Marketplace Loop grid */
/* Daten sicher speichern und teilen */
.elementor-shape-circle.id-58 .elementor-icon,
.elementor-shape-circle.id-68 .elementor-icon 
{background-color: #01ADAA!important;}

/* Labordaten verarbeiten */
.elementor-shape-circle.id-53 .elementor-icon,
.elementor-shape-circle.id-59 .elementor-icon  
{background-color: #004188!important;}

/* Medikamente verteilen */
.elementor-shape-circle.id-57 .elementor-icon,
.elementor-shape-circle.id-70 .elementor-icon 
{background-color: #004188!important;}

/* Patienten interaktiv betreuen */
.elementor-shape-circle.id-59 .elementor-icon,
.elementor-shape-circle.id-71 .elementor-icon 
{background-color: #92C354!important;}

/* Prozesse digitalisieren */
.elementor-shape-circle.id-55 .elementor-icon,
.elementor-shape-circle.id-67 .elementor-icon  
{background-color: #39A5DE!important;}

/* Sensor Technologien Patienten-Monitoring auswählen */
.elementor-shape-circle.id-54 .elementor-icon,
.elementor-shape-circle.id-72 .elementor-icon 
{background-color: #01ADAA!important;}

/* Spracherkennungs- und Schreibdienste */
.elementor-shape-circle.id-58 .elementor-icon,
.elementor-shape-circle.id-73 .elementor-icon 
{background-color: #FBBA16!important;}

/* Gravity Forms – ps */

/* -------------------------------------------
   1) OPTIONAL: Native Radios erzwingen
   -------------------------------------------
   Nutze diese Sektion nur, wenn du wirklich
   native Radios willst. Sonst auskommentieren,
   weil unten Custom-Styles kommen.
------------------------------------------- */


.ps-contact-form form.gravity-theme .gfield_radio input[type="radio"],
.ps-contact-form form.gravity-theme .gchoice input.gfield-choice-input[type="radio"] {
  display: inline-block;
  width: 22px;
  height: 22px;
  margin: 0;
  vertical-align: middle;

  appearance: auto !important;
  -webkit-appearance: radio !important;
  -moz-appearance: radio !important;

  opacity: 1;
  visibility: visible !important;
  position: static !important;
}


/* -------------------------------------------
   3) ps Theme Overrides
------------------------------------------- */

.ps-gform .gform_required_legend {
  display: none !important;
}

.ps-gform .gform_fields {
  color: #483D28;
  display: grid;
  column-gap: 0;
  row-gap: 10px !important;
  text-transform: none;
}

/* Labels (Titel) */
.ps-gform .gfield_label.gform-field-label,
.ps-gform .gsection_title {
  color: #483D28 !important;
  display: inline-block !important;
  font-family: "aktiv-grotesk", sans-serif !important;
  font-size: 18px !important;
  font-weight: 600 !important;
  line-height: 1.5em !important;
  margin: 0 !important;
  text-transform: none !important;
  vertical-align: middle !important;
}

.ps-gform .gform-field-label {
  margin-left: 5px !important;
}

/* -------------------------------------------
   4) Custom Checkboxen & Radios (einheitlich)
------------------------------------------- */

.ps-gform .gform_wrapper .gfield_checkbox input[type="checkbox"],
.ps-gform .gform_wrapper .gfield_radio input[type="radio"],
.ps-gform .gform_wrapper .ginput_container_consent input[type="checkbox"] {
  -webkit-appearance: none !important;
  appearance: none !important;

  width: 25px !important;
  height: 25px !important;
  margin: 0 10px 0 0 !important;

  border: 1px solid #ccc !important;
  background: #fff !important;

  display: inline-grid !important;
  place-content: center !important;

  outline: none !important;
  cursor: pointer !important;

  position: relative !important;
  flex-shrink: 0 !important;

  border-radius: 8px !important;
}

/* Icon (Standard: Häkchen) */
.ps-gform .gform_wrapper .gfield_checkbox input[type="checkbox"]::before,
.ps-gform .gform_wrapper .ginput_container_consent input[type="checkbox"]::before,
.ps-gform .gform_wrapper .gfield_radio input[type="radio"]::before {
  font-family: "Font Awesome 5 Free" !important;
  font-weight: 900 !important;
  content: "\f00c" !important; /* Häkchen */
  font-size: 20px !important;

  position: absolute !important;
  color: #00ADAA !important;

  transform: scale(0) !important;
  transition: transform 150ms ease-in-out !important;
}

/* kleine optische Korrekturen je Typ */
.ps-gform .gform_wrapper .gfield_checkbox input[type="checkbox"]::before {
  margin-top: -5px !important;
  margin-left: 2px !important;
}

.ps-gform .gform_wrapper .gfield_radio input[type="radio"]::before {
  margin-top: -5px !important;
  margin-left: 1px !important;
}

.ps-gform .gform_wrapper .ginput_container_consent input[type="checkbox"]::before {
  margin-top: 2px !important;
  margin-left: 2px !important;
}

/* Checked State */
.ps-gform .gform_wrapper .gfield_checkbox input[type="checkbox"]:checked,
.ps-gform .gform_wrapper .ginput_container_consent input[type="checkbox"]:checked,
.ps-gform .gform_wrapper .gfield_radio input[type="radio"]:checked {
  border-color: #00ADAA !important;
  background: #fff !important;
}

.ps-gform .gform_wrapper .gfield_checkbox input[type="checkbox"]:checked::before,
.ps-gform .gform_wrapper .ginput_container_consent input[type="checkbox"]:checked::before,
.ps-gform .gform_wrapper .gfield_radio input[type="radio"]:checked::before {
  transform: scale(1) !important;
}

/* Labels neben den Inputs */
.ps-gform .gform_wrapper .gfield_checkbox label,
.ps-gform .gform_wrapper .gfield_radio label {
  color: #4b5563 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  line-height: 1.0 !important;
  font-size: 20px !important;
}

/* List Items */
.ps-gform .gform_wrapper .gfield_checkbox li,
.ps-gform .gform_wrapper .gfield_radio li {
  display: flex !important;
  align-items: center !important;
  margin: 8px 0 !important;
}

/* -------------------------------------------
   5) Inputs, Selects, Textareas
------------------------------------------- */

.ps-gform input.small,
.ps-gform input.medium,
.ps-gform input.large {
  border: 1px solid #666 !important;
  color: #333 !important;
  background-color: #fff !important;
  font-family: "aktiv-grotesk", sans-serif !important;
  font-size: 19px !important;
  font-weight: 300 !important;
  line-height: 1.2 !important;
  margin: 0 !important;
  max-inline-size: 100% !important;
  overflow: visible !important;
  padding: 14px 20px 8px 20px !important;
  text-transform: none !important;
  transition: all 0.3s !important;
  user-select: auto !important;
}

.ps-gform select.small,
.ps-gform select.medium,
.ps-gform select.large,
.ps-gform textarea.small,
.ps-gform textarea.medium,
.ps-gform textarea.large {
  border: 1px solid #666 !important;
  color: #483D28 !important;
  background-color: #fff !important;
  font-family: "aktiv-grotesk", sans-serif !important;
  font-size: 19px !important;
  font-weight: 300 !important;
}

/* -------------------------------------------
   6) Buttons
------------------------------------------- */

.ps-gform .gform-theme-button.button,
.ps-gform .gform_button.button {
  border-radius: 8px !important;
  overflow: visible !important;
  transition: all 0.3s linear !important;

  background-color: #004188 !important;
  border: 0 !important;
  color: #fff !important;

  display: inline-block !important;
  font-family: "aglet-sans", sans-serif !important;
  font-size: 22px !important;
  font-weight: 600 !important;
  line-height: 1.5em !important;

  margin: 0 !important;
  padding: 10px 25px !important;
  text-align: center !important;
  text-transform: none !important;

  user-select: auto !important;
  white-space: nowrap !important;
}

.ps-gform .gform-theme-button.button:hover,
.ps-gform .gform_button.button:hover {
  background-color: #00ADAA !important;
}

.ps-gform .gform_previous_button.gform-theme-button {
  background-color: #ccc !important;
  color: #483D28 !important;
}

/* -------------------------------------------
   7) Kleinkram
------------------------------------------- */

.ps-gform .gfield_required { font-size: 21px !important; }

.ps-gform .gfield_consent_label { margin-top: -12px !important; }

.ps-gform .gfield_validation_message { font-size: 18px !important; }

.ps-gform .gfield_consent_label,
.ps-gform .gfield_consent_label a { font-size: 18px !important; }

.ps-gform .field_description_below { font-size: 16px !important; }

 /* Standard Inputs */
 body .gform_wrapper input[type="text"]:focus,
 body .gform_wrapper input[type="email"]:focus,
 body .gform_wrapper input[type="url"]:focus,
 body .gform_wrapper input[type="tel"]:focus,
 body .gform_wrapper input[type="number"]:focus,
 body .gform_wrapper input[type="password"]:focus,
 body .gform_wrapper select:focus,
 body .gform_wrapper textarea:focus {
   border-color: #5F9064 !important;   /* Blaue Umrandung */
   box-shadow: 0 0 3px 2px rgba(100, 100, 100, 0.3); /* sanfter Glow */
   outline: none;           /* Standard-Outline entfernen */
   transition: all 0.2s ease-in-out;
 }
 
 /* footer */

.ps-subfooter a {font-size: clamp(1.125rem, 1.0833rem + 0.0868vw, 1.1875rem)!important;line-height:1.4!important;}
.ps-subfooter a:hover, .ps-footer a:hover {text-decoration: underline !important;}