/* /Components/Layout/MainLayout.razor.rz.scp.css */
body[b-tl3vfkimig] {
    /* Background image (add your image at wwwroot/images/dallas-temple.jpg) */
    background: linear-gradient(rgba(10,10,10,0.85), rgba(10,10,10,0.85)), url('/images/dallas-temple.jpg') center center / cover fixed no-repeat;
    /* Fallback color */
    background-color: #121212;
    color: #f1f1f1;
}

.page[b-tl3vfkimig] {
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    min-height: 100dvh; /* ensure full height including dynamic viewport on mobile */
}

main[b-tl3vfkimig] {
    flex: 1;
}

/* Frosted glass sidebar (NavMenu container) */
.sidebar[b-tl3vfkimig] {
    background: rgba(30,30,30,0.55);
    backdrop-filter: blur(14px) saturate(150%);
    -webkit-backdrop-filter: blur(14px) saturate(150%);
    border-right: 1px solid rgba(255,255,255,0.08);
    box-shadow: 0 0 25px -10px rgba(0,0,0,0.6);
}

/* Top row (brand bar) frosted */
.top-row[b-tl3vfkimig] {
    background: rgba(30,30,30,0.45);
    backdrop-filter: blur(18px) saturate(160%);
    -webkit-backdrop-filter: blur(18px) saturate(160%);
    border-bottom: 1px solid rgba(255,255,255,0.08);
    justify-content: flex-end;
    height: 3.5rem;
    display: flex;
    align-items: center;
}

.top-row[b-tl3vfkimig]  a, .top-row[b-tl3vfkimig]  .btn-link {
    white-space: nowrap;
    margin-left: 1.5rem;
    text-decoration: none;
}

.top-row[b-tl3vfkimig]  a:hover, .top-row[b-tl3vfkimig]  .btn-link:hover {
    text-decoration: underline;
}

.top-row[b-tl3vfkimig]  a:first-child {
    overflow: hidden;
    text-overflow: ellipsis;
}

@media (max-width: 640.98px) {
    .top-row[b-tl3vfkimig] {
        justify-content: space-between;
    }

    .top-row[b-tl3vfkimig]  a, .top-row[b-tl3vfkimig]  .btn-link {
        margin-left: 0;
    }
}

@media (min-width: 641px) {
    .page[b-tl3vfkimig] {
        flex-direction: row;
    }

    .sidebar[b-tl3vfkimig] {
        width: 210px; /* slightly wider for modern spacing */
        height: 100vh;
        height: 100dvh; /* use dvh to keep background full height on resize */
        position: sticky;
        top: 0;
    }

    .top-row[b-tl3vfkimig] {
        position: sticky;
        top: 0;
        z-index: 5;
    }

    .top-row.auth[b-tl3vfkimig]  a:first-child {
        flex: 1;
        text-align: right;
        width: 0;
    }

    .top-row[b-tl3vfkimig], article[b-tl3vfkimig] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }
}

#blazor-error-ui[b-tl3vfkimig] {
    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-tl3vfkimig] {
    cursor: pointer;
    position: absolute;
    right: 0.75rem;
    top: 0.5rem;
}
/* /Components/Layout/NavMenu.razor.rz.scp.css */
/* Controls are set via CSS variables in app.css :root
   --nav-bg-offset-x, --nav-bg-offset-y, --nav-image-blur
   --nav-frost-blur, --nav-frost-saturate, --nav-frost-bg
   --nav-item-hover-bg */

.navbar-toggler[b-49w2gsy4bu] {
    appearance: none;
    cursor: pointer;
    width: 3.5rem;
    height: 2.5rem;
    color: white;
    position: absolute;
    top: 0.5rem;
    right: 1rem;
    border: 1px solid rgba(255, 255, 255, 0.18);
    background: rgba(255,255,255,0.06) url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.75%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") no-repeat center/1.75rem;
}

.navbar-toggler:checked[b-49w2gsy4bu] { background-color: rgba(255, 255, 255, 0.3); }

