/* Galgo Field Renderers v1: dense document-fit primitives, no card/footer/gutter. */
:root {
    --gfr-ink: #172033;
    --gfr-ink: oklch(0.25 0.025 260);
    --gfr-muted: #607086;
    --gfr-muted: oklch(0.53 0.03 252);
    --gfr-line: #d4deea;
    --gfr-line: oklch(0.88 0.018 250);
    --gfr-surface-soft: #f4f7fb;
    --gfr-surface-soft: oklch(0.97 0.008 250);
    --gfr-primary: #155fad;
    --gfr-primary: oklch(0.49 0.15 252);
    --gfr-primary-strong: #0d4785;
    --gfr-primary-strong: oklch(0.39 0.13 252);
    --gfr-primary-soft: #e9f2fc;
    --gfr-primary-soft: oklch(0.95 0.025 250);
    --gfr-info: #176aa2;
    --gfr-info: oklch(0.51 0.11 238);
    --gfr-info-soft: #e8f4fb;
    --gfr-info-soft: oklch(0.96 0.025 230);
    --gfr-success: #28733a;
    --gfr-success: oklch(0.5 0.12 145);
    --gfr-success-soft: #eaf5ed;
    --gfr-success-soft: oklch(0.96 0.025 145);
    --gfr-warning: #9b5b08;
    --gfr-warning: oklch(0.52 0.12 70);
    --gfr-warning-soft: #fff5df;
    --gfr-warning-soft: oklch(0.97 0.035 82);
    --gfr-danger: #b52b31;
    --gfr-danger: oklch(0.5 0.16 25);
    --gfr-danger-soft: #fdecee;
    --gfr-danger-soft: oklch(0.96 0.026 20);
    --gfr-neutral: #526176;
    --gfr-neutral: oklch(0.49 0.03 255);
    --gfr-focus: #2f7dcc;
    --gfr-focus: oklch(0.58 0.14 250);
    --gfr-radius-sm: 6px;
}

.galgo-field-renderer-host {
    min-width: 0;
    width: 100%;
    margin: 0;
    padding: 0;
    container-type: inline-size;
}

.galgo-field-renderer,
.galgo-field-renderer * {
    box-sizing: border-box;
}

.galgo-field-renderer {
    --gfr-tone: var(--gfr-neutral);
    --gfr-tone-soft: var(--gfr-surface-soft);
    min-width: 0;
    max-width: 100%;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--gfr-ink);
    font-family: Poppins, Muli, Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
    font-size: 14px;
    line-height: 1.42;
    text-align: start;
    vertical-align: middle;
}

.gfr--cell {
    font-size: 13px;
    line-height: 1.35;
}

.gfr--mini {
    font-size: 13px;
}

.gfr-tone--info {
    --gfr-tone: var(--gfr-info);
    --gfr-tone-soft: var(--gfr-info-soft);
}

.gfr-tone--success {
    --gfr-tone: var(--gfr-success);
    --gfr-tone-soft: var(--gfr-success-soft);
}

.gfr-tone--warning {
    --gfr-tone: var(--gfr-warning);
    --gfr-tone-soft: var(--gfr-warning-soft);
}

.gfr-tone--danger {
    --gfr-tone: var(--gfr-danger);
    --gfr-tone-soft: var(--gfr-danger-soft);
}

.gfr-tone--neutral {
    --gfr-tone: var(--gfr-neutral);
    --gfr-tone-soft: var(--gfr-surface-soft);
}

.gfr-icon {
    display: inline-flex;
    width: 1.05em;
    height: 1.05em;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    color: currentColor;
    line-height: 1;
}

.gfr-icon svg {
    display: block;
    width: 100%;
    height: 100%;
    fill: currentColor;
}

.gfr-weight--regular {
    font-weight: 400;
}

.gfr-weight--medium {
    font-weight: 600;
}

.gfr-weight--strong {
    font-weight: 700;
}

.gfr--text:not(.gfr-tone--neutral) {
    color: var(--gfr-tone);
}

