.elementor-11050 .elementor-element.elementor-element-257c990{--box-border-color:#C8C8C8;--box-border-width:0px;--box-padding:7px;--box-min-height:0px;--header-background-color:#2F4F4F;--header-color:#FDFDFD;--toggle-button-color:#A21E1E;--separator-width:0px;--item-text-hover-decoration:underline;--marker-color:#A91010;}.elementor-11050 .elementor-element.elementor-element-3bd26062 > .elementor-background-overlay{background-color:#F3F3F3;opacity:0.5;transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-11050 .elementor-element.elementor-element-3bd26062{border-style:solid;border-width:1px 1px 1px 1px;border-color:#E1E1E1;transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;}.elementor-11050 .elementor-element.elementor-element-3bd26062, .elementor-11050 .elementor-element.elementor-element-3bd26062 > .elementor-background-overlay{border-radius:6px 6px 6px 6px;}.elementor-11050 .elementor-element.elementor-element-1c783a44{color:#4B4646;font-family:"PT Serif", Sans-serif;font-size:16px;font-weight:500;line-height:1.5em;}.elementor-11050 .elementor-element.elementor-element-28662e3b .elementor-accordion-item{border-width:1px;border-color:#B8B8B8;}.elementor-11050 .elementor-element.elementor-element-28662e3b .elementor-accordion-item .elementor-tab-content{border-width:1px;border-top-color:#B8B8B8;}.elementor-11050 .elementor-element.elementor-element-28662e3b .elementor-accordion-item .elementor-tab-title.elementor-active{border-width:1px;border-bottom-color:#B8B8B8;}.elementor-11050 .elementor-element.elementor-element-28662e3b .elementor-tab-title{background-color:#F5F5F5;padding:16px 16px 16px 16px;}.elementor-11050 .elementor-element.elementor-element-28662e3b .elementor-accordion-icon, .elementor-11050 .elementor-element.elementor-element-28662e3b .elementor-accordion-title{color:#00C0EF;}.elementor-11050 .elementor-element.elementor-element-28662e3b .elementor-active .elementor-accordion-icon, .elementor-11050 .elementor-element.elementor-element-28662e3b .elementor-active .elementor-accordion-title{color:#7D0404;}.elementor-11050 .elementor-element.elementor-element-28662e3b .elementor-accordion-title{font-family:"Georgia", Sans-serif;font-size:19px;font-weight:600;line-height:1.5em;letter-spacing:-0.5px;}.elementor-11050 .elementor-element.elementor-element-28662e3b .elementor-tab-title.elementor-active .elementor-accordion-icon i:before{color:#9ACD32;}.elementor-11050 .elementor-element.elementor-element-28662e3b .elementor-tab-title.elementor-active .elementor-accordion-icon svg{fill:#9ACD32;}.elementor-11050 .elementor-element.elementor-element-28662e3b .elementor-accordion-icon.elementor-accordion-icon-left{margin-right:0px;}.elementor-11050 .elementor-element.elementor-element-28662e3b .elementor-accordion-icon.elementor-accordion-icon-right{margin-left:0px;}.elementor-11050 .elementor-element.elementor-element-28662e3b .elementor-tab-content{background-color:#FBFBFB;color:#4B4646;font-family:"PT Serif", Sans-serif;font-size:16px;font-weight:500;line-height:1.5em;letter-spacing:0px;padding:6px 6px 6px 6px;}.elementor-11050 .elementor-element.elementor-element-28662e3b > .elementor-widget-container{border-style:solid;border-width:1px 1px 1px 1px;border-color:#E1E1E1;border-radius:6px 6px 6px 6px;}@media(min-width:768px){.elementor-11050 .elementor-element.elementor-element-58b0fd86{width:27.393%;}.elementor-11050 .elementor-element.elementor-element-6544b839{width:68.711%;}.elementor-11050 .elementor-element.elementor-element-15547bf5{width:3.558%;}}/* Start custom CSS for html, class: .elementor-element-38e93a0 *//* Переменные для кастомизации */
:root {
--primary-color: #4CAF50; /* Основной цвет */
--secondary-color: #f9f9f9; /* Цвет фона */
--border-color: #ddd; /* Цвет границ */
--input-border-color: #ccc; /* Цвет границ для ввода */
--button-hover-color: #45a049; /* Цвет кнопки при наведении */
--text-color: #333; /* Основной цвет текста */
--font-family: 'Arial', sans-serif; /* Шрифт */
--font-size: 14px; /* Размер шрифта */
--focus-color: #4CAF50; /* Цвет для фокуса */
--error-color: #f44336; /* Цвет для ошибок */
--input-padding: 10px; /* Отступы для полей ввода */
--button-padding: 12px; /* Отступы для кнопок */
--button-font-size: 1rem; /* Размер шрифта для кнопок */
}

/* Основной контейнер калькулятора */
#pValueCalculator {
font-family: var(--font-family);
max-width: 100%;
margin: 0 auto;
padding: 20px;
background-color: var(--secondary-color);
border: 1px solid var(--border-color);
border-radius: 8px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); /* Лёгкая тень для глубины */
box-sizing: border-box;
transition: box-shadow 0.3s ease; /* Плавный переход для тени */
}

