/**
 * Filename:    sa_field.css
 * 
 * Description: Implementation of the sa_field class.
 * 
 * Copyright © 1999-2023 by Interact Solutions Ltda.
 * Rua Carlos Fett Filho, 47/301
 * 95.900.000, LAJEADO, RS
 * BRAZIL
 * 
 * The copyright to the computer program(s) herein
 * is the property of Interact Solutions Ltda., Brazil.
 * The program(s) may be used and/or copied only with
 * the written permission of Interact Solutions Ltda.
 * or in accordance with the terms and conditions
 * stipulated in the agreement/contract under which
 * the program(s) have been supplied.
 */

.sa_field
{
    position: relative;
    display: flex;
    flex-direction: row;
    gap: 4px;
}

.sa_field .sa_field__west
{
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 4px;
}

.sa_field .sa_field__leading
{
    z-index: 1;
    position: absolute;
    display: flex;
    flex-direction: row;
    align-items: center;
    left: 0px;
    gap: 4px;
}

.sa_field .sa_field__center
{
    width: 100%;
    height: 100%;
    position: relative;
    display: flex;
    align-items: center;
}

.sa_field .sa_field__center input,
.sa_field .sa_field__center textarea
{
    height: 100%;
    width: 100%;
    font-size: 12px;
    box-sizing: border-box;
}

.sa_field:not(.sa_datebox) .sa_field__center input
{
    padding: 0 4px;
}

.sa_field .sa_field__center textarea
{
    padding: 4px;
}

.sa_field.sa_field__readonly .sa_field__center input,
.sa_field.sa_field__readonly .sa_field__center textarea
{
    background-color: #E8E8E8;
}

.sa_field.sa_field__inplace input:not(:focus),
.sa_field.sa_field__inplace textarea:not(:focus),
.sa_field.sa_field__inplace.sa_field__readonly input,
.sa_field.sa_field__inplace.sa_field__readonly textarea
{
    border: none !important;
    background: none !important;
    outline: none !important;
}

.sa_field .sa_field__trailing
{
    z-index: 1;
    position: absolute;
    display: flex;
    flex-direction: row;
    align-items: center;
    right: 0px;
    gap: 4px;
}

.sa_field .sa_field__east
{
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 4px;
}