/**
 * Internal Links Styling
 * Makes auto-generated internal links more visible and readable
 */

.auto-internal-link {
    color: #3498db;
    font-weight: 500;
    text-decoration: underline;
    text-decoration-color: rgba(52, 152, 219, 0.4);
    text-decoration-thickness: 2px;
    text-underline-offset: 2px;
    transition: all 0.3s ease;
    position: relative;
}

.auto-internal-link:hover {
    color: #2980b9;
    text-decoration-color: #2980b9;
    text-decoration-thickness: 2px;
}

.auto-internal-link:focus {
    outline: 2px solid #3498db;
    outline-offset: 2px;
    border-radius: 2px;
}

/* Visited state */
.auto-internal-link:visited {
    color: #9b59b6;
    text-decoration-color: rgba(155, 89, 182, 0.4);
}

.auto-internal-link:visited:hover {
    color: #8e44ad;
    text-decoration-color: #8e44ad;
}

/* Dark theme support */
@media (prefers-color-scheme: dark) {
    .auto-internal-link {
        color: #5dade2;
        text-decoration-color: rgba(93, 173, 226, 0.5);
    }
    
    .auto-internal-link:hover {
        color: #85c1e9;
        text-decoration-color: #85c1e9;
    }
    
    .auto-internal-link:visited {
        color: #bb8fce;
        text-decoration-color: rgba(187, 143, 206, 0.5);
    }
    
    .auto-internal-link:visited:hover {
        color: #d7bde2;
        text-decoration-color: #d7bde2;
    }
}

/* Make links stand out in content */
.entry-content .auto-internal-link,
.post-content .auto-internal-link,
article .auto-internal-link {
    background: linear-gradient(
        to bottom,
        transparent 0%,
        transparent 85%,
        rgba(52, 152, 219, 0.15) 85%,
        rgba(52, 152, 219, 0.15) 100%
    );
    padding: 0 2px;
}

.entry-content .auto-internal-link:hover,
.post-content .auto-internal-link:hover,
article .auto-internal-link:hover {
    background: linear-gradient(
        to bottom,
        transparent 0%,
        transparent 85%,
        rgba(52, 152, 219, 0.25) 85%,
        rgba(52, 152, 219, 0.25) 100%
    );
}

/* Mobile optimization */
@media (max-width: 768px) {
    .auto-internal-link {
        text-decoration-thickness: 2.5px;
        text-underline-offset: 3px;
        padding: 2px 4px;
    }
}