/* Simple nav bar with blurred background gradient, plus frost overlay */
.top-row[b-49w2gsy4bu] {
    min-height: 3.5rem;
    position: relative;
    overflow: hidden;
    isolation: isolate; /* ensure stacking context */
    border-bottom: 1px solid rgba(255,255,255,0.12);
    contain: paint; /* improve repaint correctness */
    background-color: var(--nav-gradient-end, #0a1a2f); /* fallback to avoid flash */
}

/* Blurred gradient layer */
.top-row[b-49w2gsy4bu]::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        var(--nav-gradient-angle, 135deg),
        var(--nav-gradient-start, #203a43) 0%,
        var(--nav-gradient-mid, #2c5364) 50%,
        var(--nav-gradient-end, #0f2027) 80%,
        var(--nav-gradient-end, #0f2027) 100%
    );
    filter: blur(var(--nav-gradient-blur, 0px));
    /* removed transform to prevent stale layer size
       transform: scale(1.02); */
    z-index: 0; /* behind content */
    pointer-events: none;
    will-change: opacity; /* hint for smoother repaints */
}

/* Frosted glass overlay layer */
.top-row[b-49w2gsy4bu]::after {
    content: "";
    position: absolute;
    inset: 0;
    background: var(--nav-frost-bg, rgba(15,15,15,0.35));
    backdrop-filter: blur(var(--nav-frost-blur, 6px)) saturate(var(--nav-frost-saturate, 140%));
    -webkit-backdrop-filter: blur(var(--nav-frost-blur, 6px)) saturate(var(--nav-frost-saturate, 140%));
    z-index: 0; /* over ::before, under content */
    pointer-events: none;
    will-change: opacity; /* hint for smoother repaints */
}

/* Lift content above the blurred/frosted layers */
.top-row > *[b-49w2gsy4bu] { position: relative; z-index: 1; }

.navbar-brand[b-49w2gsy4bu] { font-size: 1.1rem; letter-spacing: 0.5px; font-weight: 600; text-shadow: 0 2px 6px rgba(0,0,0,0.55); }

/* Sidebar with blurred gradient and frost overlay */
.nav-scrollable[b-49w2gsy4bu] {
    position: relative;
    overflow-x: hidden; /* prevent horizontal scrollbar */
    overflow-y: auto;
    isolation: isolate;
    border-right: 1px solid rgba(255,255,255,0.14);
    box-shadow: 0 0 30px -10px rgba(0,0,0,0.8);
    contain: paint; /* improve repaint correctness */
    background-color: var(--nav-gradient-end, #0a1a2f); /* fallback to avoid light flash on resize */
}

/* Background gradient layer for sidebar */
.nav-scrollable[b-49w2gsy4bu]::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        var(--nav-gradient-angle, 135deg),
        var(--nav-gradient-start, #203a43) 0%,
        var(--nav-gradient-mid, #2c5364) 35%,
        var(--nav-gradient-end, #0f2027) 60%,
        var(--nav-gradient-end, #0f2027) 100%
    );
    filter: blur(var(--nav-gradient-blur, 0px));
    /* removed transform to prevent stale layer size
       transform: scale(1.02); */
    z-index: 0;
    pointer-events: none;
    will-change: opacity; /* hint for smoother repaints */
}

.nav-scrollable[b-49w2gsy4bu]::after {
    content: "";
    position: absolute;
    inset: 0;
    background: var(--nav-frost-bg, rgba(15,15,15,0.35));
    backdrop-filter: blur(var(--nav-frost-blur, 6px)) saturate(var(--nav-frost-saturate, 140%));
    -webkit-backdrop-filter: blur(var(--nav-frost-blur, 6px)) saturate(var(--nav-frost-saturate, 140%));
    z-index: 0;
    pointer-events: none;
    will-change: opacity; /* hint for smoother repaints */
}

/* Optional subtle section separators to avoid strong banding */
.nav-scrollable hr[b-49w2gsy4bu], .nav-scrollable .section-sep[b-49w2gsy4bu] {
    border: none;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.25), transparent);
    margin: 0.4rem 0.6rem;
}

/* Lift content above the blurred/frosted layers */
.nav-scrollable > *[b-49w2gsy4bu] { position: relative; z-index: 1; }

.bi[b-49w2gsy4bu] {
    display: inline-block;
    position: relative;
    width: 1.25rem;
    height: 1.25rem;
    margin-right: 0.65rem;
    top: -1px;
    background-size: cover;
    filter: drop-shadow(0 1px 2px rgba(0,0,0,0.55));
}

/* Icon definitions unchanged */
.bi-house-door-fill-nav-menu[b-49w2gsy4bu] { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-house-door-fill' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5Z'/%3E%3C/svg%3E"); }
.bi-plus-square-fill-nav-menu[b-49w2gsy4bu] { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-plus-square-fill' viewBox='0 0 16 16'%3E%3Cpath d='M2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2zm6.5 4.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3a.5.5 0 0 1 1 0z'/%3E%3C/svg%3E"); }
.bi-list-nested-nav-menu[b-49w2gsy4bu] { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-list-nested' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M4.5 11.5A.5.5 0 0 1 5 11h10a.5.5 0 0 1 0 1H5a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 3 7h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 1 3h10a.5.5 0 0 1 0 1H1a.5.5 0 0 1-.5-.5z'/%3E%3C/svg%3E"); }
.bi-lock-nav-menu[b-49w2gsy4bu] { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-list-nested' viewBox='0 0 16 16'%3E%3Cpath d='M8 1a2 2 0 0 1 2 2v4H6V3a2 2 0 0 1 2-2zm3 6V3a3 3 0 0 0-6 0v4a2 2 0 0 0-2 2v5a2 2 0 0 0 2 2h6a2 2 0 0 0 2-2V9a2 2 0 0 0-2-2zM5 8h6a1 1 0 0 1 1 1v5a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1V9a1 1 0 0 1 1-1z'/%3E%3C/svg%3E"); }
.bi-person-nav-menu[b-49w2gsy4bu] { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-person' viewBox='0 0 16 16'%3E%3Cpath d='M8 8a3 3 0 1 0 0-6 3 3 0 0 0 0 6Zm2-3a2 2 0 1 1-4 0 2 2 0 0 1 4,0Zm4 8c0 1-1 1-1 1H3s-1 0-1-1 1-4 6-4 6 3 6 4Zm-1-.004c-.001-.246-.154-.986-.832-1.664C11.516 10.68 10.289 10 8 10c-2.29 0-3.516.68-4.168 1.332-.678.678-.83 1.418-.832 1.664h10Z'/%3E%3C/svg%3E"); }
.bi-person-badge-nav-menu[b-49w2gsy4bu] { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-person-badge' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 2a.5.5 0 0 0 0 1h3a.5.5 0 0 0 0-1h-3zM11 8a3 3 0 1 1-6 0 3 3 0 0 1 6 0z'/%3E%3Cpath d='M4.5 0A2.5 2.5 0 0 0 2 2.5V14a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V2.5A2.5 2.5 0 0 0 11.5 0h-7zM3 2.5A1.5 1.5 0 0 1 4.5 1h7A1.5 1.5 0 0 1 13 2.5v10.795a4.2 4.2 0 0 0-.776-.492C11.392 12.387 10.063 12 8 12s-3.392.387-4.224.803a4.2 4.2 0 0 0-.776.492V2.5z'/%3E%3C/svg%3E"); }
.bi-person-fill-nav-menu[b-49w2gsy4bu] { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-person-fill' viewBox='0 0 16 16'%3E%3Cpath d='M3 14s-1 0-1-1 1-4 6-4 6 3 6 4-1 1-1 1H3Zm5-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6Z'/%3E%3C/svg%3E"); }
.bi-arrow-bar-left-nav-menu[b-49w2gsy4bu] { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-arrow-bar-left' viewBox='0 0 16 16'%3E%3Cpath d='M12.5 15a.5.5 0 0 1-.5-.5v-13a.5.5 0 0 1 1 0v13a.5.5 0 0 1-.5.5ZM10 8a.5.5 0 0 1-.5.5H3.707l2.147 2.146a.5.5 0 0 1-.708.708l-3-3a.5.5 0 0 1 0-.708l3-3a.5.5 0 1 1 .708.708L3.707 7.5H9.5a.5.5 0 0 1 .5.5Z'/%3E%3C/svg%3E"); }

.nav-item[b-49w2gsy4bu] { font-size: 0.9rem; padding-bottom: 0.5rem; }
.nav-item:first-of-type[b-49w2gsy4bu] { padding-top: 1rem; }
.nav-item:last-of-type[b-49w2gsy4bu] { padding-bottom: 1rem; }

/* Transparent items (no per-item frosting) */
.nav-item[b-49w2gsy4bu]  .nav-link {
    color: #f0f0f0;
    background: transparent;
    border: none;
    border-radius: 10px;
    height: 3rem;
    display: flex;
    align-items: center;
    line-height: 3rem;
    width: 100%;
    transition: color .2s, transform .2s; /* no background transition */
    font-weight: 500;
    letter-spacing: 0.35px;
    text-shadow: 0 2px 4px rgba(0,0,0,0.55);
    position: relative;
}

/* Active: transparent background with left indicator bar */
.nav-item[b-49w2gsy4bu]  a.active {
    background: transparent;
    color: #ffffff;
    border: none;
    box-shadow: inset 3px 0 0 0 rgba(255,255,255,0.35);
}

/* Hover/focus: match the active look with a slightly lighter indicator */
.nav-item[b-49w2gsy4bu]  .nav-link:hover,
.nav-item[b-49w2gsy4bu]  .nav-link:focus-visible {
    background: transparent;
    color: #ffffff;
    box-shadow: inset 3px 0 0 0 rgba(255,255,255,0.25);
    outline: none;
}

/* Scroll behavior and appearance */
.nav-scrollable[b-49w2gsy4bu] { display: none; }
.navbar-toggler:checked ~ .nav-scrollable[b-49w2gsy4bu] { display: block; }

@media (min-width: 641px) {
    .navbar-toggler[b-49w2gsy4bu] { display: none; }

    .nav-scrollable[b-49w2gsy4bu] {
        display: block;
        /* Use dynamic viewport height to handle mobile browser UI and window resizes */
        height: calc(100vh - 3.5rem);
        height: calc(100dvh - 3.5rem);
        overflow-x: hidden; /* ensure no horizontal scroll on desktop */
        overflow-y: auto;
        scrollbar-width: thin;
        scrollbar-color: rgba(255,255,255,0.35) transparent;
    }

    .nav-scrollable[b-49w2gsy4bu]::-webkit-scrollbar { width: 8px; }
    .nav-scrollable[b-49w2gsy4bu]::-webkit-scrollbar-track { background: transparent; }
    .nav-scrollable[b-49w2gsy4bu]::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.25); border-radius: 4px; }
    .nav-scrollable[b-49w2gsy4bu]::-webkit-scrollbar-thumb:hover { background: rgba(255,255,255,0.45); }
}

/* Solid footer-style background for the user section matching gradient end */
.nav-user-section[b-49w2gsy4bu] {
    position: relative;
    background: transparent; /* let the gradient show through */
    padding-top: 0.35rem;
    padding-bottom: 0.5rem;
    margin-top: -1px; /* overlap to hide any seam */
}

/* Section title style for menu group headers */
.nav-section-title[b-49w2gsy4bu] {
    display: block;
    color: #ffffff;
    font-size: 1rem; /* a bit larger to stand out */
    font-weight: 800;
    letter-spacing: 0.8px; /* slightly wider tracking */
    text-transform: uppercase;
    padding: 0.4rem 0.75rem 0.35rem 0; /* left padding = 0 */
    margin: 0.8rem 0.5rem 0.35rem 0.5rem;
    border-radius: 8px;
    background: transparent; /* keep gradient visible */
    box-shadow: none;
    text-shadow: 0 2px 4px rgba(0,0,0,0.6); /* stronger to pop on gradient */
    position: relative;
}

/* Accent bar for quick recognition */
.nav-section-title[b-49w2gsy4bu]::before {
    content: "";
    width: 6px;
    height: 20px; /* slightly taller */
    border-radius: 3px;
    margin-right: 0.5rem;
    background: linear-gradient(180deg, #7ae0ff, #4ab0ff); /* a touch brighter */
    display: inline-block;
    vertical-align: middle;
}
/* /Components/Pages/ActionItem.razor.rz.scp.css */
.action-row-container[b-t2dh1dycq6] {
    container: action-row / inline-size;
    min-width: 0;
    width: 100%;
}

.action-card[b-t2dh1dycq6] {
    --action-accent: #7a8798;
    --action-button-size: 44px;
    --action-tools-width: calc(3 * var(--action-button-size) + .5rem);
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto;
    grid-template-areas: "description description buttons" "status assigned assigned";
    align-items: start;
    gap: .35rem;
    min-width: 0;
    padding: .45rem .5rem;
    border: 1px solid #91c6bf;
    border-left: 3px solid var(--action-accent);
    border-radius: 6px;
    background: #effaf7;
    color: #182b46;
    font-family: var(--font-sans, "Segoe UI", sans-serif);
}

.accent-primary[b-t2dh1dycq6] { --action-accent: #3498db; }
.accent-warning[b-t2dh1dycq6] { --action-accent: #c69524; }
.accent-success[b-t2dh1dycq6] { --action-accent: #398164; }
.accent-secondary[b-t2dh1dycq6] { --action-accent: #7a8798; }

.action-card--modified[b-t2dh1dycq6] {
    border-top-color: #39857a;
    border-right-color: #39857a;
    border-bottom-color: #39857a;
}

.action-card--no-link[b-t2dh1dycq6] {
    --action-tools-width: calc(2 * var(--action-button-size) + .25rem);
}

.action-card--readonly[b-t2dh1dycq6] {
    --action-tools-width: var(--action-button-size);
}

.action-row__status[b-t2dh1dycq6] { grid-area: status; }
.action-row__assigned[b-t2dh1dycq6] { grid-area: assigned; }

.action-row__description[b-t2dh1dycq6] {
    grid-area: description;
    min-width: 0;
}

.action-row__control[b-t2dh1dycq6] {
    display: block;
    width: 100%;
    min-width: 0;
    min-height: 44px;
    box-sizing: border-box;
    padding: .5rem;
    border: 1px solid #9dc9c1;
    border-radius: 4px;
    background: #fff;
    color: #182b46;
    font: inherit;
    font-size: 1rem;
    line-height: 1.35;
}

.action-row__text[b-t2dh1dycq6] {
    height: 44px;
    padding: .5625rem .5rem;
    line-height: 1.5;
    resize: vertical;
}

.action-row__date[b-t2dh1dycq6] {
    display: block;
    margin-top: .2rem;
    color: #416d65;
    font-size: .65rem;
    line-height: 1.2;
}

.action-row__buttons[b-t2dh1dycq6] {
    grid-area: buttons;
    display: flex;
    justify-content: flex-end;
    gap: .25rem;
}

.action-row__button[b-t2dh1dycq6] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 var(--action-button-size);
    width: var(--action-button-size);
    height: var(--action-button-size);
    padding: 0;
    border: 1px solid #a7c9c1;
    border-radius: 5px;
    background: #e7f5f1;
    color: #155c57;
    font-size: 1rem;
    cursor: pointer;
}

.action-row__button--save:not(:disabled)[b-t2dh1dycq6] {
    border-color: #176e68;
    background: #176e68;
    color: #fff;
}

.action-row__button--save:disabled[b-t2dh1dycq6] {
    color: #6f8d87;
    cursor: default;
}

.action-row__button--delete[b-t2dh1dycq6] {
    border-color: #e4c6c9;
    background: #fff;
    color: #a32d3a;
}

.action-row__button:hover:not(:disabled)[b-t2dh1dycq6] {
    border-color: #176e68;
    background: #d3ebe4;
    color: #155c57;
}

.action-row__button--save:hover:not(:disabled)[b-t2dh1dycq6] {
    background: #10594f;
    color: #fff;
}

.action-row__button--delete:hover:not(:disabled)[b-t2dh1dycq6] {
    border-color: #a32d3a;
    background: #faedef;
    color: #a32d3a;
}

.action-row__control:focus-visible[b-t2dh1dycq6],
.action-row__button:focus-visible[b-t2dh1dycq6] {
    outline: 2px solid #176e68;
    outline-offset: 2px;
}

.action-card--readonly .action-row__control[b-t2dh1dycq6] {
    opacity: 1;
    background: #e8f3ef;
    color: #354760;
}

@container action-row (min-width: 42rem) {
    .action-card[b-t2dh1dycq6] {
        grid-template-columns: 7.5rem minmax(0, 1fr) 8.5rem var(--action-tools-width);
        grid-template-areas: "status description assigned buttons";
    }
}

@media (min-width: 48rem) and (pointer: fine) {
    .action-card[b-t2dh1dycq6] {
        --action-button-size: 36px;
    }

    .action-row__control[b-t2dh1dycq6] {
        min-height: 36px;
        padding: .4rem .45rem;
        font-size: .875rem;
    }

    .action-row__text[b-t2dh1dycq6] {
        height: 36px;
        padding: .40625rem .45rem;
    }
}
/* /Components/Pages/Agenda - Copy.razor.rz.scp.css */
.transition-all[b-a2xhsa8xlj] {
    transition: all 0.2s ease-in-out;
}

.hover-scale[b-a2xhsa8xlj] {
    transition: transform 0.2s ease;
}

    .hover-scale:hover[b-a2xhsa8xlj] {
        transform: scale(1.05);
    }

.cursor-pointer[b-a2xhsa8xlj] {
    cursor: pointer;
}

/* Ensure summary behaves like a list item */
details summary[b-a2xhsa8xlj] {
    display: list-item; /* Restores the default marker */
    cursor: pointer; /* Ensures the pointer cursor for interactivity */
    position: relative; /* Allows positioning of custom elements */
}

    /* Add a custom indicator after the summary text */
    details summary[b-a2xhsa8xlj]::after {
        font-size: 1rem;
        position: absolute;
        right: 0.5rem; /* Position it to the far right */
        transition: transform 0.2s ease-in-out;
    }




.grid-container[b-a2xhsa8xlj] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 100%));
    gap: 10px; /* Spacing between cards */
}

.card[b-a2xhsa8xlj] {
    background-color: #fff;
    border: 2px solid #ddd;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
    padding: 10px;
}

.card-header[b-a2xhsa8xlj] {
    display: flex;
    align-items: left;
    margin-bottom: 15px;
    padding: 0px;
}

    .card-header .name-section[b-a2xhsa8xlj] {
        flex-grow: 1; /* Allows the name input to take up available space */
        display: flex;
        align-items: 15px;
    }

        .card-header .name-section i[b-a2xhsa8xlj] {
            margin-right: 10px; /* Space between icon and input */
        }

        .card-header .name-section input[b-a2xhsa8xlj] {
            flex-grow: 1; /* Allows input to fill the available space */
        }

    .card-header .ward-section[b-a2xhsa8xlj] {
        margin-left: 10px; /* Space between name input and ward dropdown */
    }

.card-content[b-a2xhsa8xlj], .card-actions[b-a2xhsa8xlj] {
    margin-bottom: 10px;
}

.form-control[b-a2xhsa8xlj], .status-dropdown[b-a2xhsa8xlj], .textarea-notes[b-a2xhsa8xlj] {
    width: 100%;
    box-sizing: border-box;
}

.textarea-notes[b-a2xhsa8xlj] {
    resize: vertical; /* Allows vertical resizing */
}

.btn[b-a2xhsa8xlj] {
    margin-right: 10px;
}

.add-item-card[b-a2xhsa8xlj] {
    background-color: #f8f9fa; /* Light background color for distinction */
    border: 2px solid #007bff; /* Blue border for emphasis */
    color: #007bff; /* Blue text color */
    padding: 20px;
    margin-bottom: 20px;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}

    .add-item-card .card-header h2[b-a2xhsa8xlj] {
        color: #007bff; /* Blue header color */
    }

    .add-item-card .btn-primary[b-a2xhsa8xlj] {
        background-color: #007bff; /* Blue button background */
        border-color: #007bff; /* Blue button border */
    }

    .add-item-card .user-section[b-a2xhsa8xlj] {
        display: flex;
        gap: 10px; /* Spacing between Created By and Assigned To fields */
    }

        .add-item-card .user-section input[b-a2xhsa8xlj] {
            flex-grow: 1; /* Make inputs take equal space */
        }

    .add-item-card .textarea-notes[b-a2xhsa8xlj] {
        width: 100%; /* Full width for the textarea */
        margin-top: 10px; /* Spacing above the textarea */
    }


.status-new[b-a2xhsa8xlj] {
    border-color: blue;
    background-color: #B3D4E3;
}

.status-in-progress[b-a2xhsa8xlj] {
    border-color: darkorange;
    background-color: #fa0; /*#B3D4E3;  Light blue */
}



.status-on-hold[b-a2xhsa8xlj] {
    border-color: darkred;
    background-color: #f62; /* Light red */
}


.status-completed[b-a2xhsa8xlj] {
    border-color: grey;
    background-color: #E3BFC4; /* Light green */
}

.user-section[b-a2xhsa8xlj] {
    display: flex;
    justify-content: space-between;
    gap: 10px;
}

.user-field[b-a2xhsa8xlj] {
    flex-basis: 48%; /* Adjust as necessary for your layout */
    display: flex;
    flex-direction: column;
}

.user-section[b-a2xhsa8xlj] {
    display: flex;
    justify-content: space-between;
    gap: 10px;
}

.user-field[b-a2xhsa8xlj] {
    flex-basis: 48%;
    display: flex;
    flex-direction: column;
}

.blue-border-input[b-a2xhsa8xlj] {
    border: 2px solid #007bff; /* Blue border color */
    border-radius: 4px; /* Optional: to match the style of other elements */
}

/* Visual feedback borders */
.modified-border[b-a2xhsa8xlj] {
    border: 2px solid #ffc107 !important; /* amber for modified */
    box-shadow: 0 0 0 2px rgba(255, 193, 7, 0.2);
    border-radius: 6px;
}
.saving-border[b-a2xhsa8xlj] {
    border: 2px dashed #17a2b8 !important; /* info for saving */
    box-shadow: 0 0 0 2px rgba(23, 162, 184, 0.15);
    border-radius: 6px;
}
.saved-border[b-a2xhsa8xlj] {
    border: 2px solid #28a745 !important; /* green for saved */
    box-shadow: 0 0 0 2px rgba(40, 167, 69, 0.15);
    border-radius: 6px;
}

.non-expanded-card[b-a2xhsa8xlj] {
    display: inline-block;
    width: 100%;
    padding: 10px;
    padding-left: 20px;
    padding-bottom: 0; /* Remove bottom padding to avoid double padding */
    border-radius: 10px;
    margin-right: 10px; /* Add margin between cards */
    margin-bottom: 10px; /* Add margin between cards */
}

.expanded-card[b-a2xhsa8xlj] {
    flex-grow: 1; /* Allow the expanded card to take up all available width */
    width: auto !important; /* Reset any width set for non-expanded state */
    padding: 10px;
    margin-bottom: 10px; /* Add margin between cards */
    border-radius: 10px;
}

label[b-a2xhsa8xlj] {
    padding-top: 5px;
}

/* Media query for mobile devices */
@@media (max-width: 600px) {
    .user-section[b-a2xhsa8xlj] {
        flex-direction: column;
    }

    .user-field[b-a2xhsa8xlj] {
        flex-basis: 100%; /* Fields take full width */
        margin-bottom: 10px; /* Space between fields */
    }
}


.e-richtexteditor[b-a2xhsa8xlj] {
    width: 100% !important; /* Ensure the editor takes full width */
    resize: vertical !important; /* Restrict resizing to vertical */
    min-height: 110px;
    max-height: 800px;
}




.chat-container[b-a2xhsa8xlj] {
    width: 100% !important;
    max-width: 100%;
    background-color: #fff;
    border-radius: 10px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
    padding: 20px;
    overflow-y: auto;
    max-height: 80vh;
}

.message[b-a2xhsa8xlj] {
    margin-bottom: 15px;
    display: flex;
    flex-direction: column;
}

    .message .sender[b-a2xhsa8xlj] {
        font-size: 0.9em;
        font-weight: bold;
        margin-bottom: 5px;
        color: #555;
    }

    .message .bubble[b-a2xhsa8xlj] {
        padding: 10px 15px;
        border-radius: 15px;
        max-width: 80%;
        word-wrap: break-word;
        font-size: 0.95em;
        line-height: 1.4;
    }

    /* Styles for the sender's message */
    .message.sent .bubble[b-a2xhsa8xlj] {
        background-color: #d1f7c4;
        color: #333;
        align-self: flex-start;
        border-bottom-right-radius: 0;
    }

    /* Styles for the receiver's message */
    .message.received .bubble[b-a2xhsa8xlj] {
        background-color: #f0f0f0;
        color: #333;
        align-self: flex-start;
        border-bottom-left-radius: 0;
    }


.form-check-input-lg[b-a2xhsa8xlj] {
    width: 3em !important; /* Force the custom width */
    height: 1.5em !important; /* Adjust height for proportional scaling */
    border-radius: 2em !important; /* Rounded edges for a toggle look */
}

    .form-check-input-lg:checked[b-a2xhsa8xlj] {
        background-color: #0d6efd !important; /* Custom color for the toggled state */
    }



/* Status chips used beside field labels */
.status-chip[b-a2xhsa8xlj] {
    display: inline-block;
    margin-left: .5rem;
    padding: .15rem .4rem;
    border-radius: .5rem;
    font-size: .75rem;
    line-height: 1;
    vertical-align: middle;
}
.chip-unsaved[b-a2xhsa8xlj] { background: #fff3cd; color: #8a6d3b; border: 1px solid #ffe8a1; }
.chip-saving[b-a2xhsa8xlj]  { background: #e7f1ff; color: #0b5ed7; border: 1px solid #cfe2ff; }
.chip-saved[b-a2xhsa8xlj]   { background: #d1e7dd; color: #0f5132; border: 1px solid #badbcc; }

/* Existing border highlight hooks */
.modified-border[b-a2xhsa8xlj] { outline: 2px dashed #ffc107; outline-offset: 2px; }
.saving-border[b-a2xhsa8xlj]   { outline: 2px dashed #0d6efd; outline-offset: 2px; }
.saved-border[b-a2xhsa8xlj]    { outline: 2px dashed #198754; outline-offset: 2px; }


/* /Components/Pages/Agenda.razor.rz.scp.css */
.transition-all[b-1gm8opsk53] {
    transition: all 0.2s ease-in-out;
}

.hover-scale[b-1gm8opsk53] {
    transition: transform 0.2s ease;
}

    .hover-scale:hover[b-1gm8opsk53] {
        transform: scale(1.05);
    }

.cursor-pointer[b-1gm8opsk53] {
    cursor: pointer;
}

/* Ensure summary behaves like a list item */
details summary[b-1gm8opsk53] {
    display: list-item; /* Restores the default marker */
    cursor: pointer; /* Ensures the pointer cursor for interactivity */
    position: relative; /* Allows positioning of custom elements */
}

    /* Add a custom indicator after the summary text */
    details summary[b-1gm8opsk53]::after {
        font-size: 1rem;
        position: absolute;
        right: 0.5rem; /* Position it to the far right */
        transition: transform 0.2s ease-in-out;
    }




.grid-container[b-1gm8opsk53] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 100%));
    gap: 10px; /* Spacing between cards */
}

.card[b-1gm8opsk53] {
    background-color: #fff;
    border: 2px solid #ddd;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
    padding: 10px;
}

.card-header[b-1gm8opsk53] {
    display: flex;
    align-items: left;
    margin-bottom: 15px;
    padding: 0px;
}

    .card-header .name-section[b-1gm8opsk53] {
        flex-grow: 1; /* Allows the name input to take up available space */
        display: flex;
        align-items: 15px;
    }

        .card-header .name-section i[b-1gm8opsk53] {
            margin-right: 10px; /* Space between icon and input */
        }

        .card-header .name-section input[b-1gm8opsk53] {
            flex-grow: 1; /* Allows input to fill the available space */
        }

    .card-header .ward-section[b-1gm8opsk53] {
        margin-left: 10px; /* Space between name input and ward dropdown */
    }

.card-content[b-1gm8opsk53], .card-actions[b-1gm8opsk53] {
    margin-bottom: 10px;
}

.form-control[b-1gm8opsk53], .status-dropdown[b-1gm8opsk53], .textarea-notes[b-1gm8opsk53] {
    width: 100%;
    box-sizing: border-box;
}

.textarea-notes[b-1gm8opsk53] {
    resize: vertical; /* Allows vertical resizing */
}

.btn[b-1gm8opsk53] {
    margin-right: 10px;
}

.agenda-button[b-1gm8opsk53] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .4rem;
    min-width: 0;
    min-height: 44px;
    max-width: 100%;
    margin: 0;
    padding: .45rem .65rem;
    border: 1px solid #b9c6d6;
    border-radius: 6px;
    background: #fff;
    color: #354760;
    font-size: .875rem;
    font-weight: 600;
    line-height: 1.25;
}

.agenda-button > i[b-1gm8opsk53] {
    flex-shrink: 0;
    font-size: 1rem;
    line-height: 1;
}

.agenda-button:hover:not(:disabled)[b-1gm8opsk53] {
    border-color: #8394ac;
    background: #e4eaf3;
    color: #182b46;
}

.agenda-button--primary[b-1gm8opsk53] {
    border-color: #182b46;
    background: #182b46;
    color: #fff;
}

.agenda-button--primary:hover:not(:disabled)[b-1gm8opsk53] {
    border-color: #294566;
    background: #294566;
    color: #fff;
}

.agenda-button--action[b-1gm8opsk53] {
    border-color: #176e68;
    background: #176e68;
    color: #fff;
}

.agenda-button--action:hover:not(:disabled)[b-1gm8opsk53] {
    border-color: #10594f;
    background: #10594f;
    color: #fff;
}

.agenda-button--danger[b-1gm8opsk53] {
    border-color: #d8aab0;
    background: #fff;
    color: #a32d3a;
}

.agenda-button--danger:hover:not(:disabled)[b-1gm8opsk53] {
    border-color: #a32d3a;
    background: #faedef;
    color: #a32d3a;
}

.agenda-button--icon[b-1gm8opsk53] {
    width: 44px;
    min-width: 44px;
    padding: 0;
}

.agenda-button:disabled[b-1gm8opsk53] {
    opacity: .55;
    cursor: default;
}

.agenda-button:focus-visible[b-1gm8opsk53] {
    outline: 2px solid #2e69a3;
    outline-offset: 2px;
    box-shadow: none;
}

.agenda-actions[b-1gm8opsk53] {
    --disclosure-border: #91c6bf;
    --disclosure-heading: #dff1ed;
    --disclosure-hover: #cde7e1;
    --disclosure-focus: #176e68;
    margin: .75rem 0;
    border: 1px solid #91c6bf;
    border-left: 3px solid #176e68;
    border-radius: 8px;
    background: #effaf7;
    color: #155c57;
}

.agenda-actions__body[b-1gm8opsk53] {
    display: grid;
    gap: .75rem;
    min-width: 0;
    padding: .65rem .75rem .75rem;
}

.agenda-actions__filter[b-1gm8opsk53] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: .5rem;
    min-width: 0;
    margin: 0;
    font-size: .8rem;
    font-weight: 600;
}

.agenda-actions__filter > span[b-1gm8opsk53] {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
}

.agenda-actions .agenda-actions__body .form-control[b-1gm8opsk53] {
    border-color: #9dc9c1;
}

.agenda-actions .agenda-actions__body select.form-control[b-1gm8opsk53] {
    padding-right: 2rem;
}

.agenda-actions__composer[b-1gm8opsk53] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 44px;
    grid-template-areas: "description description description" "status assigned submit";
    align-items: end;
    gap: .5rem;
    padding: .65rem;
    border: 1px solid #91c6bf;
    border-radius: 6px;
    background: #dff1ed;
}

.agenda-actions__composer .agenda-item__field > span[b-1gm8opsk53] {
    color: #416d65;
}

.agenda-actions__description[b-1gm8opsk53] { grid-area: description; }
.agenda-actions__status[b-1gm8opsk53] { grid-area: status; }
.agenda-actions__assigned[b-1gm8opsk53] { grid-area: assigned; }

.agenda-actions__submit[b-1gm8opsk53] {
    grid-area: submit;
    align-self: end;
    padding-right: 0;
    padding-left: 0;
    white-space: nowrap;
}

.agenda-actions__submit > span[b-1gm8opsk53] {
    display: none;
}

.agenda-actions__list-heading[b-1gm8opsk53] {
    display: flex;
    align-items: center;
    gap: .45rem;
    margin: 0 0 .4rem;
    color: #416d65;
    font-size: .85rem;
    font-weight: 600;
}

.agenda-actions__count[b-1gm8opsk53] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.5rem;
    padding: .1rem .4rem;
    border: 1px solid #91c6bf;
    border-radius: 1rem;
    background: #dff1ed;
    color: #155c57;
    font-size: .75rem;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

.agenda-actions__list[b-1gm8opsk53] {
    display: grid;
    gap: .4rem;
    min-width: 0;
}

.agenda-actions__completed[b-1gm8opsk53] {
    min-width: 0;
    border-top: 1px solid #b7d9d0;
}

.agenda-actions__completed > summary[b-1gm8opsk53] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    min-height: 44px;
    padding: .45rem 0;
    font-size: .85rem;
    font-weight: 600;
    list-style: none;
}

.agenda-actions__completed > summary:focus-visible[b-1gm8opsk53],
.agenda-actions .form-control:focus-visible[b-1gm8opsk53] {
    outline: 2px solid #176e68;
    outline-offset: 2px;
}

.agenda-actions__empty[b-1gm8opsk53] {
    margin: 0;
    padding: .5rem 0;
    color: #416d65;
    font-size: .875rem;
    line-height: 1.5;
}

@media (min-width: 48rem) {
    .agenda-actions__filter[b-1gm8opsk53] {
        justify-self: end;
        width: min(100%, 22rem);
    }

    .agenda-actions__composer[b-1gm8opsk53] {
        grid-template-columns: minmax(6.5rem, .75fr) minmax(0, 2fr) minmax(7rem, 1fr) auto;
        grid-template-areas: "status description assigned submit";
        gap: .5rem .65rem;
    }

    .agenda-actions__submit[b-1gm8opsk53] {
        padding-right: .65rem;
        padding-left: .65rem;
    }

    .agenda-actions__submit > span[b-1gm8opsk53] {
        display: inline;
    }
}

.agenda-add-item[b-1gm8opsk53] {
    margin: .75rem 0;
    border: 1px solid #b9c6d6;
    border-left: 3px solid #182b46;
    border-radius: 8px;
    background: #f1f4f8;
    color: #182b46;
}

.agenda-add-item > summary[b-1gm8opsk53],
.agenda-actions > summary[b-1gm8opsk53] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    min-height: 44px;
    padding: .55rem .75rem;
    border-radius: 6px;
    background: var(--disclosure-heading, #e4eaf3);
    font-size: 1rem;
    font-weight: 600;
    list-style: none;
}

.agenda-add-item > summary[b-1gm8opsk53]::-webkit-details-marker,
.agenda-actions > summary[b-1gm8opsk53]::-webkit-details-marker,
.agenda-actions__completed > summary[b-1gm8opsk53]::-webkit-details-marker {
    display: none;
}

.agenda-add-item > summary:hover[b-1gm8opsk53],
.agenda-actions > summary:hover[b-1gm8opsk53] {
    background: var(--disclosure-hover, #d6e0ed);
}

.agenda-add-item > summary:focus-visible[b-1gm8opsk53],
.agenda-actions > summary:focus-visible[b-1gm8opsk53] {
    outline: 2px solid var(--disclosure-focus, #2e69a3);
    outline-offset: -3px;
}

.agenda-add-item[open] > summary[b-1gm8opsk53],
.agenda-actions[open] > summary[b-1gm8opsk53] {
    border-bottom: 1px solid var(--disclosure-border, #b9c6d6);
    border-radius: 6px 6px 0 0;
}

.agenda-add-item__heading[b-1gm8opsk53],
.agenda-actions__heading[b-1gm8opsk53] {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
}

.agenda-add-item__chevron[b-1gm8opsk53],
.agenda-actions__chevron[b-1gm8opsk53] {
    flex-shrink: 0;
    font-size: .8rem;
}

.agenda-add-item[open] > summary > .agenda-add-item__chevron[b-1gm8opsk53],
.agenda-actions[open] > summary > .agenda-actions__chevron[b-1gm8opsk53],
.agenda-actions__completed[open] > summary > .agenda-actions__chevron[b-1gm8opsk53] {
    transform: rotate(180deg);
}

.agenda-add-item__form[b-1gm8opsk53] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas: "title title" "description description" "assigned submit";
    gap: .6rem .5rem;
    padding: .65rem .75rem .75rem;
}

.agenda-add-item__title[b-1gm8opsk53] {
    grid-area: title;
}

.agenda-add-item__title > input[b-1gm8opsk53] {
    font-weight: 600;
}

.agenda-add-item__description[b-1gm8opsk53] {
    grid-area: description;
}

.agenda-add-item__description > textarea[b-1gm8opsk53] {
    flex: 1;
    min-height: 5.5rem;
    padding: .4rem .5rem;
    line-height: 1.5;
}

.agenda-add-item__assigned[b-1gm8opsk53] {
    grid-area: assigned;
}

.agenda-add-item .agenda-add-item__assigned > select[b-1gm8opsk53] {
    padding-right: 2rem;
}

.agenda-add-item__submit[b-1gm8opsk53] {
    grid-area: submit;
    align-self: end;
    white-space: nowrap;
}

@media (min-width: 48rem) {
    .agenda-add-item__form[b-1gm8opsk53] {
        grid-template-columns: minmax(0, 1fr) minmax(0, 2fr) auto;
        grid-template-areas: "title description submit" "assigned description submit";
        gap: .5rem .75rem;
    }
}

.status-new[b-1gm8opsk53] {
    border-color: blue;
    background-color: #B3D4E3;
}

.status-in-progress[b-1gm8opsk53] {
    border-color: darkorange;
    background-color: #fa0; /*#B3D4E3;  Light blue */
}



.status-on-hold[b-1gm8opsk53] {
    border-color: darkred;
    background-color: #f62; /* Light red */
}


.status-completed[b-1gm8opsk53] {
    border-color: grey;
    background-color: #E3BFC4; /* Light green */
}

.user-section[b-1gm8opsk53] {
    display: flex;
    justify-content: space-between;
    gap: 10px;
}

.user-field[b-1gm8opsk53] {
    flex-basis: 48%; /* Adjust as necessary for your layout */
    display: flex;
    flex-direction: column;
}

.user-section[b-1gm8opsk53] {
    display: flex;
    justify-content: space-between;
    gap: 10px;
}

.user-field[b-1gm8opsk53] {
    flex-basis: 48%;
    display: flex;
    flex-direction: column;
}

.blue-border-input[b-1gm8opsk53] {
    border: 2px solid #007bff; /* Blue border color */
    border-radius: 4px; /* Optional: to match the style of other elements */
}

/* Visual feedback borders */
.modified-border[b-1gm8opsk53] {
    border: 2px solid #ffc107 !important; /* amber for modified */
    box-shadow: 0 0 0 2px rgba(255, 193, 7, 0.2);
    border-radius: 6px;
}
.saving-border[b-1gm8opsk53] {
    border: 2px dashed #17a2b8 !important; /* info for saving */
    box-shadow: 0 0 0 2px rgba(23, 162, 184, 0.15);
    border-radius: 6px;
}
.saved-border[b-1gm8opsk53] {
    border: 2px solid #28a745 !important; /* green for saved */
    box-shadow: 0 0 0 2px rgba(40, 167, 69, 0.15);
    border-radius: 6px;
}

.non-expanded-card[b-1gm8opsk53] {
    display: inline-block;
    width: 100%;
    padding: 10px;
    padding-left: 20px;
    padding-bottom: 0; /* Remove bottom padding to avoid double padding */
    border-radius: 10px;
    margin-right: 10px; /* Add margin between cards */
    margin-bottom: 10px; /* Add margin between cards */
}

label[b-1gm8opsk53] {
    padding-top: 5px;
}

/* Media query for mobile devices */
@@media (max-width: 600px) {
    .user-section[b-1gm8opsk53] {
        flex-direction: column;
    }

    .user-field[b-1gm8opsk53] {
        flex-basis: 100%; /* Fields take full width */
        margin-bottom: 10px; /* Space between fields */
    }

    .history-btn[b-1gm8opsk53] {
        margin-top: .25rem;
    }
}


.e-richtexteditor[b-1gm8opsk53] {
    width: 100% !important; /* Ensure the editor takes full width */
    resize: vertical !important; /* Restrict resizing to vertical */
    min-height: 110px;
    max-height: 800px;
}




.chat-container[b-1gm8opsk53] {
    width: 100% !important;
    max-width: 100%;
    background-color: #fff;
    border-radius: 10px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
    padding: 20px;
    overflow-y: auto;
    max-height: 80vh;
}

.message[b-1gm8opsk53] {
    margin-bottom: 15px;
    display: flex;
    flex-direction: column;
}

    .message .sender[b-1gm8opsk53] {
        font-size: 0.9em;
        font-weight: bold;
        margin-bottom: 5px;
        color: #555;
    }

    .message .bubble[b-1gm8opsk53] {
        padding: 10px 15px;
        border-radius: 15px;
        max-width: 80%;
        word-wrap: break-word;
        font-size: 0.95em;
        line-height: 1.4;
    }

    /* Styles for the sender's message */
    .message.sent .bubble[b-1gm8opsk53] {
        background-color: #d1f7c4;
        color: #333;
        align-self: flex-start;
        border-bottom-right-radius: 0;
    }

    /* Styles for the receiver's message */
    .message.received .bubble[b-1gm8opsk53] {
        background-color: #f0f0f0;
        color: #333;
        align-self: flex-start;
        border-bottom-left-radius: 0;
    }


.form-check-input-lg[b-1gm8opsk53] {
    width: 3em !important; /* Force the custom width */
    height: 1.5em !important; /* Adjust height for proportional scaling */
    border-radius: 2em !important; /* Rounded edges for a toggle look */
}

    .form-check-input-lg:checked[b-1gm8opsk53] {
        background-color: #0d6efd !important; /* Custom color for the toggled state */
    }



/* Status chips used beside field labels */
.status-chip[b-1gm8opsk53] {
    display: inline-block;
    margin-left: .5rem;
    padding: .15rem .4rem;
    border-radius: .5rem;
    font-size: .75rem;
    line-height: 1;
    vertical-align: middle;
}
.chip-unsaved[b-1gm8opsk53] { background: #fff3cd; color: #8a6d3b; border: 1px solid #ffe8a1; }
.chip-saving[b-1gm8opsk53]  { background: #e7f1ff; color: #0b5ed7; border: 1px solid #cfe2ff; }
.chip-saved[b-1gm8opsk53]   { background: #d1e7dd; color: #0f5132; border: 1px solid #badbcc; }

/* Existing border highlight hooks */
.modified-border[b-1gm8opsk53] { outline: 2px dashed #ffc107; outline-offset: 2px; }
.saving-border[b-1gm8opsk53]   { outline: 2px dashed #0d6efd; outline-offset: 2px; }
.saved-border[b-1gm8opsk53]    { outline: 2px dashed #198754; outline-offset: 2px; }

.agenda-item-list[b-1gm8opsk53] {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: .5rem;
    margin-top: .65rem;
    align-items: start;
}

.agenda-item[b-1gm8opsk53] {
    --priority-surface: #f1f4f8;
    --priority-fill: #e4eaf3;
    --priority-ink: #354760;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    min-width: 0;
    background: var(--priority-surface);
    border: 1px solid #cbd3df;
    border-radius: 8px;
    box-shadow: 0 1px 2px rgba(24, 43, 70, .08);
    color: #182b46;
    font-family: var(--font-sans, "Segoe UI", sans-serif);
    scroll-margin-top: 1rem;
}

/* Priority colors the working surface; the left stripe remains the status indicator. */
.agenda-item--urgent[b-1gm8opsk53] {
    --priority-surface: #fff0e6;
    --priority-fill: #ffd7c0;
    --priority-ink: #8c3413;
}

.agenda-item--high[b-1gm8opsk53] {
    --priority-surface: #fff7de;
    --priority-fill: #ffecad;
    --priority-ink: #715000;
}

.agenda-item--medium[b-1gm8opsk53] {
    --priority-surface: #edf4fa;
    --priority-fill: #d6e7f6;
    --priority-ink: #295473;
}

.agenda-item--low[b-1gm8opsk53] {
    --priority-surface: #edf4ef;
    --priority-fill: #d4e7da;
    --priority-ink: #315d44;
}

.agenda-item__controls[b-1gm8opsk53],
.agenda-item__compact-editor[b-1gm8opsk53],
.agenda-item__section[b-1gm8opsk53] {
    min-width: 0;
}

.agenda-item__compact-editor[b-1gm8opsk53] {
    padding: 0 .5rem .4rem;
}

.agenda-item__compact-editor .textarea-notes[b-1gm8opsk53] {
    height: 110px;
    min-height: 110px;
    margin: 0;
    padding: .4rem .5rem;
}

@media (min-width: 64rem) {
    .agenda-item:not(.agenda-item--expanded)[b-1gm8opsk53] {
        grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
    }

    .agenda-item__compact-editor[b-1gm8opsk53] {
        padding: .4rem .5rem .4rem 0;
    }
}

.agenda-item__bar[b-1gm8opsk53] {
    display: flex;
    align-items: center;
    gap: .4rem;
    padding: .4rem .5rem 0;
}

.agenda-item--expanded .agenda-item__bar[b-1gm8opsk53] {
    padding-bottom: .4rem;
    background: #182b46;
    border-radius: 7px 7px 0 0;
}

.agenda-item__title-input[b-1gm8opsk53] {
    flex: 1 1 auto;
    min-width: 0;
    min-height: 44px;
    padding: .4rem .6rem;
    border: 1px solid #cbd3df;
    border-radius: 5px;
    background: #fff;
    color: #182b46;
    font-size: 1rem;
    font-weight: 600;
}

.agenda-item--expanded .agenda-item__title-input[b-1gm8opsk53] {
    background: #182b46;
    border-color: #8394ac;
    color: #fff;
}

.agenda-item__title-input[b-1gm8opsk53]::placeholder {
    color: #596a80;
}

.agenda-item--expanded .agenda-item__title-input[b-1gm8opsk53]::placeholder {
    color: #cbd3df;
}

.agenda-item__icon-btn[b-1gm8opsk53] {
    flex-shrink: 0;
    min-width: 44px;
    min-height: 44px;
    background: #182b46;
    border: 1px solid #8394ac;
    color: #fff;
}

.agenda-item__fields[b-1gm8opsk53] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .35rem;
    padding: .3rem .5rem .4rem;
}

@media (min-width: 48rem) {
    .agenda-item__fields[b-1gm8opsk53] {
        grid-template-columns: minmax(0, 1fr) minmax(3.5rem, .5fr) minmax(0, 1fr) minmax(0, 1.2fr);
    }

    .agenda-item--expanded .agenda-item__fields[b-1gm8opsk53] {
        grid-template-columns: minmax(0, 1fr) minmax(3.5rem, .5fr) minmax(0, 1fr) minmax(0, 1.3fr) minmax(0, 1.2fr);
    }
}

.agenda-item__field[b-1gm8opsk53] {
    display: flex;
    flex-direction: column;
    gap: .25rem;
    min-width: 0;
    margin: 0;
    padding: 0;
}

.agenda-item__fields > .agenda-item__field[b-1gm8opsk53] {
    position: relative;
    gap: 0;
}

.agenda-item__fields > .agenda-item__field > label[b-1gm8opsk53],
.agenda-item__fields > .agenda-item__field > span[b-1gm8opsk53] {
    position: absolute;
    top: .3rem;
    left: .5rem;
    z-index: 1;
    max-width: calc(100% - 1rem);
    font-size: .65rem;
    line-height: 1;
    pointer-events: none;
}

.agenda-item__field label[b-1gm8opsk53],
.agenda-item__field > span[b-1gm8opsk53],
.agenda-item__section-head label[b-1gm8opsk53] {
    margin: 0;
    padding-top: 0;
    color: #4a5870;
    font-size: .8rem;
    font-weight: 600;
    line-height: 1.3;
}

.agenda-item .form-control[b-1gm8opsk53],
.agenda-item .textarea-notes[b-1gm8opsk53],
.agenda-add-item .form-control[b-1gm8opsk53],
.agenda-add-item .textarea-notes[b-1gm8opsk53],
.agenda-actions .form-control[b-1gm8opsk53],
.agenda-item__message-form textarea[b-1gm8opsk53] {
    min-width: 0;
    max-width: 100%;
    border: 1px solid #aebcce;
    border-radius: 4px;
    background: #fff;
    color: #182b46;
    font-size: 1rem;
}

.agenda-item .form-control[b-1gm8opsk53],
.agenda-actions .form-control[b-1gm8opsk53],
.agenda-add-item .form-control[b-1gm8opsk53] {
    min-height: 44px;
    padding: .35rem .4rem;
}

.agenda-item__fields .form-control[b-1gm8opsk53] {
    min-height: 50px;
    height: 50px;
    padding: 1.1rem .45rem .15rem;
    line-height: 1.2;
}

.agenda-item__fields .agenda-item__priority > span[b-1gm8opsk53] {
    color: var(--priority-ink);
}

.agenda-item__fields .agenda-item__priority > select[b-1gm8opsk53] {
    border-color: var(--priority-ink);
    background: var(--priority-fill);
    color: var(--priority-ink);
    font-weight: 600;
}

.agenda-item .btn[b-1gm8opsk53] {
    min-height: 44px;
    margin: 0;
}

.agenda-item input:focus-visible[b-1gm8opsk53],
.agenda-item select:focus-visible[b-1gm8opsk53],
.agenda-item textarea:focus-visible[b-1gm8opsk53],
.agenda-item button:focus-visible[b-1gm8opsk53],
.agenda-add-item input:focus-visible[b-1gm8opsk53],
.agenda-add-item select:focus-visible[b-1gm8opsk53],
.agenda-add-item textarea:focus-visible[b-1gm8opsk53],
.agenda-item summary:focus-visible[b-1gm8opsk53] {
    outline: 2px solid #2e69a3;
    outline-offset: 2px;
}

.agenda-item--expanded .agenda-item__bar :focus-visible[b-1gm8opsk53] {
    outline-color: #fff;
}

.agenda-item__section[b-1gm8opsk53] {
    padding: .35rem .5rem;
    border-top: 1px solid rgba(24, 43, 70, .12);
}

.agenda-item__section > summary[b-1gm8opsk53] {
    padding: .15rem 0;
    color: #182b46;
    font-size: .85rem;
    font-weight: 600;
    cursor: pointer;
}

.agenda-item__section-head[b-1gm8opsk53] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .2rem .45rem;
    margin-bottom: .3rem;
}

.agenda-item__section--actions[b-1gm8opsk53] {
    border-top-color: #91c6bf;
    border-bottom: 1px solid #91c6bf;
    background: #dff1ed;
}

.agenda-item__section--actions .agenda-item__section-head label[b-1gm8opsk53] {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    color: #155c57;
}

.agenda-item__history[b-1gm8opsk53] {
    display: flex;
    gap: .25rem;
    flex-wrap: wrap;
}

.agenda-item__composer[b-1gm8opsk53] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr)) 44px;
    gap: .35rem;
    padding: .45rem .5rem;
    border: 1px solid #91c6bf;
    border-left: 3px solid #176e68;
    border-radius: 6px;
    background: #effaf7;
}

.agenda-item__composer > .form-control[b-1gm8opsk53] {
    min-width: 0;
    min-height: 44px;
    border-color: #9dc9c1;
    font-size: 1rem;
}

.agenda-item__composer > input[b-1gm8opsk53] {
    grid-column: 1 / -1;
    grid-row: 1;
}

@media (min-width: 48rem) {
    .agenda-item__composer[b-1gm8opsk53] {
        grid-template-columns: 7.5rem minmax(0, 1fr) 8.5rem auto;
    }

    .agenda-item__composer > input[b-1gm8opsk53] {
        grid-column: auto;
        grid-row: auto;
    }
}

.agenda-item__composer .btn[b-1gm8opsk53] {
    min-width: 44px;
    width: 100%;
}

.agenda-item__add-action[b-1gm8opsk53] {
    white-space: nowrap;
}

.agenda-item__add-action > span[b-1gm8opsk53] {
    display: none;
}

@media (min-width: 48rem) {
    .agenda-item__add-action > span[b-1gm8opsk53] {
        display: inline;
    }
}

.agenda-item__action[b-1gm8opsk53] {
    min-width: 0;
    margin-top: .35rem;
}

.agenda-item__message-form[b-1gm8opsk53] {
    display: grid;
    gap: .4rem;
    margin: .6rem 0;
}

.agenda-item__message-form textarea[b-1gm8opsk53] {
    width: 100%;
    box-sizing: border-box;
}

.agenda-item__message-form .btn[b-1gm8opsk53] {
    min-width: 44px;
    justify-self: end;
}

.agenda-item__footer[b-1gm8opsk53] {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr) 44px;
    gap: .4rem;
    align-items: end;
    padding: .5rem;
    background: #faf6ec;
    border-top: 1px solid #cbd3df;
    border-radius: 0 0 9px 9px;
}

.agenda-item__move[b-1gm8opsk53] {
    grid-column: 1 / -1;
}

.agenda-item__footer .agenda-item__button-label[b-1gm8opsk53] {
    display: none;
}

@media (min-width: 48rem) {
    .agenda-item__footer[b-1gm8opsk53] {
        grid-template-columns: minmax(0, 1fr) auto auto auto;
    }

    .agenda-item__move[b-1gm8opsk53] {
        grid-column: auto;
        max-width: 24rem;
    }

    .agenda-item__footer .agenda-item__button-label[b-1gm8opsk53] {
        display: inline;
    }
}

@media (min-width: 48rem) and (pointer: fine) {
    .agenda-item__title-input[b-1gm8opsk53] {
        min-height: 36px;
    }

    .agenda-item__icon-btn[b-1gm8opsk53] {
        min-width: 36px;
    }

    .agenda-button[b-1gm8opsk53],
    .agenda-item__composer > .form-control[b-1gm8opsk53],
    .agenda-item .btn[b-1gm8opsk53],
    .agenda-add-item .form-control[b-1gm8opsk53],
    .agenda-actions .form-control[b-1gm8opsk53],
    .agenda-item .form-control[b-1gm8opsk53] {
        min-height: 36px;
    }

    .agenda-button--icon[b-1gm8opsk53] {
        width: 36px;
        min-width: 36px;
    }

    .agenda-item__composer > .form-control[b-1gm8opsk53],
    .agenda-add-item .form-control[b-1gm8opsk53],
    .agenda-actions .form-control[b-1gm8opsk53],
    .agenda-add-item .textarea-notes[b-1gm8opsk53] {
        font-size: .875rem;
    }

    .agenda-item__fields .form-control[b-1gm8opsk53] {
        min-height: 44px;
        height: 44px;
        font-size: .875rem;
    }

    .agenda-item__history .btn[b-1gm8opsk53] {
        min-height: 28px;
        padding: .2rem .4rem;
    }
}


/* /Components/Pages/AgendaHeader.razor.rz.scp.css */
.meeting-brief[b-swprna7bwc] {
    container: meeting-brief / inline-size;
    min-width: 0;
    margin-bottom: 1rem;
    border: 1px solid #cbd3df;
    border-radius: 8px;
    background: #faf6ec;
    color: #182b46;
    font-family: var(--font-sans, "Segoe UI", sans-serif);
}

.meeting-brief__header[b-swprna7bwc] {
    padding: 0.85rem 1rem;
    border-bottom: 2px solid #b18b47;
    border-radius: 7px 7px 0 0;
    background: #182b46;
    color: #ffffff;
}

.meeting-brief__header h2[b-swprna7bwc] {
    margin: 0;
    color: #ffffff;
    font-family: var(--font-serif, Georgia, serif);
    font-size: 1.35rem;
    font-weight: 600;
    line-height: 1.3;
    overflow-wrap: anywhere;
}

.meeting-brief__leadership[b-swprna7bwc],
.meeting-brief__program[b-swprna7bwc] {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 0.85rem 1.25rem;
    margin: 0;
    padding: 1rem;
}

.meeting-brief__leadership[b-swprna7bwc] {
    border-bottom: 1px solid #d3dcea;
    background: #e4eaf3;
}

.meeting-brief__field[b-swprna7bwc] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    min-width: 0;
}

.meeting-brief__field label[b-swprna7bwc] {
    margin: 0;
    padding: 0;
    color: #354760;
    font-size: 0.8rem;
    font-weight: 600;
    line-height: 1.3;
}

/* Program items are grouped by kind: music, prayer, and messages. */
.meeting-brief__program .meeting-brief__field[b-swprna7bwc] {
    padding: 0.7rem 0.8rem;
    border-left: 4px solid var(--kind-accent);
    border-radius: 6px;
    background: var(--kind-bg);
}

.meeting-brief__program .meeting-brief__field label[b-swprna7bwc] {
    color: var(--kind-ink);
}

.meeting-brief__field--music[b-swprna7bwc] {
    --kind-bg: #e3f0ea;
    --kind-accent: #2f6f5e;
    --kind-ink: #24564a;
}

.meeting-brief__field--prayer[b-swprna7bwc] {
    --kind-bg: #f0eaf5;
    --kind-accent: #6b4f7f;
    --kind-ink: #55406a;
}

.meeting-brief__field--message[b-swprna7bwc] {
    --kind-bg: #e4edf7;
    --kind-accent: #2b5d8f;
    --kind-ink: #224b73;
}

.meeting-brief__kind[b-swprna7bwc] {
    margin-left: 0.4rem;
    color: var(--kind-ink);
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

/* Syncfusion renders its input wrapper inside the child component. */
.meeting-brief__field[b-swprna7bwc]  .e-input-group,
.meeting-brief__field[b-swprna7bwc]  .meeting-brief__text {
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    min-height: 44px;
    margin: 0;
    border: 1px solid #8c9bb0 !important;
    border-radius: 5px !important;
    background: #ffffff !important;
    box-shadow: none !important;
    font-family: inherit;
    font-size: 1rem;
    color: #182b46;
}

.meeting-brief__field[b-swprna7bwc]  .e-input-group input.e-input,
.meeting-brief__field[b-swprna7bwc]  .meeting-brief__text {
    min-width: 0;
    padding: 0.6rem 0.7rem;
    font-family: inherit;
    font-size: 1rem;
    line-height: 1.35;
    color: #182b46;
}

.meeting-brief__field[b-swprna7bwc]  .e-input-group input.e-input {
    height: auto;
}

.meeting-brief__field[b-swprna7bwc]  .e-input-group-icon {
    min-width: 44px;
    color: #354760;
}

.meeting-brief__field[b-swprna7bwc]  input::placeholder {
    color: #647185;
    opacity: 1;
}

.meeting-brief__field[b-swprna7bwc]  .e-input-group:hover,
.meeting-brief__field[b-swprna7bwc]  .meeting-brief__text:hover {
    border-color: #354760 !important;
}

.meeting-brief__field[b-swprna7bwc]  .e-input-group:focus-within,
.meeting-brief__field[b-swprna7bwc]  .meeting-brief__text:focus {
    outline: 2px solid #2866a8;
    outline-offset: 2px;
    border-color: #2866a8 !important;
}

@container meeting-brief (min-width: 22rem) {
    .meeting-brief__leadership[b-swprna7bwc] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@container meeting-brief (min-width: 36rem) {
    .meeting-brief__program[b-swprna7bwc] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@container meeting-brief (min-width: 60rem) {
    .meeting-brief__program[b-swprna7bwc] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .meeting-brief__header[b-swprna7bwc],
    .meeting-brief__leadership[b-swprna7bwc],
    .meeting-brief__program[b-swprna7bwc] {
        padding-left: 1.25rem;
        padding-right: 1.25rem;
    }
}
/* /Components/Pages/Agenda_curr.razor.rz.scp.css */
.transition-all[b-e0f8edez7n] {
    transition: all 0.2s ease-in-out;
}

.hover-scale[b-e0f8edez7n] {
    transition: transform 0.2s ease;
}

    .hover-scale:hover[b-e0f8edez7n] {
        transform: scale(1.05);
    }

.cursor-pointer[b-e0f8edez7n] {
    cursor: pointer;
}

/* Ensure summary behaves like a list item */
details summary[b-e0f8edez7n] {
    display: list-item; /* Restores the default marker */
    cursor: pointer; /* Ensures the pointer cursor for interactivity */
    position: relative; /* Allows positioning of custom elements */
}

    /* Add a custom indicator after the summary text */
    details summary[b-e0f8edez7n]::after {
        font-size: 1rem;
        position: absolute;
        right: 0.5rem; /* Position it to the far right */
        transition: transform 0.2s ease-in-out;
    }




.grid-container[b-e0f8edez7n] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 100%));
    gap: 10px; /* Spacing between cards */
}

.card[b-e0f8edez7n] {
    background-color: #fff;
    border: 2px solid #ddd;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
    padding: 10px;
}

.card-header[b-e0f8edez7n] {
    display: flex;
    align-items: left;
    margin-bottom: 15px;
    padding: 0px;
}

    .card-header .name-section[b-e0f8edez7n] {
        flex-grow: 1; /* Allows the name input to take up available space */
        display: flex;
        align-items: 15px;
    }

        .card-header .name-section i[b-e0f8edez7n] {
            margin-right: 10px; /* Space between icon and input */
        }

        .card-header .name-section input[b-e0f8edez7n] {
            flex-grow: 1; /* Allows input to fill the available space */
        }

    .card-header .ward-section[b-e0f8edez7n] {
        margin-left: 10px; /* Space between name input and ward dropdown */
    }

.card-content[b-e0f8edez7n], .card-actions[b-e0f8edez7n] {
    margin-bottom: 10px;
}

.form-control[b-e0f8edez7n], .status-dropdown[b-e0f8edez7n], .textarea-notes[b-e0f8edez7n] {
    width: 100%;
    box-sizing: border-box;
}

.textarea-notes[b-e0f8edez7n] {
    resize: vertical; /* Allows vertical resizing */
}

.btn[b-e0f8edez7n] {
    margin-right: 10px;
}

.add-item-card[b-e0f8edez7n] {
    background-color: #f8f9fa; /* Light background color for distinction */
    border: 2px solid #007bff; /* Blue border for emphasis */
    color: #007bff; /* Blue text color */
    padding: 20px;
    margin-bottom: 20px;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}

    .add-item-card .card-header h2[b-e0f8edez7n] {
        color: #007bff; /* Blue header color */
    }

    .add-item-card .btn-primary[b-e0f8edez7n] {
        background-color: #007bff; /* Blue button background */
        border-color: #007bff; /* Blue button border */
    }

    .add-item-card .user-section[b-e0f8edez7n] {
        display: flex;
        gap: 10px; /* Spacing between Created By and Assigned To fields */
    }

        .add-item-card .user-section input[b-e0f8edez7n] {
            flex-grow: 1; /* Make inputs take equal space */
        }

    .add-item-card .textarea-notes[b-e0f8edez7n] {
        width: 100%; /* Full width for the textarea */
        margin-top: 10px; /* Spacing above the textarea */
    }


.status-new[b-e0f8edez7n] {
    border-color: blue;
    background-color: #B3D4E3;
}

.status-in-progress[b-e0f8edez7n] {
    border-color: darkorange;
    background-color: #fa0; /*#B3D4E3;  Light blue */
}



.status-on-hold[b-e0f8edez7n] {
    border-color: darkred;
    background-color: #f62; /* Light red */
}


.status-completed[b-e0f8edez7n] {
    border-color: grey;
    background-color: #E3BFC4; /* Light green */
}

.user-section[b-e0f8edez7n] {
    display: flex;
    justify-content: space-between;
    gap: 10px;
}

.user-field[b-e0f8edez7n] {
    flex-basis: 48%; /* Adjust as necessary for your layout */
    display: flex;
    flex-direction: column;
}

.user-section[b-e0f8edez7n] {
    display: flex;
    justify-content: space-between;
    gap: 10px;
}

.user-field[b-e0f8edez7n] {
    flex-basis: 48%;
    display: flex;
    flex-direction: column;
}

.blue-border-input[b-e0f8edez7n] {
    border: 2px solid #007bff; /* Blue border color */
    border-radius: 4px; /* Optional: to match the style of other elements */
}

/* Visual feedback borders */
.modified-border[b-e0f8edez7n] {
    border: 2px solid #ffc107 !important; /* amber for modified */
    box-shadow: 0 0 0 2px rgba(255, 193, 7, 0.2);
    border-radius: 6px;
}
.saving-border[b-e0f8edez7n] {
    border: 2px dashed #17a2b8 !important; /* info for saving */
    box-shadow: 0 0 0 2px rgba(23, 162, 184, 0.15);
    border-radius: 6px;
}
.saved-border[b-e0f8edez7n] {
    border: 2px solid #28a745 !important; /* green for saved */
    box-shadow: 0 0 0 2px rgba(40, 167, 69, 0.15);
    border-radius: 6px;
}

.non-expanded-card[b-e0f8edez7n] {
    display: inline-block;
    width: 100%;
    padding: 10px;
    padding-left: 20px;
    padding-bottom: 0; /* Remove bottom padding to avoid double padding */
    border-radius: 10px;
    margin-right: 10px; /* Add margin between cards */
    margin-bottom: 10px; /* Add margin between cards */
}

.expanded-card[b-e0f8edez7n] {
    flex-grow: 1; /* Allow the expanded card to take up all available width */
    width: auto !important; /* Reset any width set for non-expanded state */
    padding: 10px;
    margin-bottom: 10px; /* Add margin between cards */
    border-radius: 10px;
}

label[b-e0f8edez7n] {
    padding-top: 5px;
}

/* Media query for mobile devices */
@@media (max-width: 600px) {
    .user-section[b-e0f8edez7n] {
        flex-direction: column;
    }

    .user-field[b-e0f8edez7n] {
        flex-basis: 100%; /* Fields take full width */
        margin-bottom: 10px; /* Space between fields */
    }
}


.e-richtexteditor[b-e0f8edez7n] {
    width: 100% !important; /* Ensure the editor takes full width */
    resize: vertical !important; /* Restrict resizing to vertical */
    min-height: 110px;
    max-height: 800px;
}




.chat-container[b-e0f8edez7n] {
    width: 100% !important;
    max-width: 100%;
    background-color: #fff;
    border-radius: 10px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
    padding: 20px;
    overflow-y: auto;
    max-height: 80vh;
}

.message[b-e0f8edez7n] {
    margin-bottom: 15px;
    display: flex;
    flex-direction: column;
}

    .message .sender[b-e0f8edez7n] {
        font-size: 0.9em;
        font-weight: bold;
        margin-bottom: 5px;
        color: #555;
    }

    .message .bubble[b-e0f8edez7n] {
        padding: 10px 15px;
        border-radius: 15px;
        max-width: 80%;
        word-wrap: break-word;
        font-size: 0.95em;
        line-height: 1.4;
    }

    /* Styles for the sender's message */
    .message.sent .bubble[b-e0f8edez7n] {
        background-color: #d1f7c4;
        color: #333;
        align-self: flex-start;
        border-bottom-right-radius: 0;
    }

    /* Styles for the receiver's message */
    .message.received .bubble[b-e0f8edez7n] {
        background-color: #f0f0f0;
        color: #333;
        align-self: flex-start;
        border-bottom-left-radius: 0;
    }


.form-check-input-lg[b-e0f8edez7n] {
    width: 3em !important; /* Force the custom width */
    height: 1.5em !important; /* Adjust height for proportional scaling */
    border-radius: 2em !important; /* Rounded edges for a toggle look */
}

    .form-check-input-lg:checked[b-e0f8edez7n] {
        background-color: #0d6efd !important; /* Custom color for the toggled state */
    }



/* Status chips used beside field labels */
.status-chip[b-e0f8edez7n] {
    display: inline-block;
    margin-left: .5rem;
    padding: .15rem .4rem;
    border-radius: .5rem;
    font-size: .75rem;
    line-height: 1;
    vertical-align: middle;
}
.chip-unsaved[b-e0f8edez7n] { background: #fff3cd; color: #8a6d3b; border: 1px solid #ffe8a1; }
.chip-saving[b-e0f8edez7n]  { background: #e7f1ff; color: #0b5ed7; border: 1px solid #cfe2ff; }
.chip-saved[b-e0f8edez7n]   { background: #d1e7dd; color: #0f5132; border: 1px solid #badbcc; }

/* Existing border highlight hooks */
.modified-border[b-e0f8edez7n] { outline: 2px dashed #ffc107; outline-offset: 2px; }
.saving-border[b-e0f8edez7n]   { outline: 2px dashed #0d6efd; outline-offset: 2px; }
.saved-border[b-e0f8edez7n]    { outline: 2px dashed #198754; outline-offset: 2px; }


/* /Components/Pages/Calling.razor.rz.scp.css */
.calling-group__header[b-dufwiayd80] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: .25rem .75rem;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    min-height: 44px;
    margin: .75rem 0 .35rem;
    padding: .35rem .65rem;
    border: 1px solid #b9c6d6;
    border-left: 4px solid #182b46;
    border-radius: 8px;
    background: #e4eaf3;
    font-family: var(--font-sans);
}

.calling-group__title[b-dufwiayd80] {
    flex: 0 1 auto;
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: .35rem;
    font-family: var(--font-sans);
    font-size: 1.125rem;
    line-height: 1.35;
    font-weight: 700;
    color: #182b46;
    margin: 0;
}

.calling-group__count[b-dufwiayd80] {
    color: #607188;
    font-size: .8125rem;
    font-weight: 500;
}

.calling-group__header--empty[b-dufwiayd80] {
    background: #f1f4f8;
    border-color: #cbd5e1;
    border-left-color: #94a3b8;
}

.calling-group__header--empty .calling-group__title[b-dufwiayd80] {
    color: #607188;
    font-weight: 600;
}

/* Buttons */
.calling-btn[b-dufwiayd80] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .35rem;
    min-height: 44px;
    padding: .35rem .65rem;
    border: 1px solid transparent;
    border-radius: 6px;
    font-weight: 600;
    font-family: var(--font-sans);
    font-size: .875rem;
    line-height: 1.2;
    cursor: pointer;
    max-width: 100%;
    transition: background-color 0.15s ease, border-color 0.15s ease;
}

    .calling-btn:focus-visible[b-dufwiayd80] {
        outline: 3px solid #2e69a3;
        outline-offset: 2px;
    }

.calling-btn--advance[b-dufwiayd80] {
    background-color: #176e68;
    color: #fff;
}

    .calling-btn--advance:hover[b-dufwiayd80] {
        background-color: #135a55;
        color: #fff;
    }

.calling-btn--copy[b-dufwiayd80] {
    background-color: #e7f5f1;
    color: #155c57;
    border-color: #91c6bf;
}

    .calling-btn--copy:hover[b-dufwiayd80] {
        background-color: #d2ece6;
        color: #155c57;
    }

.calling-btn--copied[b-dufwiayd80] {
    background-color: #2e7d32;
    color: #fff;
    border-color: #2e7d32;
}

.calling-group__header--empty .calling-btn--advance[b-dufwiayd80] {
    background: #e4eaf3;
    color: #607188;
    border-color: #b9c6d6;
}

.calling-group__header--empty .calling-btn--advance:hover[b-dufwiayd80] {
    background: #d6e0ed;
    color: #354760;
    border-color: #7d8fa8;
}

/* Shareable link row */
.calling-share[b-dufwiayd80] {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    gap: 0.5rem;
    margin-top: .5rem;
}

.calling-share__url[b-dufwiayd80] {
    flex: 1 1 16rem;
    min-width: 0;
    min-height: 44px;
    background-color: #f8f9fa;
    font-size: 0.95rem;
}

.calling-grid[b-dufwiayd80] {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    align-items: flex-start;
    margin-bottom: .5rem;
}

/* Supporting disclosures stay visually subordinate to status headings. */
details[b-dufwiayd80] {
    min-width: 0;
    margin: .25rem 0 .5rem;
    padding: 0 .65rem;
    background: transparent;
    border: 0;
    overflow-wrap: anywhere;
}

    details[open][b-dufwiayd80] {
        padding-bottom: .65rem;
    }

summary[b-dufwiayd80] {
    display: flex;
    align-items: center;
    gap: .4rem;
    width: fit-content;
    max-width: 100%;
    min-height: 44px;
    padding: .25rem .35rem;
    margin: 0;
    border-radius: 5px;
    background: transparent;
    color: #354760;
    font-family: var(--font-sans);
    font-size: .875rem;
    font-weight: 400;
    cursor: pointer;
    list-style: none;
}

    summary[b-dufwiayd80]::-webkit-details-marker {
        display: none;
    }

    summary[b-dufwiayd80]::after {
        content: "";
        flex: 0 0 auto;
        width: 0.5rem;
        height: 0.5rem;
        margin-left: .5rem;
        border-right: 2px solid currentColor;
        border-bottom: 2px solid currentColor;
        transform: rotate(-45deg);
        transition: transform 0.2s ease;
    }

    details[open] > summary[b-dufwiayd80]::after {
        transform: rotate(45deg);
    }

    summary:hover[b-dufwiayd80] {
        background: #f1f4f8;
    }

    summary:focus-visible[b-dufwiayd80] {
        outline: 3px solid #2e69a3;
        outline-offset: 2px;
    }

.calling-summary--prayer[b-dufwiayd80] {
    color: #6b4f7f;
}

.calling-summary--action[b-dufwiayd80] {
    color: #155c57;
}

.calling-btn:active[b-dufwiayd80] {
    filter: brightness(.94);
}

@media (min-width: 48rem) and (pointer: fine) {
    .calling-group__header[b-dufwiayd80],
    .calling-btn[b-dufwiayd80],
    .calling-share__url[b-dufwiayd80],
    summary[b-dufwiayd80] {
        min-height: 36px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .calling-btn[b-dufwiayd80],
    summary[b-dufwiayd80]::after {
        transition: none;
    }
}
/* /Components/Pages/CallingCard.razor.rz.scp.css */
.calling-card[b-umfqvhqffu] {
    --status: #b9c6d6;
    --status-text: #182b46;
    --status-surface: #dde;
    --status-fill: #e4eaf3;
    --status-approved-fill: #d4e7da;
    --status-approved-ink: #315d44;
    --status-approved-border: #2e7d32;
    --status-pending-fill: #ffd7c0;
    --status-pending-ink: #8c3413;
    --status-pending-border: #c56a00;
    --status-rejected-fill: #f5dce0;
    --status-rejected-ink: #a32d3a;
    --status-rejected-border: #c62828;
    --status-scheduled-fill: #ffecad;
    --status-scheduled-ink: #715000;
    --status-scheduled-border: #b18b47;
    --proposal-fill: #dff1ed;
    --proposal-ink: #155c57;
    --proposal-border: #91c6bf;
    --control-size: 44px;
    container-type: inline-size;
    display: flex;
    flex-direction: column;
    gap: .3rem;
    min-width: 0;
    padding: .4rem;
    background: var(--status-surface);
    color: #182b46;
    border: 1px solid var(--status);
    border-left-width: 3px;
    border-radius: 8px;
    font-family: var(--font-sans);
}

.calling-card--expanded[b-umfqvhqffu] {
    flex: 0 1 42rem;
    max-width: min(100%, 42rem);
}

.calling-card--compact[b-umfqvhqffu] {
    flex: 0 0 100%;
    width: 100%;
}

.calling-card--release[b-umfqvhqffu] {
    --proposal-fill: #faedef;
    --proposal-ink: #a32d3a;
    --proposal-border: #d8aab0;
}

.calling-card.status-approved[b-umfqvhqffu] {
    --status: var(--status-approved-border);
    --status-text: var(--status-approved-ink);
    --status-fill: var(--status-approved-fill);
}

.calling-card.status-rejected[b-umfqvhqffu] {
    --status: var(--status-rejected-border);
    --status-text: var(--status-rejected-ink);
    --status-fill: var(--status-rejected-fill);
    --status-notice-fill: #faedef;
}

.calling-card.status-pending[b-umfqvhqffu] {
    --status: var(--status-pending-border);
    --status-text: var(--status-pending-ink);
    --status-fill: var(--status-pending-fill);
    --status-notice-fill: #ffecad;
}

.calling-card.status-rejected[b-umfqvhqffu],
.calling-card.status-pending[b-umfqvhqffu] {
    box-shadow: inset 0 0 0 2px var(--status);
}

.calling-card.status-scheduled[b-umfqvhqffu] {
    --status: var(--status-scheduled-border);
    --status-text: var(--status-scheduled-ink);
    --status-fill: var(--status-scheduled-fill);
}

.calling-card__head[b-umfqvhqffu] {
    --field-fill: #182b46;
    --field-ink: #ffffff;
    --field-border: #182b46;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 4.75rem;
    align-items: end;
    gap: .35rem;
    padding-bottom: .3rem;
    border-bottom: 1px solid #182b46;
}

.calling-card--expanded .calling-card__head[b-umfqvhqffu] {
    grid-template-columns: minmax(0, 1fr) 4.75rem var(--control-size);
}

.calling-card__head > .calling-card__icon-btn[b-umfqvhqffu] {
    grid-column: 3;
    grid-row: 1;
}

.calling-card__body[b-umfqvhqffu] {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: .25rem .5rem;
}

.calling-card__body--stack[b-umfqvhqffu] {
    grid-template-columns: minmax(0, 1fr);
}

.calling-card__field[b-umfqvhqffu] {
    display: flex;
    flex-direction: column;
    gap: .15rem;
    min-width: 0;
    margin: 0;
}

.calling-card__field--name[b-umfqvhqffu] {
    min-width: 0;
}

.calling-card__field--phone[b-umfqvhqffu] {
    grid-column: 1 / -1;
}

.calling-card__field--full[b-umfqvhqffu] {
    grid-column: 1 / -1;
}

.calling-card__field--status[b-umfqvhqffu] {
    --label-color: var(--status-text);
    --field-fill: var(--status-fill);
    --field-ink: var(--status-text);
    --field-border: var(--status);
    --field-hover-border: var(--status);
    --field-focus-border: var(--status);
    --control-inset: inset 0 0 0 1px var(--status);
}

.calling-card__field--submitter[b-umfqvhqffu] {
    --field-fill: #e4edf7;
    --label-color: #2b5d8f;
    --field-hover-border: #2b5d8f;
}

.calling-card__field--proposed[b-umfqvhqffu] {
    --field-fill: var(--proposal-fill);
    --field-ink: var(--proposal-ink);
    --field-border: var(--proposal-border);
    --label-color: var(--proposal-ink);
    --field-hover-border: var(--proposal-ink);
}

.calling-card__field--existing[b-umfqvhqffu],
.calling-card__field--requirement[b-umfqvhqffu] {
    --field-fill: #faf6ec;
    --field-border: #b18b47;
    --label-color: #715000;
    --field-hover-border: #715000;
}

.calling-card__field--release[b-umfqvhqffu],
.calling-card__field--release-phone[b-umfqvhqffu] {
    --field-fill: #faedef;
    --field-border: #d8aab0;
    --label-color: #a32d3a;
    --field-hover-border: #a32d3a;
}

.calling-card__field--attention[b-umfqvhqffu] {
    --field-fill: #fff0e6;
    --field-border: #e08a00;
    --field-ink: #8c3413;
    --label-color: #8c3413;
    --field-hover-border: #8c3413;
    --field-focus-border: #e08a00;
    --control-inset: inset 0 0 0 1px var(--field-border);
}

.calling-card__requirement-warning[b-umfqvhqffu] {
    color: #8c3413;
    font-size: .75rem;
    line-height: 1.3;
}

.calling-card__warnings[b-umfqvhqffu] {
    display: grid;
    gap: .2rem;
    margin: 0;
    padding: .35rem .45rem;
    border: 1px solid #e08a00;
    border-left-width: 3px;
    border-radius: 4px;
    background: #fff0e6;
    color: #8c3413;
    font-size: .75rem;
    font-weight: 600;
    line-height: 1.35;
    list-style: none;
}

.calling-card__warnings > li[b-umfqvhqffu] {
    display: flex;
    align-items: baseline;
    gap: .35rem;
    min-width: 0;
    overflow-wrap: anywhere;
}

.calling-card__warnings > li > i[b-umfqvhqffu] {
    flex-shrink: 0;
}

.calling-card__warnings > .calling-card__status-notice[b-umfqvhqffu] {
    padding: .2rem .35rem;
    border-radius: 3px;
    background: var(--status-notice-fill);
    color: var(--status-text);
    box-shadow: inset 3px 0 0 var(--status);
    font-weight: 700;
}

.calling-card__label[b-umfqvhqffu] {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    font-size: .75rem;
    font-weight: 600;
    color: #354760;
    line-height: 1.3;
}

.calling-card__label > i[b-umfqvhqffu] {
    font-size: inherit;
}

.calling-card__field[b-umfqvhqffu]  input,
.calling-card__field[b-umfqvhqffu]  select,
.calling-card__field[b-umfqvhqffu]  textarea {
    width: 100%;
    min-width: 0;
    min-height: var(--control-size);
    box-sizing: border-box;
    padding: .4rem .45rem;
    font: inherit;
    font-size: 1rem;
    font-weight: 400;
    color: var(--field-ink, #182b46);
    background: var(--field-fill, #ffffff);
    border: 1px solid var(--field-border, #b9c6d6);
    border-radius: 6px;
    box-shadow: var(--control-inset, inset 0 1px 0 rgba(255, 255, 255, .45)), 0 1px 2px rgba(24, 43, 70, .08);
    transition: border-color .12s ease, box-shadow .12s ease;
}

.calling-card__field--status[b-umfqvhqffu]  select {
    font-weight: 700;
}

.calling-card__field--status[b-umfqvhqffu]  option {
    background-color: var(--option-fill, #e4eaf3);
    color: var(--option-ink, #182b46);
    font-weight: 400;
}

.calling-card__field--status[b-umfqvhqffu]  option.calling-card__status-option--main {
    font-weight: 700;
}

.calling-card__field--status[b-umfqvhqffu]  option.status-approved {
    --option-fill: var(--status-approved-fill);
    --option-ink: var(--status-approved-ink);
}

.calling-card__field--status[b-umfqvhqffu]  option.status-pending {
    --option-fill: var(--status-pending-fill);
    --option-ink: var(--status-pending-ink);
}

.calling-card__field--status[b-umfqvhqffu]  option.status-rejected {
    --option-fill: var(--status-rejected-fill);
    --option-ink: var(--status-rejected-ink);
}

.calling-card__field--status[b-umfqvhqffu]  option.status-scheduled {
    --option-fill: var(--status-scheduled-fill);
    --option-ink: var(--status-scheduled-ink);
}

.calling-card__field[b-umfqvhqffu]  textarea {
    min-height: 3rem;
    resize: vertical;
}

.calling-card__field[b-umfqvhqffu]  input::placeholder,
.calling-card__field[b-umfqvhqffu]  textarea::placeholder {
    color: #607188;
    opacity: 1;
}

.calling-card__head[b-umfqvhqffu]  input::placeholder {
    color: #b9c6d6;
}

.calling-card__field[b-umfqvhqffu]  input:disabled,
.calling-card__field[b-umfqvhqffu]  select:disabled,
.calling-card__field[b-umfqvhqffu]  textarea:disabled {
    color: #607188;
    background: #e4eaf3;
    border-color: #b9c6d6;
    box-shadow: none;
    cursor: not-allowed;
}

@media (hover: hover) and (pointer: fine) {
    .calling-card__field[b-umfqvhqffu]  input:hover:not(:disabled):not(:focus),
    .calling-card__field[b-umfqvhqffu]  select:hover:not(:disabled):not(:focus),
    .calling-card__field[b-umfqvhqffu]  textarea:hover:not(:disabled):not(:focus) {
        border-color: var(--field-hover-border, #7d8fa8);
        box-shadow: var(--control-inset, inset 0 1px 0 rgba(255, 255, 255, .45)), 0 1px 3px rgba(24, 43, 70, .16);
    }
}

.calling-card__notes[b-umfqvhqffu] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) var(--control-size);
    align-items: start;
    gap: .35rem;
}

.calling-card__notes textarea[b-umfqvhqffu] {
    height: 3rem;
}

.calling-card__tools[b-umfqvhqffu] {
    display: flex;
    flex-direction: column;
    gap: .25rem;
    padding-top: calc(.75rem * 1.3 + .15rem);
}

.calling-card__field[b-umfqvhqffu]  input:focus-visible,
.calling-card__field[b-umfqvhqffu]  select:focus-visible,
.calling-card__field[b-umfqvhqffu]  textarea:focus-visible {
    border-color: var(--field-focus-border, #2e69a3);
    outline: 2px solid #2e69a3;
    outline-offset: 1px;
    box-shadow: var(--control-inset, inset 0 1px 0 rgba(255, 255, 255, .45)), 0 0 0 3px rgba(46, 105, 163, .16);
}

.calling-card__input-group[b-umfqvhqffu] {
    display: flex;
    align-items: stretch;
    width: 100%;
}

.calling-card__input-group input[b-umfqvhqffu] {
    flex: 1 1 auto;
    min-width: 0;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.calling-card__icon-btn[b-umfqvhqffu] {
    flex: 0 0 var(--control-size);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: var(--control-size);
    height: var(--control-size);
    padding: 0;
    color: #155c57;
    background: #e7f5f1;
    border: 1px solid #91c6bf;
    border-radius: 6px;
    font-size: 1.05rem;
    cursor: pointer;
    transition: background-color 0.15s ease;
}

.calling-card__icon-btn:hover[b-umfqvhqffu] {
    background: #d1ebe5;
}

.calling-card__icon-btn--save[b-umfqvhqffu] {
    color: #fff;
    background: #176e68;
    border-color: #176e68;
}

.calling-card__icon-btn--save:hover[b-umfqvhqffu] {
    color: #fff;
    background: #10594f;
}

.calling-card__icon-btn--attached[b-umfqvhqffu] {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.calling-card__btn[b-umfqvhqffu] {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    min-height: var(--control-size);
    padding: .35rem .65rem;
    font-size: 0.875rem;
    font-weight: 600;
    border: 1px solid transparent;
    border-radius: 6px;
    cursor: pointer;
    transition: background-color 0.15s ease;
}

.calling-card__btn > i[b-umfqvhqffu] {
    font-size: 1rem;
}

.calling-card__btn--primary[b-umfqvhqffu] {
    color: #ffffff;
    background: #176e68;
}

.calling-card__btn--primary:hover[b-umfqvhqffu] {
    background: #10594f;
}

.calling-card__btn--danger[b-umfqvhqffu] {
    color: #a32d3a;
    background: #ffffff;
    border-color: #d8aab0;
}

.calling-card__btn--danger:hover[b-umfqvhqffu] {
    background: #faedef;
}

.calling-card__btn--delete[b-umfqvhqffu] {
    margin-right: auto;
}

.calling-card__icon-btn:focus-visible[b-umfqvhqffu],
.calling-card__btn:focus-visible[b-umfqvhqffu] {
    outline: 2px solid #2e69a3;
    outline-offset: 2px;
}

.calling-card__footer[b-umfqvhqffu] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 0.5rem;
    padding-top: .4rem;
    border-top: 1px solid var(--status);
}

.calling-card__proposed[b-umfqvhqffu] {
    gap: .25rem;
}

.calling-card .calling-card__label[b-umfqvhqffu] {
    color: var(--label-color, #182b46);
}

@container (min-width: 28rem) {
    .calling-card--expanded .calling-card__head[b-umfqvhqffu] {
        grid-template-columns: minmax(0, 2fr) 4.75rem minmax(0, 1fr) var(--control-size);
    }

    .calling-card--expanded .calling-card__field--phone[b-umfqvhqffu] {
        grid-column: auto;
    }

    .calling-card--expanded .calling-card__head > .calling-card__icon-btn[b-umfqvhqffu] {
        grid-column: 4;
    }

    .calling-card__body:not(.calling-card__body--stack)[b-umfqvhqffu] {
        grid-template-columns: repeat(6, minmax(0, 1fr));
    }

    .calling-card__body:not(.calling-card__body--stack) > .calling-card__field[b-umfqvhqffu] {
        grid-column: span 2;
    }

    .calling-card__body:not(.calling-card__body--stack) > .calling-card__field--half[b-umfqvhqffu] {
        grid-column: span 3;
    }

    .calling-card__body:not(.calling-card__body--stack) > .calling-card__field--release[b-umfqvhqffu] {
        grid-column: span 4;
    }

    .calling-card__body:not(.calling-card__body--stack) > .calling-card__field--full[b-umfqvhqffu] {
        grid-column: 1 / -1;
    }
}

@media (min-width: 48rem) {
    .calling-card--compact[b-umfqvhqffu] {
        flex-basis: min(100%, 252px);
        width: min(100%, 252px);
    }
}

@media (min-width: 48rem) and (pointer: fine) {
    .calling-card[b-umfqvhqffu] {
        --control-size: 36px;
    }

    .calling-card__field[b-umfqvhqffu]  input,
    .calling-card__field[b-umfqvhqffu]  select,
    .calling-card__field[b-umfqvhqffu]  textarea {
        font-size: .875rem;
        padding: .3rem .4rem;
    }
}

.calling-card__icon-btn:active[b-umfqvhqffu],
.calling-card__btn:active[b-umfqvhqffu] {
    filter: brightness(.94);
}

.calling-card__field[b-umfqvhqffu]  select {
    padding-right: 1.35rem;
    cursor: pointer;
}

@media (prefers-reduced-motion: reduce) {
    .calling-card__icon-btn[b-umfqvhqffu],
    .calling-card__btn[b-umfqvhqffu],
    .calling-card__field[b-umfqvhqffu]  input,
    .calling-card__field[b-umfqvhqffu]  select,
    .calling-card__field[b-umfqvhqffu]  textarea {
        transition: none;
    }
}
/* /Components/Pages/CallingForm.razor.rz.scp.css */
.calling-proposal[b-8slh5bc133] {
    --proposal-navy: #182b46;
    --proposal-heading: #e4eaf3;
    --proposal-surface: #f1f4f8;
    --proposal-border: #b9c6d6;
    --proposal-muted: #354760;
    --proposal-focus: #2e69a3;
    --proposal-danger: #a32d3a;
    --proposal-white: #ffffff;
    --proposal-hover: #d6e0ed;
    min-width: 0;
    margin: .25rem 0 .5rem;
    color: var(--proposal-navy);
    font-family: var(--font-sans);
}

.calling-proposal__surface[b-8slh5bc133] {
    border: 1px solid var(--proposal-border);
    border-radius: 6px;
    background: var(--proposal-surface);
}

.calling-proposal__toggle[b-8slh5bc133] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    width: fit-content;
    max-width: 100%;
    min-height: 44px;
    padding: .35rem .65rem;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: var(--proposal-muted);
    font: inherit;
    font-size: .875rem;
    font-weight: 400;
    text-align: left;
    cursor: pointer;
}

.calling-proposal__toggle > span[b-8slh5bc133] {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
}

.calling-proposal__toggle > .bi[b-8slh5bc133] {
    flex-shrink: 0;
    font-size: .8rem;
}

.calling-proposal__toggle[aria-expanded="true"][b-8slh5bc133] {
    width: 100%;
    border-bottom: 1px solid var(--proposal-border);
    border-radius: 6px 6px 0 0;
}

.calling-proposal__body[b-8slh5bc133] {
    display: grid;
    gap: .75rem;
    min-width: 0;
    padding: .75rem;
}

.calling-proposal__section[b-8slh5bc133] {
    --section-accent: #7d8fa8;
    min-width: 0;
    margin: 0;
    padding: .75rem;
    border: 1px solid var(--proposal-border);
    border-left: 4px solid var(--section-accent);
    border-radius: 6px;
    background: var(--proposal-white);
}

.calling-proposal__section--request[b-8slh5bc133] {
    --section-accent: #b18b47;
    background: #faf6ec;
}

.calling-proposal__section--called[b-8slh5bc133] {
    --section-accent: var(--proposal-navy);
    background: var(--proposal-heading);
}

.calling-proposal__section--release[b-8slh5bc133] {
    --section-accent: #b18b47;
    border-style: dashed;
    border-left-style: solid;
    background: #fbf7ee;
}

.calling-proposal__section > legend[b-8slh5bc133] {
    float: none;
    width: auto;
    margin: 0 0 .5rem;
    padding: 0;
    color: var(--proposal-navy);
    font-size: .9rem;
    font-weight: 700;
    line-height: 1.4;
}

.calling-proposal__section > legend > .bi[b-8slh5bc133] {
    color: var(--section-accent);
    margin-right: .15rem;
}

.calling-proposal__grid[b-8slh5bc133] {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: .6rem .75rem;
}

.calling-proposal__grid--paired[b-8slh5bc133],
.calling-proposal__grid--requirements[b-8slh5bc133] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.calling-proposal__ordination[b-8slh5bc133] {
    grid-column: 1 / -1;
}

.calling-proposal__field[b-8slh5bc133] {
    display: flex;
    flex-direction: column;
    gap: .25rem;
    min-width: 0;
}

.calling-proposal__field > label[b-8slh5bc133] {
    margin: 0;
    color: var(--proposal-muted);
    font-size: .8rem;
    font-weight: 600;
    line-height: 1.35;
}

.calling-proposal__grid--requirements label[b-8slh5bc133] {
    min-height: 2.7em;
}

.calling-proposal__required[b-8slh5bc133] {
    color: var(--proposal-danger);
}

.calling-proposal__optional[b-8slh5bc133],
.calling-proposal__hint[b-8slh5bc133] {
    color: var(--proposal-muted);
    font-size: .75rem;
    font-weight: 400;
}

.calling-proposal[b-8slh5bc133]  .calling-proposal__input {
    display: block;
    width: 100%;
    min-width: 0;
    min-height: 44px;
    box-sizing: border-box;
    padding: .4rem .5rem;
    border: 1px solid var(--proposal-border);
    border-radius: 5px;
    background-color: var(--proposal-white);
    color: var(--proposal-navy);
    font-family: inherit;
    font-size: 1rem;
    line-height: 1.4;
}

.calling-proposal[b-8slh5bc133]  select.calling-proposal__input {
    padding-right: .25rem;
}

.calling-proposal[b-8slh5bc133]  textarea.calling-proposal__input {
    min-height: 5rem;
    resize: vertical;
}

.calling-proposal[b-8slh5bc133]  .calling-proposal__input::placeholder {
    color: var(--proposal-muted);
    opacity: 1;
}

.calling-proposal__template-input[b-8slh5bc133] {
    display: flex;
    min-width: 0;
    gap: .25rem;
}

.calling-proposal__template-input > input[b-8slh5bc133] {
    flex: 1;
}

.calling-proposal__clear[b-8slh5bc133],
.calling-proposal__button[b-8slh5bc133] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .4rem;
    min-width: 44px;
    min-height: 44px;
    padding: .4rem .65rem;
    border: 1px solid var(--proposal-border);
    border-radius: 5px;
    background: var(--proposal-white);
    color: var(--proposal-navy);
    font: inherit;
    font-size: .875rem;
    font-weight: 600;
    line-height: 1.4;
    cursor: pointer;
}

.calling-proposal__clear[b-8slh5bc133] {
    flex: 0 0 44px;
    padding: 0;
}

.calling-proposal__button--primary[b-8slh5bc133] {
    border-color: var(--proposal-navy);
    background: var(--proposal-navy);
    color: var(--proposal-white);
}

.calling-proposal__actions[b-8slh5bc133] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: .5rem;
}

.calling-proposal__hint[b-8slh5bc133] {
    grid-column: 1 / -1;
}

.calling-proposal__toggle:hover[b-8slh5bc133] {
    background: var(--proposal-surface);
}

.calling-proposal__clear:hover[b-8slh5bc133],
.calling-proposal__button:hover[b-8slh5bc133] {
    background: var(--proposal-hover);
}

.calling-proposal__button--primary:hover[b-8slh5bc133] {
    background: var(--proposal-muted);
}

.calling-proposal__toggle:active[b-8slh5bc133],
.calling-proposal__clear:active[b-8slh5bc133],
.calling-proposal__button:active[b-8slh5bc133] {
    box-shadow: inset 0 0 0 2px var(--proposal-border);
}

.calling-proposal__toggle:focus-visible[b-8slh5bc133],
.calling-proposal__clear:focus-visible[b-8slh5bc133],
.calling-proposal__button:focus-visible[b-8slh5bc133],
.calling-proposal[b-8slh5bc133]  .calling-proposal__input:focus-visible {
    outline: 2px solid var(--proposal-focus);
    outline-offset: 2px;
}

.calling-proposal[b-8slh5bc133]  .validation-message {
    color: var(--proposal-danger);
    font-size: .8rem;
}

.calling-proposal[b-8slh5bc133]  .calling-proposal__input.invalid {
    border-color: var(--proposal-danger);
}

@media (min-width: 48rem) {
    .calling-proposal__grid[b-8slh5bc133] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .calling-proposal__grid--calling[b-8slh5bc133],
    .calling-proposal__grid--requirements[b-8slh5bc133] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .calling-proposal__template[b-8slh5bc133],
    .calling-proposal__existing[b-8slh5bc133] {
        grid-column: span 2;
    }

    .calling-proposal__ordination[b-8slh5bc133] {
        grid-column: auto;
    }

    .calling-proposal__grid--requirements label[b-8slh5bc133] {
        min-height: 0;
    }

    .calling-proposal__actions[b-8slh5bc133] {
        grid-template-columns: minmax(0, 1fr) auto auto;
    }

    .calling-proposal__hint[b-8slh5bc133] {
        grid-column: auto;
    }
}

@media (prefers-reduced-motion: no-preference) {
    .calling-proposal__toggle[b-8slh5bc133],
    .calling-proposal__clear[b-8slh5bc133],
    .calling-proposal__button[b-8slh5bc133] {
        transition: background-color 120ms ease, box-shadow 120ms ease;
    }
}
/* /Components/Pages/CallingSubmit.razor.rz.scp.css */
.calling-submit[b-ivzdymumoo] {
    --submit-navy: #182b46;
    --submit-heading: #e4eaf3;
    --submit-surface: #f1f4f8;
    --submit-border: #b9c6d6;
    --submit-muted: #354760;
    --submit-focus: #2e69a3;
    --submit-danger: #a32d3a;
    --submit-gold: #b18b47;
    --submit-ivory: #faf6ec;
    --submit-white: #ffffff;
    --submit-hover: #d6e0ed;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: .75rem;
    min-width: 0;
    max-width: 60rem;
    margin: 0 auto;
    padding: .75rem;
    color: var(--submit-navy);
    font-family: var(--font-sans);
}

.calling-submit__header[b-ivzdymumoo] {
    padding: .9rem 1rem;
    border-bottom: 3px solid var(--submit-gold);
    border-radius: 8px;
    background: var(--submit-navy);
}

.calling-submit__title[b-ivzdymumoo] {
    margin: 0;
    color: var(--submit-white);
    font-size: 1.35rem;
    font-weight: 700;
    line-height: 1.25;
}

.calling-submit__panel[b-ivzdymumoo],
.calling-submit__card[b-ivzdymumoo] {
    display: grid;
    gap: .75rem;
    min-width: 0;
    margin: 0;
    padding: .75rem;
    border: 1px solid var(--submit-border);
    border-left: 4px solid var(--submit-navy);
    border-radius: 8px;
    background: var(--submit-surface);
}

.calling-submit__card-title[b-ivzdymumoo] {
    margin: 0;
    padding-bottom: .5rem;
    border-bottom: 1px solid var(--submit-border);
    color: var(--submit-navy);
    font-size: 1.05rem;
    font-weight: 700;
    line-height: 1.3;
}

.calling-submit__section[b-ivzdymumoo] {
    --section-accent: #7d8fa8;
    min-width: 0;
    margin: 0;
    padding: .75rem;
    border: 1px solid var(--submit-border);
    border-left: 4px solid var(--section-accent);
    border-radius: 6px;
    background: var(--submit-white);
}

.calling-submit__section--request[b-ivzdymumoo] {
    --section-accent: var(--submit-gold);
    background: var(--submit-ivory);
}

.calling-submit__section--called[b-ivzdymumoo] {
    --section-accent: var(--submit-navy);
    background: var(--submit-heading);
}

.calling-submit__section--release[b-ivzdymumoo] {
    --section-accent: var(--submit-gold);
    border-style: dashed;
    border-left-style: solid;
    background: #fbf7ee;
}

.calling-submit__section > legend[b-ivzdymumoo] {
    float: none;
    width: auto;
    margin: 0 0 .5rem;
    padding: 0;
    color: var(--submit-navy);
    font-size: .9rem;
    font-weight: 700;
    line-height: 1.4;
}

.calling-submit__section > legend > .bi[b-ivzdymumoo] {
    margin-right: .15rem;
    color: var(--section-accent);
}

.calling-submit__grid[b-ivzdymumoo] {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: .6rem .75rem;
}

.calling-submit__field[b-ivzdymumoo] {
    display: flex;
    flex-direction: column;
    gap: .25rem;
    min-width: 0;
}

.calling-submit__field > label[b-ivzdymumoo] {
    margin: 0;
    color: var(--submit-muted);
    font-size: .8rem;
    font-weight: 600;
    line-height: 1.35;
}

.calling-submit__required[b-ivzdymumoo] {
    color: var(--submit-danger);
}

.calling-submit[b-ivzdymumoo]  .calling-submit__input {
    display: block;
    width: 100%;
    min-width: 0;
    min-height: 44px;
    box-sizing: border-box;
    padding: .4rem .5rem;
    border: 1px solid var(--submit-border);
    border-radius: 5px;
    background-color: var(--submit-white);
    color: var(--submit-navy);
    font-family: inherit;
    font-size: 1rem;
    line-height: 1.4;
}

.calling-submit[b-ivzdymumoo]  select.calling-submit__input {
    padding-right: .25rem;
}

.calling-submit[b-ivzdymumoo]  textarea.calling-submit__input {
    min-height: 5rem;
    resize: vertical;
}

.calling-submit[b-ivzdymumoo]  .calling-submit__input::placeholder {
    color: var(--submit-muted);
    opacity: 1;
}

.calling-submit[b-ivzdymumoo]  .calling-submit__input.invalid {
    border-color: var(--submit-danger);
}

.calling-submit[b-ivzdymumoo]  .validation-message {
    color: var(--submit-danger);
    font-size: .8rem;
}

.calling-submit[b-ivzdymumoo]  .validation-errors {
    margin: 0;
    padding: .6rem .75rem .6rem 1.75rem;
    border: 1px solid var(--submit-danger);
    border-radius: 6px;
    background: var(--submit-white);
    color: var(--submit-danger);
    font-size: .9rem;
}

.calling-submit__alert[b-ivzdymumoo] {
    display: flex;
    align-items: flex-start;
    gap: .5rem;
    min-width: 0;
    padding: .6rem .75rem;
    border: 1px solid var(--submit-border);
    border-left: 4px solid var(--submit-navy);
    border-radius: 6px;
    background: var(--submit-heading);
    color: var(--submit-navy);
    font-size: .9rem;
    line-height: 1.45;
}

.calling-submit__alert--link[b-ivzdymumoo] {
    border-left-color: var(--submit-gold);
    background: var(--submit-ivory);
}

.calling-submit__alert > .bi[b-ivzdymumoo] {
    flex-shrink: 0;
    margin-top: .15rem;
}

.calling-submit__alert > div[b-ivzdymumoo] {
    display: grid;
    gap: .25rem;
    min-width: 0;
}

.calling-submit__alert a[b-ivzdymumoo] {
    color: var(--submit-navy);
    font-weight: 600;
    overflow-wrap: anywhere;
    text-underline-offset: 2px;
}

.calling-submit__actions[b-ivzdymumoo] {
    display: flex;
    justify-content: flex-end;
}

.calling-submit__button[b-ivzdymumoo] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .45rem;
    width: 100%;
    min-height: 44px;
    padding: .5rem 1rem;
    border: 1px solid var(--submit-border);
    border-radius: 5px;
    background: var(--submit-white);
    color: var(--submit-navy);
    font: inherit;
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.4;
    cursor: pointer;
}

.calling-submit__button--primary[b-ivzdymumoo] {
    border-color: var(--submit-navy);
    background: var(--submit-navy);
    color: var(--submit-white);
}

.calling-submit__button:disabled[b-ivzdymumoo] {
    cursor: not-allowed;
    opacity: .55;
}

.calling-submit__button:not(:disabled):hover[b-ivzdymumoo] {
    background: var(--submit-hover);
}

.calling-submit__button--primary:not(:disabled):hover[b-ivzdymumoo] {
    background: var(--submit-muted);
}

.calling-submit__button:not(:disabled):active[b-ivzdymumoo] {
    box-shadow: inset 0 0 0 2px var(--submit-border);
}

.calling-submit__button:focus-visible[b-ivzdymumoo],
.calling-submit[b-ivzdymumoo]  .calling-submit__input:focus-visible,
.calling-submit__alert a:focus-visible[b-ivzdymumoo] {
    outline: 2px solid var(--submit-focus);
    outline-offset: 2px;
}

@media (min-width: 48rem) {
    .calling-submit[b-ivzdymumoo] {
        padding: 1rem;
    }

    .calling-submit__grid--paired[b-ivzdymumoo],
    .calling-submit__grid--trio[b-ivzdymumoo] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .calling-submit__grid--trio[b-ivzdymumoo] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .calling-submit__button[b-ivzdymumoo] {
        width: auto;
        min-width: 12rem;
    }
}

@media (prefers-reduced-motion: no-preference) {
    .calling-submit__button[b-ivzdymumoo] {
        transition: background-color 120ms ease, box-shadow 120ms ease;
    }
}
/* /Components/Pages/Conference.razor.rz.scp.css */



















table[b-bzjpuge6ry] {
    width: 100%;
    border-collapse: collapse;
    color: black;
}

th[b-bzjpuge6ry], td[b-bzjpuge6ry] {
    border: 1px solid #666;
    padding: 5px;
}

th[b-bzjpuge6ry] {
    border: 1px solid #666;
}



.save-status[b-bzjpuge6ry] {
    margin-left: 15px;
    font-size: 0.9rem;
    font-weight: normal;
    vertical-align: middle;
}

.text-warning[b-bzjpuge6ry] {
    color: #ffc107;
}

.text-success[b-bzjpuge6ry] {
    color: #28a745;
}

.text-danger[b-bzjpuge6ry] {
    color: #dc3545;
}




.grid-container[b-bzjpuge6ry] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 100%));
    gap: 10px; /* Spacing between cards */
}

.card[b-bzjpuge6ry] {
    background-color: #fff;
    border: 2px solid #ddd;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
    padding: 10px;
}

.card-header[b-bzjpuge6ry] {
    display: flex;
    align-items: left;
    margin-bottom: 15px;
    padding: 0px;
}

    .card-header .name-section[b-bzjpuge6ry] {
        flex-grow: 1; /* Allows the name input to take up available space */
        display: flex;
        align-items: 15px;
    }

        .card-header .name-section i[b-bzjpuge6ry] {
            margin-right: 10px; /* Space between icon and input */
        }

        .card-header .name-section input[b-bzjpuge6ry] {
            flex-grow: 1; /* Allows input to fill the available space */
        }

    .card-header .ward-section[b-bzjpuge6ry] {
        margin-left: 10px; /* Space between name input and ward dropdown */
    }

.card-content[b-bzjpuge6ry], .card-actions[b-bzjpuge6ry] {
    margin-bottom: 10px;
}

.form-control[b-bzjpuge6ry], .status-dropdown[b-bzjpuge6ry], .textarea-notes[b-bzjpuge6ry] {
    width: 100%;
    box-sizing: border-box;
}

.textarea-notes[b-bzjpuge6ry] {
    resize: vertical; /* Allows vertical resizing */
}

.btn[b-bzjpuge6ry] {
    margin-right: 10px;
}

.add-item-card[b-bzjpuge6ry] {
    background-color: #f8f9fa; /* Light background color for distinction */
    border: 2px solid #007bff; /* Blue border for emphasis */
    color: #007bff; /* Blue text color */
    padding: 20px;
    margin-bottom: 20px;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}

    .add-item-card .card-header h2[b-bzjpuge6ry] {
        color: #007bff; /* Blue header color */
    }

    .add-item-card .btn-primary[b-bzjpuge6ry] {
        background-color: #007bff; /* Blue button background */
        border-color: #007bff; /* Blue button border */
    }

    .add-item-card .user-section[b-bzjpuge6ry] {
        display: flex;
        gap: 10px; /* Spacing between Created By and Assigned To fields */
    }

        .add-item-card .user-section input[b-bzjpuge6ry] {
            flex-grow: 1; /* Make inputs take equal space */
        }

    .add-item-card .textarea-notes[b-bzjpuge6ry] {
        width: 100%; /* Full width for the textarea */
        margin-top: 10px; /* Spacing above the textarea */
    }


.status-new[b-bzjpuge6ry] {
    border-color: blue;
    background-color: #B3D4E3;
}

.status-in-progress[b-bzjpuge6ry] {
    border-color: darkorange;
    background-color: #fa0; /*#B3D4E3;  Light blue */
}



.status-on-hold[b-bzjpuge6ry] {
    border-color: darkred;
    background-color: #f62; /* Light red */
}


.status-completed[b-bzjpuge6ry] {
    border-color: grey;
    background-color: #E3BFC4; /* Light green */
}

.user-section[b-bzjpuge6ry] {
    display: flex;
    justify-content: space-between;
    gap: 10px;
}

.user-field[b-bzjpuge6ry] {
    flex-basis: 48%; /* Adjust as necessary for your layout */
    display: flex;
    flex-direction: column;
}

.user-section[b-bzjpuge6ry] {
    display: flex;
    justify-content: space-between;
    gap: 10px;
}

.user-field[b-bzjpuge6ry] {
    flex-basis: 48%;
    display: flex;
    flex-direction: column;
}

.blue-border-input[b-bzjpuge6ry] {
    border: 2px solid #007bff; /* Blue border color */
    border-radius: 4px; /* Optional: to match the style of other elements */
}

.non-expanded-card[b-bzjpuge6ry] {
    display: inline-block;
    width: 100%;
    padding: 10px;
    padding-left: 20px;
    padding-bottom: 0; /* Remove bottom padding to avoid double padding */
    border-radius: 10px;
    margin-right: 10px; /* Add margin between cards */
    margin-bottom: 10px; /* Add margin between cards */
}

.expanded-card[b-bzjpuge6ry] {
    flex-grow: 1; /* Allow the expanded card to take up all available width */
    width: auto !important; /* Reset any width set for non-expanded state */
    padding: 10px;
    margin-bottom: 10px; /* Add margin between cards */
    border-radius: 10px;
}

label[b-bzjpuge6ry] {
    padding-top: 5px;
}

/* Media query for mobile devices */
@@media (max-width: 600px) {
    .user-section[b-bzjpuge6ry] {
        flex-direction: column;
    }

    .user-field[b-bzjpuge6ry] {
        flex-basis: 100%; /* Fields take full width */
        margin-bottom: 10px; /* Space between fields */
    }
}


.e-richtexteditor[b-bzjpuge6ry] {
    width: 100% !important; /* Ensure the editor takes full width */
    resize: vertical !important; /* Restrict resizing to vertical */
    min-height: 110px;
    max-height: 800px;
}




.chat-container[b-bzjpuge6ry] {
    width: 100% !important;
    max-width: 100%;
    background-color: #fff;
    border-radius: 10px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
    padding: 20px;
    overflow-y: auto;
    max-height: 80vh;
}

.message[b-bzjpuge6ry] {
    margin-bottom: 15px;
    display: flex;
    flex-direction: column;
}

    .message .sender[b-bzjpuge6ry] {
        font-size: 0.9em;
        font-weight: bold;
        margin-bottom: 5px;
        color: #555;
    }

    .message .bubble[b-bzjpuge6ry] {
        padding: 10px 15px;
        border-radius: 15px;
        max-width: 80%;
        word-wrap: break-word;
        font-size: 0.95em;
        line-height: 1.4;
    }

    /* Styles for the sender's message */
    .message.sent .bubble[b-bzjpuge6ry] {
        background-color: #d1f7c4;
        color: #333;
        align-self: flex-start;
        border-bottom-right-radius: 0;
    }

    /* Styles for the receiver's message */
    .message.received .bubble[b-bzjpuge6ry] {
        background-color: #f0f0f0;
        color: #333;
        align-self: flex-start;
        border-bottom-left-radius: 0;
    }


.form-check-input-lg[b-bzjpuge6ry] {
    width: 3em !important; /* Force the custom width */
    height: 1.5em !important; /* Adjust height for proportional scaling */
    border-radius: 2em !important; /* Rounded edges for a toggle look */
}

    .form-check-input-lg:checked[b-bzjpuge6ry] {
        background-color: #0d6efd !important; /* Custom color for the toggled state */
    }

/* /Components/Pages/ConferencePrint.razor.rz.scp.css */
@media print {
    .page-break[b-8ap0lcf6bv] {
        page-break-after: always;
        break-after: page;
    }
}

.appointment-table[b-8ap0lcf6bv] {
    width: 100%;
    border-collapse: collapse;
    margin: 10px 0;
    font-family: 'Arial', sans-serif;
    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
}

    .appointment-table thead th[b-8ap0lcf6bv] {
        background-color: #f8f9fa;
        border-bottom: 2px solid #dee2e6;
        padding: 8px 12px;
        text-align: left;
        font-size: 0.9em;
        text-transform: uppercase;
        letter-spacing: 0.5px;
    }

    .appointment-table tbody td[b-8ap0lcf6bv] {
        padding: 8px 12px;
        border-bottom: 1px solid #dee2e6;
        font-size: 0.9em;
        vertical-align: top;
    }

    .appointment-table tbody tr:last-child td[b-8ap0lcf6bv] {
        border-bottom: none;
    }

.duration-column[b-8ap0lcf6bv] {
    text-align: left;
    white-space: nowrap;
}

@@media print {
    .appointment-table[b-8ap0lcf6bv] {
        box-shadow: none;
        font-size: 10pt;
    }

        .appointment-table thead th[b-8ap0lcf6bv] {
            background-color: transparent !important;
        }

        .appointment-table td[b-8ap0lcf6bv],
        .appointment-table th[b-8ap0lcf6bv] {
            padding: 4px 6px;
        }
}


.save-status[b-8ap0lcf6bv] {
    margin-left: 15px;
    font-size: 0.9rem;
    font-weight: normal;
    vertical-align: middle;
}

.text-warning[b-8ap0lcf6bv] {
    color: #ffc107;
}

.text-success[b-8ap0lcf6bv] {
    color: #28a745;
}

.text-danger[b-8ap0lcf6bv] {
    color: #dc3545;
}




.grid-container[b-8ap0lcf6bv] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 100%));
    gap: 10px; /* Spacing between cards */
}

.card[b-8ap0lcf6bv] {
    background-color: #fff;
    border: 2px solid #ddd;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
    padding: 10px;
}

.card-header[b-8ap0lcf6bv] {
    display: flex;
    align-items: left;
    margin-bottom: 15px;
    padding: 0px;
}

    .card-header .name-section[b-8ap0lcf6bv] {
        flex-grow: 1; /* Allows the name input to take up available space */
        display: flex;
        align-items: 15px;
    }

        .card-header .name-section i[b-8ap0lcf6bv] {
            margin-right: 10px; /* Space between icon and input */
        }

        .card-header .name-section input[b-8ap0lcf6bv] {
            flex-grow: 1; /* Allows input to fill the available space */
        }

    .card-header .ward-section[b-8ap0lcf6bv] {
        margin-left: 10px; /* Space between name input and ward dropdown */
    }

.card-content[b-8ap0lcf6bv], .card-actions[b-8ap0lcf6bv] {
    margin-bottom: 10px;
}

.form-control[b-8ap0lcf6bv], .status-dropdown[b-8ap0lcf6bv], .textarea-notes[b-8ap0lcf6bv] {
    width: 100%;
    box-sizing: border-box;
}

.textarea-notes[b-8ap0lcf6bv] {
    resize: vertical; /* Allows vertical resizing */
}

.btn[b-8ap0lcf6bv] {
    margin-right: 10px;
}

.add-item-card[b-8ap0lcf6bv] {
    background-color: #f8f9fa; /* Light background color for distinction */
    border: 2px solid #007bff; /* Blue border for emphasis */
    color: #007bff; /* Blue text color */
    padding: 20px;
    margin-bottom: 20px;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}

    .add-item-card .card-header h2[b-8ap0lcf6bv] {
        color: #007bff; /* Blue header color */
    }

    .add-item-card .btn-primary[b-8ap0lcf6bv] {
        background-color: #007bff; /* Blue button background */
        border-color: #007bff; /* Blue button border */
    }

    .add-item-card .user-section[b-8ap0lcf6bv] {
        display: flex;
        gap: 10px; /* Spacing between Created By and Assigned To fields */
    }

        .add-item-card .user-section input[b-8ap0lcf6bv] {
            flex-grow: 1; /* Make inputs take equal space */
        }

    .add-item-card .textarea-notes[b-8ap0lcf6bv] {
        width: 100%; /* Full width for the textarea */
        margin-top: 10px; /* Spacing above the textarea */
    }


.status-new[b-8ap0lcf6bv] {
    border-color: blue;
    background-color: #B3D4E3;
}

.status-in-progress[b-8ap0lcf6bv] {
    border-color: darkorange;
    background-color: #fa0; /*#B3D4E3;  Light blue */
}



.status-on-hold[b-8ap0lcf6bv] {
    border-color: darkred;
    background-color: #f62; /* Light red */
}


.status-completed[b-8ap0lcf6bv] {
    border-color: grey;
    background-color: #E3BFC4; /* Light green */
}

.user-section[b-8ap0lcf6bv] {
    display: flex;
    justify-content: space-between;
    gap: 10px;
}

.user-field[b-8ap0lcf6bv] {
    flex-basis: 48%; /* Adjust as necessary for your layout */
    display: flex;
    flex-direction: column;
}

.user-section[b-8ap0lcf6bv] {
    display: flex;
    justify-content: space-between;
    gap: 10px;
}

.user-field[b-8ap0lcf6bv] {
    flex-basis: 48%;
    display: flex;
    flex-direction: column;
}

.blue-border-input[b-8ap0lcf6bv] {
    border: 2px solid #007bff; /* Blue border color */
    border-radius: 4px; /* Optional: to match the style of other elements */
}

.non-expanded-card[b-8ap0lcf6bv] {
    display: inline-block;
    width: 100%;
    padding: 10px;
    padding-left: 20px;
    padding-bottom: 0; /* Remove bottom padding to avoid double padding */
    border-radius: 10px;
    margin-right: 10px; /* Add margin between cards */
    margin-bottom: 10px; /* Add margin between cards */
}

.expanded-card[b-8ap0lcf6bv] {
    flex-grow: 1; /* Allow the expanded card to take up all available width */
    width: auto !important; /* Reset any width set for non-expanded state */
    padding: 10px;
    margin-bottom: 10px; /* Add margin between cards */
    border-radius: 10px;
}

label[b-8ap0lcf6bv] {
    padding-top: 5px;
}

/* Media query for mobile devices */
@@media (max-width: 600px) {
    .user-section[b-8ap0lcf6bv] {
        flex-direction: column;
    }

    .user-field[b-8ap0lcf6bv] {
        flex-basis: 100%; /* Fields take full width */
        margin-bottom: 10px; /* Space between fields */
    }
}


.e-richtexteditor[b-8ap0lcf6bv] {
    width: 100% !important; /* Ensure the editor takes full width */
    resize: vertical !important; /* Restrict resizing to vertical */
    min-height: 110px;
    max-height: 800px;
}




.chat-container[b-8ap0lcf6bv] {
    width: 100% !important;
    max-width: 100%;
    background-color: #fff;
    border-radius: 10px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
    padding: 20px;
    overflow-y: auto;
    max-height: 80vh;
}

.message[b-8ap0lcf6bv] {
    margin-bottom: 15px;
    display: flex;
    flex-direction: column;
}

    .message .sender[b-8ap0lcf6bv] {
        font-size: 0.9em;
        font-weight: bold;
        margin-bottom: 5px;
        color: #555;
    }

    .message .bubble[b-8ap0lcf6bv] {
        padding: 10px 15px;
        border-radius: 15px;
        max-width: 80%;
        word-wrap: break-word;
        font-size: 0.95em;
        line-height: 1.4;
    }

    /* Styles for the sender's message */
    .message.sent .bubble[b-8ap0lcf6bv] {
        background-color: #d1f7c4;
        color: #333;
        align-self: flex-start;
        border-bottom-right-radius: 0;
    }

    /* Styles for the receiver's message */
    .message.received .bubble[b-8ap0lcf6bv] {
        background-color: #f0f0f0;
        color: #333;
        align-self: flex-start;
        border-bottom-left-radius: 0;
    }


.form-check-input-lg[b-8ap0lcf6bv] {
    width: 3em !important; /* Force the custom width */
    height: 1.5em !important; /* Adjust height for proportional scaling */
    border-radius: 2em !important; /* Rounded edges for a toggle look */
}

    .form-check-input-lg:checked[b-8ap0lcf6bv] {
        background-color: #0d6efd !important; /* Custom color for the toggled state */
    }

/* /Components/Pages/Conference_old.razor.rz.scp.css */



















table[b-3uicbybd63] {
    width: 100%;
    border-collapse: collapse;
    color: black;
}

th[b-3uicbybd63], td[b-3uicbybd63] {
    border: 1px solid #666;
    padding: 5px;
}

th[b-3uicbybd63] {
    border: 1px solid #666;
}



.save-status[b-3uicbybd63] {
    margin-left: 15px;
    font-size: 0.9rem;
    font-weight: normal;
    vertical-align: middle;
}

.text-warning[b-3uicbybd63] {
    color: #ffc107;
}

.text-success[b-3uicbybd63] {
    color: #28a745;
}

.text-danger[b-3uicbybd63] {
    color: #dc3545;
}




.grid-container[b-3uicbybd63] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 100%));
    gap: 10px; /* Spacing between cards */
}

.card[b-3uicbybd63] {
    background-color: #fff;
    border: 2px solid #ddd;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
    padding: 10px;
}

.card-header[b-3uicbybd63] {
    display: flex;
    align-items: left;
    margin-bottom: 15px;
    padding: 0px;
}

    .card-header .name-section[b-3uicbybd63] {
        flex-grow: 1; /* Allows the name input to take up available space */
        display: flex;
        align-items: 15px;
    }

        .card-header .name-section i[b-3uicbybd63] {
            margin-right: 10px; /* Space between icon and input */
        }

        .card-header .name-section input[b-3uicbybd63] {
            flex-grow: 1; /* Allows input to fill the available space */
        }

    .card-header .ward-section[b-3uicbybd63] {
        margin-left: 10px; /* Space between name input and ward dropdown */
    }

.card-content[b-3uicbybd63], .card-actions[b-3uicbybd63] {
    margin-bottom: 10px;
}

.form-control[b-3uicbybd63], .status-dropdown[b-3uicbybd63], .textarea-notes[b-3uicbybd63] {
    width: 100%;
    box-sizing: border-box;
}

.textarea-notes[b-3uicbybd63] {
    resize: vertical; /* Allows vertical resizing */
}

.btn[b-3uicbybd63] {
    margin-right: 10px;
}

.add-item-card[b-3uicbybd63] {
    background-color: #f8f9fa; /* Light background color for distinction */
    border: 2px solid #007bff; /* Blue border for emphasis */
    color: #007bff; /* Blue text color */
    padding: 20px;
    margin-bottom: 20px;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}

    .add-item-card .card-header h2[b-3uicbybd63] {
        color: #007bff; /* Blue header color */
    }

    .add-item-card .btn-primary[b-3uicbybd63] {
        background-color: #007bff; /* Blue button background */
        border-color: #007bff; /* Blue button border */
    }

    .add-item-card .user-section[b-3uicbybd63] {
        display: flex;
        gap: 10px; /* Spacing between Created By and Assigned To fields */
    }

        .add-item-card .user-section input[b-3uicbybd63] {
            flex-grow: 1; /* Make inputs take equal space */
        }

    .add-item-card .textarea-notes[b-3uicbybd63] {
        width: 100%; /* Full width for the textarea */
        margin-top: 10px; /* Spacing above the textarea */
    }


.status-new[b-3uicbybd63] {
    border-color: blue;
    background-color: #B3D4E3;
}

.status-in-progress[b-3uicbybd63] {
    border-color: darkorange;
    background-color: #fa0; /*#B3D4E3;  Light blue */
}



.status-on-hold[b-3uicbybd63] {
    border-color: darkred;
    background-color: #f62; /* Light red */
}


.status-completed[b-3uicbybd63] {
    border-color: grey;
    background-color: #E3BFC4; /* Light green */
}

.user-section[b-3uicbybd63] {
    display: flex;
    justify-content: space-between;
    gap: 10px;
}

.user-field[b-3uicbybd63] {
    flex-basis: 48%; /* Adjust as necessary for your layout */
    display: flex;
    flex-direction: column;
}

.user-section[b-3uicbybd63] {
    display: flex;
    justify-content: space-between;
    gap: 10px;
}

.user-field[b-3uicbybd63] {
    flex-basis: 48%;
    display: flex;
    flex-direction: column;
}

.blue-border-input[b-3uicbybd63] {
    border: 2px solid #007bff; /* Blue border color */
    border-radius: 4px; /* Optional: to match the style of other elements */
}

.non-expanded-card[b-3uicbybd63] {
    display: inline-block;
    width: 100%;
    padding: 10px;
    padding-left: 20px;
    padding-bottom: 0; /* Remove bottom padding to avoid double padding */
    border-radius: 10px;
    margin-right: 10px; /* Add margin between cards */
    margin-bottom: 10px; /* Add margin between cards */
}

.expanded-card[b-3uicbybd63] {
    flex-grow: 1; /* Allow the expanded card to take up all available width */
    width: auto !important; /* Reset any width set for non-expanded state */
    padding: 10px;
    margin-bottom: 10px; /* Add margin between cards */
    border-radius: 10px;
}

label[b-3uicbybd63] {
    padding-top: 5px;
}

/* Media query for mobile devices */
@@media (max-width: 600px) {
    .user-section[b-3uicbybd63] {
        flex-direction: column;
    }

    .user-field[b-3uicbybd63] {
        flex-basis: 100%; /* Fields take full width */
        margin-bottom: 10px; /* Space between fields */
    }
}


.e-richtexteditor[b-3uicbybd63] {
    width: 100% !important; /* Ensure the editor takes full width */
    resize: vertical !important; /* Restrict resizing to vertical */
    min-height: 110px;
    max-height: 800px;
}




.chat-container[b-3uicbybd63] {
    width: 100% !important;
    max-width: 100%;
    background-color: #fff;
    border-radius: 10px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
    padding: 20px;
    overflow-y: auto;
    max-height: 80vh;
}

.message[b-3uicbybd63] {
    margin-bottom: 15px;
    display: flex;
    flex-direction: column;
}

    .message .sender[b-3uicbybd63] {
        font-size: 0.9em;
        font-weight: bold;
        margin-bottom: 5px;
        color: #555;
    }

    .message .bubble[b-3uicbybd63] {
        padding: 10px 15px;
        border-radius: 15px;
        max-width: 80%;
        word-wrap: break-word;
        font-size: 0.95em;
        line-height: 1.4;
    }

    /* Styles for the sender's message */
    .message.sent .bubble[b-3uicbybd63] {
        background-color: #d1f7c4;
        color: #333;
        align-self: flex-start;
        border-bottom-right-radius: 0;
    }

    /* Styles for the receiver's message */
    .message.received .bubble[b-3uicbybd63] {
        background-color: #f0f0f0;
        color: #333;
        align-self: flex-start;
        border-bottom-left-radius: 0;
    }


.form-check-input-lg[b-3uicbybd63] {
    width: 3em !important; /* Force the custom width */
    height: 1.5em !important; /* Adjust height for proportional scaling */
    border-radius: 2em !important; /* Rounded edges for a toggle look */
}

    .form-check-input-lg:checked[b-3uicbybd63] {
        background-color: #0d6efd !important; /* Custom color for the toggled state */
    }

/* /Components/Pages/HighCounselors.razor.rz.scp.css */
:global(:root)[b-7hz92jox96]{
  /* expose variables globally so CSS isolation doesn't scope them away */
  --page-bg:#f5f7fb; /* light neutral to separate cards from page */
  --card-bg:#ffffff;
  --card-border:#cbd5e1;
  --card-shadow:0 8px 24px rgba(15,23,42,.06);
  --card-shadow-hover:0 16px 32px rgba(15,23,42,.10);
  --text:#0f172a;
  --muted:#64748b;
  --primary:#2563eb;
  --primary-500:#3b82f6;
  --accent:#06b6d4;
  --chip-saved:#059669;
  --chip-saving:#d97706;
  --chip-unsaved:#dc2626;
  --chip-error:#b91c1c;
}

.hc-page[b-7hz92jox96]{ background: #f3f6fb; min-height: 100%; }
.page-toolbar[b-7hz92jox96]{ display:flex; justify-content:flex-end; gap:.5rem; padding: 16px 24px 0; }

/* Page title banner */
.page-title-banner[b-7hz92jox96]{
  margin: 0;
  padding: 24px 24px 8px;
  background: linear-gradient(135deg,#eef2ff,#e0f2fe); /* indigo 50 to sky 50 */
  border-bottom: 1px solid #cbd5e1;
}
.page-title-banner h1[b-7hz92jox96]{
  margin:0;
  font-size:1.4rem;
  font-weight:800;
  color:#0f172a;
}

/* Layout */
.grid-container[b-7hz92jox96]{
  display:grid;
  grid-template-columns: repeat(auto-fill, minmax(340px,1fr));
  gap:1.25rem;
  padding: 20px 24px 32px;
  max-width: 1400px;
  margin: 0 auto;
}

/* Card */
.ward-card[b-7hz92jox96]{
  position:relative;
  /* soft surface gradient to distinguish card body */
  background: linear-gradient(180deg, #ffffff 0%, #fbfdff 100%);
  border:2px solid #c7ced9; /* thicker and darker */
  border-radius:14px;
  /* add an outer ring + larger soft shadow so it remains visible when scaled */
  box-shadow:
      0 1px 2px rgba(2,6,23,.08),
      0 10px 24px rgba(2,6,23,.12),
      0 0 0 1px rgba(2,6,23,.06);
}
.ward-card[b-7hz92jox96]::before{
  content:"";
  position:absolute;
  inset:0 auto auto 0;
  height:4px;
  width:100%;
  background:linear-gradient(90deg,var(--primary-500, #3b82f6),var(--accent, #06b6d4));
}
.ward-card:hover[b-7hz92jox96]{
  transform: translateY(-2px);
  box-shadow:
      0 2px 4px rgba(2,6,23,.10),
      0 16px 32px rgba(2,6,23,.16),
      0 0 0 1px rgba(2,6,23,.08);
}
.ward-card:focus-within[b-7hz92jox96]{ border-color: var(--primary-500, #3b82f6); box-shadow: 0 0 0 3px rgba(59,130,246,.15), var(--card-shadow-hover, 0 16px 32px rgba(15,23,42,.10)); }

.card-header[b-7hz92jox96]{
  display:flex; align-items:center; justify-content:space-between;
  padding: .9rem 1.1rem .7rem;
  /* Give the title/header a pleasant gradient background */
  background: linear-gradient(90deg, #f8fafc 0%, #eef2ff 50%, #e0f2fe 100%);
  border-bottom:1px solid var(--card-border, #cbd5e1);
}
.hc-ident[b-7hz92jox96]{ display:flex; align-items:center; gap:.8rem; min-width:0; }
.avatar[b-7hz92jox96]{
  width:36px; height:36px; border-radius:999px; flex:0 0 auto;
  background:linear-gradient(135deg,#a78bfa,#60a5fa); color:#fff;
  display:grid; place-items:center; font-weight:700; font-size:.9rem;
}
.titles[b-7hz92jox96]{ display:flex; flex-direction:column; min-width:0; }
.titles .name[b-7hz92jox96]{ font-weight:700; color:var(--text, #0f172a); font-size:1.05rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.titles .sub[b-7hz92jox96]{ font-size:.8rem; color:var(--muted, #64748b); }
.ward-badge[b-7hz92jox96]{ background:#eef2ff; color:#3730a3; border:1px solid #c7d2fe; padding:.15rem .5rem; border-radius:999px; }

.card-content[b-7hz92jox96]{
  padding: 1rem 1.1rem 1.1rem;
  /* soft panel background for the inputs area only */
  background: linear-gradient(180deg, #f7fafe 0%, #eef4ff 100%);
  border-top: 1px solid var(--card-border, #cbd5e1);
}

/* Highlight the actual fields area (inside each card) */
.card-content[b-7hz92jox96]{
  /* soft panel background for the inputs area only */
  background: linear-gradient(180deg, #f7fafe 0%, #eef4ff 100%);
  border-top: 1px solid var(--card-border, #cbd5e1);
}

/* Keep inputs white so they contrast against the panel background */
.card-content input[type="text"][b-7hz92jox96],
.card-content input[type="email"][b-7hz92jox96],
.card-content textarea[b-7hz92jox96],
.card-content select[b-7hz92jox96]{
  background:#ffffff;
}

/* Form */
.form-row[b-7hz92jox96]{ display:grid; grid-template-columns: 1fr 1fr; gap:1rem; margin-bottom:1rem; }
.form-row > .form-group:only-child[b-7hz92jox96]{ grid-column: 1 / -1; }
.form-group[b-7hz92jox96]{ display:flex; flex-direction:column; gap:.4rem; }
.form-group label[b-7hz92jox96]{ font-size:.86rem; color:var(--muted, #64748b); }

input[type="text"][b-7hz92jox96], input[type="email"][b-7hz92jox96], textarea[b-7hz92jox96], select[b-7hz92jox96]{
  width:100%; box-sizing:border-box; background:#fff;
  border:1.2px solid #d1d5db; border-radius:10px; padding:.62rem .72rem;
  font-size:.95rem; color:var(--text, #0f172a); outline:none;
  transition:border-color .15s ease, box-shadow .15s ease, background-color .15s ease;
}
textarea[b-7hz92jox96]{ resize: vertical; min-height: 96px; }
input:focus[b-7hz92jox96], textarea:focus[b-7hz92jox96], select:focus[b-7hz92jox96]{ border-color:var(--primary-500, #3b82f6); box-shadow:0 0 0 3px rgba(59,130,246,.15); }

/* Status chip */
.status-chip[b-7hz92jox96]{ display:inline-flex; align-items:center; gap:.4rem; padding:.3rem .6rem; border-radius:999px; font-size:.78rem; font-weight:600; color:#fff; background:#64748b; }
.status-chip[data-status="Saved"][b-7hz92jox96], .status-chip[data-status="saved"][b-7hz92jox96]{ background: var(--chip-saved, #059669); }
.status-chip[data-status="Saving..."][b-7hz92jox96], .status-chip[data-status="Saving"][b-7hz92jox96], .status-chip[data-status="saving"][b-7hz92jox96]{ background: var(--chip-saving, #d97706); }
.status-chip[data-status*="Unsaved" i][b-7hz92jox96]{ background: var(--chip-unsaved, #dc2626); }
.status-chip[data-status^="Error" i][b-7hz92jox96]{ background: var(--chip-error, #b91c1c); }

/* Responsive */
@media (max-width: 720px){ .form-row[b-7hz92jox96]{ grid-template-columns:1fr; } }
/* /Components/Pages/HighCounselorsPrint.razor.rz.scp.css */
.print-grid[b-4vkxw1tr7w] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1rem;
    margin: 1rem;
}

.print-card[b-4vkxw1tr7w] {
    /* prevent cards breaking across pages */
    break-inside: avoid;
    page-break-inside: avoid;
    padding: 0.5rem;
    border: 1px solid black;
    border-radius: 10px       
}

    .print-card .hc-name[b-4vkxw1tr7w] {
        font-size: 1.1rem;
        font-weight: bold;
        margin-bottom: 0.3rem;
    }

    .print-card .ward-name[b-4vkxw1tr7w] {
        font-style: italic;
        margin-bottom: 0.5rem;
    }

    .print-card .assignments[b-4vkxw1tr7w] {
        list-style: none;
        padding: 0; /*5px 5px 5px 10px;*/
        margin: 0;
        /*border: 1px solid black;
        border-radius: 10px*/
    }

        .print-card .assignments li[b-4vkxw1tr7w] {
            margin: 0.2rem 0;
        }
/* /Components/Pages/Home.razor.rz.scp.css */
/* Home Page Styles - Scoped to Home component */

.home-page[b-dou4ml6hzu] {
    min-height: 100vh;
    background: var(--bg-page);
    font-family: var(--font-sans);
    padding: 32px 20px;
}

.home-container[b-dou4ml6hzu] {
    max-width: 1200px;
    margin: 0 auto;
}

.page-header[b-dou4ml6hzu] {
    margin-bottom: 32px;
}

.page-title[b-dou4ml6hzu] {
    font-family: var(--font-serif);
    font-size: 36px;
    font-weight: 600;
    color: var(--text-primary);
    margin: 0 0 8px 0;
    letter-spacing: -0.02em;
}

.page-subtitle[b-dou4ml6hzu] {
    font-size: 16px;
    font-weight: 400;
    color: var(--text-secondary);
    margin: 0 0 24px 0;
    line-height: 1.5;
}

.theme-section[b-dou4ml6hzu] {
    margin-bottom: 32px;
}

.section-header[b-dou4ml6hzu] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
}

.section-title[b-dou4ml6hzu] {
    font-family: var(--font-serif);
    font-size: 24px;
    font-weight: 600;
    color: var(--text-primary);
    margin: 0;
    letter-spacing: -0.01em;
}

.section-description[b-dou4ml6hzu] {
    font-size: 14px;
    color: var(--text-secondary);
    margin: 0 0 20px 0;
    line-height: 1.6;
}

.info-card[b-dou4ml6hzu] {
    position: relative;
    background: linear-gradient(135deg, rgba(219, 234, 254, 0.8) 0%, rgba(191, 219, 254, 0.9) 100%);
    backdrop-filter: blur(10px);
    border-left: 5px solid var(--info);
    padding: 20px 24px;
    margin-bottom: 32px;
    border-radius: 16px;
    font-size: 15px;
    color: #1e40af;
    line-height: 1.7;
    box-shadow: 0 4px 16px rgba(59, 130, 246, 0.1), 0 2px 8px rgba(59, 130, 246, 0.05);
    animation: fadeIn-b-dou4ml6hzu 0.6s ease-out 0.3s backwards;
    border: 1px solid rgba(59, 130, 246, 0.2);
}

.info-card[b-dou4ml6hzu]::before {
    content: '💡';
    position: absolute;
    top: 20px;
    right: 24px;
    font-size: 24px;
    opacity: 0.5;
}

.info-card strong[b-dou4ml6hzu] {
    font-weight: 700;
    color: #1e3a8a;
}

.updates-card[b-dou4ml6hzu] {
    background: var(--bg-card);
    border: 1px solid var(--border-light);
    border-left: 4px solid var(--primary-blue);
    border-radius: 8px;
    padding: 20px 24px;
    margin-bottom: 32px;
    box-shadow: var(--shadow-sm);
}

.updates-title[b-dou4ml6hzu] {
    font-family: var(--font-serif);
    font-size: 20px;
    font-weight: 600;
    color: var(--text-primary);
    margin: 0 0 12px 0;
}

.updates-list[b-dou4ml6hzu] {
    margin: 0 0 16px 0;
    padding-left: 20px;
    font-size: 15px;
    color: var(--text-secondary);
    line-height: 1.7;
}

.updates-contact[b-dou4ml6hzu] {
    font-size: 15px;
    color: var(--text-secondary);
    line-height: 1.7;
    margin: 0;
}

.updates-contact a[b-dou4ml6hzu] {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    color: var(--primary-blue);
    font-weight: 600;
    text-decoration: none;
}

.updates-contact a:hover[b-dou4ml6hzu] {
    color: var(--primary-blue-dark);
    text-decoration: underline;
}

.updates-signoff[b-dou4ml6hzu] {
    font-size: 15px;
    font-weight: 600;
    color: var(--text-primary);
    margin: 8px 0 0 0;
}

.filter-card[b-dou4ml6hzu] {
    background: var(--bg-card);
    border: 1px solid var(--border-light);
    border-radius: 12px;
    padding: 20px;
    margin-bottom: 24px;
    box-shadow: var(--shadow-sm);
}

.filter-label[b-dou4ml6hzu] {
    font-size: 13px;
    font-weight: 600;
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 8px;
    display: block;
}

.filter-select[b-dou4ml6hzu] {
    width: 100%;
    max-width: 320px;
    padding: 10px 14px;
    font-size: 14px;
    color: var(--text-primary);
    background: var(--bg-card);
    border: 1.5px solid var(--border-medium);
    border-radius: 8px;
    transition: all 0.2s ease;
    font-family: var(--font-sans);
}

.filter-select:focus[b-dou4ml6hzu] {
    outline: none;
    border-color: var(--primary-blue);
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

.actions-list[b-dou4ml6hzu] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.action-card[b-dou4ml6hzu] {
    background: var(--bg-card);
    border: 1px solid var(--border-light);
    border-radius: 12px;
    padding: 20px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: flex-start;
    gap: 16px;
    transition: all 0.2s ease;
}

.action-card:hover[b-dou4ml6hzu] {
    box-shadow: var(--shadow-md);
    transform: translateY(-2px);
}

.action-content[b-dou4ml6hzu] {
    flex: 1;
    min-width: 0;
}

.action-actions[b-dou4ml6hzu] {
    flex-shrink: 0;
}

.btn-open-agenda[b-dou4ml6hzu] {
    padding: 10px 20px;
    background: linear-gradient(135deg, #60a5fa 0%, #3b82f6 100%);
    color: white;
    border: none;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(59, 130, 246, 0.3);
    white-space: nowrap;
}

.btn-open-agenda:hover[b-dou4ml6hzu] {
    background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%);
    box-shadow: 0 4px 12px rgba(59, 130, 246, 0.4);
    transform: translateY(-1px);
}

.btn-open-agenda:active[b-dou4ml6hzu] {
    transform: translateY(0);
}

.btn-install[b-dou4ml6hzu] {
    padding: 12px 24px;
    background: linear-gradient(135deg, #64748b 0%, #475569 100%);
    color: white;
    border: none;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(71, 85, 105, 0.3);
    margin-top: 24px;
}

.btn-install:hover[b-dou4ml6hzu] {
    background: linear-gradient(135deg, #475569 0%, #334155 100%);
    box-shadow: 0 4px 12px rgba(71, 85, 105, 0.4);
    transform: translateY(-1px);
}

.empty-state[b-dou4ml6hzu] {
    background: var(--bg-card);
    border: 2px dashed var(--border-medium);
    border-radius: 12px;
    padding: 48px 32px;
    text-align: center;
}

.empty-state-icon[b-dou4ml6hzu] {
    font-size: 48px;
    color: var(--text-muted);
    margin-bottom: 16px;
}

.empty-state-title[b-dou4ml6hzu] {
    font-family: var(--font-serif);
    font-size: 20px;
    font-weight: 600;
    color: var(--text-primary);
    margin: 0 0 8px 0;
}

.empty-state-text[b-dou4ml6hzu] {
    font-size: 14px;
    color: var(--text-secondary);
    margin: 0;
}

.welcome-card[b-dou4ml6hzu] {
    background: var(--bg-card);
    border: 1px solid var(--border-light);
    border-radius: 12px;
    padding: 32px;
    margin-bottom: 32px;
    box-shadow: var(--shadow-sm);
}

.welcome-title[b-dou4ml6hzu] {
    font-family: var(--font-serif);
    font-size: 20px;
    font-weight: 600;
    color: var(--text-primary);
    margin: 0 0 16px 0;
}

.welcome-text[b-dou4ml6hzu] {
    font-size: 15px;
    color: var(--text-secondary);
    line-height: 1.8;
    margin: 0 0 12px 0;
}

.welcome-text strong[b-dou4ml6hzu] {
    color: var(--text-primary);
    font-weight: 600;
}

.welcome-text a[b-dou4ml6hzu] {
    color: var(--primary-blue);
    text-decoration: none;
    font-weight: 600;
    transition: color 0.2s ease;
}

.welcome-text a:hover[b-dou4ml6hzu] {
    color: var(--primary-blue-dark);
    text-decoration: underline;
}

/* Hide delete button inside ActionItem */
.home-action-item[b-dou4ml6hzu]  .btn.btn-danger { 
    display: none !important; 
}

.home-action-item[b-dou4ml6hzu] {
    pointer-events: none;
    user-select: none;
    width: 100%;
    display: block;
}

/* Ensure ActionItem content stretches full width */
.home-action-item > *[b-dou4ml6hzu] {
    width: 100%;
}

/* Force the action-card inside home-action-item to stretch */
.home-action-item[b-dou4ml6hzu]  .action-card {
    width: 100% !important;
}

/* Animations */
@keyframes fadeIn-b-dou4ml6hzu {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes fadeInDown-b-dou4ml6hzu {
    from {
        opacity: 0;
        transform: translateY(-30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes bounce-b-dou4ml6hzu {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-10px);
    }
}

/* Responsive Design */
@media (max-width: 768px) {
    .home-page[b-dou4ml6hzu] {
        padding: 24px 16px;
    }

    .home-page[b-dou4ml6hzu]::before {
        height: 300px;
    }

    .page-header[b-dou4ml6hzu] {
        margin-bottom: 32px;
    }

    .page-title[b-dou4ml6hzu] {
        font-size: 36px;
    }

    .page-subtitle[b-dou4ml6hzu] {
        font-size: 16px;
    }

    .section-title[b-dou4ml6hzu] {
        font-size: 24px;
    }

    .action-card[b-dou4ml6hzu] {
        flex-direction: column;
        gap: 16px;
        padding: 20px;
    }

    .btn-open-agenda[b-dou4ml6hzu] {
        width: 100%;
        padding: 14px 24px;
    }

    .filter-select[b-dou4ml6hzu] {
        max-width: 100%;
    }

    .welcome-card[b-dou4ml6hzu] {
        padding: 28px 24px;
    }

    .welcome-title[b-dou4ml6hzu] {
        font-size: 24px;
    }

    .empty-state[b-dou4ml6hzu] {
        padding: 48px 24px;
    }

    .empty-state-icon[b-dou4ml6hzu] {
        font-size: 56px;
    }
}

@media (max-width: 480px) {
    .page-title[b-dou4ml6hzu] {
        font-size: 28px;
    }

    .section-title[b-dou4ml6hzu] {
        font-size: 20px;
    }

    .filter-card[b-dou4ml6hzu],
    .info-card[b-dou4ml6hzu],
    .updates-card[b-dou4ml6hzu] {
        padding: 16px 20px;
    }

    .action-card[b-dou4ml6hzu] {
        padding: 16px;
    }
}
/* /Components/Pages/Theme.razor.rz.scp.css */
.decorative-border[b-umdhisqmss] {
    font-family: 'Times New Roman', Times, serif;
    color: var(--text-color, orange);
    padding: 12px 24px;
    border: 2px solid var(--border-color, coral);
    border-radius: 12px;
    background-color: var(--background-color, white);
    box-shadow: var(--box-shadow, 0 4px 6px rgba(0, 0, 0, 0.1));
    display: inline-block;
    max-width: 100%;
    text-align: center;
    position: relative;
    overflow: hidden;
    text-shadow: 2px 2px 4px var(--text-shadow-color); /* Added Text Shadow */
    font-weight: 600; /* Optional: Bolder text */
    letter-spacing: 0.5px; /* Optional: Letter spacing */
}

    .decorative-border[b-umdhisqmss]::after {
        content: '';
        position: absolute;
        top: -4px;
        left: -4px;
        right: -4px;
        bottom: -4px;
        z-index: -1;
        border-radius: 16px;
        background: linear-gradient(135deg, var(--border-color, coral), lightcoral, pink);
        filter: blur(4px);
        opacity: 0.6;
    }
/* /Components/Pages/Wards.razor.rz.scp.css */
body[b-cun6znmigq] {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    background-color: #f8f9fa;
    margin: 0;
    padding: 0;
}

.grid-container[b-cun6znmigq] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 20px;
    padding: 20px;
    max-width: 1200px;
    margin: 0 auto;
}

.ward-card[b-cun6znmigq] {
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 8px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    overflow: hidden;
    transition: transform 0.2s ease-in-out;
}

    .ward-card:hover[b-cun6znmigq] {
        transform: translateY(-5px);
        box-shadow: 0 6px 10px rgba(0, 0, 0, 0.15);
    }

.card-header[b-cun6znmigq] {
    background: linear-gradient(135deg, #6c63ff, #00c4cc);
    color: #fff;
    padding: 16px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

    .card-header h2[b-cun6znmigq] {
        margin: 0;
        font-size: 1.5rem;
    }

.save-status .status[b-cun6znmigq] {
    padding: 4px 8px;
    border-radius: 16px;
    font-size: 0.875rem;
}

    .save-status .status.saved[b-cun6znmigq] {
        background-color: #28a745;
        color: #fff;
    }

    .save-status .status.modified[b-cun6znmigq] {
        background-color: #ffc107;
        color: #000;
    }

.card-content[b-cun6znmigq] {
    padding: 16px;
}

.form-row[b-cun6znmigq] {
    display: flex;
    gap: 16px;
    margin-bottom: 12px;
}

.form-group[b-cun6znmigq] {
    flex: 1;
}

    .form-group label[b-cun6znmigq] {
        display: block;
        margin-bottom: 8px;
        font-weight: bold;
    }

    .form-group input[b-cun6znmigq] {
        width: 100%;
        padding: 10px;
        border: 1px solid #ccc;
        border-radius: 4px;
        font-size: 1rem;
    }

        .form-group input:focus[b-cun6znmigq] {
            border-color: #6c63ff;
            outline: none;
            box-shadow: 0 0 4px rgba(108, 99, 255, 0.5);
        }
/* /Components/Pages/WardsCard.razor.rz.scp.css */
