.btn-settings {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 5px;

    user-select: none;
    padding: 8px 16px;

    position: relative;
    border-radius: 4px;

    border: solid 1px #ccc;
}

.btn-add-elements {
    display: flex;
    justify-content: start;
    align-items: center;
    gap: 10px;

    user-select: none;

    position: relative;
    width: 100%;
    padding: 8px 8px;
    border-radius: 4px;

    border: solid 1px #ccc;
}

.btn-delete-element {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;

    user-select: none;

    position: relative;
    width: max-content;
    padding: 8px 16px;
    border-radius: 4px;

    margin: 0 auto;

    border: solid 1px #e6352b;

        transition: all 0.1s linear;
}

.btn-delete-element p {
    text-transform: uppercase;
    font-weight: 500;
    letter-spacing: 1px !important;
}

.btn-delete-element:hover p {
    color: #fff;
    text-transform: uppercase;
    font-weight: 500;
    letter-spacing: 1px !important;
}

.btn-delete-element:hover svg {
    fill: #fff;
}

.btn-format {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 5px;

    user-select: none;
    height: 32px;
    width: 32px;
    border-radius: 4px;

    position: relative;
}


.btn-hint {
    display: none;
    position: absolute;
    bottom: -25px;
    width: max-content;
    z-index: 100;
    background-color: black;

    font-family: "Plus Jakarta Sans", sans-serif;
    color: whitesmoke;
    text-align: center;
    font-size: 12px;
    font-weight: 400;
    letter-spacing: 0.1px;

    padding: 3px 8px;
    border-radius: 4px;
}

.btn-settings:hover .btn-hint,
.btn-format:hover .btn-hint {
    display: block;
}

.wrapper-grid-size .btn-settings {
    height: 16px;
    padding: 8px 8px;
    border: none;
}

.wrapper-page-size .btn-settings{
    height: 16px;
    padding: 8px 16px;
    border: none;
}

.btn-settings:hover,
.btn-add-elements:hover,
.btn-format:hover,
.btn-file-upload:hover,
.btn-convert-to-birpis:hover {
    cursor: pointer;
    background-color: #f5f6f8;
}

.btn-delete-element:hover {
    cursor: pointer;
    background-color: #e6352b;
}

.btn-export-pit {
    background-color: #1e93ab;
    padding: 8px 16px;
    border: none;
}

#importB {
    background-color: #1e93ab;
    padding: 8px 16px;
    border: none;
    width: max-content;
    margin: 0 auto;
}

.btn-export-pit p,
#importB p{
    color: #f6f8fa;
}

.btn-export-pit:hover,
#importB:hover{
    background-color: #1e93abdd;
}

.position-inputs {
    width: 30px;
}

.inp-default {
    font-family: "Plus Jakarta Sans", sans-serif;
    color: #212427;
    font-size: 14px;
    font-weight: 400;
    text-align: center;

    letter-spacing: 0.3px;

    background-color: #f3f3f5;

    border: none;
    border-radius: 4px;

    padding: 4px 4px;
}

#font-size-label {
    cursor: default;
    user-select: none;
    height: fit-content;
}

#btn-reset {
    width: max-content;
    padding: 0px 4px;
}

.dropdown-format-color {
    background-color: #f3f3f5;
    border: none;
    padding: 8px 8px;
    border-radius: 4px;
}

/*  CODE FOR SLIDER CHECKBOX (ON OFF)*/
    .switch {
        position: relative;
        display: inline-block;
        width: 70px;
        height: 28px;
    }

    .slider {
        position: absolute;
        cursor: pointer;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background-color: #f3f3f5;
        -webkit-transition: 0.2s;
        transition: 0.2s;
    }

    .slider:before {
        position: absolute;
        content: "NE";
        font-family: "Plus Jakarta Sans", sans-serif;
        color: #333;
        text-align: center;
        font-size: 14px;
        font-weight: 500;
        letter-spacing: 0.03em;
        padding: 4px 12px;
        left: 4px;
        bottom: 3px;
        background-color: white;
        -webkit-transition: 0.2s;
        transition: 0.2s;
    }

    input:checked + .slider {
        background-color: #1e93ab;
    }

    input:focus + .slider {
        box-shadow: 0 0 1px #1e93ab;
    }

    input:checked + .slider:before {
        -webkit-transform: translateX(19px);
        -ms-transform: translateX(19px);
        transform: translateX(19px);
        content: "DA";
    }

    /* Rounded sliders */
    .slider.round {
        border-radius: 4px;
    }

    .slider.round:before {
        border-radius: 4px;
    }
/* END SLIDER */

.btn-disabled {
    opacity: 0.4;
}

.btn-disabled:hover {
    cursor: not-allowed !important;
    background-color: initial !important;
}

.btn-upload-img {
    width: -webkit-fill-available;
}

.element-line {
    width: 100%;
    height: 5mm;
    position: relative;
}

.element-line::before {
    content: "";
    width: 180mm;
    height: 1px;
    background-color: slategray;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%);
}

.element-barcode {
    width: 120px;
}

.inp-heightnum {
    width: 40px;
}

.upload-pit textarea {
    height: 500px;
}


.export-pit textarea {
    height: 500px;
}