* {
    margin: 0vw;
    padding: 0vw;
    box-sizing: border-box;
    user-select: none;
}

body, .form {
    position: absolute;
    display: flex;
    width: 100vw;
    height: 100vh;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

body {
    background: var(--background);
}

.top_form {
    position: absolute;
    display: flex;
    flex-direction: column;
    top: 4vw;
    align-items: center;
    justify-content: center;
}

.left_form {
    position: absolute;
    display: flex;
    flex-direction: column;
    left: 2.5vw;
    align-items: start;
    justify-content: center;
}

.left_header, .right_header {
    display: flex;
    flex-direction: row;
    gap: 0.6vw;
    align-items: center;
}

.right_header_icon_box, .right_item_header_left_icon_box {
    display: flex;
    width: 2.7604vw;
    height: 2.7604vw;
    background: var(--box-background);
    border: 1px solid var(--item-border-color);
    box-shadow: inset 0px 0px 16.4px rgba(0, 0, 0, 0.5);
    border-radius: 0.1041vw;
    align-items: center;
    justify-content: center;
}

.left_header_icon, .right_header_icon {
    width: 1.827vw;
    height: 1.827vw;
}

.left_header_column, .right_header_column {
    display: flex;
    flex-direction: column;
}

.right_header_column span:nth-child(1) {
    font-family: 'Bold';
    font-weight: 400;
    font-size: 1.15vw;
    color: var(--text-primary);
}

.left_header_column span:first-child {
    font-family: 'Bold';
    font-weight: 400;
    font-size: 1.25vw;
    margin-top: -3vw;
    margin-left: -0.4vw;
    color: var(--text-primary);
}

.left_header_column .service {
    color: var(--text-service) !important;
}

.left_header_column span:nth-child(2) {
    font-family: 'Medium';
    color: var(--text-secondary);
    margin-left: -0.4vw;
}

.left_content {
    width: 12.8vw;
    gap: 0.7vw;
}

.left_item {
    position: relative;
    display: flex;
    flex-direction: column;
    float: left;
    margin-top: 0.7vw;
    margin-right: 0.7vw;
    width: 4.625vw;
    height: 4.625vw;
    gap: 0.6vw;
    background: var(--item-background);
    border: 1px solid var(--item-border);
    box-shadow: inset 0px 0px 16.4px rgba(255, 255, 255, 0.25);
    border-radius: 0.1041vw;
    align-items: center;
    justify-content: center;
}

.left_item:hover {
    cursor: pointer;
    background: var(--item-hover-background);
    border: 1px solid var(--item-border);
    box-shadow: inset 0px 0px 16.4px rgba(255, 255, 255, 0.25);
}

.left_item_selected {
    background: var(--item-selected-background);
    border: 1px solid var(--item-border-color);
    box-shadow: inset 0px 0px 16.4px rgba(0, 0, 0, 0.5);
}

.left_item_selected:hover {
    background: var(--item-selected-background);
    border: 1px solid var(--item-border-color);
    box-shadow: inset 0px 0px 16.4px rgba(0, 0, 0, 0.5);
}

.left_item_icon {
    width: 2.552vw;
    height: 2.1776vw;
}

.left_item_label {
    font-family: 'Medium';
    font-weight: 600;
    font-size: 0.625vw;
    background: var(--text-primary);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.right_form {
    position: absolute;
    display: flex;
    flex-direction: column;
    right: 2.5vw;
    gap: 0.7vw;
    align-items: start;
    justify-content: center;
}

.right_content {
    display: flex;
    flex-direction: column;
    gap: 0.7vw;
}

.right_item {
    display: flex;
    flex-direction: column;
    width: 16.5625vw;
    padding: 0.8vw;
    background: var(--item-background);
    border: 1px solid var(--item-border);
    box-shadow: inset 0px 0px 16.4px rgba(255, 255, 255, 0.25);
    border-radius: 2px;
    align-items: start;
    justify-content: center;
}

.right_item_header {
    display: flex;
    flex-direction: row;
    width: 100%;
    align-items: center;
    justify-content: space-between;
}

.right_item_header_left, .right_item_header_right {
    display: flex;
    flex-direction: row;
    gap: 0.5vw;
    align-items: center;
    justify-content: start;
}

.right_item_header_left_icon_box {
    width: 1.71875vw;
    height: 1.71875vw;
}

.right_item_header_left_icon {
    width: 1.027vw;
    height: 1.027vw;
}

.right_item_header_left_label, .right_item_header_right_value {
    font-family: 'Gilroy-Light';
    font-size: 0.829vw;
    letter-spacing: 0.09em;
    color: var(--text-primary);
}

.right_item_header_right_value {
    letter-spacing: normal;
    font-weight: 700;
    font-size: 1.1vw;
}

.right_item_content {
    display: flex;
    flex-direction: row;
    margin-top: 0.7vw;
    width: 100%;
    gap: 0.3vw;
    align-items: center;
    justify-content: center;
}

.right_item_content_selector_icon {
    width: 0.78125vw;
    height: 0.78125vw;
}

.right_item_content_selector_icon:hover {
    cursor: pointer;
}

.right_item_content_selector {
    position: relative;
    display: flex;
    width: 13.2291vw;
    height: 0.1041vw;
    -webkit-appearance: none;
    background: rgba(217, 217, 217, 0.2);
    border-radius: 2px;
    appearance: none;
    align-items: center;
    justify-content: center;
}

.right_item_content_selector::-webkit-slider-thumb {
    position: relative;
    -webkit-appearance: none;
    appearance: none;
    margin-top: -0.01vw;
    width: 0.6167vw;
    height: 0.6167vw;
    background: var(--slider);
    box-shadow: var(--slider-shadow);
    border-radius: 2px;
    z-index: 1;
}

.right_item_content_selector::-webkit-slider-thumb:hover {
    cursor: pointer;
}

.checkout_header {
    margin-top: 0.7vw;
}

.checkout_content {
    display: flex;
    flex-direction: row;
    width: 100%;
    align-items: center;
    justify-content: space-between;
}

.checkout_item, .checkout_item2 {
    display: flex;
    flex-direction: row;
    width: 8.02vw;
    height: 2.2917vw;
    gap: 0.5vw;
    align-items: center;
    justify-content: center;
}

.checkout_item {
    background: linear-gradient(
        91.68deg, rgba(102, 102, 102, 0.767) -1.46%, rgba(0, 0, 0, 0.267) 54.14%, rgba(102, 102, 102, 0.753) 105.71%
    );
    border: 0.0781vw solid var(--checkout-border);
    border-radius: 0.1041vw;
}

.checkout_item:hover {
    cursor: pointer;
    background: var(--item-selected-background);
    border: 1px solid var(--item-border-color);
    box-shadow: inset 0px 0px 16.4px rgba(0, 0, 0, 0.5);
    border-radius: 2px;
}

.checkout_item2 {
    background: linear-gradient(
        91.68deg, rgba(102, 102, 102, 0.767) -1.46%, rgba(0, 0, 0, 0.267) 54.14%, rgba(102, 102, 102, 0.753) 105.71%
    );
    border: 1px solid var(--item-border);
    border-radius: 2px;
}

.checkout_item2:hover {
    cursor: pointer;
    background: var(--item-selected-background);
    border: 1px solid var(--item-border-color);
    box-shadow: inset 0px 0px 16.4px rgba(0, 0, 0, 0.5);
    border-radius: 2px;
}

.checkout_item_label {
    font-family: 'Gilroy-Light';
    font-size: 0.729vw;
    letter-spacing: 0.12em;
    background: var(--text-primary);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    opacity: 0.85;
}

.checkout_item:hover .checkout_item_label {
    opacity: 1;
}

.checkout_item_icon {
    position: relative;
    width: 0.9896vw;
    height: 0.625vw;
}

.bottom_form {
    position: absolute;
    display: flex;
    flex-direction: column;
    bottom: 3vw;
    align-items: center;
    justify-content: center;
}

.bottom_selector {
    position: relative;
    display: flex;
    margin-top: 0.7vw;
    width: 9.7396vw;
    height: 0.3125vw;
    -webkit-appearance: none;
    background: rgba(217, 217, 217, 0.2);
    border-radius: 2px;
    appearance: none;
    align-items: center;
    justify-content: center;
}

.bottom_selector::-webkit-slider-thumb {
    position: relative;
    -webkit-appearance: none;
    appearance: none;
    margin-top: -0.1vw;
    width: 0.9375vw;
    height: 0.9375vw;
    background: var(--slider);
    box-shadow: var(--slider-shadow);
    border-radius: 2px;
    z-index: 1;
}

.bottom_selector::-webkit-slider-thumb:hover {
    cursor: pointer;
}