/* ── Suppliers Dashboard ───────────────────────────────────────────────────── */

/* Widget structural card styles (mirrors InvoicesDashboard pattern) */
/* Widget card, title, subtext inherit from nd-widgets-grid shared baseline.
   Overrides: slightly larger padding, icon, and value */
.suppliers-dashboard-widgets .dashboard-widget {
    padding: 20px 18px;
    box-shadow: none;
}

.suppliers-dashboard-widgets .dashboard-widget:hover {
    box-shadow: 0 8px 22px rgba(20, 30, 60, 0.08);
}

.suppliers-dashboard-widgets .widget-icon {
    width: 40px;
    height: 40px;
    margin: 0 auto 14px;
    font-size: 16px;
}

.suppliers-dashboard-widgets .widget-title {
    font-size: 14px;
}

.suppliers-dashboard-widgets .widget-value {
    font-size: 32px;
}

/* Widget colour themes */
.widget-suppliers-total .widget-icon      { background: var(--wg-accent-light, #e0f7f4); color: var(--wg-text-body, #00897b); }
.widget-suppliers-total .widget-value     { color: var(--wg-text-body, #00897b); }

.widget-suppliers-missingabn .widget-icon { background: var(--color-danger-light); color: var(--color-danger); }
.widget-suppliers-missingabn .widget-value { color: var(--color-danger); }

.widget-suppliers-noaddress .widget-icon  { background: var(--color-warning-light); color: var(--color-warning); }
.widget-suppliers-noaddress .widget-value { color: var(--color-warning); }

.widget-suppliers-nocontacts .widget-icon { background: var(--wg-accent-light, #f3e5f5); color: var(--wg-accent, #8e24aa); }
.widget-suppliers-nocontacts .widget-value { color: var(--wg-accent, #8e24aa); }

/* Table card */
.suppliers-table-card {
    background: var(--bg-surface);
    border-radius: 8px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.07);
    margin-top: 20px;
    overflow: hidden;
}

.suppliers-table-card .card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 20px 10px;
    border-bottom: 1px solid var(--border-default);
    flex-wrap: wrap;
    gap: 10px;
}

.suppliers-table-card .card-header h3 {
    font-size: 15px;
    font-weight: 600;
    color: var(--text-primary);
    margin: 0;
}

/* Toolbar */
.suppliers-table-toolbar {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.suppliers-status-pill {
    padding: 5px 14px;
    border-radius: 20px;
    border: 1px solid var(--border-heavy);
    background: var(--bg-surface);
    color: var(--text-secondary);
    font-size: 12px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.15s ease;
    white-space: nowrap;
}

.suppliers-status-pill:hover {
    border-color: var(--wg-text-body, #00897b);
    color: var(--wg-text-body, #00897b);
}

.suppliers-status-pill.active {
    background: var(--wg-text-body, #00897b);
    border-color: var(--wg-text-body, #00897b);
    color: var(--bg-surface);
}

.suppliers-status-pill.pill-danger.active {
    background: var(--color-danger);
    border-color: var(--color-danger);
}

.suppliers-status-pill.pill-warning.active {
    background: var(--color-warning);
    border-color: var(--color-warning);
}

.suppliers-status-pill.pill-purple.active {
    background: var(--wg-accent, #8e24aa);
    border-color: var(--wg-accent, #8e24aa);
}

/* Search */
.suppliers-search {
    position: relative;
}

.suppliers-search input {
    padding: 5px 12px 5px 32px;
    border: 1px solid var(--border-heavy);
    border-radius: 20px;
    font-size: 12px;
    color: var(--text-primary);
    width: 200px;
    outline: none;
    transition: border-color 0.15s;
}

.suppliers-search input:focus {
    border-color: var(--wg-text-body, #00897b);
}

.suppliers-search .search-icon {
    position: absolute;
    left: 10px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--text-muted);
    font-size: 12px;
}

/* Table wrap */
.suppliers-table-wrap {
    padding: 0 4px;
    overflow-x: auto;
}

/* Table header */
#SuppliersTable thead th {
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--text-muted);
    background: var(--bg-page);
    border-bottom: 2px solid var(--border-default);
    padding: 10px 12px;
    white-space: nowrap;
}

#SuppliersTable tbody td {
    padding: 10px 12px;
    font-size: 13px;
    vertical-align: middle;
}

/* Health indicator badges (shared style, supplier-scoped) */
.supplier-health-badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 11px;
    font-weight: 500;
    padding: 2px 8px;
    border-radius: 10px;
}

.supplier-health-badge.ok {
    background: var(--wg-accent-light, #e0f7f4);
    color: var(--wg-text-body, #00695c);
}

.supplier-health-badge.missing {
    background: var(--color-danger-light);
    color: var(--wg-text-body, #c62828);
}

/* Last activity */
.supplier-activity-date {
    font-size: 12px;
    color: var(--text-secondary);
}

.supplier-activity-date.stale-3m {
    color: var(--color-warning);
    font-weight: 500;
}

.supplier-activity-date.stale-6m {
    color: var(--color-danger);
    font-weight: 500;
}

.supplier-activity-date.never {
    color: var(--text-muted);
    font-style: italic;
}

/* Contact count badge */
.supplier-contact-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 22px;
    height: 22px;
    border-radius: 11px;
    font-size: 11px;
    font-weight: 600;
    padding: 0 6px;
}

.supplier-contact-count.has-contacts {
    background: var(--wg-accent-light, #e0f7f4);
    color: var(--wg-text-body, #00695c);
}

.supplier-contact-count.no-contacts {
    background: var(--color-danger-light);
    color: var(--wg-text-body, #c62828);
}

/* Select checkbox inside primary column */
#SuppliersTable .purchase-row-primary-wrap {
    display: flex;
    align-items: center;
    gap: 8px;
}
#SuppliersTable .purchase-row-primary-wrap .supplier-select-cb {
    margin: 0;
    flex-shrink: 0;
}
