/*
 * xApp Light Framework
 * Copyright (c) 2019-2026 LEARNLOGICS SRL (Romania, Reg. No. J19/539/2019, CUI 41303710).
 * All rights reserved. Licensed under the xApp Light Framework License —
 * see the LICENSE file in the framework root. Do not remove this notice.
 */
.gcp-stage1-shell .performance-ink-main:has(> .gcp-reports-page)
{
    max-width: none;
    padding: 0;
}

.gcp-reports-page
{
    background: var(--gcp-color-page-cream);
    color: var(--gcp-color-text-primary);
    max-width: 100%;
    min-height: calc(100vh - var(--gcp-layout-top-bar));
    min-width: 0;
    overflow-x: clip;
    width: 100%;
}

.gcp-reports-layout
{
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, var(--gcp-layout-assistant-panel));
    max-width: 100%;
    min-height: calc(100vh - var(--gcp-layout-top-bar));
    min-width: 0;
    width: 100%;
}

.gcp-reports-layout > *
{
    max-width: 100%;
    min-width: 0;
}

.gcp-reports-content
{
    display: flex;
    flex-direction: column;
    gap: var(--gcp-space-4);
    min-width: 0;
    padding: var(--gcp-layout-content-gutter);
}

.gcp-reports-header
{
    display: grid;
    gap: var(--gcp-space-3);
}

.gcp-reports-back
{
    align-items: center;
    color: var(--gcp-color-blue);
    display: inline-flex;
    font-size: var(--gcp-type-small-size);
    font-weight: var(--gcp-type-section-weight);
    gap: var(--gcp-space-1);
    justify-self: start;
    text-decoration: none;
}

.gcp-reports-back svg
{
    height: 14px;
    width: 14px;
}

.gcp-reports-heading-row
{
    align-items: center;
    display: flex;
    gap: var(--gcp-space-4);
    justify-content: space-between;
}

.gcp-reports-title-row,
.gcp-reports-actions,
.gcp-reports-context
{
    align-items: center;
    display: flex;
    flex-wrap: wrap;
}

.gcp-reports-title-row
{
    gap: var(--gcp-space-1);
}

.gcp-reports-title-row h1
{
    color: var(--gcp-color-text-primary);
    font-family: var(--gcp-font-display);
    font-size: var(--gcp-type-detail-title-size);
    font-variation-settings: "wght" var(--gcp-type-detail-title-weight);
    letter-spacing: var(--gcp-type-detail-title-tracking);
    line-height: var(--gcp-type-detail-title-line);
    margin: 0;
}

.gcp-reports-title-row button
{
    color: var(--gcp-color-text-muted);
    height: var(--gcp-component-button-height);
    width: var(--gcp-component-button-height);
}

.gcp-reports-title-row button.is-active
{
    color: var(--gcp-color-gold-dark);
}

.gcp-reports-actions
{
    gap: var(--gcp-space-2);
}

.gcp-reports-actions button
{
    border-color: var(--gcp-color-border-warm);
    border-radius: var(--gcp-component-button-radius);
    height: var(--gcp-component-button-height);
    padding: 0 var(--gcp-component-button-padding);
}

.gcp-reports-actions button:last-child
{
    background: var(--gcp-color-sidebar-navy);
    color: var(--gcp-color-card-white);
}

.gcp-reports-context
{
    color: var(--gcp-color-text-muted);
    font-size: var(--gcp-type-small-size);
    gap: var(--gcp-space-2) var(--gcp-space-4);
}

.gcp-reports-context > span:not(.gcp-reports-chip)
{
    border-right: 1px solid var(--gcp-color-border-warm);
    padding-right: var(--gcp-space-4);
}

.gcp-reports-chip
{
    align-items: center;
    background: var(--gcp-color-card-white);
    border: 1px solid var(--gcp-color-border-warm);
    border-radius: var(--gcp-radius-round);
    color: var(--gcp-color-text-muted);
    display: inline-flex;
    gap: var(--gcp-space-1);
    min-height: 28px;
    padding: 0 var(--gcp-space-3);
}

.gcp-reports-chip svg
{
    height: 13px;
    width: 13px;
}

.gcp-reports-load-state
{
    background: var(--gcp-color-info-surface);
    border: 1px solid var(--gcp-color-border-cool);
    border-radius: var(--gcp-radius-control);
    color: var(--gcp-color-info);
    font-size: var(--gcp-type-small-size);
    padding: var(--gcp-space-2) var(--gcp-space-3);
}

