/* SIASRI – Custom CSS (complementary to Tailwind CDN) */

/* ── Smooth scroll & base ── */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }

/* ── Leaflet popup custom style ── */
.leaflet-popup-content-wrapper {
    border-radius: 12px !important;
    padding: 0 !important;
    overflow: hidden;
    box-shadow: 0 8px 24px rgba(0,0,0,0.15) !important;
}
.leaflet-popup-content {
    margin: 8px !important;
}
.leaflet-popup-tip-container {
    margin-top: -1px;
}

/* ── Line clamp utilities ── */
.line-clamp-1 { display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; }
.line-clamp-2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.line-clamp-3 { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }

/* ── Pagination styling (Laravel default) ── */
nav[aria-label="pagination"] span[aria-current="page"] span,
nav[aria-label="pagination"] .page-item.active .page-link {
    background-color: #1a3d2b;
    color: white;
    border-radius: 8px;
    padding: 6px 12px;
    font-size: 0.875rem;
}
nav[aria-label="pagination"] a {
    color: #2d6a4f;
    padding: 6px 12px;
    border-radius: 8px;
    font-size: 0.875rem;
    transition: background 0.15s;
}
nav[aria-label="pagination"] a:hover {
    background-color: #f5f0e8;
}

/* ── Loading skeleton animation ── */
@keyframes shimmer {
    0% { background-position: -1000px 0; }
    100% { background-position: 1000px 0; }
}
.skeleton {
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 1000px 100%;
    animation: shimmer 2s infinite;
}

/* ── Hero wave ── */
.hero-wave { display: block; }

/* ── Responsive map height ── */
@media (max-width: 1024px) {
    #main-map { height: 400px !important; }
}