.dropdown_wrapper{
            display: flex;
            flex-direction: column;
        }
        .dropdown{
            position: absolute;
            background-color: white;
            border-radius: var(--radius-badges);
            border: solid 1px black;
            min-width: 150px;
            display: none;
        }
        .dropdown > .content > div + div{
            border-top: solid 1px black;
        }
        .dropdown > .content > div{
            text-align: center;
            padding: var(--element-gap);
        }
        .modal{
            border: solid 1px var(--border-color);
            border-radius: var(--radius-badges);
            padding: var(--card-padding);
            width: fit-content;
            position: absolute;
            background-color: white;
            z-index: 200;
        }
        .product_name{
            font-size: var(--text-heading-sm);
        }
        .product_name input{
            font-size: var(--text-subheading);
            all: unset;
            border-bottom: 1px solid var(--border-color);
            flex: 1;
        }
        .modal form{
            display: flex;
            flex-direction: column;
            gap: calc(var(--spacing-unit) * 10);
        }
        .form_group{
            display: flex;
            gap: var(--element-gap);
            flex-direction: row;
            justify-content: space-between;
        }
        .modal_content{
            display: flex;
            gap: calc(var(--section-gap));
        }
        .modal_content > div{
            display: flex;
            flex-direction: column;
            gap: var(--element-gap);
        }
        .modal_content .heading{
            font-size: var(--text-caption);
            font-weight: var(--font-weight-w510);
        }
        .modal_content .form_group input{
            width: 70%;
        }
        .modal_content .form_group{
            width: 350px;
        }
        .modal_footer{
            display: flex;
            justify-content: space-between;
        }
        .modal_footer div{
            display: flex;
            gap: var(--element-gap);
        }
        .modal .caption{
            text-align: end;
            font-size: var(--text-caption);
        }
        .modal .title{
            font-size: var(--text-subheading);
        }