/* button control input group with 2 elements */
.pf-v5-c-input-group:has(> :last-child:nth-child(2)) {
    & .pf-v5-c-button.pf-m-control:after {
        border: var(--groupui-sys-border-width-s) var(--groupui-sys-stroke-style-primary) var(--groupui-sys-color-action-muted-default);
        border-radius: 0 var(--groupui-sys-border-radius-s) var(--groupui-sys-border-radius-s) 0;
    }
    /* input group */
    & .pf-v5-c-input-group__item:not(:last-child) > .pf-v5-c-form-control {
        z-index: 1;
        border-radius: var(--groupui-sys-border-radius-s) 0 0 var(--groupui-sys-border-radius-s);
    }
    .pf-v5-c-button.pf-m-control:hover:after {
        border: var(--groupui-sys-border-width-s) var(--groupui-sys-stroke-style-primary) var(--groupui-sys-color-action-basic-default);
        background-color: var(--groupui-sys-color-action-subtle-hover);
    }
    .pf-v5-c-button.pf-m-control:hover {
        z-index: 1;
    }
    .pf-v5-c-button.pf-m-control {
        border-radius: 0 var(--groupui-sys-border-radius-s) var(--groupui-sys-border-radius-s) 0;
        background-color: unset;
    }
    input {
        border-radius: var(--groupui-sys-border-radius-s) 0 0 var(--groupui-sys-border-radius-s);
    }
}
:where(.pf-v5-theme-dark) .pf-v5-c-input-group>*+* {
    border-inline-start: 0;
}

