:host {
    display: block;
}

:host ::ng-deep .team-overview__surface-card.p-card,
:host ::ng-deep .team-overview__usage-card.p-card,
:host ::ng-deep .plan-comparison__card.p-card {
    border: 1px solid var(--p-content-border-color);
    border-radius: 8px;
    box-shadow: none;
}

:host ::ng-deep .team-overview__surface-card .p-card-body,
:host ::ng-deep .team-overview__usage-card .p-card-body,
:host ::ng-deep .plan-comparison__card .p-card-body {
    padding: 1rem;
}

:host ::ng-deep .team-overview__cloud-card .p-card-body,
:host ::ng-deep .team-overview__usage-card .p-card-body,
:host ::ng-deep .plan-comparison__card .p-card-body {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    height: 100%;
}

:host ::ng-deep .plan-comparison__card--current.p-card {
    opacity: 0.7;
}

:host ::ng-deep .plan-comparison__card--recommended.p-card {
    border-color: var(--p-primary-color);
}

:host ::ng-deep .team-overview__usage-card .p-progressbar {
    height: 0.65rem;
}

:host ::ng-deep .team-overview__usage-card--healthy .p-progressbar-value {
    background: var(--p-primary-color);
}

:host ::ng-deep .team-overview__usage-card--warning .p-progressbar-value {
    background: #f59e0b;
}

:host ::ng-deep .team-overview__usage-card--critical .p-progressbar-value {
    background: #dc2626;
}

:host ::ng-deep .team-overview__usage-card--unlimited.p-card {
    border-color: color-mix(in srgb, var(--p-primary-color) 20%, transparent);
}
