/* =========================================
   Form Elements Styles
   ========================================= */

.y-c-form-group {
    text-align: right;
    margin-bottom: var(--y-spacing-20);
}

.y-c-form-group label {
    display: block;
    margin-bottom: var(--y-spacing-8);
    font-family: var(--y-font-family-Cairo);
    font-size: var(--y-font-size-16);
    font-weight: var(--y-font-weight-700);
    color: var(--y-color-secondary-text);
}

.required {
    color: var(--y-color-error);
}

.y-c-modal-input {
    width: var(--y-percent-100);
    padding: var(--y-spacing-10) var(--y-spacing-15);
    border: 1px solid var(--y-color-border);
    border-radius: var(--y-radius-8);
    background-color: var(--y-color-primary-text2);
    font-family: var(--y-font-family-Cairo);
    font-size: var(--y-font-size-16);
    color: var(--y-color-secondary-text);
    outline: none;
    transition: var(--y-transition-02s);
    box-sizing: border-box;
}

.y-c-modal-input:focus {
    border-color: var(--y-color-primary);
    background-color: var(--y-color-background-light);
}

.y-c-textarea {
    resize: vertical;
    min-height: var(--y-size-100);
}