/* ref #4478, #4582, #4591, #4619: product visual workbench — Match all/any groups, condition rows,
   restyled natives. GLOBAL (linked from App.razor), NOT a scoped .razor.css. The visual editor is
   rendered by the recursive EvStudyQueryVisualNodeEditor component, which is a DIFFERENT component from
   EvStudyCriteriaBuilder; Blazor scoped CSS only tags the owning component's own markup, so these
   rules must be global to reach the node editor's elements at every depth. Chip COLORS still come
   only from study-query-chips.css (Lane 0). Do not redefine .sq-chip colors here. */
.study-query-builder { display: flex; flex-direction: column; gap: .75rem; min-width: 0; }
.study-query-builder__notice { border-left: 3px solid var(--rz-warning); color: var(--rz-text-secondary-color); padding: .6rem .75rem; }
.study-query-builder__node { min-width: 0; }

/* ---- boolean group (compact header + rail) ------------------------------ */
/* The group keeps its .sq-rail--and/or colored LEFT border (do not zero it) and indents its contents,
   so nested AND/OR groups visibly step in under their own colored rail. */
.study-query-builder__group {
    margin: .1rem 0;
    min-width: 0;
    padding: .4rem .1rem .35rem .85rem;
}

/* ---- criterion cards ---------------------------------------------------- */
.study-query-builder__row.study-query-builder__card {
    align-items: stretch;
    background: var(--rz-base-100, #fff);
    border: 1px solid var(--rz-base-300, #ddd);
    border-radius: .5rem;
    display: flex;
    flex-direction: column;
    gap: .55rem;
    grid-template-columns: none;
    min-width: 0;
    padding: .65rem .75rem .7rem;
}
.study-query-builder__card-grid {
    align-items: start;
    display: grid;
    gap: .55rem .65rem;
    /* Auto-fit so Field/Operator/Value fit the (often narrow) dialog pane and wrap instead of overflowing. */
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 8.5rem), 1fr));
    min-width: 0;
}
.study-query-builder__control,
.study-query-builder__values,
.study-query-builder__value-cell { min-width: 0; }
.study-query-builder label,
.study-query-builder__value-label {
    color: var(--rz-text-secondary-color, #666);
    display: block;
    font-size: .78rem;
    font-weight: 600;
    letter-spacing: .01em;
    margin-bottom: .28rem;
}
.study-query-builder__values { display: grid; gap: .4rem; }
.study-query-builder__between { display: grid; gap: .45rem; grid-template-columns: 1fr 1fr; }
.study-query-builder__in-list { display: flex; flex-direction: column; gap: .4rem; }
.study-query-builder__in-value {
    align-items: end;
    display: grid;
    gap: .35rem;
    grid-template-columns: minmax(8rem, 1fr) auto;
}
.study-query-builder__value-cell { display: flex; flex-direction: column; min-width: 0; }

/* ---- native select/input restyle ---------------------------------------- */
.study-query-builder__select,
.study-query-builder__input {
    background-color: var(--rz-base-100, #fff);
    border: 1px solid var(--rz-base-300, #ddd);
    border-radius: .35rem;
    box-sizing: border-box;
    color: var(--rz-text-color, #1b1b1b);
    font-size: .875rem;
    line-height: 1.3;
    min-height: 2.35rem;
    padding: .4rem .65rem;
    width: 100%;
}
.study-query-builder__select {
    appearance: none;
    -webkit-appearance: none;
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23666' d='M1.4.6 6 5.2 10.6.6 12 2 6 8 0 2z'/%3E%3C/svg%3E");
    background-position: right .65rem center;
    background-repeat: no-repeat;
    background-size: .7rem;
    padding-right: 1.85rem;
}
.study-query-builder__select:disabled,
.study-query-builder__input:disabled {
    cursor: not-allowed;
    opacity: .65;
}
.study-query-builder__select:focus,
.study-query-builder__input:focus {
    border-color: var(--rz-primary);
    outline: none;
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--rz-primary) 25%, transparent);
}
/* Number inputs: avoid tiny spinner chrome mismatching text width. */
.study-query-builder__input[type="number"] {
    -moz-appearance: textfield;
    appearance: textfield;
}
.study-query-builder__input[type="number"]::-webkit-outer-spin-button,
.study-query-builder__input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Radzen field/item pickers align with native control height (global: no ::deep needed). */
.study-query-builder .study-query-builder__rz-dropdown,
.study-query-builder .rz-dropdown {
    min-height: 2.35rem;
    width: 100%;
}
.study-query-builder .rz-dropdown {
    border-radius: .35rem;
}

/* ---- Match all/any group header ----------------------------------------- */
.study-query-builder__group-head {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: .35rem;
    margin-bottom: .5rem;
}
.study-query-builder__group-head-text {
    color: var(--rz-text-secondary-color, #666);
    font-size: .82rem;
    font-weight: 600;
}
.study-query-builder__match-select {
    font-weight: 600;
    min-height: 2rem;
    padding-block: .25rem;
    width: auto;
}

/* ---- condition row: [ field / op / value … ]  ✕ ------------------------- */
.study-query-builder__child {
    align-items: start;
    display: flex;
    gap: .4rem;
    min-width: 0;
}
.study-query-builder__child-body { flex: 1 1 auto; min-width: 0; }
.study-query-builder__remove-x {
    align-items: center;
    background: transparent;
    border: 1px solid transparent;
    border-radius: .35rem;
    color: var(--rz-text-secondary-color, #666);
    cursor: pointer;
    display: inline-flex;
    flex-shrink: 0;
    font-size: 1rem;
    height: 2rem;
    justify-content: center;
    line-height: 1;
    margin-top: .1rem;
    width: 2rem;
}
.study-query-builder__remove-x:hover:not(:disabled) {
    background: color-mix(in srgb, var(--rz-danger) 12%, transparent);
    border-color: color-mix(in srgb, var(--rz-danger) 35%, transparent);
    color: var(--rz-danger);
}
.study-query-builder__remove-x:disabled { opacity: .3; cursor: not-allowed; }
/* A nested group stacks: its own ✕ sits at the end, not beside the whole sub-group. */
.study-query-builder__child--group { flex-direction: column; }
.study-query-builder__child--group > .study-query-builder__remove-x { align-self: flex-end; margin-top: .35rem; }

.study-query-builder__group-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .45rem;
    padding-top: .55rem;
}
.study-query-builder__validation { color: var(--rz-danger); font-size: .82rem; margin-top: .25rem; }
.study-query-builder__not {
    border-left: 3px solid var(--sq-not, var(--rz-danger));
    display: grid;
    gap: .45rem;
    padding-left: .7rem;
}
.study-query-builder :focus-visible { outline: 2px solid var(--rz-primary); outline-offset: 2px; }

@media (max-width: 760px) {
    .study-query-builder__card-grid { grid-template-columns: 1fr; }
    .study-query-builder__between { grid-template-columns: 1fr; }
    .study-query-builder__remove {
        justify-self: start;
    }
}

@media (prefers-reduced-motion: reduce) {
    .study-query-builder { transition: none; }
}

@media (prefers-contrast: more) {
    .study-query-builder__not { border-left-width: 4px; }
    .study-query-builder__row.study-query-builder__card {
        border-width: 2px;
    }
    .study-query-builder__select,
    .study-query-builder__input {
        border-width: 2px;
    }
}