.gfr-text--multiline {
    display: inline;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

.gfr-text--clamped {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: var(--gfr-clamp-lines, 2);
}

.gfr--number,
.gfr-kpi__measure,
.gfr-progress__value,
.gfr-sparkline__last {
    font-variant-numeric: tabular-nums lining-nums;
}

.gfr--number {
    display: inline-flex;
    align-items: baseline;
    gap: .3em;
    color: var(--gfr-tone);
}

.gfr-number__value {
    color: var(--gfr-ink);
    font-weight: 650;
}

.gfr-number__affix,
.gfr-number__unit {
    color: var(--gfr-muted);
    font-size: .88em;
    font-weight: 550;
}

.gfr-status,
.gfr-boolean {
    display: inline-flex;
    min-height: 26px;
    max-width: 100%;
    align-items: center;
    gap: 6px;
    padding: 3px 9px;
    border: 1px solid color-mix(in oklch, var(--gfr-tone) 28%, transparent);
    border-radius: 999px;
    background: var(--gfr-tone-soft);
    color: var(--gfr-tone);
    font-size: .88em;
    font-weight: 700;
    line-height: 1.2;
}

@supports not (color: color-mix(in oklch, red, blue)) {
    .gfr-status,
    .gfr-boolean {
        border-color: var(--gfr-line);
    }
}

.gfr-status__label,
.gfr-boolean > span:last-child {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.gfr-icon-only {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--gfr-tone);
}

.gfr-icon-only--sm {
    font-size: 14px;
}

.gfr-icon-only--md {
    font-size: 18px;
}

.gfr-icon-only--lg {
    font-size: 22px;
}

.gfr-symbol {
    display: inline-flex;
    min-width: 1em;
    align-items: center;
    justify-content: center;
    color: var(--gfr-tone);
    font-family: Poppins, Muli, Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
    font-variant-numeric: tabular-nums;
    line-height: 1;
}

.gfr-symbol--sm {
    font-size: 14px;
}

.gfr-symbol--md {
    font-size: 18px;
}

.gfr-symbol--lg {
    font-size: 20px;
}

.gfr-symbol--regular {
    font-weight: 400;
}

.gfr-symbol--medium {
    font-weight: 600;
}

.gfr-symbol--strong {
    font-weight: 800;
}

.gfr-progress {
    display: inline-grid;
    width: min(100%, 360px);
    min-width: 110px;
    grid-template-columns: minmax(72px, 1fr) auto;
    align-items: center;
    gap: 8px;
}

.gfr-progress__track {
    display: block;
    height: 8px;
    overflow: hidden;
    border-radius: 999px;
    background: var(--gfr-line);
}

.gfr-progress__fill {
    display: block;
    width: var(--gfr-progress, 0%);
    height: 100%;
    border-radius: inherit;
    background: var(--gfr-tone);
    transition: width 180ms cubic-bezier(.22, 1, .36, 1);
}

.gfr-progress__value {
    min-width: 4ch;
    color: var(--gfr-ink);
    font-size: .88em;
    font-weight: 700;
    text-align: end;
}

.gfr-action {
    appearance: none;
    display: inline-flex;
    min-width: 0;
    min-height: 28px;
    max-width: 100%;
    align-items: center;
    justify-content: flex-start;
    gap: 6px;
    margin: 0;
    padding: 3px 0;
    border: 0;
    border-radius: var(--gfr-radius-sm);
    background: transparent;
    color: var(--gfr-primary-strong);
    font: inherit;
    font-weight: 650;
    line-height: 1.3;
    text-align: start;
    text-decoration: underline;
    text-decoration-color: color-mix(in oklch, var(--gfr-primary) 35%, transparent);
    text-underline-offset: 3px;
    cursor: pointer;
}

.gfr-action:hover {
    color: var(--gfr-primary);
    text-decoration-color: currentColor;
}

.gfr-action:active {
    transform: translateY(1px);
}

.gfr-action:focus-visible {
    outline: 2px solid var(--gfr-focus);
    outline-offset: 2px;
}

.gfr-action:disabled,
.gfr-link--disabled {
    color: var(--gfr-muted);
    cursor: not-allowed;
    text-decoration: none;
}

.gfr-action[data-gfr-action-state="success"] {
    color: var(--gfr-success);
}

.gfr-action[data-gfr-action-state="error"] {
    color: var(--gfr-danger);
}

.gfr-image {
    display: inline-flex;
    width: 100%;
    max-width: none;
    min-height: 0;
    max-height: var(--gfr-image-max-height, 600px);
    overflow: hidden;
    align-items: flex-start;
    justify-content: center;
    border-radius: var(--gfr-radius-sm);
    background: var(--gfr-surface-soft);
}

.gfr--cell.gfr-image {
    width: 72px;
    height: 48px;
    max-height: 48px;
    align-items: center;
}

.gfr-image--square {
    aspect-ratio: 1;
}

.gfr-image--landscape {
    aspect-ratio: 16 / 9;
}

.gfr-image--portrait {
    aspect-ratio: 3 / 4;
}

.gfr-image img {
    display: block;
    width: 100%;
    height: auto;
    max-height: var(--gfr-image-max-height, 600px);
}

.gfr-image:not(.gfr-image--auto) img,
.gfr--cell.gfr-image img {
    height: 100%;
}

.gfr-image--cover img {
    object-fit: cover;
}

.gfr-image--contain img {
    object-fit: contain;
}

.gfr-image__button {
    width: 100%;
    height: auto;
    min-height: inherit;
    padding: 0;
    text-decoration: none;
}

.gfr-image:not(.gfr-image--auto) .gfr-image__button,
.gfr--cell.gfr-image .gfr-image__button {
    height: 100%;
}

.gfr-image--fallback {
    gap: 6px;
    padding: 7px 9px;
    color: var(--gfr-muted);
    font-size: .82em;
}

.gfr-kpi {
    display: inline-flex;
    min-width: 0;
    max-width: 100%;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 3px 9px;
    color: var(--gfr-tone);
}

.gfr-kpi__label {
    flex: 1 0 100%;
    color: var(--gfr-muted);
    font-size: .78em;
    font-weight: 650;
    letter-spacing: .015em;
    line-height: 1.2;
}

.gfr-kpi__measure {
    display: inline-flex;
    min-width: 0;
    align-items: baseline;
    gap: .25em;
}

.gfr-kpi__value {
    overflow: hidden;
    color: var(--gfr-ink);
    font-size: 1.2em;
    font-weight: 750;
    letter-spacing: -.018em;
    line-height: 1.15;
    text-overflow: ellipsis;
}

.gfr-kpi__unit,
.gfr-kpi__affix {
    color: var(--gfr-muted);
    font-size: .82em;
    font-weight: 600;
}

.gfr-kpi__trend {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    font-size: .78em;
    font-weight: 700;
}

.gfr-kpi__trend--up {
    color: var(--gfr-success);
}

.gfr-kpi__trend--down {
    color: var(--gfr-danger);
}

.gfr-kpi__trend--flat {
    color: var(--gfr-muted);
}

.gfr-conditional {
    display: inline;
}

.gfr-conditional > .gfr {
    font: inherit;
}

.gfr-sparkline {
    display: inline-flex;
    width: min(100%, 180px);
    min-width: 88px;
    align-items: center;
    gap: 7px;
    color: var(--gfr-tone);
}

.gfr-sparkline svg {
    display: block;
    width: 100%;
    height: 30px;
    overflow: visible;
}

.gfr-sparkline polyline {
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 2;
    vector-effect: non-scaling-stroke;
}

.gfr-sparkline rect {
    fill: currentColor;
    opacity: .82;
}

.gfr-sparkline__area {
    fill: currentColor;
    opacity: .13;
}

.gfr-sparkline__last {
    flex: 0 0 auto;
    color: var(--gfr-ink);
    font-size: .82em;
    font-weight: 700;
}

.gfr--error {
    display: inline-flex;
    min-height: 26px;
    align-items: center;
    padding: 3px 8px;
    border: 1px solid var(--gfr-line);
    border-radius: var(--gfr-radius-sm);
    background: var(--gfr-danger-soft);
    color: var(--gfr-danger);
    font-size: 12px;
    font-weight: 650;
}

@container (max-width: 300px) {
    .gfr-progress {
        grid-template-columns: minmax(58px, 1fr) auto;
    }

    .gfr-kpi__label {
        white-space: normal;
    }
}

@media (max-width: 560px) {
    .galgo-field-renderer {
        font-size: 14px;
    }

    .gfr--cell,
    .gfr--mini {
        font-size: 13px;
    }

    .gfr-image {
        max-width: 100%;
    }

    .gfr-action {
        min-height: 36px;
    }
}

@media (forced-colors: active) {
    .gfr-status,
    .gfr-boolean,
    .gfr--error,
    .gfr-progress__track {
        border: 1px solid CanvasText;
    }

    .gfr-progress__fill {
        background: Highlight;
    }
}

@media (prefers-reduced-motion: reduce) {
    .gfr-progress__fill,
    .gfr-action {
        transition: none;
    }

    .gfr-action:active {
        transform: none;
    }
}

@media print {
    .galgo-field-renderer {
        color: #182133;
        font-size: 10pt;
        break-inside: avoid;
        print-color-adjust: exact;
        -webkit-print-color-adjust: exact;
    }

    .gfr-action {
        min-height: 0;
        padding: 0;
        color: #182133;
        text-decoration: none;
    }

    .gfr-action .gfr-icon {
        display: none;
    }

    .gfr-image {
        max-height: 38mm;
    }

    .gfr-image img {
        width: 100%;
        height: auto;
        max-height: 38mm;
        object-fit: contain;
    }

    .gfr-image.gfr-image--auto,
    .gfr-image.gfr-image--auto img {
        max-height: none;
    }

    .gfr-progress__fill,
    .gfr-sparkline polyline,
    .gfr-sparkline rect {
        print-color-adjust: exact;
        -webkit-print-color-adjust: exact;
    }
}
