/* Shared skeleton loading — header/nav stays visible */
@keyframes skeleton-shimmer {
    0% { background-position: -200% 0; }
    100% { background-position: 200% 0; }
}
.skeleton-block {
    background: linear-gradient(90deg, #e4e4e7 0%, #f4f4f5 45%, #e4e4e7 100%);
    background-size: 200% 100%;
    animation: skeleton-shimmer 1.4s ease-in-out infinite;
    border-radius: 8px;
}
.skeleton-line { height: 14px; margin-bottom: 12px; }
.skeleton-line.lg          { height: 32px; border-radius: 10px; }
.skeleton-line.md { height: 20px; }
.skeleton-line.sm { width: 35%; }
.skeleton-line.mid { width: 65%; }
.skeleton-line.full { width: 100%; }
.skeleton-line.short { width: 45%; }
.page-skeleton { width: 100%; }
.skeleton-card {
    background: white;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    padding: 2rem;
}
.skeleton-project-card { padding: 2.5rem; margin-bottom: 1.5rem; }
.skeleton-project-card .skeleton-line.lg { width: 55%; }
.skeleton-hero-block {
    background: linear-gradient(180deg, #f0f9ff 0%, #e0f2fe 100%);
    border-bottom: 1px solid #e2e8f0;
    padding: 4rem 5% 6rem;
    margin-bottom: 3rem;
}
.skeleton-form-block { padding: 3rem; }
.skeleton-form-block .skeleton-field {
    height: 48px;
    margin-bottom: 1.25rem;
    border-radius: 10px;
}
.skeleton-stepper {
    display: flex;
    gap: 12px;
    margin-bottom: 2rem;
}
.skeleton-stepper .skeleton-block {
    height: 12px;
    flex: 1;
    border-radius: 999px;
}
.skeleton-grid-3 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
    margin-bottom: 1.5rem;
}
.skeleton-stat-card { height: 120px; border-radius: 12px; }
.skeleton-chart-block { height: 320px; border-radius: 12px; }
.page-loader {
    position: absolute;
    inset: 0;
    background: var(--bg-main, #f8fafc);
    z-index: 40;
    padding: 2rem 3rem;
    overflow: auto;
    transition: opacity 0.35s ease, visibility 0.35s ease;
}
.page-loader.hidden { opacity: 0; visibility: hidden; pointer-events: none; display: none; }
.main-content { position: relative; }

/* Badges removed site-wide (dashboard pages) */
.badge,
.badge-pill,
.banner-badge,
.tier-pay-badge,
.premium-badge,
.pay-badge,
.badge-loc,
.badge-rewriting,
.badge-safety,
.badge-transcription,
.badge-default,
.badge-signature,
.badge-high-pay,
.badge-mid-pay,
#proj-badges,
#proj-badge,
#dyn-badge,
#modal-badge {
    display: none !important;
}

:root {
    --logo-size-header: 64px;
    --logo-max-width: 176px;
    --logo-badge-padding-y: 0.44rem;
    --logo-badge-padding-x: 0.96rem;
}

.logo-home-link {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    padding: 0.15rem 0;
    margin-right: 0.5rem;
    text-decoration: none;
    line-height: 0;
    cursor: pointer;
    background: none;
    border: none;
    border-radius: 0;
    isolation: isolate;
}

.logo-img,
.brand-logo,
.app-logo,
.login-logo,
.auth-logo-img {
    position: relative;
    z-index: 1;
    max-height: var(--logo-size-header);
    max-width: var(--logo-max-width);
    width: auto;
    height: auto;
    object-fit: contain;
    display: block;
}

/* White badge — logo stands out on dark headers */
.main-nav .logo-home-link,
.gs-nav .logo-home-link,
.opp-nav .logo-home-link,
.ent-nav .logo-home-link,
.top-navbar .logo-home-link {
    padding: var(--logo-badge-padding-y) var(--logo-badge-padding-x);
    border-radius: 13px;
    background: linear-gradient(155deg, #ffffff 0%, #f8fafc 52%, #eff6ff 100%) !important;
    border: 1px solid rgba(14, 165, 233, 0.24);
    box-shadow:
        0 2px 12px rgba(0, 0, 0, 0.22),
        inset 0 1px 0 rgba(255, 255, 255, 0.95),
        0 0 28px rgba(14, 165, 233, 0.1);
    transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
}

.main-nav .logo-home-link:hover,
.gs-nav .logo-home-link:hover,
.opp-nav .logo-home-link:hover,
.ent-nav .logo-home-link:hover,
.top-navbar .logo-home-link:hover {
    transform: translateY(-1px);
    border-color: rgba(14, 165, 233, 0.38);
    box-shadow:
        0 4px 16px rgba(0, 0, 0, 0.26),
        inset 0 1px 0 rgba(255, 255, 255, 1),
        0 0 36px rgba(14, 165, 233, 0.16);
}

.main-nav .logo-home-link .logo-img,
.gs-nav .logo-home-link .logo-img,
.opp-nav .logo-home-link .logo-img,
.ent-nav .logo-home-link .logo-img,
.top-navbar .logo-home-link .logo-img,
.top-navbar .logo-home-link .brand-logo,
.main-nav .logo-home-link .brand-logo,
.gs-nav .logo-home-link .brand-logo,
.opp-nav .logo-home-link .brand-logo,
.ent-nav .logo-home-link .brand-logo {
    max-height: var(--logo-size-header) !important;
    max-width: var(--logo-max-width) !important;
    width: auto !important;
    height: auto !important;
    object-fit: contain !important;
    filter: drop-shadow(0 1px 3px rgba(15, 23, 42, 0.14));
}

body.pipeline-special .top-navbar .logo-home-link {
    background: linear-gradient(155deg, #ffffff 0%, #f8fafc 55%, #f1f5f9 100%) !important;
    border-color: rgba(148, 163, 184, 0.35);
    box-shadow:
        0 2px 12px rgba(0, 0, 0, 0.28),
        inset 0 1px 0 rgba(255, 255, 255, 0.95),
        0 0 24px rgba(148, 163, 184, 0.12);
}

.logo-home-link:hover .logo-img,
.logo-home-link:hover .brand-logo,
.logo-home-link:hover .login-logo,
.logo-home-link:hover .auth-logo-img {
    opacity: 1;
}
