.create-farm-details-input-field {
    width: 50%;
}

.create-farm-loc-dropdown {
    width: 100%;
    height: 250px;
}

create-farm-emp-role-dropdown {
    width: 100%;
}

.create-farm-emp-name-search-bar {
    color: gray;
    background-color: gold;
    border-color: green;
    border-width: 4px;
    margin-top: 0px;
}


.create-farm-employee-count-field {
    width: 320px;
}

.farm-label-decoration {
    border-bottom: 3px solid green;
}

.farm-accordion {
    width: 75%
}

.farm-z-index {
    z-index: 1;
}

/* Default accordion header */ 
.accordion-button {
    background-color: #f8f9fa; /* light gray */
    color: #000;
}
/* When accordion is open */
.accordion-button:not(.collapsed) {
    background-color: #198754; /* Bootstrap green */
    color: #fff;
}

.farm-loc-img {
    width: 200px; /* set a fixed width */
    height: 200px; /* set a fixed height */
    object-fit: cover; /* ensures the image fills the box without distortion */
    border-radius: 50%; /* makes the image perfectly round */
    border-radius: 50%; /* makes the image circular */
    border: 3px solid green; /* adds a green circular border */
}

.farm-disabled:disabled {
    background: linear-gradient(90deg, hsla(116, 50%, 48%, 1) 0%, hsla(101, 43%, 46%, 1) 100%)
}

@media (width < 420px) {
    .farm-accordion {
        width: 100%
    }
}

@media (width < 459px) {
    .col-special-in-between {
        flex: 0 0 auto;
        width: 50%;
        margin-bottom: 4px;
    }
    .create-farm-employee-count-field {
        width: 100%;
    }
}

@media (width < 576px) {
    .farm-loc-img {
        width: 100px;
        height: 100px;
    }
    .create-farm-details-input-field {
        width: 100%;
    }
    create-farm-employee-count-field {
        width: 100%;
    }
}

@media (min-width: 450px) and (width < 576px) {
    .col-special-in-between {
        flex: 0 0 auto;
        width: 35.5%;
    }
    .col-special-in-between-empcount {
        flex: 0 0 auto;
        width: 35.5%;
    }
    .create-farm-details-input-field {
        width: 64.5%;
    }
    .create-farm-employee-count-field {
        width: 270px;
    }
}

@media (min-width: 641px) and (width < 768px) {
    .farm-loc-img {
        width: 100px;
        height: 100px;
    }
    .col-special-in-between {
        flex: 0 0 auto;
        width: 35.5%;
    }
    .col-special-in-between-empcount {
        flex: 0 0 auto;
        width: 40%;
    }
    .create-farm-details-input-field {
        width: 64.5%;
    }
    .create-farm-employee-count-field {
        width: 215px;
    }
}

@media (min-width: 768px) and (width < 1024px) {
    .create-farm-details-input-field {
        width: 64.5%;
    }

    .create-farm-upload-butt {
        flex: 0 0 auto;
        width: 40%;
    }
}