@import '_content/Ampleo.Shared/Ampleo.Shared.0qkr06jwlh.bundle.scp.css';

/* /Components/Layout/LandingContent.razor.rz.scp.css */
/* ===== DESIGN TOKENS ===== */
/* NOTE: Variables must be on .lp-root (not :root) so Blazor CSS isolation [b-xxxx] scoping matches */
.lp-root[b-m2kn39m3zs] {
    --lp-blue-dark:  #32516E;
    --lp-blue-mid:   #62809C;
    --lp-blue-light: #7a98b4;
    --lp-blue-pale:  #e8eef4;
    --lp-brown:      #9c7e62;
    --lp-brown-lt:   #b89a7a;
    --lp-brown-pale: #f5efe8;
    --lp-gray:       #d6d6d6;
    --lp-warm:       #f9f8f6;
    --lp-white:      #ffffff;
    --lp-text:       #2a3a4a;
    --lp-muted:      #5a6d7e;
    --lp-light:      #8a97a5;
    --lp-border:     #e0ddd8;
    --lp-success:    #3d8a5e;
}

/* ===== RESET SCOPED TO LANDING ===== */
.lp-root *[b-m2kn39m3zs], .lp-root *[b-m2kn39m3zs]::before, .lp-root *[b-m2kn39m3zs]::after { box-sizing: border-box; margin: 0; padding: 0; }
.lp-root[b-m2kn39m3zs] { font-family: 'Barlow', 'Aptos', 'Segoe UI', sans-serif; font-weight: 300; color: var(--lp-text); background: var(--lp-warm); line-height: 1.6; font-size: 16.5px; -webkit-font-smoothing: antialiased; }
.lp-root h1[b-m2kn39m3zs], .lp-root h2[b-m2kn39m3zs], .lp-root h3[b-m2kn39m3zs], .lp-root h4[b-m2kn39m3zs] { font-weight: 600; line-height: 1.25; letter-spacing: -0.3px; }
.lp-root h1[b-m2kn39m3zs] { font-size: clamp(2.2rem, 5vw, 3.2rem); }
.lp-root h2[b-m2kn39m3zs] { font-size: clamp(1.6rem, 3.5vw, 2.2rem); }
.lp-root h3[b-m2kn39m3zs] { font-size: clamp(1.1rem, 2vw, 1.35rem); }

/* ===== LAYOUT ===== */
.lp-container[b-m2kn39m3zs] { max-width: 1140px; margin: 0 auto; padding: 0 24px; }
.lp-section[b-m2kn39m3zs] { padding: 100px 0; }

/* ===== NAV ===== */
.lp-nav[b-m2kn39m3zs] {
    position: sticky;
    top: 0;
    z-index: 100;
    background: #fff;
    backdrop-filter: blur(8px);
    border-bottom: 1px solid var(--lp-border);
    padding: 0 24px;
    box-shadow: 0 1px 8px rgba(50,81,110,0.07);
}
.lp-nav-inner[b-m2kn39m3zs] {
    max-width: 1320px;
    margin: 0 auto;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}
.lp-nav-brand[b-m2kn39m3zs] {
    display: flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
    flex-shrink: 0;
}
.lp-nav-logo[b-m2kn39m3zs] { height: 32px; }
.lp-nav-name[b-m2kn39m3zs] {
    font-size: 1.2rem;
    font-weight: 700;
    color: var(--lp-blue-dark);
    letter-spacing: -0.5px;
}
.lp-nav-links[b-m2kn39m3zs] {
    display: flex;
    align-items: center;
    gap: 4px;
}
.lp-nav-link[b-m2kn39m3zs] {
    color: var(--lp-muted);
    text-decoration: none;
    font-size: 0.97rem;
    font-weight: 400;
    padding: 6px 12px;
    border-radius: 6px;
    transition: color 0.2s, background 0.2s;
    white-space: nowrap;
}
.lp-nav-link:hover[b-m2kn39m3zs] { color: var(--lp-blue-dark); background: var(--lp-blue-pale); }
.lp-nav-locale-btn[b-m2kn39m3zs] {
    background: var(--lp-blue-pale);
    border: 1px solid var(--lp-border);
    color: var(--lp-muted);
    font-size: 0.97rem;
    padding: 5px 12px;
    border-radius: 6px;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 6px;
    transition: all 0.2s;
}
.lp-nav-locale-btn:hover[b-m2kn39m3zs] { background: var(--lp-blue-pale); color: var(--lp-blue-dark); border-color: var(--lp-blue-mid); }
.lp-nav-login[b-m2kn39m3zs] {
    color: var(--lp-blue-dark);
    text-decoration: none;
    font-size: 0.97rem;
    font-weight: 500;
    padding: 6px 14px;
    border: 1px solid var(--lp-border);
    border-radius: 6px;
    transition: all 0.2s;
    white-space: nowrap;
}
.lp-nav-login:hover[b-m2kn39m3zs] { border-color: var(--lp-blue-mid); color: var(--lp-blue-dark); background: var(--lp-blue-pale); }
.lp-nav-cta[b-m2kn39m3zs] {
    background: var(--lp-brown);
    color: #fff;
    text-decoration: none;
    font-size: 0.97rem;
    font-weight: 600;
    padding: 8px 18px;
    border-radius: 6px;
    transition: all 0.2s;
    white-space: nowrap;
}
.lp-nav-cta:hover[b-m2kn39m3zs] { background: var(--lp-brown-lt); color: #fff; }

/* locale dropdown */
.lp-locale-wrap[b-m2kn39m3zs] { position: relative; }
.lp-locale-menu[b-m2kn39m3zs] {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    background: #fff;
    border: 1px solid var(--lp-border);
    border-radius: 8px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.12);
    min-width: 110px;
    overflow: hidden;
    z-index: 200;
}
.lp-locale-item[b-m2kn39m3zs] {
    display: block;
    width: 100%;
    padding: 9px 16px;
    background: none;
    border: none;
    text-align: left;
    font-size: 0.97rem;
    cursor: pointer;
    color: var(--lp-text);
    transition: background 0.15s;
}
.lp-locale-item:hover[b-m2kn39m3zs] { background: var(--lp-blue-pale); }
.lp-locale-item.active[b-m2kn39m3zs] { font-weight: 600; color: var(--lp-blue-dark); }

/* ===== HERO ===== */
.lp-hero[b-m2kn39m3zs] {
    background: linear-gradient(170deg, #28455e 0%, var(--lp-blue-dark) 40%, var(--lp-blue-mid) 100%);
    color: #fff;
    padding: 90px 0 110px;
    position: relative;
    overflow: hidden;
}
.lp-hero[b-m2kn39m3zs]::before {
    content: '';
    position: absolute;
    top: -50%; right: -20%;
    width: 70%; height: 200%;
    background: radial-gradient(ellipse, rgba(156,126,98,0.1) 0%, transparent 70%);
    pointer-events: none;
}
.lp-hero[b-m2kn39m3zs]::after {
    content: '';
    position: absolute;
    bottom: 0; left: 0; right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--lp-brown), transparent);
    opacity: 0.3;
}
.lp-hero .lp-container[b-m2kn39m3zs] { position: relative; z-index: 1; }

.lp-hero-badge[b-m2kn39m3zs] {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: rgba(156,126,98,0.2);
    border: 1px solid rgba(156,126,98,0.45);
    border-radius: 100px;
    padding: 10px 22px;
    font-size: 0.97rem;
    font-weight: 500;
    color: #fff;
    margin-bottom: 32px;
    letter-spacing: 0.02em;
}
.lp-hero h1[b-m2kn39m3zs] { max-width: 700px; margin-bottom: 20px; color: #fff; }
.lp-hero h1 em[b-m2kn39m3zs] { font-style: normal; color: var(--lp-brown-lt); }
.lp-hero-sub[b-m2kn39m3zs] {
    color: rgba(255,255,255,0.7);
    max-width: 540px;
    margin-bottom: 40px;
    font-size: 1.08rem;
    font-weight: 300;
    line-height: 1.7;
}
.lp-hero-cta[b-m2kn39m3zs] { display: flex; gap: 16px; flex-wrap: wrap; align-items: center; }
.lp-hero-trust[b-m2kn39m3zs] {
    margin-top: 48px;
    display: flex;
    gap: 32px;
    flex-wrap: wrap;
    align-items: center;
}
.lp-trust-item[b-m2kn39m3zs] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.97rem;
    color: rgba(255,255,255,0.5);
}

