/*
 * ERP control contract.
 *
 * Only semantic .erp-field--* wrappers opt into these dimensions.  Do not add
 * bare input, textarea, .form-control, .dxbl-* or Storefront selectors here.
 * Values can be overridden per tenant through ERP_CSS_* in web_parametros.
 */
.app-shell {
    --erp-ui-control-height: var(--erp-control-height, 32px);
    --erp-ui-control-radius: var(--erp-control-radius, 3px);
    --erp-ui-field-gap: var(--erp-field-gap, 12px);
    --erp-ui-code-width: var(--erp-field-code, 128px);
    --erp-ui-serie-width: var(--erp-field-serie, 86px);
    --erp-ui-numeric-width: var(--erp-field-qty, 100px);
    --erp-ui-nif-width: var(--erp-field-nif, 170px);
    --erp-ui-cp-width: var(--erp-field-cp, 112px);
    --erp-ui-phone-width: var(--erp-field-phone, 150px);
    --erp-ui-country-width: var(--erp-field-country, 220px);
    --erp-ui-town-width: var(--erp-field-town, 240px);
    --erp-ui-email-width: var(--erp-field-email, 340px);
    --erp-ui-name-width: var(--erp-field-name, 420px);
    --erp-ui-address-width: var(--erp-field-address, 560px);
    --erp-ui-warehouse-width: var(--erp-field-warehouse, 280px);
    --erp-ui-detail-width: var(--erp-field-detail, 520px);
    --erp-ui-textarea-height: var(--erp-textarea-height, 200px);
}

.app-shell .erp-form-v2 .erp-field {
    box-sizing: border-box;
    min-width: 0;
}

.app-shell .erp-form-v2 .erp-field > label {
    display: block;
    margin: 0 0 3px;
    color: var(--erp-label-color, #475467);
    font-size: var(--erp-label-size, 12px);
    line-height: 1.2;
}

.app-shell .erp-form-v2 .erp-field > :not(label) {
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
}

.app-shell .erp-form-v2 .erp-field > .dxbl-text-edit,
.app-shell .erp-form-v2 .erp-field > .dxbl-combobox,
.app-shell .erp-form-v2 .erp-field > .dxbl-date-edit,
.app-shell .erp-form-v2 .erp-field > .dxbl-spin-edit,
.app-shell .erp-form-v2 .erp-field > .form-control,
.app-shell .erp-form-v2 .erp-field > input,
.app-shell .erp-form-v2 .erp-field > .erp-inline-control {
    min-height: var(--erp-ui-control-height);
    height: var(--erp-ui-control-height);
    border-radius: var(--erp-ui-control-radius);
}

.app-shell .erp-form-v2 .erp-field--code { width: var(--erp-ui-code-width); }
.app-shell .erp-form-v2 .erp-field--serie { width: var(--erp-ui-serie-width); }
.app-shell .erp-form-v2 .erp-field--numeric,
.app-shell .erp-form-v2 .erp-field--date,
.app-shell .erp-form-v2 .erp-field--money,
.app-shell .erp-form-v2 .erp-field--percent { width: var(--erp-ui-numeric-width); }
.app-shell .erp-form-v2 .erp-field--nif { width: var(--erp-ui-nif-width); }
.app-shell .erp-form-v2 .erp-field--postal-code { width: var(--erp-ui-cp-width); }
.app-shell .erp-form-v2 .erp-field--phone { width: var(--erp-ui-phone-width); }
.app-shell .erp-form-v2 .erp-field--country,
.app-shell .erp-form-v2 .erp-field--province { width: var(--erp-ui-country-width); }
.app-shell .erp-form-v2 .erp-field--town { width: var(--erp-ui-town-width); }
.app-shell .erp-form-v2 .erp-field--email,
.app-shell .erp-form-v2 .erp-field--web { width: var(--erp-ui-email-width); }
.app-shell .erp-form-v2 .erp-field--name { width: var(--erp-ui-name-width); }
.app-shell .erp-form-v2 .erp-field--address { width: var(--erp-ui-address-width); }
.app-shell .erp-form-v2 .erp-field--warehouse { width: var(--erp-ui-warehouse-width); }
.app-shell .erp-form-v2 .erp-field--detail { width: var(--erp-ui-detail-width); }

.app-shell .erp-form-v2 .erp-field--textarea,
.app-shell .erp-form-v2 .erp-field--textarea > .dxbl-memo,
.app-shell .erp-form-v2 .erp-field--textarea textarea {
    min-height: var(--erp-ui-textarea-height);
    height: var(--erp-ui-textarea-height);
}

@media (max-width: 720px) {
    .app-shell .erp-form-v2 .erp-field,
    .app-shell .erp-form-v2 .erp-field--code,
    .app-shell .erp-form-v2 .erp-field--serie,
    .app-shell .erp-form-v2 .erp-field--numeric,
    .app-shell .erp-form-v2 .erp-field--date,
    .app-shell .erp-form-v2 .erp-field--money,
    .app-shell .erp-form-v2 .erp-field--percent,
    .app-shell .erp-form-v2 .erp-field--nif,
    .app-shell .erp-form-v2 .erp-field--postal-code,
    .app-shell .erp-form-v2 .erp-field--phone,
    .app-shell .erp-form-v2 .erp-field--country,
    .app-shell .erp-form-v2 .erp-field--province,
    .app-shell .erp-form-v2 .erp-field--town,
    .app-shell .erp-form-v2 .erp-field--email,
    .app-shell .erp-form-v2 .erp-field--web,
    .app-shell .erp-form-v2 .erp-field--name,
    .app-shell .erp-form-v2 .erp-field--address,
    .app-shell .erp-form-v2 .erp-field--warehouse,
    .app-shell .erp-form-v2 .erp-field--detail {
        width: 100%;
        max-width: 100%;
    }
}
