/* ============================================
   Home Module - Element-Specific Styles
   Extracted from individual blade element files
   ============================================ */

/* --- Blog Element --- */
.hp-blog-card:hover, .hp-blog-list-item:hover, .hp-blog-grid-item:hover { transform: translateY(-2px); box-shadow: 0 4px 12px rgba(0,0,0,0.15) !important; }
.hp-blog-card:hover .hp-blog-img, .hp-blog-list-item:hover .hp-blog-img, .hp-blog-grid-item:hover .hp-blog-img { transform: scale(1.05); }
.hp-blog-card:focus, .hp-blog-list-item:focus, .hp-blog-grid-item:focus { outline: 2px solid rgb(var(--v-theme-primary, 25, 118, 210)); outline-offset: 2px; }
.hp-blog-title { display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; }
.hp-blog-excerpt { display: -webkit-box; -webkit-line-clamp: 3; line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; }
@media (max-width: 960px) {
    .hp-blog-grid { grid-template-columns: repeat(2, 1fr) !important; }
    .hp-blog-list-item img { width: 120px !important; min-height: 100px !important; }
    .hp-blog-card .hp-blog-img[style*="width: 150px"] { width: 120px !important; }
}
@media (max-width: 600px) {
    .hp-blog-grid { grid-template-columns: 1fr !important; }
    .hp-blog-list-item { flex-direction: column !important; }
    .hp-blog-list-item > div:first-child { width: 100% !important; }
    .hp-blog-list-item img { width: 100% !important; height: 150px !important; }
    .hp-blog-excerpt { -webkit-line-clamp: 2; line-clamp: 2; }
}

/* --- Events Element --- */
.hp-event-card:hover { transform: translateY(-4px); box-shadow: 0 4px 12px rgba(0,0,0,0.15) !important; }
.hp-event-grid-item:hover, .hp-event-list-item:hover {
    background-color: rgba(var(--v-theme-primary, 25, 118, 210), 0.05);
    border-color: rgb(var(--v-theme-primary, 25, 118, 210)) !important;
}
@media (max-width: 959px) {
    .hp-events-cards, .hp-events-grid { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 599px) {
    .hp-events-cards, .hp-events-grid { grid-template-columns: 1fr !important; }
    .hp-event-list-item { flex-direction: column !important; }
    .hp-event-list-item > div:last-child { align-self: flex-start !important; margin-top: 12px; }
}

/* --- Gallery Element --- */
.hp-gallery-clickable { cursor: pointer; }
.hp-gallery-hover-zoom img, .hp-gallery-hover-zoom video { transition: transform 0.3s ease; }
.hp-gallery-hover-zoom:hover img, .hp-gallery-hover-zoom:hover video { transform: scale(1.03); }
.hp-gallery-hover-dim img, .hp-gallery-hover-dim video { transition: filter 0.3s ease; }
.hp-gallery-hover-dim:hover img, .hp-gallery-hover-dim:hover video { filter: brightness(0.9); }
.hp-gallery-dot { width: 10px; height: 10px; border-radius: 50%; background: rgba(255,255,255,0.5); border: none; cursor: pointer; transition: all 0.3s ease; padding: 0; }
.hp-gallery-dot:hover { background: rgba(255,255,255,0.8); }
.hp-gallery-dot.active { background: white; width: 24px; border-radius: 5px; }
@media (max-width: 599px) {
    .hp-gallery-masonry { column-count: 1 !important; }
    .hp-gallery-grid { grid-template-columns: 1fr !important; }
}
@media (min-width: 600px) and (max-width: 959px) {
    .hp-gallery-masonry { column-count: 2 !important; }
    .hp-gallery-grid { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 600px) {
    .hp-gallery-slideshow .slideshow-caption { padding: 16px !important; }
}

/* --- Map Element --- */
@media (max-width: 600px) {
    .hp-map-iframe { height: 300px !important; }
}
@media (min-width: 960px) {
    .hp-map-iframe { height: 450px !important; }
}

/* --- Menu Element --- */
.hp-menu-active { font-weight: 600; }

/* --- Registration Element --- */
@media (max-width: 640px) {
    [style*="grid-template-columns: 1fr 1fr"] {
        grid-template-columns: 1fr !important;
    }
}

/* --- YouTube Videos Element --- */
@media (max-width: 960px) {
    .hp-youtube-grid { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 600px) {
    .hp-youtube-grid { grid-template-columns: 1fr !important; }
}

/* --- Heading Element --- */
/* Sensible fallback sizes matching Vuetify's heading scale when admin sets no fontSize */
.heading-element { line-height: 1.2; font-size: inherit; }
h1.heading-element { font-size: 2.125rem; }
h2.heading-element { font-size: 1.875rem; }
h3.heading-element { font-size: 1.5rem; }
h4.heading-element { font-size: 1.25rem; }
h5.heading-element { font-size: 1.125rem; }
h6.heading-element { font-size: 1rem; }

/* --- Social Links Element --- */
.hp-social-link { transition: opacity 0.2s; }
.hp-social-link:hover { opacity: 0.85; }