.gcp-reports-load-state.is-error
{
    background: var(--gcp-color-error-surface);
    color: var(--gcp-color-error);
}

.gcp-reports-filter-strip .gcp-stage1-filter-bar
{
    min-height: var(--gcp-component-tab-height);
    padding: var(--gcp-space-2);
}

.gcp-reports-filter-strip .gcp-stage1-filter-bar__search
{
    display: none;
}

.gcp-reports-filter-strip .gcp-stage1-filter-bar__controls
{
    align-items: end;
    display: grid;
    flex: 1 1 auto;
    grid-template-columns: repeat(4, minmax(112px, 1fr)) auto;
}

.gcp-reports-filter-field
{
    display: grid;
    gap: var(--gcp-space-1);
}

.gcp-reports-filter-field > span
{
    color: var(--gcp-color-text-muted);
    font-size: var(--gcp-type-table-head-size);
    font-variation-settings: "wght" var(--gcp-type-table-head-weight);
    letter-spacing: var(--gcp-type-table-head-tracking);
    line-height: var(--gcp-type-table-head-line);
    text-transform: uppercase;
}

.gcp-reports-filter-field button,
.gcp-reports-filter-strip .gcp-stage1-filter-bar__controls > button
{
    background: var(--gcp-color-card-white);
    border-color: var(--gcp-color-border-cool);
    border-radius: var(--gcp-radius-control);
    height: var(--gcp-component-settings-field-height);
}

.gcp-reports-source-status
{
    background: var(--gcp-color-card-white);
    border: 1px solid var(--gcp-color-border-warm);
    border-radius: var(--gcp-radius-card);
    display: grid;
    gap: var(--gcp-space-2);
    grid-template-columns: repeat(4, minmax(0, 1fr));
    padding: var(--gcp-space-3) var(--gcp-space-4);
}

.gcp-reports-source-status > div
{
    align-items: center;
    color: var(--gcp-color-text-muted);
    display: flex;
    font-size: var(--gcp-type-small-size);
    gap: var(--gcp-space-2);
    justify-content: space-between;
}

.gcp-reports-kpis
{
    background: var(--gcp-color-card-white);
    border: 1px solid var(--gcp-color-border-warm);
    border-radius: var(--gcp-radius-card);
    display: grid;
    gap: 0;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    overflow: hidden;
    box-shadow: var(--gcp-shadow-card);
}

.gcp-reports-kpis .gcp-stage1-stat
{
    border: 0;
    border-radius: 0;
    box-shadow: none;
    min-height: auto;
    min-width: 0;
}

.gcp-reports-kpis .gcp-stage1-stat + .gcp-stage1-stat
{
    border-left: 1px solid var(--gcp-color-border-warm);
}

.gcp-reports-kpis .gcp-stage1-stat__value
{
    font-size: var(--gcp-type-stat-number-size);
    overflow-wrap: anywhere;
}

.gcp-reports-kpis .gcp-stage1-stat.is-success .gcp-stage1-stat__delta
{
    color: var(--gcp-color-success);
}

.gcp-reports-kpis .gcp-stage1-stat.is-error .gcp-stage1-stat__delta
{
    color: var(--gcp-color-error);
}

.gcp-reports-band
{
    display: grid;
    gap: var(--gcp-layout-grid-gap);
}

.gcp-reports-band--primary,
.gcp-reports-band--secondary
{
    grid-template-columns: minmax(0, 7fr) minmax(300px, 5fr);
}

.gcp-reports-chart-card,
.gcp-reports-table-card,
.gcp-reports-device-card
{
    min-width: 0;
}

.gcp-reports-chart-card .gcp-stage1-card__body
{
    padding-top: var(--gcp-space-2);
}

.gcp-reports-card-tools
{
    align-items: center;
    display: flex;
    gap: var(--gcp-space-3);
    justify-content: space-between;
    margin-bottom: var(--gcp-space-1);
    min-height: 30px;
}

.gcp-reports-chart-legend,
.gcp-reports-chart-controls
{
    align-items: center;
    display: flex;
    gap: var(--gcp-space-2);
}

.gcp-reports-chart-legend
{
    color: var(--gcp-color-text-muted);
    flex-wrap: wrap;
    font-size: var(--gcp-type-small-size);
}

.gcp-reports-chart-legend span
{
    align-items: center;
    display: inline-flex;
    gap: var(--gcp-space-1);
}

