/* mosso-propgrid.css
   Enhancements for rows, data field, and field label in grid, form edit, and create form
*/

/* Removed the .mosso-propgrid namespace per user request */

.grid-row {
    padding: 8px; /* slightly reduced padding for a more classic look */
    border: 1px solid ThreeDShadow;
    background-color: Window;
    transition: background-color 0.3s ease;
}

.grid-row:hover {
    background-color: #fafafa;
}

.datafield {
    padding: 5px;
    font-size: 14px;
    color: WindowText;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

.field-label {
    font-weight: bold;
    margin-bottom: 5px;
    display: block;
    color: ThreeDHighlight;
    font-size: 13px;
}

/* Enhancements for Form Edit */
.form-edit input[type='text'],
.form-edit input[type='number'],
.form-edit select,
.form-edit textarea {
    padding: 8px;
    border: 1px solid ThreeDShadow;
    border-radius: 4px;
    width: 100%;
    box-sizing: border-box;
    transition: border-color 0.3s ease;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    background-color: Window;
}

.form-edit input[type='text']:focus,
.form-edit input[type='number']:focus,
.form-edit select:focus,
.form-edit textarea:focus {
    border-color: #4a69bd;
    outline: none;
}

/* Enhancements for Create Form */
.createform .field-container {
    margin-bottom: 15px;
}

.createform .field-container:last-child {
    margin-bottom: 0;
}

/* Additional Enhancements */
.error-message {
    color: red;
    font-size: 13px;
    margin-top: 5px;
}

/* Responsive Adjustments */
@media (max-width: 768px) {
    .grid-row {
       padding: 8px;
    }
    .field-label {
       font-size: 13px;
    }
    .datafield {
       font-size: 13px;
    }
}

/* Optionally, if using data-control attribute for fields */
[data-control="field"] {
    background-color: Window;
    border: 1px solid ThreeDShadow;
    padding: 5px;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    color: WindowText;
}