/* ===== BUTTONS ===== */
.lp-btn[b-m2kn39m3zs] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 13px 26px;
    border-radius: 8px;
    font-size: 0.97rem;
    font-weight: 600;
    text-decoration: none;
    border: none;
    cursor: pointer;
    transition: all 0.2s;
}
.lp-btn-primary[b-m2kn39m3zs] { background: var(--lp-brown); color: #fff; }
.lp-btn-primary:hover[b-m2kn39m3zs] { background: var(--lp-brown-lt); color: #fff; transform: translateY(-1px); box-shadow: 0 4px 20px rgba(156,126,98,0.3); }
.lp-btn-ghost[b-m2kn39m3zs] { background: transparent; color: #fff; border: 1px solid rgba(255,255,255,0.25); }
.lp-btn-ghost:hover[b-m2kn39m3zs] { border-color: rgba(255,255,255,0.5); background: rgba(255,255,255,0.05); color: #fff; }
.lp-btn-outline[b-m2kn39m3zs] { background: var(--lp-white); color: var(--lp-text); border: 1px solid var(--lp-border); }
.lp-btn-outline:hover[b-m2kn39m3zs] { border-color: var(--lp-brown); color: var(--lp-brown); }
.lp-btn-full[b-m2kn39m3zs] { width: 100%; justify-content: center; }

/* ===== PROBLEM / SOLUTION ===== */
.lp-prob[b-m2kn39m3zs] {
    background: var(--lp-warm);
    padding: 100px 0 80px;
}
.lp-prob-grid[b-m2kn39m3zs] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: start;
}
.lp-prob-title[b-m2kn39m3zs] { margin-bottom: 24px; color: var(--lp-muted); }
.lp-sol-title[b-m2kn39m3zs] { margin-bottom: 24px; color: var(--lp-blue-dark); }
.lp-list[b-m2kn39m3zs] { list-style: none; display: flex; flex-direction: column; gap: 16px; }
.lp-list li[b-m2kn39m3zs] { display: flex; gap: 12px; align-items: start; font-size: 1rem; font-weight: 300; color: var(--lp-muted); line-height: 1.5; }
.lp-icon-circle[b-m2kn39m3zs] {
    flex-shrink: 0;
    width: 24px; height: 24px;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    margin-top: 2px;
    font-size: 0.97rem; font-weight: 700;
}
.lp-icon-pain[b-m2kn39m3zs] { background: rgba(180,60,60,0.1); color: #b43c3c; }
.lp-icon-ok[b-m2kn39m3zs]   { background: rgba(61,138,94,0.1); color: #3d8a5e; }

/* ===== FEATURES GRID ===== */
.lp-features[b-m2kn39m3zs] {
    background: var(--lp-white);
    border-top: 1px solid var(--lp-border);
    border-bottom: 1px solid var(--lp-border);
}
.lp-section-hd[b-m2kn39m3zs] { text-align: center; margin-bottom: 64px; }
.lp-section-hd h2[b-m2kn39m3zs] { margin-bottom: 12px; }
.lp-section-hd p[b-m2kn39m3zs] { color: var(--lp-muted); font-weight: 300; font-size: 1.05rem; max-width: 560px; margin: 0 auto; line-height: 1.7; }

.lp-feat-grid[b-m2kn39m3zs] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.lp-feat-card[b-m2kn39m3zs] {
    background: var(--lp-warm);
    border: 1px solid var(--lp-border);
    border-radius: 12px;
    padding: 32px;
    cursor: default;
    transition: all 0.25s;
}
.lp-feat-card:hover[b-m2kn39m3zs] { border-color: var(--lp-brown); box-shadow: 0 4px 24px rgba(156,126,98,0.1); transform: translateY(-2px); }
.lp-feat-icon[b-m2kn39m3zs] {
    width: 48px; height: 48px;
    border-radius: 10px;
    background: var(--lp-blue-dark);
    display: flex; align-items: center; justify-content: center;
    margin-bottom: 20px;
    color: #fff;
    flex-shrink: 0;
}
.lp-feat-card h3[b-m2kn39m3zs] { margin-bottom: 10px; color: var(--lp-text); }
.lp-feat-card p[b-m2kn39m3zs] { color: var(--lp-muted); font-size: 0.97rem; font-weight: 300; line-height: 1.6; }

/* ===== INTEGRATION ===== */
.lp-int[b-m2kn39m3zs] { background: var(--lp-warm); border-bottom: 1px solid var(--lp-border); }
.lp-int-hd[b-m2kn39m3zs] { text-align: center; max-width: 800px; margin: 0 auto 48px; }
.lp-int-hd h2[b-m2kn39m3zs] { margin-bottom: 16px; }
.lp-int-hd > p[b-m2kn39m3zs] { color: var(--lp-muted); font-weight: 300; font-size: 1.05rem; line-height: 1.7; }
.lp-int-grid[b-m2kn39m3zs] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin-bottom: 40px; }
.lp-int-card[b-m2kn39m3zs] {
    background: var(--lp-white);
    border: 1px solid var(--lp-border);
    border-radius: 12px;
    padding: 28px 20px;
    text-align: center;
    transition: all 0.25s;
}
.lp-int-card:hover[b-m2kn39m3zs] { border-color: var(--lp-blue-mid); box-shadow: 0 2px 16px rgba(50,81,110,0.08); }
.lp-int-ico[b-m2kn39m3zs] {
    width: 44px; height: 44px;
    border-radius: 10px;
    background: var(--lp-blue-pale);
    color: var(--lp-blue-dark);
    display: flex; align-items: center; justify-content: center;
    margin: 0 auto 14px;
}
.lp-int-card h4[b-m2kn39m3zs] { font-size: 0.97rem; margin-bottom: 6px; color: var(--lp-text); }
.lp-int-card p[b-m2kn39m3zs] { font-size: 0.97rem; font-weight: 300; color: var(--lp-light); line-height: 1.5; }
.lp-int-note[b-m2kn39m3zs] {
    font-size: 0.97rem;
    font-weight: 300;
    color: var(--lp-muted);
    background: var(--lp-white);
    border: 1px solid var(--lp-border);
    border-radius: 10px;
    padding: 20px 28px;
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
}
.lp-int-note svg[b-m2kn39m3zs] { flex-shrink: 0; color: var(--lp-brown); }

/* ===== DEEP DIVE ===== */
.lp-deep[b-m2kn39m3zs] { padding: 100px 0; }
.lp-deep-alt[b-m2kn39m3zs] { background: var(--lp-white); border-top: 1px solid var(--lp-border); border-bottom: 1px solid var(--lp-border); }
.lp-deep-grid[b-m2kn39m3zs] { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: center; }
.lp-deep-grid.lp-rev[b-m2kn39m3zs] { direction: rtl; }
.lp-deep-grid.lp-rev > *[b-m2kn39m3zs] { direction: ltr; }
.lp-overline[b-m2kn39m3zs] { font-size: 0.97rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.08em; color: var(--lp-brown); margin-bottom: 12px; }
.lp-deep-text h2[b-m2kn39m3zs] { margin-bottom: 16px; }
.lp-deep-text > p[b-m2kn39m3zs] { color: var(--lp-muted); font-weight: 300; margin-bottom: 28px; font-size: 1.02rem; line-height: 1.7; }
.lp-deep-feats[b-m2kn39m3zs] { display: flex; flex-direction: column; gap: 16px; }
.lp-df-item[b-m2kn39m3zs] { display: flex; gap: 14px; align-items: start; }
.lp-df-ico[b-m2kn39m3zs] {
    flex-shrink: 0;
    width: 32px; height: 32px;
    border-radius: 8px;
    background: rgba(156,126,98,0.12);
    display: flex; align-items: center; justify-content: center;
    color: var(--lp-brown);
    margin-top: 2px;
}
.lp-df-item strong[b-m2kn39m3zs] { display: block; font-size: 0.97rem; font-weight: 600; margin-bottom: 2px; color: var(--lp-text); }
.lp-df-item span[b-m2kn39m3zs] { font-size: 0.97rem; font-weight: 300; color: var(--lp-muted); line-height: 1.5; }

/* mock UI visual */
.lp-visual[b-m2kn39m3zs] {
    background: var(--lp-blue-dark);
    border-radius: 16px;
    padding: 36px;
    min-height: 360px;
    display: flex; align-items: center; justify-content: center;
    position: relative; overflow: hidden;
}
.lp-visual[b-m2kn39m3zs]::before {
    content: '';
    position: absolute; inset: 0;
    background: radial-gradient(circle at 30% 70%, rgba(156,126,98,0.1), transparent 60%);
}
.lp-mock[b-m2kn39m3zs] { position: relative; z-index: 1; width: 100%; color: #fff; }
.lp-mock-hd[b-m2kn39m3zs] { display: flex; align-items: center; gap: 6px; margin-bottom: 16px; font-size: 0.72rem; font-weight: 400; opacity: 0.45; }
.lp-mock-dot[b-m2kn39m3zs] { width: 8px; height: 8px; border-radius: 50%; background: currentColor; }
.lp-mock-card[b-m2kn39m3zs] { background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.1); border-radius: 10px; padding: 20px; margin-bottom: 12px; }
.lp-mock-card-title[b-m2kn39m3zs] { font-size: 0.75rem; font-weight: 400; opacity: 0.45; margin-bottom: 10px; text-transform: uppercase; letter-spacing: 0.05em; }
.lp-mock-bar[b-m2kn39m3zs] { height: 8px; border-radius: 4px; background: rgba(255,255,255,0.08); margin-bottom: 8px; }
.lp-mock-fill[b-m2kn39m3zs] { height: 100%; border-radius: 4px; background: var(--lp-brown); }
.lp-mock-row[b-m2kn39m3zs] { display: flex; gap: 10px; margin-bottom: 8px; align-items: center; }
.lp-mock-avatar[b-m2kn39m3zs] { width: 28px; height: 28px; border-radius: 50%; background: rgba(255,255,255,0.1); flex-shrink: 0; }
.lp-mock-line[b-m2kn39m3zs] { height: 6px; border-radius: 3px; background: rgba(255,255,255,0.08); flex: 1; }
.lp-mock-badge[b-m2kn39m3zs] { font-size: 0.68rem; font-weight: 500; padding: 3px 8px; border-radius: 4px; background: rgba(61,138,94,0.2); color: #5ee685; flex-shrink: 0; }
.lp-mock-badge-w[b-m2kn39m3zs] { background: rgba(156,126,98,0.25); color: var(--lp-brown-lt); }

/* ===== TRUST BANNER ===== */
.lp-trust[b-m2kn39m3zs] {
    background: var(--lp-blue-dark);
    color: #fff;
    padding: 90px 0;
    position: relative; overflow: hidden;
}
.lp-trust[b-m2kn39m3zs]::before { content: ''; position: absolute; inset: 0; background: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23ffffff' fill-opacity='0.02'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/svg%3E"); }
.lp-trust-inner[b-m2kn39m3zs] { position: relative; z-index: 1; text-align: center; }
.lp-trust-inner h2[b-m2kn39m3zs] { margin-bottom: 12px; color: #fff; }
.lp-trust-inner > p[b-m2kn39m3zs] { color: rgba(255,255,255,0.6); font-weight: 300; max-width: 600px; margin: 0 auto 48px; font-size: 1.05rem; }
.lp-trust-grid[b-m2kn39m3zs] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; max-width: 900px; margin: 0 auto; }
.lp-trust-card[b-m2kn39m3zs] { background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.08); border-radius: 12px; padding: 28px 20px; text-align: center; }
.lp-trust-card svg[b-m2kn39m3zs] { margin-bottom: 14px; color: var(--lp-brown-lt); }
.lp-trust-card h4[b-m2kn39m3zs] { font-size: 0.97rem; margin-bottom: 6px; color: #fff; }
.lp-trust-card p[b-m2kn39m3zs] { font-size: 0.97rem; font-weight: 300; color: rgba(255,255,255,0.5); line-height: 1.5; }

/* ===== PRICING ===== */
.lp-pricing[b-m2kn39m3zs] { background: var(--lp-warm); }
.lp-pricing-grid[b-m2kn39m3zs] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; max-width: 1140px; margin: 0 auto; align-items: start; }
.lp-price-card[b-m2kn39m3zs] { background: var(--lp-white); border: 1px solid var(--lp-border); border-radius: 16px; padding: 40px; }
.lp-price-card-featured[b-m2kn39m3zs] { border-color: var(--lp-brown); box-shadow: 0 4px 32px rgba(156,126,98,0.12); position: relative; }
.lp-price-badge[b-m2kn39m3zs] {
    position: absolute;
    top: -12px; left: 50%;
    transform: translateX(-50%);
    background: var(--lp-brown);
    color: #fff;
    font-size: 0.97rem; font-weight: 600;
    padding: 4px 16px;
    border-radius: 100px;
    white-space: nowrap;
}
.lp-price-label[b-m2kn39m3zs] { font-size: 0.97rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.06em; color: var(--lp-muted); margin-bottom: 8px; }
.lp-price-amount[b-m2kn39m3zs] { display: flex; align-items: baseline; gap: 6px; margin-bottom: 4px; }
.lp-price-num[b-m2kn39m3zs] { font-size: 3rem; font-weight: 700; color: var(--lp-blue-dark); line-height: 1; }
.lp-price-cur[b-m2kn39m3zs] { font-size: 1.1rem; font-weight: 600; color: var(--lp-muted); }
.lp-price-period[b-m2kn39m3zs] { font-size: 0.97rem; font-weight: 300; color: var(--lp-muted); margin-bottom: 6px; }
.lp-price-alt[b-m2kn39m3zs] { font-size: 0.97rem; font-weight: 300; color: var(--lp-light); margin-bottom: 24px; }
.lp-price-feats[b-m2kn39m3zs] { list-style: none; display: flex; flex-direction: column; gap: 10px; margin-bottom: 28px; }
.lp-price-feats li[b-m2kn39m3zs] { display: flex; gap: 10px; align-items: center; font-size: 0.97rem; font-weight: 400; }
.lp-price-feats li svg[b-m2kn39m3zs] { flex-shrink: 0; color: var(--lp-success); }

/* ===== ONBOARDING ===== */
.lp-onboard[b-m2kn39m3zs] { background: var(--lp-white); border-top: 1px solid var(--lp-border); }
.lp-onboard-grid[b-m2kn39m3zs] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.lp-ob-card[b-m2kn39m3zs] { border: 1px solid var(--lp-border); border-radius: 12px; padding: 32px; text-align: center; background: var(--lp-warm); transition: all 0.25s; display: flex; flex-direction: column; }
.lp-ob-card-hl[b-m2kn39m3zs] { border-color: var(--lp-brown); background: var(--lp-white); box-shadow: 0 4px 24px rgba(156,126,98,0.1); }
.lp-ob-card h3[b-m2kn39m3zs] { margin-bottom: 4px; }
.lp-ob-price[b-m2kn39m3zs] { font-size: 2rem; font-weight: 700; color: var(--lp-blue-dark); margin: 16px 0 4px; }
.lp-ob-note[b-m2kn39m3zs] { font-size: 0.97rem; font-weight: 300; color: var(--lp-light); margin-bottom: 20px; }
.lp-ob-feats[b-m2kn39m3zs] { list-style: none; text-align: left; display: flex; flex-direction: column; gap: 8px; margin-bottom: 24px; flex: 1; }
.lp-ob-feats li[b-m2kn39m3zs] { display: flex; gap: 8px; align-items: start; font-size: 0.97rem; font-weight: 300; color: var(--lp-muted); }
.lp-ob-feats li svg[b-m2kn39m3zs] { flex-shrink: 0; margin-top: 3px; color: var(--lp-success); }

/* ===== CTA FINAL ===== */
.lp-cta[b-m2kn39m3zs] {
    background: linear-gradient(170deg, #28455e, var(--lp-blue-dark));
    color: #fff;
    padding: 100px 0;
    text-align: center;
    position: relative; overflow: hidden;
}
.lp-cta[b-m2kn39m3zs]::before { content: ''; position: absolute; top: -50%; left: 50%; transform: translateX(-50%); width: 120%; height: 200%; background: radial-gradient(ellipse, rgba(156,126,98,0.06), transparent 60%); }
.lp-cta .lp-container[b-m2kn39m3zs] { position: relative; z-index: 1; }
.lp-cta h2[b-m2kn39m3zs] { margin-bottom: 16px; color: #fff; }
.lp-cta-sub[b-m2kn39m3zs] { color: rgba(255,255,255,0.6); max-width: 540px; margin: 0 auto 36px; font-size: 1.08rem; font-weight: 300; line-height: 1.7; }
.lp-cta-row[b-m2kn39m3zs] { display: flex; gap: 16px; justify-content: center; flex-wrap: wrap; }

/* ===== FOOTER ===== */
.lp-footer[b-m2kn39m3zs] { background: #1e3348; color: rgba(255,255,255,0.4); padding: 40px 0; font-size: 0.85rem; border-top: 1px solid rgba(255,255,255,0.06); }
.lp-footer-inner[b-m2kn39m3zs] { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 16px; }
.lp-footer-links[b-m2kn39m3zs] { display: flex; gap: 24px; flex-wrap: wrap; }
.lp-footer-links a[b-m2kn39m3zs] { color: rgba(255,255,255,0.4); text-decoration: none; transition: color 0.2s; }
.lp-footer-links a:hover[b-m2kn39m3zs] { color: var(--lp-brown-lt); }

/* ===== RESPONSIVE ===== */
@media (max-width: 900px) {
    .lp-nav-links .lp-nav-link[b-m2kn39m3zs] { display: none; }
    .lp-prob-grid[b-m2kn39m3zs], .lp-deep-grid[b-m2kn39m3zs], .lp-pricing-grid[b-m2kn39m3zs] { grid-template-columns: 1fr; gap: 40px; }
    .lp-deep-grid.lp-rev[b-m2kn39m3zs] { direction: ltr; }
    .lp-feat-grid[b-m2kn39m3zs], .lp-trust-grid[b-m2kn39m3zs], .lp-int-grid[b-m2kn39m3zs] { grid-template-columns: repeat(2,1fr); }
    .lp-onboard-grid[b-m2kn39m3zs] { grid-template-columns: 1fr; max-width: 420px; margin: 0 auto; }
}

@media (max-width: 600px) {
    .lp-section[b-m2kn39m3zs] { padding: 64px 0; }
    .lp-feat-grid[b-m2kn39m3zs], .lp-trust-grid[b-m2kn39m3zs], .lp-int-grid[b-m2kn39m3zs] { grid-template-columns: 1fr; }
    .lp-hero-trust[b-m2kn39m3zs] { flex-direction: column; gap: 16px; }
    .lp-nav-name[b-m2kn39m3zs] { display: none; }
    /* Globe icon alone still opens the language menu; the label is what overflows. */
    .lp-locale-label[b-m2kn39m3zs] { display: none; }
    .lp-nav-inner[b-m2kn39m3zs] { gap: 12px; }
    .lp-nav[b-m2kn39m3zs] { padding: 0 16px; }
}

/* ===== MOBILE NAV DRAWER ===== */
/* The six nav links are hidden below 900px (see above). Without a drawer the
   landing page has no navigation at all on a phone. */
.lp-burger[b-m2kn39m3zs] {
    display: none;
    background: none;
    border: 1px solid var(--lp-border);
    border-radius: 6px;
    color: var(--lp-blue-dark);
    padding: 5px 8px;
    line-height: 0;
    cursor: pointer;
}
.lp-burger:hover[b-m2kn39m3zs] { border-color: var(--lp-blue-mid); background: var(--lp-blue-pale); }

.lp-drawer[b-m2kn39m3zs] {
    border-top: 1px solid var(--lp-border);
    padding: 8px 0 14px;
    background: #fff;
}
.lp-drawer-link[b-m2kn39m3zs] {
    display: block;
    padding: 12px 4px;
    color: var(--lp-blue-dark);
    text-decoration: none;
    font-size: 1rem;
    border-bottom: 1px solid #f0eeea;
}
.lp-drawer-link:last-child[b-m2kn39m3zs] { border-bottom: none; }
.lp-drawer-link:hover[b-m2kn39m3zs] { background: var(--lp-blue-pale); }

@media (max-width: 900px) {
    .lp-burger[b-m2kn39m3zs] { display: block; }
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
#blazor-error-ui[b-060c9zjyws] {
    color-scheme: light only;
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-060c9zjyws] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* /Components/Layout/PublicLayout.razor.rz.scp.css */
/* Chrome for the public marketing pages. Previously all inline style="..."
   attributes, which cannot carry a media query - that is why these pages had
   no mobile layout at all. NOTE: single @media here. A .razor.css file is
   plain CSS, not Razor, so @@media is invalid and silently dropped. */

.pl-root[b-evgy00mn81] {
    font-family: 'Barlow', 'Aptos', 'Segoe UI', sans-serif;
    background: #f9f8f6;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}
.pl-body[b-evgy00mn81] { flex: 1; }

/* nav */
.pl-nav[b-evgy00mn81] {
    position: sticky;
    top: 0;
    z-index: 100;
    background: #fff;
    border-bottom: 1px solid #e0ddd8;
    padding: 0 24px;
    box-shadow: 0 1px 8px rgba(50,81,110,0.07);
}
.pl-nav-inner[b-evgy00mn81] {
    max-width: 1320px;
    margin: 0 auto;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}
.pl-brand[b-evgy00mn81] { display: flex; align-items: center; gap: 10px; text-decoration: none; flex-shrink: 0; }
.pl-brand-logo[b-evgy00mn81] { height: 32px; }
.pl-brand-name[b-evgy00mn81] { font-size: 1.2rem; font-weight: 700; color: #32516E; letter-spacing: -0.5px; }

.pl-links[b-evgy00mn81] { display: flex; align-items: center; gap: 4px; }
.pl-link[b-evgy00mn81] {
    color: #5a6d7e;
    text-decoration: none;
    font-size: clamp(0.92rem, 1.1vw, 1.02rem);
    font-weight: 400;
    padding: 6px 14px;
    border-radius: 6px;
    white-space: nowrap;
}
.pl-link:hover[b-evgy00mn81] { color: #32516E; background: #e8eef4; }

.pl-actions[b-evgy00mn81] { display: flex; align-items: center; gap: 10px; }

.pl-locale-wrap[b-evgy00mn81] { position: relative; }
.pl-locale-btn[b-evgy00mn81] {
    background: #e8eef4;
    border: 1px solid #e0ddd8;
    color: #5a6d7e;
    font-size: 0.82rem;
    padding: 5px 12px;
    border-radius: 6px;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
}
.pl-locale-menu[b-evgy00mn81] {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    background: #fff;
    border: 1px solid #e0ddd8;
    border-radius: 8px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.12);
    min-width: 110px;
    overflow: hidden;
    z-index: 200;
}
.pl-locale-item[b-evgy00mn81] {
    display: block;
    width: 100%;
    padding: 9px 16px;
    background: none;
    border: none;
    text-align: left;
    font-size: 0.88rem;
    cursor: pointer;
}
.pl-locale-item:hover[b-evgy00mn81] { background: #e8eef4; }

.pl-login[b-evgy00mn81] {
    color: #32516E;
    text-decoration: none;
    font-size: 0.88rem;
    font-weight: 500;
    padding: 6px 14px;
    border: 1px solid #e0ddd8;
    border-radius: 6px;
    white-space: nowrap;
}
.pl-cta[b-evgy00mn81] {
    background: #9c7e62;
    color: #fff;
    text-decoration: none;
    font-size: 0.88rem;
    font-weight: 600;
    padding: 8px 18px;
    border-radius: 6px;
    white-space: nowrap;
}
.pl-cta:hover[b-evgy00mn81] { background: #b89a7a; color: #fff; }

/* Burger is desktop-hidden; the drawer only ever renders below the breakpoint. */
.pl-burger[b-evgy00mn81] {
    display: none;
    background: none;
    border: 1px solid #e0ddd8;
    border-radius: 6px;
    color: #32516E;
    font-size: 1.15rem;
    line-height: 1;
    padding: 5px 10px;
    cursor: pointer;
}

.pl-drawer[b-evgy00mn81] {
    display: none;
    border-top: 1px solid #e0ddd8;
    padding: 8px 0 14px;
}
.pl-drawer-link[b-evgy00mn81] {
    display: block;
    padding: 11px 4px;
    color: #32516E;
    text-decoration: none;
    font-size: 1rem;
    border-bottom: 1px solid #f0eeea;
}
.pl-drawer-sep[b-evgy00mn81] { height: 10px; }
.pl-drawer-locales[b-evgy00mn81] { display: flex; gap: 8px; padding: 12px 4px 0; }
.pl-drawer-locale[b-evgy00mn81] {
    flex: 1;
    padding: 9px 12px;
    background: #f9f8f6;
    border: 1px solid #e0ddd8;
    border-radius: 6px;
    font-size: 0.9rem;
    cursor: pointer;
    color: #5a6d7e;
}
.pl-drawer-locale.active[b-evgy00mn81] { background: #e8eef4; color: #32516E; font-weight: 600; }

/* footer */
.pl-footer[b-evgy00mn81] {
    background: #1e3348;
    color: rgba(255,255,255,0.4);
    padding: 40px 0;
    font-size: 0.85rem;
    border-top: 1px solid rgba(255,255,255,0.06);
}
.pl-footer-inner[b-evgy00mn81] {
    max-width: 1140px;
    margin: 0 auto;
    padding: 0 24px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 16px;
}
.pl-footer-links[b-evgy00mn81] { display: flex; gap: 24px; flex-wrap: wrap; }
.pl-footer-links a[b-evgy00mn81] { color: rgba(255,255,255,0.4); text-decoration: none; }

/* Below this width the six links plus locale, login and CTA cannot fit on one
   row. Links, locale and login move into the drawer; the CTA stays visible. */
@media (max-width: 900px) {
    .pl-links[b-evgy00mn81] { display: none; }
    .pl-desktop-only[b-evgy00mn81] { display: none; }
    .pl-burger[b-evgy00mn81] { display: block; }
    .pl-drawer[b-evgy00mn81] { display: block; }
}

@media (max-width: 600px) {
    .pl-nav[b-evgy00mn81] { padding: 0 16px; }
    .pl-nav-inner[b-evgy00mn81] { gap: 12px; }
    .pl-brand-name[b-evgy00mn81] { display: none; }
    .pl-cta[b-evgy00mn81] { padding: 8px 14px; }
    .pl-footer-inner[b-evgy00mn81] { flex-direction: column; align-items: flex-start; gap: 20px; }
    .pl-footer-links[b-evgy00mn81] { gap: 14px 20px; }
}
/* /Components/Pages/CalendarPage.razor.rz.scp.css */
/* Full-height page: the calendar fills what is left below the header instead of stopping at a fixed
   fraction of the viewport. Same shape as ResourceScheduler.razor.css - flex column, viewport height
   minus the navbar, and min-height:0 so the children may shrink and scroll. */
.cal-page[b-yq3djvpkcl] {
    display: flex;
    flex-direction: column;
    height: calc(100vh - 60px); /* navbar height */
    min-height: 0;
}
.cal-swatch[b-yq3djvpkcl] {
    display: inline-block;
    width: .7rem;
    height: .7rem;
    border-radius: 2px;
    margin-right: .35rem;
    vertical-align: baseline;
}

.cal-people-list[b-yq3djvpkcl] {
    max-height: 200px;
    overflow-y: auto;
}
/* /Components/Pages/EntityList.razor.rz.scp.css */
/* Resizable, fixed-layout list table: columns keep their set width and over-long content is hidden
   (ellipsis) instead of wrapping. Editable cells opt out of truncation so their inline editors and
   dropdowns are never clipped. */

.entity-list-table[b-nbnzdxonf2] {
    /* table-layout/width are set inline on the element; nothing needed here. */
}

/* Read-only data cells: one line, clip the overflow with an ellipsis. */
.entity-list-table td.el-truncate[b-nbnzdxonf2] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Header labels stay on one line and ellipsis within the column (the column menu is a separate
   absolutely-positioned child, so the header itself must NOT be overflow:hidden or it would clip it). */
.entity-list-table th .el-th-label[b-nbnzdxonf2] {
    display: inline-block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    vertical-align: bottom;
}

.entity-list-table th.el-th-static[b-nbnzdxonf2] {
    white-space: nowrap;
}

/* Drag handle on a column's right edge. */
.entity-list-table th .el-col-resize[b-nbnzdxonf2] {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 6px;
    cursor: col-resize;
    z-index: 3;
    touch-action: none;
}

.entity-list-table th .el-col-resize:hover[b-nbnzdxonf2] {
    background: var(--bs-primary, #0d6efd);
    opacity: 0.35;
}
/* /Components/Pages/GanttChart.razor.rz.scp.css */
/* ===== Gantt wrapper ===== */
.gantt-wrapper[b-qzlbx2f8r0] {
    display: flex;
    flex-direction: column;
    height: calc(100vh - 160px);
    gap: 0;
}

/* ===== Fullscreen ===== */
.gantt-fullscreen[b-qzlbx2f8r0] {
    position: fixed !important;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1050;
    background: #fff;
    padding: 0.75rem 1rem;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    height: 100vh !important;
}

.gantt-fullscreen .gantt-wrapper[b-qzlbx2f8r0] {
    height: 0;
    flex: 1 1 0;
}

.gantt-embed .gantt-wrapper[b-qzlbx2f8r0] {
    height: auto;
    flex: 1;
    min-height: 300px;
    gap: 0;
}

.gantt-container[b-qzlbx2f8r0] {
    border: 1px solid #dee2e6;
    border-radius: 0.5rem;
    overflow: hidden;
    background: #fff;
    flex: 1 1 0;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

/* ===== Timeline header ===== */
.gantt-timeline[b-qzlbx2f8r0] {
    display: flex;
    flex-shrink: 0;
    background: #f8f9fa;
    border-bottom: 2px solid #dee2e6;
}

.gantt-timeline-clip[b-qzlbx2f8r0] {
    flex: 1;
    overflow: hidden;
}

.gantt-timeline-cells[b-qzlbx2f8r0] {
    display: flex;
}

.gantt-timeline-cell[b-qzlbx2f8r0] {
    flex-shrink: 0;
    text-align: center;
    font-size: 0.72rem;
    font-weight: 600;
    padding: 0.4rem 0;
    border-right: 1px solid #e9ecef;
    color: #495057;
    white-space: nowrap;
    overflow: hidden;
}

.gantt-timeline-cell-today[b-qzlbx2f8r0] {
    background: rgba(13, 110, 253, 0.08);
    color: #0d6efd;
}

.gantt-timeline-cell-group[b-qzlbx2f8r0] {
    box-shadow: inset 2px 0 0 #ced4da;
    overflow: visible;
    position: relative;
    z-index: 1;
    text-align: left;
    padding-left: 4px;
}

/* ===== Task label (sticky left column) ===== */
.gantt-task-label[b-qzlbx2f8r0] {
    flex-shrink: 0;
    width: 12.5rem;
    min-width: 12.5rem;
    padding: 0.3rem 0.6rem;
    font-size: 0.78rem;
    background: #f8f9fa;
    border-right: 2px solid #dee2e6;
    position: sticky;
    left: 0;
    z-index: 2;
    display: flex;
    flex-direction: column;
    justify-content: center;
    overflow: hidden;
}

.gantt-task-label-text[b-qzlbx2f8r0] {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-weight: 500;
}

.gantt-task-assignee[b-qzlbx2f8r0] {
    font-size: 0.68rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.gantt-corner[b-qzlbx2f8r0] {
    border-bottom: none;
}

/* ===== Scroll area ===== */
.gantt-scroll-area[b-qzlbx2f8r0] {
    overflow-x: auto;
    overflow-y: auto;
    flex: 1;
    min-height: 0;
}

.gantt-body[b-qzlbx2f8r0] {
    position: relative;
}

/* ===== Task rows ===== */
.gantt-row[b-qzlbx2f8r0] {
    display: flex;
    border-bottom: 1px solid #f0f0f0;
    width: fit-content;
    min-width: 100%;
}

.gantt-row:hover .gantt-task-label[b-qzlbx2f8r0] {
    background: #e9ecef;
}

.gantt-row-cells[b-qzlbx2f8r0] {
    position: relative;
    flex-shrink: 0;
}

/* ===== Grid cells ===== */
.gantt-cell[b-qzlbx2f8r0] {
    position: absolute;
    top: 0;
    height: 100%;
    border-right: 1px solid #f0f0f0;
    box-sizing: border-box;
}

.gantt-cell-today[b-qzlbx2f8r0] {
    background: rgba(13, 110, 253, 0.04);
}

.gantt-cell-weekend[b-qzlbx2f8r0] {
    background: rgba(0, 0, 0, 0.02);
}

.gantt-cell-group[b-qzlbx2f8r0] {
    border-left: 1px solid #dee2e6;
}

/* ===== Task bar ===== */
.gantt-bar[b-qzlbx2f8r0] {
    position: absolute;
    border-radius: 4px;
    cursor: pointer;
    display: flex;
    align-items: center;
    padding: 0 6px;
    font-size: 0.7rem;
    color: #fff;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    z-index: 1;
    transition: opacity 0.15s;
}

.gantt-bar:hover[b-qzlbx2f8r0] {
    opacity: 0.85;
}

.gantt-bar-resize-handle[b-qzlbx2f8r0] {
    position: absolute;
    right: 0;
    top: 0;
    width: 6px;
    height: 100%;
    cursor: ew-resize;
    border-radius: 0 4px 4px 0;
    background: rgba(255,255,255,0.25);
    opacity: 0;
    transition: opacity 0.15s;
}

.gantt-bar:hover .gantt-bar-resize-handle[b-qzlbx2f8r0] {
    opacity: 1;
}

.gantt-bar-text[b-qzlbx2f8r0] {
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Priority-based colors */
.gantt-bar-normal[b-qzlbx2f8r0] {
    background: #0d6efd;
}

.gantt-bar-high[b-qzlbx2f8r0] {
    background: #fd7e14;
}

.gantt-bar-critical[b-qzlbx2f8r0] {
    background: #dc3545;
}

.gantt-bar-low[b-qzlbx2f8r0] {
    background: #6c757d;
}

/* ===== Link handle (dependency connector) ===== */
.gantt-bar-link-handle[b-qzlbx2f8r0] {
    position: absolute;
    right: -5px;
    top: 50%;
    transform: translateY(-50%);
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #6c757d;
    border: 2px solid #fff;
    cursor: crosshair;
    opacity: 0;
    transition: opacity 0.15s;
    z-index: 3;
}

.gantt-bar:hover .gantt-bar-link-handle[b-qzlbx2f8r0] {
    opacity: 1;
}

.gantt-bar-link-handle:hover[b-qzlbx2f8r0] {
    background: #0d6efd;
    transform: translateY(-50%) scale(1.3);
}

/* ===== Dependency arrows (SVG overlay) ===== */
.gantt-arrow[b-qzlbx2f8r0] {
    z-index: 0;
}

/* ===== Settings panel ===== */
.gantt-settings-backdrop[b-qzlbx2f8r0] {
    position: fixed;
    inset: 0;
    z-index: 5;
}

.gantt-settings-panel[b-qzlbx2f8r0] {
    position: absolute;
    left: 0;
    top: calc(100% + 4px);
    z-index: 6;
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0.5rem;
    padding: 1rem 1.25rem;
    min-width: 260px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
}

/* ===== Embed tweaks ===== */
.gantt-embed .gantt-task-label[b-qzlbx2f8r0] {
    width: 160px;
    min-width: 160px;
}

/* ===== Work Area group header ===== */
.gantt-area-header[b-qzlbx2f8r0] {
    background: #e9ecef;
}

.gantt-area-header .gantt-row-cells[b-qzlbx2f8r0] {
    background: #e9ecef;
}

.gantt-area-label[b-qzlbx2f8r0] {
    background: #e9ecef;
    font-weight: 600;
    font-size: 0.8rem;
    color: #212529;
}

.gantt-row-drop-target[b-qzlbx2f8r0] {
    background: rgba(13, 110, 253, 0.08);
    box-shadow: inset 0 -2px 0 #0d6efd;
}

.gantt-row-drop-target .gantt-task-label[b-qzlbx2f8r0] {
    background: rgba(13, 110, 253, 0.08);
}

/* ===== Create-drag selection ===== */
.gantt-create-selection[b-qzlbx2f8r0] {
    position: absolute;
    background: rgba(13, 110, 253, 0.15);
    border: 2px dashed #0d6efd;
    border-radius: 4px;
    z-index: 3;
    pointer-events: none;
}

/* ===== Ghost bar during drag ===== */
.gantt-bar-ghost[b-qzlbx2f8r0] {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
    pointer-events: none;
}
/* /Components/Pages/KanbanBoard.razor.rz.scp.css */
/* ===== Fullscreen overlay ===== */
.kanban-fullscreen[b-70ijgxcc6n] {
    position: fixed !important;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1050;
    margin: 0 !important;
    padding: 1rem;
    background: #fff;
    overflow: auto;
}

.kanban-fullscreen .kanban-board[b-70ijgxcc6n] {
    min-height: 0;
    height: calc(100vh - 7rem);
}

.kanban-fullscreen .kanban-column[b-70ijgxcc6n] {
    max-height: calc(100vh - 10rem);
}

.kanban-board[b-70ijgxcc6n] {
    display: flex;
    gap: 1rem;
    overflow-x: auto;
    padding-bottom: 1rem;
    min-height: 60vh;
    align-items: flex-start;
}

.kanban-embed .kanban-board[b-70ijgxcc6n] {
    min-height: 0;
    flex: 1;
}

.kanban-column[b-70ijgxcc6n] {
    flex: 0 0 17.5rem;
    min-width: 17.5rem;
    background: #f8f9fa;
    border-radius: var(--radius-md, 0.5rem);
    display: flex;
    flex-direction: column;
    max-height: calc(100vh - 12.5rem);
}

.kanban-embed .kanban-column[b-70ijgxcc6n] {
    max-height: none;
}

.kanban-column-header[b-70ijgxcc6n] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem 1rem;
    font-weight: 600;
    font-size: 0.9rem;
    border-bottom: 2px solid #dee2e6;
    position: sticky;
    top: 0;
    background: #f8f9fa;
    border-radius: 0.5rem 0.5rem 0 0;
    z-index: 1;
}

.kanban-column-title[b-70ijgxcc6n] {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.kanban-column-body[b-70ijgxcc6n] {
    flex: 1;
    overflow-y: auto;
    padding: 0.75rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    min-height: 80px;
}

.kanban-card[b-70ijgxcc6n] {
    background: #fff;
    border-radius: 0.375rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    cursor: pointer;
    display: flex;
    flex-shrink: 0;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
    /* The drag is pointer-event driven, so the browser must not claim the gesture for
       panning or text selection. */
    touch-action: none;
    user-select: none;
}

    .kanban-card:hover[b-70ijgxcc6n] {
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
    }

    .kanban-card:active[b-70ijgxcc6n] {
        cursor: grabbing;
    }

.kanban-card-color-bar[b-70ijgxcc6n] {
    width: 4px;
    flex-shrink: 0;
}

.kanban-color-primary[b-70ijgxcc6n] {
    background-color: #0d6efd;
}

.kanban-color-success[b-70ijgxcc6n] {
    background-color: #198754;
}

.kanban-color-warning[b-70ijgxcc6n] {
    background-color: #ffc107;
}

.kanban-color-danger[b-70ijgxcc6n] {
    background-color: #dc3545;
}

.kanban-card-content[b-70ijgxcc6n] {
    flex: 1;
    padding: 0.625rem 0.75rem;
    min-width: 0;
}

.kanban-card-title[b-70ijgxcc6n] {
    font-weight: 500;
    font-size: 0.875rem;
    line-height: 1.3;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #212529;
}

.kanban-card-owner[b-70ijgxcc6n] {
    font-size: 0.775rem;
    color: #6c757d;
    margin-top: 0.25rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.kanban-card-badge[b-70ijgxcc6n]  .badge {
    font-size: 0.7rem;
    font-weight: 500;
}
/* /Components/Pages/MapView.razor.rz.scp.css */
/* ===== Normal mode: map fills viewport minus the app chrome ===== */
.map-page-normal[b-0cxwn1ksyf] {
    display: flex;
    flex-direction: column;
    height: calc(100vh - 70px); /* subtract top navbar */
    gap: 0;
}

/* ===== Fullscreen overlay: cover entire viewport ===== */
.map-page-fullscreen[b-0cxwn1ksyf] {
    position: fixed !important;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1050;
    background: #fff;
    display: flex;
    flex-direction: column;
    padding: 0.75rem;
    gap: 0;
}

/* ===== Toolbar: always visible, never scrolls away ===== */
.map-toolbar[b-0cxwn1ksyf] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
    flex-shrink: 0;
    padding-bottom: 0.75rem;
}

/* ===== Map canvas: flex-grow fills all remaining space ===== */
.map-canvas[b-0cxwn1ksyf] {
    flex: 1 1 0;
    min-height: 0;
    width: 100%;
    border-radius: 0.375rem;
    border: 1px solid var(--bs-border-color);
}
/* /Components/Pages/ResourceOrderEditor.razor.rz.scp.css */
[b-9ew9r7opvh] .resource-order-dragging {
    opacity: 0.4;
    background: var(--bs-primary-bg-subtle, #e7f1ff);
    border-left: 3px solid var(--bs-primary, #0d6efd) !important;
}

[b-9ew9r7opvh] .resource-order-item {
    transition: all 0.15s ease;
}
/* /Components/Pages/ResourceScheduler.razor.rz.scp.css */
/* ===== Gantt container ===== */

.scheduler-page[b-0ilph2umdh] {
    display: flex;
    flex-direction: column;
    height: calc(100vh - 60px); /* navbar height */
    min-height: 0;
}

.scheduler-page.scheduler-embed[b-0ilph2umdh] {
    height: auto;
    flex: 1 1 auto;
    min-height: 400px;
}

.scheduler-container[b-0ilph2umdh] {
    border: 1px solid #dee2e6;
    border-radius: 0.5rem;
    overflow: hidden;
    background: #fff;
    flex: 1 1 0;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

/* ===== Fullscreen ===== */
.scheduler-fullscreen[b-0ilph2umdh] {
    position: fixed !important;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1050;
    background: #fff;
    padding: 0.75rem 1rem;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    height: 100vh !important;
}

.scheduler-fullscreen .scheduler-wrapper[b-0ilph2umdh] {
    height: 0;
    flex: 1 1 0;
}

.scheduler-fullscreen .scheduler-month-wrapper[b-0ilph2umdh] {
    height: 0;
    flex: 1 1 0;
}

/* ===== Task selection ===== */
.scheduler-task-selected[b-0ilph2umdh] {
    outline: 2px solid #0d6efd;
    outline-offset: 1px;
    box-shadow: 0 0 0 3px rgba(13, 110, 253, 0.25);
}

.scheduler-wrapper[b-0ilph2umdh] {
    display: flex;
    flex-direction: column;
    flex: 1 1 0;
    min-height: 0;
    gap: 0.5rem;
}

.scheduler-embed .scheduler-wrapper[b-0ilph2umdh] {
    height: auto;
    flex: 1;
    min-height: 400px;
}

.scheduler-scroll-area[b-0ilph2umdh] {
    overflow-x: auto;
    overflow-y: auto;
    flex: 1;
    min-height: 0;
}

/* ===== Timeline header ===== */
.scheduler-timeline[b-0ilph2umdh] {
    display: flex;
    flex-shrink: 0;
    background: #f8f9fa;
    border-bottom: 2px solid #dee2e6;
    /* Lives outside .scheduler-scroll-area - no sticky needed, synced by JS */
}

.scheduler-timeline-clip[b-0ilph2umdh] {
    flex: 1;
    overflow: hidden;
}

.scheduler-timeline-cells[b-0ilph2umdh] {
    display: flex;
    flex-direction: column;
}

.scheduler-week-number-row[b-0ilph2umdh] {
    border-bottom: 1px solid #adb5bd;
}

/* Also carries the month band. A month cell spans its own columns, so a partial month at the edge of the
   window can be narrow - it truncates rather than spilling over its neighbour. */
.scheduler-week-number-cell[b-0ilph2umdh] {
    flex-shrink: 0;
    text-align: center;
    font-size: 0.72rem;
    font-weight: 700;
    padding: 0.15rem 0;
    border-right: 1px solid #adb5bd;
    color: #212529;
    background: #ced4da;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

/* Reorder grip in the frozen label. Dim until the row is hovered, so the column stays calm to read, but
   always present in the layout - appearing on hover would shift the name sideways. */
.scheduler-row-grip[b-0ilph2umdh] {
    flex-shrink: 0;
    margin-right: 0.35rem;
    color: #adb5bd;
    opacity: 0;
    cursor: grab;
    transition: opacity 0.1s;
}

.scheduler-resource-label:hover .scheduler-row-grip[b-0ilph2umdh] {
    opacity: 1;
}

.scheduler-row-grip:active[b-0ilph2umdh] {
    cursor: grabbing;
}

/* The row being dragged. The insertion line that goes with it is appended to document.body by the interop
   module and therefore carries no scope attribute, so it cannot be styled from here - it is styled inline
   in JS, like the lasso and the drag ghost. */
.scheduler-row-dragging[b-0ilph2umdh] {
    opacity: 0.5;
}

/* Search highlight. The search walks rows instead of filtering them, so the hits have to be visible
   against the rows that stay around them: every match gets a tint, the one currently walked to gets a
   border it cannot be confused with. */
.scheduler-row-search-match[b-0ilph2umdh] {
    background-color: rgba(255, 193, 7, 0.16) !important;
}

.scheduler-row-search-current[b-0ilph2umdh] {
    background-color: rgba(255, 193, 7, 0.32) !important;
    box-shadow: inset 0 0 0 2px #ffc107;
}

/* Weekday initial row (setting: Scheduler.ShowWeekdays). One letter per date column, so it aligns with
   the columns rather than spanning them like the week-number / month bands above it. */
.scheduler-weekday-row[b-0ilph2umdh] {
    border-bottom: 1px solid #ced4da;
}

.scheduler-weekday-cell[b-0ilph2umdh] {
    flex-shrink: 0;
    text-align: center;
    font-size: 0.68rem;
    font-weight: 600;
    color: #495057;
    background: #eef0f2;
    padding: 1px 0;
    border-right: 1px solid #ced4da;
}

.scheduler-timeline-cell[b-0ilph2umdh] {
    flex-shrink: 0;
    text-align: center;
    font-size: 0.8rem;
    font-weight: 700;
    padding: 0.5rem 0;
    border-right: 1px solid #ced4da;
    color: #212529;
}

.scheduler-timeline-cell-now[b-0ilph2umdh] {
    background: rgba(13, 110, 253, 0.08);
    color: #0d6efd;
}

.scheduler-timeline-cell-day-start[b-0ilph2umdh] {
    box-shadow: inset 2px 0 0 #ced4da;
    font-weight: 700;
}

/* ===== Resource label (sticky left column) ===== */
.scheduler-resource-label[b-0ilph2umdh] {
    flex-shrink: 0;
    width: 10rem;
    min-width: 10rem;
    padding: 0.4rem 0.75rem;
    font-size: 0.82rem;
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    background: #f8f9fa;
    border-right: 2px solid #dee2e6;
    position: sticky;
    left: 0;
    z-index: 10;
    display: flex;
    align-items: center;
}

/* Body row labels on white for stronger text contrast on large screens (the header corner stays grey). */
.scheduler-row .scheduler-resource-label[b-0ilph2umdh] {
    background: #fff;
    font-weight: 600;
    color: #212529;
}

.scheduler-corner[b-0ilph2umdh] {
    border-bottom: none;
}

/* ===== Grid body ===== */
.scheduler-grid-body[b-0ilph2umdh] {
    position: relative;
    /* Size to the full timeline width so each row's border-bottom (the horizontal grid line) spans the
       whole scrollable area, not just the viewport width at first paint. Without this the lines disappear
       past the initial viewport when scrolling right. */
    width: max-content;
    min-width: 100%;
}

/* ===== Group header row ===== */
.scheduler-group-header[b-0ilph2umdh] {
    display: flex;
    background: #f1f3f5;
    border-bottom: 1px solid #dee2e6;
    border-top: 2px solid #dee2e6;
    position: sticky;
    left: 0;
    z-index: 1;
}

.scheduler-group-label[b-0ilph2umdh] {
    font-size: 0.75rem;
    font-weight: 600;
    color: #495057;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    background: #f1f3f5;
}

.scheduler-group-header-fill[b-0ilph2umdh] {
    flex-shrink: 0;
    background: #f1f3f5;
}

/* ===== Resource row ===== */
.scheduler-row[b-0ilph2umdh] {
    display: flex;
    border-bottom: var(--grid-line-w, 1px) solid var(--grid-line-color, #ced4da);
}

.scheduler-row:last-child[b-0ilph2umdh] {
    border-bottom: none;
}

.scheduler-row-highlight[b-0ilph2umdh] {
    background: rgba(13, 110, 253, 0.06) !important;
}

/* ===== Row cells container ===== */
.scheduler-row-cells[b-0ilph2umdh] {
    position: relative;
    flex-shrink: 0;
    overflow: hidden;
    background-color: #fff;
    background-image: repeating-linear-gradient(
        to right,
        transparent 0,
        transparent calc(var(--col-w) - 1px),
        var(--grid-line-color, #ced4da) calc(var(--col-w) - 1px),
        var(--grid-line-color, #ced4da) var(--col-w)
    );
}

.scheduler-day-start-marker[b-0ilph2umdh] {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 2px;
    background: var(--grid-line-color, #adb5bd);
    pointer-events: none;
    z-index: 0;
}

/* "Today / now" marker: a full-height red line spanning all resource rows. Sits in the scrolling
   grid body so it tracks the columns, and below the sticky resource-label (z-index 10) so it tucks
   behind the frozen left column when scrolled. */
.scheduler-today-line[b-0ilph2umdh] {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 2px;
    margin-left: -1px;
    background: #dc3545;
    pointer-events: none;
    z-index: 6;
}

/* Weekend (Sat/Sun) columns in day view — darker, header-like tint + a clear band behind the bars. */
.scheduler-timeline-cell-weekend[b-0ilph2umdh] {
    background: #d5d9de;
}

.scheduler-weekend-col[b-0ilph2umdh] {
    position: absolute;
    top: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.08);
    pointer-events: none;
    z-index: 0;
}

/* Public holidays in day view — marked like weekends (a touch darker so a blocked weekday stands out). */
.scheduler-timeline-cell-holiday[b-0ilph2umdh] {
    background: #cfd3d9;
}

.scheduler-holiday-col[b-0ilph2umdh] {
    position: absolute;
    top: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.11);
    pointer-events: none;
    z-index: 0;
}

/* ===== Task bar ===== */
.scheduler-task[b-0ilph2umdh] {
    position: absolute;
    /* A thin dark edge: bars of the same colour sitting next to each other otherwise read as one long
       block, and a short booking has too little colour of its own to stand out at all. */
    border: 1px solid rgba(0, 0, 0, 0.55);
    border-radius: 4px;
    font-size: calc(0.75rem + var(--task-fs-boost, 0px));
    font-weight: var(--task-fw, 400);
    padding: 0 8px;
    cursor: pointer;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
    transition: box-shadow 0.1s ease;
    user-select: none;
    z-index: 1;
}

    .scheduler-task:hover[b-0ilph2umdh] {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.18);
        z-index: 5;
    }

.scheduler-task-dragging[b-0ilph2umdh] {
    opacity: 0.7;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25) !important;
    z-index: 10 !important;
    cursor: grabbing;
}

/* Resize cursors on edges */
.scheduler-task[b-0ilph2umdh]::before,
.scheduler-task[b-0ilph2umdh]::after {
    content: '';
    position: absolute;
    top: 0;
    width: 8px;
    height: 100%;
    cursor: ew-resize;
}

.scheduler-task[b-0ilph2umdh]::before {
    left: 0;
}

.scheduler-task[b-0ilph2umdh]::after {
    right: 0;
}

.scheduler-task-title[b-0ilph2umdh] {
    pointer-events: none;
}

/* A bar too narrow for its own label (a one-day booking in a month-wide view is a few pixels) keeps the
   label beside it instead of clipping it to nothing. The label leaves the coloured bar, so it carries its
   own colour and a white halo to stay readable over grid lines and whatever sits behind it. */
.scheduler-task-narrow[b-0ilph2umdh] {
    overflow: visible;
}

.scheduler-task-narrow .scheduler-task-title[b-0ilph2umdh] {
    position: absolute;
    left: calc(100% + 4px);
    top: 0;
    color: #2a3a4a;
    text-shadow: 0 0 3px #fff, 0 0 3px #fff, 0 0 3px #fff;
    z-index: 2;
}

/* Priority color variants */
.scheduler-task-normal[b-0ilph2umdh] {
    background: #0d6efd;
    color: #fff;
}

.scheduler-task-high[b-0ilph2umdh] {
    background: #dc3545;
    color: #fff;
}

.scheduler-task-low[b-0ilph2umdh] {
    background: #198754;
    color: #fff;
}

/* Attention / Locked flag colors (trump priority and booking type) */
.scheduler-task-attention[b-0ilph2umdh] {
    background: #fd7e14;
    color: #fff;
}

.scheduler-task-locked[b-0ilph2umdh] {
    background: #dc3545;
    color: #fff;
}

/* Booking type color variants */
.scheduler-task-vacation[b-0ilph2umdh] {
    background: #ffc107;
    color: #000;
}

/* Overbooking indicator */
.scheduler-row-overbooked[b-0ilph2umdh] {
    background: rgba(220, 53, 69, 0.05);
}

.scheduler-row-overbooked .scheduler-resource-label[b-0ilph2umdh] {
    border-left: 3px solid #dc3545;
}

/* ===== Heatmap cells (Month/Quarter) ===== */
.scheduler-heatmap-cell[b-0ilph2umdh] {
    position: absolute;
    top: 0;
    border-right: 1px solid rgba(0,0,0,0.06);
    cursor: pointer;
    transition: opacity 0.15s;
}

.scheduler-heatmap-cell:hover[b-0ilph2umdh] {
    opacity: 0.8;
    outline: 1px solid rgba(0,0,0,0.2);
    z-index: 1;
}

.heatmap-empty[b-0ilph2umdh] { background: transparent; }
.heatmap-light[b-0ilph2umdh] { background: rgba(13, 110, 253, 0.12); }
.heatmap-medium[b-0ilph2umdh] { background: rgba(13, 110, 253, 0.28); }
.heatmap-busy[b-0ilph2umdh] { background: rgba(13, 110, 253, 0.48); }
.heatmap-full[b-0ilph2umdh] { background: rgba(13, 110, 253, 0.70); }
.heatmap-over[b-0ilph2umdh] { background: rgba(220, 53, 69, 0.65); }

/* Long event blocks in heatmap mode - full-height overlay */
.scheduler-task-overlay[b-0ilph2umdh] {
    border-radius: 2px;
    z-index: 2;
    opacity: 0.92;
    font-size: 0.75rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding: 0 4px;
}

.scheduler-list-task[b-0ilph2umdh] {
    border-radius: 2px;
    z-index: 2;
    font-size: 0.7rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding: 0 3px;
}

/* Search hit: a bar whose case number/title matches the query lights up so it can be spotted at a glance,
   over any bar colour. Kept distinct from selection (a solid ring) and from the amber row tint. Placed
   after the overlay/list rules so it wins source order for bars that also carry those classes. */
.scheduler-task-search-hit[b-0ilph2umdh] {
    outline: 2px solid #ffc107;
    outline-offset: 1px;
    box-shadow: 0 0 0 2px rgba(255, 193, 7, 0.55), 0 0 10px 2px rgba(255, 193, 7, 0.85) !important;
    z-index: 6;
}

/* "Text lines per booking" > 1: the bar is taller (height set inline) and its label wraps, clamped to the
   configured number of lines, instead of clipping to a single line. Wins source order over the overlay/list
   nowrap above. */
.scheduler-task-multiline[b-0ilph2umdh] {
    white-space: normal;
    display: flex;
    align-items: center;
}

    .scheduler-task-multiline .scheduler-task-title[b-0ilph2umdh] {
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: var(--task-text-lines, 2);
        line-clamp: var(--task-text-lines, 2);
        overflow: hidden;
        white-space: normal;
        width: 100%;
    }

.scheduler-task-sick[b-0ilph2umdh] {
    background: #e85d04;
    color: #fff;
}

.scheduler-task-school[b-0ilph2umdh] {
    background: #6f42c1;
    color: #fff;
}

.scheduler-task-parental[b-0ilph2umdh] {
    background: #d63384;
    color: #fff;
}

.scheduler-task-compensation[b-0ilph2umdh] {
    background: #20c997;
    color: #fff;
}

.scheduler-task-other[b-0ilph2umdh] {
    background: #6c757d;
    color: #fff;
}

/* ===== Month calendar ===== */
.scheduler-month-wrapper[b-0ilph2umdh] {
    flex: 1 1 0;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

.scheduler-embed .scheduler-month-wrapper[b-0ilph2umdh] {
    height: auto;
    flex: 1;
    min-height: 400px;
}

.scheduler-month[b-0ilph2umdh] {
    border: 1px solid #dee2e6;
    border-radius: 0.5rem;
    overflow: hidden;
    background: #fff;
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

.scheduler-month-header[b-0ilph2umdh] {
    display: grid;
    grid-template-columns: 2rem repeat(7, 1fr);
    background: #f8f9fa;
    border-bottom: 2px solid #dee2e6;
    flex-shrink: 0;
}

.scheduler-month-dow[b-0ilph2umdh] {
    text-align: center;
    font-weight: 600;
    font-size: 0.82rem;
    padding: 0.5rem 0;
    color: #495057;
}

.scheduler-month-week-num-header[b-0ilph2umdh] {
    border-right: 1px solid #dee2e6;
}

.scheduler-month-week-num[b-0ilph2umdh] {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding-top: 0.3rem;
    font-size: 0.7rem;
    font-weight: 700;
    color: #343a40;
    background: #e9ecef;
    border-right: 1px solid #ced4da;
    border-bottom: 1px solid #ced4da;
    cursor: pointer;
    user-select: none;
    transition: color 0.1s, background 0.1s;
}

    .scheduler-month-week-num:hover[b-0ilph2umdh] {
        color: #0d6efd;
        background: rgba(13, 110, 253, 0.06);
    }

.scheduler-month-row:last-child .scheduler-month-week-num[b-0ilph2umdh] {
    border-bottom: none;
}

.scheduler-month-body[b-0ilph2umdh] {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

.scheduler-month-row[b-0ilph2umdh] {
    display: grid;
    grid-template-columns: 2rem repeat(7, 1fr);
    flex: 1;
    min-height: 0;
}

.scheduler-month-cell[b-0ilph2umdh] {
    border-right: 1px solid #ced4da;
    border-bottom: 1px solid #ced4da;
    padding: 0.25rem 0.4rem;
    overflow: hidden;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

    .scheduler-month-cell:last-child[b-0ilph2umdh] {
        border-right: none;
    }

.scheduler-month-row:last-child .scheduler-month-cell[b-0ilph2umdh] {
    border-bottom: none;
}

.scheduler-month-cell-other[b-0ilph2umdh] {
    background: #fafafa;
    color: #adb5bd;
}

.scheduler-month-cell-today[b-0ilph2umdh] {
    background: rgba(13, 110, 253, 0.05);
}

.scheduler-month-day-num[b-0ilph2umdh] {
    font-size: 0.82rem;
    font-weight: 600;
    margin-bottom: 2px;
    color: inherit;
    display: inline-block;
    cursor: pointer;
    border-radius: 0.25rem;
    padding: 0 2px;
    transition: color 0.1s, background 0.1s;
}

    .scheduler-month-day-num:hover[b-0ilph2umdh] {
        color: #0d6efd;
        background: rgba(13, 110, 253, 0.08);
    }

.scheduler-month-cell-today .scheduler-month-day-num[b-0ilph2umdh] {
    color: #0d6efd;
}

.scheduler-month-task-list[b-0ilph2umdh] {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    display: flex;
    flex-direction: column;
}

    .scheduler-month-task-list[b-0ilph2umdh]::-webkit-scrollbar {
        width: 3px;
    }

    .scheduler-month-task-list[b-0ilph2umdh]::-webkit-scrollbar-thumb {
        background: #ced4da;
        border-radius: 2px;
    }

    .scheduler-month-task-list[b-0ilph2umdh]::-webkit-scrollbar-track {
        background: transparent;
    }

.scheduler-month-task[b-0ilph2umdh] {
    height: var(--month-task-h, 18px);
    line-height: var(--month-task-h, 18px);
    font-size: calc(var(--month-task-h, 18px) * 0.55);
    padding: 0 4px;
    margin-bottom: 2px;
    border-radius: 3px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    cursor: pointer;
    flex-shrink: 0;
    width: 100%;
    box-sizing: border-box;
}

    .scheduler-month-task:hover[b-0ilph2umdh] {
        opacity: 0.85;
    }

.scheduler-month-more[b-0ilph2umdh] {
    font-size: 0.7rem;
    color: #6c757d;
    cursor: pointer;
    padding: 0 2px;
    border-radius: 0.2rem;
    transition: color 0.1s, background 0.1s;
}

    .scheduler-month-more:hover[b-0ilph2umdh] {
        color: #0d6efd;
        background: rgba(13, 110, 253, 0.08);
}

/* ===== Unallocated section ===== *//* ===== Month day-detail popup ===== */
.scheduler-month-popup-backdrop[b-0ilph2umdh] {
    position: fixed;
    inset: 0;
    z-index: 1040;
}

.scheduler-month-popup[b-0ilph2umdh] {
    position: fixed;
    z-index: 1041;
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0.5rem;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
    width: 220px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.scheduler-month-popup-header[b-0ilph2umdh] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.45rem 0.75rem;
    background: #f8f9fa;
    border-bottom: 1px solid #dee2e6;
    font-size: 0.85rem;
    font-weight: 600;
    flex-shrink: 0;
}

.scheduler-month-popup-body[b-0ilph2umdh] {
    overflow-y: auto;
    max-height: 260px;
    padding: 0.35rem 0.4rem;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.scheduler-month-popup-task[b-0ilph2umdh] {
    font-size: 0.75rem;
    padding: 3px 6px;
    border-radius: 3px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    cursor: pointer;
    flex-shrink: 0;
}

    .scheduler-month-popup-task:hover[b-0ilph2umdh] {
        opacity: 0.85;
    }

/* ===== Month day-detail popup ===== */
.scheduler-month-popup-backdrop[b-0ilph2umdh] {
    position: fixed;
    inset: 0;
    z-index: 1040;
}

.scheduler-month-popup[b-0ilph2umdh] {
    position: fixed;
    z-index: 1041;
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0.5rem;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
    width: 220px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.scheduler-month-popup-header[b-0ilph2umdh] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.45rem 0.75rem;
    background: #f8f9fa;
    border-bottom: 1px solid #dee2e6;
    font-size: 0.85rem;
    font-weight: 600;
    flex-shrink: 0;
}

.scheduler-month-popup-body[b-0ilph2umdh] {
    overflow-y: auto;
    max-height: 260px;
    padding: 0.35rem 0.4rem;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.scheduler-month-popup-task[b-0ilph2umdh] {
    font-size: 0.75rem;
    padding: 3px 6px;
    border-radius: 3px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    cursor: pointer;
    flex-shrink: 0;
}

    .scheduler-month-popup-task:hover[b-0ilph2umdh] {
        opacity: 0.85;
    }

/* ===== Unallocated section ===== */
.scheduler-unallocated[b-0ilph2umdh] {
    border: 1px solid #dee2e6;
    border-radius: 0.5rem;
    background: #fff;
    overflow: hidden;
    flex-shrink: 0;
}

.scheduler-unallocated-header[b-0ilph2umdh] {
    display: flex;
    align-items: center;
    padding: 0.6rem 1rem;
    font-weight: 600;
    font-size: 0.9rem;
    background: #f8f9fa;
    border-bottom: 1px solid #dee2e6;
    cursor: pointer;
    user-select: none;
}

    .scheduler-unallocated-header:hover[b-0ilph2umdh] {
        background: #ced4da;
    }

.scheduler-unallocated-drop-target[b-0ilph2umdh] {
    outline: 2px dashed #0d6efd;
    outline-offset: -2px;
    background: rgba(13, 110, 253, 0.05) !important;
}

.scheduler-unallocated-body[b-0ilph2umdh] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    max-height: 200px;
    overflow-y: auto;
}

.scheduler-unallocated-card[b-0ilph2umdh] {
    display: flex;
    align-items: center;
    min-width: 80px;
    padding: 0 8px;
    border-radius: 4px;
    font-size: 0.75rem;
    cursor: grab;
    touch-action: none;
    flex-shrink: 0;
    white-space: nowrap;
    overflow: hidden;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
    transition: box-shadow 0.1s ease;
    user-select: none;
}

    .scheduler-unallocated-card:hover[b-0ilph2umdh] {
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
        transform: translateY(-1px);
    }

.scheduler-unallocated-card-title[b-0ilph2umdh] {
    font-size: 0.82rem;
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.scheduler-unallocated-card-meta[b-0ilph2umdh] {
    font-size: 0.72rem;
    opacity: 0.85;
    margin-top: 2px;
}

/* ===== Settings panel ===== */
.scheduler-settings-backdrop[b-0ilph2umdh] {
    position: fixed;
    inset: 0;
    z-index: 1040;
}

/* ===== Context menu ===== */
.scheduler-context-backdrop[b-0ilph2umdh] {
    position: fixed;
    inset: 0;
    z-index: 1049;
}

.scheduler-context-menu[b-0ilph2umdh] {
    position: fixed;
    z-index: 1050;
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0.5rem;
    padding: 0.25rem 0;
    min-width: 200px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
}

.scheduler-context-menu-header[b-0ilph2umdh] {
    padding: 0.4rem 0.75rem;
    font-size: 0.8rem;
    font-weight: 600;
    color: #495057;
    border-bottom: 1px solid #ced4da;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 250px;
}

.scheduler-context-menu-item[b-0ilph2umdh] {
    display: flex;
    align-items: center;
    width: 100%;
    padding: 0.4rem 0.75rem;
    border: none;
    background: none;
    font-size: 0.82rem;
    cursor: pointer;
    text-align: left;
    color: #212529;
}

.scheduler-context-menu-item:hover[b-0ilph2umdh] {
    background: #f0f0f0;
}

.scheduler-context-menu-item.active[b-0ilph2umdh] {
    background: #e8f0fe;
    font-weight: 600;
}

.scheduler-settings-panel[b-0ilph2umdh] {
    position: absolute;
    left: 0;
    top: calc(100% + 4px);
    z-index: 1041;
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0.5rem;
    padding: 1rem 1.25rem;
    min-width: 260px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
}
/* /Components/Pages/SplitView.razor.rz.scp.css */
.split-view-container[b-2ghw66iesj] {
    display: flex;
    gap: 0;
    /* Fill the remaining height of the page's flex column (main-content) instead of a fixed vh calc,
       so there's no dead whitespace below and no overflow above. */
    flex: 1 1 auto;
    min-height: 320px;
    border: 1px solid var(--bs-border-color);
    border-radius: 0.375rem;
    overflow: hidden;
}

.split-view-list[b-2ghw66iesj] {
    width: 21.25rem;
    min-width: 17.5rem;
    max-width: 25rem;
    border-right: 1px solid var(--bs-border-color);
    /* Column layout so the record list scrolls while the pager footer stays pinned at the bottom. */
    display: flex;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
    background: var(--bs-body-bg);
    flex-shrink: 0;
}

    .split-view-list .list-group[b-2ghw66iesj] {
        flex: 1 1 auto;
        min-height: 0;
        overflow-y: auto;
    }

    .split-view-list .list-group-item[b-2ghw66iesj] {
        border-radius: 0;
        border-left: 0;
        border-right: 0;
        padding: 0.6rem 1rem;
    }

        .split-view-list .list-group-item:first-child[b-2ghw66iesj] {
            border-top: 0;
        }

.split-view-detail[b-2ghw66iesj] {
    flex: 1;
    overflow-y: auto;
    padding: 1.5rem;
    background: var(--bs-body-bg);
}
/* /Components/Pages/TaskTimeline.razor.rz.scp.css */
/* ===== Base layout ===== */

.scheduler-page[b-hoygdadom5] {
    display: flex;
    flex-direction: column;
    height: calc(100vh - 60px);
    min-height: 0;
}

.scheduler-container[b-hoygdadom5] {
    border: 1px solid #dee2e6;
    border-radius: 0.5rem;
    overflow: hidden;
    background: #fff;
    flex: 1 1 0;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

.scheduler-fullscreen[b-hoygdadom5] {
    position: fixed !important;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1050;
    background: #fff;
    padding: 0.75rem 1rem;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    height: 100vh !important;
}

.scheduler-fullscreen .scheduler-wrapper[b-hoygdadom5] {
    height: 0;
    flex: 1 1 0;
}

.scheduler-wrapper[b-hoygdadom5] {
    display: flex;
    flex-direction: column;
    flex: 1 1 0;
    min-height: 0;
    gap: 0.5rem;
}

/* ===== Body: frozen labels + scrollable cells ===== */
.scheduler-body[b-hoygdadom5] {
    display: flex;
    flex: 1;
    min-height: 0;
    overflow: hidden;
}

.scheduler-labels[b-hoygdadom5] {
    flex-shrink: 0;
    width: var(--label-w, 10rem);
    overflow: hidden;
    background: #fff;
    border-right: 2px solid #dee2e6;
    z-index: 3;
}

/* Body row labels on white for stronger text contrast on large screens (the header corner stays grey). */
.scheduler-labels .scheduler-resource-label[b-hoygdadom5] {
    background: #fff;
    font-weight: 600;
    color: #212529;
}

.scheduler-scroll-area[b-hoygdadom5] {
    overflow-x: auto;
    overflow-y: auto;
    flex: 1;
    min-height: 0;
    min-width: 0;
}

/* ===== Timeline header ===== */
.scheduler-timeline[b-hoygdadom5] {
    display: flex;
    flex-shrink: 0;
    background: #f8f9fa;
    border-bottom: 2px solid #dee2e6;
}

.scheduler-timeline-clip[b-hoygdadom5] {
    flex: 1;
    overflow: hidden;
}

.scheduler-timeline-cells[b-hoygdadom5] {
    display: flex;
    flex-direction: column;
}

.scheduler-timeline-cell[b-hoygdadom5] {
    flex-shrink: 0;
    text-align: center;
    font-size: 0.8rem;
    font-weight: 700;
    padding: 0.5rem 0;
    border-right: 1px solid #ced4da;
    color: #212529;
}

.scheduler-timeline-cell-now[b-hoygdadom5] {
    background: rgba(13, 110, 253, 0.08);
    color: #0d6efd;
}

.scheduler-timeline-cell-day-start[b-hoygdadom5] {
    box-shadow: inset 2px 0 0 #ced4da;
    font-weight: 700;
}

/* ===== Week number row ===== */
.scheduler-week-number-row[b-hoygdadom5] {
    border-bottom: 1px solid #adb5bd;
}

/* Also carries the month band. A month cell spans its own columns, so a partial month at the edge of the
   window can be narrow - it truncates rather than spilling over its neighbour. */
.scheduler-week-number-cell[b-hoygdadom5] {
    text-align: center;
    font-size: 0.7rem;
    font-weight: 700;
    color: #212529;
    background: #ced4da;
    padding: 2px 0;
    border-right: 1px solid #adb5bd;
    flex-shrink: 0;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

/* ===== Search highlight =====
   The search walks rows instead of filtering them, so the hits have to be visible against the rows that
   stay around them: every match gets a tint, the one currently walked to gets a border it cannot be
   confused with. Applied to the row in both panes (frozen labels + grid), which is why the selectors are
   loose about which element they land on. */
.scheduler-row-search-match[b-hoygdadom5] {
    background-color: rgba(255, 193, 7, 0.16) !important;
}

.scheduler-row-search-current[b-hoygdadom5] {
    background-color: rgba(255, 193, 7, 0.32) !important;
    box-shadow: inset 0 0 0 2px #ffc107;
}

/* ===== Weekday initial row (setting: Scheduler.ShowWeekdays) ===== */
/* One letter per date column, so it aligns with the columns rather than spanning them like the
   week-number / month bands above it. */
.scheduler-weekday-row[b-hoygdadom5] {
    border-bottom: 1px solid #ced4da;
}

.scheduler-weekday-cell[b-hoygdadom5] {
    text-align: center;
    font-size: 0.68rem;
    font-weight: 600;
    color: #495057;
    background: #eef0f2;
    padding: 1px 0;
    border-right: 1px solid #ced4da;
    flex-shrink: 0;
}

/* ===== Row label ===== */
.scheduler-resource-label[b-hoygdadom5] {
    flex-shrink: 0;
    width: var(--label-w, 10rem);
    min-width: var(--label-w, 10rem);
    max-width: var(--label-w, 10rem);
    font-size: 0.82rem;
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    background: #f8f9fa;
    border-bottom: 1px solid #ced4da;
    display: flex;
    align-items: center;
    box-sizing: border-box;
    position: relative;
}

/* Frozen-label sub-cells (case number + name). The label width is fixed; the
   case cell is fixed-width and the name cell flexes to fill the remainder. */
.tl-sub[b-hoygdadom5] {
    padding: 0.4rem 0.75rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    align-self: stretch;
    display: flex;
    align-items: center;
    box-sizing: border-box;
}

.tl-sub-case[b-hoygdadom5] {
    flex-shrink: 0;
    width: var(--case-w, 7rem);
    border-right: 1px solid #ced4da;
}

.tl-sub-flex[b-hoygdadom5] {
    flex: 1;
    min-width: 0;
}

/* Inline start-date + duration editor per RB lane (toggle: Timeline.Settings.RbInlineEdit). */
.tl-sub-edit[b-hoygdadom5] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 4px;
    padding-left: 6px;
}

.tl-inline-date[b-hoygdadom5],
.tl-inline-dur[b-hoygdadom5] {
    font-size: 0.72rem;
    line-height: 1.2;
    padding: 1px 4px;
    border: 1px solid #ced4da;
    border-radius: 4px;
    background: #fff;
    color: #2a3a4a;
}

.tl-inline-date[b-hoygdadom5] { width: 7.5rem; }
.tl-inline-dur[b-hoygdadom5] { width: 3rem; }
.tl-inline-end[b-hoygdadom5] { font-size: 0.8rem; color: #6c757d; white-space: nowrap; align-self: center; }

/* The unit the duration field is read in. It follows the view (hours only in the hour view), so it is
   spelled out next to the box rather than left to the tooltip. */
.tl-inline-unit[b-hoygdadom5] {
    font-size: 0.72rem;
    color: #6c757d;
    align-self: center;
    margin-left: -2px;
}

.tl-head[b-hoygdadom5] {
    cursor: pointer;
    font-weight: 600;
    user-select: none;
}

/* ===== WorkTask grouped label column (one sub-row per ResourceBooking lane) ===== */
.scheduler-labels .scheduler-resource-label.tl-group[b-hoygdadom5] {
    align-items: stretch;
    overflow: visible;
}

/* WorkTask group: a compact title header stacked above the resource lanes. */
.tl-group-main[b-hoygdadom5] {
    flex: 1;
    min-width: 0;
    align-self: stretch;
    display: flex;
    flex-direction: column;
}

.tl-wt-header[b-hoygdadom5] {
    display: flex;
    align-items: center;
    min-width: 0;
    box-sizing: border-box;
    flex-shrink: 0;
}

.tl-lanes[b-hoygdadom5] {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-width: 0;
    box-sizing: border-box;
}

.tl-lane-row[b-hoygdadom5] {
    display: flex;
    align-items: center;
    min-width: 0;
}

/* The WorkTask identity (case + name) only appears on the first lane; continuation lanes leave it
   blank so the group reads as one block. The RB resource-or-type label appears on every lane. */
.tl-lane-row .tl-sub[b-hoygdadom5] {
    padding-top: 0;
    padding-bottom: 0;
}

.tl-wt-name[b-hoygdadom5] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin-right: 0.5rem;
}

/* Shown only when the address is what a search matched, so the row can say why it was found. */
.tl-wt-address[b-hoygdadom5] {
    color: #6c757d;
    font-weight: 400;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* What the search matched, wherever it appears in a row's text. */
.tl-hit[b-hoygdadom5] {
    background: #ffe08a;
    color: inherit;
    padding: 0;
    border-radius: 2px;
}

.tl-rb-label[b-hoygdadom5] {
    color: #6c757d;
    font-style: italic;
    font-weight: 400;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* A demand (resource type, no person yet) is a muted placeholder. */
.tl-rb-label.tl-rb-demand[b-hoygdadom5] {
    opacity: 0.8;
}

/* The resource name doubles as the handle for changing who is booked. */
.tl-rb-pick[b-hoygdadom5] {
    cursor: pointer;
    border-radius: 3px;
    padding: 0 2px;
    margin-left: -2px;
}

.tl-rb-pick:hover[b-hoygdadom5] {
    background: rgba(13, 110, 253, 0.12);
    color: #0d6efd;
}

/* First name shown inside the inline date-editor row: bounded so it sits beside the date rather than
   pushing it out, and never shrinks away entirely. */
.tl-rb-firstname[b-hoygdadom5] {
    flex: 0 1 auto;
    max-width: 6rem;
    margin-right: 4px;
}

/* Per-lane "remove this booking" affordance. Hidden until the lane is hovered, so a group with several
   resources is not a column of x's - and it keeps its width reserved either way, so revealing it does
   not shift the lane's contents. */
.tl-lane-remove[b-hoygdadom5] {
    flex-shrink: 0;
    width: 1.1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.7rem;
    color: #adb5bd;
    cursor: pointer;
    visibility: hidden;
}

.tl-lane-row:hover .tl-lane-remove[b-hoygdadom5] {
    visibility: visible;
}

.tl-lane-remove:hover[b-hoygdadom5] {
    color: #dc3545;
}

/* Inline "+ add line" affordance per WorkTask group. */
.tl-add[b-hoygdadom5] {
    flex-shrink: 0;
    width: 1.5rem;
    align-self: stretch;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #6c757d;
    cursor: pointer;
    border-left: 1px solid #ced4da;
}

.tl-add:hover[b-hoygdadom5] {
    background: rgba(13, 110, 253, 0.12);
    color: #0d6efd;
}

/* Inline "add resource" popover: resource + start + duration, anchored to the group's top-right
   so it overlays the timeline (the group is position:relative + overflow:visible) instead of
   growing the row, which would break label/grid row-height alignment. */
.tl-inline-add[b-hoygdadom5] {
    position: absolute;
    top: 100%;
    right: 0;
    z-index: 30;
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 6px 8px;
    background: #fff;
    border: 1px solid #adb5bd;
    border-radius: 6px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.18);
    white-space: nowrap;
    min-width: 24rem;
}

.tl-inline-add[b-hoygdadom5]  .position-relative {
    flex: 1;
    min-width: 9rem;
}

.tl-inline-add .btn[b-hoygdadom5] {
    padding: 1px 6px;
    line-height: 1.2;
}

.tl-head:hover[b-hoygdadom5] {
    background: rgba(13, 110, 253, 0.08);
}

/* Resize handle on label column edge */
.timeline-label-resize-handle[b-hoygdadom5] {
    position: absolute;
    top: 0;
    right: 0;
    width: 5px;
    height: 100%;
    cursor: col-resize;
    z-index: 4;
    background: transparent;
}

.timeline-label-resize-handle:hover[b-hoygdadom5],
.timeline-label-resize-handle:active[b-hoygdadom5] {
    background: rgba(13, 110, 253, 0.3);
}

.scheduler-corner[b-hoygdadom5] {
    border-bottom: none;
    border-right: 2px solid #dee2e6;
}

/* ===== Grid body ===== */
.scheduler-grid-body[b-hoygdadom5] {
    position: relative;
    /* Size to the full timeline width so each row's border-bottom (the horizontal grid line) spans the
       whole scrollable area, not just the viewport width at first paint. Without this the rows are only
       as wide as the visible area and lines disappear past the initial viewport when scrolling right. */
    width: max-content;
    min-width: 100%;
}

/* ===== Row ===== */
.scheduler-row[b-hoygdadom5] {
    display: flex;
    border-bottom: var(--grid-line-w, 1px) solid var(--grid-line-color, #ced4da);
}

.scheduler-row:last-child[b-hoygdadom5] {
    border-bottom: none;
}

/* ===== Row cells container ===== */
.scheduler-row-cells[b-hoygdadom5] {
    position: relative;
    flex-shrink: 0;
    overflow: hidden;
    background-color: #fff;
    background-image: repeating-linear-gradient(
        to right,
        transparent 0,
        transparent calc(var(--col-w) - 1px),
        var(--grid-line-color, #ced4da) calc(var(--col-w) - 1px),
        var(--grid-line-color, #ced4da) var(--col-w)
    );
}

.scheduler-day-start-marker[b-hoygdadom5] {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 2px;
    background: var(--grid-line-color, #ced4da);
    pointer-events: none;
    z-index: 0;
}

/* "Today / now" marker: a full-height red line spanning all task rows, inside the scrolling grid body
   so it tracks the columns. The frozen label column is a separate pane to the left, so no offset is needed. */
.scheduler-today-line[b-hoygdadom5] {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 2px;
    margin-left: -1px;
    background: #dc3545;
    pointer-events: none;
    z-index: 5;
}

/* Weekend (Sat/Sun) columns in day view — darker, header-like tint + a clear band behind the bars. */
.scheduler-timeline-cell-weekend[b-hoygdadom5] {
    background: #d5d9de;
}

.scheduler-weekend-col[b-hoygdadom5] {
    position: absolute;
    top: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.08);
    pointer-events: none;
    z-index: 0;
}

/* Public holidays in day view — marked like weekends (a touch darker so a blocked weekday stands out). */
.scheduler-timeline-cell-holiday[b-hoygdadom5] {
    background: #cfd3d9;
}

.scheduler-holiday-col[b-hoygdadom5] {
    position: absolute;
    top: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.11);
    pointer-events: none;
    z-index: 0;
}

/* Bars selected via ctrl-click or lasso, for a group move. */
.scheduler-task-selected[b-hoygdadom5] {
    outline: 2px solid #0d6efd;
    outline-offset: 1px;
    box-shadow: 0 0 0 3px rgba(13, 110, 253, 0.25);
}

/* ===== Task bar ===== */
.scheduler-task[b-hoygdadom5] {
    position: absolute;
    /* A thin dark edge: bars of the same colour sitting next to each other otherwise read as one long
       block, and a short booking has too little colour of its own to stand out at all. */
    border: 1px solid rgba(0, 0, 0, 0.55);
    border-radius: 4px;
    font-size: calc(0.75rem + var(--task-fs-boost, 0px));
    font-weight: var(--task-fw, 400);
    padding: 0 8px;
    cursor: pointer;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
    transition: box-shadow 0.1s ease;
    user-select: none;
    z-index: 1;
}

.scheduler-task:hover[b-hoygdadom5] {
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.18);
    z-index: 5;
}

.scheduler-task-dragging[b-hoygdadom5] {
    opacity: 0.7;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25) !important;
    z-index: 10 !important;
    cursor: grabbing;
}

.scheduler-task[b-hoygdadom5]::before,
.scheduler-task[b-hoygdadom5]::after {
    content: '';
    position: absolute;
    top: 0;
    width: 8px;
    height: 100%;
    cursor: ew-resize;
}

.scheduler-task[b-hoygdadom5]::before {
    left: 0;
}

.scheduler-task[b-hoygdadom5]::after {
    right: 0;
}

.scheduler-task-title[b-hoygdadom5] {
    pointer-events: none;
}

/* A bar too narrow for its own label (a one-day booking in a month-wide view is a few pixels) keeps the
   label beside it instead of clipping it to nothing. The label leaves the coloured bar, so it carries its
   own colour and a white halo to stay readable over grid lines and whatever sits behind it. */
.scheduler-task-narrow[b-hoygdadom5] {
    overflow: visible;
}

.scheduler-task-narrow .scheduler-task-title[b-hoygdadom5] {
    position: absolute;
    left: calc(100% + 4px);
    top: 0;
    color: #2a3a4a;
    text-shadow: 0 0 3px #fff, 0 0 3px #fff, 0 0 3px #fff;
    z-index: 2;
}

/* ===== Settings panel ===== */
.scheduler-settings-backdrop[b-hoygdadom5] {
    position: fixed;
    inset: 0;
    z-index: 1040;
}

.scheduler-settings-panel[b-hoygdadom5] {
    position: absolute;
    left: 0;
    top: calc(100% + 4px);
    z-index: 1041;
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0.5rem;
    padding: 1rem 1.25rem;
    min-width: 260px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
}

/* ===== Task Timeline - status-based task block colors ===== */

/* Attention / Locked flag colors (trump status colors) */
[b-hoygdadom5] .task-timeline-attention {
    background: #fd7e14 !important;
    color: #fff !important;
}

[b-hoygdadom5] .task-timeline-locked {
    background: #dc3545 !important;
    color: #fff !important;
}

/* New - blue */
[b-hoygdadom5] .task-timeline-new {
    background: #2196F3 !important;
    color: #fff !important;
}

/* In Progress - green */
[b-hoygdadom5] .task-timeline-inprogress {
    background: #4CAF50 !important;
    color: #fff !important;
}

/* On Hold - orange */
[b-hoygdadom5] .task-timeline-onhold {
    background: #FF9800 !important;
    color: #fff !important;
}

/* Completed - muted green */
[b-hoygdadom5] .task-timeline-completed {
    background: #81C784 !important;
    color: #fff !important;
    opacity: 0.7;
}

/* Cancelled - red */
[b-hoygdadom5] .task-timeline-cancelled {
    background: #F44336 !important;
    color: #fff !important;
    opacity: 0.6;
}

/* Planned - light blue */
[b-hoygdadom5] .task-timeline-planned {
    background: #90CAF9 !important;
    color: #1a1a1a !important;
}

/* Unconfirmed - grey */
[b-hoygdadom5] .task-timeline-unconfirmed {
    background: #BDBDBD !important;
    color: #333 !important;
}

/* Awaiting (Customer / Subcontractor) - amber */
[b-hoygdadom5] .task-timeline-awaiting {
    background: #FFA726 !important;
    color: #fff !important;
}

/* Default fallback */
[b-hoygdadom5] .task-timeline-default {
    background: #78909C !important;
    color: #fff !important;
}

/* ===== Context menu ===== */
.scheduler-context-backdrop[b-hoygdadom5] {
    position: fixed;
    inset: 0;
    z-index: 1049;
}

.scheduler-context-menu[b-hoygdadom5] {
    position: fixed;
    z-index: 1050;
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0.5rem;
    padding: 0.25rem 0;
    min-width: 200px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
}

.scheduler-context-menu-header[b-hoygdadom5] {
    padding: 0.4rem 0.75rem;
    font-size: 0.8rem;
    font-weight: 600;
    color: #495057;
    border-bottom: 1px solid #ced4da;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 250px;
}

.scheduler-context-menu-item[b-hoygdadom5] {
    display: flex;
    align-items: center;
    width: 100%;
    padding: 0.4rem 0.75rem;
    border: none;
    background: none;
    font-size: 0.82rem;
    cursor: pointer;
    text-align: left;
    color: #212529;
}

.scheduler-context-menu-item:hover[b-hoygdadom5] {
    background: #f0f0f0;
}

.scheduler-context-menu-item.active[b-hoygdadom5] {
    background: #e8f0fe;
    font-weight: 600;
}

/* ===== Month calendar ===== */
.scheduler-month-wrapper[b-hoygdadom5] {
    flex: 1 1 0;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

.scheduler-month[b-hoygdadom5] {
    border: 1px solid #dee2e6;
    border-radius: 0.5rem;
    overflow: hidden;
    background: #fff;
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

.scheduler-month-header[b-hoygdadom5] {
    display: grid;
    grid-template-columns: 2rem repeat(7, 1fr);
    background: #f8f9fa;
    border-bottom: 2px solid #dee2e6;
    flex-shrink: 0;
}

.scheduler-month-dow[b-hoygdadom5] {
    text-align: center;
    font-weight: 600;
    font-size: 0.82rem;
    padding: 0.5rem 0;
    color: #495057;
}

.scheduler-month-week-num-header[b-hoygdadom5] {
    border-right: 1px solid #dee2e6;
}

.scheduler-month-week-num[b-hoygdadom5] {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding-top: 0.3rem;
    font-size: 0.7rem;
    font-weight: 700;
    color: #343a40;
    background: #e9ecef;
    border-right: 1px solid #ced4da;
    border-bottom: 1px solid #ced4da;
    cursor: pointer;
    user-select: none;
    transition: color 0.1s, background 0.1s;
}

    .scheduler-month-week-num:hover[b-hoygdadom5] {
        color: #0d6efd;
        background: rgba(13, 110, 253, 0.06);
    }

.scheduler-month-row:last-child .scheduler-month-week-num[b-hoygdadom5] {
    border-bottom: none;
}

.scheduler-month-body[b-hoygdadom5] {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

.scheduler-month-row[b-hoygdadom5] {
    display: grid;
    grid-template-columns: 2rem repeat(7, 1fr);
    flex: 1;
    min-height: 0;
}

.scheduler-month-cell[b-hoygdadom5] {
    border-right: 1px solid #ced4da;
    border-bottom: 1px solid #ced4da;
    padding: 0.25rem 0.4rem;
    overflow: hidden;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

    .scheduler-month-cell:last-child[b-hoygdadom5] {
        border-right: none;
    }

.scheduler-month-row:last-child .scheduler-month-cell[b-hoygdadom5] {
    border-bottom: none;
}

.scheduler-month-cell-other[b-hoygdadom5] {
    background: #fafafa;
    color: #adb5bd;
}

.scheduler-month-cell-today[b-hoygdadom5] {
    background: rgba(13, 110, 253, 0.05);
}

/* A public holiday or one of the tenant's own closed days - shaded like the weekend columns in day view,
   so a plan drawn across the Christmas shutdown shows what it is crossing. */
.scheduler-month-cell-closed[b-hoygdadom5] {
    background: rgba(0, 0, 0, 0.06);
}

.scheduler-month-day-num[b-hoygdadom5] {
    font-size: 0.82rem;
    font-weight: 600;
    margin-bottom: 2px;
    color: inherit;
    display: inline-block;
    cursor: pointer;
    border-radius: 0.25rem;
    padding: 0 2px;
    transition: color 0.1s, background 0.1s;
}

    .scheduler-month-day-num:hover[b-hoygdadom5] {
        color: #0d6efd;
        background: rgba(13, 110, 253, 0.08);
    }

.scheduler-month-cell-today .scheduler-month-day-num[b-hoygdadom5] {
    color: #0d6efd;
}

.scheduler-month-task-list[b-hoygdadom5] {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    display: flex;
    flex-direction: column;
}

    .scheduler-month-task-list[b-hoygdadom5]::-webkit-scrollbar {
        width: 3px;
    }

    .scheduler-month-task-list[b-hoygdadom5]::-webkit-scrollbar-thumb {
        background: #ced4da;
        border-radius: 2px;
    }

    .scheduler-month-task-list[b-hoygdadom5]::-webkit-scrollbar-track {
        background: transparent;
    }

.scheduler-month-task[b-hoygdadom5] {
    height: var(--month-task-h, 18px);
    line-height: var(--month-task-h, 18px);
    font-size: calc(var(--month-task-h, 18px) * 0.55);
    padding: 0 4px;
    margin-bottom: 2px;
    border-radius: 3px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    cursor: pointer;
    flex-shrink: 0;
    width: 100%;
    box-sizing: border-box;
}

    .scheduler-month-task:hover[b-hoygdadom5] {
        opacity: 0.85;
    }
/* /Components/Shared/ActivitySidePanel.razor.rz.scp.css */
.side-panel[b-wb6s73smtn] {
    flex: 0 0 440px;
    width: 440px;
    max-width: 92vw;
    height: 100vh;
    background: #fff;
    border-left: 1px solid var(--bs-border-color, #dee2e6);
    box-shadow: -6px 0 18px rgba(0, 0, 0, 0.06);
    z-index: 1030;
}

.side-panel-header[b-wb6s73smtn] {
    padding: var(--space-md, 1rem);
    border-bottom: 1px solid var(--bs-border-color, #dee2e6);
    background: var(--bs-light, #f8f9fa);
}

.side-panel-body[b-wb6s73smtn] {
    padding: var(--space-md, 1rem);
    min-height: 0;
}

@media (max-width: 768px) {
    .side-panel[b-wb6s73smtn] {
        flex-basis: 100vw;
        width: 100vw;
        max-width: 100vw;
    }
}
/* /Components/Shared/CalendarView.razor.rz.scp.css */
/* The component is a flex column so its grid can fill the height the page gives it. */
.cal-root[b-0p5bspxjxh] {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
}

.cal-scroll[b-0p5bspxjxh] {
    overflow: auto;
    background: var(--bs-body-bg, #fff);
    /* Fills whatever the parent column leaves, instead of the old fixed 72vh that left dead space below
       on tall screens. min-height:0 is what lets a flex child shrink enough to scroll. Same shape as
       ResourceScheduler.razor.css. */
    flex: 1 1 0;
    min-height: 0;
}

/* Month mode has no inner scroller of its own, so its wrapper takes the remaining height and scrolls. */
.cal-month-wrap[b-0p5bspxjxh] {
    display: flex;
    flex-direction: column;
    flex: 1 1 0;
    min-height: 0;
    overflow: auto;
}

.cal-grid[b-0p5bspxjxh] {
    min-width: fit-content;
}

/* Header sticks while the day grid scrolls. */
.cal-head[b-0p5bspxjxh] {
    display: flex;
    position: sticky;
    top: 0;
    z-index: 3;
    background: var(--bs-body-bg, #fff);
    border-bottom: 1px solid var(--bs-border-color, #dee2e6);
}

.cal-body[b-0p5bspxjxh] {
    display: flex;
}

.cal-gutter[b-0p5bspxjxh] {
    width: 56px;
    flex: 0 0 56px;
    border-right: 1px solid var(--bs-border-color, #dee2e6);
}

.cal-hour-label[b-0p5bspxjxh] {
    font-size: .7rem;
    color: var(--bs-secondary-color, #6c757d);
    text-align: right;
    padding-right: .35rem;
    /* Nudge so the label sits against its grid line. */
    transform: translateY(-.4em);
}

/* One group per person; days sit inside it, giving side-by-side calendars. */
.cal-person-group[b-0p5bspxjxh] {
    flex: 1 1 0;
    min-width: calc(var(--cal-days) * 92px);
    border-right: 1px solid var(--bs-border-color, #dee2e6);
}

.cal-person-name[b-0p5bspxjxh] {
    font-size: .8rem;
    font-weight: 600;
    text-align: center;
    padding: .25rem;
    background: var(--bs-tertiary-bg, #f8f9fa);
    border-bottom: 1px solid var(--bs-border-color, #dee2e6);
}

.cal-day-heads[b-0p5bspxjxh],
.cal-day-cols[b-0p5bspxjxh] {
    display: flex;
}

.cal-day-head[b-0p5bspxjxh] {
    flex: 1 1 0;
    text-align: center;
    padding: .25rem 0;
    border-right: 1px solid var(--bs-border-color, #e9ecef);
}

.cal-day-head.today[b-0p5bspxjxh] {
    background: rgba(13, 110, 253, .1);
}

.cal-day-head.weekend[b-0p5bspxjxh],
.cal-day-col.weekend[b-0p5bspxjxh] {
    background: rgba(0, 0, 0, .04);
}

.cal-day-col[b-0p5bspxjxh] {
    flex: 1 1 0;
    position: relative;
    border-right: 1px solid var(--bs-border-color, #e9ecef);
    cursor: pointer;
}

.cal-hour-line[b-0p5bspxjxh] {
    border-bottom: 1px solid var(--bs-border-color, #eef1f4);
}

.cal-event[b-0p5bspxjxh] {
    position: absolute;
    overflow: hidden;
    text-align: left;
    padding: 1px 4px;
    border: 1px solid rgba(0, 0, 0, .12);
    border-radius: 4px;
    background: var(--bs-primary-bg-subtle, #cfe2ff);
    font-size: .72rem;
    line-height: 1.15;
    cursor: pointer;
}

.cal-event:hover[b-0p5bspxjxh] {
    filter: brightness(.96);
}

/* Busy time from Microsoft 365. Deliberately unlike a CRM event: no colour of its own, hatched, and not
   clickable - it says "this time is taken" and there is nothing behind it to open. The hatching is what
   distinguishes it at a glance from a pale CRM source colour. */
.cal-event-external[b-0p5bspxjxh] {
    cursor: default;
    color: #495057;
    border-style: dashed;
    border-color: rgba(0, 0, 0, .25);
    background: repeating-linear-gradient(
        45deg,
        rgba(108, 117, 125, .13),
        rgba(108, 117, 125, .13) 5px,
        rgba(108, 117, 125, .04) 5px,
        rgba(108, 117, 125, .04) 10px
    );
}

.cal-event-external:hover[b-0p5bspxjxh] {
    filter: none;
}

/* Dragged bar floats above its neighbours and ignores hit-testing quirks while moving. */
.cal-event.cal-dragging[b-0p5bspxjxh] {
    opacity: .85;
    z-index: 5;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .25);
    cursor: grabbing;
}

.cal-event-resize[b-0p5bspxjxh] {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 6px;
    cursor: ns-resize;
}

.cal-event-resize:hover[b-0p5bspxjxh] {
    background: rgba(0, 0, 0, .15);
}

.cal-event-time[b-0p5bspxjxh] {
    font-weight: 600;
    margin-right: .25rem;
}

.cal-event-title[b-0p5bspxjxh] {
    /* Wrap within the block rather than clipping to one line where there is room. */
    word-break: break-word;
}

/* ── Month ── */
/* Weekday header row: its own height, not an equal share of the wrapper. Sharing the flex with the
   grid (both flex:1 1 0) stretched this single row to half the calendar, leaving a tall empty band
   above the days. */
.cal-month-head[b-0p5bspxjxh] {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    flex: 0 0 auto;
}

/* The day grid takes the height the header leaves; its rows share that space so a month fills the
   page instead of stopping short. */
.cal-month-grid[b-0p5bspxjxh] {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    flex: 1 1 0;
    min-height: 0;
    grid-auto-rows: 1fr;
}

.cal-month-head-cell[b-0p5bspxjxh] {
    text-align: center;
    padding: .35rem 0;
    background: var(--bs-tertiary-bg, #f8f9fa);
    border-bottom: 1px solid var(--bs-border-color, #dee2e6);
}

.cal-month-cell[b-0p5bspxjxh] {
    min-height: 108px;
    padding: .25rem;
    border-right: 1px solid var(--bs-border-color, #e9ecef);
    border-bottom: 1px solid var(--bs-border-color, #e9ecef);
    cursor: pointer;
}

.cal-month-cell.muted[b-0p5bspxjxh] {
    background: var(--bs-tertiary-bg, #f8f9fa);
    color: var(--bs-secondary-color, #6c757d);
}

.cal-month-cell.today[b-0p5bspxjxh] {
    background: rgba(13, 110, 253, .08);
}

.cal-month-cell.weekend[b-0p5bspxjxh] {
    background: rgba(0, 0, 0, .03);
}

.cal-month-event[b-0p5bspxjxh] {
    display: block;
    width: 100%;
    text-align: left;
    border: 0;
    border-radius: 3px;
    background: var(--bs-primary-bg-subtle, #cfe2ff);
    font-size: .7rem;
    padding: 1px 4px;
    margin-bottom: 2px;
    cursor: pointer;
}

.cal-month-more[b-0p5bspxjxh] {
    font-size: .68rem;
}
/* /Components/Shared/FieldHelpTooltip.razor.rz.scp.css */
.field-help-tooltip[b-jav6xlzjhy] {
    position: relative;
    display: inline-flex;
    align-items: center;
    margin-left: 0.35rem;
    cursor: help;
    color: var(--bs-secondary);
    font-size: 0.8em;
}

.field-help-tooltip-text[b-jav6xlzjhy] {
    display: none;
    position: absolute;
    bottom: calc(100% + 6px);
    left: 0;
    padding: 0.5rem 0.75rem;
    background-color: var(--bs-dark);
    color: #fff;
    font-size: 0.8rem;
    font-weight: normal;
    line-height: 1.4;
    border-radius: 0.375rem;
    white-space: normal;
    width: max-content;
    max-width: 280px;
    z-index: 1080;
    text-align: left;
    box-shadow: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.15);
}

.field-help-tooltip-text[b-jav6xlzjhy]::after {
    content: '';
    position: absolute;
    top: 100%;
    left: 12px;
    border-width: 5px;
    border-style: solid;
    border-color: var(--bs-dark) transparent transparent transparent;
}

.field-help-tooltip:hover .field-help-tooltip-text[b-jav6xlzjhy],
.field-help-tooltip:focus .field-help-tooltip-text[b-jav6xlzjhy] {
    display: block;
}
/* /Components/Shared/HelpButton.razor.rz.scp.css */
.help-fab[b-x8wvh90r1b] {
    position: fixed;
    bottom: 1.5rem;
    right: 1.5rem;
    width: 3rem;
    height: 3rem;
    border-radius: 50%;
    border: none;
    background-color: var(--ampleo-primary, #2A4D69);
    color: #fff;
    font-size: 1.3rem;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 0.25rem 0.75rem rgba(0, 0, 0, 0.25);
    cursor: pointer;
    z-index: 1050;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.help-fab:hover[b-x8wvh90r1b] {
    transform: scale(1.1);
    box-shadow: 0 0.35rem 1rem rgba(0, 0, 0, 0.3);
}

.help-fab:focus-visible[b-x8wvh90r1b] {
    outline: 2px solid var(--ampleo-primary, #2A4D69);
    outline-offset: 2px;
}
/* /Components/Shared/HelpGuide.razor.rz.scp.css */
.help-guide-bar[b-3cs5rfipzg] {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background: var(--bs-primary, #0d6efd);
    color: #fff;
    padding: 0.75rem 1.25rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    z-index: 1070;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.15);
    font-size: 0.9rem;
}
/* /Components/Shared/HelpPanel.razor.rz.scp.css */
.help-panel[b-igqtn5m1kv] {
    position: fixed;
    top: 0;
    right: -22.5rem;
    width: 21.25rem;
    height: 100vh;
    background: var(--bs-body-bg, #fff);
    border-left: 1px solid var(--bs-border-color, #dee2e6);
    box-shadow: -4px 0 12px rgba(0, 0, 0, 0.1);
    z-index: 1055;
    transition: right 0.25s ease;
    display: flex;
    flex-direction: column;
}

.help-panel.open[b-igqtn5m1kv] {
    right: 0;
}

.help-panel-header[b-igqtn5m1kv] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem;
    background-color: var(--bs-primary, #0d6efd);
    color: #fff;
}

.help-panel-body[b-igqtn5m1kv] {
    flex: 1;
    overflow-y: auto;
    padding: 1rem;
}

.help-task-item[b-igqtn5m1kv] {
    margin-bottom: 0.5rem;
}
/* /Components/Shared/MatrixGrid.razor.rz.scp.css */
.matrix-grid[b-yb0sby2xh5] {
    font-size: 0.85rem;
}

.matrix-row-header[b-yb0sby2xh5] {
    position: sticky;
    left: 0;
    z-index: 2;
    background-color: #fff;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.matrix-thead-group th[b-yb0sby2xh5] {
    position: sticky;
    top: 0;
    z-index: 2;
    background-color: var(--bs-table-bg, #f8f9fa);
}

.matrix-thead-group .matrix-row-header[b-yb0sby2xh5] {
    z-index: 4;
}

.matrix-thead-cols th[b-yb0sby2xh5] {
    position: sticky;
    top: 28px;
    z-index: 2;
    background-color: var(--bs-table-bg, #f8f9fa);
}

.matrix-thead-cols .matrix-row-header[b-yb0sby2xh5] {
    z-index: 4;
}

thead .matrix-row-header[b-yb0sby2xh5] {
    background-color: var(--bs-table-bg, #f8f9fa);
    z-index: 3;
}

.matrix-settings-panel[b-yb0sby2xh5] {
    position: absolute;
    right: 0;
    top: calc(100% + 4px);
    z-index: 1041;
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0.5rem;
    padding: 1rem 1.25rem;
    min-width: 260px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
}

.matrix-group-tr[b-yb0sby2xh5] {
    cursor: pointer;
}

.matrix-group-label[b-yb0sby2xh5] {
    font-weight: 600;
    background-color: var(--bs-table-bg, #f8f9fa);
    border-right-color: transparent !important;
}

.matrix-group-fill[b-yb0sby2xh5] {
    background-color: var(--bs-table-bg, #f8f9fa);
    border-left-color: transparent !important;
}

.matrix-group-header[b-yb0sby2xh5] {
    background-color: var(--ampleo-neutral, #f0f0f0);
    font-weight: 600;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.matrix-cell-input[b-yb0sby2xh5] {
    width: 100%;
    padding: 0.15rem 0.25rem;
    font-size: 0.85rem;
    text-align: center;
    border-radius: 0;
}

.matrix-cell-input:focus[b-yb0sby2xh5] {
    background-color: rgba(42, 77, 105, 0.06) !important;
    box-shadow: inset 0 0 0 2px var(--ampleo-primary, #2A4D69);
    outline: none;
}

.matrix-cell-input[b-yb0sby2xh5]::-webkit-inner-spin-button,
.matrix-cell-input[b-yb0sby2xh5]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.matrix-cell-input[type=number][b-yb0sby2xh5] {
    -moz-appearance: textfield;
}

.matrix-subtotal-row td[b-yb0sby2xh5] {
    background-color: #f0f4f7;
    border-top: 2px solid #dee2e6;
    font-size: 0.8rem;
}

.matrix-subtotal-cell[b-yb0sby2xh5] {
    color: var(--ampleo-primary, #2A4D69);
}

.matrix-grand-total-row td[b-yb0sby2xh5] {
    background-color: #e8ecf0;
    font-size: 0.8rem;
}

.matrix-grand-total-cell[b-yb0sby2xh5] {
    color: var(--ampleo-primary, #2A4D69);
}
/* /Components/Shared/NotificationNavItem.razor.rz.scp.css */
.notif-toast[b-cwvitfvh38] {
    position: fixed;
    bottom: 1.25rem;
    right: 1.25rem;
    z-index: 1080;
    max-width: 320px;
    cursor: pointer;
    background: var(--bs-body-bg, #fff);
    animation: notif-toast-in-b-cwvitfvh38 0.2s ease-out;
}

.notif-toast:hover[b-cwvitfvh38] {
    background: var(--bs-tertiary-bg, #f8f9fa);
}

@keyframes notif-toast-in-b-cwvitfvh38 {
    from { opacity: 0; transform: translateY(0.5rem); }
    to   { opacity: 1; transform: translateY(0); }
}
/* /Components/Shared/RelatedGrid.razor.rz.scp.css */
/* ===== Fullscreen overlay ===== */
.related-grid-fullscreen[b-txvxhjanqc] {
    position: fixed !important;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1050;
    margin: 0 !important;
    border-radius: 0 !important;
    flex: unset !important;
    height: 100vh !important;
    max-height: 100vh !important;
    overflow: hidden;
    background: #fff;
}

.related-grid-fullscreen[b-txvxhjanqc]  .card-body {
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
}
/* /Components/Shared/Sidebar.razor.rz.scp.css */
/* Area selector dropdown (dark menu on the brand-primary background). Force legible light text on
   hover/focus/active; Bootstrap's default hover colour reads as near-black here, which looks odd. */
.dropdown-menu-dark .dropdown-item:hover[b-h8lbd6appl],
.dropdown-menu-dark .dropdown-item:focus[b-h8lbd6appl],
.dropdown-menu-dark .dropdown-item.active[b-h8lbd6appl],
.dropdown-menu-dark .dropdown-item:active[b-h8lbd6appl] {
    color: #fff;
    background-color: rgba(255, 255, 255, 0.14);
}
/* /Components/Shared/Timeline.razor.rz.scp.css */
.timeline-card[b-vinxgtpe5h] {
    cursor: pointer;
    transition: box-shadow 0.12s ease, border-color 0.12s ease;
}

.timeline-card:hover[b-vinxgtpe5h] {
    border-color: var(--bs-primary, #1e3a5f) !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}