.adv {
    min-height: 300px;
    height: 100%;
    background-color: #eef7f7;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    display: flex;
    align-items: center;
    justify-content: center;
}

.adv1 {
    background-image: url('../image/adv1.jpg');
}

.adv2 {
    background-image: url('../image/adv2.jpg');
}

.adv3 {
    background-image: url('../image/adv3.jpg');
}

.adv img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.calculator__container {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
}

.col2 {
    grid-column: span 2;
}

.col3 {
    grid-column: span 3;
}

.col4 {
    grid-column: span 4;
}

.col5 {
    grid-column: span 5;
}

.col6 {
    grid-column: span 6;
}

.mb-1 {
    margin-bottom: 0.5rem;
}

.mb-2 {
    margin-bottom: 1rem;
}

.mb-2 {
    margin-bottom: 1.5rem;
}

.calculator {
    /*grid-row: span 2;*/
}

.form-calculator {
    padding: 20px;
    margin-bottom: 1.5rem;
    background: #fff;
    border-radius: 1rem;
    border: 2px solid #88cc00;
    color: #225766;
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1);
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 20px;
}

.calculator label {
    display: block;
    font-size: 1.3rem;
    font-weight: bold;
    margin-bottom: 1rem;
}

.calculator select {
    font-size: inherit;
    font-family: inherit;
    background-color: #f9fafb;
    border: 1px solid #e5e7eb;
    padding: 12px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%;
    border-radius: 5px;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='15' height='17' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12.662 7.869c0-.942-.893-1.503-1.56-.981L7.235 9.917 3.37 6.889c-.667-.523-1.56.038-1.56.98 0 .394.167.762.447.98l4.31 3.377a1.06 1.06 0 0 0 1.339 0l4.31-3.376c.28-.219.447-.587.447-.981Z' fill='%23135E69'/%3E%3C/svg%3E");
    background-position: right 8px center;
    background-repeat: no-repeat;
    display: block;
    cursor: pointer;
}

.rtl .calculator select {
    background-position: left 8px center;
}

.calculator .slider-container {
    width: 100%;
}

.calculator .slider-wrapper {
    width: 100%;
    aspect-ratio: 768/432;
    margin-bottom: 5px;
}

.calculator .slider {
    border-radius: 5px;
}

.calculator .slider-thumbnails {
    grid-template-columns: repeat(5, 1fr);
}

.calculator .slider-thumbnails__image {
    border-radius: 5px;
}

.calculator .image {
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    width: 300px;
    height: 150px;
    overflow: hidden;
    border-radius: 1rem;
    border: 1px solid #88cc00;
    display: inline-block;
}

.calculator .image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.calculator__logo {
    max-width: 280px;
}

.calculator__logo img {
    width: 100%;
}

.specs-container {
    display: none;
}

.specs-container--visible {
    display: block;
}

.specs {
    grid-template-columns: repeat(2, 1fr);
    gap: 20px 40px;
    align-items: start;
    display: none;
}

.specs--visible {
    display: grid;
}

.spec-title {
    grid-column: span 2;
}

h2.spec-title {
    font-size: 20px;
}

h3.spec-title {
    font-size: 16px;
}

.spec-table__raw {
    background-color: #eee;
}

.spec-table__raw:nth-child(2n) {
    background-color: #fff;
}

.spec-table__label {
    padding: 5px 10px;
    text-align: start;
}

.spec-table__value {
    padding: 5px 10px;
    text-align: end;
}

.specs--visible + .specs__button {
    margin-top: 20px;
}

.calculator-params {
    padding: 10px;
    border: 1px solid #88cc00;
    border-radius: 4px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
}

.calculator-params label {
    font-size: 1rem;

    line-height: 1.3;
    margin-bottom: 0.6em;
}

.calculator input {
    background-color: #f9fafb;
    border-color: #e5e7eb;
    display: inline-block;
    width: 100px;
    font: inherit;
    line-height: 1.47;
    color: #555;
    padding: 7px;
    border: 2px solid #b8b8b8;
    border-radius: 0.176em;
    box-sizing: border-box;
}

.calculator input.input-error,
.calculator select.input-error {
    border-color: #ff2424;
}

.calculator .input70 {
    width: 70px;
}

.calculator .input150 {
    width: 150px;
}

.calculator button {
    display: block;
    width: 100%;
    max-width: 100%;
    font-size: 1.2em;
    font-weight: bold;
    cursor: pointer;
    text-align: center;
    outline: none;
    -webkit-appearance: none;
    padding: 0.588em 0.882em;
    line-height: normal;
    border-radius: 12px;
    background-color: #88cc00;
    border-color: #88cc00;
    color: #fff;
    border: 0;
}

.results {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.5rem;
}

.result {
    background: #fff;
    padding: 1.2rem;
    border-radius: 0.5rem;
    box-shadow: #fff 0px 0px 0px 0px, #e5e7eb 0px 0px 0px 1px, rgba(0, 0, 0, 0.1) 0px 1px 3px 0px,
        rgba(0, 0, 0, 0.1) 0px 1px 2px -1px;
}

