/**
 * Credential Card Widget Styles
 *
 * Detailed credential cards with icons, titles, and rich descriptions
 *
 * @package DrYazdani
 * @since 1.0.0
 */

/* ==========================================================================
   Container
   ========================================================================== */

.dryazdani-credential-card {
	background-color: var(--dryazdani-bg-light, #fafafa);
	padding: var(--dryazdani-space-24, 96px) var(--dryazdani-space-6, 24px);
}

.dryazdani-credential-card__container {
	max-width: 1200px;
	margin: 0 auto;
}

/* ==========================================================================
   Header
   ========================================================================== */

.dryazdani-credential-card__header {
	text-align: center;
	margin-bottom: var(--dryazdani-space-16, 64px);
}

.dryazdani-credential-card__eyebrow {
	color: var(--dryazdani-primary, #d4af37);
	font-size: var(--dryazdani-text-xs, 0.75rem);
	letter-spacing: 0.3em;
	text-transform: uppercase;
	margin-bottom: var(--dryazdani-space-6, 24px);
	font-weight: var(--dryazdani-font-normal, 400);
}

.dryazdani-credential-card__heading {
	font-family: var(--dryazdani-font-heading, 'Playfair Display', serif);
	font-size: clamp(var(--dryazdani-text-5xl, 3rem), 5vw, var(--dryazdani-text-6xl, 3.75rem));
	line-height: 1.2;
	color: var(--dryazdani-secondary, #2c2c2c);
	margin: 0;
	font-weight: var(--dryazdani-font-normal, 400);
}

/* ==========================================================================
   Card List
   ========================================================================== */

.dryazdani-credential-card__list {
	display: flex;
	flex-direction: column;
	gap: var(--dryazdani-space-8, 32px);
}

/* ==========================================================================
   Card Item
   ========================================================================== */

.dryazdani-credential-card__item {
	background-color: var(--dryazdani-bg-white, #ffffff);
	padding: var(--dryazdani-space-12, 48px);
	border: 2px solid rgba(44, 44, 44, 0.1);
	border-radius: 0;
	transition: var(--dryazdani-transition-normal, all 300ms ease-out);
}

/* Highlight Border (Golden) */
.dryazdani-credential-card__item--highlight {
	border-color: var(--dryazdani-primary, #d4af37);
	border-width: 2px;
}

/* Last item - no bottom margin */
.dryazdani-credential-card__item:last-child {
	margin-bottom: 0;
}

/* Hover Effect */
.dryazdani-credential-card__item:hover {
	transform: translateY(-2px);
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
}

/* ==========================================================================
   Card Header
   ========================================================================== */

.dryazdani-credential-card__item-header {
	display: flex;
	align-items: flex-start;
	gap: var(--dryazdani-space-6, 24px);
	margin-bottom: var(--dryazdani-space-6, 24px);
}

/* ==========================================================================
   Icon
   ========================================================================== */

.dryazdani-credential-card__icon {
	flex-shrink: 0;
	display: flex;
	align-items: center;
	justify-content: center;
}

.dryazdani-credential-card__icon i,
.dryazdani-credential-card__icon svg {
	color: var(--dryazdani-primary, #d4af37);
	fill: var(--dryazdani-primary, #d4af37);
	font-size: 48px;
	width: 48px;
	height: 48px;
}

/* ==========================================================================
   Meta
   ========================================================================== */

.dryazdani-credential-card__meta {
	flex: 1;
}

.dryazdani-credential-card__title {
	font-family: var(--dryazdani-font-heading, 'Playfair Display', serif);
	font-size: clamp(var(--dryazdani-text-2xl, 1.5rem), 3vw, var(--dryazdani-text-3xl, 1.875rem));
	line-height: 1.3;
	color: var(--dryazdani-secondary, #2c2c2c);
	margin: 0 0 var(--dryazdani-space-4, 16px) 0;
	font-weight: var(--dryazdani-font-normal, 400);
}

.dryazdani-credential-card__organization {
	color: var(--dryazdani-primary, #d4af37);
	font-size: var(--dryazdani-text-sm, 0.875rem);
	letter-spacing: var(--dryazdani-tracking-widest, 0.15em);
	text-transform: uppercase;
	font-weight: var(--dryazdani-font-medium, 500);
	margin-bottom: var(--dryazdani-space-6, 24px);
}

/* ==========================================================================
   Description
   ========================================================================== */

.dryazdani-credential-card__description {
	color: var(--dryazdani-text-body, #717171);
	font-size: clamp(var(--dryazdani-text-sm, 0.875rem), 1.5vw, var(--dryazdani-text-base, 1rem));
	line-height: 1.8;
}

.dryazdani-credential-card__description p {
	margin: 0 0 var(--dryazdani-space-4, 16px) 0;
}

.dryazdani-credential-card__description p:last-child {
	margin-bottom: 0;
}

.dryazdani-credential-card__description a {
	color: var(--dryazdani-primary, #d4af37);
	text-decoration: underline;
	transition: var(--dryazdani-transition-fast, all 150ms ease-out);
}

.dryazdani-credential-card__description a:hover {
	color: var(--dryazdani-secondary, #2c2c2c);
}

/* ==========================================================================
   Responsive Design
   ========================================================================== */

/* Tablet */
@media (max-width: 1024px) {
	.dryazdani-credential-card {
		padding: var(--dryazdani-space-20, 80px) var(--dryazdani-space-6, 24px);
	}

	.dryazdani-credential-card__header {
		margin-bottom: var(--dryazdani-space-12, 48px);
	}

	.dryazdani-credential-card__item {
		padding: var(--dryazdani-space-10, 40px);
	}

	.dryazdani-credential-card__list {
		gap: var(--dryazdani-space-6, 24px);
	}
}

/* Mobile */
@media (max-width: 767px) {
	.dryazdani-credential-card {
		padding: var(--dryazdani-space-16, 64px) var(--dryazdani-space-4, 16px);
	}

	.dryazdani-credential-card__header {
		margin-bottom: var(--dryazdani-space-10, 40px);
	}

	.dryazdani-credential-card__eyebrow {
		font-size: 0.625rem;
		letter-spacing: var(--dryazdani-tracking-ultra-wide, 0.2em);
		margin-bottom: var(--dryazdani-space-4, 16px);
	}

	.dryazdani-credential-card__heading {
		font-size: var(--dryazdani-text-4xl, 2.5rem);
	}

	.dryazdani-credential-card__list {
		gap: var(--dryazdani-space-5, 20px);
	}

	.dryazdani-credential-card__item {
		padding: var(--dryazdani-space-8, 32px) var(--dryazdani-space-6, 24px);
	}

	.dryazdani-credential-card__item:hover {
		transform: none;
		box-shadow: none;
	}

	.dryazdani-credential-card__item-header {
		flex-direction: column;
		gap: var(--dryazdani-space-4, 16px);
		margin-bottom: var(--dryazdani-space-5, 20px);
	}

	.dryazdani-credential-card__icon i,
	.dryazdani-credential-card__icon svg {
		font-size: 40px;
		width: 40px;
		height: 40px;
	}

	.dryazdani-credential-card__title {
		font-size: var(--dryazdani-text-2xl, 1.5rem);
		margin-bottom: var(--dryazdani-space-3, 12px);
	}

	.dryazdani-credential-card__organization {
		font-size: var(--dryazdani-text-xs, 0.75rem);
		letter-spacing: var(--dryazdani-tracking-widest, 0.1em);
		margin-bottom: var(--dryazdani-space-4, 16px);
	}

	.dryazdani-credential-card__description {
		font-size: var(--dryazdani-text-sm, 0.875rem);
		line-height: 1.7;
	}

	.dryazdani-credential-card__description p {
		margin-bottom: var(--dryazdani-space-3, 12px);
	}
}

/* ==========================================================================
   RTL Support
   ========================================================================== */

/* Icons that need flipping in RTL */
[dir="rtl"] .dryazdani-credential-card__icon i.fa-arrow-right,
[dir="rtl"] .dryazdani-credential-card__icon i.fa-chevron-right {
	transform: scaleX(-1);
}

/* ==========================================================================
   Accessibility
   ========================================================================== */

/* Respect user's motion preferences */
@media (prefers-reduced-motion: reduce) {
	.dryazdani-credential-card__item,
	.dryazdani-credential-card__description a {
		transition: none;
	}

	.dryazdani-credential-card__item:hover {
		transform: none;
	}
}

/* High contrast mode support */
@media (prefers-contrast: high) {
	.dryazdani-credential-card__item {
		border-width: 3px;
	}

	.dryazdani-credential-card__item--highlight {
		border-width: 4px;
	}
}

/* Focus styles for keyboard navigation */
.dryazdani-credential-card__item:focus-within {
	outline: 2px solid var(--color-primary, #d4af37);
	outline-offset: 4px;
}