/* Employee profile page (users/view2): header, tab shell and the card primitives shared by the tabs. */

pc-employee-profile,
pc-employee-overview,
pc-employee-educations,
pc-employee-kursplus,
pc-employee-drivers-license {
	display: block;
}

/* No header icon here: the avatar inside the headline replaces it. Drop the grid
   so rd-icon-no-icon stops reserving its empty icon column on the left. */
.rd-ep-header .rd-main-head-headline-wrap {
	display: block;
}

/* The avatar sits inside the headline (pc-main-header renders it via unsafeHTML),
   so the circle has to align with the text itself. */
.rd-ep-header .rd-main-headline {
	display: flex;
	align-items: center;
	gap: var(--rd-spacing-sm);
}

/* Overrides the 96px .avatar_mainframe default that ships with the sidebar styles. */
.rd-ep-header .rd-ep-avatar {
	width: 48px;
	height: 48px;
	flex: none;
}

.rd-ep-header .rd-ep-avatar .myFoto {
	display: block;
	border-radius: 50%;
	background-size: cover;
	background-position: 50%;
	background-repeat: no-repeat;
}

/* Line the subheadline up with the name, not with the avatar. */
.rd-ep-header .rd-main-subheadline {
	padding-left: calc(48px + var(--rd-spacing-sm));
}

.rd-ep-header .rd-ep-groups-more {
	vertical-align: middle;
}

/* Blocked actions stay visible so the reason can be explained on click. */
.rd-ep-header .rd-main-head-actions .disabled,
.rd-ep-header .rd-main-head-subactions .disabled {
	opacity: var(--rd-opacity-inactive);
	cursor: not-allowed;
}

.rd-ep-header .rd-main-head-subactions .rd-ep-danger-action {
	color: var(--rd-error-default);
}

/* Kurs+ tab label: the plus in brand pink, like everywhere else on the platform. */
.rd-ep-header .rd-tabs-card .rd-tab a > span:first-of-type,
.rd-ep-plus {
	color: var(--rd-primary-active);
	font-weight: 700;
}

/* ── Card primitives ─────────────────────────────────────────────────── */

.rd-ep-card {
	min-width: 0;
	padding: var(--rd-spacing-x-big);
	margin-top: var(--rd-spacing-md);
	border-radius: var(--sm, 12px);
border: 1px solid var(--Colors-Border-border-secondary, #E5E5E5);
box-shadow:none;
}

.rd-ep-card h2 {
	font-size: var(--rd-fontsize-5);
font-weight: var(--rd-fontweights-open-sans-0);
line-height: 125%; 
margin-bottom:0;
}

.rd-ep-card-head {
	display: flex;
	align-items: center;
	gap: var(--rd-spacing-x-sm);
	margin-bottom: 18px;
	min-height: auto;
	border-bottom: unset;
}

.rd-ep-card-head > :first-child {
	margin-right: auto;
}

.rd-ep-card-head p {
	margin: var(--rd-spacing-xx-sm) 0 0;
	color: var(--rd-gray-500);
	font-size: var(--rd-fontsize-4);
}

.rd-ep-card-head h2 .rd-status-badge {
	margin-left: var(--rd-spacing-x-sm);
	vertical-align: middle;
}

/* The shared progress bar, tightened for inline use (no bottom margin). */
.rd-ep-bar {
	display: block;
	height: 8px;
	margin: 0;
}

.rd-ep-bar span {
	height: 8px;
}

.rd-ep-bar-expired span {
	background-color: var(--rd-error-default);
}

.rd-ep-bar-locked span {
	background-color: var(--rd-warning-default);
}

/* Zeit | UE toggle */
.rd-ep-segmented {
	display: inline-flex;
	border: 1px solid #D4D4D4;
	border-radius: 8px;
	overflow: hidden;
	/* box-shadow: 0 0 0 1px var(--Colors-Effects-Shadows-shadow-skeumorphic-inner-border, rgba(0, 0, 0, 0.18)) inset, 0 -2px 0 0 var(--Colors-Effects-Shadows-shadow-skeumorphic-inner, rgba(0, 0, 0, 0.05)) inset, 0 1px 2px 0 var(--Colors-Effects-Shadows-shadow-xs, rgba(0, 0, 0, 0.05)) !important; Falsch in Figma*/


}

.rd-ep-segment {
	padding: var(--rd-spacing-x-sm) 14px;
	border: 0;
	background: transparent;
	color: var(--rd-font-dark);
	font-weight: var(--rd-fontweights-open-sans-1);
	cursor: pointer;
	border-right: 1px solid var(--Colors-Border-border-primary, #D4D4D4) ;
}
.rd-ep-segment:last-of-type{
	border-right: unset;
}

.rd-ep-segment.is-active {
	background: #FAFAFA;

}

.rd-ep-skeleton {
	display: grid;
	gap: var(--rd-spacing-md);
	margin-top: var(--rd-spacing-md);
}

.rd-ep-technical-details {
	margin-top: var(--rd-spacing-big);
}

.rd-ep-technical-details summary {
	cursor: pointer;
	color: var(--rd-primary-active);
}

.rd-ep-technical-details code {
	display: block;
	margin-top: var(--rd-spacing-x-sm);
	white-space: normal;
	overflow-wrap: anywhere;
}

.rd-ep-form-actions {
	display: flex;
	justify-content: flex-end;
	margin-top: var(--rd-spacing-md);
}

/* Fixed-period readout used when a Kurs+ Weiterbildung is selected as date scope. */
.rd-ep-period-select select {
	border: none;
	background: transparent;
	color: inherit;
	font: inherit;
	cursor: pointer;
	outline: none;
}