.result__title {
    font-size: 1rem;
    color: #6b7280;
    margin-bottom: 1rem;
}

.result__value {
    font-size: 2rem;
    line-height: 2.3rem;
    display: block;
    font-weight: 500;
    margin-bottom: 1rem;
    height: 2.3rem;
}

.result__value span {
    font-size: 1rem;
    color: #6b7280;
}

.result__footer {
    font-size: 0.9rem;
    height: 1rem;
    line-height: 1rem;
    color: #6b7280;
}

.calculator-buttons__container {
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding-left: 20px;
}

.calculator-buttons {
    border-radius: 16px;
    border: 2px solid #88cc00;
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1);
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.calculator-button {
    width: 100%;
    text-align: start;
    border: 1px solid #88cc00;
    padding: 15px 20px;
    display: flex;
    align-items: center;
    transition: background-color 0.3s ease-in-out;
}

.calculator-button:hover {
    background-color: #fff;
}

.calculator-button--successed {
    background-color: #d1ff76 !important;
}

.calculator-button--icon::before {
    content: '';
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
    display: inline-block;
    width: 16px;
    height: 16px;
    margin-right: 10px;
}

.calculator-button--icon-save::before {
    background-image: url('../image/save-icon.png');
}

.calculator-button--icon-link::before {
    background-image: url('../image/link-icon.png');
}

.calculator-button--icon-print::before {
    background-image: url('../image/print-icon.png');
}

.calculator-button--icon-pdf::before {
    background-image: url('../image/pdf-icon.png');
}

.calculator-button--icon-favorite::before {
    background-image: url('../image/favorite-icon.png');
}

.calculations-recent {
    border-radius: 16px;
    border: 2px solid #88cc00;
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1);
    padding: 20px;
    flex-direction: column;
    gap: 20px;
    display: none;
}

.calculations-recent--visible {
    display: flex;
}

.calculations-recent__title {
    font-weight: 600;
    font-size: 18px;
}

.calculations-recent__body {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.calculation {
    display: block;
    color: #315677;
    opacity: 1;
    transition: opacity 0.3s ease-in-out;
}

.calculation:hover {
    opacity: 0.7;
}

#curency {
    cursor: pointer;
}

#curency::after {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='15' height='17' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12.662 7.869c0-.942-.893-1.503-1.56-.981L7.235 9.917 3.37 6.889c-.667-.523-1.56.038-1.56.98 0 .394.167.762.447.98l4.31 3.377a1.06 1.06 0 0 0 1.339 0l4.31-3.376c.28-.219.447-.587.447-.981Z' fill='%23135E69'/%3E%3C/svg%3E");
    background-position: 0 2px;
    background-repeat: no-repeat;
    display: inline-block;
    content: '';
    width: 15px;
    height: 17px;
}

.hilite {
    background: #fffbeb;
    color: #b45309;
    padding: 8px;
    border-radius: 10px;
    font-size: 0.8rem;
    margin-top: -8px;
}

.hint {
    position: relative;
    min-height: 1.5rem;
}

.hint::after {
    background-image: url("data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' id='icon--help' viewBox='0 0 20 20'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-8 7a7 7 0 100-14 7 7 0 000 14z' fill='currentColor' /%3E%3Cpath d='M9.292 11.89h.888v-.516c0-.732.516-1.236 1.056-1.752.576-.552 1.176-1.116 1.176-2.004 0-1.008-.648-1.992-2.28-1.992-1.464 0-2.46.984-2.544 2.388h.936c.084-.948.696-1.56 1.596-1.56.888 0 1.284.492 1.284 1.2 0 .576-.408 1.008-.876 1.476-.6.588-1.236 1.188-1.236 2.16v.6zm.42 2.484c.42 0 .768-.336.768-.768a.766.766 0 00-.768-.768.766.766 0 00-.768.768c0 .432.348.768.768.768z' fill='currentColor' /%3E%3C/svg%3E");
    background-repeat: no-repeat;
    width: 1.5rem;
    height: 1.5rem;
    display: inline-block;
    content: '';
    font-size: 0.8rem;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
}

label.hint {
    min-height: auto;
}

label.hint::after {
    margin-left: 5px;
}

.error {
    display: none;
    margin-top: 8px;
    font-size: 0.8rem;
    color: red;
}

.error.error-active {
    display: block;
}

.modal-calculator {
    color: #454545;
    max-width: 580px;
    border-radius: 10px;
    background: #f9fafb;
    cursor: auto;
    will-change: transform, opacity;
    padding: 2rem;
    padding-top: 2.4rem;
}

.modal-calculator .modal__title {
    font-weight: bold;
    line-height: 1.2;
    letter-spacing: -0.6px;
    font-size: 1.6rem;
    margin-bottom: 1.5rem;
}

.modal-calculator p {
    margin-bottom: 1rem;
    line-height: 1.58;
    font-size: 21px;
}

.curencys {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
}

.curency {
    cursor: pointer;
    text-align: center;
    min-width: 50px;
    min-height: 50px;
    line-height: 50px;
    font-size: 1.5rem;
}

