/* Refined balance: peer-group page surroundings only.
   GLOBAL stylesheet. Keep the existing peer-grid and peer-status styles.
   Intentionally NOT .ff-refined: avoid older generic descendant styles
   reaching the grid. No grid, row, cell, status or diagnostic overrides. */
.ff-peer-page {
    --ff-peer-text: #203c40;
    --ff-peer-muted: #607579;
    --ff-peer-border: #dfe8e5;
    --ff-peer-panel: #fafbfc;
    --ff-peer-accent: #236f70;
    width: 100%;
    min-width: 0;
    min-height: 60vh;
    position: relative;
    padding: clamp(16px, 2vw, 28px);
    border: 1px solid var(--ff-peer-border);
    border-radius: 12px;
    background: #fff;
    box-sizing: border-box;
    container: ff-peer-page / inline-size;
    /* Do not set inherited typography/color here: the grid keeps app defaults. */
}
/* Reset the existing MAKERY alert tokens at this light surface. The alerts
   themselves retain the design defined in radzen-overrides.css. */
.ff-peer-page > .ff-peer-notices {
    --notice-text: #465264;
    --notice-title: #253241;
    --notice-info: #116471;
    --notice-info-bg: #f5f8f9;
    --notice-warning: #905411;
    --notice-warning-bg: #fff7eb;
    --notice-danger: #a93650;
    --notice-danger-bg: #fff1f4;
    --notice-success: #276d47;
    --notice-success-bg: #eff7f2;
    --notice-focus: #116471;
    margin-bottom: 23px;
}
.ff-peer-page > .ff-peer-top {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: stretch;
    gap: 24px;
    min-width: 0;
    margin-bottom: 26px;
    color: var(--ff-peer-text);
    font-size: 13px;
    line-height: 1.6;
}
.ff-peer-top .ff-peer-selection,
.ff-peer-top .ff-peer-parameters {
    display: flex;
    flex-direction: column;
    align-self: stretch;
    width: 100%;
    min-width: 0;
    padding: 22px;
    border: 1px solid var(--ff-peer-border);
    border-radius: 8px;
    box-sizing: border-box;
}
.ff-peer-top .ff-peer-selection { background: var(--ff-peer-panel); }
.ff-peer-top .ff-peer-parameters {
    background: #fff;
    container: ff-peer-parameters / inline-size;
}
.ff-peer-top .ff-peer-panel-heading {
    display: flex;
    align-items: center;
    gap: 9px;
    margin: 0 0 8px;
}
.ff-peer-top .ff-peer-panel-heading h3 {
    margin: 0;
    color: var(--ff-peer-text);
    font-size: 14px;
    font-weight: 600;
    line-height: 1.6;
}
.ff-peer-top .ff-peer-section-number {
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    width: 23px;
    height: 23px;
    border: 1px solid #ccdfd2;
    border-radius: 4px;
    font-size: 10px;
    font-variant-numeric: tabular-nums;
    color: #557566;
    box-sizing: border-box;
}
.ff-peer-top .ff-peer-help,
.ff-peer-description-heading .ff-peer-help {
    margin: 0 0 20px;
    color: var(--ff-peer-muted);
    font-size: 12px;
    line-height: 1.8;
}
.ff-peer-top .ff-peer-search-field { width: 100%; min-width: 0; }
.ff-peer-top .ff-peer-search.rz-button {
    justify-content: flex-start;
    color: var(--ff-peer-text);
    background: #fff;
    font-size: 13px;
    text-transform: none;
    letter-spacing: normal;
}
.ff-peer-top .ff-peer-search.rz-button:hover { background: #eaf2ef; }
.ff-peer-top .ff-peer-tools {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    gap: 8px;
    margin-top: 14px;
}
.ff-peer-top .ff-peer-tools > .rz-button {
    height: auto;
    min-height: 35px;
    max-width: 100%;
    padding: 8px 10px;
    border: 1px solid #cbdcd7;
    border-radius: 5px;
    background: transparent;
    color: #28565a;
    box-shadow: none;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.4;
    letter-spacing: normal;
    text-transform: none;
}
.ff-peer-top .ff-peer-tools > .rz-button:hover:not(:disabled) {
    background: #e5eeea;
    border-color: #adc8c0;
}
.ff-peer-top .ff-peer-tools > .rz-button:disabled { opacity: .55; cursor: not-allowed; }
.ff-peer-top .ff-peer-tools .rz-button-text {
    white-space: normal;
    overflow-wrap: anywhere;
}
.ff-peer-top .ff-peer-panel-note {
    margin: auto 0 0;
    padding-top: 18px;
    color: var(--ff-peer-muted);
    font-size: 11px;
    line-height: 1.6;
}
.ff-peer-top .ff-peer-panel-note strong { font-weight: 600; }
.ff-peer-top .ff-peer-parameter-fields {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
    gap: 20px 16px;
    width: 100%;
    min-width: 0;
}
.ff-peer-top .ff-peer-field-cell {
    display: flex;
    flex-direction: column;
    gap: 7px;
    min-width: 0;
    width: 100%;
}
.ff-peer-top .ff-peer-field,
.ff-peer-method .ff-peer-field {
    display: block;
    width: 100% !important;
    max-width: 100%;
    min-width: 0;
    margin: 0;
    font-size: 13px;
    /* Leave the original inline task/guidance shadow intact. */
}
.ff-peer-top .ff-peer-field .rz-form-field-content,
.ff-peer-method .ff-peer-field .rz-form-field-content { min-width: 0; width: 100%; }
.ff-peer-top .ff-peer-field .rz-form-field-label,
.ff-peer-method .ff-peer-field .rz-form-field-label {
    max-width: 100%;
    white-space: normal;
    overflow-wrap: anywhere;
    overflow: visible;
    text-overflow: clip;
    font-size: 11px;
    line-height: 1.5;
    color: var(--ff-peer-muted);
}
.ff-peer-top .ff-peer-field .rz-numeric,
.ff-peer-top .ff-peer-field .rz-datepicker,
.ff-peer-method .ff-peer-field .rz-dropdown {
    width: 100% !important;
    max-width: 100%;
    min-width: 0;
    flex: 1 1 0%;
}
.ff-peer-parameters .ff-peer-override {
    display: block;
    color: #976131;
    font-style: normal;
    font-size: 11px;
    line-height: 1.6;
    white-space: normal;
    overflow-wrap: anywhere;
}
/* Only the section frame and sibling toolbar are styled, NOT the grid. */
.ff-peer-page > .ff-peer-table-section {
    min-width: 0;
    border-top: 1px solid var(--ff-peer-border);
    padding-top: 22px;
}
.ff-peer-table-section > .ff-peer-table-toolbar {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 18px 24px;
    margin-bottom: 18px;
    color: var(--ff-peer-text);
    font-size: 13px;
    line-height: 1.6;
}
.ff-peer-table-toolbar .ff-peer-table-caption h3 {
    margin: 0 0 5px;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.6;
    color: var(--ff-peer-text);
}
.ff-peer-table-toolbar .ff-peer-table-caption p {
    margin: 0;
    font-size: 11px;
    color: var(--ff-peer-muted);
    line-height: 1.6;
}
.ff-peer-table-toolbar .ff-peer-method {
    width: 300px;
    max-width: 100%;
    min-width: 0;
}
.ff-peer-table-section > .ff-peer-empty {
    border: 1px dashed #d3dfda;
    border-radius: 6px;
    background: #fafcfb;
    padding: 48px 24px;
    text-align: center;
    color: var(--ff-peer-text);
}
.ff-peer-empty > .rz-icon { color: #68908a; font-size: 29px; }
.ff-peer-empty > h3 { margin: 13px 0 6px; font-size: 16px; font-weight: 500; line-height: 1.6; }
.ff-peer-empty > p { margin: 0 auto; max-width: 450px; font-size: 12px; line-height: 1.8; color: var(--ff-peer-muted); }
.ff-peer-page > .ff-peer-description {
    margin-top: 26px;
    border: 1px solid var(--ff-peer-border);
    border-radius: 8px;
    background: #fff;
    min-width: 0;
}
.ff-peer-description > .ff-peer-description-heading {
    padding: 20px 22px;
    border-bottom: 1px solid var(--ff-peer-border);
}
.ff-peer-description-heading .ff-peer-eyebrow {
    margin: 0 0 9px;
    color: var(--ff-peer-muted);
    font-size: 10px;
    font-weight: 600;
    letter-spacing: .11em;
    text-transform: uppercase;
    line-height: 1.6;
}
.ff-peer-description-heading h3 { margin: 0 0 6px; font-size: 16px; font-weight: 600; color: var(--ff-peer-text); line-height: 1.6; }
.ff-peer-description-heading .ff-peer-help { margin: 0; }
.ff-peer-description > .ff-peer-description-host {
    display: flex;
    flex-direction: column;
    min-height: 400px;
    min-width: 0;
    /* Reuses the existing AiDescriptionEditor + refined-setup.css. */
}
/* Focus styling excludes the untouched grid. */
.ff-peer-top :focus-visible,
.ff-peer-table-toolbar :focus-visible {
    outline: 2px solid #946348;
    outline-offset: 3px;
}
@container ff-peer-page (min-width: 1000px) {
    .ff-peer-page > .ff-peer-top--split { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@container ff-peer-parameters (min-width: 360px) {
    .ff-peer-parameters .ff-peer-parameter-fields--two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@container ff-peer-parameters (min-width: 500px) {
    .ff-peer-parameters .ff-peer-parameter-fields:not(.ff-peer-parameter-fields--two) { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 650px) {
    .ff-peer-page { padding: 18px 14px; border-radius: 8px; }
    .ff-peer-top .ff-peer-selection,
    .ff-peer-top .ff-peer-parameters { padding: 18px; }
    .ff-peer-top .ff-peer-tools { flex-direction: column; }
    .ff-peer-table-section > .ff-peer-table-toolbar { flex-direction: column; align-items: stretch; }
    .ff-peer-table-toolbar .ff-peer-method { width: 100%; }
    .ff-peer-description > .ff-peer-description-heading { padding: 18px; }
}
