/**
 * Component — Recipe Card
 * @package Recipes_Lola
 * @version 1.0.0
 */

.rl-recipe-card { display: flex; flex-direction: column; background-color: var(--rl-card-bg); border: var(--rl-border-width) solid var(--rl-card-border); border-radius: var(--rl-card-radius); box-shadow: var(--rl-card-shadow); overflow: hidden; transition: box-shadow var(--rl-card-transition), border-color var(--rl-card-transition); }
.rl-recipe-card:hover { box-shadow: var(--rl-card-shadow-hover); border-color: var(--rl-color-border-strong); }
.rl-recipe-card__link { display: flex; flex-direction: column; block-size: 100%; text-decoration: none; color: inherit; }
.rl-recipe-card__image-wrap { position: relative; aspect-ratio: var(--rl-card-img-ratio); overflow: hidden; background-color: var(--rl-color-surface-raised); }
.rl-recipe-card__image { inline-size: 100%; block-size: 100%; object-fit: cover; object-position: center; transition: transform var(--rl-transition-slow); }
.rl-recipe-card:hover .rl-recipe-card__image { transform: scale(1.03); }
.rl-recipe-card__category { position: absolute; inset-block-start: var(--rl-space-3); inset-inline-start: var(--rl-space-3); padding-block: var(--rl-badge-padding-y); padding-inline: var(--rl-badge-padding-x); background-color: var(--rl-color-surface); color: var(--rl-color-foreground); font-size: var(--rl-badge-font-size); font-weight: var(--rl-badge-font-weight); letter-spacing: var(--rl-badge-letter-spacing); text-transform: uppercase; border-radius: var(--rl-badge-radius); }
.rl-recipe-card__body { display: flex; flex-direction: column; flex: 1 0 auto; padding: var(--rl-card-padding); gap: var(--rl-card-gap); }
.rl-recipe-card__title { font-family: var(--rl-font-display); font-size: var(--rl-text-lg); font-weight: var(--rl-weight-regular); line-height: var(--rl-leading-snug); color: var(--rl-color-foreground); text-wrap: balance; }
.rl-recipe-card__excerpt { font-size: var(--rl-text-sm); line-height: var(--rl-leading-normal); color: var(--rl-color-foreground-muted); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.rl-recipe-card__meta { display: flex; align-items: center; gap: var(--rl-space-4); margin-block-start: auto; padding-block-start: var(--rl-space-3); }
.rl-recipe-card__meta-item { display: inline-flex; align-items: center; gap: var(--rl-space-1-5); font-size: var(--rl-text-xs); color: var(--rl-color-foreground-muted); }
.rl-recipe-card__meta-icon { inline-size: var(--rl-icon-size-sm); block-size: var(--rl-icon-size-sm); flex-shrink: 0; color: var(--rl-color-foreground-subtle); }

.rl-difficulty-badge { display: inline-flex; align-items: center; padding-block: var(--rl-badge-padding-y); padding-inline: var(--rl-badge-padding-x); border-radius: var(--rl-badge-radius); font-size: var(--rl-badge-font-size); font-weight: var(--rl-badge-font-weight); letter-spacing: var(--rl-badge-letter-spacing); text-transform: uppercase; }
.rl-difficulty-badge--easy { color: var(--rl-difficulty-easy-color); background-color: var(--rl-difficulty-easy-bg); border: var(--rl-border-width) solid var(--rl-difficulty-easy-border); }
.rl-difficulty-badge--medium { color: var(--rl-difficulty-medium-color); background-color: var(--rl-difficulty-medium-bg); border: var(--rl-border-width) solid var(--rl-difficulty-medium-border); }
.rl-difficulty-badge--hard { color: var(--rl-difficulty-hard-color); background-color: var(--rl-difficulty-hard-bg); border: var(--rl-border-width) solid var(--rl-difficulty-hard-border); }

.rl-recipe-card--featured { flex-direction: column; }
@media (min-width: 768px) {
  .rl-recipe-card--featured { flex-direction: row; }
  .rl-recipe-card--featured .rl-recipe-card__link { flex-direction: row; }
  .rl-recipe-card--featured .rl-recipe-card__image-wrap { inline-size: 45%; aspect-ratio: auto; }
  .rl-recipe-card--featured .rl-recipe-card__body { inline-size: 55%; justify-content: center; }
  .rl-recipe-card--featured .rl-recipe-card__title { font-size: var(--rl-text-2xl); }
}
