/* Editing Interface Form CSS */

/* Style the form container */

form {
    max-width: 90%;
    margin: 0 auto;
    padding: 20px;
    border: 0px solid #ccc;
    border-radius: 5px;
    background-color: transparent;
}

/* Style form labels */
form label {
    display: block;
    margin-top: 10px;
    font-weight: bold;
    font-size: 14px;
}

    /* Add margins to input and label elements within the form */
    form input, form label {
        display: block; /* Ensures each input/label starts on a new line */
        margin-bottom: 8px; /* Bottom margin */
    }

/* Style form input elements */
form input[type="file"],
form select,
form input[type="checkbox"] {
    width: 100%;
    padding: 8px;
    margin-bottom: 15px;
    border: 1px solid #ccc;
    border-radius: 3px;
    box-sizing: border-box;
    font-size: 9px;
}

/* Style submit button */
form input[type="submit"] {
    width: 100%;
    padding: 10px;
    margin-bottom: 15px;
    background-color: #007bff;
    border: none;
    border-radius: 3px;
    color: #fff;
    font-size: 16px;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

/* Hover effect on submit button */
form input[type="submit"]:hover {
    background-color: #0056b3;
}

/* Add spacing between form elements */
form select,
form input[type="checkbox"] {
    margin-top: 10px;
}

/* Style checkbox label */
form input[type="checkbox"] + label {
    margin-left: 5px;
}

/* Style form select elements */
form select {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="12" height="6" viewBox="0 0 12 6"><polygon points="6 0 12 6 0 6"/></svg>') no-repeat right 10px center/8px 6px;
}

/* Hide file input label */
form input[type="file"] + label {
    display: none;
}