.curency:hover {
    background-color: #ebebeb;
}

.input-wrapper {
    display: inline-block;
    position: relative;
}

.input-wrapper .input-text {
    font-size: 1rem;
    line-height: 1.3;
    position: absolute;
    top: 11px;
    right: 6px;
}

.rtl .input-wrapper .input-text {
    right: auto;
    left: 6px;
}

.calculator-print-logo {
    display: none;
}

@media (max-width: 768px) {
    .col2 {
        grid-column: span 1;
    }

    .col3 {
        grid-column: span 1;
    }

    .col4 {
        grid-column: span 1;
    }

    .col5 {
        grid-column: span 1;
    }

    .col6 {
        grid-column: span 1;
    }

    .form-calculator {
        padding: 20px 10px;
    }

    .input-wrapper {
        display: block;
    }

    .calculator input {
        width: 100%;
    }

    .calculator .input70 {
        width: 100%;
    }

    .calculator .input150 {
        width: 100%;
    }

    .calculator__container,
    .form-calculator,
    .calculator-params,
    .results {
        grid-template-columns: 1fr;
    }

    .specs {
        grid-template-columns: 1fr;
    }

    .spec-title {
        grid-column: span 1;
    }

    .calculator-buttons__container {
        margin: 1.5rem 0 0 0;
        padding: 0;
    }
}

@media print {
    body {
        width: 800px;
    }

    #wpadminbar,
    .header,
    .side-menu,
    .adv,
    .footer,
    .contact-actions,
    .cart-widget,
    .overlay,
    .modal-close-button,
    .modal,
    .search-modal,
    .slider-switchers,
    .slider-button,
    .specs-container,
    .specs-container--visible,
    .hint,
    .calculate-button__container,
    .battry-hint__container,
    .calculator-buttons__container {
        display: none;
    }

    .col2 {
        grid-column: span 2;
    }

    .col3 {
        grid-column: span 3;
    }

    .col4 {
        grid-column: span 4;
    }

    .col5 {
        grid-column: span 5;
    }

    .col6 {
        grid-column: span 6;
    }

    .input-wrapper {
        display: inline-block;
    }

    .calculator {
        margin: 10px 0;
    }

    .form-calculator {
        border: none;
        padding: 0;
        gap: 15px 20px;
        box-shadow: none;
        position: relative;
    }

    .form-calculator .calculator-print-logo {
        display: block;
        width: 120px;
        position: absolute;
        right: 10px;
        top: 0;
    }

    .form-calculator .calculator-print-logo img {
        width: 100%;
    }

    .calculator-params {
        border: none;
        padding: 0;
    }

    .calculator .input70 {
        width: 70px;
    }

    .calculator .input150 {
        width: 150px;
    }

    .calculator__container {
        grid-template-columns: repeat(1, 1fr);
    }

    .form-calculator {
        grid-template-columns: repeat(6, 1fr);
    }

    .calculator-params {
        grid-template-columns: repeat(3, 1fr);
    }

    .results {
        grid-template-columns: repeat(2, 1fr);
    }

    .calculator .slider-wrapper {
        aspect-ratio: 768/400;
    }

    #curency::after {
        display: none;
    }
}

.pdf #wpadminbar,
.pdf .header,
.pdf .side-menu,
.pdf .adv,
.pdf .footer,
.pdf .contact-actions,
.pdf .cart-widget,
.pdf .overlay,
.pdf .modal-close-button,
.pdf .modal,
.pdf .search-modal,
.pdf .slider-switchers,
.pdf .slider-button,
.pdf .specs-container,
.pdf .specs-container--visible,
.pdf .hint,
.pdf .calculate-button__container,
.pdf .battry-hint__container,
.pdf .calculator-buttons__container {
    display: none;
}

.pdf .input-wrapper {
    display: inline-block;
}

.calculator.pdf {
    margin: 10px 0;
    background: #fff;
}

.pdf .form-calculator {
    border: none;
    padding: 0;
    gap: 15px 20px;
    box-shadow: none;
    position: relative;
}

.pdf .form-calculator .calculator-print-logo {
    display: block;
    width: 120px;
    position: absolute;
    right: 10px;
    top: 0;
}

.pdf .form-calculator .calculator-print-logo img {
    width: 100%;
}

.pdf.calculator select {
    background-image: none;
}

.pdf .calculator-params {
    border: none;
    padding: 0;
}

.calculator.pdf .input70 {
    width: 70px;
}

.calculator.pdf .input150 {
    width: 150px;
}

.pdf .calculator__container {
    grid-template-columns: repeat(1, 1fr);
}

.pdf .form-calculator {
    grid-template-columns: repeat(6, 1fr);
}

.pdf .calculator-params {
    grid-template-columns: repeat(3, 1fr);
}

.pdf .results {
    grid-template-columns: repeat(2, 1fr);
}

.pdf .result {
    border: 1px solid #ccc;
}

.calculator.pdf .slider-wrapper {
    aspect-ratio: 768/400;
}

.pdf #curency::after {
    display: none;
}