/**
 * Naturblick Custom Styles
 * Zusätzliche Styles für das Naturfotografie-Theme
 */

/* ===========================
   Smooth Scrolling & Selection
   =========================== */
html {
    scroll-behavior: smooth;
}

::selection {
    background-color: var(--wp--preset--color--accent);
    color: var(--wp--preset--color--text);
}

/* ===========================
   Image Enhancements
   =========================== */
.wp-block-image img,
.wp-block-post-featured-image img {
    transition: transform 0.4s ease, box-shadow 0.4s ease;
}

.wp-block-post-featured-image:hover img {
    transform: scale(1.02);
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15);
}

/* Lightbox-Effect für Galerie */
.wp-block-gallery .wp-block-image {
    overflow: hidden;
}

.wp-block-gallery .wp-block-image img {
    transition: transform 0.5s ease;
}

.wp-block-gallery .wp-block-image:hover img {
    transform: scale(1.05);
}

/* ===========================
   Post Grid Cards
   =========================== */
.wp-block-post-template .wp-block-group {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    padding-bottom: var(--wp--preset--spacing--20);
}

.wp-block-post-template .wp-block-group:hover {
    transform: translateY(-4px);
}

/* ===========================
   Link Styles
   =========================== */
.wp-block-post-title a {
    text-decoration: none;
    transition: color 0.3s ease;
}

.wp-block-post-title a:hover {
    color: var(--wp--preset--color--accent);
}

/* Underline animation for links */
.entry-content a:not(.wp-block-button__link) {
    text-decoration: none;
    background-image: linear-gradient(var(--wp--preset--color--accent), var(--wp--preset--color--accent));
    background-size: 0% 2px;
    background-position: 0 100%;
    background-repeat: no-repeat;
    transition: background-size 0.3s ease;
}

.entry-content a:not(.wp-block-button__link):hover {
    background-size: 100% 2px;
}

/* ===========================
   Button Enhancements
   =========================== */
.wp-block-button__link {
    transition: all 0.3s ease;
}

.wp-block-button__link:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 15px rgba(45, 74, 62, 0.3);
}

/* Outline Style Button */
.is-style-outline .wp-block-button__link {
    border: 2px solid var(--wp--preset--color--primary);
    background: transparent;
    color: var(--wp--preset--color--primary);
}

.is-style-outline .wp-block-button__link:hover {
    background: var(--wp--preset--color--primary);
    color: var(--wp--preset--color--background);
}

/* ===========================
   Navigation
   =========================== */
.wp-block-navigation-item__content {
    position: relative;
}

.wp-block-navigation-item__content::after {
    content: '';
    position: absolute;
    bottom: -4px;
    left: 0;
    width: 0;
    height: 2px;
    background-color: var(--wp--preset--color--accent);
    transition: width 0.3s ease;
}

.wp-block-navigation-item:hover .wp-block-navigation-item__content::after {
    width: 100%;
}

/* ===========================
   Header Sticky
   =========================== */
header.wp-block-group {
    position: sticky;
    top: 0;
    z-index: 100;
    backdrop-filter: blur(10px);
    background-color: rgba(250, 249, 247, 0.95);
}

/* ===========================
   Quote Block Enhancement
   =========================== */
.wp-block-quote {
    position: relative;
}

.wp-block-quote::before {
    content: '"';
    position: absolute;
    top: -20px;
    left: -10px;
    font-size: 4rem;
    font-family: var(--wp--preset--font-family--heading);
    color: var(--wp--preset--color--accent);
    opacity: 0.3;
    line-height: 1;
}

/* ===========================
   Cover Block Text Shadow & Color
   =========================== */
.wp-block-cover h1,
.wp-block-cover h2,
.wp-block-cover h3,
.wp-block-cover p,
.wp-block-cover .wp-block-site-title,
.wp-block-cover .wp-block-site-title a {
    color: #ffffff !important;
    text-shadow: 0 2px 20px rgba(0, 0, 0, 0.5);
}

/* ===========================
   Separator Styles
   =========================== */
.wp-block-separator.is-style-wide {
    border: none;
    height: 1px;
    opacity: 0.3;
}

/* ===========================
   Footer Styling
   =========================== */
footer.wp-block-group,
footer.wp-block-group p,
footer.wp-block-group h3,
footer.wp-block-group h4,
footer.wp-block-group li,
footer.wp-block-group span {
    color: #ffffff !important;
}

footer.wp-block-group a {
    color: rgba(255, 255, 255, 0.8) !important;
    text-decoration: none;
    transition: opacity 0.3s ease;
}

footer.wp-block-group a:hover {
    color: #ffffff !important;
    opacity: 1;
}

/* ===========================
   Responsive Adjustments
   =========================== */
@media (max-width: 781px) {
    .wp-block-post-template[style*="grid-template-columns"] {
        grid-template-columns: repeat(2, 1fr) !important;
    }

    .wp-block-columns {
        flex-direction: column;
    }

    .wp-block-column {
        flex-basis: 100% !important;
        margin-bottom: var(--wp--preset--spacing--30);
    }
}

@media (max-width: 480px) {
    .wp-block-post-template[style*="grid-template-columns"] {
        grid-template-columns: 1fr !important;
    }

    header.wp-block-group .wp-block-group {
        flex-direction: column;
        gap: var(--wp--preset--spacing--20);
    }
}

/* ===========================
   Print Styles
   =========================== */
@media print {
    header.wp-block-group,
    footer.wp-block-group,
    .wp-block-navigation {
        display: none;
    }

    .wp-block-post-content {
        max-width: 100%;
    }
}

/* ===========================
   Accessibility Focus Styles
   =========================== */
a:focus,
button:focus,
input:focus,
textarea:focus {
    outline: 2px solid var(--wp--preset--color--accent);
    outline-offset: 2px;
}

/* Skip link */
.skip-link {
    position: absolute;
    top: -40px;
    left: 0;
    background: var(--wp--preset--color--primary);
    color: var(--wp--preset--color--background);
    padding: 8px 16px;
    z-index: 1000;
    transition: top 0.3s;
}

.skip-link:focus {
    top: 0;
}

/* Images are visible by default - no fade animation */