/*
Theme Name: Tandem
Theme URI: http://designwork.com.ua
Author: Designwork
Author URI: http://designwork.com.ua
Description: Tandem
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/
html {
  scroll-behavior: smooth;
}

.footer-links ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
}

.custom-select-trigger .selected-value {
  width: 100%;
}

.page-template-careers .glass-card form,
.page-template-contacts .glass-card form {
  display: flex;
  flex-direction: column;
  gap: 24px var(--space-md);
  width: 100%;
}

.page-template-careers .input-wrapper p,
.page-template-careers .input-wrapper span,
.page-template-contacts .input-wrapper p,
.page-template-careers .input-wrapper span {
  display: block;
  width: 100%;
}

.page-template-careers .wpcf7-not-valid-tip,
.page-template-contacts .wpcf7-not-valid-tip {
  font-size: 12px;
  color: #FF8E85 !important;
}

.flex-box {
  display: flex;
  gap: 20px;
}

.cta-content .btn-outline {
  margin-top: var(--space-xl);
}

.attach__btn-wrapper {
  position: relative;
}

.attach__btn-wrapper .filex-attach input {
  width: 100%;
  height: 100%;
  position: absolute;
  opacity: 0;
  z-index: 3;
}

.attach__btn-wrapper {
  position: relative;
  cursor: pointer;
}

.attach__btn-wrapper * {
  cursor: pointer;
}

.attach__btn-wrapper .btn-outline .wpcf7-form-control-wrap {
  position: static;
}

input:-webkit-autofill {
  background: transparent !important;
}

.attach__btn-wrapper .btn-outline input {
  width: 100%;
  height: 100%;
  position: absolute;
  opacity: 0;
  z-index: 99;
  left: 0;
  top: 0;
  cursor: pointer;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
  -webkit-box-shadow: 0 0 0 30px transparent inset !important;
  /* імітує заливку потрібним кольором */
  -webkit-text-fill-color: #fff !important;
  /* колір тексту всередині */
  transition: background-color 5000s ease-in-out 0s;
}


.existing-messages .item:not(.active) {
  display: none;
}

.existing-messages .item {
  padding: 16px 56px;
  position: relative;
  max-width: 100%;
  margin-top: 10px;
}

.existing-messages .item:before {
  position: absolute;
  background-repeat: no-repeat;
  background-position: center;
  content: "";
  width: 20px;
  height: 20px;
  top: 50%;
  left: 24px;
  transform: translateY(-10px);
}

.existing-messages .exists:before {
  background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_3742_535)'%3E%3Cpath d='M16.666 5.5L7.50023 14.666L3.33398 10.4996' stroke='%2334C759' stroke-width='2' stroke-linecap='round'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_3742_535'%3E%3Crect width='20' height='20' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
}

.existing-messages .exists {
  border: 1px solid #34C759;
  color: #34C759;
  background: rgba(52, 199, 89, 0.0823529);

}

.existing-messages .notexists:before {
  background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10.0003 7.49967V10.833M10.0003 14.1663H10.0087M18.109 14.9999L11.4423 3.33319C11.297 3.0767 11.0862 2.86335 10.8314 2.71492C10.5767 2.56649 10.2872 2.48828 9.99234 2.48828C9.69752 2.48828 9.40797 2.56649 9.15324 2.71492C8.8985 2.86335 8.6877 3.0767 8.54234 3.33319L1.87567 14.9999C1.72874 15.2543 1.6517 15.5431 1.65235 15.837C1.653 16.1308 1.73132 16.4192 1.87938 16.673C2.02744 16.9269 2.23996 17.137 2.49542 17.2822C2.75088 17.4274 3.04018 17.5025 3.33401 17.4999H16.6673C16.9598 17.4996 17.2469 17.4223 17.5001 17.2759C17.7532 17.1295 17.9634 16.9191 18.1094 16.6658C18.2555 16.4125 18.3324 16.1252 18.3323 15.8328C18.3322 15.5404 18.2552 15.2531 18.109 14.9999Z' stroke='%23FF3B30' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E%0A");
}

.existing-messages .notexists {
  color: #FF3B30;
  background: rgba(255, 59, 48, 0.0823529);
  border: 1px solid #FF3B30;
}

.form__group-flex {
  display: flex;
}

.input-wrapper.error {
  border-color: #FF3B30;
  color: #FF3B30;
}

.input-wrapper {
  position: relative;
}

.wpcf7-form.invalid .input-wrapper input:not(#verify-username) {
  color: #FF3B30;
}

.input-wrapper:has(.wpcf7-not-valid) {
  border-color: #FF3B30 !important;
}

.input-wrapper .wpcf7-not-valid-tip {
  position: absolute;
  bottom: -38px;
  left: -18px;
}

.input-wrapper:has(.wpcf7-not-valid) input::placeholder,
.input-wrapper:has(.wpcf7-not-valid) input {
  color: #FF8E85 !important;
}


.wpcf7-response-output:before {
  position: absolute;
  background-repeat: no-repeat;
  background-position: center;
  content: "";
  width: 20px;
  height: 20px;
  top: 50%;
  left: 24px;
  transform: translateY(-10px);
}

.wpcf7-response-output {
  padding: 16px 40px 16px 56px !important;
  position: relative !important;
  font-size: 16px !important;
  max-width: 100% !important;
}

.wpcf7-form.sent .wpcf7-response-output {
  color: #34C759 !important;
  background: #34C75915 !important;
  border: 1px solid #34C759 !important;
}

.wpcf7-form.sent .wpcf7-response-output:before {
  background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_3742_535)'%3E%3Cpath d='M16.666 5.5L7.50023 14.666L3.33398 10.4996' stroke='%2334C759' stroke-width='2' stroke-linecap='round'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_3742_535'%3E%3Crect width='20' height='20' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
}

.wpcf7-form.invalid .wpcf7-response-output,
.wpcf7-form.failed .wpcf7-response-output {
  color: #FF8E85 !important;
  background: #FF3B3015 !important;
  border: 1px solid #FF3B30 !important;
}

.wpcf7-form.invalid .wpcf7-response-output:before,
.wpcf7-form.failed .wpcf7-response-output:before {
  background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10.0003 7.49967V10.833M10.0003 14.1663H10.0087M18.109 14.9999L11.4423 3.33319C11.297 3.0767 11.0862 2.86335 10.8314 2.71492C10.5767 2.56649 10.2872 2.48828 9.99234 2.48828C9.69752 2.48828 9.40797 2.56649 9.15324 2.71492C8.8985 2.86335 8.6877 3.0767 8.54234 3.33319L1.87567 14.9999C1.72874 15.2543 1.6517 15.5431 1.65235 15.837C1.653 16.1308 1.73132 16.4192 1.87938 16.673C2.02744 16.9269 2.23996 17.137 2.49542 17.2822C2.75088 17.4274 3.04018 17.5025 3.33401 17.4999H16.6673C16.9598 17.4996 17.2469 17.4223 17.5001 17.2759C17.7532 17.1295 17.9634 16.9191 18.1094 16.6658C18.2555 16.4125 18.3324 16.1252 18.3323 15.8328C18.3322 15.5404 18.2552 15.2531 18.109 14.9999Z' stroke='%23FF3B30' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E%0A");
}