.taildesk-dashboard-widget {
    --td-bg: #f7faf9;
    --td-border: #d4e6de;
    --td-ink: #0f2e22;
    --td-muted: #4f5f58;
    --td-accent: #1f8f5f;
    --td-accent-soft: #d6f0e3;
    --td-pending-bg: #fff3cd;
    --td-pending-ink: #7a5600;
    color: var(--td-ink);
}

.taildesk-dashboard-capacity-list,
.taildesk-dashboard-request-list {
    margin: 0;
    padding: 0;
    list-style: none;
}

.taildesk-dashboard-filter {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 10px;
}

.taildesk-dashboard-filter label {
    color: var(--td-muted);
    font-weight: 600;
}

.taildesk-dashboard-filter select {
    min-width: 180px;
}

.taildesk-dashboard-capacity-row,
.taildesk-dashboard-request-row {
    display: grid;
    align-items: center;
    gap: 8px;
    margin: 0;
    padding: 10px 0;
    border-bottom: 1px solid #ecefed;
}

.taildesk-dashboard-capacity-row:last-child,
.taildesk-dashboard-request-row:last-child {
    border-bottom: 0;
}

.taildesk-dashboard-capacity-row {
    grid-template-columns: 62px 1fr auto;
}

.taildesk-dashboard-capacity-day {
    color: var(--td-muted);
    font-weight: 600;
}

.taildesk-dashboard-capacity-day a,
.taildesk-dashboard-request-main span a {
    color: inherit;
    text-decoration: none;
}

.taildesk-dashboard-capacity-day a:hover,
.taildesk-dashboard-request-main span a:hover {
    text-decoration: underline;
}

.taildesk-dashboard-capacity-bar {
    overflow: hidden;
    height: 10px;
    border-radius: 999px;
    background: var(--td-accent-soft);
}

.taildesk-dashboard-capacity-bar i {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #1f8f5f 0%, #2db17a 100%);
}

.taildesk-dashboard-capacity-meta {
    color: var(--td-muted);
    font-style: normal;
    font-weight: 600;
}

.taildesk-dashboard-request-row {
    grid-template-columns: 1fr auto;
}

.taildesk-dashboard-request-main strong {
    font-weight: 600;
}

.taildesk-dashboard-request-main span {
    color: var(--td-muted);
}

.taildesk-dashboard-pill {
    display: inline-block;
    padding: 3px 9px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
    text-transform: lowercase;
}

.taildesk-dashboard-pill.is-pending {
    background: var(--td-pending-bg);
    color: var(--td-pending-ink);
}

.taildesk-dashboard-empty {
    margin: 0;
    color: var(--td-muted);
}

.taildesk-dashboard-meta-link {
    margin: 12px 0 0;
}