/* /UiV7/UiV7Form.razor.rz.scp.css */
/* CSS for UiV7Form component */
/*.ui-v7-canvas {
    position: relative;
    width: 100%;
    min-height: 270px;
    overflow: auto;
    background: #fafafa;
}*/

.ui-v7-canvas[b-9rwr3auujq] {
    position: relative;
    width: 100%;
    min-height: 0;
    overflow: auto;
    box-sizing: border-box;
    background: #fafafa;
}

.ui-v7-control[b-9rwr3auujq] {
    position: absolute;
    box-sizing: border-box;
}

/* =========================
   LABEL
   ========================= */

.ui-v7-label[b-9rwr3auujq] {
    display: flex;
    align-items: center;
    width: 100%;
    height: var(--ui-h, 32px);
    box-sizing: border-box;
    padding-left: 4px;
    font-family: Arial, sans-serif;
    font-size: 13px;
    font-weight: 600;
    white-space: nowrap;
}

/* =========================
   NATIVE ENTRY
   ========================= */

.ui-v7-entry[b-9rwr3auujq] {
    width: 100%;
    height: var(--ui-h, 32px);
    min-height: var(--ui-h, 32px);
    box-sizing: border-box;
    padding: 2px 7px;
    border: 1px solid #777;
    border-radius: 3px;
    background: white;
    font-family: Arial, sans-serif;
    font-size: 14px;
    outline: none;
}

    .ui-v7-entry:focus[b-9rwr3auujq] {
        border: 2px solid #1976d2;
        padding: 1px 6px;
    }

/* =========================
   MUDSELECT / MUDDATEPICKER
   ========================= */

.ui-v7-control[b-9rwr3auujq]  .ui-v7-mud-input {
    width: 100%;
    height: var(--ui-h, 32px) !important;
    min-height: var(--ui-h, 32px) !important;
}

    .ui-v7-control[b-9rwr3auujq]  .ui-v7-mud-input .mud-input-control {
        width: 100%;
        height: var(--ui-h, 32px) !important;
        min-height: var(--ui-h, 32px) !important;
        margin-top: 0 !important;
    }

    .ui-v7-control[b-9rwr3auujq]
    
    .ui-v7-mud-input
    .mud-input-control-input-container {
        height: var(--ui-h, 32px) !important;
        min-height: var(--ui-h, 32px) !important;
    }

    .ui-v7-control[b-9rwr3auujq]  .ui-v7-mud-input .mud-input {
        height: var(--ui-h, 32px) !important;
        min-height: var(--ui-h, 32px) !important;
        margin-top: 0 !important;
    }

    .ui-v7-control[b-9rwr3auujq]  .ui-v7-mud-input .mud-input-root {
        height: var(--ui-h, 32px) !important;
        min-height: var(--ui-h, 32px) !important;
        box-sizing: border-box !important;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }

    .ui-v7-control[b-9rwr3auujq]
    
    .ui-v7-mud-input
    input.mud-input-root {
        height: var(--ui-h, 32px) !important;
        min-height: var(--ui-h, 32px) !important;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }

    .ui-v7-control[b-9rwr3auujq]  .ui-v7-mud-input .mud-select-input {
        display: flex !important;
        align-items: center !important;
        height: var(--ui-h, 32px) !important;
        min-height: var(--ui-h, 32px) !important;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }

    .ui-v7-control[b-9rwr3auujq]
    
    .ui-v7-mud-input
    .mud-input-adornment {
        height: var(--ui-h, 32px) !important;
        min-height: var(--ui-h, 32px) !important;
        margin-top: 0 !important;
        margin-bottom: 0 !important;
    }

/* =========================
   CHECKBOX
   ========================= */

.ui-v7-control[b-9rwr3auujq]  .ui-v7-check {
    width: 100%;
    height: var(--ui-h, 32px);
    min-height: var(--ui-h, 32px);
    margin-top: -4px;
}

/* =========================
   BUTTON
   ========================= */

.ui-v7-control[b-9rwr3auujq]  .ui-v7-button {
    width: 100%;
    height: var(--ui-h, 36px) !important;
    min-height: var(--ui-h, 36px) !important;
}

/* =========================
   ERROR
   ========================= */

.ui-v7-error[b-9rwr3auujq] {
    width: 100%;
    height: var(--ui-h, 32px);
    padding: 5px;
    box-sizing: border-box;
    color: red;
    border: 1px solid red;
}

/* =========================
   bc(...) BACKGROUND COLOR
   ========================= */

.ui-v7-control.ui-v7-has-bc[b-9rwr3auujq] {
    background-color: var(--ui-bc) !important;
}

    .ui-v7-control.ui-v7-has-bc .ui-v7-label[b-9rwr3auujq],
    .ui-v7-control.ui-v7-has-bc .ui-v7-entry[b-9rwr3auujq] {
        background-color: var(--ui-bc) !important;
    }

    .ui-v7-control.ui-v7-has-bc[b-9rwr3auujq]
    
    .mud-input-control,
    .ui-v7-control.ui-v7-has-bc[b-9rwr3auujq]
    
    .mud-input-control-input-container,
    .ui-v7-control.ui-v7-has-bc[b-9rwr3auujq]
    
    .mud-input,
    .ui-v7-control.ui-v7-has-bc[b-9rwr3auujq]
    
    .mud-input-root,
    .ui-v7-control.ui-v7-has-bc[b-9rwr3auujq]
    
    .mud-select-input {
        background-color: var(--ui-bc) !important;
    }

    .ui-v7-control.ui-v7-has-bc[b-9rwr3auujq]
    
    .ui-v7-button {
        background-color: var(--ui-bc) !important;
    }

/* =========================
   fc(...) TEXT COLOR
   ========================= */

.ui-v7-control.ui-v7-has-fc[b-9rwr3auujq] {
    color: var(--ui-fc) !important;
}

    .ui-v7-control.ui-v7-has-fc .ui-v7-label[b-9rwr3auujq],
    .ui-v7-control.ui-v7-has-fc .ui-v7-entry[b-9rwr3auujq] {
        color: var(--ui-fc) !important;
        -webkit-text-fill-color: var(--ui-fc) !important;
    }

    .ui-v7-control.ui-v7-has-fc[b-9rwr3auujq]
    
    .mud-input-root,
    .ui-v7-control.ui-v7-has-fc[b-9rwr3auujq]
    
    .mud-select-input,
    .ui-v7-control.ui-v7-has-fc[b-9rwr3auujq]
    
    .mud-input-adornment,
    .ui-v7-control.ui-v7-has-fc[b-9rwr3auujq]
    
    .mud-icon-root,
    .ui-v7-control.ui-v7-has-fc[b-9rwr3auujq]
    
    .mud-button-label,
    .ui-v7-control.ui-v7-has-fc[b-9rwr3auujq]
    
    .mud-typography {
        color: var(--ui-fc) !important;
        -webkit-text-fill-color: var(--ui-fc) !important;
    }