.gcp-reports-chart-legend i
{
    background: var(--gcp-color-info);
    border-radius: var(--gcp-radius-round);
    height: 2px;
    width: var(--gcp-space-4);
}

.gcp-reports-chart-legend .is-revenue i
{
    background: var(--gcp-color-blue-dark);
}

.gcp-reports-chart-legend .is-roas i
{
    background: repeating-linear-gradient(90deg, var(--gcp-color-gold) 0 var(--gcp-space-1), transparent var(--gcp-space-1) var(--gcp-space-2));
}

.gcp-reports-granularity
{
    border-color: var(--gcp-color-border-warm);
    border-radius: var(--gcp-radius-control);
    height: 30px;
    min-height: 30px;
    min-width: var(--gcp-space-16);
}

.gcp-reports-chart-toggle
{
    display: flex;
}

.gcp-reports-chart-toggle button
{
    align-items: center;
    background: var(--gcp-color-card-white);
    border: 1px solid var(--gcp-color-border-warm);
    color: var(--gcp-color-text-muted);
    display: inline-flex;
    height: 30px;
    justify-content: center;
    width: 30px;
}

.gcp-reports-chart-toggle button:last-child
{
    border-radius: 0 var(--gcp-radius-control) var(--gcp-radius-control) 0;
}

.gcp-reports-chart-toggle button.is-active
{
    background: var(--gcp-color-info-surface);
    color: var(--gcp-color-blue);
}

.gcp-reports-chart-toggle svg
{
    height: 14px;
    width: 14px;
}

.gcp-reports-chart
{
    aspect-ratio: auto;
    height: 280px;
    width: 100%;
}

.gcp-reports-empty
{
    align-items: center;
    color: var(--gcp-color-text-muted);
    display: flex;
    flex-direction: column;
    gap: var(--gcp-space-2);
    height: 280px;
    justify-content: center;
    text-align: center;
}

.gcp-reports-empty strong
{
    color: var(--gcp-color-text-primary);
    font-family: var(--gcp-font-display);
    font-size: var(--gcp-type-stat-number-size);
}

.gcp-reports-table-card .gcp-stage1-card__body
{
    padding: 0;
}

