/* ============================================
   PIVOT TABLE (SfPivotView) CUSTOMIZATIONS
   Must load AFTER tailwind3-lite.css to win cascade
   ============================================ */

/* --- Grouping bar: override Syncfusion theme max-width constraints --- */
.e-pivotview .e-group-values .e-pvt-btn-div .e-pivot-button,
.e-pivotview .e-group-row .e-group-rows .e-pvt-btn-div .e-pivot-button,
.e-pivotview .e-group-filters .e-pvt-btn-div .e-pivot-button,
.e-pivotview .e-group-columns .e-pvt-btn-div .e-pivot-button,
.e-pivotview .e-pivot-button {
    max-width: none !important;
    overflow: visible !important;
    flex-shrink: 0 !important;
}

.e-pivotview .e-group-values .e-pvt-btn-div .e-pivot-button .e-pvt-btn-content,
.e-pivotview .e-group-row .e-group-rows .e-pvt-btn-div .e-pivot-button .e-pvt-btn-content,
.e-pivotview .e-group-filters .e-pvt-btn-div .e-pivot-button .e-pvt-btn-content,
.e-pivotview .e-group-columns .e-pvt-btn-div .e-pivot-button .e-pvt-btn-content,
.e-pivotview .e-pivot-button .e-pvt-btn-content {
    max-width: none !important;
    overflow: visible !important;
    text-overflow: unset !important;
    white-space: nowrap !important;
    font-size: 12px !important;
}

/* Grouping bar containers: allow wrapping and visible overflow */
.e-pivotview .e-group-rows,
.e-pivotview .e-group-columns,
.e-pivotview .e-group-values,
.e-pivotview .e-group-filters {
    overflow: visible !important;
    flex-wrap: wrap !important;
}

/* --- Fix: row axis header (.e-group-row) gets light bg from Syncfusion default,
       but navy-theme applies white text → invisible. Apply the same gradient
       as column headers so white text is naturally readable. --- */
.e-pivotview .e-grid .e-gridheader th.e-headercell.e-group-row {
    background: linear-gradient(135deg, rgb(11, 18, 32) 0%, rgb(30, 58, 138) 25%, rgb(29, 59, 139) 75%, rgb(29, 78, 216) 100%) !important;
}

/* Row axis header buttons/icons: white to match gradient bg */
.e-pivotview .e-grid .e-gridheader th.e-headercell.e-group-row .e-pivot-button,
.e-pivotview .e-grid .e-gridheader th.e-headercell.e-group-row .e-pvt-btn-content,
.e-pivotview .e-grid .e-gridheader th.e-headercell.e-group-row .e-icons,
.e-pivotview .e-grid .e-gridheader th.e-headercell.e-group-row .e-icons::before {
    color: white !important;
}

/* --- Pivot grid headers: full text, no clipping --- */
.e-pivotview .e-headercell .e-headercelldiv,
.e-pivotview .e-columnsheader,
.e-pivotview .e-rowsheader {
    font-size: 13px !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: unset !important;
    line-height: 1.3 !important;
}

/* Row header cells: ensure enough width for product names */
.e-pivotview .e-rowsheader {
    min-width: 200px !important;
}

/* Pivot value cells: readable font */
.e-pivotview .e-valuescontent {
    font-size: 13px !important;
}

/* --- Fix hover: override navy-theme blue hover with neutral gray --- */
.e-pivotview .e-grid .e-row:hover .e-rowcell,
.e-pivotview .e-grid .e-row:hover .e-rowsheader,
.e-pivotview .e-grid .e-row:hover .e-valuescontent,
.e-pivotview .e-grid.e-gridhover tr[role="row"]:hover .e-rowcell,
.e-pivotview .e-grid .e-frozenhover {
    background-color: rgb(243, 244, 246) !important;
    color: rgb(17, 24, 39) !important;
}

/* --- Fix hover/mouse-over: prevent text clipping on hover --- */
.e-pivotview .e-rowsheader:hover,
.e-pivotview .e-columnsheader:hover,
.e-pivotview .e-valuescontent:hover,
.e-pivotview .e-grid .e-rowcell:hover,
.e-pivotview .e-grid .e-headercell:hover {
    overflow: visible !important;
    text-overflow: unset !important;
}

.e-pivotview .e-cellvalue {
    overflow: visible !important;
    text-overflow: unset !important;
    white-space: normal !important;
}

/* --- Field List dialog: wider layout and readable items --- */
.e-pivotfieldlist-container {
    min-width: 560px !important;
}

.e-pivotfieldlist-container .e-pivot-button {
    max-width: none !important;
}

.e-pivotfieldlist-container .e-pivot-button .e-pvt-btn-content {
    max-width: none !important;
    overflow: visible !important;
    text-overflow: unset !important;
    white-space: nowrap !important;
    font-size: 12px !important;
}

.e-pivotfieldlist-container .e-list-text {
    font-size: 13px !important;
    overflow: visible !important;
    text-overflow: unset !important;
    white-space: nowrap !important;
}

.e-pivotfieldlist-container .e-field-list-values,
.e-pivotfieldlist-container .e-field-list-rows,
.e-pivotfieldlist-container .e-field-list-columns,
.e-pivotfieldlist-container .e-field-list-filters {
    overflow: visible !important;
}