/* button control input group with 3 elements */
.pf-v5-c-input-group:has(> :last-child:nth-child(3)) {
    & .pf-v5-c-input-group__item:first-child > .pf-v5-c-button.pf-m-control:after {
        border: var(--groupui-sys-border-width-s) var(--groupui-sys-stroke-style-primary) var(--groupui-sys-color-action-muted-default);
        border-radius: var(--groupui-sys-border-radius-s) 0 0 var(--groupui-sys-border-radius-s);
    }
    & .pf-v5-c-button.pf-m-control {
        border-radius: 0 var(--groupui-sys-border-radius-s) var(--groupui-sys-border-radius-s) 0;
    }
    & .pf-v5-c-input-group__item:nth-child(2)  > .pf-v5-c-form-control {
        z-index: 1;
        border-radius: 0;
    }
    /* input group */
    & .pf-v5-c-input-group__item:nth-child(3) > .pf-v5-c-button.pf-m-control:after {
        border: var(--groupui-sys-border-width-s) var(--groupui-sys-stroke-style-primary) var(--groupui-sys-color-action-muted-default);
        border-radius: 0 var(--groupui-sys-border-radius-s) var(--groupui-sys-border-radius-s) 0;
    }
    .pf-v5-c-button.pf-m-control:hover:after {
        border-color: var(--groupui-sys-color-action-basic-default);
    }
    input {
        border-radius: var(--groupui-sys-border-radius-s) 0 0 var(--groupui-sys-border-radius-s);
    }
}
button.pf-m-control:focus {
    outline: initial;
}
input::-ms-reveal {
    /* https://stackoverflow.com/questions/61449079/how-to-hide-the-eye-from-a-password-input-in-ms-edge-and-ie */
    display: none;
}
/* input field */
input:focus-within {
    outline: var(--groupui-sys-border-width-s) var(--groupui-sys-stroke-style-primary) var(--groupui-sys-color-action-basic-default);
    border-color: var(--groupui-sys-color-action-basic-default);
}
.pf-m-error > input:focus-within {
    outline: var(--groupui-sys-border-width-s) var(--groupui-sys-stroke-style-primary) var(--groupui-sys-color-danger-basic-default);
}
.pf-m-warning > input:focus-within {
    outline: var(--groupui-sys-border-width-s) var(--groupui-sys-stroke-style-primary) var(--groupui-sys-color-warning-basic-default);
}
.pf-v5-c-form-control  {
    --pf-v5-c-form-control--before--BorderTopWidth: 0;
    --pf-v5-c-form-control--before--BorderRightWidth: 0;
    --pf-v5-c-form-control--before--BorderBottomWidth: 0;
    --pf-v5-c-form-control--before--BorderLeftWidth: 0;
    --pf-v5-c-form-control--after--BorderBottomWidth: 0 !important;
    border: var(--groupui-sys-border-width-s) var(--groupui-sys-stroke-style-primary) var(--groupui-sys-color-action-muted-default);
    border-radius: var(--groupui-sys-border-radius-s);
    background-color: var(--groupui-sys-color-action-silent-default);
}
.pf-v5-c-form-control:not([disabled]):where(:has(input:focus), .focused) {
    border-color: var(--groupui-sys-color-action-basic-default);
    box-shadow: 0 0 0 var(--groupui-sys-border-width-s) var(--groupui-sys-color-action-basic-default);
}
.pf-v5-c-form-control:focus-within {
    --pf-v5-c-form-control--after--BorderBottomWidth: 0;
}
/* start g-input copy */
.pf-v5-c-form-control input.pf-m-disabled:hover, .pf-v5-c-form-control input[disabled]:hover {
    cursor: not-allowed;
}
.pf-v5-c-form-control .pf-m-readonly, .pf-v5-c-form-control input[readonly] {
    border-color: var(--groupui-sys-color-action-basic-disabled);
    background-color: var(--groupui-sys-color-background-canvas);
}
.pf-v5-c-form-control input::placeholder {
    color: var(--groupui-sys-color-text-weakest);
    opacity: 1;
}
.pf-v5-c-form-control:hover {
    border-color: var(--groupui-sys-color-action-basic-default);
}
.pf-v5-c-form-control:focus-within {
    outline: var(--groupui-sys-border-width-s) var(--groupui-sys-stroke-style-primary) var(--groupui-sys-color-action-basic-default);
    border-color: var(--groupui-sys-color-action-basic-default);
}
.pf-v5-c-form-control.pf-m-readonly {
    border-color: var(--groupui-sys-color-action-basic-disabled);
    background-color: var(--groupui-sys-color-background-canvas);
}
.pf-v5-c-form-control.pf-m-success {
    border-color: var(--groupui-sys-color-success-basic-default);
}
.pf-v5-c-form-control.pf-m-success:hover {
    border-color: var(--groupui-sys-color-success-basic-hover);
}
.pf-v5-c-form-control.pf-m-success:focus-within {
    outline: var(--groupui-sys-border-width-s) var(--groupui-sys-stroke-style-primary) var(--groupui-sys-color-success-basic-default);
    border-color: var(--groupui-sys-color-success-basic-default);
}
.pf-v5-c-form-control.pf-m-error {
    border-color: var(--groupui-sys-color-danger-basic-default);
}
.pf-v5-c-form-control.pf-m-error:not([disabled]):where(:has(input:focus), .focused) {
    box-shadow: 0 0 0 var(--groupui-sys-border-width-s) var(--groupui-sys-color-danger-basic-default);
}
.pf-v5-c-form-control.pf-m-error:hover {
    border-color: var(--groupui-sys-color-danger-basic-hover);
}
.pf-v5-c-form-control.pf-m-error:focus-within {
    outline: var(--groupui-sys-border-width-s) var(--groupui-sys-stroke-style-primary) var(--groupui-sys-color-danger-basic-default);
    border-color: var(--groupui-sys-color-danger-basic-default);
}
.pf-v5-c-form-control.pf-m-warning {
    border-color: var(--groupui-sys-color-warning-basic-default);
}
.pf-v5-c-form-control.pf-m-warning:hover {
    border-color: var(--groupui-sys-color-warning-basic-hover);
}
.pf-v5-c-form-control.pf-m-warning:focus-within {
    outline: var(--groupui-sys-border-width-s) var(--groupui-sys-stroke-style-primary) var(--groupui-sys-color-warning-basic-default);
    border-color: var(--groupui-sys-color-warning-basic-default);
}
.pf-v5-c-form-control.pf-m-disabled {
    border-color: var(--groupui-sys-color-action-basic-disabled);
    background-color: var(--groupui-sys-color-action-silent-disabled);
}
.pf-v5-c-form-control.pf-m-disabled:hover {
    cursor: not-allowed;
    border-color: var(--groupui-sys-color-action-basic-disabled);
}
.pf-v5-c-form-control.pf-m-disabled:focus {
    outline: none;
    box-shadow: none;
}
input, textarea{
    outline: none !important;
    border-radius: var(--groupui-sys-border-radius-s)
}
