/**
 * Link Previews Styles
 *
 * Styles for the internal link preview popup card.
 * Only applies on devices with hover capability.
 *
 * @package Gourmand
 * @since 3.3.0
 */

@media (hover: hover) {
    .gourmand-link-preview {
        position: absolute;
        z-index: 9999;
        width: 300px;
        background: #fff;
        border-radius: 8px;
        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15), 0 0 0 1px rgba(0, 0, 0, 0.05);
        overflow: hidden;
        opacity: 0;
        visibility: hidden;
        transform: translateY(4px);
        transition: opacity 0.15s ease, transform 0.15s ease, visibility 0.15s;
        pointer-events: none;
    }

    .gourmand-link-preview-visible {
        opacity: 1;
        visibility: visible;
        transform: translateY(0);
        pointer-events: auto;
    }

    /* Featured Image */
    .gourmand-link-preview-image {
        width: 100%;
        height: 140px;
        background-size: cover;
        background-position: center;
        background-color: #f5f5f5;
    }

    .gourmand-link-preview-no-image .gourmand-link-preview-image {
        display: none;
    }

    /* Content Area */
    .gourmand-link-preview-content {
        padding: 12px 16px 14px;
    }

    /* Title */
    .gourmand-link-preview-title {
        font-family: var(--font-heading, Georgia, serif);
        font-size: var(--heading-xs, 1.1rem);
        font-weight: var(--weight-bold, 700);
        line-height: var(--leading-heading-normal, 1.3);
        color: var(--color-heading, #333);
        margin: 0 0 6px 0;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    /* Excerpt */
    .gourmand-link-preview-excerpt {
        font-family: var(--font-body, Georgia, serif);
        font-size: var(--body-s, 0.875rem);
        font-weight: var(--weight-normal, 400);
        line-height: var(--leading-body-tight, 1.4);
        color: var(--color-body, #555);
        margin: 0 0 10px 0;
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    /* Meta Line */
    .gourmand-link-preview-meta {
        font-family: var(--font-meta, sans-serif);
        font-size: var(--meta-s, 0.7rem);
        font-weight: var(--weight-medium, 500);
        line-height: 1;
        letter-spacing: var(--tracking-meta, 0.05em);
        text-transform: uppercase;
        color: var(--color-meta, #333);
        opacity: 0.7;
    }

    /* Empty state handling */
    .gourmand-link-preview-excerpt:empty {
        display: none;
    }

    .gourmand-link-preview-meta:empty {
        display: none;
    }

    /* Adjust spacing when no excerpt */
    .gourmand-link-preview-excerpt:empty + .gourmand-link-preview-meta {
        margin-top: 4px;
    }
}