/* Заголовок калькулятора */
#pValueCalculator h2 {
color: var(--text-color);
text-align: center;
margin-bottom: 20px;
font-size: 1.5rem;
font-weight: bold;
}

/* Стили для меток (label) */
#pValueCalculator label {
display: block;
margin-bottom: 5px;
font-weight: bold;
color: var(--text-color);
font-size: 1rem; /* Использование относительных единиц для лучшей адаптивности */
}

/* Стили для полей ввода и выбора */
#pValueCalculator select,
#pValueCalculator input {
width: 100%;
padding: var(--input-padding);
margin-bottom: 10px;
border: 1px solid var(--input-border-color);
border-radius: 4px;
box-sizing: border-box;
max-width: var(--max-width); /* Ограничиваем максимальную ширину для лучшей читаемости */
font-size: 1rem;
transition: border-color 0.3s ease;
}

/* Стили для фокуса на полях ввода */
#pValueCalculator select:focus,
#pValueCalculator input:focus {
border-color: var(--focus-color); /* Яркий фокус при активации поля */
outline: none;
}

/* Стили для кнопки */
#pValueCalculator button {
width: 100%;
padding: var(--button-padding);
border: none;
border-radius: 20px;
background-color: var(--primary-color);
color: white;
font-size: var(--button-font-size);
cursor: pointer;
margin-top: 10px;
transition: background-color 0.3s ease;
}

#pValueCalculator button:hover {
background-color: var(--button-hover-color);
}

#pValueCalculator button:focus {
outline: 2px solid var(--focus-color);
}

/* Результат калькуляции */
#result {
font-size: 1.125rem;
color: #2E86C1; /* Синий цвет для выделения */
font-weight: bold;
padding: 15px;
border-radius: 4px;
background-color: #f0f8ff; /* Легкий фон для выделения результата */
}

/* Стили для чекбоксов */
#pValueCalculator input[type="checkbox"] {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
width: 20px;
height: 20px;
border: 2px solid var(--primary-color);
border-radius: 50%;
outline: none;
cursor: pointer;
position: relative;
margin-right: 6px;
vertical-align: middle;
transition: background-color 0.3s ease;
}

#pValueCalculator input[type="checkbox"]:checked {
background-color: var(--primary-color);
border-color: var(--primary-color);
}

#pValueCalculator input[type="checkbox"]:checked::before {
content: "✔";
font-size: 16px;
color: white;
position: absolute;
top: -2px;
left: 2px;
}

/* Стили для радиокнопок */
#pValueCalculator input[type="radio"] {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
width: 20px;
height: 20px;
border: 2px solid var(--primary-color);
border-radius: 50%;
outline: none;
cursor: pointer;
position: relative;
margin-right: 10px;
vertical-align: middle;
transition: background-color 0.3s ease;
}

#pValueCalculator input[type="radio"]:checked {
background-color: var(--primary-color);
border-color: var(--primary-color);
}

#pValueCalculator input[type="radio"]:checked::before {
content: "";
width: 10px;
height: 10px;
background-color: white;
border-radius: 50%;
position: absolute;
top: 3px;
left: 3px;
}

/* Стили для описания под полями ввода в контейнере #pValueCalculator */
#pValueCalculator p {
font-size: 0.875rem; /* Немного меньше, чем основной текст */
color: #666; /* Цвет для описания */
margin-top: 5px; /* Отступ сверху */
margin-bottom: 15px; /* Отступ снизу */
line-height: 1.4; /* Линия между строками, чтобы текст был легче воспринимаем */
font-style: italic; /* Сделать текст курсивом */
border-left: 2px solid var(--primary-color); /* Левый бордер для выделения */
padding-left: 8px; /* Отступ от бордера */
margin-top: 8px; /* Отступ сверху от поля */
}

/* Адаптивность: для планшетов и телефонов */
@media (max-width: 1024px) {
#pValueCalculator {
padding: 15px;
}
#pValueCalculator h2 {
font-size: 1.4rem;
}
#pValueCalculator input,
#pValueCalculator select {
padding: 8px;
}
#pValueCalculator button {
padding: 10px;
font-size: 14px;
}
}

@media (max-width: 768px) {
#pValueCalculator {
padding: 10px;
}
#pValueCalculator h2 {
font-size: 1.2rem;
}
#pValueCalculator input,
#pValueCalculator select {
padding: 8px;
}
#pValueCalculator button {
padding: 10px;
font-size: 14px;
}
}

@media (max-width: 480px) {
#pValueCalculator h2 {
font-size: 1rem;
}
#pValueCalculator button {
font-size: 12px;
}
#pValueCalculator label {
font-size: 12px;
}
}/* End custom CSS */