/* Карточки результатов поиска и их строки подробностей.
   Часть components/cards.css; порядок частей важен — см. static/README.md. */
.result-card {
    --result-card-media-size-compact: 84px;
    --result-card-media-size-regular: 96px;
    --result-card-media-size-expanded: 180px;
}

.result-card--search {
    --result-card-media-size-inline: var(--result-card-media-size-regular);
}

.result-card--audio {
    --result-card-media-size-inline: var(--result-card-media-size-compact);
    --result-card-media-size-block: var(--result-card-media-size-compact);
    --result-card-media-size-cards: var(--result-card-media-size-expanded);
}

.result-card--with-image {
    --result-card-media-size-inline: clamp(72px, 8.2vw, 88px);
}

.result-card--surface-interactive {
    transition: transform var(--button-transition-duration) var(--button-transition-ease);
}

.result-card--surface-interactive:hover,
.result-card--surface-interactive:focus-within {
    background: var(--item-card-hover-bg);
    border: var(--item-card-hover-border);
}

a.result-card--surface-interactive:active,
.result-card--surface-interactive:has(.audio-word-image-link:active, .audio-word-link:active) {
    background: var(--emphasis-action-quiet-bg-active);
    border-color: var(--theme-border-focus);
    transform: scale(0.99);
}

.result-card__main {
    display: grid;
    gap: var(--result-card-main-gap, var(--space-4));
    min-width: 0;
    flex: 1 1 auto;
}

.result-card--media-end {
    align-items: flex-start;
}

.result-card--media-end > .result-card__main {
    order: 1;
}

.result-card--media-end > .result-card__media {
    order: 2;
    inline-size: var(--result-card-media-size-inline);
    block-size: var(--result-card-media-size-inline);
    flex: 0 0 var(--result-card-media-size-inline);
    margin-inline-start: auto;
    align-self: flex-start;
}

.result-card__media {
    display: block;
    position: relative;
    min-width: 0;
    overflow: hidden;
    border-radius: calc(var(--surface-radius) - 4px);
    border: 1px solid var(--theme-border-surface-item);
    background: var(--theme-surface-subtle);
    transition:
        border-color var(--button-transition-duration) var(--button-transition-ease),
        background var(--button-transition-duration) var(--button-transition-ease);
}

/* Media thumbnail border stays neutral on card hover — no highlight */

.result-card__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.result-card--search.result-card--with-image .result-card__media img {
    object-fit: contain;
    object-position: center;
    background: var(--theme-surface-base);
}

.result-card--media-end > .result-card__media--adaptive {
    inline-size: auto;
    block-size: auto;
    flex: 0 1 auto;
}

.result-card__media--adaptive {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    max-inline-size: 100%;
    overflow: visible;
    border: 0;
    background: transparent;
}

.result-card__media--adaptive img {
    width: auto;
    height: auto;
    max-inline-size: 100%;
    max-block-size: 100%;
    object-fit: contain;
}

.media-generated-badge.badge {
    position: absolute;
    top: 6px;
    inset-inline-start: 6px;
    z-index: 2;
    pointer-events: auto;
    cursor: pointer;
    --badge-min-height: 18px;
    --badge-padding: 0 6px;
    --badge-border: 1px solid var(--theme-border-subtle);
    --badge-bg: var(--theme-surface-base);
    --badge-color: var(--theme-text-muted);
    --badge-font-size: 10px;
    --badge-line-height: 1;
    --badge-font-weight: var(--type-label-weight);
    --badge-letter-spacing: var(--type-label-track);
    --badge-text-transform: uppercase;
}

/* Hide ИИ badge on mini-thumbnails in search result cards */
.result-card--search .media-generated-badge {
    display: none;
}

.result-card__body {
    display: grid;
    align-content: start;
    gap: var(--result-card-body-gap, 10px);
    min-width: 0;
    flex: 1 1 auto;
}

.result-card__header {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    flex-wrap: wrap;
    min-width: 0;
}

.result-card__title {
    min-width: 0;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.result-card__title-badge {
    align-self: flex-start;
    flex: 0 0 auto;
}

.result-card__summary {
    color: var(--theme-text-muted);
    overflow-wrap: anywhere;
    word-break: break-word;
}

.result-card__details[data-result-card-details] {
    display: grid;
    gap: 8px;
    min-width: 0;
}

[data-result-card-detail-list] {
    display: grid;
    gap: 6px;
    min-width: 0;
}

[data-result-card-detail-row] {
    display: grid;
    gap: 4px;
    min-width: 0;
    padding-inline-start: 12px;
    position: relative;
}

[data-result-card-detail-row]::before {
    content: "";
    position: absolute;
    inset-inline-start: 0;
    top: 0.35rem;
    bottom: 0.35rem;
    width: 2px;
    border-radius: var(--radius-pill);
    background: var(--theme-border-focus);
}

[data-result-card-detail-main],
[data-result-card-detail-links] {
    display: flex;
    align-items: baseline;
    gap: 4px;
    flex-wrap: wrap;
    min-width: 0;
}

[data-result-card-detail-prefix] {
    color: var(--theme-text-strong);
}

[data-result-card-detail-text] {
    color: var(--theme-text-muted);
    overflow-wrap: anywhere;
    word-break: break-word;
}

[data-result-card-detail-link] {
    color: var(--link-color);
    text-decoration: none;
    overflow-wrap: anywhere;
    word-break: break-word;
}

[data-result-card-detail-link]:hover {
    text-decoration: none;
}

[data-result-card-detail-support] {
    color: var(--theme-text-muted);
}

[data-result-card-detail-more],
[data-result-card-details-more] {
    justify-self: start;
}

.result-card__meta,
.result-card__signals,
.icon-badge-row {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    min-width: 0;
}

.result-card__meta-badge {
    --badge-min-height: 22px;
    --badge-padding-x: 8px;
    --badge-font-size: var(--font-size-xs);
    --badge-border: 1px solid var(--theme-border-subtle);
    --badge-bg: var(--theme-surface-subsection);
    --badge-color: var(--theme-text-muted);
}

.result-card__signal,
.icon-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 24px;
    padding: 2px 8px;
    border-radius: var(--control-radius);
    border: 1px solid var(--theme-border-subtle);
    background: var(--theme-surface-subsection);
    color: var(--theme-text-muted);
}

.result-card__signal--count,
.icon-badge--count {
    color: var(--theme-text-strong);
    border-color: var(--theme-border-focus);
}

.result-card__signal-icon,
.icon-badge__icon {
    --action-icon-box-size: 16px;
    --action-icon-img-width: 14px;
    --action-icon-img-height: 14px;
    --icon-filter: none;
    flex: 0 0 auto;
    color: currentColor;
}

.result-card__signal-count,
.icon-badge__count {
    color: currentColor;
    font-size: var(--font-size-xs);
    line-height: 1;
}

.result-card__details {
    display: grid;
    gap: 8px;
    min-width: 0;
}

.result-card__actions {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    flex-wrap: wrap;
    flex: 0 0 auto;
}