/* srvc.dk — Nordic Clarity Design System */

/* Material Symbols config */
.material-symbols-outlined {
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

/* Hero gradient */
.hero-gradient {
    background: linear-gradient(135deg, #224355 0%, #3a5a6d 100%);
}

/* Glass navigation */
.glass-nav {
    backdrop-filter: blur(24px);
}

/* Map container */
#map {
    width: 100%;
    height: 500px;
    border-radius: 1rem;
}

/* HTMX loading indicator */
.htmx-indicator { display: none; }
.htmx-request .htmx-indicator { display: inline-flex; }

/* Address autocomplete dropdown */
.address-dropdown {
    position: absolute;
    z-index: 50;
    width: 100%;
    background: white;
    border: 1px solid #c2c7cc;
    border-radius: 0.75rem;
    box-shadow: 0 8px 24px rgba(25, 28, 29, 0.08);
    max-height: 300px;
    overflow-y: auto;
}
.address-dropdown-item {
    padding: 0.625rem 1rem;
    cursor: pointer;
    font-size: 0.875rem;
    transition: background-color 0.15s;
}
.address-dropdown-item:hover {
    background-color: #f2f4f5;
}

/* Card hover effects */
.card-hover {
    transition: all 0.2s ease;
}
.card-hover:hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 32px rgba(25, 28, 29, 0.08);
}

/* Smooth scroll */
html { scroll-behavior: smooth; }

/* Selection color */
::selection {
    background-color: #abebed;
    color: #224355;
}

/* Loading skeletons */
.skeleton {
    background: linear-gradient(90deg, #e6e8e9 25%, #f2f4f5 50%, #e6e8e9 75%);
    background-size: 200% 100%;
    animation: skeleton-pulse 1.5s ease-in-out infinite;
    border-radius: 0.5rem;
}
.skeleton-text { height: 1rem; margin-bottom: 0.5rem; }
.skeleton-text-sm { height: 0.75rem; margin-bottom: 0.375rem; }
.skeleton-circle { border-radius: 50%; }
.skeleton-card { height: 8rem; border-radius: 1rem; }
.skeleton-avatar { width: 3rem; height: 3rem; border-radius: 50%; }

@keyframes skeleton-pulse {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

/* Empty states */
.empty-state {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem 1.5rem;
    text-align: center;
    color: #42474c;
}
.empty-state .material-symbols-outlined {
    font-size: 3rem;
    color: #c2c7cc;
    margin-bottom: 1rem;
}

/* Status badges */
.badge-published { background: #abebed; color: #2a6c6e; }
.badge-draft { background: #e6e8e9; color: #42474c; }
.badge-in-progress { background: #fff3e0; color: #e65100; }
.badge-completed { background: #e8f5e9; color: #2e7d32; }
.badge-cancelled { background: #ffeef0; color: #ba1a1a; }
.badge-disputed { background: #fff3e0; color: #e65100; }