/**
 * Product Attributes – frontend styles.
 * Loaded only when the widget is on the page (Elementor get_style_depends).
 */

/* =============================================
   General wrapper
   ============================================= */
.drunel-pa {
	width: 100%;
}

/* =============================================
   Label
   ============================================= */
.drunel-pa__label {
	font-weight: 600;
	font-size: 14px;
}

/* Label positions */
.drunel-pa__attribute--label-top {
	display: block;
}

.drunel-pa__attribute--label-inline {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
}

.drunel-pa__attribute--label-inline .drunel-pa__label {
	flex-shrink: 0;
	margin-bottom: 0;
}

/* =============================================
   Layout: Badges / Pills
   ============================================= */
.drunel-pa__values--badges {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
}

.drunel-pa__badge {
	display: inline-flex;
	align-items: center;
	font-size: 13px;
	line-height: 1;
	border: 1px solid #ddd;
	border-style: solid;
	white-space: nowrap;
	transition: background-color 0.2s ease, color 0.2s ease;
}

/* Links inside values */
.drunel-pa a {
	color: inherit;
	text-decoration: none;
	transition: opacity 0.2s ease;
}

.drunel-pa a:hover {
	opacity: 0.75;
}

.drunel-pa a:hover .drunel-pa__badge {
	filter: brightness(0.92);
}

/* =============================================
   Layout: Inline list
   ============================================= */
.drunel-pa__values--inline {
	display: inline;
	line-height: 1.6;
}

.drunel-pa__values--inline .drunel-pa__value {
	display: inline;
}

.drunel-pa__separator {
	display: inline;
	color: #999;
}

/* =============================================
   Layout: Vertical list
   ============================================= */
.drunel-pa__values--list {
	display: flex;
	flex-direction: column;
}

.drunel-pa__list-item {
	display: flex;
	align-items: center;
	gap: 8px;
}

/* =============================================
   Icon (all layouts)
   ============================================= */
.drunel-pa__icon {
	display: inline-flex;
	align-items: center;
	flex-shrink: 0;
	line-height: 1;
}

.drunel-pa__icon svg {
	fill: currentColor;
}

/* Inside badges: keep icon inline with text */
.drunel-pa__badge .drunel-pa__icon {
	vertical-align: middle;
}

/* Inside inline values */
.drunel-pa__values--inline .drunel-pa__icon {
	vertical-align: middle;
}

/* =============================================
   Layout: Table
   ============================================= */
.drunel-pa__table {
	width: 100%;
	border-collapse: collapse;
	border: 1px solid #e0e0e0;
}

.drunel-pa__table th,
.drunel-pa__table td {
	padding: 10px 14px;
	border: 1px solid #e0e0e0;
	text-align: left;
	font-size: 14px;
}

.drunel-pa__table th {
	font-weight: 600;
	width: 35%;
}