.gcp-reports-table-card .gcp-stage1-table-wrap,
.gcp-reports-table-card .gcp-stage1-table__empty
{
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

.gcp-reports-table-card .gcp-stage1-table td,
.gcp-reports-table-card .gcp-stage1-table th
{
    padding-left: var(--gcp-space-3);
    padding-right: var(--gcp-space-3);
}

.gcp-reports-table-card .gcp-stage1-table tr:last-child td
{
    background: var(--gcp-color-page-cream);
    font-variation-settings: "wght" var(--gcp-type-card-weight);
}

.gcp-reports-channel-name
{
    align-items: center;
    display: flex;
    gap: var(--gcp-space-2);
    min-width: 76px;
}

.gcp-reports-channel-name > span
{
    align-items: center;
    background: var(--gcp-color-info-surface);
    border-radius: var(--gcp-radius-control);
    color: var(--gcp-color-info);
    display: inline-flex;
    flex: 0 0 auto;
    height: var(--gcp-component-avatar);
    justify-content: center;
    width: var(--gcp-component-avatar);
}

.gcp-reports-channel-name.is-total > span
{
    background: var(--gcp-color-page-cream);
    color: var(--gcp-color-text-primary);
}

.gcp-reports-channel-name svg
{
    height: 14px;
    width: 14px;
}

.gcp-reports-channel-share
{
    background: var(--gcp-color-border-cool);
    border-radius: var(--gcp-radius-round);
    display: block;
    height: var(--gcp-space-1);
    min-width: var(--gcp-space-16);
    overflow: hidden;
}

.gcp-reports-channel-share i
{
    background: var(--gcp-color-blue);
    border-radius: inherit;
    display: block;
    height: 100%;
}

.gcp-reports-table-note
{
    border-top: 1px solid var(--gcp-color-border-warm);
    color: var(--gcp-color-text-muted);
    font-size: var(--gcp-type-small-size);
    margin: 0;
    padding: var(--gcp-space-2) var(--gcp-space-3);
}

.gcp-reports-device-card
{
    --gcp-device-1: var(--gcp-color-blue);
    --gcp-device-2: var(--gcp-color-blue-dark);
    --gcp-device-3: var(--gcp-color-gold);
    --gcp-device-4: var(--gcp-color-border-warm);
}

.gcp-reports-device
{
    align-items: center;
    display: grid;
    gap: var(--gcp-space-4);
    grid-template-columns: minmax(130px, 0.85fr) minmax(150px, 1fr);
    min-height: 230px;
}

.gcp-reports-donut
{
    aspect-ratio: 1;
    height: 180px;
    width: 180px;
}

.gcp-reports-donut-visual
{
    display: grid;
    place-items: center;
    position: relative;
}

.gcp-reports-donut-center
{
    align-content: center;
    display: grid;
    inset: 0;
    justify-items: center;
    pointer-events: none;
    position: absolute;
    text-align: center;
}

.gcp-reports-donut-center strong,
.gcp-reports-donut-placeholder strong
{
    color: var(--gcp-color-text-primary);
    font-family: var(--gcp-font-display);
    font-size: var(--gcp-type-section-size);
    font-variation-settings: "wght" var(--gcp-type-section-weight);
}

.gcp-reports-donut-center small,
.gcp-reports-donut-placeholder small
{
    color: var(--gcp-color-text-muted);
    font-size: var(--gcp-type-small-size);
}

.gcp-reports-donut-placeholder
{
    align-items: center;
    aspect-ratio: 1;
    border: 18px solid var(--gcp-color-border-cool);
    border-radius: var(--gcp-radius-round);
    display: grid;
    place-items: center;
    margin: auto;
    width: 132px;
}

.gcp-reports-donut-placeholder > span
{
    display: grid;
    justify-items: center;
}

.gcp-reports-device-legend
{
    display: grid;
    gap: var(--gcp-space-3);
}

.gcp-reports-device-legend > div
{
    align-items: center;
    display: grid;
    gap: var(--gcp-space-2);
    grid-template-columns: minmax(0, 1fr) auto;
}

.gcp-reports-device-legend span
{
    align-items: center;
    color: var(--gcp-color-text-muted);
    display: inline-flex;
    font-size: var(--gcp-type-small-size);
    gap: var(--gcp-space-1);
}

.gcp-reports-device-legend span svg
{
    height: 14px;
    width: 14px;
}

.gcp-reports-device-legend span i
{
    background: var(--gcp-device-1);
    border-radius: var(--gcp-radius-round);
    height: var(--gcp-space-2);
    width: var(--gcp-space-2);
}

.gcp-reports-device-legend span i.is-device-2
{
    background: var(--gcp-device-2);
}

.gcp-reports-device-legend span i.is-device-3
{
    background: var(--gcp-device-3);
}

.gcp-reports-device-legend span i.is-device-4
{
    background: var(--gcp-device-4);
}

.gcp-reports-device-legend strong
{
    color: var(--gcp-color-text-primary);
}

.gcp-reports-device-legend small
{
    color: var(--gcp-color-text-muted);
    grid-column: 2;
}

.gcp-reports-insights .gcp-stage1-card__body
{
    padding: 0;
}

.gcp-reports-insights-grid
{
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.gcp-reports-insights-grid article
{
    border-right: 1px solid var(--gcp-color-border-warm);
    display: grid;
    gap: var(--gcp-space-2);
    padding: var(--gcp-space-4);
}

.gcp-reports-insights-grid article:last-child
{
    border-right: 0;
}

.gcp-reports-insights-grid article > span
{
    align-items: center;
    background: var(--gcp-color-info-surface);
    border-radius: var(--gcp-radius-control);
    color: var(--gcp-color-blue);
    display: flex;
    height: 30px;
    justify-content: center;
    width: 30px;
}

.gcp-reports-insights-grid svg
{
    height: 15px;
    width: 15px;
}

.gcp-reports-insights-grid h3
{
    font-size: var(--gcp-type-card-size);
    font-variation-settings: "wght" var(--gcp-type-card-weight);
    margin: 0;
}

.gcp-reports-insights-grid p
{
    color: var(--gcp-color-text-muted);
    font-size: var(--gcp-type-small-size);
    line-height: var(--gcp-type-body-line);
    margin: 0;
}

.gcp-reports-insights-grid a
{
    color: var(--gcp-color-blue);
    font-size: var(--gcp-type-small-size);
    font-weight: var(--gcp-type-section-weight);
    justify-self: start;
}

.gcp-reports-footer
{
    align-items: center;
    border-top: 1px solid var(--gcp-color-border-warm);
    color: var(--gcp-color-text-muted);
    display: flex;
    flex-wrap: wrap;
    font-size: var(--gcp-type-small-size);
    gap: var(--gcp-space-2) var(--gcp-space-4);
    padding: var(--gcp-space-3) 0 var(--gcp-space-1);
}

.gcp-reports-footer span
{
    align-items: center;
    display: inline-flex;
    gap: var(--gcp-space-1);
}

.gcp-reports-footer svg
{
    height: 12px;
    width: 12px;
}

@media (max-width: 1279px)
{
    .gcp-reports-kpis
    {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .gcp-reports-kpis .gcp-stage1-stat:nth-child(n + 4)
    {
        border-top: 1px solid var(--gcp-color-border-warm);
    }

    .gcp-reports-kpis .gcp-stage1-stat:nth-child(4)
    {
        border-left: 0;
    }

    .gcp-reports-filter-strip .gcp-stage1-filter-bar__controls
    {
        grid-template-columns: repeat(2, minmax(160px, 1fr));
    }

    .gcp-reports-filter-strip .gcp-stage1-filter-bar__controls > button
    {
        grid-column: 2;
        justify-self: end;
    }
}

@media (max-width: 1023px)
{
    .gcp-reports-layout
    {
        display: block;
    }

    .gcp-reports-band--primary,
    .gcp-reports-band--secondary
    {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 767px)
{
    .gcp-reports-content
    {
        padding: var(--gcp-space-4);
    }

    .gcp-reports-heading-row
    {
        align-items: flex-start;
        flex-direction: column;
    }

    .gcp-reports-actions
    {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        width: 100%;
    }

    .gcp-reports-actions button
    {
        padding: 0 var(--gcp-space-2);
    }

    .gcp-reports-context > span:not(.gcp-reports-chip)
    {
        border-right: 0;
        padding-right: 0;
    }

    .gcp-reports-filter-strip .gcp-stage1-filter-bar__controls
    {
        grid-template-columns: 1fr;
        width: 100%;
    }

    .gcp-reports-filter-strip .gcp-stage1-filter-bar__controls > button
    {
        grid-column: auto;
        justify-self: stretch;
    }

    .gcp-reports-source-status,
    .gcp-reports-insights-grid
    {
        grid-template-columns: 1fr;
    }

    .gcp-reports-insights-grid article
    {
        border-bottom: 1px solid var(--gcp-color-border-warm);
        border-right: 0;
    }

    .gcp-reports-insights-grid article:last-child
    {
        border-bottom: 0;
    }

    .gcp-reports-kpis
    {
        display: grid;
        grid-auto-columns: min(78vw, 300px);
        grid-auto-flow: column;
        grid-template-columns: none;
        margin: 0 calc(var(--gcp-space-4) * -1);
        overflow-x: auto;
        padding: 0 var(--gcp-space-4) var(--gcp-space-2);
        scroll-snap-type: x mandatory;
    }

    .gcp-reports-kpis .gcp-stage1-stat
    {
        border-top: 0;
        scroll-snap-align: start;
    }

    .gcp-reports-kpis .gcp-stage1-stat:nth-child(4)
    {
        border-left: 1px solid var(--gcp-color-border-warm);
    }

    .gcp-reports-card-tools
    {
        align-items: flex-start;
        flex-direction: column;
    }

    .gcp-reports-device
    {
        grid-template-columns: 1fr;
    }
}

@media print
{
    .gcp-reports-actions,
    .gcp-reports-back,
    .gcp-reports-filter-strip,
    .gcp-assistant-panel,
    .gcp-assistant-trigger
    {
        display: none;
    }

    .gcp-reports-layout
    {
        display: block;
    }
}

/*
 * Report header (2 September 2026)
 *
 * The title and the three buttons shared one non-wrapping row. Once the
 * assistant panel is open on a laptop the row runs out of width, and the
 * buttons collapsed into a narrow vertical stack beside a squeezed title.
 * The row now keeps one line while it fits and drops the buttons onto their
 * own full-width line when it does not, as the design shows.
 */
.gcp-reports-heading-row
{
    flex-wrap: wrap;
    row-gap: var(--gcp-space-3);
}

.gcp-reports-title-row
{
    flex: 1 1 16rem;
    min-width: 0;
}

.gcp-reports-title-row h1
{
    min-width: 0;
}

.gcp-reports-actions
{
    flex: 0 0 auto;
    flex-wrap: nowrap;
    margin-left: auto;
}
