/* Vendors — the list (Components/Vendors/Vendors.razor) and a vendor's own page (VendorDetail.razor: details +
   ports card, services grid with row-expand panels). Grid fill/overflow comes from the global GridCard rule
   in dashboard-grid.css; row chrome from dashboard-grid.css/vessel-file-cards.css. Only what those don't
   cover lives here. */

/* Same equal-share squash fix as every other row-action / stack group: without it Kendo's stack stretch
   splits a column's width evenly instead of sizing each child to its own content. */
.lh-vendor-row-actions>*,
.lh-vendor-service-actions>*,
.lh-vendor-name-cell>*,
.lh-vendor-ports-row>*,
.lh-vendor-header>*,
.lh-vendor-section-header>*,
.lh-vendor-test-row>*,
.lh-vendor-band-draft>*,
.lh-vendor-port-chip>*,
.lh-vendor-service-col>*,
.lh-vendor-service-section>*,
.lh-vendor-tier-table>* {
    flex: 0 0 auto;
}

/* The expanded service row: the same panel padding as the other row-expand pages. */
.lh-vendor-service-panel {
    padding: var(--kendo-spacing-6) 0;
}

.lh-vendor-service-grid .k-detail-row:hover {
    background-color: transparent !important;
}

/* Parameters/tier tables on the left and the formula on the right share the row; each column may shrink
   below its content (min-width:0) so an inner grid never forces the panel wider than the card. */
.lh-vendor-service-columns>.lh-vendor-service-col {
    flex: 1 1 0;
    min-width: 0;
}

/* A section heading inside the panel ("Parameters", "PDA Formula"): title left, its action right. */
.lh-vendor-section-header {
    justify-content: space-between;
    width: 100%;
}

.lh-vendor-section-title {
    font-family: var(--lh-font-body);
    font-size: var(--lh-text-lg);
    font-weight: var(--lh-weight-semibold);
    color: var(--kendo-color-secondary);
}

/* A tier table sits in a light box so several read as separate tables, not one long list. */
.lh-vendor-tier-table {
    padding: var(--kendo-spacing-4);
    border: 1px solid var(--lh-border-subtle);
    border-radius: var(--kendo-border-radius-xl);
    background-color: var(--kendo-color-base-subtle);
}

.lh-vendor-reference {
    padding: var(--kendo-spacing-2) 0;
}

.lh-vendor-test-row {
    flex-wrap: wrap;
}

/* The add-band row wraps instead of pushing its button past the tier box when the column is narrow. */
.lh-vendor-band-draft {
    flex-wrap: wrap;
}

/* The formula test's outcome: a plain tinted line, success or warning. */
.lh-vendor-test-ok,
.lh-vendor-test-warn {
    padding: var(--kendo-spacing-3) var(--kendo-spacing-4);
    border-radius: var(--kendo-border-radius-md);
    font-family: var(--lh-font-body);
    font-size: var(--lh-text-md);
}

.lh-vendor-test-ok {
    background-color: var(--kendo-color-success-subtle);
    color: var(--kendo-color-success-on-subtle);
}

.lh-vendor-test-warn {
    background-color: var(--kendo-color-warning-subtle);
    color: var(--kendo-color-warning-on-subtle);
}

/* Related ports: the chips wrap onto further lines when a vendor has many. */
.lh-vendor-ports {
    margin-top: var(--kendo-spacing-4);
}

.lh-vendor-ports-row {
    flex-wrap: wrap;
}

.lh-vendor-port-chip {
    padding: var(--kendo-spacing-1) var(--kendo-spacing-2) var(--kendo-spacing-1) var(--kendo-spacing-3);
    border: 1px solid var(--lh-border);
    border-radius: var(--kendo-border-radius-xxl);
    background-color: var(--kendo-color-base-subtle);
    font-family: var(--lh-font-body);
    font-size: var(--lh-text-md);
    color: var(--kendo-color-base-on-surface);
}

/* The Office(s) / PDA Field(s) cells hold a list of names, so they wrap onto further lines instead of
   truncating — dashboard-grid.css's .lh-grid-line-primary forces one line with an ellipsis, which suits every
   other cell but would hide most of a long list. Added alongside that class, so it keeps the same type. */
.lh-grid-line-primary.lh-vendor-list-cell {
    white-space: normal;
    overflow: visible;
    text-overflow: clip;
}